@oneplatformdev/ui 0.1.99-beta.224 → 0.1.99-beta.226

package/CHANGELOG.md

@@ -1,3 +1,36 @@
+## 0.1.99-beta.226 (2026-02-23)
+
+### 🚀 Features
+
+- **Combobox:** add explicit type annotations for `onMount` callbacks and enforce await behavior ([22f68b2](https://github.com/oneplatformdev/core-web/commit/22f68b2))
+- **FormCombobox:** introduce `FormComboboxConditionProps` and refine type separation for single/multi-use scenarios ([c1a6779](https://github.com/oneplatformdev/core-web/commit/c1a6779))
+
+### 🧱 Updated Dependencies
+
+- Updated @oneplatformdev/utils to 0.1.99-beta.226
+- Updated @oneplatformdev/hooks to 0.1.99-beta.226
+- Updated @oneplatformdev/tokens to 0.1.99-beta.226
+
+### ❤️ Thank You
+
+- Bohdan Radchenko
+
+## 0.1.99-beta.225 (2026-02-22)
+
+### 🚀 Features
+
+- **FormCombobox:** refine type handling by omitting `value` and `onChange` from Single/MultiComboboxProps and updating default type inference ([ad76d91](https://github.com/oneplatformdev/core-web/commit/ad76d91))
+
+### 🧱 Updated Dependencies
+
+- Updated @oneplatformdev/utils to 0.1.99-beta.225
+- Updated @oneplatformdev/hooks to 0.1.99-beta.225
+- Updated @oneplatformdev/tokens to 0.1.99-beta.225
+
+### ❤️ Thank You
+
+- Bohdan Radchenko
+
 ## 0.1.99-beta.224 (2026-02-22)
 
 ### 🚀 Features

package/Combobox/Combobox.js

@@ -21,7 +21,7 @@ function pe(n) {
     listFooterAction: N,
     emptyAction: V,
     slotProps: X
-  } = n, y = n.type ?? ie, [Y, P] = h(!1), [f, C] = h(!1), [b, w] = h(!1), [p, L] = h(""), [O, S] = h(/* @__PURE__ */ new Map()), [d, $] = h([]), [q, J] = h([]), v = g((e) => {
+  } = n, y = n.type ?? ie, [Y, P] = h(!1), [f, C] = h(!1), [w, b] = h(!1), [p, L] = h(""), [O, S] = h(/* @__PURE__ */ new Map()), [d, $] = h([]), [q, J] = h([]), v = g((e) => {
     const s = (t) => {
       const r = [], a = (i) => {
         if (i)
@@ -53,7 +53,7 @@ function pe(n) {
     A?.length && v(A);
   }, [A]);
   const K = g(async (e) => {
-    w(e), e && (R(), L(""));
+    b(e), e && (R(), L(""));
   }, []), R = g(async (e) => {
     C(!0);
     try {
@@ -74,12 +74,12 @@ function pe(n) {
       let t = new Map(s);
       const r = t.has(e.value);
       return t.has(e.value) ? t = /* @__PURE__ */ new Map() : t.set(e.value, e), r ? n.onChange?.(void 0) : n.onChange?.(e.value), t;
-    }), w(!1)), n.type === "multi" && S((s) => {
+    }), b(!1)), n.type === "multi" && S((s) => {
       const t = new Map(s);
       return t.has(e.value) ? t.delete(e.value) : t.set(e.value, e), n.onChange?.(Array.from(t.keys())), t;
     });
   }, [n.type, n.onChange]), Z = g(() => {
-    n.onChange(void 0), S(/* @__PURE__ */ new Map()), w(!1);
+    n.onChange(void 0), S(/* @__PURE__ */ new Map()), b(!1);
   }, [n.onChange]), D = k(() => !!p && !d.length && !f, [f, d.length, p]), E = k(() => !d.length && !f, [f, d.length, p]), m = k(() => {
     const e = {
       options: d,
@@ -87,8 +87,8 @@ function pe(n) {
       search: p || "",
       setSearch: L,
       onChangeOption: M,
-      open: b,
-      setOpen: w,
+      open: w,
+      setOpen: b,
       loading: f,
       setLoading: C,
       isEmptyList: E,
@@ -112,13 +112,13 @@ function pe(n) {
       } };
     }
     throw new Error(`Combobox type ${y} is not supported`);
-  }, [x, f, b, d, p, O, E, D, v, M, n.type]);
+  }, [x, f, w, d, p, O, E, D, v, M, n.type]);
   oe(n.imperativeRef, () => m, [m]);
   const ee = g(async () => {
     if (n.onMount) {
       P(!0);
       try {
-        n.onMount?.(m);
+        y === "multi" ? await n.onMount?.(m) : await n.onMount?.(m);
       } finally {
         P(!1);
       }
@@ -129,7 +129,7 @@ function pe(n) {
   }, []), /* @__PURE__ */ T("div", { className: "w-full", children: /* @__PURE__ */ te(
     re,
     {
-      open: b,
+      open: w,
       onOpenChange: K,
       children: [
         /* @__PURE__ */ T(
@@ -137,7 +137,7 @@ function pe(n) {
           {
             value: u,
             type: y,
-            open: b,
+            open: w,
             initialLoading: Y,
             selectedOptions: O,
             flattenOptions: q,

package/Combobox/Combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.js","sources":["../../src/Combobox/Combobox.tsx"],"sourcesContent":["import {\n  Dispatch, JSX,\n  SetStateAction,\n  useCallback,\n  useEffect, useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { Popover } from '../Popover';\nimport { useDebounceCallback } from '@oneplatformdev/hooks';\nimport {\n  ComboboxCallbackStateParams, ComboboxCallbackStateParamsRenderHandler,\n  ComboboxOption,\n  ComboboxProps, ComboboxSelectedType,\n  DEFAULT_COMBOBOX_TYPE, MultiComboboxProps, SingleComboboxProps,\n} from './Combobox.types';\nimport { ComboboxRenderTrigger } from \"./ComboboxRenderTrigger\";\nimport { ComboboxRenderContent } from \"./ComboboxRenderContent\";\n\nexport function Combobox<Data extends object>(props: SingleComboboxProps<Data>): JSX.Element;\nexport function Combobox<Data extends object>(props: MultiComboboxProps<Data>): JSX.Element;\n\nexport function Combobox<Data extends object = object>(\n  props: ComboboxProps<Data, 'single'> | ComboboxProps<Data, 'multi'>\n): JSX.Element {\n  const {\n    value,\n    options: itemOptions,\n    placeholder,\n    disabled,\n    searchLabel,\n    emptyLabel,\n    fetchOptions,\n    renderTrigger,\n    commandInputAction,\n    renderList,\n    listHeadAction,\n    listFooterAction,\n    emptyAction,\n    slotProps,\n  } = props;\n\n  const type: ComboboxSelectedType = props.type ?? DEFAULT_COMBOBOX_TYPE;\n  type StateSingle = ComboboxCallbackStateParams<Data, 'single'>;\n  type StateMulti = ComboboxCallbackStateParams<Data, 'multi'>;\n  type State = StateSingle | StateMulti;\n\n  const [ initialLoading, setInitialLoading ] = useState(false);\n  const [ loading, setLoading ] = useState(false);\n\n  const [ open, setOpen ] = useState(false);\n  const [ searchTerm, setSearchTerm ] = useState('');\n\n  const [ selectedOptions, setSelectedOptions ] = useState<\n    Map<ComboboxOption<Data>['value'], ComboboxOption<Data>>\n  >(new Map());\n\n  const [ options, _setOptions ] = useState<ComboboxOption<Data>[]>([]);\n  const [ flattenOptions, setFlattenOptions ] = useState<ComboboxOption<Data>[]>([]);\n  const setOptions: Dispatch<SetStateAction<ComboboxOption<Data>[]>> = useCallback((stater) => {\n    const flatten = (next: ComboboxOption<Data>[]) => {\n      const res: ComboboxOption<Data>[] = [];\n      const walk = (nodes?: ComboboxOption<Data>[]) => {\n        if (!nodes) return;\n        for (const node of nodes) {\n          res.push(node);\n          if (node.items && node.items.length) walk(node.items);\n        }\n      };\n      walk(next);\n      setFlattenOptions((prev) => {\n        const isIncludedInRes = res.find(o => !!value && String(o.value) === String(value));\n\n        if (!isIncludedInRes) {\n          const selectedOption = selectedOptions.size ? Array.from(selectedOptions.values()) : undefined;\n          const current = (selectedOption || prev).find(o => !!value && String(o.value) === String(value))\n          if (current) return [ current, ...res ];\n        }\n\n        return res;\n      });\n    }\n    _setOptions((prev) => {\n      const next: ComboboxOption<Data>[] = typeof stater === 'function' ? stater(prev) : stater;\n      flatten(next);\n      setSelectedOptions(prevSelections => {\n        const nextSelections = new Map(prevSelections);\n        const vls = Array.isArray(value) ? value : [value];\n        for (const v of vls) {\n          if(!v) continue;\n          if(nextSelections.has(v)) continue;\n          const o = next.find(o => String(o.value).toLowerCase() === String(v).toLowerCase());\n          if(!o) continue;\n          nextSelections.set(o.value, o);\n        }\n        return nextSelections;\n      })\n      return next;\n    });\n  }, [ selectedOptions, value ])\n\n  useEffect(() => {\n    itemOptions?.length && setOptions(itemOptions);\n  }, [ itemOptions ]);\n\n  const handlePopoverOpen = useCallback(async (next: boolean) => {\n    setOpen(next);\n    if(next) {\n      void getData();\n      setSearchTerm('');\n    }\n  }, []);\n\n  const getData = useCallback(async (search?: string) => {\n    setLoading(true);\n    try {\n      const fetchedOptions = await fetchOptions(search);\n      setOptions(fetchedOptions);\n    } catch (error) {\n      console.error('Unexpected error while get option:', error);\n    } finally {\n      setLoading(false);\n    }\n  }, [ setOptions ]);\n  const debouncedGetData = useDebounceCallback(getData, 1000, {\n    leading: false,\n    trailing: true,\n  });\n\n  const handleSearchChange = useCallback((value: string) => {\n    setLoading(true);\n    setSearchTerm(value);\n    debouncedGetData(value);\n  }, []);\n\n  const onChangeOption = useCallback((option: ComboboxOption<Data>) => {\n    if(props.type === 'single') {\n      setSelectedOptions(prev => {\n        let next = new Map(prev);\n        const isSelected = next.has(option.value);\n\n        if(next.has(option.value)) next = new Map();\n        else next.set(option.value, option);\n\n        if(isSelected) props.onChange?.(undefined);\n        else props.onChange?.(option.value);\n\n        return next;\n      });\n      setOpen(false);\n    }\n\n    if(props.type === 'multi') {\n      setSelectedOptions(prev => {\n        const next = new Map(prev);\n        if(next.has(option.value)) next.delete(option.value);\n        else next.set(option.value, option);\n        props.onChange?.(Array.from(next.keys()));\n        return next;\n      });\n    }\n  }, [props.type, props.onChange]);\n\n  const handleClearSelections = useCallback(() => {\n    props.onChange(undefined);\n    setSelectedOptions(new Map());\n    setOpen(false);\n  }, [props.onChange]);\n\n  const isSearchedEmptyList = useMemo(() => {\n    return Boolean(searchTerm) && !options.length && !loading;\n  }, [ loading, options.length, searchTerm ])\n\n  const isEmptyList = useMemo(() => {\n    return !options.length && !loading;\n  }, [ loading, options.length, searchTerm ])\n\n  const callbackStateParams = useMemo((): State => {\n      const base = {\n        options,\n        setOptions,\n        search: searchTerm || '',\n        setSearch: setSearchTerm,\n        onChangeOption,\n        open,\n        setOpen,\n        loading,\n        setLoading,\n        isEmptyList,\n        isSearchedEmptyList,\n        placeholder,\n      }\n\n      const selectedOptionArray = Array.from(selectedOptions.values());\n\n      if(type === 'multi') {\n        const selectedOption = selectedOptionArray\n        const setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data>[] | undefined>> = (value) => {\n          setSelectedOptions((prevSet) => {\n            const prevStateArray = Array.from(prevSet.values());\n            const nextStateArray = typeof value === 'function'\n              ? (value as (prev: ComboboxOption<Data>[]) => ComboboxOption<Data>[])(prevStateArray)\n              : value;\n            if (!nextStateArray) return new Map();\n            return new Map(nextStateArray.map(o => [o.value, o]));\n          });\n        };\n        return { ...base, type: 'multi', selectedOption, setSelectedOption } satisfies StateMulti;\n      }\n\n      if(type === 'single') {\n        const selectedOption = selectedOptionArray[0]\n        const setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data> | undefined>> = (value) => {\n          setSelectedOptions((prevSet) => {\n            const [currentSingle] = Array.from(prevSet.values());\n            const nextValue = typeof value === 'function'\n              ? (value as (prev: ComboboxOption<Data> | undefined) => ComboboxOption<Data> | undefined)(currentSingle)\n              : value;\n\n            const nextMap = new Map<ComboboxOption<Data>['value'], ComboboxOption<Data>>();\n            if (nextValue) nextMap.set(nextValue.value, nextValue);\n            return nextMap;\n          });\n        };\n        return { ...base, type: 'single', selectedOption, setSelectedOption } satisfies StateSingle;\n      }\n\n      throw new Error(`Combobox type ${type} is not supported`);\n\n    }, [ placeholder, loading, open, options, searchTerm, selectedOptions, isEmptyList, isSearchedEmptyList, setOptions, onChangeOption, props.type ]);\n  useImperativeHandle(props.imperativeRef, () => callbackStateParams, [callbackStateParams]);\n\n  const runOnMount = useCallback(async () => {\n    if (!props.onMount) return;\n    setInitialLoading(true);\n    try {\n      if (type === 'multi') {\n        (props as MultiComboboxProps<Data>).onMount?.(callbackStateParams as StateMulti);\n      } else {\n        (props as SingleComboboxProps<Data>).onMount?.(callbackStateParams as StateSingle);\n      }\n    } finally {\n      setInitialLoading(false);\n    }\n  }, [ props.onMount, callbackStateParams ]);\n  useLayoutEffect(() => {\n    runOnMount();\n  }, []);\n\n  return (\n    <div className=\"w-full\">\n      <Popover\n        open={open}\n        onOpenChange={handlePopoverOpen}\n      >\n        <ComboboxRenderTrigger\n          value={value}\n          type={type}\n          open={open}\n          initialLoading={initialLoading}\n          selectedOptions={selectedOptions}\n          flattenOptions={flattenOptions}\n          onSelect={onChangeOption}\n          onClearSelections={handleClearSelections}\n          callbackStateParams={callbackStateParams}\n          renderTrigger={renderTrigger as ComboboxCallbackStateParamsRenderHandler<Data>}\n          placeholder={placeholder}\n          disabled={disabled}\n        />\n\n        <ComboboxRenderContent\n          value={value}\n          type={type}\n          options={options}\n          search={searchTerm}\n          onSearch={handleSearchChange}\n          onSelect={onChangeOption}\n          loading={loading}\n          isEmptyList={isEmptyList}\n          callbackStateParams={callbackStateParams}\n          commandInputAction={commandInputAction as ComboboxCallbackStateParamsRenderHandler<Data>}\n          renderList={renderList as ComboboxCallbackStateParamsRenderHandler<Data>}\n          listHeadAction={listHeadAction as ComboboxCallbackStateParamsRenderHandler<Data>}\n          listFooterAction={listFooterAction as ComboboxCallbackStateParamsRenderHandler<Data>}\n          emptyAction={emptyAction as ComboboxCallbackStateParamsRenderHandler<Data>}\n          slotProps={slotProps}\n          searchLabel={searchLabel}\n          emptyLabel={emptyLabel}\n        />\n      </Popover>\n    </div>\n  );\n}\n"],"names":["Combobox","props","value","itemOptions","placeholder","disabled","searchLabel","emptyLabel","fetchOptions","renderTrigger","commandInputAction","renderList","listHeadAction","listFooterAction","emptyAction","slotProps","type","DEFAULT_COMBOBOX_TYPE","initialLoading","setInitialLoading","useState","loading","setLoading","open","setOpen","searchTerm","setSearchTerm","selectedOptions","setSelectedOptions","options","_setOptions","flattenOptions","setFlattenOptions","setOptions","useCallback","stater","flatten","next","res","walk","nodes","node","prev","current","o","prevSelections","nextSelections","vls","v","useEffect","handlePopoverOpen","getData","search","fetchedOptions","error","debouncedGetData","useDebounceCallback","handleSearchChange","onChangeOption","option","isSelected","handleClearSelections","isSearchedEmptyList","useMemo","isEmptyList","callbackStateParams","base","selectedOptionArray","prevSet","prevStateArray","nextStateArray","selectedOption","currentSingle","nextValue","nextMap","useImperativeHandle","runOnMount","useLayoutEffect","jsx","jsxs","Popover","ComboboxRenderTrigger","ComboboxRenderContent"],"mappings":"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"}
+{"version":3,"file":"Combobox.js","sources":["../../src/Combobox/Combobox.tsx"],"sourcesContent":["import {\n  Dispatch, JSX,\n  SetStateAction,\n  useCallback,\n  useEffect, useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { Popover } from '../Popover';\nimport { useDebounceCallback } from '@oneplatformdev/hooks';\nimport {\n  ComboboxCallbackStateParams, ComboboxCallbackStateParamsRenderHandler,\n  ComboboxOption,\n  ComboboxProps, ComboboxSelectedType,\n  DEFAULT_COMBOBOX_TYPE, MultiComboboxProps, SingleComboboxProps,\n} from './Combobox.types';\nimport { ComboboxRenderTrigger } from \"./ComboboxRenderTrigger\";\nimport { ComboboxRenderContent } from \"./ComboboxRenderContent\";\n\nexport function Combobox<Data extends object>(props: SingleComboboxProps<Data>): JSX.Element;\nexport function Combobox<Data extends object>(props: MultiComboboxProps<Data>): JSX.Element;\n\nexport function Combobox<Data extends object = object>(\n  props: ComboboxProps<Data, 'single'> | ComboboxProps<Data, 'multi'>\n): JSX.Element {\n  const {\n    value,\n    options: itemOptions,\n    placeholder,\n    disabled,\n    searchLabel,\n    emptyLabel,\n    fetchOptions,\n    renderTrigger,\n    commandInputAction,\n    renderList,\n    listHeadAction,\n    listFooterAction,\n    emptyAction,\n    slotProps,\n  } = props;\n\n  const type: ComboboxSelectedType = props.type ?? DEFAULT_COMBOBOX_TYPE;\n  type StateSingle = ComboboxCallbackStateParams<Data, 'single'>;\n  type StateMulti = ComboboxCallbackStateParams<Data, 'multi'>;\n  type State = StateSingle | StateMulti;\n\n  const [ initialLoading, setInitialLoading ] = useState(false);\n  const [ loading, setLoading ] = useState(false);\n\n  const [ open, setOpen ] = useState(false);\n  const [ searchTerm, setSearchTerm ] = useState('');\n\n  const [ selectedOptions, setSelectedOptions ] = useState<\n    Map<ComboboxOption<Data>['value'], ComboboxOption<Data>>\n  >(new Map());\n\n  const [ options, _setOptions ] = useState<ComboboxOption<Data>[]>([]);\n  const [ flattenOptions, setFlattenOptions ] = useState<ComboboxOption<Data>[]>([]);\n  const setOptions: Dispatch<SetStateAction<ComboboxOption<Data>[]>> = useCallback((stater) => {\n    const flatten = (next: ComboboxOption<Data>[]) => {\n      const res: ComboboxOption<Data>[] = [];\n      const walk = (nodes?: ComboboxOption<Data>[]) => {\n        if (!nodes) return;\n        for (const node of nodes) {\n          res.push(node);\n          if (node.items && node.items.length) walk(node.items);\n        }\n      };\n      walk(next);\n      setFlattenOptions((prev) => {\n        const isIncludedInRes = res.find(o => !!value && String(o.value) === String(value));\n\n        if (!isIncludedInRes) {\n          const selectedOption = selectedOptions.size ? Array.from(selectedOptions.values()) : undefined;\n          const current = (selectedOption || prev).find(o => !!value && String(o.value) === String(value))\n          if (current) return [ current, ...res ];\n        }\n\n        return res;\n      });\n    }\n    _setOptions((prev) => {\n      const next: ComboboxOption<Data>[] = typeof stater === 'function' ? stater(prev) : stater;\n      flatten(next);\n      setSelectedOptions(prevSelections => {\n        const nextSelections = new Map(prevSelections);\n        const vls = Array.isArray(value) ? value : [value];\n        for (const v of vls) {\n          if(!v) continue;\n          if(nextSelections.has(v)) continue;\n          const o = next.find(o => String(o.value).toLowerCase() === String(v).toLowerCase());\n          if(!o) continue;\n          nextSelections.set(o.value, o);\n        }\n        return nextSelections;\n      })\n      return next;\n    });\n  }, [ selectedOptions, value ])\n\n  useEffect(() => {\n    itemOptions?.length && setOptions(itemOptions);\n  }, [ itemOptions ]);\n\n  const handlePopoverOpen = useCallback(async (next: boolean) => {\n    setOpen(next);\n    if(next) {\n      void getData();\n      setSearchTerm('');\n    }\n  }, []);\n\n  const getData = useCallback(async (search?: string) => {\n    setLoading(true);\n    try {\n      const fetchedOptions = await fetchOptions(search);\n      setOptions(fetchedOptions);\n    } catch (error) {\n      console.error('Unexpected error while get option:', error);\n    } finally {\n      setLoading(false);\n    }\n  }, [ setOptions ]);\n  const debouncedGetData = useDebounceCallback(getData, 1000, {\n    leading: false,\n    trailing: true,\n  });\n\n  const handleSearchChange = useCallback((value: string) => {\n    setLoading(true);\n    setSearchTerm(value);\n    debouncedGetData(value);\n  }, []);\n\n  const onChangeOption = useCallback((option: ComboboxOption<Data>) => {\n    if(props.type === 'single') {\n      setSelectedOptions(prev => {\n        let next = new Map(prev);\n        const isSelected = next.has(option.value);\n\n        if(next.has(option.value)) next = new Map();\n        else next.set(option.value, option);\n\n        if(isSelected) props.onChange?.(undefined);\n        else props.onChange?.(option.value);\n\n        return next;\n      });\n      setOpen(false);\n    }\n\n    if(props.type === 'multi') {\n      setSelectedOptions(prev => {\n        const next = new Map(prev);\n        if(next.has(option.value)) next.delete(option.value);\n        else next.set(option.value, option);\n        props.onChange?.(Array.from(next.keys()));\n        return next;\n      });\n    }\n  }, [props.type, props.onChange]);\n\n  const handleClearSelections = useCallback(() => {\n    props.onChange(undefined);\n    setSelectedOptions(new Map());\n    setOpen(false);\n  }, [props.onChange]);\n\n  const isSearchedEmptyList = useMemo(() => {\n    return Boolean(searchTerm) && !options.length && !loading;\n  }, [ loading, options.length, searchTerm ])\n\n  const isEmptyList = useMemo(() => {\n    return !options.length && !loading;\n  }, [ loading, options.length, searchTerm ])\n\n  const callbackStateParams = useMemo((): State => {\n      const base = {\n        options,\n        setOptions,\n        search: searchTerm || '',\n        setSearch: setSearchTerm,\n        onChangeOption,\n        open,\n        setOpen,\n        loading,\n        setLoading,\n        isEmptyList,\n        isSearchedEmptyList,\n        placeholder,\n      }\n\n      const selectedOptionArray = Array.from(selectedOptions.values());\n\n      if(type === 'multi') {\n        const selectedOption = selectedOptionArray\n        const setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data>[] | undefined>> = (value) => {\n          setSelectedOptions((prevSet) => {\n            const prevStateArray = Array.from(prevSet.values());\n            const nextStateArray = typeof value === 'function'\n              ? (value as (prev: ComboboxOption<Data>[]) => ComboboxOption<Data>[])(prevStateArray)\n              : value;\n            if (!nextStateArray) return new Map();\n            return new Map(nextStateArray.map(o => [o.value, o]));\n          });\n        };\n        return { ...base, type: 'multi', selectedOption, setSelectedOption } satisfies StateMulti;\n      }\n\n      if(type === 'single') {\n        const selectedOption = selectedOptionArray[0]\n        const setSelectedOption: Dispatch<SetStateAction<ComboboxOption<Data> | undefined>> = (value) => {\n          setSelectedOptions((prevSet) => {\n            const [currentSingle] = Array.from(prevSet.values());\n            const nextValue = typeof value === 'function'\n              ? (value as (prev: ComboboxOption<Data> | undefined) => ComboboxOption<Data> | undefined)(currentSingle)\n              : value;\n\n            const nextMap = new Map<ComboboxOption<Data>['value'], ComboboxOption<Data>>();\n            if (nextValue) nextMap.set(nextValue.value, nextValue);\n            return nextMap;\n          });\n        };\n        return { ...base, type: 'single', selectedOption, setSelectedOption } satisfies StateSingle;\n      }\n\n      throw new Error(`Combobox type ${type} is not supported`);\n\n    }, [ placeholder, loading, open, options, searchTerm, selectedOptions, isEmptyList, isSearchedEmptyList, setOptions, onChangeOption, props.type ]);\n  useImperativeHandle(props.imperativeRef, () => callbackStateParams, [callbackStateParams]);\n\n  const runOnMount = useCallback(async () => {\n    if (!props.onMount) return;\n    setInitialLoading(true);\n    try {\n      if (type === 'multi') {\n        await (props as MultiComboboxProps<Data>).onMount?.(callbackStateParams as StateMulti);\n      } else {\n        await (props as SingleComboboxProps<Data>).onMount?.(callbackStateParams as StateSingle);\n      }\n    } finally {\n      setInitialLoading(false);\n    }\n  }, [ props.onMount, callbackStateParams ]);\n  useLayoutEffect(() => {\n    runOnMount();\n  }, []);\n\n  return (\n    <div className=\"w-full\">\n      <Popover\n        open={open}\n        onOpenChange={handlePopoverOpen}\n      >\n        <ComboboxRenderTrigger\n          value={value}\n          type={type}\n          open={open}\n          initialLoading={initialLoading}\n          selectedOptions={selectedOptions}\n          flattenOptions={flattenOptions}\n          onSelect={onChangeOption}\n          onClearSelections={handleClearSelections}\n          callbackStateParams={callbackStateParams}\n          renderTrigger={renderTrigger as ComboboxCallbackStateParamsRenderHandler<Data>}\n          placeholder={placeholder}\n          disabled={disabled}\n        />\n\n        <ComboboxRenderContent\n          value={value}\n          type={type}\n          options={options}\n          search={searchTerm}\n          onSearch={handleSearchChange}\n          onSelect={onChangeOption}\n          loading={loading}\n          isEmptyList={isEmptyList}\n          callbackStateParams={callbackStateParams}\n          commandInputAction={commandInputAction as ComboboxCallbackStateParamsRenderHandler<Data>}\n          renderList={renderList as ComboboxCallbackStateParamsRenderHandler<Data>}\n          listHeadAction={listHeadAction as ComboboxCallbackStateParamsRenderHandler<Data>}\n          listFooterAction={listFooterAction as ComboboxCallbackStateParamsRenderHandler<Data>}\n          emptyAction={emptyAction as ComboboxCallbackStateParamsRenderHandler<Data>}\n          slotProps={slotProps}\n          searchLabel={searchLabel}\n          emptyLabel={emptyLabel}\n        />\n      </Popover>\n    </div>\n  );\n}\n"],"names":["Combobox","props","value","itemOptions","placeholder","disabled","searchLabel","emptyLabel","fetchOptions","renderTrigger","commandInputAction","renderList","listHeadAction","listFooterAction","emptyAction","slotProps","type","DEFAULT_COMBOBOX_TYPE","initialLoading","setInitialLoading","useState","loading","setLoading","open","setOpen","searchTerm","setSearchTerm","selectedOptions","setSelectedOptions","options","_setOptions","flattenOptions","setFlattenOptions","setOptions","useCallback","stater","flatten","next","res","walk","nodes","node","prev","current","o","prevSelections","nextSelections","vls","v","useEffect","handlePopoverOpen","getData","search","fetchedOptions","error","debouncedGetData","useDebounceCallback","handleSearchChange","onChangeOption","option","isSelected","handleClearSelections","isSearchedEmptyList","useMemo","isEmptyList","callbackStateParams","base","selectedOptionArray","prevSet","prevStateArray","nextStateArray","selectedOption","currentSingle","nextValue","nextMap","useImperativeHandle","runOnMount","useLayoutEffect","jsx","jsxs","Popover","ComboboxRenderTrigger","ComboboxRenderContent"],"mappings":"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"}

package/Combobox/Combobox.stories.js

@@ -1,5 +1,5 @@
 import { jsx as t, jsxs as r } from "react/jsx-runtime";
-import { useState as g, useMemo as v } from "react";
+import { useState as v, useMemo as g } from "react";
 import { Combobox as m } from "./Combobox.js";
 const f = (e) => new Promise((n) => setTimeout(n, e)), O = (e = []) => {
   const n = [], l = (a) => {
@@ -87,7 +87,7 @@ const f = (e) => new Promise((n) => setTimeout(n, e)), O = (e = []) => {
   ...n.items ? x(n.items) : []
 ]);
 function o({ initialValue: e = "", ...n }) {
-  const [l, a] = g(e), s = v(
+  const [l, a] = v(e), s = g(
     () => n.fetchOptions,
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
@@ -101,7 +101,7 @@ function o({ initialValue: e = "", ...n }) {
   ] });
 }
 function C({ initialValue: e = [], ...n }) {
-  const [l, a] = g(e), s = v(() => n.fetchOptions, []);
+  const [l, a] = v(e), s = g(() => n.fetchOptions, []);
   return /* @__PURE__ */ r("div", { className: "max-w-sm", children: [
     /* @__PURE__ */ t(
       m,
@@ -119,7 +119,7 @@ function C({ initialValue: e = [], ...n }) {
     ] })
   ] });
 }
-const L = {
+const M = {
   title: "Combobox",
   component: m,
   parameters: {
@@ -145,7 +145,7 @@ const L = {
   decorators: [
     (e) => /* @__PURE__ */ t("div", { className: "p-6 w-[420px]", children: /* @__PURE__ */ t(e, {}) })
   ]
-}, M = {
+}, L = {
   render: (e) => /* @__PURE__ */ t(o, { ...e })
 }, P = {
   render: (e) => /* @__PURE__ */ t(o, { ...e, initialValue: "pl" })
@@ -256,7 +256,7 @@ const L = {
   args: {
     fetchOptions: d(i, 250),
     onMount: async (e) => {
-      await f(900), e.setOptions(i), e.setLoading(!1);
+      await f(900), e.setOptions(i);
     }
   },
   render: (e) => /* @__PURE__ */ t(o, { ...e })
@@ -275,7 +275,7 @@ const L = {
   render: (e) => /* @__PURE__ */ t(o, { ...e })
 };
 export {
-  M as Default,
+  L as Default,
   T as Disabled,
   k as EmptyStateWithAction,
   W as NestedOptions,
@@ -288,6 +288,6 @@ export {
   B as WithListHeadAction,
   V as WithStaticOptionsProp,
   P as WithValueSelected,
-  L as default
+  M as default
 };
 //# sourceMappingURL=Combobox.stories.js.map

package/Combobox/Combobox.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.stories.js","sources":["../../src/Combobox/Combobox.stories.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport type { Meta, StoryObj } from '@storybook/react';\n\nimport { Combobox } from './Combobox';\nimport {\n  ComboboxCallbackStateParams,\n  ComboboxOption,\n  ComboboxProps, MultiComboboxProps, SingleComboboxProps,\n} from './Combobox.types';\n\nconst sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));\n\nconst flatten = (nodes: ComboboxOption[] = []): ComboboxOption[] => {\n  const res: ComboboxOption[] = [];\n  const walk = (list?: ComboboxOption[]) => {\n    if (!list?.length) return;\n    for (const n of list) {\n      res.push(n);\n      if (n.items?.length) walk(n.items);\n    }\n  };\n  walk(nodes);\n  return res;\n};\n\nconst createFetchOptions =\n  (all: ComboboxOption[], delayMs = 350): ComboboxProps['fetchOptions'] =>\n    async (search?: string) => {\n      await sleep(delayMs);\n\n      const q = (search ?? '').trim().toLowerCase();\n      if (!q) return all;\n\n      // simple \"contains\" search across flattened options; then return top-level filtered\n      // (enough for Storybook demos; your real API can do better)\n      const allFlat = flatten(all);\n      const matchedValues = new Set(\n        allFlat\n          .filter((o) => String(o.label).toLowerCase().includes(q))\n          .map((o) => String(o.value)),\n      );\n\n      const filterTree = (list: ComboboxOption[]): ComboboxOption[] => {\n        return list\n          .map((n) => {\n            const items = n.items?.length ? filterTree(n.items) : undefined;\n            const selfMatch =\n              matchedValues.has(String(n.value)) ||\n              String(n.label).toLowerCase().includes(q);\n\n            if (!selfMatch && !items?.length) return null;\n            return { ...n, items };\n          })\n          .filter(Boolean) as ComboboxOption[];\n      };\n\n      return filterTree(all);\n    };\n\nconst BASE_OPTIONS: ComboboxOption[] = [\n  { value: 'ua', label: 'Ukraine' },\n  { value: 'pl', label: 'Poland' },\n  { value: 'de', label: 'Germany' },\n  { value: 'fr', label: 'France' },\n  { value: 'es', label: 'Spain' },\n  { value: 'it', label: 'Italy' },\n];\n\nconst NESTED_OPTIONS: ComboboxOption[] = [\n  {\n    value: 'europe',\n    label: 'Europe',\n    items: [\n      {\n        value: 'fr',\n        label: 'France',\n        items: [\n          {\n            value: 'paris',\n            label: 'Paris (Île-de-France)',\n            items: [\n              { value: 'paris-1', label: 'Paris 1st arrondissement' },\n              { value: 'paris-3', label: 'Paris 3rd arrondissement' },\n              { value: 'paris-10', label: 'Paris 10th arrondissement' },\n            ],\n          },\n          { value: 'marseille', label: 'Marseille (Provence-Alpes-Côte d\\'Azur)' },\n          {\n            value: 'lyon',\n            label: 'Lyon (Auvergne-Rhône-Alpes)',\n            items: [\n              { value: 'lyon-presquile', label: 'Presqu\\'île (1st/2nd)' },\n              { value: 'lyon-vieux', label: 'Vieux Lyon' },\n            ],\n          },\n          { value: 'toulouse', label: 'Toulouse (Occitanie)' },\n          { value: 'bordeaux', label: 'Bordeaux (Nouvelle-Aquitaine)' },\n          { value: 'strasbourg', label: 'Strasbourg (Grand Est)' },\n          {\n            value: 'rennes',\n            label: 'Rennes (Brittany)',\n            items: [\n              { value: 'rennes-centre', label: 'Rennes Centre' },\n              { value: 'rennes-beauregard', label: 'Beauregard' },\n            ],\n          },\n        ]\n      },\n      { value: 'ua', label: 'Ukraine' },\n      { value: 'pl', label: 'Poland' },\n      { value: 'de', label: 'Germany' },\n    ],\n  },\n  {\n    value: 'north-america',\n    label: 'North America',\n    items: [\n      { value: 'us', label: 'United States' },\n      { value: 'ca', label: 'Canada' },\n      { value: 'mx', label: 'Mexico' },\n      { value: 'north-america-long', label: 'To long option to test wrapping. '.repeat(3) },\n      { value: 'north-america-long-single', label: 'To long option to test wrapping. '.replace(/ /g, '_').repeat(3) },\n    ],\n  },\n];\nconst getFlattenOptions = (options: ComboboxOption[]) => {\n  return options.flatMap(option => [\n    option,\n    ...(option.items ? getFlattenOptions(option.items) : [])\n  ]);\n};\n\nconst getAllValues = (options: ComboboxOption[]): string[] => {\n  return getFlattenOptions(options).map(o => o.value)\n};\n\ntype ControlledProps<T extends ComboboxProps = ComboboxProps> = Omit<T, 'value' | 'onChange'> & {\n  initialValue?: T['value'];\n};\n\nfunction ControlledCombobox({ initialValue = '', ...args }: ControlledProps<SingleComboboxProps>) {\n  const [value, setValue] = useState<SingleComboboxProps['value']>(initialValue);\n  const fetchOptions = useMemo(\n    () => args.fetchOptions,\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  return (\n    <div className=\"max-w-sm\">\n      <Combobox type='single' {...args} value={value} onChange={setValue} fetchOptions={fetchOptions} />\n      <div className=\"mt-3 text-xs text-muted-foreground\">\n        value: <span className=\"font-mono\">{String(value || '')}</span>\n      </div>\n    </div>\n  );\n}\nfunction ControlledComboboxMulti({ initialValue = [], ...args }: ControlledProps<MultiComboboxProps>) {\n  const [value, setValue] = useState<MultiComboboxProps['value'] | undefined>(initialValue);\n  const fetchOptions = useMemo(() => args.fetchOptions, []);\n  return (\n    <div className=\"max-w-sm\">\n      <Combobox\n        {...args}\n        type='multi'\n        value={value}\n        onChange={setValue}\n        fetchOptions={fetchOptions}\n      />\n      <div className=\"mt-3 text-xs text-muted-foreground\">\n        value: <span className=\"font-mono\">{(value || []).join(', ')}</span>\n      </div>\n    </div>\n  );\n}\n\nconst meta = {\n  title: 'Combobox',\n  component: Combobox,\n  parameters: {\n    layout: 'centered',\n  },\n  args: {\n    placeholder: 'Select option...',\n    searchLabel: 'Type to search...',\n    emptyLabel: 'No options',\n    disabled: false,\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n  },\n  argTypes: {\n    fetchOptions: { control: false },\n    onChange: { control: false },\n    onMount: { control: false },\n    emptyAction: { control: false },\n    commandInputAction: { control: false },\n    listHeadAction: { control: false },\n    options: { control: false },\n    value: { control: false },\n  },\n  decorators: [\n    (Story) => (\n      <div className=\"p-6 w-[420px]\">\n        <Story />\n      </div>\n    ),\n  ],\n} satisfies Meta<typeof Combobox>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\n/** 1) Default (async options) */\nexport const Default: Story = {\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 2) With initial selected value */\nexport const WithValueSelected: Story = {\n  render: (args) => <ControlledCombobox {...args} initialValue=\"pl\" />,\n};\n\n/** 3) Disabled */\nexport const Disabled: Story = {\n  args: { disabled: true },\n  render: (args) => <ControlledCombobox {...args} initialValue=\"de\" />,\n};\n\n/** 4) Static options via `options` prop (no async needed, but fetchOptions still required) */\nexport const WithStaticOptionsProp: Story = {\n  args: {\n    options: BASE_OPTIONS,\n    fetchOptions: async () => BASE_OPTIONS,\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 5) Slow fetch to show loading state on open/search */\nexport const SlowFetchLoading: Story = {\n  args: {\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 1200),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 6) Empty state with action (search something like \"zzz\") */\nexport const EmptyStateWithAction: Story = {\n  args: {\n    emptyLabel: 'Nothing found',\n    emptyAction: (st: ComboboxCallbackStateParams) => {\n      const canCreate = Boolean(st.search?.trim());\n      return (\n        <button\n          type=\"button\"\n          className=\"inline-flex items-center justify-center rounded-md border px-3 py-1.5 text-sm\"\n          disabled={!canCreate}\n          onClick={() => {\n            const v = st.search.trim();\n            const next: ComboboxOption = { value: v, label: `Create \"${v}\"` };\n            st.setOptions([next]);\n            st.setLoading(false);\n          }}\n        >\n          Create option\n        </button>\n      );\n    },\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 7) commandInputAction (helper row under input) */\nexport const WithCommandInputAction: Story = {\n  args: {\n    commandInputAction: (st: ComboboxCallbackStateParams) => (\n      <div className=\"px-3 py-2 flex items-center justify-between text-xs text-muted-foreground\">\n        <span>\n          results: <span className=\"font-mono\">{st.options.length}</span>\n        </span>\n        <button\n          type=\"button\"\n          className=\"underline\"\n          onClick={() => {\n            st.setSearch('');\n            st.setLoading(false);\n          }}\n        >\n          Clear search\n        </button>\n      </div>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 8) listHeadAction (top action inside list) */\nexport const WithListHeadAction: Story = {\n  args: {\n    listHeadAction: (st: ComboboxCallbackStateParams) => (\n      <button\n        type=\"button\"\n        className=\"w-full text-left px-3 py-2 text-sm\"\n        onClick={() => {\n          st.setSearch('');\n          st.setOpen(false);\n        }}\n      >\n        Close list\n      </button>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 9) listHeadAction (footer action outside of list) */\nexport const WithListFooterAction: Story = {\n  args: {\n    listFooterAction: (st: ComboboxCallbackStateParams) => (\n      <button\n        type=\"button\"\n        className=\"w-full text-left min-h-10 text-sm\"\n        onClick={() => {\n          st.setSearch('');\n          st.setOpen(false);\n        }}\n      >\n        list footer action\n      </button>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 10) Nested options tree */\nexport const NestedOptions: Story = {\n  args: {\n    fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n    defaultNodeDisabled: false,\n    defaultNodeMatched: false,\n    defaultNodeMuted: true,\n    defaultNodeInteractive: false,\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 11) Multi Nested options tree */\nexport const NestedOptionsMulti: Story = {\n  args: {\n    fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n    onMount: async (st: ComboboxCallbackStateParams) => {\n      await sleep(900);\n      st.setOptions(getFlattenOptions(NESTED_OPTIONS));\n    },\n  },\n  render: (args) => {\n    const TEST_FULL = false;\n    const initialValues = TEST_FULL ? getAllValues(NESTED_OPTIONS): ['fr', 'de'];\n    return <ControlledComboboxMulti {...args} initialValue={initialValues} />\n  },\n};\n\n\n/** 12) onMount initial loading (simulate prefetch on mount) */\nexport const OnMountPrefetch: Story = {\n  args: {\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n    onMount: async (st: ComboboxCallbackStateParams) => {\n      await sleep(900);\n      st.setOptions(BASE_OPTIONS);\n      st.setLoading(false);\n    },\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 13) render custom trigger */\nexport const RenderCustomTrigger: Story = {\n  args: {\n    renderTrigger: (state) => {\n      console.log('state', state);\n      return (\n        <button\n          type=\"button\"\n          className=\"w-full\"\n          onClick={() => state.setOpen((o) => !o)}\n        >\n          {state.selectedOption ? `Selected: ${state.selectedOption.label}` : 'Select option...'}\n        </button>\n      )\n    }\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n"],"names":["sleep","ms","r","flatten","nodes","res","walk","list","n","createFetchOptions","all","delayMs","search","q","allFlat","matchedValues","o","filterTree","items","BASE_OPTIONS","NESTED_OPTIONS","getFlattenOptions","options","option","ControlledCombobox","initialValue","args","value","setValue","useState","fetchOptions","useMemo","jsxs","jsx","Combobox","ControlledComboboxMulti","meta","Story","Default","WithValueSelected","Disabled","WithStaticOptionsProp","SlowFetchLoading","EmptyStateWithAction","st","canCreate","v","next","WithCommandInputAction","WithListHeadAction","WithListFooterAction","NestedOptions","NestedOptionsMulti","OnMountPrefetch","RenderCustomTrigger","state"],"mappings":"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"}
+{"version":3,"file":"Combobox.stories.js","sources":["../../src/Combobox/Combobox.stories.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport type { Meta, StoryObj } from '@storybook/react';\n\nimport { Combobox } from './Combobox';\nimport {\n  ComboboxCallbackStateParams,\n  ComboboxOption,\n  ComboboxProps, MultiComboboxProps, SingleComboboxProps,\n} from './Combobox.types';\n\nconst sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));\n\nconst flatten = (nodes: ComboboxOption[] = []): ComboboxOption[] => {\n  const res: ComboboxOption[] = [];\n  const walk = (list?: ComboboxOption[]) => {\n    if (!list?.length) return;\n    for (const n of list) {\n      res.push(n);\n      if (n.items?.length) walk(n.items);\n    }\n  };\n  walk(nodes);\n  return res;\n};\n\nconst createFetchOptions =\n  (all: ComboboxOption[], delayMs = 350): ComboboxProps['fetchOptions'] =>\n    async (search?: string) => {\n      await sleep(delayMs);\n\n      const q = (search ?? '').trim().toLowerCase();\n      if (!q) return all;\n\n      // simple \"contains\" search across flattened options; then return top-level filtered\n      // (enough for Storybook demos; your real API can do better)\n      const allFlat = flatten(all);\n      const matchedValues = new Set(\n        allFlat\n          .filter((o) => String(o.label).toLowerCase().includes(q))\n          .map((o) => String(o.value)),\n      );\n\n      const filterTree = (list: ComboboxOption[]): ComboboxOption[] => {\n        return list\n          .map((n) => {\n            const items = n.items?.length ? filterTree(n.items) : undefined;\n            const selfMatch =\n              matchedValues.has(String(n.value)) ||\n              String(n.label).toLowerCase().includes(q);\n\n            if (!selfMatch && !items?.length) return null;\n            return { ...n, items };\n          })\n          .filter(Boolean) as ComboboxOption[];\n      };\n\n      return filterTree(all);\n    };\n\nconst BASE_OPTIONS: ComboboxOption[] = [\n  { value: 'ua', label: 'Ukraine' },\n  { value: 'pl', label: 'Poland' },\n  { value: 'de', label: 'Germany' },\n  { value: 'fr', label: 'France' },\n  { value: 'es', label: 'Spain' },\n  { value: 'it', label: 'Italy' },\n];\n\nconst NESTED_OPTIONS: ComboboxOption[] = [\n  {\n    value: 'europe',\n    label: 'Europe',\n    items: [\n      {\n        value: 'fr',\n        label: 'France',\n        items: [\n          {\n            value: 'paris',\n            label: 'Paris (Île-de-France)',\n            items: [\n              { value: 'paris-1', label: 'Paris 1st arrondissement' },\n              { value: 'paris-3', label: 'Paris 3rd arrondissement' },\n              { value: 'paris-10', label: 'Paris 10th arrondissement' },\n            ],\n          },\n          { value: 'marseille', label: 'Marseille (Provence-Alpes-Côte d\\'Azur)' },\n          {\n            value: 'lyon',\n            label: 'Lyon (Auvergne-Rhône-Alpes)',\n            items: [\n              { value: 'lyon-presquile', label: 'Presqu\\'île (1st/2nd)' },\n              { value: 'lyon-vieux', label: 'Vieux Lyon' },\n            ],\n          },\n          { value: 'toulouse', label: 'Toulouse (Occitanie)' },\n          { value: 'bordeaux', label: 'Bordeaux (Nouvelle-Aquitaine)' },\n          { value: 'strasbourg', label: 'Strasbourg (Grand Est)' },\n          {\n            value: 'rennes',\n            label: 'Rennes (Brittany)',\n            items: [\n              { value: 'rennes-centre', label: 'Rennes Centre' },\n              { value: 'rennes-beauregard', label: 'Beauregard' },\n            ],\n          },\n        ]\n      },\n      { value: 'ua', label: 'Ukraine' },\n      { value: 'pl', label: 'Poland' },\n      { value: 'de', label: 'Germany' },\n    ],\n  },\n  {\n    value: 'north-america',\n    label: 'North America',\n    items: [\n      { value: 'us', label: 'United States' },\n      { value: 'ca', label: 'Canada' },\n      { value: 'mx', label: 'Mexico' },\n      { value: 'north-america-long', label: 'To long option to test wrapping. '.repeat(3) },\n      { value: 'north-america-long-single', label: 'To long option to test wrapping. '.replace(/ /g, '_').repeat(3) },\n    ],\n  },\n];\nconst getFlattenOptions = (options: ComboboxOption[]) => {\n  return options.flatMap(option => [\n    option,\n    ...(option.items ? getFlattenOptions(option.items) : [])\n  ]);\n};\n\nconst getAllValues = (options: ComboboxOption[]): string[] => {\n  return getFlattenOptions(options).map(o => o.value)\n};\n\ntype ControlledProps<T extends ComboboxProps = ComboboxProps> = Omit<T, 'value' | 'onChange'> & {\n  initialValue?: T['value'];\n};\n\nfunction ControlledCombobox({ initialValue = '', ...args }: ControlledProps<SingleComboboxProps>) {\n  const [value, setValue] = useState<SingleComboboxProps['value']>(initialValue);\n  const fetchOptions = useMemo(\n    () => args.fetchOptions,\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  return (\n    <div className=\"max-w-sm\">\n      <Combobox type='single' {...args} value={value} onChange={setValue} fetchOptions={fetchOptions} />\n      <div className=\"mt-3 text-xs text-muted-foreground\">\n        value: <span className=\"font-mono\">{String(value || '')}</span>\n      </div>\n    </div>\n  );\n}\nfunction ControlledComboboxMulti({ initialValue = [], ...args }: ControlledProps<MultiComboboxProps>) {\n  const [value, setValue] = useState<MultiComboboxProps['value'] | undefined>(initialValue);\n  const fetchOptions = useMemo(() => args.fetchOptions, []);\n  return (\n    <div className=\"max-w-sm\">\n      <Combobox\n        {...args}\n        type='multi'\n        value={value}\n        onChange={setValue}\n        fetchOptions={fetchOptions}\n      />\n      <div className=\"mt-3 text-xs text-muted-foreground\">\n        value: <span className=\"font-mono\">{(value || []).join(', ')}</span>\n      </div>\n    </div>\n  );\n}\n\nconst meta = {\n  title: 'Combobox',\n  component: Combobox,\n  parameters: {\n    layout: 'centered',\n  },\n  args: {\n    placeholder: 'Select option...',\n    searchLabel: 'Type to search...',\n    emptyLabel: 'No options',\n    disabled: false,\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n  },\n  argTypes: {\n    fetchOptions: { control: false },\n    onChange: { control: false },\n    onMount: { control: false },\n    emptyAction: { control: false },\n    commandInputAction: { control: false },\n    listHeadAction: { control: false },\n    options: { control: false },\n    value: { control: false },\n  },\n  decorators: [\n    (Story) => (\n      <div className=\"p-6 w-[420px]\">\n        <Story />\n      </div>\n    ),\n  ],\n} satisfies Meta<typeof Combobox>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\n/** 1) Default (async options) */\nexport const Default: Story = {\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 2) With initial selected value */\nexport const WithValueSelected: Story = {\n  render: (args) => <ControlledCombobox {...args} initialValue=\"pl\" />,\n};\n\n/** 3) Disabled */\nexport const Disabled: Story = {\n  args: { disabled: true },\n  render: (args) => <ControlledCombobox {...args} initialValue=\"de\" />,\n};\n\n/** 4) Static options via `options` prop (no async needed, but fetchOptions still required) */\nexport const WithStaticOptionsProp: Story = {\n  args: {\n    options: BASE_OPTIONS,\n    fetchOptions: async () => BASE_OPTIONS,\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 5) Slow fetch to show loading state on open/search */\nexport const SlowFetchLoading: Story = {\n  args: {\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 1200),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 6) Empty state with action (search something like \"zzz\") */\nexport const EmptyStateWithAction: Story = {\n  args: {\n    emptyLabel: 'Nothing found',\n    emptyAction: (st: ComboboxCallbackStateParams) => {\n      const canCreate = Boolean(st.search?.trim());\n      return (\n        <button\n          type=\"button\"\n          className=\"inline-flex items-center justify-center rounded-md border px-3 py-1.5 text-sm\"\n          disabled={!canCreate}\n          onClick={() => {\n            const v = st.search.trim();\n            const next: ComboboxOption = { value: v, label: `Create \"${v}\"` };\n            st.setOptions([next]);\n            st.setLoading(false);\n          }}\n        >\n          Create option\n        </button>\n      );\n    },\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 7) commandInputAction (helper row under input) */\nexport const WithCommandInputAction: Story = {\n  args: {\n    commandInputAction: (st: ComboboxCallbackStateParams) => (\n      <div className=\"px-3 py-2 flex items-center justify-between text-xs text-muted-foreground\">\n        <span>\n          results: <span className=\"font-mono\">{st.options.length}</span>\n        </span>\n        <button\n          type=\"button\"\n          className=\"underline\"\n          onClick={() => {\n            st.setSearch('');\n            st.setLoading(false);\n          }}\n        >\n          Clear search\n        </button>\n      </div>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 8) listHeadAction (top action inside list) */\nexport const WithListHeadAction: Story = {\n  args: {\n    listHeadAction: (st: ComboboxCallbackStateParams) => (\n      <button\n        type=\"button\"\n        className=\"w-full text-left px-3 py-2 text-sm\"\n        onClick={() => {\n          st.setSearch('');\n          st.setOpen(false);\n        }}\n      >\n        Close list\n      </button>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 9) listHeadAction (footer action outside of list) */\nexport const WithListFooterAction: Story = {\n  args: {\n    listFooterAction: (st: ComboboxCallbackStateParams) => (\n      <button\n        type=\"button\"\n        className=\"w-full text-left min-h-10 text-sm\"\n        onClick={() => {\n          st.setSearch('');\n          st.setOpen(false);\n        }}\n      >\n        list footer action\n      </button>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 10) Nested options tree */\nexport const NestedOptions: Story = {\n  args: {\n    fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n    defaultNodeDisabled: false,\n    defaultNodeMatched: false,\n    defaultNodeMuted: true,\n    defaultNodeInteractive: false,\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 11) Multi Nested options tree */\nexport const NestedOptionsMulti: Story = {\n  args: {\n    fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n    onMount: async (st: ComboboxCallbackStateParams<object, 'single'>) => {\n      await sleep(900);\n      st.setOptions(getFlattenOptions(NESTED_OPTIONS));\n    },\n  },\n  render: (args) => {\n    const TEST_FULL = false;\n    const initialValues = TEST_FULL ? getAllValues(NESTED_OPTIONS): ['fr', 'de'];\n    return <ControlledComboboxMulti {...args} initialValue={initialValues} />\n  },\n};\n\n/** 12) onMount initial loading (simulate prefetch on mount) */\nexport const OnMountPrefetch: Story = {\n  args: {\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n    onMount: async (st: ComboboxCallbackStateParams<object, 'multi'>) => {\n      await sleep(900);\n      st.setOptions(BASE_OPTIONS);\n    },\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 13) render custom trigger */\nexport const RenderCustomTrigger: Story = {\n  args: {\n    renderTrigger: (state) => {\n      console.log('state', state);\n      return (\n        <button\n          type=\"button\"\n          className=\"w-full\"\n          onClick={() => state.setOpen((o) => !o)}\n        >\n          {state.selectedOption ? `Selected: ${state.selectedOption.label}` : 'Select option...'}\n        </button>\n      )\n    }\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n"],"names":["sleep","ms","r","flatten","nodes","res","walk","list","n","createFetchOptions","all","delayMs","search","q","allFlat","matchedValues","o","filterTree","items","BASE_OPTIONS","NESTED_OPTIONS","getFlattenOptions","options","option","ControlledCombobox","initialValue","args","value","setValue","useState","fetchOptions","useMemo","jsxs","jsx","Combobox","ControlledComboboxMulti","meta","Story","Default","WithValueSelected","Disabled","WithStaticOptionsProp","SlowFetchLoading","EmptyStateWithAction","st","canCreate","v","next","WithCommandInputAction","WithListHeadAction","WithListFooterAction","NestedOptions","NestedOptionsMulti","OnMountPrefetch","RenderCustomTrigger","state"],"mappings":"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"}

package/FormCombobox/FormCombobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormCombobox.js","sources":["../../src/FormCombobox/FormCombobox.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { Combobox, ComboboxSelectedType } from '../Combobox';\nimport {\n  FormComboboxMultiProps, FormComboboxProps,\n  FormComboboxSingleProps\n} from './FormCombobox.types';\nimport { FieldValues } from 'react-hook-form';\nimport { JSX } from \"react\";\n\ntype RestOmitedType<T> = Omit<T, 'form' | 'label' | 'tooltip' | 'tooltipProps' | 'name'>;\n\ntype RestPropsType<\n  T extends ComboboxSelectedType,\n  Data extends FieldValues,\n  Node extends object = object,\n> = T extends 'single'\n  ? RestOmitedType<FormComboboxSingleProps<Data, Node>>\n  : RestOmitedType<FormComboboxMultiProps<Data, Node>>\n\nexport function FormCombobox<\n  Data extends FieldValues,\n  Node extends object = object\n>(props: FormComboboxSingleProps<Data, Node>): JSX.Element;\nexport function FormCombobox<\n  Data extends FieldValues,\n  Node extends object = object\n>(props: FormComboboxMultiProps<Data, Node>): JSX.Element;\n\nexport function FormCombobox<\n  Data extends object = object,\n  Node extends object = object\n>(\n  // props: FormComboboxProps<Data, Node, 'single'> | FormComboboxProps<Data, Node, 'multi'>\n  props: FormComboboxProps<Data, Node>\n): JSX.Element {\n  const { form, label, tooltip, tooltipProps, name, imperativeRef, ...rest } = props;\n  const type = (props.type ?? 'single') as 'single' | 'multi';\n  return (\n    <FormRenderControl\n      form={form}\n      label={label}\n      tooltip={tooltip}\n      tooltipProps={tooltipProps}\n      name={name}\n      render={({ field }) => (\n        <FormControl>\n          {type === 'multi' ? (\n            <Combobox<Node>\n              {...(rest as RestPropsType<'multi', Data, Node>)}\n              {...field}\n              type=\"multi\"\n              imperativeRef={imperativeRef}\n              onChange={field.onChange}\n            />\n          ) : (\n            <Combobox<Node>\n              {...(rest as RestPropsType<'single', Data, Node>)}\n              {...field}\n              type=\"single\"\n              imperativeRef={imperativeRef}\n              onChange={field.onChange}\n            />\n          )}\n        </FormControl>\n      )}\n    />\n  );\n};\n"],"names":["FormCombobox","props","form","label","tooltip","tooltipProps","name","imperativeRef","rest","type","jsx","FormRenderControl","field","FormControl","Combobox"],"mappings":";;;;AA4BO,SAASA,EAKdC,GACa;AACb,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,eAAAC,GAAe,GAAGC,EAAA,IAASP,GACvEQ,IAAQR,EAAM,QAAQ;AAC5B,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAM,EAAA,MACT,gBAAAF,EAACG,GAAA,EACE,gBAAS,UACR,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAIN;AAAA,UACJ,GAAGI;AAAA,UACJ,MAAK;AAAA,UACL,eAAAL;AAAA,UACA,UAAUK,EAAM;AAAA,QAAA;AAAA,MAAA,IAGlB,gBAAAF;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAIN;AAAA,UACJ,GAAGI;AAAA,UACJ,MAAK;AAAA,UACL,eAAAL;AAAA,UACA,UAAUK,EAAM;AAAA,QAAA;AAAA,MAAA,EAClB,CAEJ;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"FormCombobox.js","sources":["../../src/FormCombobox/FormCombobox.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { Combobox, ComboboxSelectedType } from '../Combobox';\nimport {\n  FormComboboxMultiProps, FormComboboxProps,\n  FormComboboxSingleProps\n} from './FormCombobox.types';\nimport { FieldValues } from 'react-hook-form';\nimport { JSX } from \"react\";\n\ntype RestOmitedType<T> = Omit<T, 'form' | 'label' | 'tooltip' | 'tooltipProps' | 'name'>;\n\ntype RestPropsType<\n  T extends ComboboxSelectedType,\n  Data extends FieldValues,\n  Node extends object = object,\n> = T extends 'single'\n  ? RestOmitedType<FormComboboxSingleProps<Data, Node>>\n  : RestOmitedType<FormComboboxMultiProps<Data, Node>>\n\nexport function FormCombobox<\n  Data extends FieldValues,\n  Node extends object = object\n>(props: FormComboboxSingleProps<Data, Node>): JSX.Element;\nexport function FormCombobox<\n  Data extends FieldValues,\n  Node extends object = object\n>(props: FormComboboxMultiProps<Data, Node>): JSX.Element;\n\nexport function FormCombobox<\n  Data extends object = object,\n  Node extends object = object\n>(\n  props: FormComboboxProps<Data, Node>\n): JSX.Element {\n  const { form, label, tooltip, tooltipProps, name, imperativeRef, ...rest } = props;\n  const type = (props.type ?? 'single') as 'single' | 'multi';\n  return (\n    <FormRenderControl\n      form={form}\n      label={label}\n      tooltip={tooltip}\n      tooltipProps={tooltipProps}\n      name={name}\n      render={({ field }) => (\n        <FormControl>\n          {type === 'multi' ? (\n            <Combobox<Node>\n              {...(rest as RestPropsType<'multi', Data, Node>)}\n              {...field}\n              type=\"multi\"\n              imperativeRef={imperativeRef}\n              onChange={field.onChange}\n            />\n          ) : (\n            <Combobox<Node>\n              {...(rest as RestPropsType<'single', Data, Node>)}\n              {...field}\n              type=\"single\"\n              imperativeRef={imperativeRef}\n              onChange={field.onChange}\n            />\n          )}\n        </FormControl>\n      )}\n    />\n  );\n};\n"],"names":["FormCombobox","props","form","label","tooltip","tooltipProps","name","imperativeRef","rest","type","jsx","FormRenderControl","field","FormControl","Combobox"],"mappings":";;;;AA4BO,SAASA,EAIdC,GACa;AACb,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,eAAAC,GAAe,GAAGC,EAAA,IAASP,GACvEQ,IAAQR,EAAM,QAAQ;AAC5B,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAM,EAAA,MACT,gBAAAF,EAACG,GAAA,EACE,gBAAS,UACR,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAIN;AAAA,UACJ,GAAGI;AAAA,UACJ,MAAK;AAAA,UACL,eAAAL;AAAA,UACA,UAAUK,EAAM;AAAA,QAAA;AAAA,MAAA,IAGlB,gBAAAF;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAIN;AAAA,UACJ,GAAGI;AAAA,UACJ,MAAK;AAAA,UACL,eAAAL;AAAA,UACA,UAAUK,EAAM;AAAA,QAAA;AAAA,MAAA,EAClB,CAEJ;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/FormCombobox/FormCombobox.types.d.ts

@@ -1,9 +1,10 @@
 import { FieldValues } from 'react-hook-form';
-import { MultiComboboxProps, SingleComboboxProps } from '../Combobox';
+import { ComboboxSelectedType, MultiComboboxProps, SingleComboboxProps } from '../Combobox';
 import { FormRenderControlExtendProps } from '../Form';
 export interface FormComboboxSingleProps<Data extends FieldValues = FieldValues, Node extends object = object> extends FormRenderControlExtendProps<Data>, Omit<SingleComboboxProps<Node>, 'value' | 'onChange'> {
 }
 export interface FormComboboxMultiProps<Data extends FieldValues = FieldValues, Node extends object = object> extends FormRenderControlExtendProps<Data>, Omit<MultiComboboxProps<Node>, 'value' | 'onChange'> {
 }
+export type FormComboboxConditionProps<Data extends object = object, Node extends object = object, T extends ComboboxSelectedType = 'single'> = T extends 'single' ? FormComboboxSingleProps<Data, Node> : FormComboboxMultiProps<Data, Node>;
 export type FormComboboxProps<Data extends FieldValues = FieldValues, Node extends object = object> = FormComboboxSingleProps<Data, Node> | FormComboboxMultiProps<Data, Node>;
 //# sourceMappingURL=FormCombobox.types.d.ts.map

package/FormCombobox/FormCombobox.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormCombobox.types.d.ts","sourceRoot":"","sources":["../../src/FormCombobox/FormCombobox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAEL,kBAAkB,EAAE,mBAAmB,EACxC,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAC;AAEvD,MAAM,WAAW,uBAAuB,CACtC,IAAI,SAAS,WAAW,GAAG,WAAW,EACtC,IAAI,SAAS,MAAM,GAAG,MAAM,CAC5B,SAAQ,4BAA4B,CAAC,IAAI,CAAC,EAC1C,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;CACtD;AAED,MAAM,WAAW,sBAAsB,CACrC,IAAI,SAAS,WAAW,GAAG,WAAW,EACtC,IAAI,SAAS,MAAM,GAAG,MAAM,CAC5B,SAAQ,4BAA4B,CAAC,IAAI,CAAC,EAC1C,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;CACrD;AAUD,MAAM,MAAM,iBAAiB,CAC3B,IAAI,SAAS,WAAW,GAAG,WAAW,EACtC,IAAI,SAAS,MAAM,GAAG,MAAM,IAE1B,uBAAuB,CAAC,IAAI,EAAE,IAAI,CAAC,GACnC,sBAAsB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC"}
+{"version":3,"file":"FormCombobox.types.d.ts","sourceRoot":"","sources":["../../src/FormCombobox/FormCombobox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAAE,mBAAmB,EACxC,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAC;AAEvD,MAAM,WAAW,uBAAuB,CACtC,IAAI,SAAS,WAAW,GAAG,WAAW,EACtC,IAAI,SAAS,MAAM,GAAG,MAAM,CAC5B,SAAQ,4BAA4B,CAAC,IAAI,CAAC,EAC1C,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;CACtD;AAED,MAAM,WAAW,sBAAsB,CACrC,IAAI,SAAS,WAAW,GAAG,WAAW,EACtC,IAAI,SAAS,MAAM,GAAG,MAAM,CAC5B,SAAQ,4BAA4B,CAAC,IAAI,CAAC,EAC1C,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;CACrD;AAGD,MAAM,MAAM,0BAA0B,CACpC,IAAI,SAAS,MAAM,GAAG,MAAM,EAC5B,IAAI,SAAS,MAAM,GAAG,MAAM,EAC5B,CAAC,SAAS,oBAAoB,GAAG,QAAQ,IACvC,CAAC,SAAS,QAAQ,GAClB,uBAAuB,CAAC,IAAI,EAAE,IAAI,CAAC,GACnC,sBAAsB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;AAGvC,MAAM,MAAM,iBAAiB,CAC3B,IAAI,SAAS,WAAW,GAAG,WAAW,EACtC,IAAI,SAAS,MAAM,GAAG,MAAM,IAE1B,uBAAuB,CAAC,IAAI,EAAE,IAAI,CAAC,GACnC,sBAAsB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC"}

package/FormTextarea/FormTextarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormTextarea.d.ts","sourceRoot":"","sources":["../../src/FormTextarea/FormTextarea.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAI9C,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,WAAW,EACnD,OAAO,iBAAiB,CAAC,IAAI,CAAC,4CAsB/B,CAAC"}
+{"version":3,"file":"FormTextarea.d.ts","sourceRoot":"","sources":["../../src/FormTextarea/FormTextarea.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAI9C,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,WAAW,EACnD,OAAO,iBAAiB,CAAC,IAAI,CAAC,4CAuB/B,CAAC"}

package/FormTextarea/FormTextarea.js

@@ -1,30 +1,31 @@
 import { jsx as r } from "react/jsx-runtime";
-import { FormControl as s } from "../Form/Form.js";
-import { FormRenderControl as c } from "../Form/FormRenderControl.js";
-import { Textarea as f } from "../Textarea/Textarea.js";
-const v = (t) => {
-  const { form: e, label: m, tooltip: n, tooltipProps: a, name: p, containerProps: l, ...i } = t;
+import { FormControl as f } from "../Form/Form.js";
+import { FormRenderControl as u } from "../Form/FormRenderControl.js";
+import { Textarea as x } from "../Textarea/Textarea.js";
+const P = (e) => {
+  const { form: t, label: m, tooltip: n, tooltipProps: a, name: l, containerProps: p, counter: i, ...s } = e;
   return /* @__PURE__ */ r(
-    c,
+    u,
     {
-      form: e,
+      form: t,
       tooltip: n,
       tooltipProps: a,
-      name: p,
+      name: l,
       label: m,
-      containerProps: l,
-      render: ({ field: o }) => /* @__PURE__ */ r(s, { children: /* @__PURE__ */ r(
-        f,
+      containerProps: p,
+      render: ({ field: o, fieldState: c }) => /* @__PURE__ */ r(f, { children: /* @__PURE__ */ r(
+        x,
         {
           ...o,
           value: o.value || "",
-          ...i
+          ...s,
+          counter: c.error ? !1 : i
         }
       ) })
     }
   );
 };
 export {
-  v as FormTextarea
+  P as FormTextarea
 };
 //# sourceMappingURL=FormTextarea.js.map

package/FormTextarea/FormTextarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormTextarea.js","sources":["../../src/FormTextarea/FormTextarea.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { FormTextareaProps } from './FormTextarea.types';\nimport { FieldValues } from 'react-hook-form';\nimport { Textarea } from '../Textarea';\n\n// TODO: add description\nexport const FormTextarea = <Data extends FieldValues>(\n  props: FormTextareaProps<Data>\n) => {\nconst { form, label, tooltip, tooltipProps, name, containerProps, ...rest } = props;\n    return (\n        <FormRenderControl\n            form={form}\n            tooltip={tooltip}\n            tooltipProps={tooltipProps}\n            name={name}\n            label={label}\n            containerProps={containerProps}\n            render={({ field }) => (\n              <FormControl>\n                <Textarea\n                  {...field}\n                  value={field.value || ''}\n                  {...rest}\n                />\n              </FormControl>\n            )}\n        />\n    )\n};\n"],"names":["FormTextarea","props","form","label","tooltip","tooltipProps","name","containerProps","rest","jsx","FormRenderControl","field","FormControl","Textarea"],"mappings":";;;;AAMO,MAAMA,IAAe,CAC1BC,MACG;AACL,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,gBAAAC,GAAgB,GAAGC,EAAA,IAASP;AAC1E,SACI,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,MAAAR;AAAA,MACA,SAAAE;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAH;AAAA,MACA,gBAAAI;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAI,EAAA,wBACRC,GAAA,EACC,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAGF;AAAA,UACJ,OAAOA,EAAM,SAAS;AAAA,UACrB,GAAGH;AAAA,QAAA;AAAA,MAAA,EACN,CACF;AAAA,IAAA;AAAA,EAAA;AAId;"}
+{"version":3,"file":"FormTextarea.js","sources":["../../src/FormTextarea/FormTextarea.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { FormTextareaProps } from './FormTextarea.types';\nimport { FieldValues } from 'react-hook-form';\nimport { Textarea } from '../Textarea';\n\n// TODO: add description\nexport const FormTextarea = <Data extends FieldValues>(\n  props: FormTextareaProps<Data>\n) => {\n  const { form, label, tooltip, tooltipProps, name, containerProps, counter, ...rest } = props;\n  return (\n    <FormRenderControl\n      form={form}\n      tooltip={tooltip}\n      tooltipProps={tooltipProps}\n      name={name}\n      label={label}\n      containerProps={containerProps}\n      render={({ field, fieldState }) => (\n        <FormControl>\n          <Textarea\n            {...field}\n            value={field.value || ''}\n            {...rest}\n            counter={fieldState.error ? false : counter}\n          />\n        </FormControl>\n      )}\n    />\n  )\n};\n"],"names":["FormTextarea","props","form","label","tooltip","tooltipProps","name","containerProps","counter","rest","jsx","FormRenderControl","field","fieldState","FormControl","Textarea"],"mappings":";;;;AAMO,MAAMA,IAAe,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,gBAAAC,GAAgB,SAAAC,GAAS,GAAGC,EAAA,IAASR;AACvF,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,SAAAE;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAH;AAAA,MACA,gBAAAI;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAK,GAAO,YAAAC,EAAA,wBACfC,GAAA,EACC,UAAA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACE,GAAGH;AAAA,UACJ,OAAOA,EAAM,SAAS;AAAA,UACrB,GAAGH;AAAA,UACJ,SAASI,EAAW,QAAQ,KAAQL;AAAA,QAAA;AAAA,MAAA,EACtC,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oneplatformdev/ui",
-  "version": "0.1.99-beta.224",
+  "version": "0.1.99-beta.226",
   "description": "UI component library for OnePlatform",
   "author": "One Platform Development Team",
   "keywords": [
@@ -106,9 +106,9 @@
     "recharts": "^3.2.0",
     "sonner": "^2.0.7",
     "vaul": "^1.1.2",
-    "@oneplatformdev/utils": "^0.1.99-beta.224",
-    "@oneplatformdev/hooks": "^0.1.99-beta.224",
-    "@oneplatformdev/tokens": "^0.1.99-beta.224"
+    "@oneplatformdev/hooks": "^0.1.99-beta.226",
+    "@oneplatformdev/utils": "^0.1.99-beta.226",
+    "@oneplatformdev/tokens": "^0.1.99-beta.226"
   },
   "scripts": {
     "chromatic": "chromatic"