{
  "version": 3,
  "sources": ["../../../src/form/LmAutocomplete.tsx"],
  "sourcesContent": ["import { Button, Input, ListItem, Popover, Sheet, ThemeName, XGroup, XStack } from 'tamagui'\nimport { CaretDown, CheckSquare, ListPlus, Square } from 'tamagui-phosphor-icons'\nimport { useDeferredValue, useEffect, useId, useRef, useState } from 'react'\nimport { LmFormFieldContainer } from './LmFormFieldContainer'\nimport { LmFormContainerBaseTypes } from './formContainerTypes'\nimport { LmPopover } from '../core/panels'\nimport { Platform, useWindowDimensions } from 'react-native'\n\ntype Option = { label: string; value: string | number }\nexport type LmAutocompleteProps = LmFormContainerBaseTypes & {\n  options: Option[]\n  multiple?: boolean\n  value?: null | Option | Option[]\n  onChange?: (v: null | Option | Option[]) => void\n  placeholderSearch?: string\n  disableSearch?: boolean\n  theme?: ThemeName\n  allowNew?: boolean\n  allowNewHook?: (newValue: string) => Option\n}\n\ntype AutocompleteContext = {\n  onChangeSelection: (option: Option | Option[]) => void\n  isSelected: (opts: Option) => boolean\n}\n\ntype ConditionalOption<T extends boolean> = T extends true ? Option[] : Option\n\nexport function LmAutocomplete({\n  options,\n  labelInline,\n  labelProps,\n  helperText,\n  helperTextProps,\n  required,\n  label,\n  value,\n  onChange,\n  error,\n  theme,\n  allowNewHook,\n  multiple = false,\n  ...rest\n}: LmAutocompleteProps) {\n  const id = useId()\n  const [opts, setOpts] = useState(options)\n  const { width } = useWindowDimensions()\n  const [popoverWidth, setPopoverWidth] = useState<number>(0)\n  const inputRef = useRef<HTMLInputElement>(null)\n  const [selection, setSelection] = useState<ConditionalOption<typeof multiple> | null>(\n    value ?? (multiple ? [] : null)\n  )\n  const isSelected = (item: Option) =>\n    Array.isArray(selection)\n      ? !!selection?.some((i) => i.value === item.value)\n      : selection?.value === item.value\n\n  const onChangeSelection = (item: Option) => {\n    let newVal: ConditionalOption<typeof multiple> | null = null\n    if (multiple) {\n      const has = isSelected(item)\n      newVal = has\n        ? (selection as Option[])?.filter((i) => i.value !== item.value) ?? []\n        : [...((selection as Option[]) ?? []), item]\n    } else {\n      newVal = isSelected(item) ? null : item\n    }\n    setSelection(newVal)\n    if (typeof onChange === 'function') {\n      onChange(newVal)\n    }\n  }\n\n  useEffect(() => {\n    const elWidth = inputRef.current?.offsetWidth\n    if (elWidth) {\n      setPopoverWidth(elWidth)\n    }\n  }, [width])\n\n  const inputValue = Array.isArray(selection)\n    ? selection.map((option) => option?.label).join(', ')\n    : selection?.label || ''\n\n  return (\n    <LmFormFieldContainer\n      id={id}\n      error={error}\n      required={required}\n      labelProps={labelProps}\n      label={label}\n      labelInline={labelInline}\n      helperText={helperText}\n      helperTextProps={helperTextProps}\n    >\n      <XGroup ref={inputRef}>\n        <XGroup.Item>\n          <Input flex={1} value={inputValue} theme={theme} textOverflow={'ellipsis'} />\n        </XGroup.Item>\n        <XGroup.Item>\n          <LmPopover\n            isBouncy\n            sheetProps={\n              {\n                // snapPoints: [100, 0],\n              }\n            }\n            contentProps={{\n              minWidth: popoverWidth ? popoverWidth : undefined,\n              maxWidth: '100%',\n            }}\n            trigger={\n              <Button icon={<CaretDown />} borderTopLeftRadius={0} borderBottomLeftRadius={0} />\n            }\n          >\n            <LmAutocompleteInputContent\n              theme={theme}\n              options={opts}\n              isSelected={isSelected}\n              onChangeSelection={onChangeSelection}\n              onAddNew={(newVal) => {\n                if (newVal) {\n                  const newItem =\n                    typeof allowNewHook === 'function'\n                      ? allowNewHook(newVal)\n                      : {\n                          value: newVal,\n                          label: newVal,\n                        }\n                  setOpts((oldVal) => [newItem, ...oldVal])\n                }\n              }}\n              {...rest}\n            />\n          </LmPopover>\n        </XGroup.Item>\n      </XGroup>\n    </LmFormFieldContainer>\n  )\n}\n\ntype LmAutocompleteInputContentProps = LmAutocompleteProps &\n  AutocompleteContext & {\n    onAddNew: (str: string) => void\n  }\n\nfunction LmAutocompleteInputContent({\n  disableSearch,\n  theme,\n  placeholderSearch,\n  options,\n  allowNew,\n  onAddNew,\n  onChangeSelection,\n  isSelected,\n}: LmAutocompleteInputContentProps) {\n  const [searchTerm, setSearchTerm] = useState<string>()\n  const deferredTerm = useDeferredValue(searchTerm)\n  const filteredOptions = deferredTerm?.length\n    ? options.filter((i) => i.label.toLowerCase().includes(deferredTerm))\n    : options\n  return (\n    <>\n      {Platform.OS === 'web' ? (\n        <>\n          {(!disableSearch || allowNew) && (\n            <XStack padding={'$4'} width={'100%'}>\n              <Input\n                theme={theme}\n                placeholder={placeholderSearch}\n                width={'100%'}\n                onChangeText={(text) => {\n                  setSearchTerm(text.toLowerCase())\n                }}\n              />\n            </XStack>\n          )}\n          <Popover.ScrollView\n            keyboardShouldPersistTaps={'always'}\n            style={{ maxHeight: 300, width: '100%' }}\n          >\n            <LmAutocompleteList\n              options={filteredOptions}\n              onChangeSelection={onChangeSelection}\n              isSelected={isSelected}\n            />\n            {allowNew && !filteredOptions?.length && deferredTerm && (\n              <XStack justifyContent={'flex-start'} marginBottom={'$3'} marginLeft={'$3'}>\n                <Button onPress={() => onAddNew(deferredTerm)} chromeless icon={<ListPlus />}>\n                  {deferredTerm}\n                </Button>\n              </XStack>\n            )}\n          </Popover.ScrollView>\n        </>\n      ) : (\n        <>\n          {(!disableSearch || allowNew) && (\n            <XStack padding={'$4'} width={'100%'}>\n              <Input\n                theme={theme}\n                placeholder={placeholderSearch}\n                width={'100%'}\n                onChangeText={(text) => {\n                  setSearchTerm(text.toLowerCase())\n                }}\n              />\n            </XStack>\n          )}\n          <Sheet.ScrollView>\n            <LmAutocompleteList\n              options={filteredOptions}\n              onChangeSelection={onChangeSelection}\n              isSelected={isSelected}\n            />\n          </Sheet.ScrollView>\n          {allowNew && !filteredOptions?.length && deferredTerm && (\n            <XStack justifyContent={'flex-start'} marginBottom={'$3'} marginLeft={'$3'}>\n              <Button onPress={() => onAddNew(deferredTerm)} chromeless icon={<ListPlus />}>\n                {deferredTerm}\n              </Button>\n            </XStack>\n          )}\n        </>\n      )}\n    </>\n  )\n}\n\ntype LmAutocompleteListProps = AutocompleteContext & {\n  options: LmAutocompleteProps['options']\n}\n\nfunction LmAutocompleteList({ options, isSelected, onChangeSelection }: LmAutocompleteListProps) {\n  return (\n    <>\n      {options.map((item, i) => {\n        return (\n          <ListItem\n            hoverTheme\n            key={item.value}\n            icon={isSelected(item) ? <CheckSquare /> : <Square />}\n            title={item.label}\n            onPress={() => onChangeSelection(item)}\n          />\n        )\n      })}\n    </>\n  )\n}\n"],
  "mappings": "AAAA,SAAS,QAAQ,OAAO,UAAU,SAAS,OAAkB,QAAQ,cAAc;AACnF,SAAS,WAAW,aAAa,UAAU,cAAc;AACzD,SAAS,kBAAkB,WAAW,OAAO,QAAQ,gBAAgB;AACrE,SAAS,4BAA4B;AAErC,SAAS,iBAAiB;AAC1B,SAAS,UAAU,2BAA2B;AAsBvC,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,KACR;AACL,GAAwB;AACtB,QAAM,KAAK,MAAM;AACjB,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,OAAO;AACxC,QAAM,EAAE,MAAM,IAAI,oBAAoB;AACtC,QAAM,CAAC,cAAc,eAAe,IAAI,SAAiB,CAAC;AAC1D,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,CAAC,WAAW,YAAY,IAAI;AAAA,IAChC,UAAU,WAAW,CAAC,IAAI;AAAA,EAC5B;AACA,QAAM,aAAa,CAAC,SAClB,MAAM,QAAQ,SAAS,IACnB,CAAC,EAAC,uCAAW,KAAK,CAAC,MAAM,EAAE,UAAU,KAAK,WAC1C,uCAAW,WAAU,KAAK;AAEhC,QAAM,oBAAoB,CAAC,SAAiB;AAC1C,QAAI,SAAoD;AACxD,QAAI,UAAU;AACZ,YAAM,MAAM,WAAW,IAAI;AAC3B,eAAS,OACJ,uCAAwB,OAAO,CAAC,MAAM,EAAE,UAAU,KAAK,WAAU,CAAC,IACnE,CAAC,GAAK,aAA0B,CAAC,GAAI,IAAI;AAAA,IAC/C,OAAO;AACL,eAAS,WAAW,IAAI,IAAI,OAAO;AAAA,IACrC;AACA,iBAAa,MAAM;AACnB,QAAI,OAAO,aAAa,YAAY;AAClC,eAAS,MAAM;AAAA,IACjB;AAAA,EACF;AAEA,YAAU,MAAM;AAzElB;AA0EI,UAAM,WAAU,cAAS,YAAT,mBAAkB;AAClC,QAAI,SAAS;AACX,sBAAgB,OAAO;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,aAAa,MAAM,QAAQ,SAAS,IACtC,UAAU,IAAI,CAAC,WAAW,iCAAQ,KAAK,EAAE,KAAK,IAAI,KAClD,uCAAW,UAAS;AAExB,SACE,CAAC,qBACC,IAAI,IACJ,OAAO,OACP,UAAU,UACV,YAAY,YACZ,OAAO,OACP,aAAa,aACb,YAAY,YACZ,iBAAiB,iBAEjB,CAAC,OAAO,KAAK;AAAA,IACX,CAAC,OAAO,KACN,CAAC,MAAM,MAAM,GAAG,OAAO,YAAY,OAAO,OAAO,aAAc,WAAY,EAC7E,EAFC,OAAO;AAAA,IAGR,CAAC,OAAO,KACN,CAAC,UACC,SACA,YACE,CAEA,GAEF,cAAc;AAAA,MACZ,UAAU,eAAe,eAAe;AAAA,MACxC,UAAU;AAAA,IACZ,GACA,SACE,CAAC,OAAO,MAAM,CAAC,UAAU,IAAI,qBAAqB,GAAG,wBAAwB,GAAG,IAGlF,CAAC,2BACC,OAAO,OACP,SAAS,MACT,YAAY,YACZ,mBAAmB,mBACnB,UAAU,CAAC,WAAW;AACpB,UAAI,QAAQ;AACV,cAAM,UACJ,OAAO,iBAAiB,aACpB,aAAa,MAAM,IACnB;AAAA,UACE,OAAO;AAAA,UACP,OAAO;AAAA,QACT;AACN,gBAAQ,CAAC,WAAW,CAAC,SAAS,GAAG,MAAM,CAAC;AAAA,MAC1C;AAAA,IACF,OACI,MACN,EACF,EAlCC,UAmCH,EApCC,OAAO;AAAA,EAqCV,EAzCC,OA0CH,EApDC;AAsDL;AAOA,SAAS,2BAA2B;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAoC;AAClC,QAAM,CAAC,YAAY,aAAa,IAAI,SAAiB;AACrD,QAAM,eAAe,iBAAiB,UAAU;AAChD,QAAM,mBAAkB,6CAAc,UAClC,QAAQ,OAAO,CAAC,MAAM,EAAE,MAAM,YAAY,EAAE,SAAS,YAAY,CAAC,IAClE;AACJ,SACE,GACG,SAAS,OAAO,QACf;AAAA,MACI,CAAC,iBAAiB,aAClB,CAAC,OAAO,QAAS,KAAM,MAAO,OAC5B,CAAC,MACC,OAAO,OACP,aAAa,mBACb,MAAO,OACP,cAAc,CAAC,SAAS;AACtB,oBAAc,KAAK,YAAY,CAAC;AAAA,IAClC,GACF,EACF,EATC;AAAA,IAWH,CAAC,QAAQ,WACP,0BAA2B,SAC3B,OAAO,EAAE,WAAW,KAAK,OAAO,OAAO;AAAA,MAEvC,CAAC,mBACC,SAAS,iBACT,mBAAmB,mBACnB,YAAY,YACd;AAAA,OACC,YAAY,EAAC,mDAAiB,WAAU,gBACvC,CAAC,OAAO,eAAgB,aAAc,aAAc,KAAM,WAAY,KACpE,CAAC,OAAO,SAAS,MAAM,SAAS,YAAY,GAAG,WAAW,MAAM,CAAC,SAAS,KACvE,aACH,EAFC,OAGH,EAJC;AAAA,IAML,EAhBC,QAAQ;AAAA,EAiBX,MAEA;AAAA,MACI,CAAC,iBAAiB,aAClB,CAAC,OAAO,QAAS,KAAM,MAAO,OAC5B,CAAC,MACC,OAAO,OACP,aAAa,mBACb,MAAO,OACP,cAAc,CAAC,SAAS;AACtB,oBAAc,KAAK,YAAY,CAAC;AAAA,IAClC,GACF,EACF,EATC;AAAA,IAWH,CAAC,MAAM,WACL,CAAC,mBACC,SAAS,iBACT,mBAAmB,mBACnB,YAAY,YACd,EACF,EANC,MAAM;AAAA,KAON,YAAY,EAAC,mDAAiB,WAAU,gBACvC,CAAC,OAAO,eAAgB,aAAc,aAAc,KAAM,WAAY,KACpE,CAAC,OAAO,SAAS,MAAM,SAAS,YAAY,GAAG,WAAW,MAAM,CAAC,SAAS,KACvE,aACH,EAFC,OAGH,EAJC;AAAA,EAML,IAEJ;AAEJ;AAMA,SAAS,mBAAmB,EAAE,SAAS,YAAY,kBAAkB,GAA4B;AAC/F,SACE,GACG,QAAQ,IAAI,CAAC,MAAM,MAAM;AACxB,WACE,CAAC,SACC,WACA,KAAK,KAAK,OACV,MAAM,WAAW,IAAI,IAAI,CAAC,YAAY,KAAK,CAAC,OAAO,IACnD,OAAO,KAAK,OACZ,SAAS,MAAM,kBAAkB,IAAI,GACvC;AAAA,EAEJ,CAAC,EACH;AAEJ;",
  "names": []
}