@cube-dev/ui-kit 0.190.6 → 0.190.8

package/dist/components/fields/Switch/Switch.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.190.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.190.8 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useId as useId$2 } from "../../../utils/react/useId.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
@@ -33,96 +33,93 @@ const SwitchWrapperElement = tasty({
 		color: "#dark-02"
 	}
 });
-const SwitchElement = tasty({
-	qa: "Switch",
-	styles: {
-		boxSizing: "border-box",
-		position: "relative",
-		verticalAlign: "baseline",
-		placeSelf: "center",
-		radius: "round",
-		fill: {
-			"": "#surface",
-			checked: "#primary",
-			"invalid & checked": "#danger",
-			"valid & checked": "#success",
-			disabled: "#border.5",
-			"disabled & checked": "#border"
-		},
-		color: {
-			"": "#dark-03",
-			checked: "#white"
-		},
-		border: {
-			"": "#dark-05",
-			checked: "#primary-text",
-			disabled: "#dark-05.5",
-			invalid: "#danger",
-			valid: "#success"
-		},
+const SwitchElement = tasty({ styles: {
+	boxSizing: "border-box",
+	position: "relative",
+	verticalAlign: "baseline",
+	placeSelf: "center",
+	radius: "round",
+	fill: {
+		"": "#surface",
+		checked: "#primary",
+		"invalid & checked": "#danger",
+		"valid & checked": "#success",
+		disabled: "#border.5",
+		"disabled & checked": "#border"
+	},
+	color: {
+		"": "#dark-03",
+		checked: "#white"
+	},
+	border: {
+		"": "#dark-05",
+		checked: "#primary-text",
+		disabled: "#dark-05.5",
+		invalid: "#danger",
+		valid: "#success"
+	},
+	width: {
+		"": "5x 5x",
+		"size=medium": "4x 4x",
+		"size=small": "3x 3x"
+	},
+	height: {
+		"": "3x 3x",
+		"size=medium": "2.5x 2.5x",
+		"size=small": "2x 2x"
+	},
+	outline: {
+		"": "#primary-text.0",
+		focused: "1bw #primary-text"
+	},
+	outlineOffset: 1,
+	transition: "theme",
+	cursor: "$pointer",
+	Thumb: {
+		position: "absolute",
 		width: {
-			"": "5x 5x",
-			"size=medium": "4x 4x",
-			"size=small": "3x 3x"
+			"": "2x 2x",
+			"size=medium": "1.5x 1.5x",
+			"size=small": "1.25x 1.25x"
 		},
 		height: {
-			"": "3x 3x",
-			"size=medium": "2.5x 2.5x",
-			"size=small": "2x 2x"
+			"": "2x 2x",
+			"size=medium": "1.5x 1.5x",
+			"size=small": "1.25x 1.25x"
 		},
-		outline: {
-			"": "#primary-text.0",
-			focused: "1bw #primary-text"
+		radius: "round",
+		fill: {
+			"": "#current",
+			disabled: "#current.5",
+			"disabled & checked": "#white.8"
 		},
-		outlineOffset: 1,
-		transition: "theme",
-		cursor: "$pointer",
-		Thumb: {
-			position: "absolute",
-			width: {
-				"": "2x 2x",
-				"size=medium": "1.5x 1.5x",
-				"size=small": "1.25x 1.25x"
-			},
-			height: {
-				"": "2x 2x",
-				"size=medium": "1.5x 1.5x",
-				"size=small": "1.25x 1.25x"
-			},
-			radius: "round",
-			fill: {
-				"": "#current",
-				disabled: "#current.5",
-				"disabled & checked": "#white.8"
-			},
-			top: {
-				"": ".375x",
-				"size=medium": ".375x",
-				"size=small": ".25x"
-			},
-			left: {
-				"": ".375x",
-				"size=medium": ".375x",
-				"size=small": ".25x",
-				checked: "2.25x",
-				"checked & size=medium": "1.75x",
-				"checked & size=small": "1.25x"
-			},
-			transition: "left, theme",
-			cursor: "$pointer"
-		}
+		top: {
+			"": ".375x",
+			"size=medium": ".375x",
+			"size=small": ".25x"
+		},
+		left: {
+			"": ".375x",
+			"size=medium": ".375x",
+			"size=small": ".25x",
+			checked: "2.25x",
+			"checked & size=medium": "1.75x",
+			"checked & size=small": "1.25x"
+		},
+		transition: "left, theme",
+		cursor: "$pointer"
 	}
-});
+} });
 const PROP_STYLES = [...OUTER_STYLES, ...BLOCK_STYLES];
-function Switch(props, ref) {
+function Switch(rawProps, ref) {
 	const $ = c(52);
 	let t0;
-	if ($[0] !== props) {
-		t0 = castNullableIsSelected(props);
-		$[0] = props;
+	if ($[0] !== rawProps) {
+		t0 = castNullableIsSelected(rawProps);
+		$[0] = rawProps;
 		$[1] = t0;
 	} else t0 = $[1];
-	props = t0;
+	rawProps = t0;
 	let t1;
 	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
 		t1 = {
@@ -131,7 +128,7 @@ function Switch(props, ref) {
 		};
 		$[2] = t1;
 	} else t1 = $[2];
-	props = useFieldProps(props, t1);
+	const props = useFieldProps(rawProps, t1);
 	const { qa, isDisabled: t2, children, label, insideForm, isLoading, labelPosition, inputStyles, isInvalid, isValid, size: t3 } = props;
 	const isDisabled = t2 === void 0 ? false : t2;
 	const size = t3 === void 0 ? "medium" : t3;
@@ -229,6 +226,7 @@ function Switch(props, ref) {
 	let t15;
 	if ($[28] !== inputStyles || $[29] !== mods || $[30] !== size) {
 		t15 = /* @__PURE__ */ jsx(SwitchElement, {
+			"data-element": "Input",
 			mods,
 			"data-size": size,
 			styles: inputStyles,

package/dist/components/fields/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","names":["useFocusableRef","BaseProps","BLOCK_STYLES","BlockStyleProps","OUTER_STYLES","OuterStyleProps","Styles","tasty","forwardRef","useRef","AriaSwitchProps","useHover","useSwitch","useToggleState","LoadingIcon","FieldBaseProps","ToggleSelectionProps","mergeProps","useFocus","castNullableIsSelected","WithNullableSelected","useId","extractStyles","Text","getValidationMods","useFieldProps","wrapWithField","HiddenInput","SwitchWrapperElement","as","styles","display","position","placeItems","gap","width","color","SwitchElement","qa","boxSizing","verticalAlign","placeSelf","radius","fill","checked","disabled","border","invalid","valid","height","outline","focused","outlineOffset","transition","cursor","Thumb","top","left","PROP_STYLES","CubeSwitchProps","form","name","inputStyles","isLoading","size","Switch","props","ref","$","_c","t0","t1","Symbol","for","defaultValidationTrigger","valuePropsMapper","_temp","isDisabled","t2","children","label","insideForm","labelPosition","isInvalid","isValid","t3","undefined","id","t4","isFocused","focusProps","t5","hoverProps","isHovered","inputRef","domRef","t6","inputProps","t7","t8","t9","t10","hovered","mods","t11","t12","t13","t14","t15","t16","t17","t18","switchField","t19","labelProps","value","onChange","isSelected","isIndeterminate","_Switch","cubeInputType","displayName"],"sources":["../../../../src/components/fields/Switch/Switch.tsx"],"sourcesContent":["import { useFocusableRef } from '@react-spectrum/utils';\nimport {\n  BaseProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useRef } from 'react';\nimport { AriaSwitchProps, useHover, useSwitch } from 'react-aria';\nimport { useToggleState } from 'react-stately';\n\nimport { LoadingIcon } from '../../../icons/LoadingIcon';\nimport { FieldBaseProps, ToggleSelectionProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport {\n  castNullableIsSelected,\n  WithNullableSelected,\n} from '../../../utils/react/nullableValue';\nimport { useId } from '../../../utils/react/useId';\nimport { extractStyles } from '../../../utils/styles';\nimport { Text } from '../../content/Text';\nimport { getValidationMods, useFieldProps, wrapWithField } from '../../form';\nimport { HiddenInput } from '../../HiddenInput';\n\nconst SwitchWrapperElement = tasty({\n  as: 'label',\n  styles: {\n    display: 'flex',\n    position: 'relative',\n    placeItems: {\n      '': 'center stretch',\n      'side-label': 'baseline stretch',\n    },\n    gap: '1x',\n    width: 'max max-content',\n    color: '#dark-02',\n  },\n});\n\nconst SwitchElement = tasty({\n  qa: 'Switch',\n  styles: {\n    boxSizing: 'border-box',\n    position: 'relative',\n    verticalAlign: 'baseline',\n    placeSelf: 'center',\n    radius: 'round',\n    fill: {\n      '': '#surface',\n      checked: '#primary',\n      'invalid & checked': '#danger',\n      'valid & checked': '#success',\n      disabled: '#border.5',\n      'disabled & checked': '#border',\n    },\n    color: {\n      '': '#dark-03',\n      checked: '#white',\n    },\n    border: {\n      '': '#dark-05',\n      checked: '#primary-text',\n      disabled: '#dark-05.5',\n      invalid: '#danger',\n      valid: '#success',\n    },\n    width: {\n      '': '5x 5x',\n      'size=medium': '4x 4x',\n      'size=small': '3x 3x',\n    },\n    height: {\n      '': '3x 3x',\n      'size=medium': '2.5x 2.5x',\n      'size=small': '2x 2x',\n    },\n    outline: {\n      '': '#primary-text.0',\n      focused: '1bw #primary-text',\n    },\n    outlineOffset: 1,\n    transition: 'theme',\n    cursor: '$pointer',\n\n    Thumb: {\n      position: 'absolute',\n      width: {\n        '': '2x 2x',\n        'size=medium': '1.5x 1.5x',\n        'size=small': '1.25x 1.25x',\n      },\n      height: {\n        '': '2x 2x',\n        'size=medium': '1.5x 1.5x',\n        'size=small': '1.25x 1.25x',\n      },\n      radius: 'round',\n      fill: {\n        '': '#current',\n        disabled: '#current.5',\n        'disabled & checked': '#white.8',\n      },\n      top: {\n        '': '.375x',\n        'size=medium': '.375x',\n        'size=small': '.25x',\n      },\n      left: {\n        '': '.375x',\n        'size=medium': '.375x',\n        'size=small': '.25x',\n        checked: '2.25x',\n        'checked & size=medium': '1.75x',\n        'checked & size=small': '1.25x',\n      },\n      transition: 'left, theme',\n      cursor: '$pointer',\n    },\n  },\n});\n\nconst PROP_STYLES = [...OUTER_STYLES, ...BLOCK_STYLES];\n\nexport interface CubeSwitchProps\n  extends BaseProps,\n    OuterStyleProps,\n    BlockStyleProps,\n    FieldBaseProps<boolean | null | undefined>,\n    ToggleSelectionProps,\n    AriaSwitchProps {\n  /** The form instance; redeclared for the same reason as in `Checkbox`. */\n  form?: FieldBaseProps['form'];\n  /** Field name; modern forms also accept nested tuple paths. */\n  name?: FieldBaseProps['name'];\n  inputStyles?: Styles;\n  isLoading?: boolean;\n  size?: 'large' | 'medium' | 'small';\n}\n\nfunction Switch(props: WithNullableSelected<CubeSwitchProps>, ref) {\n  props = castNullableIsSelected(props);\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onChange',\n    valuePropsMapper: ({ value, onChange }) => ({\n      isSelected: value != null ? value : false,\n      isIndeterminate: false,\n      onChange: onChange,\n    }),\n  });\n\n  let {\n    qa,\n    isDisabled = false,\n    children,\n    label,\n    insideForm,\n    isLoading,\n    labelPosition,\n    inputStyles,\n    isInvalid,\n    isValid,\n    size = 'medium',\n    form,\n  } = props;\n\n  const id = useId(props.id);\n\n  let styles = extractStyles(props, PROP_STYLES);\n\n  let { isFocused, focusProps } = useFocus(true);\n  let { hoverProps, isHovered } = useHover({ isDisabled });\n\n  let inputRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n\n  // React Aria writes `form` onto the input as the id of its `<form>`, so the\n  // form instance would render as `form=\"[object Object]\"` and detach it.\n  let { inputProps } = useSwitch(\n    { ...props, form: undefined },\n    useToggleState(props),\n    inputRef,\n  );\n\n  const mods = {\n    checked: inputProps.checked,\n    disabled: isDisabled,\n    hovered: isHovered,\n    focused: isFocused,\n    ...getValidationMods({ isInvalid, isValid }),\n    'inside-form': insideForm,\n    'side-label': labelPosition === 'side',\n  };\n\n  const switchField = (\n    <SwitchWrapperElement\n      qa=\"SwitchWrapper\"\n      mods={mods}\n      data-size={size}\n      styles={styles}\n      {...hoverProps}\n    >\n      <HiddenInput\n        qa={qa || 'Switch'}\n        data-input-type=\"switch\"\n        {...mergeProps(inputProps, focusProps)}\n        ref={inputRef}\n        id={id}\n      />\n      <SwitchElement mods={mods} data-size={size} styles={inputStyles}>\n        <div data-element=\"Thumb\" aria-hidden=\"true\" />\n      </SwitchElement>\n      {children ? <Text nowrap>{children}</Text> : null}\n      {isLoading ? (\n        <>\n          {label ? <>&nbsp;</> : null}\n          <LoadingIcon />\n        </>\n      ) : null}\n    </SwitchWrapperElement>\n  );\n\n  return wrapWithField(switchField, domRef, {\n    ...props,\n    id,\n    labelProps: {\n      ...props.labelProps,\n      for: id,\n    },\n    children: null,\n    inputStyles,\n  });\n}\n\n/**\n * Switches allow users to turn an individual option on or off.\n * They are usually used to activate or deactivate a specific setting.\n */\nlet _Switch = forwardRef(Switch);\n\n(_Switch as any).cubeInputType = 'Checkbox';\n_Switch.displayName = 'Switch';\n\nexport { _Switch as Switch };\nexport type { AriaSwitchProps };\nexport { useSwitch };\n"],"mappings":"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"}
+{"version":3,"file":"Switch.js","names":["useFocusableRef","BaseProps","BLOCK_STYLES","BlockStyleProps","OUTER_STYLES","OuterStyleProps","Styles","tasty","forwardRef","useRef","AriaSwitchProps","useHover","useSwitch","useToggleState","LoadingIcon","FieldBaseProps","ToggleSelectionProps","mergeProps","useFocus","castNullableIsSelected","WithNullableSelected","useId","extractStyles","Text","getValidationMods","useFieldProps","wrapWithField","HiddenInput","SwitchWrapperElement","as","styles","display","position","placeItems","gap","width","color","SwitchElement","boxSizing","verticalAlign","placeSelf","radius","fill","checked","disabled","border","invalid","valid","height","outline","focused","outlineOffset","transition","cursor","Thumb","top","left","PROP_STYLES","CubeSwitchProps","Omit","inputStyles","isLoading","size","Switch","rawProps","ref","$","_c","t0","t1","Symbol","for","defaultValidationTrigger","valuePropsMapper","_temp","props","qa","isDisabled","t2","children","label","insideForm","labelPosition","isInvalid","isValid","t3","undefined","id","t4","isFocused","focusProps","t5","hoverProps","isHovered","inputRef","domRef","t6","form","inputProps","t7","t8","t9","t10","hovered","mods","t11","t12","t13","t14","t15","t16","t17","t18","switchField","t19","labelProps","value","onChange","isSelected","isIndeterminate","_Switch","cubeInputType","displayName"],"sources":["../../../../src/components/fields/Switch/Switch.tsx"],"sourcesContent":["import { useFocusableRef } from '@react-spectrum/utils';\nimport {\n  BaseProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useRef } from 'react';\nimport { AriaSwitchProps, useHover, useSwitch } from 'react-aria';\nimport { useToggleState } from 'react-stately';\n\nimport { LoadingIcon } from '../../../icons/LoadingIcon';\nimport { FieldBaseProps, ToggleSelectionProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport {\n  castNullableIsSelected,\n  WithNullableSelected,\n} from '../../../utils/react/nullableValue';\nimport { useId } from '../../../utils/react/useId';\nimport { extractStyles } from '../../../utils/styles';\nimport { Text } from '../../content/Text';\nimport { getValidationMods, useFieldProps, wrapWithField } from '../../form';\nimport { HiddenInput } from '../../HiddenInput';\n\nconst SwitchWrapperElement = tasty({\n  as: 'label',\n  styles: {\n    display: 'flex',\n    position: 'relative',\n    placeItems: {\n      '': 'center stretch',\n      'side-label': 'baseline stretch',\n    },\n    gap: '1x',\n    width: 'max max-content',\n    color: '#dark-02',\n  },\n});\n\nconst SwitchElement = tasty({\n  styles: {\n    boxSizing: 'border-box',\n    position: 'relative',\n    verticalAlign: 'baseline',\n    placeSelf: 'center',\n    radius: 'round',\n    fill: {\n      '': '#surface',\n      checked: '#primary',\n      'invalid & checked': '#danger',\n      'valid & checked': '#success',\n      disabled: '#border.5',\n      'disabled & checked': '#border',\n    },\n    color: {\n      '': '#dark-03',\n      checked: '#white',\n    },\n    border: {\n      '': '#dark-05',\n      checked: '#primary-text',\n      disabled: '#dark-05.5',\n      invalid: '#danger',\n      valid: '#success',\n    },\n    width: {\n      '': '5x 5x',\n      'size=medium': '4x 4x',\n      'size=small': '3x 3x',\n    },\n    height: {\n      '': '3x 3x',\n      'size=medium': '2.5x 2.5x',\n      'size=small': '2x 2x',\n    },\n    outline: {\n      '': '#primary-text.0',\n      focused: '1bw #primary-text',\n    },\n    outlineOffset: 1,\n    transition: 'theme',\n    cursor: '$pointer',\n\n    Thumb: {\n      position: 'absolute',\n      width: {\n        '': '2x 2x',\n        'size=medium': '1.5x 1.5x',\n        'size=small': '1.25x 1.25x',\n      },\n      height: {\n        '': '2x 2x',\n        'size=medium': '1.5x 1.5x',\n        'size=small': '1.25x 1.25x',\n      },\n      radius: 'round',\n      fill: {\n        '': '#current',\n        disabled: '#current.5',\n        'disabled & checked': '#white.8',\n      },\n      top: {\n        '': '.375x',\n        'size=medium': '.375x',\n        'size=small': '.25x',\n      },\n      left: {\n        '': '.375x',\n        'size=medium': '.375x',\n        'size=small': '.25x',\n        checked: '2.25x',\n        'checked & size=medium': '1.75x',\n        'checked & size=small': '1.25x',\n      },\n      transition: 'left, theme',\n      cursor: '$pointer',\n    },\n  },\n});\n\nconst PROP_STYLES = [...OUTER_STYLES, ...BLOCK_STYLES];\n\nexport interface CubeSwitchProps\n  extends BaseProps,\n    OuterStyleProps,\n    BlockStyleProps,\n    FieldBaseProps<boolean | null | undefined>,\n    ToggleSelectionProps,\n    Omit<AriaSwitchProps, 'form' | 'name'> {\n  inputStyles?: Styles;\n  isLoading?: boolean;\n  size?: 'large' | 'medium' | 'small';\n}\n\nfunction Switch(rawProps: WithNullableSelected<CubeSwitchProps>, ref) {\n  rawProps = castNullableIsSelected(rawProps);\n  let props = useFieldProps(rawProps, {\n    defaultValidationTrigger: 'onChange',\n    valuePropsMapper: ({ value, onChange }) => ({\n      isSelected: value != null ? value : false,\n      isIndeterminate: false,\n      onChange: onChange,\n    }),\n  });\n\n  let {\n    qa,\n    isDisabled = false,\n    children,\n    label,\n    insideForm,\n    isLoading,\n    labelPosition,\n    inputStyles,\n    isInvalid,\n    isValid,\n    size = 'medium',\n    form,\n  } = props;\n\n  const id = useId(props.id);\n\n  let styles = extractStyles(props, PROP_STYLES);\n\n  let { isFocused, focusProps } = useFocus(true);\n  let { hoverProps, isHovered } = useHover({ isDisabled });\n\n  let inputRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n\n  // React Aria writes `form` onto the input as the id of its `<form>`, so the\n  // form instance would render as `form=\"[object Object]\"` and detach it.\n  let { inputProps } = useSwitch(\n    { ...props, form: undefined },\n    useToggleState(props),\n    inputRef,\n  );\n\n  const mods = {\n    checked: inputProps.checked,\n    disabled: isDisabled,\n    hovered: isHovered,\n    focused: isFocused,\n    ...getValidationMods({ isInvalid, isValid }),\n    'inside-form': insideForm,\n    'side-label': labelPosition === 'side',\n  };\n\n  const switchField = (\n    <SwitchWrapperElement\n      qa=\"SwitchWrapper\"\n      mods={mods}\n      data-size={size}\n      styles={styles}\n      {...hoverProps}\n    >\n      <HiddenInput\n        qa={qa || 'Switch'}\n        data-input-type=\"switch\"\n        {...mergeProps(inputProps, focusProps)}\n        ref={inputRef}\n        id={id}\n      />\n      <SwitchElement\n        data-element=\"Input\"\n        mods={mods}\n        data-size={size}\n        styles={inputStyles}\n      >\n        <div data-element=\"Thumb\" aria-hidden=\"true\" />\n      </SwitchElement>\n      {children ? <Text nowrap>{children}</Text> : null}\n      {isLoading ? (\n        <>\n          {label ? <>&nbsp;</> : null}\n          <LoadingIcon />\n        </>\n      ) : null}\n    </SwitchWrapperElement>\n  );\n\n  return wrapWithField(switchField, domRef, {\n    ...props,\n    id,\n    labelProps: {\n      ...props.labelProps,\n      for: id,\n    },\n    children: null,\n    inputStyles,\n  });\n}\n\n/**\n * Switches allow users to turn an individual option on or off.\n * They are usually used to activate or deactivate a specific setting.\n */\nlet _Switch = forwardRef(Switch);\n\n(_Switch as any).cubeInputType = 'Checkbox';\n_Switch.displayName = 'Switch';\n\nexport { _Switch as Switch };\nexport type { AriaSwitchProps };\nexport { useSwitch };\n"],"mappings":"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"}

package/dist/components/fields/TagInput/TagInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.190.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.190.8 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
@@ -1339,7 +1339,7 @@ function TagInput(props, ref) {
 		autoComplete,
 		"data-input-type": "taginput",
 		"aria-describedby": describedBy.join(" ") || void 0
-	}, hasOptions ? getComboboxProps(listBoxId, shouldShowPopover, activeOptionKey) : null);
+	}, hasOptions ? getComboboxProps(listBoxId, shouldShowPopover, activeOptionKey) : void 0);
 	let t42;
 	if ($[218] !== hasResults || $[219] !== inputRef || $[220] !== setIsFilterActive || $[221] !== setIsPopoverOpen || $[222] !== shouldShowPopover) {
 		t42 = () => {