@mantine/core/cjs/components/Combobox/ComboboxTarget/ComboboxTarget.cjs.map

React components library focused on usability, accessibility and developer experience

{"version":3,"file":"ComboboxTarget.cjs","names":["factory","useProps","getSingleElementChild","useComboboxContext","useComboboxTargetProps","Popover"],"sources":["../../../../src/components/Combobox/ComboboxTarget/ComboboxTarget.tsx"],"sourcesContent":["import { cloneElement } from 'react';\nimport { useMergedRef } from '@mantine/hooks';\nimport { factory, Factory, getSingleElementChild, useProps } from '../../../core';\nimport { Popover } from '../../Popover';\nimport { useComboboxContext } from '../Combobox.context';\nimport { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props';\n\nexport interface ComboboxTargetProps {\n  /** Target element */\n  children: React.ReactNode;\n\n  /** Key of the prop that is used to access element ref */\n  refProp?: string;\n\n  /** If set, the component responds to keyboard events @default true */\n  withKeyboardNavigation?: boolean;\n\n  /** If set, the target has `aria-` attributes @default true */\n  withAriaAttributes?: boolean;\n\n  /** If set, the target has `aria-expanded` attribute @default false */\n  withExpandedAttribute?: boolean;\n\n  /** Determines which events is handled by the target element.\n   * `button` target type handles `Space` and `Enter` keys to toggle dropdown opened state.\n   * @default input\n   * */\n  targetType?: 'button' | 'input';\n\n  /** Input autocomplete attribute */\n  autoComplete?: string;\n}\n\nconst defaultProps = {\n  refProp: 'ref',\n  targetType: 'input',\n  withKeyboardNavigation: true,\n  withAriaAttributes: true,\n  withExpandedAttribute: false,\n  autoComplete: 'off',\n} satisfies Partial<ComboboxTargetProps>;\n\nexport type ComboboxTargetFactory = Factory<{\n  props: ComboboxTargetProps;\n  ref: HTMLElement;\n  compound: true;\n}>;\n\nexport const ComboboxTarget = factory<ComboboxTargetFactory>((props) => {\n  const {\n    children,\n    refProp,\n    withKeyboardNavigation,\n    withAriaAttributes,\n    withExpandedAttribute,\n    targetType,\n    autoComplete,\n    ref,\n    ...others\n  } = useProps('ComboboxTarget', defaultProps, props);\n\n  const child = getSingleElementChild(children);\n  if (!child) {\n    throw new Error(\n      'Combobox.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported'\n    );\n  }\n\n  const ctx = useComboboxContext();\n\n  const targetProps = useComboboxTargetProps({\n    targetType,\n    withAriaAttributes,\n    withKeyboardNavigation,\n    withExpandedAttribute,\n    onKeyDown: (child.props as any).onKeyDown,\n    autoComplete,\n  });\n\n  const clonedElement = cloneElement(child, {\n    ...targetProps,\n    ...others,\n  });\n\n  return (\n    <Popover.Target ref={useMergedRef(ref, ctx.store.targetRef)}>{clonedElement}</Popover.Target>\n  );\n});\n\nComboboxTarget.displayName = '@mantine/core/ComboboxTarget';\n"],"mappings":";;;;;;;;;;;;AAiCA,MAAM,eAAe;CACnB,SAAS;CACT,YAAY;CACZ,wBAAwB;CACxB,oBAAoB;CACpB,uBAAuB;CACvB,cAAc;CACf;AAQD,MAAa,iBAAiBA,gBAAAA,SAAgC,UAAU;CACtE,MAAM,EACJ,UACA,SACA,wBACA,oBACA,uBACA,YACA,cACA,KACA,GAAG,WACDC,kBAAAA,SAAS,kBAAkB,cAAc,MAAM;CAEnD,MAAM,QAAQC,iCAAAA,sBAAsB,SAAS;AAC7C,KAAI,CAAC,MACH,OAAM,IAAI,MACR,oKACD;CAGH,MAAM,MAAMC,yBAAAA,oBAAoB;CAWhC,MAAM,iBAAA,GAAA,MAAA,cAA6B,OAAO;EACxC,GAVkBC,kCAAAA,uBAAuB;GACzC;GACA;GACA;GACA;GACA,WAAY,MAAM,MAAc;GAChC;GACD,CAAC;EAIA,GAAG;EACJ,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,QAAQ,QAAT;EAAgB,MAAA,GAAA,eAAA,cAAkB,KAAK,IAAI,MAAM,UAAU;YAAG;EAA+B,CAAA;EAE/F;AAEF,eAAe,cAAc"}