@stokelp/ui 2.103.0 → 2.104.1

package/dist/components/combobox/Combobox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.cjs","sources":["../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["import {\n  Combobox as ArkCombobox,\n  type ComboboxRootProps,\n  createListCollection,\n  Portal,\n  useComboboxItemContext,\n} from '@ark-ui/react'\nimport { FC, ReactNode, useCallback, useEffect, useMemo, useState } from 'react'\nimport { styled } from '@stokelp/styled-system/jsx'\nimport { debounce } from 'lodash'\n\nimport { combobox } from '@stokelp/styled-system/recipes'\nimport { createStyleContext } from '~/utils/slots'\nimport { Input as UIInput } from '~/components/input'\n\nimport { ConditionalWrapper } from '~/shared/ConditionalWrapper'\nimport { Text } from '~/components/text/Text'\nimport { Tooltip } from '~/components/tooltip/Tooltip'\nimport { HTMLStyledProps, RecipeVariantProps } from '@stokelp/styled-system/types'\nimport { FixedSizeList } from 'react-window'\nimport { css } from '@stokelp/styled-system/css'\n\nconst { withProvider, withContext } = createStyleContext(combobox)\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Root = withProvider(styled(ArkCombobox.Root<any>), 'root', {\n  defaultProps: {\n    loopFocus: true,\n  },\n})\n\nconst ClearTrigger = withContext(styled(ArkCombobox.ClearTrigger), 'clearTrigger')\nconst Content = withContext(styled(ArkCombobox.Content), 'content')\nconst Input = withContext(styled(ArkCombobox.Input), 'input')\nconst Control = withContext(styled(ArkCombobox.Control), 'control')\nconst Item = withContext(styled(ArkCombobox.Item), 'item')\nconst ItemText = withContext(styled(ArkCombobox.ItemText), 'itemText')\nconst Positioner = withContext(styled(ArkCombobox.Positioner), 'positioner')\nconst Trigger = withContext(styled(ArkCombobox.Trigger), 'trigger')\n\nexport type ComboboxItem = {\n  value: string | number\n  label: string\n  disabled?: boolean\n  tooltip?: ReactNode\n}\n\nexport type ComboboxProps<T extends ComboboxItem> = Omit<ComboboxRootProps<T>, 'collection' | 'value'> & {\n  value?: Array<string | number>\n  items?: T[]\n  initialItems?: T[]\n  renderItem?: (item: T) => ReactNode\n  loadItems?: (inputValue: string) => Promise<T[]>\n  debounceMs?: number\n  emptyLabel?: ReactNode\n  loadingLabel?: ReactNode\n  placeholder?: string\n  usePortal?: boolean\n  isLoading?: boolean\n  withAutoFilter?: boolean\n  onResetInitialItems?: () => void\n  openDropdownOnFocus?: boolean\n  clearValueWhenEmpty?: boolean\n  virtualized?: boolean\n  rowHeight?: number\n  returnItemsOnEmpty?: boolean\n} & HTMLStyledProps<'div'> &\n  RecipeVariantProps<typeof combobox>\n\nconst MultipleUncheckedIndicator: FC = () => (\n  <svg width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect x=\"0.5\" y=\"1\" width=\"15\" height=\"15\" rx=\"3.5\" fill=\"white\" />\n    <rect x=\"0.5\" y=\"1\" width=\"15\" height=\"15\" rx=\"3.5\" className={css({ stroke: 'grey.100' })} />\n  </svg>\n)\n\nconst MultipleCheckedIndicator: FC = () => (\n  <svg width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect y=\"0.5\" width=\"16\" height=\"16\" rx=\"4\" className={css({ fill: 'primary.500' })} />\n    <path\n      fillRule=\"evenodd\"\n      clipRule=\"evenodd\"\n      d=\"M11.958 4.81298C12.1303 4.92787 12.1769 5.16069 12.062 5.33301L7.56202 12.083C7.4997 12.1765 7.39875 12.2371 7.28695 12.2482C7.17515 12.2592 7.06428 12.2196 6.98483 12.1402L3.98483 9.14017C3.83839 8.99372 3.83839 8.75628 3.98483 8.60984C4.13128 8.46339 4.36872 8.46339 4.51517 8.60984L7.19172 11.2864L11.438 4.91699C11.5529 4.74467 11.7857 4.6981 11.958 4.81298Z\"\n      fill=\"white\"\n    />\n  </svg>\n)\n\ninterface InnerItemProps<Item extends ComboboxItem> {\n  item: Item\n  isMultiple?: boolean\n  renderItem?: (item: Item) => ReactNode\n}\n\nfunction CustomInnerItem<Item extends ComboboxItem>({ item, isMultiple, renderItem }: InnerItemProps<Item>) {\n  const context = useComboboxItemContext()\n\n  return (\n    <>\n      {isMultiple ? context.selected ? <MultipleCheckedIndicator /> : <MultipleUncheckedIndicator /> : null}\n      {renderItem ? renderItem(item) : <ItemText truncate>{item.label}</ItemText>}\n    </>\n  )\n}\n\nexport const Combobox = <T extends ComboboxItem>({\n  items: itemsFromUsers = [],\n  initialItems,\n  debounceMs = 0,\n  placeholder,\n  emptyLabel,\n  loadingLabel,\n  usePortal = true,\n  withAutoFilter = true,\n  positioning,\n  loadItems,\n  renderItem,\n  onResetInitialItems,\n  isLoading: controlledIsLoading,\n  value,\n  openDropdownOnFocus = true,\n  clearValueWhenEmpty = true,\n  virtualized,\n  rowHeight = 34,\n  returnItemsOnEmpty,\n  ...props\n}: ComboboxProps<T>) => {\n  const [items, setItems] = useState(() => itemsFromUsers)\n  const [isLoading, setIsLoading] = useState(false)\n  const [firstQueryTriggered, setFirstQueryTriggered] = useState(false)\n  const asyncMode = typeof loadItems === 'function'\n\n  const debouncedLoadItems = useMemo(\n    () =>\n      loadItems\n        ? debounce(async (value: string) => {\n            try {\n              setFirstQueryTriggered(true)\n              setIsLoading(true)\n              const newItems = await loadItems(value)\n              setItems(newItems)\n            } catch (error) {\n              console.error(error)\n              setItems([])\n            } finally {\n              setIsLoading(false)\n            }\n          }, debounceMs)\n        : null,\n    [loadItems, debounceMs],\n  )\n\n  const allItems = [...items, ...(initialItems ?? [])]\n\n  const handleInputChange = useCallback(\n    async (details: ArkCombobox.InputValueChangeDetails) => {\n      if (initialItems && initialItems.length > 0 && !initialItems.find(item => item.label === details.inputValue)) {\n        onResetInitialItems?.()\n      }\n      const { inputValue } = details\n\n      if (debouncedLoadItems) {\n        debouncedLoadItems(inputValue)\n      } else {\n        const items =\n          withAutoFilter && inputValue !== ''\n            ? itemsFromUsers.filter(item => item.label.toLowerCase().includes(inputValue.toLowerCase()))\n            : itemsFromUsers\n\n        if (items.length === 0 && returnItemsOnEmpty) {\n          return setItems(itemsFromUsers)\n        }\n        setItems(items)\n      }\n    },\n    [debouncedLoadItems, itemsFromUsers, withAutoFilter],\n  )\n\n  useEffect(() => {\n    if (!withAutoFilter && !debouncedLoadItems) {\n      setItems(itemsFromUsers)\n    }\n  }, [itemsFromUsers, withAutoFilter, debouncedLoadItems])\n\n  const collection = useMemo(() => createListCollection({ items: allItems }), [allItems])\n\n  const effectiveIsLoading = controlledIsLoading ?? isLoading\n\n  const loadingContent = loadingLabel ?? (\n    <Text p=\"space-8\" textAlign=\"center\">\n      Chargement...\n    </Text>\n  )\n  const emptyContent = emptyLabel ?? (\n    <Text p=\"space-8\" textAlign=\"center\">\n      Aucun résultat\n    </Text>\n  )\n  // TODO: const multiple = props.multiple\n  // TODO: multiple design, using input chips https://ark-ui.com/reat/examples/combobox-with-tags-input\n  const multiple = false\n\n  return (\n    <Root\n      lazyMount\n      unmountOnExit\n      collection={collection}\n      positioning={{ sameWidth: true, gutter: 0, ...positioning }}\n      data-recipe=\"combobox\"\n      onInputValueChange={handleInputChange}\n      value={value as string[] | undefined}\n      {...props}\n      // TODO: multiple design\n      multiple={multiple}\n    >\n      <Control>\n        <ArkCombobox.Context>\n          {api => (\n            <Input\n              asChild\n              placeholder={placeholder}\n              onInput={e => {\n                const value = e.currentTarget.value\n\n                if (clearValueWhenEmpty && value === '') {\n                  api.clearValue()\n                }\n              }}\n              onFocus={() => {\n                if (!openDropdownOnFocus || asyncMode) return\n                api.setOpen(true)\n              }}\n            >\n              <UIInput />\n            </Input>\n          )}\n        </ArkCombobox.Context>\n        <Trigger asChild hidden={asyncMode && (!initialItems || initialItems.length === 0)}>\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              fillRule=\"evenodd\"\n              clipRule=\"evenodd\"\n              d=\"M12.5303 16.2803C12.2374 16.5732 11.7626 16.5732 11.4697 16.2803L3.96967 8.78033C3.67678 8.48744 3.67678 8.01256 3.96967 7.71967C4.26256 7.42678 4.73744 7.42678 5.03033 7.71967L12 14.6893L18.9697 7.71967C19.2626 7.42678 19.7374 7.42678 20.0303 7.71967C20.3232 8.01256 20.3232 8.48744 20.0303 8.78033L12.5303 16.2803Z\"\n              fill=\"currentColor\"\n            />\n          </svg>\n        </Trigger>\n        <ClearTrigger disabled={props.readOnly} onClick={onResetInitialItems} asChild>\n          <button>\n            <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M10 3.125C6.20304 3.125 3.125 6.20304 3.125 10C3.125 13.797 6.20304 16.875 10 16.875C13.797 16.875 16.875 13.797 16.875 10C16.875 6.20304 13.797 3.125 10 3.125ZM1.875 10C1.875 5.51269 5.51269 1.875 10 1.875C14.4873 1.875 18.125 5.51269 18.125 10C18.125 14.4873 14.4873 18.125 10 18.125C5.51269 18.125 1.875 14.4873 1.875 10ZM7.68306 7.68306C7.92714 7.43898 8.32286 7.43898 8.56694 7.68306L10 9.11612L11.4331 7.68306C11.6771 7.43898 12.0729 7.43898 12.3169 7.68306C12.561 7.92714 12.561 8.32286 12.3169 8.56694L10.8839 10L12.3169 11.4331C12.561 11.6771 12.561 12.0729 12.3169 12.3169C12.0729 12.561 11.6771 12.561 11.4331 12.3169L10 10.8839L8.56694 12.3169C8.32286 12.561 7.92714 12.561 7.68306 12.3169C7.43898 12.0729 7.43898 11.6771 7.68306 11.4331L9.11612 10L7.68306 8.56694C7.43898 8.32286 7.43898 7.92714 7.68306 7.68306Z\"\n                fill=\"currentColor\"\n              />\n            </svg>\n          </button>\n        </ClearTrigger>\n      </Control>\n      <ConditionalWrapper when={usePortal} wrapper={children => <Portal>{children}</Portal>}>\n        <Positioner>\n          <Content>\n            {effectiveIsLoading ? (\n              loadingContent\n            ) : allItems.length === 0 ? (\n              <>{asyncMode ? (firstQueryTriggered ? emptyContent : loadingContent) : emptyContent}</>\n            ) : virtualized ? (\n              <>\n                <FixedSizeList\n                  height={Math.min(rowHeight * allItems.length, 180)}\n                  itemCount={allItems.length}\n                  itemSize={rowHeight}\n                  width=\"100%\"\n                >\n                  {({ index, style }) => (\n                    <ConditionalWrapper\n                      key={allItems[index].value}\n                      when={!!allItems[index].tooltip}\n                      wrapper={children => <Tooltip label={allItems[index].tooltip}>{children}</Tooltip>}\n                    >\n                      <Item key={allItems[index].value} item={allItems[index]} style={style}>\n                        <CustomInnerItem renderItem={renderItem} item={allItems[index]} isMultiple={multiple} />\n                      </Item>\n                    </ConditionalWrapper>\n                  )}\n                </FixedSizeList>\n              </>\n            ) : (\n              allItems.map(item => (\n                <ConditionalWrapper\n                  key={item.value}\n                  when={!!item.tooltip}\n                  wrapper={children => <Tooltip label={item.tooltip}>{children}</Tooltip>}\n                >\n                  <Item key={item.value} item={item}>\n                    <CustomInnerItem renderItem={renderItem} item={item} isMultiple={multiple} />\n                  </Item>\n                </ConditionalWrapper>\n              ))\n            )}\n          </Content>\n        </Positioner>\n      </ConditionalWrapper>\n    </Root>\n  )\n}\n"],"names":["withProvider","withContext","createStyleContext","combobox","Root","styled","ArkCombobox","ClearTrigger","Content","Input","Control","Item","ItemText","Positioner","Trigger","MultipleUncheckedIndicator","jsxs","jsx","css","MultipleCheckedIndicator","CustomInnerItem","item","isMultiple","renderItem","context","useComboboxItemContext","Fragment","Combobox","itemsFromUsers","initialItems","debounceMs","placeholder","emptyLabel","loadingLabel","usePortal","withAutoFilter","positioning","loadItems","onResetInitialItems","controlledIsLoading","value","openDropdownOnFocus","clearValueWhenEmpty","virtualized","rowHeight","returnItemsOnEmpty","props","items","setItems","useState","isLoading","setIsLoading","firstQueryTriggered","setFirstQueryTriggered","asyncMode","debouncedLoadItems","useMemo","debounce","newItems","error","allItems","handleInputChange","useCallback","details","inputValue","useEffect","collection","createListCollection","effectiveIsLoading","loadingContent","Text","emptyContent","multiple","api","e","UIInput","ConditionalWrapper","children","Portal","FixedSizeList","index","style","Tooltip"],"mappings":"oiBAsBM,CAAE,aAAAA,GAAc,YAAAC,GAAgBC,EAAAA,mBAAmBC,EAAAA,QAAQ,EAG3DC,GAAOJ,GAAaK,EAAAA,OAAOC,EAAAA,SAAY,IAAS,EAAG,OAAQ,CAC/D,aAAc,CACZ,UAAW,EAAA,CAEf,CAAC,EAEKC,GAAeN,EAAYI,EAAAA,OAAOC,EAAAA,SAAY,YAAY,EAAG,cAAc,EAC3EE,GAAUP,EAAYI,EAAAA,OAAOC,EAAAA,SAAY,OAAO,EAAG,SAAS,EAC5DG,GAAQR,EAAYI,EAAAA,OAAOC,EAAAA,SAAY,KAAK,EAAG,OAAO,EACtDI,GAAUT,EAAYI,EAAAA,OAAOC,EAAAA,SAAY,OAAO,EAAG,SAAS,EAC5DK,EAAOV,EAAYI,EAAAA,OAAOC,EAAAA,SAAY,IAAI,EAAG,MAAM,EACnDM,GAAWX,EAAYI,EAAAA,OAAOC,EAAAA,SAAY,QAAQ,EAAG,UAAU,EAC/DO,GAAaZ,EAAYI,EAAAA,OAAOC,EAAAA,SAAY,UAAU,EAAG,YAAY,EACrEQ,GAAUb,EAAYI,EAAAA,OAAOC,EAAAA,SAAY,OAAO,EAAG,SAAS,EA+B5DS,GAAiC,IACrCC,EAAAA,KAAC,MAAA,CAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,SAAA,CAAAC,EAAAA,IAAC,OAAA,CAAK,EAAE,MAAM,EAAE,IAAI,MAAM,KAAK,OAAO,KAAK,GAAG,MAAM,KAAK,QAAQ,QAChE,OAAA,CAAK,EAAE,MAAM,EAAE,IAAI,MAAM,KAAK,OAAO,KAAK,GAAG,MAAM,UAAWC,EAAAA,IAAI,CAAE,OAAQ,UAAA,CAAY,CAAA,CAAG,CAAA,EAC9F,EAGIC,GAA+B,IACnCH,EAAAA,KAAC,MAAA,CAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,SAAA,CAAAC,EAAAA,IAAC,OAAA,CAAK,EAAE,MAAM,MAAM,KAAK,OAAO,KAAK,GAAG,IAAI,UAAWC,EAAAA,IAAI,CAAE,KAAM,aAAA,CAAe,EAAG,EACrFD,EAAAA,IAAC,OAAA,CACC,SAAS,UACT,SAAS,UACT,EAAE,6WACF,KAAK,OAAA,CAAA,CACP,EACF,EASF,SAASG,EAA2C,CAAE,KAAAC,EAAM,WAAAC,EAAY,WAAAC,GAAoC,CAC1G,MAAMC,EAAUC,EAAAA,uBAAA,EAEhB,OACET,EAAAA,KAAAU,WAAA,CACG,SAAA,CAAAJ,EAAaE,EAAQ,SAAWP,EAAAA,IAACE,KAAyB,EAAKF,MAACF,KAA2B,EAAK,KAChGQ,EAAaA,EAAWF,CAAI,QAAKT,GAAA,CAAS,SAAQ,GAAE,SAAAS,EAAK,KAAA,CAAM,CAAA,EAClE,CAEJ,CAEO,MAAMM,GAAW,CAAyB,CAC/C,MAAOC,EAAiB,CAAA,EACxB,aAAAC,EACA,WAAAC,EAAa,EACb,YAAAC,EACA,WAAAC,EACA,aAAAC,EACA,UAAAC,EAAY,GACZ,eAAAC,EAAiB,GACjB,YAAAC,EACA,UAAAC,EACA,WAAAd,EACA,oBAAAe,EACA,UAAWC,EACX,MAAAC,EACA,oBAAAC,EAAsB,GACtB,oBAAAC,EAAsB,GACtB,YAAAC,EACA,UAAAC,EAAY,GACZ,mBAAAC,EACA,GAAGC,CACL,IAAwB,CACtB,KAAM,CAACC,EAAOC,CAAQ,EAAIC,EAAAA,SAAS,IAAMrB,CAAc,EACjD,CAACsB,EAAWC,CAAY,EAAIF,EAAAA,SAAS,EAAK,EAC1C,CAACG,EAAqBC,CAAsB,EAAIJ,EAAAA,SAAS,EAAK,EAC9DK,EAAY,OAAOjB,GAAc,WAEjCkB,EAAqBC,EAAAA,QACzB,IACEnB,EACIoB,yBAAS,MAAOjB,GAAkB,CAChC,GAAI,CACFa,EAAuB,EAAI,EAC3BF,EAAa,EAAI,EACjB,MAAMO,EAAW,MAAMrB,EAAUG,CAAK,EACtCQ,EAASU,CAAQ,CACnB,OAASC,EAAO,CACd,QAAQ,MAAMA,CAAK,EACnBX,EAAS,CAAA,CAAE,CACb,QAAA,CACEG,EAAa,EAAK,CACpB,CACF,EAAGrB,CAAU,EACb,KACN,CAACO,EAAWP,CAAU,CAAA,EAGlB8B,EAAW,CAAC,GAAGb,EAAO,GAAIlB,GAAgB,CAAA,CAAG,EAE7CgC,EAAoBC,EAAAA,YACxB,MAAOC,GAAiD,CAClDlC,GAAgBA,EAAa,OAAS,GAAK,CAACA,EAAa,KAAKR,GAAQA,EAAK,QAAU0C,EAAQ,UAAU,GACzGzB,IAAA,EAEF,KAAM,CAAE,WAAA0B,GAAeD,EAEvB,GAAIR,EACFA,EAAmBS,CAAU,MACxB,CACL,MAAMjB,EACJZ,GAAkB6B,IAAe,GAC7BpC,EAAe,OAAOP,GAAQA,EAAK,MAAM,YAAA,EAAc,SAAS2C,EAAW,YAAA,CAAa,CAAC,EACzFpC,EAEN,GAAImB,EAAM,SAAW,GAAKF,EACxB,OAAOG,EAASpB,CAAc,EAEhCoB,EAASD,CAAK,CAChB,CACF,EACA,CAACQ,EAAoB3B,EAAgBO,CAAc,CAAA,EAGrD8B,EAAAA,UAAU,IAAM,CACV,CAAC9B,GAAkB,CAACoB,GACtBP,EAASpB,CAAc,CAE3B,EAAG,CAACA,EAAgBO,EAAgBoB,CAAkB,CAAC,EAEvD,MAAMW,EAAaV,UAAQ,IAAMW,uBAAqB,CAAE,MAAOP,CAAA,CAAU,EAAG,CAACA,CAAQ,CAAC,EAEhFQ,EAAqB7B,GAAuBW,EAE5CmB,EAAiBpC,GACrBhB,EAAAA,IAACqD,EAAAA,KAAA,CAAK,EAAE,UAAU,UAAU,SAAS,SAAA,eAAA,CAErC,EAEIC,EAAevC,GACnBf,EAAAA,IAACqD,EAAAA,KAAA,CAAK,EAAE,UAAU,UAAU,SAAS,SAAA,gBAAA,CAErC,EAIIE,EAAW,GAEjB,OACExD,EAAAA,KAACZ,GAAA,CACC,UAAS,GACT,cAAa,GACb,WAAA8D,EACA,YAAa,CAAE,UAAW,GAAM,OAAQ,EAAG,GAAG9B,CAAA,EAC9C,cAAY,WACZ,mBAAoByB,EACpB,MAAArB,EACC,GAAGM,EAEJ,SAAA0B,EAEA,SAAA,CAAAxD,OAACN,GAAA,CACC,SAAA,CAAAO,EAAAA,IAACX,EAAAA,SAAY,QAAZ,CACE,SAAAmE,GACCxD,EAAAA,IAACR,GAAA,CACC,QAAO,GACP,YAAAsB,EACA,QAAS2C,GAAK,CACZ,MAAMlC,EAAQkC,EAAE,cAAc,MAE1BhC,GAAuBF,IAAU,IACnCiC,EAAI,WAAA,CAER,EACA,QAAS,IAAM,CACT,CAAChC,GAAuBa,GAC5BmB,EAAI,QAAQ,EAAI,CAClB,EAEA,eAACE,GAAAA,MAAA,CAAA,CAAQ,CAAA,CAAA,EAGf,EACA1D,EAAAA,IAACH,IAAQ,QAAO,GAAC,OAAQwC,IAAc,CAACzB,GAAgBA,EAAa,SAAW,GAC9E,eAAC,MAAA,CAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,SAAAZ,EAAAA,IAAC,OAAA,CACC,SAAS,UACT,SAAS,UACT,EAAE,+TACF,KAAK,cAAA,CAAA,EAET,CAAA,CACF,EACAA,EAAAA,IAACV,IAAa,SAAUuC,EAAM,SAAU,QAASR,EAAqB,QAAO,GAC3E,SAAArB,EAAAA,IAAC,SAAA,CACC,eAAC,MAAA,CAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAChE,SAAAA,EAAAA,IAAC,OAAA,CACC,SAAS,UACT,SAAS,UACT,EAAE,4zBACF,KAAK,cAAA,CAAA,CACP,CACF,EACF,CAAA,CACF,CAAA,EACF,EACAA,MAAC2D,EAAAA,mBAAA,CAAmB,KAAM1C,EAAW,QAAS2C,GAAY5D,EAAAA,IAAC6D,EAAAA,OAAA,CAAQ,SAAAD,EAAS,EAC1E,SAAA5D,MAACJ,GAAA,CACC,SAAAI,EAAAA,IAACT,GAAA,CACE,SAAA4D,EACCC,EACET,EAAS,SAAW,EACtB3C,EAAAA,IAAAS,EAAAA,SAAA,CAAG,SAAA4B,EAAaF,EAAsBmB,EAAeF,EAAkBE,EAAa,EAClF5B,EACF1B,MAAAS,EAAAA,SAAA,CACE,SAAAT,EAAAA,IAAC8D,EAAAA,cAAA,CACC,OAAQ,KAAK,IAAInC,EAAYgB,EAAS,OAAQ,GAAG,EACjD,UAAWA,EAAS,OACpB,SAAUhB,EACV,MAAM,OAEL,SAAA,CAAC,CAAE,MAAAoC,EAAO,MAAAC,CAAA,IACThE,EAAAA,IAAC2D,EAAAA,mBAAA,CAEC,KAAM,CAAC,CAAChB,EAASoB,CAAK,EAAE,QACxB,WAAqB/D,EAAAA,IAACiE,UAAA,CAAQ,MAAOtB,EAASoB,CAAK,EAAE,QAAU,SAAAH,CAAA,CAAS,EAExE,SAAA5D,EAAAA,IAACN,GAAiC,KAAMiD,EAASoB,CAAK,EAAG,MAAAC,EACvD,eAAC7D,EAAA,CAAgB,WAAAG,EAAwB,KAAMqC,EAASoB,CAAK,EAAG,WAAYR,CAAA,CAAU,GAD7EZ,EAASoB,CAAK,EAAE,KAE3B,CAAA,EANKpB,EAASoB,CAAK,EAAE,KAAA,CAOvB,CAAA,CAEJ,CACF,EAEApB,EAAS,IAAIvC,GACXJ,EAAAA,IAAC2D,EAAAA,mBAAA,CAEC,KAAM,CAAC,CAACvD,EAAK,QACb,QAASwD,GAAY5D,EAAAA,IAACiE,EAAAA,SAAQ,MAAO7D,EAAK,QAAU,SAAAwD,EAAS,EAE7D,SAAA5D,EAAAA,IAACN,EAAA,CAAsB,KAAAU,EACrB,SAAAJ,EAAAA,IAACG,EAAA,CAAgB,WAAAG,EAAwB,KAAAF,EAAY,WAAYmD,CAAA,CAAU,CAAA,EADlEnD,EAAK,KAEhB,CAAA,EANKA,EAAK,KAAA,CAQb,CAAA,CAEL,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CAAA,CAGN"}
+{"version":3,"file":"Combobox.cjs","names":[],"sources":["../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["import {\n  Combobox as ArkCombobox,\n  type ComboboxRootProps,\n  createListCollection,\n  Portal,\n  useComboboxItemContext,\n} from '@ark-ui/react'\nimport { FC, ReactNode, useCallback, useEffect, useMemo, useState } from 'react'\nimport { styled } from '@stokelp/styled-system/jsx'\nimport { debounce } from 'lodash'\n\nimport { combobox } from '@stokelp/styled-system/recipes'\nimport { createStyleContext } from '~/utils/slots'\nimport { Input as UIInput } from '~/components/input'\n\nimport { ConditionalWrapper } from '~/shared/ConditionalWrapper'\nimport { Text } from '~/components/text/Text'\nimport { Tooltip } from '~/components/tooltip/Tooltip'\nimport { HTMLStyledProps, RecipeVariantProps } from '@stokelp/styled-system/types'\nimport { FixedSizeList } from 'react-window'\nimport { css } from '@stokelp/styled-system/css'\n\nconst { withProvider, withContext } = createStyleContext(combobox)\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Root = withProvider(styled(ArkCombobox.Root<any>), 'root', {\n  defaultProps: {\n    loopFocus: true,\n  },\n})\n\nconst ClearTrigger = withContext(styled(ArkCombobox.ClearTrigger), 'clearTrigger')\nconst Content = withContext(styled(ArkCombobox.Content), 'content')\nconst Input = withContext(styled(ArkCombobox.Input), 'input')\nconst Control = withContext(styled(ArkCombobox.Control), 'control')\nconst Item = withContext(styled(ArkCombobox.Item), 'item')\nconst ItemText = withContext(styled(ArkCombobox.ItemText), 'itemText')\nconst Positioner = withContext(styled(ArkCombobox.Positioner), 'positioner')\nconst Trigger = withContext(styled(ArkCombobox.Trigger), 'trigger')\n\nexport type ComboboxItem = {\n  value: string | number\n  label: string\n  disabled?: boolean\n  tooltip?: ReactNode\n}\n\nexport type ComboboxProps<T extends ComboboxItem> = Omit<ComboboxRootProps<T>, 'collection' | 'value'> & {\n  value?: Array<string | number>\n  items?: T[]\n  initialItems?: T[]\n  renderItem?: (item: T) => ReactNode\n  loadItems?: (inputValue: string) => Promise<T[]>\n  debounceMs?: number\n  emptyLabel?: ReactNode\n  loadingLabel?: ReactNode\n  placeholder?: string\n  usePortal?: boolean\n  isLoading?: boolean\n  withAutoFilter?: boolean\n  onResetInitialItems?: () => void\n  openDropdownOnFocus?: boolean\n  clearValueWhenEmpty?: boolean\n  virtualized?: boolean\n  rowHeight?: number\n  returnItemsOnEmpty?: boolean\n} & HTMLStyledProps<'div'> &\n  RecipeVariantProps<typeof combobox>\n\nconst MultipleUncheckedIndicator: FC = () => (\n  <svg width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect x=\"0.5\" y=\"1\" width=\"15\" height=\"15\" rx=\"3.5\" fill=\"white\" />\n    <rect x=\"0.5\" y=\"1\" width=\"15\" height=\"15\" rx=\"3.5\" className={css({ stroke: 'grey.100' })} />\n  </svg>\n)\n\nconst MultipleCheckedIndicator: FC = () => (\n  <svg width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect y=\"0.5\" width=\"16\" height=\"16\" rx=\"4\" className={css({ fill: 'primary.500' })} />\n    <path\n      fillRule=\"evenodd\"\n      clipRule=\"evenodd\"\n      d=\"M11.958 4.81298C12.1303 4.92787 12.1769 5.16069 12.062 5.33301L7.56202 12.083C7.4997 12.1765 7.39875 12.2371 7.28695 12.2482C7.17515 12.2592 7.06428 12.2196 6.98483 12.1402L3.98483 9.14017C3.83839 8.99372 3.83839 8.75628 3.98483 8.60984C4.13128 8.46339 4.36872 8.46339 4.51517 8.60984L7.19172 11.2864L11.438 4.91699C11.5529 4.74467 11.7857 4.6981 11.958 4.81298Z\"\n      fill=\"white\"\n    />\n  </svg>\n)\n\ninterface InnerItemProps<Item extends ComboboxItem> {\n  item: Item\n  isMultiple?: boolean\n  renderItem?: (item: Item) => ReactNode\n}\n\nfunction CustomInnerItem<Item extends ComboboxItem>({ item, isMultiple, renderItem }: InnerItemProps<Item>) {\n  const context = useComboboxItemContext()\n\n  return (\n    <>\n      {isMultiple ? context.selected ? <MultipleCheckedIndicator /> : <MultipleUncheckedIndicator /> : null}\n      {renderItem ? renderItem(item) : <ItemText truncate>{item.label}</ItemText>}\n    </>\n  )\n}\n\nexport const Combobox = <T extends ComboboxItem>({\n  items: itemsFromUsers = [],\n  initialItems,\n  debounceMs = 0,\n  placeholder,\n  emptyLabel,\n  loadingLabel,\n  usePortal = true,\n  withAutoFilter = true,\n  positioning,\n  loadItems,\n  renderItem,\n  onResetInitialItems,\n  isLoading: controlledIsLoading,\n  value,\n  openDropdownOnFocus = true,\n  clearValueWhenEmpty = true,\n  virtualized,\n  rowHeight = 34,\n  returnItemsOnEmpty,\n  ...props\n}: ComboboxProps<T>) => {\n  const [items, setItems] = useState(() => itemsFromUsers)\n  const [isLoading, setIsLoading] = useState(false)\n  const [firstQueryTriggered, setFirstQueryTriggered] = useState(false)\n  const asyncMode = typeof loadItems === 'function'\n\n  const debouncedLoadItems = useMemo(\n    () =>\n      loadItems\n        ? debounce(async (value: string) => {\n            try {\n              setFirstQueryTriggered(true)\n              setIsLoading(true)\n              const newItems = await loadItems(value)\n              setItems(newItems)\n            } catch (error) {\n              console.error(error)\n              setItems([])\n            } finally {\n              setIsLoading(false)\n            }\n          }, debounceMs)\n        : null,\n    [loadItems, debounceMs],\n  )\n\n  const allItems = [...items, ...(initialItems ?? [])]\n\n  const handleInputChange = useCallback(\n    async (details: ArkCombobox.InputValueChangeDetails) => {\n      if (\n        initialItems &&\n        initialItems.length > 0 &&\n        !initialItems.find((item: ComboboxItem) => item.label === details.inputValue)\n      ) {\n        onResetInitialItems?.()\n      }\n      const { inputValue } = details\n\n      if (debouncedLoadItems) {\n        debouncedLoadItems(inputValue)\n      } else {\n        const items =\n          withAutoFilter && inputValue !== ''\n            ? itemsFromUsers.filter((item: ComboboxItem) => item.label.toLowerCase().includes(inputValue.toLowerCase()))\n            : itemsFromUsers\n\n        if (items.length === 0 && returnItemsOnEmpty) {\n          return setItems(itemsFromUsers)\n        }\n        setItems(items)\n      }\n    },\n    [debouncedLoadItems, itemsFromUsers, withAutoFilter],\n  )\n\n  useEffect(() => {\n    if (!withAutoFilter && !debouncedLoadItems) {\n      setItems(itemsFromUsers)\n    }\n  }, [itemsFromUsers, withAutoFilter, debouncedLoadItems])\n\n  const collection = useMemo(() => createListCollection({ items: allItems }), [allItems])\n\n  const effectiveIsLoading = controlledIsLoading ?? isLoading\n\n  const loadingContent = loadingLabel ?? (\n    <Text p=\"space-8\" textAlign=\"center\">\n      Chargement...\n    </Text>\n  )\n  const emptyContent = emptyLabel ?? (\n    <Text p=\"space-8\" textAlign=\"center\">\n      Aucun résultat\n    </Text>\n  )\n  // TODO: const multiple = props.multiple\n  // TODO: multiple design, using input chips https://ark-ui.com/reat/examples/combobox-with-tags-input\n  const multiple = false\n\n  return (\n    <Root\n      lazyMount\n      unmountOnExit\n      collection={collection}\n      positioning={{ sameWidth: true, gutter: 0, ...positioning }}\n      data-recipe=\"combobox\"\n      onInputValueChange={handleInputChange}\n      value={value as string[] | undefined}\n      {...props}\n      // TODO: multiple design\n      multiple={multiple}\n    >\n      <Control>\n        <ArkCombobox.Context>\n          {api => (\n            <Input\n              asChild\n              placeholder={placeholder}\n              onInput={(e: React.FormEvent<HTMLInputElement>) => {\n                const value = e.currentTarget.value\n\n                if (clearValueWhenEmpty && value === '') {\n                  api.clearValue()\n                }\n              }}\n              onFocus={() => {\n                if (!openDropdownOnFocus || asyncMode) return\n                api.setOpen(true)\n              }}\n            >\n              <UIInput />\n            </Input>\n          )}\n        </ArkCombobox.Context>\n        <Trigger asChild hidden={asyncMode && (!initialItems || initialItems.length === 0)}>\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              fillRule=\"evenodd\"\n              clipRule=\"evenodd\"\n              d=\"M12.5303 16.2803C12.2374 16.5732 11.7626 16.5732 11.4697 16.2803L3.96967 8.78033C3.67678 8.48744 3.67678 8.01256 3.96967 7.71967C4.26256 7.42678 4.73744 7.42678 5.03033 7.71967L12 14.6893L18.9697 7.71967C19.2626 7.42678 19.7374 7.42678 20.0303 7.71967C20.3232 8.01256 20.3232 8.48744 20.0303 8.78033L12.5303 16.2803Z\"\n              fill=\"currentColor\"\n            />\n          </svg>\n        </Trigger>\n        <ClearTrigger disabled={props.readOnly} onClick={onResetInitialItems} asChild>\n          <button>\n            <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M10 3.125C6.20304 3.125 3.125 6.20304 3.125 10C3.125 13.797 6.20304 16.875 10 16.875C13.797 16.875 16.875 13.797 16.875 10C16.875 6.20304 13.797 3.125 10 3.125ZM1.875 10C1.875 5.51269 5.51269 1.875 10 1.875C14.4873 1.875 18.125 5.51269 18.125 10C18.125 14.4873 14.4873 18.125 10 18.125C5.51269 18.125 1.875 14.4873 1.875 10ZM7.68306 7.68306C7.92714 7.43898 8.32286 7.43898 8.56694 7.68306L10 9.11612L11.4331 7.68306C11.6771 7.43898 12.0729 7.43898 12.3169 7.68306C12.561 7.92714 12.561 8.32286 12.3169 8.56694L10.8839 10L12.3169 11.4331C12.561 11.6771 12.561 12.0729 12.3169 12.3169C12.0729 12.561 11.6771 12.561 11.4331 12.3169L10 10.8839L8.56694 12.3169C8.32286 12.561 7.92714 12.561 7.68306 12.3169C7.43898 12.0729 7.43898 11.6771 7.68306 11.4331L9.11612 10L7.68306 8.56694C7.43898 8.32286 7.43898 7.92714 7.68306 7.68306Z\"\n                fill=\"currentColor\"\n              />\n            </svg>\n          </button>\n        </ClearTrigger>\n      </Control>\n      <ConditionalWrapper when={usePortal} wrapper={children => <Portal>{children}</Portal>}>\n        <Positioner>\n          <Content>\n            {effectiveIsLoading ? (\n              loadingContent\n            ) : allItems.length === 0 ? (\n              <>{asyncMode ? (firstQueryTriggered ? emptyContent : loadingContent) : emptyContent}</>\n            ) : virtualized ? (\n              <>\n                <FixedSizeList\n                  height={Math.min(rowHeight * allItems.length, 180)}\n                  itemCount={allItems.length}\n                  itemSize={rowHeight}\n                  width=\"100%\"\n                >\n                  {({ index, style }) => (\n                    <ConditionalWrapper\n                      key={allItems[index].value}\n                      when={!!allItems[index].tooltip}\n                      wrapper={children => <Tooltip label={allItems[index].tooltip}>{children}</Tooltip>}\n                    >\n                      <Item key={allItems[index].value} item={allItems[index]} style={style}>\n                        <CustomInnerItem renderItem={renderItem} item={allItems[index]} isMultiple={multiple} />\n                      </Item>\n                    </ConditionalWrapper>\n                  )}\n                </FixedSizeList>\n              </>\n            ) : (\n              allItems.map(item => (\n                <ConditionalWrapper\n                  key={item.value}\n                  when={!!item.tooltip}\n                  wrapper={children => <Tooltip label={item.tooltip}>{children}</Tooltip>}\n                >\n                  <Item key={item.value} item={item}>\n                    <CustomInnerItem renderItem={renderItem} item={item} isMultiple={multiple} />\n                  </Item>\n                </ConditionalWrapper>\n              ))\n            )}\n          </Content>\n        </Positioner>\n      </ConditionalWrapper>\n    </Root>\n  )\n}\n"],"mappings":"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"}

package/dist/components/combobox/Combobox.js

@@ -1,176 +1,209 @@
 "use client";
-import { jsxs as p, jsx as e, Fragment as L } from "react/jsx-runtime";
-import { createListCollection as U, Combobox as r, Portal as e1, useComboboxItemContext as t1 } from "@ark-ui/react";
-import { useState as x, useMemo as P, useCallback as o1, useEffect as n1 } from "react";
-import { styled as i } from "@stokelp/styled-system/jsx";
-import { l as l1 } from "../../_virtual/lodash.js";
-import { combobox as r1 } from "@stokelp/styled-system/recipes";
-import { createStyleContext as i1 } from "../../utils/slots.js";
-import { ConditionalWrapper as v } from "../../shared/ConditionalWrapper.js";
-import { Text as Z } from "../text/Text.js";
-import { Tooltip as B } from "../tooltip/Tooltip.js";
-import { FixedSizeList as c1 } from "react-window";
-import { css as z } from "@stokelp/styled-system/css";
-import { Input as s1 } from "../input/Input.js";
-const { withProvider: h1, withContext: h } = i1(r1), u1 = h1(i(r.Root), "root", {
-  defaultProps: {
-    loopFocus: !0
-  }
-}), a1 = h(i(r.ClearTrigger), "clearTrigger"), d1 = h(i(r.Content), "content"), p1 = h(i(r.Input), "input"), C1 = h(i(r.Control), "control"), S = h(i(r.Item), "item"), g1 = h(i(r.ItemText), "itemText"), f1 = h(i(r.Positioner), "positioner"), m1 = h(i(r.Trigger), "trigger"), w1 = () => /* @__PURE__ */ p("svg", { width: "16", height: "17", viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-  /* @__PURE__ */ e("rect", { x: "0.5", y: "1", width: "15", height: "15", rx: "3.5", fill: "white" }),
-  /* @__PURE__ */ e("rect", { x: "0.5", y: "1", width: "15", height: "15", rx: "3.5", className: z({ stroke: "grey.100" }) })
-] }), x1 = () => /* @__PURE__ */ p("svg", { width: "16", height: "17", viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-  /* @__PURE__ */ e("rect", { y: "0.5", width: "16", height: "16", rx: "4", className: z({ fill: "primary.500" }) }),
-  /* @__PURE__ */ e(
-    "path",
-    {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M11.958 4.81298C12.1303 4.92787 12.1769 5.16069 12.062 5.33301L7.56202 12.083C7.4997 12.1765 7.39875 12.2371 7.28695 12.2482C7.17515 12.2592 7.06428 12.2196 6.98483 12.1402L3.98483 9.14017C3.83839 8.99372 3.83839 8.75628 3.98483 8.60984C4.13128 8.46339 4.36872 8.46339 4.51517 8.60984L7.19172 11.2864L11.438 4.91699C11.5529 4.74467 11.7857 4.6981 11.958 4.81298Z",
-      fill: "white"
-    }
-  )
-] });
-function V({ item: l, isMultiple: c, renderItem: u }) {
-  const f = t1();
-  return /* @__PURE__ */ p(L, { children: [
-    c ? f.selected ? /* @__PURE__ */ e(x1, {}) : /* @__PURE__ */ e(w1, {}) : null,
-    u ? u(l) : /* @__PURE__ */ e(g1, { truncate: !0, children: l.label })
-  ] });
+import { createStyleContext as e } from "../../utils/slots.js";
+import { Tooltip as t } from "../tooltip/Tooltip.js";
+import { Text as n } from "../text/Text.js";
+import { ConditionalWrapper as r } from "../../shared/ConditionalWrapper.js";
+import { Input as ee } from "../input/Input.js";
+import { Combobox as i, Portal as a, createListCollection as o, useComboboxItemContext as s } from "@ark-ui/react";
+import { styled as c } from "@stokelp/styled-system/jsx";
+import { combobox as l } from "@stokelp/styled-system/recipes";
+import { useCallback as u, useEffect as d, useMemo as f, useState as p } from "react";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+import { css as _ } from "@stokelp/styled-system/css";
+import { FixedSizeList as v } from "react-window";
+import { debounce as y } from "lodash";
+//#region src/components/combobox/Combobox.tsx
+var { withProvider: b, withContext: x } = e(l), S = b(c(i.Root), "root", { defaultProps: { loopFocus: !0 } }), te = x(c(i.ClearTrigger), "clearTrigger"), C = x(c(i.Content), "content"), w = x(c(i.Input), "input"), T = x(c(i.Control), "control"), E = x(c(i.Item), "item"), D = x(c(i.ItemText), "itemText"), O = x(c(i.Positioner), "positioner"), k = x(c(i.Trigger), "trigger"), A = () => /* @__PURE__ */ g("svg", {
+	width: "16",
+	height: "17",
+	viewBox: "0 0 16 17",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	children: [/* @__PURE__ */ h("rect", {
+		x: "0.5",
+		y: "1",
+		width: "15",
+		height: "15",
+		rx: "3.5",
+		fill: "white"
+	}), /* @__PURE__ */ h("rect", {
+		x: "0.5",
+		y: "1",
+		width: "15",
+		height: "15",
+		rx: "3.5",
+		className: _({ stroke: "grey.100" })
+	})]
+}), j = () => /* @__PURE__ */ g("svg", {
+	width: "16",
+	height: "17",
+	viewBox: "0 0 16 17",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	children: [/* @__PURE__ */ h("rect", {
+		y: "0.5",
+		width: "16",
+		height: "16",
+		rx: "4",
+		className: _({ fill: "primary.500" })
+	}), /* @__PURE__ */ h("path", {
+		fillRule: "evenodd",
+		clipRule: "evenodd",
+		d: "M11.958 4.81298C12.1303 4.92787 12.1769 5.16069 12.062 5.33301L7.56202 12.083C7.4997 12.1765 7.39875 12.2371 7.28695 12.2482C7.17515 12.2592 7.06428 12.2196 6.98483 12.1402L3.98483 9.14017C3.83839 8.99372 3.83839 8.75628 3.98483 8.60984C4.13128 8.46339 4.36872 8.46339 4.51517 8.60984L7.19172 11.2864L11.438 4.91699C11.5529 4.74467 11.7857 4.6981 11.958 4.81298Z",
+		fill: "white"
+	})]
+});
+function M({ item: e, isMultiple: t, renderItem: n }) {
+	let r = s();
+	return /* @__PURE__ */ g(m, { children: [t ? r.selected ? /* @__PURE__ */ h(j, {}) : /* @__PURE__ */ h(A, {}) : null, n ? n(e) : /* @__PURE__ */ h(D, {
+		truncate: !0,
+		children: e.label
+	})] });
 }
-const V1 = ({
-  items: l = [],
-  initialItems: c,
-  debounceMs: u = 0,
-  placeholder: f,
-  emptyLabel: E,
-  loadingLabel: O,
-  usePortal: j = !0,
-  withAutoFilter: C = !0,
-  positioning: N,
-  loadItems: g,
-  renderItem: b,
-  onResetInitialItems: y,
-  isLoading: Q,
-  value: W,
-  openDropdownOnFocus: $ = !0,
-  clearValueWhenEmpty: q = !0,
-  virtualized: A,
-  rowHeight: T = 34,
-  returnItemsOnEmpty: D,
-  ...M
-}) => {
-  const [G, a] = x(() => l), [J, I] = x(!1), [K, X] = x(!1), m = typeof g == "function", d = P(
-    () => g ? l1.debounce(async (t) => {
-      try {
-        X(!0), I(!0);
-        const o = await g(t);
-        a(o);
-      } catch (o) {
-        console.error(o), a([]);
-      } finally {
-        I(!1);
-      }
-    }, u) : null,
-    [g, u]
-  ), n = [...G, ...c ?? []], Y = o1(
-    async (t) => {
-      c && c.length > 0 && !c.find((s) => s.label === t.inputValue) && y?.();
-      const { inputValue: o } = t;
-      if (d)
-        d(o);
-      else {
-        const s = C && o !== "" ? l.filter((F) => F.label.toLowerCase().includes(o.toLowerCase())) : l;
-        if (s.length === 0 && D)
-          return a(l);
-        a(s);
-      }
-    },
-    [d, l, C]
-  );
-  n1(() => {
-    !C && !d && a(l);
-  }, [l, C, d]);
-  const _ = P(() => U({ items: n }), [n]), H = Q ?? J, R = O ?? /* @__PURE__ */ e(Z, { p: "space-8", textAlign: "center", children: "Chargement..." }), k = E ?? /* @__PURE__ */ e(Z, { p: "space-8", textAlign: "center", children: "Aucun résultat" }), w = !1;
-  return /* @__PURE__ */ p(
-    u1,
-    {
-      lazyMount: !0,
-      unmountOnExit: !0,
-      collection: _,
-      positioning: { sameWidth: !0, gutter: 0, ...N },
-      "data-recipe": "combobox",
-      onInputValueChange: Y,
-      value: W,
-      ...M,
-      multiple: w,
-      children: [
-        /* @__PURE__ */ p(C1, { children: [
-          /* @__PURE__ */ e(r.Context, { children: (t) => /* @__PURE__ */ e(
-            p1,
-            {
-              asChild: !0,
-              placeholder: f,
-              onInput: (o) => {
-                const s = o.currentTarget.value;
-                q && s === "" && t.clearValue();
-              },
-              onFocus: () => {
-                !$ || m || t.setOpen(!0);
-              },
-              children: /* @__PURE__ */ e(s1, {})
-            }
-          ) }),
-          /* @__PURE__ */ e(m1, { asChild: !0, hidden: m && (!c || c.length === 0), children: /* @__PURE__ */ e("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
-            "path",
-            {
-              fillRule: "evenodd",
-              clipRule: "evenodd",
-              d: "M12.5303 16.2803C12.2374 16.5732 11.7626 16.5732 11.4697 16.2803L3.96967 8.78033C3.67678 8.48744 3.67678 8.01256 3.96967 7.71967C4.26256 7.42678 4.73744 7.42678 5.03033 7.71967L12 14.6893L18.9697 7.71967C19.2626 7.42678 19.7374 7.42678 20.0303 7.71967C20.3232 8.01256 20.3232 8.48744 20.0303 8.78033L12.5303 16.2803Z",
-              fill: "currentColor"
-            }
-          ) }) }),
-          /* @__PURE__ */ e(a1, { disabled: M.readOnly, onClick: y, asChild: !0, children: /* @__PURE__ */ e("button", { children: /* @__PURE__ */ e("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
-            "path",
-            {
-              fillRule: "evenodd",
-              clipRule: "evenodd",
-              d: "M10 3.125C6.20304 3.125 3.125 6.20304 3.125 10C3.125 13.797 6.20304 16.875 10 16.875C13.797 16.875 16.875 13.797 16.875 10C16.875 6.20304 13.797 3.125 10 3.125ZM1.875 10C1.875 5.51269 5.51269 1.875 10 1.875C14.4873 1.875 18.125 5.51269 18.125 10C18.125 14.4873 14.4873 18.125 10 18.125C5.51269 18.125 1.875 14.4873 1.875 10ZM7.68306 7.68306C7.92714 7.43898 8.32286 7.43898 8.56694 7.68306L10 9.11612L11.4331 7.68306C11.6771 7.43898 12.0729 7.43898 12.3169 7.68306C12.561 7.92714 12.561 8.32286 12.3169 8.56694L10.8839 10L12.3169 11.4331C12.561 11.6771 12.561 12.0729 12.3169 12.3169C12.0729 12.561 11.6771 12.561 11.4331 12.3169L10 10.8839L8.56694 12.3169C8.32286 12.561 7.92714 12.561 7.68306 12.3169C7.43898 12.0729 7.43898 11.6771 7.68306 11.4331L9.11612 10L7.68306 8.56694C7.43898 8.32286 7.43898 7.92714 7.68306 7.68306Z",
-              fill: "currentColor"
-            }
-          ) }) }) })
-        ] }),
-        /* @__PURE__ */ e(v, { when: j, wrapper: (t) => /* @__PURE__ */ e(e1, { children: t }), children: /* @__PURE__ */ e(f1, { children: /* @__PURE__ */ e(d1, { children: H ? R : n.length === 0 ? /* @__PURE__ */ e(L, { children: m ? K ? k : R : k }) : A ? /* @__PURE__ */ e(L, { children: /* @__PURE__ */ e(
-          c1,
-          {
-            height: Math.min(T * n.length, 180),
-            itemCount: n.length,
-            itemSize: T,
-            width: "100%",
-            children: ({ index: t, style: o }) => /* @__PURE__ */ e(
-              v,
-              {
-                when: !!n[t].tooltip,
-                wrapper: (s) => /* @__PURE__ */ e(B, { label: n[t].tooltip, children: s }),
-                children: /* @__PURE__ */ e(S, { item: n[t], style: o, children: /* @__PURE__ */ e(V, { renderItem: b, item: n[t], isMultiple: w }) }, n[t].value)
-              },
-              n[t].value
-            )
-          }
-        ) }) : n.map((t) => /* @__PURE__ */ e(
-          v,
-          {
-            when: !!t.tooltip,
-            wrapper: (o) => /* @__PURE__ */ e(B, { label: t.tooltip, children: o }),
-            children: /* @__PURE__ */ e(S, { item: t, children: /* @__PURE__ */ e(V, { renderItem: b, item: t, isMultiple: w }) }, t.value)
-          },
-          t.value
-        )) }) }) })
-      ]
-    }
-  );
+var N = ({ items: e = [], initialItems: s, debounceMs: c = 0, placeholder: l, emptyLabel: _, loadingLabel: b, usePortal: x = !0, withAutoFilter: D = !0, positioning: A, loadItems: j, renderItem: N, onResetInitialItems: P, isLoading: F, value: I, openDropdownOnFocus: L = !0, clearValueWhenEmpty: R = !0, virtualized: z, rowHeight: B = 34, returnItemsOnEmpty: V, ...H }) => {
+	let [U, W] = p(() => e), [G, K] = p(!1), [q, J] = p(!1), Y = typeof j == "function", X = f(() => j ? y(async (e) => {
+		try {
+			J(!0), K(!0), W(await j(e));
+		} catch (e) {
+			console.error(e), W([]);
+		} finally {
+			K(!1);
+		}
+	}, c) : null, [j, c]), Z = [...U, ...s ?? []], ne = u(async (t) => {
+		s && s.length > 0 && !s.find((e) => e.label === t.inputValue) && P?.();
+		let { inputValue: n } = t;
+		if (X) X(n);
+		else {
+			let t = D && n !== "" ? e.filter((e) => e.label.toLowerCase().includes(n.toLowerCase())) : e;
+			if (t.length === 0 && V) return W(e);
+			W(t);
+		}
+	}, [
+		X,
+		e,
+		D
+	]);
+	d(() => {
+		!D && !X && W(e);
+	}, [
+		e,
+		D,
+		X
+	]);
+	let re = f(() => o({ items: Z }), [Z]), ie = F ?? G, Q = b ?? /* @__PURE__ */ h(n, {
+		p: "space-8",
+		textAlign: "center",
+		children: "Chargement..."
+	}), $ = _ ?? /* @__PURE__ */ h(n, {
+		p: "space-8",
+		textAlign: "center",
+		children: "Aucun résultat"
+	});
+	return /* @__PURE__ */ g(S, {
+		lazyMount: !0,
+		unmountOnExit: !0,
+		collection: re,
+		positioning: {
+			sameWidth: !0,
+			gutter: 0,
+			...A
+		},
+		"data-recipe": "combobox",
+		onInputValueChange: ne,
+		value: I,
+		...H,
+		multiple: !1,
+		children: [/* @__PURE__ */ g(T, { children: [
+			/* @__PURE__ */ h(i.Context, { children: (e) => /* @__PURE__ */ h(w, {
+				asChild: !0,
+				placeholder: l,
+				onInput: (t) => {
+					let n = t.currentTarget.value;
+					R && n === "" && e.clearValue();
+				},
+				onFocus: () => {
+					!L || Y || e.setOpen(!0);
+				},
+				children: /* @__PURE__ */ h(ee, {})
+			}) }),
+			/* @__PURE__ */ h(k, {
+				asChild: !0,
+				hidden: Y && (!s || s.length === 0),
+				children: /* @__PURE__ */ h("svg", {
+					width: "24",
+					height: "24",
+					viewBox: "0 0 24 24",
+					fill: "none",
+					xmlns: "http://www.w3.org/2000/svg",
+					children: /* @__PURE__ */ h("path", {
+						fillRule: "evenodd",
+						clipRule: "evenodd",
+						d: "M12.5303 16.2803C12.2374 16.5732 11.7626 16.5732 11.4697 16.2803L3.96967 8.78033C3.67678 8.48744 3.67678 8.01256 3.96967 7.71967C4.26256 7.42678 4.73744 7.42678 5.03033 7.71967L12 14.6893L18.9697 7.71967C19.2626 7.42678 19.7374 7.42678 20.0303 7.71967C20.3232 8.01256 20.3232 8.48744 20.0303 8.78033L12.5303 16.2803Z",
+						fill: "currentColor"
+					})
+				})
+			}),
+			/* @__PURE__ */ h(te, {
+				disabled: H.readOnly,
+				onClick: P,
+				asChild: !0,
+				children: /* @__PURE__ */ h("button", { children: /* @__PURE__ */ h("svg", {
+					width: "20",
+					height: "20",
+					viewBox: "0 0 20 20",
+					fill: "none",
+					xmlns: "http://www.w3.org/2000/svg",
+					children: /* @__PURE__ */ h("path", {
+						fillRule: "evenodd",
+						clipRule: "evenodd",
+						d: "M10 3.125C6.20304 3.125 3.125 6.20304 3.125 10C3.125 13.797 6.20304 16.875 10 16.875C13.797 16.875 16.875 13.797 16.875 10C16.875 6.20304 13.797 3.125 10 3.125ZM1.875 10C1.875 5.51269 5.51269 1.875 10 1.875C14.4873 1.875 18.125 5.51269 18.125 10C18.125 14.4873 14.4873 18.125 10 18.125C5.51269 18.125 1.875 14.4873 1.875 10ZM7.68306 7.68306C7.92714 7.43898 8.32286 7.43898 8.56694 7.68306L10 9.11612L11.4331 7.68306C11.6771 7.43898 12.0729 7.43898 12.3169 7.68306C12.561 7.92714 12.561 8.32286 12.3169 8.56694L10.8839 10L12.3169 11.4331C12.561 11.6771 12.561 12.0729 12.3169 12.3169C12.0729 12.561 11.6771 12.561 11.4331 12.3169L10 10.8839L8.56694 12.3169C8.32286 12.561 7.92714 12.561 7.68306 12.3169C7.43898 12.0729 7.43898 11.6771 7.68306 11.4331L9.11612 10L7.68306 8.56694C7.43898 8.32286 7.43898 7.92714 7.68306 7.68306Z",
+						fill: "currentColor"
+					})
+				}) })
+			})
+		] }), /* @__PURE__ */ h(r, {
+			when: x,
+			wrapper: (e) => /* @__PURE__ */ h(a, { children: e }),
+			children: /* @__PURE__ */ h(O, { children: /* @__PURE__ */ h(C, { children: ie ? Q : Z.length === 0 ? /* @__PURE__ */ h(m, { children: Y ? q ? $ : Q : $ }) : z ? /* @__PURE__ */ h(m, { children: /* @__PURE__ */ h(v, {
+				height: Math.min(B * Z.length, 180),
+				itemCount: Z.length,
+				itemSize: B,
+				width: "100%",
+				children: ({ index: e, style: n }) => /* @__PURE__ */ h(r, {
+					when: !!Z[e].tooltip,
+					wrapper: (n) => /* @__PURE__ */ h(t, {
+						label: Z[e].tooltip,
+						children: n
+					}),
+					children: /* @__PURE__ */ h(E, {
+						item: Z[e],
+						style: n,
+						children: /* @__PURE__ */ h(M, {
+							renderItem: N,
+							item: Z[e],
+							isMultiple: !1
+						})
+					}, Z[e].value)
+				}, Z[e].value)
+			}) }) : Z.map((e) => /* @__PURE__ */ h(r, {
+				when: !!e.tooltip,
+				wrapper: (n) => /* @__PURE__ */ h(t, {
+					label: e.tooltip,
+					children: n
+				}),
+				children: /* @__PURE__ */ h(E, {
+					item: e,
+					children: /* @__PURE__ */ h(M, {
+						renderItem: N,
+						item: e,
+						isMultiple: !1
+					})
+				}, e.value)
+			}, e.value)) }) })
+		})]
+	});
 };
