@yamada-ui/autocomplete 1.6.5-next-20241123050941 → 1.6.6-dev-20241123052407

Sign up to get free protection for your applications and to get access to all the features.
Files changed (79) hide show
  1. package/dist/autocomplete-context.d.mts +0 -1
  2. package/dist/autocomplete-context.d.ts +0 -1
  3. package/dist/autocomplete-context.js.map +1 -1
  4. package/dist/autocomplete-context.mjs +1 -1
  5. package/dist/autocomplete-create.js.map +1 -1
  6. package/dist/autocomplete-create.mjs +4 -4
  7. package/dist/autocomplete-empty.js.map +1 -1
  8. package/dist/autocomplete-empty.mjs +4 -4
  9. package/dist/autocomplete-icon.js.map +1 -1
  10. package/dist/autocomplete-icon.mjs +2 -2
  11. package/dist/autocomplete-list.js +22 -15
  12. package/dist/autocomplete-list.js.map +1 -1
  13. package/dist/autocomplete-list.mjs +3 -3
  14. package/dist/autocomplete-option-group.js.map +1 -1
  15. package/dist/autocomplete-option-group.mjs +3 -3
  16. package/dist/autocomplete-option.js +10 -6
  17. package/dist/autocomplete-option.js.map +1 -1
  18. package/dist/autocomplete-option.mjs +4 -4
  19. package/dist/autocomplete.js +78 -84
  20. package/dist/autocomplete.js.map +1 -1
  21. package/dist/autocomplete.mjs +12 -12
  22. package/dist/{chunk-JYPMXZG4.mjs → chunk-2CVB4NO5.mjs} +7 -7
  23. package/dist/{chunk-3A2HEULI.mjs → chunk-2LP57WVB.mjs} +12 -8
  24. package/dist/chunk-2LP57WVB.mjs.map +1 -0
  25. package/dist/{chunk-PTPJFYGI.mjs → chunk-4GVV3HBE.mjs} +29 -13
  26. package/dist/chunk-4GVV3HBE.mjs.map +1 -0
  27. package/dist/{chunk-6OTUOEYS.mjs → chunk-7QCZ5NGS.mjs} +2 -2
  28. package/dist/{chunk-PU6HFINM.mjs → chunk-ABCTEZN5.mjs} +3 -3
  29. package/dist/{chunk-NOSATNDY.mjs → chunk-IFH3PPSD.mjs} +10 -8
  30. package/dist/chunk-IFH3PPSD.mjs.map +1 -0
  31. package/dist/{chunk-REPBXBG3.mjs → chunk-LIBFONYN.mjs} +7 -10
  32. package/dist/chunk-LIBFONYN.mjs.map +1 -0
  33. package/dist/{chunk-2UKLSSUA.mjs → chunk-PWV7X7G6.mjs} +4 -4
  34. package/dist/{chunk-G6SC44LI.mjs → chunk-RK5E5J5E.mjs} +4 -4
  35. package/dist/{chunk-ZNO5RUVT.mjs → chunk-TP5VZFO3.mjs} +1 -1
  36. package/dist/chunk-TP5VZFO3.mjs.map +1 -0
  37. package/dist/{chunk-CMFJUJJW.mjs → chunk-UX5QECNB.mjs} +2 -2
  38. package/dist/{chunk-6II6KCIJ.mjs → chunk-YPKDYYEV.mjs} +4 -4
  39. package/dist/{chunk-75VF5Q5W.mjs → chunk-ZR77IT3O.mjs} +51 -69
  40. package/dist/chunk-ZR77IT3O.mjs.map +1 -0
  41. package/dist/index.js +81 -85
  42. package/dist/index.js.map +1 -1
  43. package/dist/index.mjs +13 -13
  44. package/dist/multi-autocomplete.d.mts +8 -0
  45. package/dist/multi-autocomplete.d.ts +8 -0
  46. package/dist/multi-autocomplete.js +81 -85
  47. package/dist/multi-autocomplete.js.map +1 -1
  48. package/dist/multi-autocomplete.mjs +12 -12
  49. package/dist/use-autocomplete-list.d.mts +2 -1
  50. package/dist/use-autocomplete-list.d.ts +2 -1
  51. package/dist/use-autocomplete-list.js +19 -9
  52. package/dist/use-autocomplete-list.js.map +1 -1
  53. package/dist/use-autocomplete-list.mjs +2 -2
  54. package/dist/use-autocomplete-option-group.js.map +1 -1
  55. package/dist/use-autocomplete-option-group.mjs +2 -2
  56. package/dist/use-autocomplete-option.d.mts +16 -0
  57. package/dist/use-autocomplete-option.d.ts +16 -0
  58. package/dist/use-autocomplete-option.js +10 -6
  59. package/dist/use-autocomplete-option.js.map +1 -1
  60. package/dist/use-autocomplete-option.mjs +2 -2
  61. package/dist/use-autocomplete.d.mts +3 -5
  62. package/dist/use-autocomplete.d.ts +3 -5
  63. package/dist/use-autocomplete.js +56 -69
  64. package/dist/use-autocomplete.js.map +1 -1
  65. package/dist/use-autocomplete.mjs +7 -7
  66. package/package.json +7 -7
  67. package/dist/chunk-3A2HEULI.mjs.map +0 -1
  68. package/dist/chunk-75VF5Q5W.mjs.map +0 -1
  69. package/dist/chunk-NOSATNDY.mjs.map +0 -1
  70. package/dist/chunk-PTPJFYGI.mjs.map +0 -1
  71. package/dist/chunk-REPBXBG3.mjs.map +0 -1
  72. package/dist/chunk-ZNO5RUVT.mjs.map +0 -1
  73. /package/dist/{chunk-JYPMXZG4.mjs.map → chunk-2CVB4NO5.mjs.map} +0 -0
  74. /package/dist/{chunk-6OTUOEYS.mjs.map → chunk-7QCZ5NGS.mjs.map} +0 -0
  75. /package/dist/{chunk-PU6HFINM.mjs.map → chunk-ABCTEZN5.mjs.map} +0 -0
  76. /package/dist/{chunk-2UKLSSUA.mjs.map → chunk-PWV7X7G6.mjs.map} +0 -0
  77. /package/dist/{chunk-G6SC44LI.mjs.map → chunk-RK5E5J5E.mjs.map} +0 -0
  78. /package/dist/{chunk-CMFJUJJW.mjs.map → chunk-UX5QECNB.mjs.map} +0 -0
  79. /package/dist/{chunk-6II6KCIJ.mjs.map → chunk-YPKDYYEV.mjs.map} +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/multi-autocomplete.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport type { PortalProps } from \"@yamada-ui/portal\"\nimport type {\n CSSProperties,\n FC,\n MouseEventHandler,\n ReactElement,\n ReactNode,\n} from \"react\"\nimport type { AutocompleteCreateProps } from \"./autocomplete-create\"\nimport type { AutocompleteEmptyProps } from \"./autocomplete-empty\"\nimport type { AutocompleteIconProps } from \"./autocomplete-icon\"\nimport type { AutocompleteListProps } from \"./autocomplete-list\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Popover, PopoverTrigger } from \"@yamada-ui/popover\"\nimport { Portal } from \"@yamada-ui/portal\"\nimport { cx, handlerAll, runIfFunc } from \"@yamada-ui/utils\"\nimport { cloneElement, useMemo } from \"react\"\nimport {\n AutocompleteDescendantsContextProvider,\n AutocompleteProvider,\n useAutocompleteContext,\n} from \"./autocomplete-context\"\nimport { AutocompleteCreate } from \"./autocomplete-create\"\nimport { AutocompleteEmpty } from \"./autocomplete-empty\"\nimport { AutocompleteClearIcon, AutocompleteIcon } from \"./autocomplete-icon\"\nimport { AutocompleteList } from \"./autocomplete-list\"\nimport { useAutocomplete, useAutocompleteInput } from \"./use-autocomplete\"\n\ninterface MultiAutocompleteOptions {\n /**\n * If `true`, the list element will be closed when value is selected.\n *\n * @default false\n */\n closeOnSelect?: boolean\n /**\n * The custom display value to use.\n */\n component?: FC<{\n index: number\n label: string\n value: number | string\n onRemove: MouseEventHandler<HTMLElement>\n }>\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: string\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: string\n /**\n * The footer of the autocomplete content element.\n */\n footer?: FC<{ value: string[] | undefined; onClose: () => void }> | ReactNode\n /**\n * The header of the autocomplete content element.\n */\n header?: FC<{ value: string[] | undefined; onClose: () => void }> | ReactNode\n /**\n * If `true`, display the select clear icon.\n *\n * @default true\n */\n isClearable?: boolean\n /**\n * If `true`, keep the placeholder.\n *\n * @default false\n */\n keepPlaceholder?: boolean\n /**\n * The visual separator between each value.\n *\n * @default ','\n */\n separator?: string\n /**\n * Props for multi autocomplete clear icon element.\n */\n clearIconProps?: AutocompleteIconProps\n /**\n * Props for multi autocomplete container element.\n */\n containerProps?: Omit<HTMLUIProps, \"children\">\n /**\n * Props for multi autocomplete content element.\n */\n contentProps?: Omit<MotionProps, \"children\">\n /**\n * Props for autocomplete create element.\n */\n createProps?: Omit<AutocompleteCreateProps, \"children\">\n /**\n * Props for autocomplete empty element.\n */\n emptyProps?: Omit<AutocompleteEmptyProps, \"children\">\n /**\n * Props for multi autocomplete field element.\n */\n fieldProps?: Omit<\n MultiAutocompleteFieldProps,\n \"children\" | \"component\" | \"inputProps\" | \"keepPlaceholder\" | \"separator\"\n >\n /**\n * Props for multi autocomplete icon element.\n */\n iconProps?: AutocompleteIconProps\n /**\n * Props for multi autocomplete input element.\n */\n inputProps?: HTMLUIProps<\"input\">\n /**\n * Props for multi autocomplete list element.\n */\n listProps?: Omit<AutocompleteListProps, \"children\">\n /**\n * Props to be forwarded to the portal component.\n *\n * @default '{ isDisabled: true }'\n *\n */\n portalProps?: Omit<PortalProps, \"children\">\n}\n\nexport interface MultiAutocompleteProps\n extends ThemeProps<\"MultiAutocomplete\">,\n Omit<UseAutocompleteProps<string[]>, \"closeOnSelect\">,\n MultiAutocompleteOptions {}\n\n/**\n * `MultiAutocomplete` is a component used to display suggestions based on user text input and to obtain multiple values.\n *\n * @see Docs https://yamada-ui.com/components/forms/multi-autocomplete\n */\nexport const MultiAutocomplete = forwardRef<MultiAutocompleteProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\n \"MultiAutocomplete\",\n props,\n )\n let {\n className,\n closeOnSelect = false,\n color,\n component,\n defaultValue = [],\n footer,\n h,\n header,\n height,\n isClearable = true,\n keepPlaceholder = false,\n minH,\n minHeight,\n separator,\n clearIconProps,\n containerProps,\n contentProps,\n createProps,\n emptyProps,\n fieldProps,\n iconProps,\n inputProps,\n listProps,\n portalProps = { isDisabled: true },\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const {\n allowCreate,\n children,\n descendants,\n inputValue,\n isEmpty,\n value,\n formControlProps,\n getContainerProps,\n getFieldProps,\n getPopoverProps,\n onClear,\n onClose,\n ...rest\n } = useAutocomplete<string[]>({\n ...computedProps,\n closeOnSelect,\n defaultValue,\n })\n\n h ??= height\n minH ??= minHeight\n\n const css: CSSUIObject = {\n color,\n h: \"fit-content\",\n w: \"100%\",\n ...styles.container,\n }\n\n return (\n <AutocompleteDescendantsContextProvider value={descendants}>\n <AutocompleteProvider\n value={{\n ...rest,\n allowCreate,\n inputValue,\n isEmpty,\n styles,\n value,\n formControlProps,\n onClose,\n }}\n >\n <Popover {...getPopoverProps()}>\n <ui.div\n className={cx(\"ui-multi-autocomplete\", className)}\n __css={css}\n {...getContainerProps(containerProps)}\n >\n <ui.div\n className=\"ui-multi-autocomplete__inner\"\n __css={{ position: \"relative\", ...styles.inner }}\n >\n <MultiAutocompleteField\n component={component}\n h={h}\n keepPlaceholder={keepPlaceholder}\n minH={minH}\n separator={separator}\n inputProps={inputProps}\n {...getFieldProps(fieldProps, ref)}\n />\n\n {isClearable && value.length ? (\n <AutocompleteClearIcon\n {...clearIconProps}\n onClick={handlerAll(clearIconProps?.onClick, onClear)}\n {...formControlProps}\n />\n ) : (\n <AutocompleteIcon {...iconProps} {...formControlProps} />\n )}\n </ui.div>\n\n <Portal {...portalProps}>\n <AutocompleteList\n footer={runIfFunc(footer, { value, onClose })}\n header={runIfFunc(header, { value, onClose })}\n contentProps={contentProps}\n {...listProps}\n >\n {!isEmpty ? (\n <>\n {allowCreate ? (\n <AutocompleteCreate {...createProps} />\n ) : (\n <AutocompleteEmpty {...emptyProps} />\n )}\n\n {children}\n </>\n ) : allowCreate && inputValue ? (\n <AutocompleteCreate {...createProps} />\n ) : (\n <AutocompleteEmpty {...emptyProps} />\n )}\n </AutocompleteList>\n </Portal>\n </ui.div>\n </Popover>\n </AutocompleteProvider>\n </AutocompleteDescendantsContextProvider>\n )\n },\n)\n\nMultiAutocomplete.displayName = \"MultiAutocomplete\"\nMultiAutocomplete.__ui__ = \"MultiAutocomplete\"\n\ninterface MultiAutocompleteFieldProps\n extends HTMLUIProps,\n Pick<\n MultiAutocompleteProps,\n \"component\" | \"inputProps\" | \"keepPlaceholder\" | \"separator\"\n > {}\n\nconst MultiAutocompleteField = forwardRef<MultiAutocompleteFieldProps, \"input\">(\n (\n {\n className,\n component,\n h,\n keepPlaceholder,\n minH,\n placeholder,\n separator = \",\",\n inputProps,\n ...rest\n },\n ref,\n ) => {\n const { inputRef, inputValue, isOpen, label, styles, value, onChange } =\n useAutocompleteContext()\n const { getInputProps } = useAutocompleteInput()\n\n const cloneChildren = useMemo(() => {\n if (!label?.length) return null\n\n if (component) {\n return (label as string[]).map((label, index) => {\n if (!value[index]) return null\n\n const onRemove: MouseEventHandler<HTMLElement> = (ev) => {\n if (!value[index]) return\n\n ev.stopPropagation()\n\n onChange(value[index])\n\n if (inputRef.current) inputRef.current.focus()\n }\n\n const el = component({\n index,\n label,\n value: value[index],\n onRemove,\n })\n\n const style: CSSProperties = {\n marginBlockEnd: \"0.125rem\",\n marginBlockStart: \"0.125rem\",\n marginInlineEnd: \"0.25rem\",\n }\n\n return el\n ? cloneElement(el as ReactElement, { key: index, style })\n : null\n })\n } else {\n return (label as string[]).map((value, index) => {\n const isLast = label.length === index + 1\n\n return (\n <ui.span key={index} display=\"inline-block\" me=\"0.25rem\">\n {value}\n {!isLast || isOpen ? separator : null}\n </ui.span>\n )\n })\n }\n }, [label, component, value, onChange, isOpen, inputRef, separator])\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n flexWrap: \"wrap\",\n h,\n minH,\n pe: \"2rem\",\n ...styles.field,\n cursor: \"text\",\n }\n\n if (label?.length && component) css.py = \"0.125rem\"\n\n return (\n <PopoverTrigger>\n <ui.div\n className={cx(\"ui-multi-autocomplete__field\", className)}\n __css={css}\n {...rest}\n >\n {cloneChildren}\n\n <ui.input\n className=\"ui-multi-autocomplete__field__input\"\n display=\"inline-block\"\n flex=\"1\"\n marginBlockEnd=\"0.125rem\"\n marginBlockStart=\"0.125rem\"\n minW=\"0px\"\n overflow=\"hidden\"\n placeholder={\n !label?.length || (keepPlaceholder && isOpen)\n ? placeholder\n : undefined\n }\n {...getInputProps({ ...inputProps, value: inputValue }, ref)}\n />\n </ui.div>\n </PopoverTrigger>\n )\n },\n)\n\nMultiAutocompleteField.displayName = \"MultiAutocompleteField\"\nMultiAutocompleteField.__ui__ = \"MultiAutocompleteField\"\n"],"mappings":"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","names":["label","value"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/use-autocomplete-list.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport { ariaAttr, isArray, mergeRefs, useUpdateEffect } from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useId, useRef } from \"react\"\nimport {\n useAutocompleteContext,\n useAutocompleteDescendantsContext,\n} from \"./autocomplete-context\"\n\nexport const useAutocompleteList = () => {\n const { focusedIndex, isOpen, listRef, rebirthOptions, value } =\n useAutocompleteContext()\n const descendants = useAutocompleteDescendantsContext()\n const uuid = useId()\n const beforeFocusedIndex = useRef<number>(-1)\n const selectedValue = descendants.value(focusedIndex)\n const isMulti = isArray(value)\n\n const onAnimationComplete = useCallback(() => {\n if (!isOpen) rebirthOptions(false)\n }, [isOpen, rebirthOptions])\n\n useEffect(() => {\n if (!listRef.current || !selectedValue) return\n\n if (beforeFocusedIndex.current === selectedValue.index) return\n\n const parent = listRef.current\n const child = selectedValue.node\n\n const parentHeight = parent.clientHeight\n const viewTop = parent.scrollTop\n const viewBottom = viewTop + parentHeight\n\n const childHeight = child.clientHeight\n const childTop = child.offsetTop\n const childBottom = childTop + childHeight\n\n const isInView = viewTop <= childTop && childBottom <= viewBottom\n\n const isScrollBottom = beforeFocusedIndex.current < selectedValue.index\n\n if (!isInView) {\n if (childBottom <= parentHeight) {\n listRef.current.scrollTo({ top: 0 })\n } else {\n if (!isScrollBottom) {\n listRef.current.scrollTo({ top: childTop + 1 })\n } else {\n listRef.current.scrollTo({ top: childBottom - parentHeight })\n }\n }\n }\n\n beforeFocusedIndex.current = selectedValue.index\n }, [listRef, selectedValue])\n\n useUpdateEffect(() => {\n if (!isOpen) beforeFocusedIndex.current = -1\n }, [isOpen])\n\n const getListProps: PropGetter = useCallback(\n ({ id, ...props } = {}, ref = null) => ({\n id: id ?? uuid,\n ref: mergeRefs(listRef, ref),\n \"aria-multiselectable\": ariaAttr(isMulti),\n position: \"relative\",\n role: \"listbox\",\n tabIndex: -1,\n ...props,\n }),\n [listRef, uuid, isMulti],\n )\n\n return {\n getListProps,\n onAnimationComplete,\n }\n}\n"],"mappings":";;;;;;;AACA,SAAS,UAAU,SAAS,WAAW,uBAAuB;AAC9D,SAAS,aAAa,WAAW,OAAO,cAAc;AAM/C,IAAM,sBAAsB,MAAM;AACvC,QAAM,EAAE,cAAc,QAAQ,SAAS,gBAAgB,MAAM,IAC3D,uBAAuB;AACzB,QAAM,cAAc,kCAAkC;AACtD,QAAM,OAAO,MAAM;AACnB,QAAM,qBAAqB,OAAe,EAAE;AAC5C,QAAM,gBAAgB,YAAY,MAAM,YAAY;AACpD,QAAM,UAAU,QAAQ,KAAK;AAE7B,QAAM,sBAAsB,YAAY,MAAM;AAC5C,QAAI,CAAC,OAAQ,gBAAe,KAAK;AAAA,EACnC,GAAG,CAAC,QAAQ,cAAc,CAAC;AAE3B,YAAU,MAAM;AACd,QAAI,CAAC,QAAQ,WAAW,CAAC,cAAe;AAExC,QAAI,mBAAmB,YAAY,cAAc,MAAO;AAExD,UAAM,SAAS,QAAQ;AACvB,UAAM,QAAQ,cAAc;AAE5B,UAAM,eAAe,OAAO;AAC5B,UAAM,UAAU,OAAO;AACvB,UAAM,aAAa,UAAU;AAE7B,UAAM,cAAc,MAAM;AAC1B,UAAM,WAAW,MAAM;AACvB,UAAM,cAAc,WAAW;AAE/B,UAAM,WAAW,WAAW,YAAY,eAAe;AAEvD,UAAM,iBAAiB,mBAAmB,UAAU,cAAc;AAElE,QAAI,CAAC,UAAU;AACb,UAAI,eAAe,cAAc;AAC/B,gBAAQ,QAAQ,SAAS,EAAE,KAAK,EAAE,CAAC;AAAA,MACrC,OAAO;AACL,YAAI,CAAC,gBAAgB;AACnB,kBAAQ,QAAQ,SAAS,EAAE,KAAK,WAAW,EAAE,CAAC;AAAA,QAChD,OAAO;AACL,kBAAQ,QAAQ,SAAS,EAAE,KAAK,cAAc,aAAa,CAAC;AAAA,QAC9D;AAAA,MACF;AAAA,IACF;AAEA,uBAAmB,UAAU,cAAc;AAAA,EAC7C,GAAG,CAAC,SAAS,aAAa,CAAC;AAE3B,kBAAgB,MAAM;AACpB,QAAI,CAAC,OAAQ,oBAAmB,UAAU;AAAA,EAC5C,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,eAA2B;AAAA,IAC/B,CAAC,EAAE,IAAI,GAAG,MAAM,IAAI,CAAC,GAAG,MAAM,UAAU;AAAA,MACtC,IAAI,kBAAM;AAAA,MACV,KAAK,UAAU,SAAS,GAAG;AAAA,MAC3B,wBAAwB,SAAS,OAAO;AAAA,MACxC,UAAU;AAAA,MACV,MAAM;AAAA,MACN,UAAU;AAAA,MACV,GAAG;AAAA,IACL;AAAA,IACA,CAAC,SAAS,MAAM,OAAO;AAAA,EACzB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/autocomplete-list.tsx"],"sourcesContent":["import type { CSSUIProps, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { MotionPropsWithoutChildren } from \"@yamada-ui/motion\"\nimport type { ReactNode } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { PopoverContent } from \"@yamada-ui/popover\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { useAutocompleteList } from \"./use-autocomplete-list\"\n\nexport interface AutocompleteListProps extends HTMLUIProps {\n footer?: ReactNode\n header?: ReactNode\n contentProps?: MotionPropsWithoutChildren\n}\n\nexport const AutocompleteList = forwardRef<AutocompleteListProps, \"div\">(\n (\n {\n className,\n children,\n footer,\n header,\n maxW,\n maxWidth,\n minW,\n minWidth,\n w,\n width,\n contentProps,\n ...rest\n },\n ref,\n ) => {\n const { styles } = useAutocompleteContext()\n const { getListProps, onAnimationComplete } = useAutocompleteList()\n\n width ??= w\n width ??= (styles.list?.width ?? styles.list?.w) as CSSUIProps[\"width\"]\n minWidth ??= minW\n minWidth ??= (styles.list?.minWidth ??\n styles.list?.minW) as CSSUIProps[\"minWidth\"]\n maxWidth ??= maxW\n maxWidth ??= (styles.list?.maxWidth ??\n styles.list?.maxW) as CSSUIProps[\"maxWidth\"]\n\n return (\n <PopoverContent\n className=\"ui-autocomplete__popover\"\n maxWidth={maxWidth}\n minWidth={minWidth}\n width={width}\n __css={{ ...styles.content, maxWidth, minWidth, width }}\n {...contentProps}\n onAnimationComplete={handlerAll(\n contentProps?.onAnimationComplete,\n onAnimationComplete,\n )}\n >\n {header ? (\n <ui.header\n className=\"ui-autocomplete__header\"\n __css={{ ...styles.header }}\n >\n {header}\n </ui.header>\n ) : null}\n\n <ui.div\n className={cx(\"ui-autocomplete__list\", className)}\n __css={{ ...styles.list }}\n {...getListProps(rest, ref)}\n >\n {children}\n </ui.div>\n\n {footer ? (\n <ui.footer\n className=\"ui-autocomplete__footer\"\n __css={{ ...styles.footer }}\n >\n {footer}\n </ui.footer>\n ) : null}\n </PopoverContent>\n )\n },\n)\n\nAutocompleteList.displayName = \"AutocompleteList\"\nAutocompleteList.__ui__ = \"AutocompleteList\"\n"],"mappings":";;;;;;;;;AAGA,SAAS,YAAY,UAAU;AAC/B,SAAS,sBAAsB;AAC/B,SAAS,IAAI,kBAAkB;AAyCzB,SAaI,KAbJ;AA/BC,IAAM,mBAAmB;AAAA,EAC9B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AAhCP;AAiCI,UAAM,EAAE,OAAO,IAAI,uBAAuB;AAC1C,UAAM,EAAE,cAAc,oBAAoB,IAAI,oBAAoB;AAElE,oCAAU;AACV,qCAAW,kBAAO,SAAP,mBAAa,UAAb,aAAsB,YAAO,SAAP,mBAAa;AAC9C,6CAAa;AACb,8CAAc,kBAAO,SAAP,mBAAa,aAAb,aACZ,YAAO,SAAP,mBAAa;AACf,6CAAa;AACb,8CAAc,kBAAO,SAAP,mBAAa,aAAb,aACZ,YAAO,SAAP,mBAAa;AAEf,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,EAAE,GAAG,OAAO,SAAS,UAAU,UAAU,MAAM;AAAA,QACrD,GAAG;AAAA,QACJ,qBAAqB;AAAA,UACnB,6CAAc;AAAA,UACd;AAAA,QACF;AAAA,QAEC;AAAA,mBACC;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,OAAO;AAAA,cAEzB;AAAA;AAAA,UACH,IACE;AAAA,UAEJ;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAW,GAAG,yBAAyB,SAAS;AAAA,cAChD,OAAO,EAAE,GAAG,OAAO,KAAK;AAAA,cACvB,GAAG,aAAa,MAAM,GAAG;AAAA,cAEzB;AAAA;AAAA,UACH;AAAA,UAEC,SACC;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,OAAO;AAAA,cAEzB;AAAA;AAAA,UACH,IACE;AAAA;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,iBAAiB,cAAc;AAC/B,iBAAiB,SAAS;","names":[]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/autocomplete-context.ts"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { Dispatch, DOMAttributes, RefObject, SetStateAction } from \"react\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { createContext } from \"@yamada-ui/utils\"\n\nexport const {\n DescendantsContextProvider: AutocompleteDescendantsContextProvider,\n useDescendant: useAutocompleteDescendant,\n useDescendants: useAutocompleteDescendants,\n useDescendantsContext: useAutocompleteDescendantsContext,\n} = createDescendant()\n\ninterface AutocompleteContext\n extends Omit<\n UseAutocompleteProps,\n \"defaultValue\" | \"onChange\" | \"onCreate\" | \"value\"\n > {\n focusedIndex: number\n inputRef: RefObject<HTMLInputElement>\n inputValue: string\n isAllSelected: boolean\n isEmpty: boolean\n isHit: boolean\n isOpen: boolean\n label: string | string[] | undefined\n listRef: RefObject<HTMLUListElement>\n pickOptions: (value: string) => void\n rebirthOptions: (runFocus?: boolean) => void\n setFocusedIndex: Dispatch<SetStateAction<number>>\n styles: { [key: string]: CSSUIObject | undefined }\n value: string | string[]\n formControlProps: { [key: string]: any }\n inputProps: DOMAttributes<HTMLInputElement>\n onChange: (newValue: string, runRebirth?: boolean) => void\n onClose: () => void\n onCreate: () => void\n onFocusFirst: () => void\n onFocusLast: () => void\n onFocusNext: (index?: number) => void\n onFocusPrev: (index?: number) => void\n onOpen: () => void\n}\n\nexport const [AutocompleteProvider, useAutocompleteContext] =\n createContext<AutocompleteContext>({\n name: \"AutocompleteContext\",\n errorMessage: `useAutocompleteContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Autocomplete />\" or \"<MultiAutocomplete />\"`,\n })\n"],"mappings":";;;AAGA,SAAS,wBAAwB;AACjC,SAAS,qBAAqB;AAEvB,IAAM;AAAA,EACX,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,uBAAuB;AACzB,IAAI,iBAAiB;AAiCd,IAAM,CAAC,sBAAsB,sBAAsB,IACxD,cAAmC;AAAA,EACjC,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;","names":[]}