-export {
-  V1 as Combobox
-};
-//# sourceMappingURL=Combobox.js.map
+//#endregion
+export { N as Combobox };
+
+//# sourceMappingURL=Combobox.js.map

package/dist/components/combobox/Combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.js","sources":["../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["import {\n  Combobox as ArkCombobox,\n  type ComboboxRootProps,\n  createListCollection,\n  Portal,\n  useComboboxItemContext,\n} from '@ark-ui/react'\nimport { FC, ReactNode, useCallback, useEffect, useMemo, useState } from 'react'\nimport { styled } from '@stokelp/styled-system/jsx'\nimport { debounce } from 'lodash'\n\nimport { combobox } from '@stokelp/styled-system/recipes'\nimport { createStyleContext } from '~/utils/slots'\nimport { Input as UIInput } from '~/components/input'\n\nimport { ConditionalWrapper } from '~/shared/ConditionalWrapper'\nimport { Text } from '~/components/text/Text'\nimport { Tooltip } from '~/components/tooltip/Tooltip'\nimport { HTMLStyledProps, RecipeVariantProps } from '@stokelp/styled-system/types'\nimport { FixedSizeList } from 'react-window'\nimport { css } from '@stokelp/styled-system/css'\n\nconst { withProvider, withContext } = createStyleContext(combobox)\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Root = withProvider(styled(ArkCombobox.Root<any>), 'root', {\n  defaultProps: {\n    loopFocus: true,\n  },\n})\n\nconst ClearTrigger = withContext(styled(ArkCombobox.ClearTrigger), 'clearTrigger')\nconst Content = withContext(styled(ArkCombobox.Content), 'content')\nconst Input = withContext(styled(ArkCombobox.Input), 'input')\nconst Control = withContext(styled(ArkCombobox.Control), 'control')\nconst Item = withContext(styled(ArkCombobox.Item), 'item')\nconst ItemText = withContext(styled(ArkCombobox.ItemText), 'itemText')\nconst Positioner = withContext(styled(ArkCombobox.Positioner), 'positioner')\nconst Trigger = withContext(styled(ArkCombobox.Trigger), 'trigger')\n\nexport type ComboboxItem = {\n  value: string | number\n  label: string\n  disabled?: boolean\n  tooltip?: ReactNode\n}\n\nexport type ComboboxProps<T extends ComboboxItem> = Omit<ComboboxRootProps<T>, 'collection' | 'value'> & {\n  value?: Array<string | number>\n  items?: T[]\n  initialItems?: T[]\n  renderItem?: (item: T) => ReactNode\n  loadItems?: (inputValue: string) => Promise<T[]>\n  debounceMs?: number\n  emptyLabel?: ReactNode\n  loadingLabel?: ReactNode\n  placeholder?: string\n  usePortal?: boolean\n  isLoading?: boolean\n  withAutoFilter?: boolean\n  onResetInitialItems?: () => void\n  openDropdownOnFocus?: boolean\n  clearValueWhenEmpty?: boolean\n  virtualized?: boolean\n  rowHeight?: number\n  returnItemsOnEmpty?: boolean\n} & HTMLStyledProps<'div'> &\n  RecipeVariantProps<typeof combobox>\n\nconst MultipleUncheckedIndicator: FC = () => (\n  <svg width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect x=\"0.5\" y=\"1\" width=\"15\" height=\"15\" rx=\"3.5\" fill=\"white\" />\n    <rect x=\"0.5\" y=\"1\" width=\"15\" height=\"15\" rx=\"3.5\" className={css({ stroke: 'grey.100' })} />\n  </svg>\n)\n\nconst MultipleCheckedIndicator: FC = () => (\n  <svg width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect y=\"0.5\" width=\"16\" height=\"16\" rx=\"4\" className={css({ fill: 'primary.500' })} />\n    <path\n      fillRule=\"evenodd\"\n      clipRule=\"evenodd\"\n      d=\"M11.958 4.81298C12.1303 4.92787 12.1769 5.16069 12.062 5.33301L7.56202 12.083C7.4997 12.1765 7.39875 12.2371 7.28695 12.2482C7.17515 12.2592 7.06428 12.2196 6.98483 12.1402L3.98483 9.14017C3.83839 8.99372 3.83839 8.75628 3.98483 8.60984C4.13128 8.46339 4.36872 8.46339 4.51517 8.60984L7.19172 11.2864L11.438 4.91699C11.5529 4.74467 11.7857 4.6981 11.958 4.81298Z\"\n      fill=\"white\"\n    />\n  </svg>\n)\n\ninterface InnerItemProps<Item extends ComboboxItem> {\n  item: Item\n  isMultiple?: boolean\n  renderItem?: (item: Item) => ReactNode\n}\n\nfunction CustomInnerItem<Item extends ComboboxItem>({ item, isMultiple, renderItem }: InnerItemProps<Item>) {\n  const context = useComboboxItemContext()\n\n  return (\n    <>\n      {isMultiple ? context.selected ? <MultipleCheckedIndicator /> : <MultipleUncheckedIndicator /> : null}\n      {renderItem ? renderItem(item) : <ItemText truncate>{item.label}</ItemText>}\n    </>\n  )\n}\n\nexport const Combobox = <T extends ComboboxItem>({\n  items: itemsFromUsers = [],\n  initialItems,\n  debounceMs = 0,\n  placeholder,\n  emptyLabel,\n  loadingLabel,\n  usePortal = true,\n  withAutoFilter = true,\n  positioning,\n  loadItems,\n  renderItem,\n  onResetInitialItems,\n  isLoading: controlledIsLoading,\n  value,\n  openDropdownOnFocus = true,\n  clearValueWhenEmpty = true,\n  virtualized,\n  rowHeight = 34,\n  returnItemsOnEmpty,\n  ...props\n}: ComboboxProps<T>) => {\n  const [items, setItems] = useState(() => itemsFromUsers)\n  const [isLoading, setIsLoading] = useState(false)\n  const [firstQueryTriggered, setFirstQueryTriggered] = useState(false)\n  const asyncMode = typeof loadItems === 'function'\n\n  const debouncedLoadItems = useMemo(\n    () =>\n      loadItems\n        ? debounce(async (value: string) => {\n            try {\n              setFirstQueryTriggered(true)\n              setIsLoading(true)\n              const newItems = await loadItems(value)\n              setItems(newItems)\n            } catch (error) {\n              console.error(error)\n              setItems([])\n            } finally {\n              setIsLoading(false)\n            }\n          }, debounceMs)\n        : null,\n    [loadItems, debounceMs],\n  )\n\n  const allItems = [...items, ...(initialItems ?? [])]\n\n  const handleInputChange = useCallback(\n    async (details: ArkCombobox.InputValueChangeDetails) => {\n      if (initialItems && initialItems.length > 0 && !initialItems.find(item => item.label === details.inputValue)) {\n        onResetInitialItems?.()\n      }\n      const { inputValue } = details\n\n      if (debouncedLoadItems) {\n        debouncedLoadItems(inputValue)\n      } else {\n        const items =\n          withAutoFilter && inputValue !== ''\n            ? itemsFromUsers.filter(item => item.label.toLowerCase().includes(inputValue.toLowerCase()))\n            : itemsFromUsers\n\n        if (items.length === 0 && returnItemsOnEmpty) {\n          return setItems(itemsFromUsers)\n        }\n        setItems(items)\n      }\n    },\n    [debouncedLoadItems, itemsFromUsers, withAutoFilter],\n  )\n\n  useEffect(() => {\n    if (!withAutoFilter && !debouncedLoadItems) {\n      setItems(itemsFromUsers)\n    }\n  }, [itemsFromUsers, withAutoFilter, debouncedLoadItems])\n\n  const collection = useMemo(() => createListCollection({ items: allItems }), [allItems])\n\n  const effectiveIsLoading = controlledIsLoading ?? isLoading\n\n  const loadingContent = loadingLabel ?? (\n    <Text p=\"space-8\" textAlign=\"center\">\n      Chargement...\n    </Text>\n  )\n  const emptyContent = emptyLabel ?? (\n    <Text p=\"space-8\" textAlign=\"center\">\n      Aucun résultat\n    </Text>\n  )\n  // TODO: const multiple = props.multiple\n  // TODO: multiple design, using input chips https://ark-ui.com/reat/examples/combobox-with-tags-input\n  const multiple = false\n\n  return (\n    <Root\n      lazyMount\n      unmountOnExit\n      collection={collection}\n      positioning={{ sameWidth: true, gutter: 0, ...positioning }}\n      data-recipe=\"combobox\"\n      onInputValueChange={handleInputChange}\n      value={value as string[] | undefined}\n      {...props}\n      // TODO: multiple design\n      multiple={multiple}\n    >\n      <Control>\n        <ArkCombobox.Context>\n          {api => (\n            <Input\n              asChild\n              placeholder={placeholder}\n              onInput={e => {\n                const value = e.currentTarget.value\n\n                if (clearValueWhenEmpty && value === '') {\n                  api.clearValue()\n                }\n              }}\n              onFocus={() => {\n                if (!openDropdownOnFocus || asyncMode) return\n                api.setOpen(true)\n              }}\n            >\n              <UIInput />\n            </Input>\n          )}\n        </ArkCombobox.Context>\n        <Trigger asChild hidden={asyncMode && (!initialItems || initialItems.length === 0)}>\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              fillRule=\"evenodd\"\n              clipRule=\"evenodd\"\n              d=\"M12.5303 16.2803C12.2374 16.5732 11.7626 16.5732 11.4697 16.2803L3.96967 8.78033C3.67678 8.48744 3.67678 8.01256 3.96967 7.71967C4.26256 7.42678 4.73744 7.42678 5.03033 7.71967L12 14.6893L18.9697 7.71967C19.2626 7.42678 19.7374 7.42678 20.0303 7.71967C20.3232 8.01256 20.3232 8.48744 20.0303 8.78033L12.5303 16.2803Z\"\n              fill=\"currentColor\"\n            />\n          </svg>\n        </Trigger>\n        <ClearTrigger disabled={props.readOnly} onClick={onResetInitialItems} asChild>\n          <button>\n            <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M10 3.125C6.20304 3.125 3.125 6.20304 3.125 10C3.125 13.797 6.20304 16.875 10 16.875C13.797 16.875 16.875 13.797 16.875 10C16.875 6.20304 13.797 3.125 10 3.125ZM1.875 10C1.875 5.51269 5.51269 1.875 10 1.875C14.4873 1.875 18.125 5.51269 18.125 10C18.125 14.4873 14.4873 18.125 10 18.125C5.51269 18.125 1.875 14.4873 1.875 10ZM7.68306 7.68306C7.92714 7.43898 8.32286 7.43898 8.56694 7.68306L10 9.11612L11.4331 7.68306C11.6771 7.43898 12.0729 7.43898 12.3169 7.68306C12.561 7.92714 12.561 8.32286 12.3169 8.56694L10.8839 10L12.3169 11.4331C12.561 11.6771 12.561 12.0729 12.3169 12.3169C12.0729 12.561 11.6771 12.561 11.4331 12.3169L10 10.8839L8.56694 12.3169C8.32286 12.561 7.92714 12.561 7.68306 12.3169C7.43898 12.0729 7.43898 11.6771 7.68306 11.4331L9.11612 10L7.68306 8.56694C7.43898 8.32286 7.43898 7.92714 7.68306 7.68306Z\"\n                fill=\"currentColor\"\n              />\n            </svg>\n          </button>\n        </ClearTrigger>\n      </Control>\n      <ConditionalWrapper when={usePortal} wrapper={children => <Portal>{children}</Portal>}>\n        <Positioner>\n          <Content>\n            {effectiveIsLoading ? (\n              loadingContent\n            ) : allItems.length === 0 ? (\n              <>{asyncMode ? (firstQueryTriggered ? emptyContent : loadingContent) : emptyContent}</>\n            ) : virtualized ? (\n              <>\n                <FixedSizeList\n                  height={Math.min(rowHeight * allItems.length, 180)}\n                  itemCount={allItems.length}\n                  itemSize={rowHeight}\n                  width=\"100%\"\n                >\n                  {({ index, style }) => (\n                    <ConditionalWrapper\n                      key={allItems[index].value}\n                      when={!!allItems[index].tooltip}\n                      wrapper={children => <Tooltip label={allItems[index].tooltip}>{children}</Tooltip>}\n                    >\n                      <Item key={allItems[index].value} item={allItems[index]} style={style}>\n                        <CustomInnerItem renderItem={renderItem} item={allItems[index]} isMultiple={multiple} />\n                      </Item>\n                    </ConditionalWrapper>\n                  )}\n                </FixedSizeList>\n              </>\n            ) : (\n              allItems.map(item => (\n                <ConditionalWrapper\n                  key={item.value}\n                  when={!!item.tooltip}\n                  wrapper={children => <Tooltip label={item.tooltip}>{children}</Tooltip>}\n                >\n                  <Item key={item.value} item={item}>\n                    <CustomInnerItem renderItem={renderItem} item={item} isMultiple={multiple} />\n                  </Item>\n                </ConditionalWrapper>\n              ))\n            )}\n          </Content>\n        </Positioner>\n      </ConditionalWrapper>\n    </Root>\n  )\n}\n"],"names":["withProvider","withContext","createStyleContext","combobox","Root","styled","ArkCombobox","ClearTrigger","Content","Input","Control","Item","ItemText","Positioner","Trigger","MultipleUncheckedIndicator","jsxs","jsx","css","MultipleCheckedIndicator","CustomInnerItem","item","isMultiple","renderItem","context","useComboboxItemContext","Fragment","Combobox","itemsFromUsers","initialItems","debounceMs","placeholder","emptyLabel","loadingLabel","usePortal","withAutoFilter","positioning","loadItems","onResetInitialItems","controlledIsLoading","value","openDropdownOnFocus","clearValueWhenEmpty","virtualized","rowHeight","returnItemsOnEmpty","props","items","setItems","useState","isLoading","setIsLoading","firstQueryTriggered","setFirstQueryTriggered","asyncMode","debouncedLoadItems","useMemo","debounce","newItems","error","allItems","handleInputChange","useCallback","details","inputValue","useEffect","collection","createListCollection","effectiveIsLoading","loadingContent","Text","emptyContent","multiple","api","e","UIInput","ConditionalWrapper","children","Portal","FixedSizeList","index","style","Tooltip"],"mappings":"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"}
+{"version":3,"file":"Combobox.js","names":[],"sources":["../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["import {\n  Combobox as ArkCombobox,\n  type ComboboxRootProps,\n  createListCollection,\n  Portal,\n  useComboboxItemContext,\n} from '@ark-ui/react'\nimport { FC, ReactNode, useCallback, useEffect, useMemo, useState } from 'react'\nimport { styled } from '@stokelp/styled-system/jsx'\nimport { debounce } from 'lodash'\n\nimport { combobox } from '@stokelp/styled-system/recipes'\nimport { createStyleContext } from '~/utils/slots'\nimport { Input as UIInput } from '~/components/input'\n\nimport { ConditionalWrapper } from '~/shared/ConditionalWrapper'\nimport { Text } from '~/components/text/Text'\nimport { Tooltip } from '~/components/tooltip/Tooltip'\nimport { HTMLStyledProps, RecipeVariantProps } from '@stokelp/styled-system/types'\nimport { FixedSizeList } from 'react-window'\nimport { css } from '@stokelp/styled-system/css'\n\nconst { withProvider, withContext } = createStyleContext(combobox)\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Root = withProvider(styled(ArkCombobox.Root<any>), 'root', {\n  defaultProps: {\n    loopFocus: true,\n  },\n})\n\nconst ClearTrigger = withContext(styled(ArkCombobox.ClearTrigger), 'clearTrigger')\nconst Content = withContext(styled(ArkCombobox.Content), 'content')\nconst Input = withContext(styled(ArkCombobox.Input), 'input')\nconst Control = withContext(styled(ArkCombobox.Control), 'control')\nconst Item = withContext(styled(ArkCombobox.Item), 'item')\nconst ItemText = withContext(styled(ArkCombobox.ItemText), 'itemText')\nconst Positioner = withContext(styled(ArkCombobox.Positioner), 'positioner')\nconst Trigger = withContext(styled(ArkCombobox.Trigger), 'trigger')\n\nexport type ComboboxItem = {\n  value: string | number\n  label: string\n  disabled?: boolean\n  tooltip?: ReactNode\n}\n\nexport type ComboboxProps<T extends ComboboxItem> = Omit<ComboboxRootProps<T>, 'collection' | 'value'> & {\n  value?: Array<string | number>\n  items?: T[]\n  initialItems?: T[]\n  renderItem?: (item: T) => ReactNode\n  loadItems?: (inputValue: string) => Promise<T[]>\n  debounceMs?: number\n  emptyLabel?: ReactNode\n  loadingLabel?: ReactNode\n  placeholder?: string\n  usePortal?: boolean\n  isLoading?: boolean\n  withAutoFilter?: boolean\n  onResetInitialItems?: () => void\n  openDropdownOnFocus?: boolean\n  clearValueWhenEmpty?: boolean\n  virtualized?: boolean\n  rowHeight?: number\n  returnItemsOnEmpty?: boolean\n} & HTMLStyledProps<'div'> &\n  RecipeVariantProps<typeof combobox>\n\nconst MultipleUncheckedIndicator: FC = () => (\n  <svg width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect x=\"0.5\" y=\"1\" width=\"15\" height=\"15\" rx=\"3.5\" fill=\"white\" />\n    <rect x=\"0.5\" y=\"1\" width=\"15\" height=\"15\" rx=\"3.5\" className={css({ stroke: 'grey.100' })} />\n  </svg>\n)\n\nconst MultipleCheckedIndicator: FC = () => (\n  <svg width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect y=\"0.5\" width=\"16\" height=\"16\" rx=\"4\" className={css({ fill: 'primary.500' })} />\n    <path\n      fillRule=\"evenodd\"\n      clipRule=\"evenodd\"\n      d=\"M11.958 4.81298C12.1303 4.92787 12.1769 5.16069 12.062 5.33301L7.56202 12.083C7.4997 12.1765 7.39875 12.2371 7.28695 12.2482C7.17515 12.2592 7.06428 12.2196 6.98483 12.1402L3.98483 9.14017C3.83839 8.99372 3.83839 8.75628 3.98483 8.60984C4.13128 8.46339 4.36872 8.46339 4.51517 8.60984L7.19172 11.2864L11.438 4.91699C11.5529 4.74467 11.7857 4.6981 11.958 4.81298Z\"\n      fill=\"white\"\n    />\n  </svg>\n)\n\ninterface InnerItemProps<Item extends ComboboxItem> {\n  item: Item\n  isMultiple?: boolean\n  renderItem?: (item: Item) => ReactNode\n}\n\nfunction CustomInnerItem<Item extends ComboboxItem>({ item, isMultiple, renderItem }: InnerItemProps<Item>) {\n  const context = useComboboxItemContext()\n\n  return (\n    <>\n      {isMultiple ? context.selected ? <MultipleCheckedIndicator /> : <MultipleUncheckedIndicator /> : null}\n      {renderItem ? renderItem(item) : <ItemText truncate>{item.label}</ItemText>}\n    </>\n  )\n}\n\nexport const Combobox = <T extends ComboboxItem>({\n  items: itemsFromUsers = [],\n  initialItems,\n  debounceMs = 0,\n  placeholder,\n  emptyLabel,\n  loadingLabel,\n  usePortal = true,\n  withAutoFilter = true,\n  positioning,\n  loadItems,\n  renderItem,\n  onResetInitialItems,\n  isLoading: controlledIsLoading,\n  value,\n  openDropdownOnFocus = true,\n  clearValueWhenEmpty = true,\n  virtualized,\n  rowHeight = 34,\n  returnItemsOnEmpty,\n  ...props\n}: ComboboxProps<T>) => {\n  const [items, setItems] = useState(() => itemsFromUsers)\n  const [isLoading, setIsLoading] = useState(false)\n  const [firstQueryTriggered, setFirstQueryTriggered] = useState(false)\n  const asyncMode = typeof loadItems === 'function'\n\n  const debouncedLoadItems = useMemo(\n    () =>\n      loadItems\n        ? debounce(async (value: string) => {\n            try {\n              setFirstQueryTriggered(true)\n              setIsLoading(true)\n              const newItems = await loadItems(value)\n              setItems(newItems)\n            } catch (error) {\n              console.error(error)\n              setItems([])\n            } finally {\n              setIsLoading(false)\n            }\n          }, debounceMs)\n        : null,\n    [loadItems, debounceMs],\n  )\n\n  const allItems = [...items, ...(initialItems ?? [])]\n\n  const handleInputChange = useCallback(\n    async (details: ArkCombobox.InputValueChangeDetails) => {\n      if (\n        initialItems &&\n        initialItems.length > 0 &&\n        !initialItems.find((item: ComboboxItem) => item.label === details.inputValue)\n      ) {\n        onResetInitialItems?.()\n      }\n      const { inputValue } = details\n\n      if (debouncedLoadItems) {\n        debouncedLoadItems(inputValue)\n      } else {\n        const items =\n          withAutoFilter && inputValue !== ''\n            ? itemsFromUsers.filter((item: ComboboxItem) => item.label.toLowerCase().includes(inputValue.toLowerCase()))\n            : itemsFromUsers\n\n        if (items.length === 0 && returnItemsOnEmpty) {\n          return setItems(itemsFromUsers)\n        }\n        setItems(items)\n      }\n    },\n    [debouncedLoadItems, itemsFromUsers, withAutoFilter],\n  )\n\n  useEffect(() => {\n    if (!withAutoFilter && !debouncedLoadItems) {\n      setItems(itemsFromUsers)\n    }\n  }, [itemsFromUsers, withAutoFilter, debouncedLoadItems])\n\n  const collection = useMemo(() => createListCollection({ items: allItems }), [allItems])\n\n  const effectiveIsLoading = controlledIsLoading ?? isLoading\n\n  const loadingContent = loadingLabel ?? (\n    <Text p=\"space-8\" textAlign=\"center\">\n      Chargement...\n    </Text>\n  )\n  const emptyContent = emptyLabel ?? (\n    <Text p=\"space-8\" textAlign=\"center\">\n      Aucun résultat\n    </Text>\n  )\n  // TODO: const multiple = props.multiple\n  // TODO: multiple design, using input chips https://ark-ui.com/reat/examples/combobox-with-tags-input\n  const multiple = false\n\n  return (\n    <Root\n      lazyMount\n      unmountOnExit\n      collection={collection}\n      positioning={{ sameWidth: true, gutter: 0, ...positioning }}\n      data-recipe=\"combobox\"\n      onInputValueChange={handleInputChange}\n      value={value as string[] | undefined}\n      {...props}\n      // TODO: multiple design\n      multiple={multiple}\n    >\n      <Control>\n        <ArkCombobox.Context>\n          {api => (\n            <Input\n              asChild\n              placeholder={placeholder}\n              onInput={(e: React.FormEvent<HTMLInputElement>) => {\n                const value = e.currentTarget.value\n\n                if (clearValueWhenEmpty && value === '') {\n                  api.clearValue()\n                }\n              }}\n              onFocus={() => {\n                if (!openDropdownOnFocus || asyncMode) return\n                api.setOpen(true)\n              }}\n            >\n              <UIInput />\n            </Input>\n          )}\n        </ArkCombobox.Context>\n        <Trigger asChild hidden={asyncMode && (!initialItems || initialItems.length === 0)}>\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              fillRule=\"evenodd\"\n              clipRule=\"evenodd\"\n              d=\"M12.5303 16.2803C12.2374 16.5732 11.7626 16.5732 11.4697 16.2803L3.96967 8.78033C3.67678 8.48744 3.67678 8.01256 3.96967 7.71967C4.26256 7.42678 4.73744 7.42678 5.03033 7.71967L12 14.6893L18.9697 7.71967C19.2626 7.42678 19.7374 7.42678 20.0303 7.71967C20.3232 8.01256 20.3232 8.48744 20.0303 8.78033L12.5303 16.2803Z\"\n              fill=\"currentColor\"\n            />\n          </svg>\n        </Trigger>\n        <ClearTrigger disabled={props.readOnly} onClick={onResetInitialItems} asChild>\n          <button>\n            <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M10 3.125C6.20304 3.125 3.125 6.20304 3.125 10C3.125 13.797 6.20304 16.875 10 16.875C13.797 16.875 16.875 13.797 16.875 10C16.875 6.20304 13.797 3.125 10 3.125ZM1.875 10C1.875 5.51269 5.51269 1.875 10 1.875C14.4873 1.875 18.125 5.51269 18.125 10C18.125 14.4873 14.4873 18.125 10 18.125C5.51269 18.125 1.875 14.4873 1.875 10ZM7.68306 7.68306C7.92714 7.43898 8.32286 7.43898 8.56694 7.68306L10 9.11612L11.4331 7.68306C11.6771 7.43898 12.0729 7.43898 12.3169 7.68306C12.561 7.92714 12.561 8.32286 12.3169 8.56694L10.8839 10L12.3169 11.4331C12.561 11.6771 12.561 12.0729 12.3169 12.3169C12.0729 12.561 11.6771 12.561 11.4331 12.3169L10 10.8839L8.56694 12.3169C8.32286 12.561 7.92714 12.561 7.68306 12.3169C7.43898 12.0729 7.43898 11.6771 7.68306 11.4331L9.11612 10L7.68306 8.56694C7.43898 8.32286 7.43898 7.92714 7.68306 7.68306Z\"\n                fill=\"currentColor\"\n              />\n            </svg>\n          </button>\n        </ClearTrigger>\n      </Control>\n      <ConditionalWrapper when={usePortal} wrapper={children => <Portal>{children}</Portal>}>\n        <Positioner>\n          <Content>\n            {effectiveIsLoading ? (\n              loadingContent\n            ) : allItems.length === 0 ? (\n              <>{asyncMode ? (firstQueryTriggered ? emptyContent : loadingContent) : emptyContent}</>\n            ) : virtualized ? (\n              <>\n                <FixedSizeList\n                  height={Math.min(rowHeight * allItems.length, 180)}\n                  itemCount={allItems.length}\n                  itemSize={rowHeight}\n                  width=\"100%\"\n                >\n                  {({ index, style }) => (\n                    <ConditionalWrapper\n                      key={allItems[index].value}\n                      when={!!allItems[index].tooltip}\n                      wrapper={children => <Tooltip label={allItems[index].tooltip}>{children}</Tooltip>}\n                    >\n                      <Item key={allItems[index].value} item={allItems[index]} style={style}>\n                        <CustomInnerItem renderItem={renderItem} item={allItems[index]} isMultiple={multiple} />\n                      </Item>\n                    </ConditionalWrapper>\n                  )}\n                </FixedSizeList>\n              </>\n            ) : (\n              allItems.map(item => (\n                <ConditionalWrapper\n                  key={item.value}\n                  when={!!item.tooltip}\n                  wrapper={children => <Tooltip label={item.tooltip}>{children}</Tooltip>}\n                >\n                  <Item key={item.value} item={item}>\n                    <CustomInnerItem renderItem={renderItem} item={item} isMultiple={multiple} />\n                  </Item>\n                </ConditionalWrapper>\n              ))\n            )}\n          </Content>\n        </Positioner>\n      </ConditionalWrapper>\n    </Root>\n  )\n}\n"],"mappings":"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"}