@scbt-ecom/ui 0.99.0 → 0.100.0

package/dist/lib/shared/ui/dropdownList/hooks/model/index.js

@@ -0,0 +1,2 @@
+import{scrollTo as l}from"./scrollTo.js";export{l as scrollTo};
+//# sourceMappingURL=index.js.map

package/dist/lib/shared/ui/dropdownList/hooks/model/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/lib/shared/ui/dropdownList/hooks/model/scrollTo.js

@@ -0,0 +1,2 @@
+import{listNavigate as c}from"../../model/utils.js";const g=4,d=(l,r)=>{const{options:t,elements:i,container:e,focusedIndex:n,behavior:a}=r;let o=c(n,l,t.length);for(;t[o].disabled;)o=c(o,l,t.length);const s=i[o],f=e.scrollTop,p=e.scrollTop+e.clientHeight;if(s.offsetTop<f||s.offsetTop>p){const T=s.offsetTop-e.offsetTop-g,h=n===0&&o===t.length-1||n===t.length-1&&o===0?"instant":"smooth";e.scrollTo({top:T,behavior:a||h})}return o};export{d as scrollTo};
+//# sourceMappingURL=scrollTo.js.map

package/dist/lib/shared/ui/dropdownList/hooks/model/scrollTo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollTo.js","sources":["../../../../../../../lib/shared/ui/dropdownList/hooks/model/scrollTo.ts"],"sourcesContent":["import { listNavigate } from '../../model'\nimport type { DropdownItemOption } from '../../ui/dropdownItem'\n\nconst ELEMENT_OFFSET = 4\n\ntype ScrollToProps = {\n  focusedIndex: number\n  options: DropdownItemOption[]\n  elements: HTMLElement[]\n  container: HTMLElement\n  behavior?: 'smooth' | 'instant'\n}\n\nexport const scrollTo = (direction: 1 | -1, params: ScrollToProps) => {\n  const { options, elements, container, focusedIndex, behavior: defaultBehavior } = params\n\n  let currentIndex = listNavigate(focusedIndex, direction, options.length)\n\n  while (options[currentIndex].disabled) {\n    currentIndex = listNavigate(currentIndex, direction, options.length)\n  }\n\n  const scrollElement = elements[currentIndex]\n\n  const containerTop = container.scrollTop\n  const containerBottom = container.scrollTop + container.clientHeight\n\n  if (scrollElement.offsetTop < containerTop || scrollElement.offsetTop > containerBottom) {\n    const scrollTop = scrollElement.offsetTop - container.offsetTop - ELEMENT_OFFSET\n\n    const behavior =\n      (focusedIndex === 0 && currentIndex === options.length - 1) || (focusedIndex === options.length - 1 && currentIndex === 0)\n        ? 'instant'\n        : 'smooth'\n\n    container.scrollTo({\n      top: scrollTop,\n      behavior: defaultBehavior || behavior\n    })\n  }\n\n  return currentIndex\n}\n"],"names":["ELEMENT_OFFSET","scrollTo","direction","params","options","elements","container","focusedIndex","defaultBehavior","currentIndex","listNavigate","scrollElement","containerTop","containerBottom","scrollTop","behavior"],"mappings":"oDAGA,MAAMA,EAAiB,EAUVC,EAAW,CAACC,EAAmBC,IAA0B,CACpE,KAAM,CAAE,QAAAC,EAAS,SAAAC,EAAU,UAAAC,EAAW,aAAAC,EAAc,SAAUC,GAAoBL,EAElF,IAAIM,EAAeC,EAAaH,EAAcL,EAAWE,EAAQ,MAAM,EAEvE,KAAOA,EAAQK,CAAY,EAAE,UAC3BA,EAAeC,EAAaD,EAAcP,EAAWE,EAAQ,MAAM,EAGrE,MAAMO,EAAgBN,EAASI,CAAY,EAErCG,EAAeN,EAAU,UACzBO,EAAkBP,EAAU,UAAYA,EAAU,aAExD,GAAIK,EAAc,UAAYC,GAAgBD,EAAc,UAAYE,EAAiB,CACvF,MAAMC,EAAYH,EAAc,UAAYL,EAAU,UAAYN,EAE5De,EACHR,IAAiB,GAAKE,IAAiBL,EAAQ,OAAS,GAAOG,IAAiBH,EAAQ,OAAS,GAAKK,IAAiB,EACpH,UACA,SAENH,EAAU,SAAS,CACjB,IAAKQ,EACL,SAAUN,GAAmBO,CAAA,CAC9B,CACH,CAEA,OAAON,CACT"}

package/dist/lib/shared/ui/dropdownList/hooks/useKeyboardNavigation.js

@@ -1,2 +1,2 @@
-import{useState as I,useRef as T,useMemo as R,useEffect as p}from"react";import{isOptionActive as A,listNavigate as h}from"../model/utils.js";const m=4,F=({options:t,multiple:b,onPick:a,value:g})=>{const[n,f]=I(0),l=T(null),u=T([]),w=R(()=>({setReference:r=>{r&&u.current.push(r)},setRoot:()=>l}),[]);return p(()=>{if(!l.current)return;const r=l.current;let o=-1;for(let e=0;e<t.length;e+=1)if(A(t[e],g)){f(e),o=e;break}const s=u.current[o];if(s){const e=s.offsetTop-r.offsetTop-m;r.scrollTo({top:e,behavior:"instant"})}},[t]),p(()=>{if(!l.current)return;const r=new AbortController,o=l.current;return window.addEventListener("keydown",s=>{let e=-1;switch(s.key){case"ArrowUp":s.preventDefault(),e=-1;break;case"ArrowDown":s.preventDefault(),e=1;break;case"Enter":if(s.preventDefault(),n<0)return;const d=t[n];a==null||a(d),b||f(0);return;default:return}let c=h(n,e,t.length);for(;t[c].disabled;)c=h(c,e,t.length);const i=u.current[c],E=o.scrollTop,v=o.scrollTop+o.clientHeight;if(i.offsetTop<E||i.offsetTop>v){const d=i.offsetTop-o.offsetTop-m,x=n===0&&c===t.length-1||n===t.length-1&&c===0?"instant":"smooth";o.scrollTo({top:d,behavior:x})}f(c)},{signal:r.signal}),()=>{r.abort()}},[n,t]),{refs:w,focusedIndex:n,setFocusedIndex:f}};export{F as useKeyboardNavigation};
+import{useState as x,useRef as i,useMemo as I,useEffect as d}from"react";import{isOptionActive as v}from"../model/utils.js";import{scrollTo as m}from"./model/scrollTo.js";const h=({options:r,multiple:b,onPick:a,value:p})=>{const[o,s]=x(0),c=i(null),l=i([]),w=I(()=>({setReference:t=>{t&&l.current.push(t)},setRoot:()=>c}),[]);return d(()=>{if(!c.current)return;const t=c.current;let f=-1;for(let e=0;e<r.length;e+=1)if(v(r[e],p)){s(e),f=e;break}const n=l.current[f];if(n){const e=n.offsetTop-t.offsetTop-4;t.scrollTo({top:e,behavior:"instant"})}},[r]),d(()=>{if(!c.current)return;const t=new AbortController,f=c.current;return window.addEventListener("keydown",n=>{switch(n.key){case"ArrowUp":{n.preventDefault();const u=m(-1,{options:r,focusedIndex:o,container:f,elements:l.current});s(u);break}case"ArrowDown":{n.preventDefault();const u=m(1,{options:r,focusedIndex:o,container:f,elements:l.current});s(u);break}case"Enter":if(n.preventDefault(),o<0)return;const e=r[o];a==null||a(e),b||s(0);break}},{signal:t.signal}),()=>{t.abort()}},[o,r]),{refs:w,focusedIndex:o,setFocusedIndex:s}};export{h as useKeyboardNavigation};
 //# sourceMappingURL=useKeyboardNavigation.js.map

package/dist/lib/shared/ui/dropdownList/hooks/useKeyboardNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useKeyboardNavigation.js","sources":["../../../../../../lib/shared/ui/dropdownList/hooks/useKeyboardNavigation.ts"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from 'react'\nimport { isOptionActive, listNavigate } from '../model'\nimport { type DropdownItemOption } from '../ui/dropdownItem'\n\nexport type UseKeyboardNavigationProps<Multi extends boolean> = {\n  options: DropdownItemOption[]\n  multiple?: Multi\n  onPick?: (option: DropdownItemOption) => void\n  value?: Multi extends true ? DropdownItemOption[] : DropdownItemOption | null\n}\n\nconst ELEMENT_OFFSET = 4\n\nexport const useKeyboardNavigation = <Container extends HTMLElement, Element extends HTMLElement, Multi extends boolean = false>({\n  options,\n  multiple,\n  onPick,\n  value\n}: UseKeyboardNavigationProps<Multi>) => {\n  const [focusedIndex, setFocusedIndex] = useState<number>(0)\n\n  const containerRef = useRef<Container>(null)\n  const itemRefs = useRef<Element[]>([])\n\n  const refs = useMemo(\n    () => ({\n      setReference: (node: Element | null) => {\n        if (node) itemRefs.current.push(node)\n      },\n      setRoot: () => containerRef\n    }),\n    []\n  )\n\n  // find and scroll to active element if exists\n  useEffect(() => {\n    if (!containerRef.current) return\n\n    const container = containerRef.current\n    let activeIndex = -1\n\n    for (let i = 0; i < options.length; i += 1) {\n      if (isOptionActive(options[i], value)) {\n        setFocusedIndex(i)\n        activeIndex = i\n        break\n      }\n    }\n\n    const scrollElement = itemRefs.current[activeIndex]\n\n    if (scrollElement) {\n      const scrollTop = scrollElement.offsetTop - container.offsetTop - ELEMENT_OFFSET\n\n      container.scrollTo({\n        top: scrollTop,\n        behavior: 'instant'\n      })\n    }\n  }, [options])\n\n  useEffect(() => {\n    if (!containerRef.current) return\n\n    const abortController = new AbortController()\n    const container = containerRef.current\n\n    window.addEventListener(\n      'keydown',\n      (event) => {\n        let direction: 1 | -1 = -1\n\n        switch (event.key) {\n          case 'ArrowUp':\n            event.preventDefault()\n\n            direction = -1\n            break\n          case 'ArrowDown':\n            event.preventDefault()\n\n            direction = 1\n            break\n          case 'Enter':\n            event.preventDefault()\n\n            if (focusedIndex < 0) return\n\n            const selectedItem = options[focusedIndex]\n            onPick?.(selectedItem)\n            if (!multiple) setFocusedIndex(0)\n\n            return\n          default:\n            return\n        }\n\n        let currentIndex = listNavigate(focusedIndex, direction, options.length)\n\n        while (options[currentIndex].disabled) {\n          currentIndex = listNavigate(currentIndex, direction, options.length)\n        }\n\n        const scrollElement = itemRefs.current[currentIndex]\n\n        const containerTop = container.scrollTop\n        const containerBottom = container.scrollTop + container.clientHeight\n\n        if (scrollElement.offsetTop < containerTop || scrollElement.offsetTop > containerBottom) {\n          const scrollTop = scrollElement.offsetTop - container.offsetTop - ELEMENT_OFFSET\n\n          const behavior =\n            (focusedIndex === 0 && currentIndex === options.length - 1) ||\n            (focusedIndex === options.length - 1 && currentIndex === 0)\n              ? 'instant'\n              : 'smooth'\n\n          container.scrollTo({\n            top: scrollTop,\n            behavior\n          })\n        }\n\n        setFocusedIndex(currentIndex)\n      },\n      { signal: abortController.signal }\n    )\n\n    return () => {\n      abortController.abort()\n    }\n  }, [focusedIndex, options])\n\n  return { refs, focusedIndex, setFocusedIndex }\n}\n"],"names":["ELEMENT_OFFSET","useKeyboardNavigation","options","multiple","onPick","value","focusedIndex","setFocusedIndex","useState","containerRef","useRef","itemRefs","refs","useMemo","node","useEffect","container","activeIndex","i","isOptionActive","scrollElement","scrollTop","abortController","event","direction","selectedItem","currentIndex","listNavigate","containerTop","containerBottom","behavior"],"mappings":"8IAWA,MAAMA,EAAiB,EAEVC,EAAwB,CAA4F,CAC/H,QAAAC,EACA,SAAAC,EACA,OAAAC,EACA,MAAAC,CACF,IAAyC,CACvC,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAAiB,CAAC,EAEpDC,EAAeC,EAAkB,IAAI,EACrCC,EAAWD,EAAkB,EAAE,EAE/BE,EAAOC,EACX,KAAO,CACL,aAAeC,GAAyB,CAClCA,GAAMH,EAAS,QAAQ,KAAKG,CAAI,CACtC,EACA,QAAS,IAAML,CAAA,GAEjB,CAAA,CAAC,EAIH,OAAAM,EAAU,IAAM,CACd,GAAI,CAACN,EAAa,QAAS,OAE3B,MAAMO,EAAYP,EAAa,QAC/B,IAAIQ,EAAc,GAElB,QAASC,EAAI,EAAGA,EAAIhB,EAAQ,OAAQgB,GAAK,EACvC,GAAIC,EAAejB,EAAQgB,CAAC,EAAGb,CAAK,EAAG,CACrCE,EAAgBW,CAAC,EACjBD,EAAcC,EACd,KACF,CAGF,MAAME,EAAgBT,EAAS,QAAQM,CAAW,EAElD,GAAIG,EAAe,CACjB,MAAMC,EAAYD,EAAc,UAAYJ,EAAU,UAAYhB,EAElEgB,EAAU,SAAS,CACjB,IAAKK,EACL,SAAU,SAAA,CACX,CACH,CACF,EAAG,CAACnB,CAAO,CAAC,EAEZa,EAAU,IAAM,CACd,GAAI,CAACN,EAAa,QAAS,OAE3B,MAAMa,EAAkB,IAAI,gBACtBN,EAAYP,EAAa,QAE/B,cAAO,iBACL,UACCc,GAAU,CACT,IAAIC,EAAoB,GAExB,OAAQD,EAAM,IAAA,CACZ,IAAK,UACHA,EAAM,eAAA,EAENC,EAAY,GACZ,MACF,IAAK,YACHD,EAAM,eAAA,EAENC,EAAY,EACZ,MACF,IAAK,QAGH,GAFAD,EAAM,eAAA,EAEFjB,EAAe,EAAG,OAEtB,MAAMmB,EAAevB,EAAQI,CAAY,EACzCF,GAAA,MAAAA,EAASqB,GACJtB,GAAUI,EAAgB,CAAC,EAEhC,OACF,QACE,MAAA,CAGJ,IAAImB,EAAeC,EAAarB,EAAckB,EAAWtB,EAAQ,MAAM,EAEvE,KAAOA,EAAQwB,CAAY,EAAE,UAC3BA,EAAeC,EAAaD,EAAcF,EAAWtB,EAAQ,MAAM,EAGrE,MAAMkB,EAAgBT,EAAS,QAAQe,CAAY,EAE7CE,EAAeZ,EAAU,UACzBa,EAAkBb,EAAU,UAAYA,EAAU,aAExD,GAAII,EAAc,UAAYQ,GAAgBR,EAAc,UAAYS,EAAiB,CACvF,MAAMR,EAAYD,EAAc,UAAYJ,EAAU,UAAYhB,EAE5D8B,EACHxB,IAAiB,GAAKoB,IAAiBxB,EAAQ,OAAS,GACxDI,IAAiBJ,EAAQ,OAAS,GAAKwB,IAAiB,EACrD,UACA,SAENV,EAAU,SAAS,CACjB,IAAKK,EACL,SAAAS,CAAA,CACD,CACH,CAEAvB,EAAgBmB,CAAY,CAC9B,EACA,CAAE,OAAQJ,EAAgB,MAAA,CAAO,EAG5B,IAAM,CACXA,EAAgB,MAAA,CAClB,CACF,EAAG,CAAChB,EAAcJ,CAAO,CAAC,EAEnB,CAAE,KAAAU,EAAM,aAAAN,EAAc,gBAAAC,CAAA,CAC/B"}
+{"version":3,"file":"useKeyboardNavigation.js","sources":["../../../../../../lib/shared/ui/dropdownList/hooks/useKeyboardNavigation.ts"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from 'react'\nimport { isOptionActive } from '../model'\nimport { type DropdownItemOption } from '../ui/dropdownItem'\nimport { scrollTo } from './model'\n\nexport type UseKeyboardNavigationProps<Multi extends boolean> = {\n  options: DropdownItemOption[]\n  multiple?: Multi\n  onPick?: (option: DropdownItemOption) => void\n  value?: Multi extends true ? DropdownItemOption[] : DropdownItemOption | null\n}\n\nexport const useKeyboardNavigation = <Container extends HTMLElement, Element extends HTMLElement, Multi extends boolean = false>({\n  options,\n  multiple,\n  onPick,\n  value\n}: UseKeyboardNavigationProps<Multi>) => {\n  const [focusedIndex, setFocusedIndex] = useState<number>(0)\n\n  const containerRef = useRef<Container>(null)\n  const itemRefs = useRef<Element[]>([])\n\n  const refs = useMemo(\n    () => ({\n      setReference: (node: Element | null) => {\n        if (node) itemRefs.current.push(node)\n      },\n      setRoot: () => containerRef\n    }),\n    []\n  )\n\n  // find and scroll to active element if exists\n  useEffect(() => {\n    if (!containerRef.current) return\n\n    const container = containerRef.current\n    let activeIndex = -1\n\n    for (let i = 0; i < options.length; i += 1) {\n      if (isOptionActive(options[i], value)) {\n        setFocusedIndex(i)\n        activeIndex = i\n        break\n      }\n    }\n\n    const scrollElement = itemRefs.current[activeIndex]\n\n    if (scrollElement) {\n      const scrollTop = scrollElement.offsetTop - container.offsetTop - 4\n\n      container.scrollTo({\n        top: scrollTop,\n        behavior: 'instant'\n      })\n    }\n  }, [options])\n\n  useEffect(() => {\n    if (!containerRef.current) return\n\n    const abortController = new AbortController()\n    const container = containerRef.current\n\n    window.addEventListener(\n      'keydown',\n      (event) => {\n        switch (event.key) {\n          case 'ArrowUp': {\n            event.preventDefault()\n\n            const nextIndex = scrollTo(-1, { options, focusedIndex, container, elements: itemRefs.current })\n            setFocusedIndex(nextIndex)\n\n            break\n          }\n          case 'ArrowDown': {\n            event.preventDefault()\n\n            const nextIndex = scrollTo(1, { options, focusedIndex, container, elements: itemRefs.current })\n            setFocusedIndex(nextIndex)\n\n            break\n          }\n          case 'Enter':\n            event.preventDefault()\n\n            if (focusedIndex < 0) return\n\n            const selectedItem = options[focusedIndex]\n            onPick?.(selectedItem)\n            if (!multiple) setFocusedIndex(0)\n\n            break\n        }\n      },\n      { signal: abortController.signal }\n    )\n\n    return () => {\n      abortController.abort()\n    }\n  }, [focusedIndex, options])\n\n  return { refs, focusedIndex, setFocusedIndex }\n}\n"],"names":["useKeyboardNavigation","options","multiple","onPick","value","focusedIndex","setFocusedIndex","useState","containerRef","useRef","itemRefs","refs","useMemo","node","useEffect","container","activeIndex","i","isOptionActive","scrollElement","scrollTop","abortController","event","nextIndex","scrollTo","selectedItem"],"mappings":"2KAYO,MAAMA,EAAwB,CAA4F,CAC/H,QAAAC,EACA,SAAAC,EACA,OAAAC,EACA,MAAAC,CACF,IAAyC,CACvC,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAAiB,CAAC,EAEpDC,EAAeC,EAAkB,IAAI,EACrCC,EAAWD,EAAkB,EAAE,EAE/BE,EAAOC,EACX,KAAO,CACL,aAAeC,GAAyB,CAClCA,GAAMH,EAAS,QAAQ,KAAKG,CAAI,CACtC,EACA,QAAS,IAAML,CAAA,GAEjB,CAAA,CAAC,EAIH,OAAAM,EAAU,IAAM,CACd,GAAI,CAACN,EAAa,QAAS,OAE3B,MAAMO,EAAYP,EAAa,QAC/B,IAAIQ,EAAc,GAElB,QAASC,EAAI,EAAGA,EAAIhB,EAAQ,OAAQgB,GAAK,EACvC,GAAIC,EAAejB,EAAQgB,CAAC,EAAGb,CAAK,EAAG,CACrCE,EAAgBW,CAAC,EACjBD,EAAcC,EACd,KACF,CAGF,MAAME,EAAgBT,EAAS,QAAQM,CAAW,EAElD,GAAIG,EAAe,CACjB,MAAMC,EAAYD,EAAc,UAAYJ,EAAU,UAAY,EAElEA,EAAU,SAAS,CACjB,IAAKK,EACL,SAAU,SAAA,CACX,CACH,CACF,EAAG,CAACnB,CAAO,CAAC,EAEZa,EAAU,IAAM,CACd,GAAI,CAACN,EAAa,QAAS,OAE3B,MAAMa,EAAkB,IAAI,gBACtBN,EAAYP,EAAa,QAE/B,cAAO,iBACL,UACCc,GAAU,CACT,OAAQA,EAAM,IAAA,CACZ,IAAK,UAAW,CACdA,EAAM,eAAA,EAEN,MAAMC,EAAYC,EAAS,GAAI,CAAE,QAAAvB,EAAS,aAAAI,EAAc,UAAAU,EAAW,SAAUL,EAAS,QAAS,EAC/FJ,EAAgBiB,CAAS,EAEzB,KACF,CACA,IAAK,YAAa,CAChBD,EAAM,eAAA,EAEN,MAAMC,EAAYC,EAAS,EAAG,CAAE,QAAAvB,EAAS,aAAAI,EAAc,UAAAU,EAAW,SAAUL,EAAS,QAAS,EAC9FJ,EAAgBiB,CAAS,EAEzB,KACF,CACA,IAAK,QAGH,GAFAD,EAAM,eAAA,EAEFjB,EAAe,EAAG,OAEtB,MAAMoB,EAAexB,EAAQI,CAAY,EACzCF,GAAA,MAAAA,EAASsB,GACJvB,GAAUI,EAAgB,CAAC,EAEhC,KAAA,CAEN,EACA,CAAE,OAAQe,EAAgB,MAAA,CAAO,EAG5B,IAAM,CACXA,EAAgB,MAAA,CAClB,CACF,EAAG,CAAChB,EAAcJ,CAAO,CAAC,EAEnB,CAAE,KAAAU,EAAM,aAAAN,EAAc,gBAAAC,CAAA,CAC/B"}

package/dist/lib/shared/ui/formElements/uncontrolled/combobox/combobox.js

@@ -1,2 +1,2 @@
-import{jsxs as K,jsx as r}from"react/jsx-runtime";import{forwardRef as Q,useRef as v}from"react";import{useFloating as T}from"../../../../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";import{useCombobox as V}from"./hooks/useCombobox.js";import{useClickOutside as W}from"../../../../hooks/useClickOutside.js";import{cn as p}from"../../../../utils/cn.js";import{mergeRefs as X}from"../../../../utils/mergeRefs.js";import"../../../button/Button.js";import"../../../buttonIcon/ButtonIcon.js";import"../../../calendar/Calendar.js";import"../../../calendar/model/utils.js";import"../../../accordion/Accordion.js";import"react-dom";import"../../../modal/ui/IframeModalContent.js";import"../../../../../../node_modules/react-hot-toast/dist/index.js";import{Icon as Y}from"../../../icon/Icon.js";import"../../../table/ui/primitives/Primitives.js";import"../../../carousel/ui/CarouselContent.js";import"../../../slot/Slot.js";import"../autocomplete/Autocomplete.js";import"../checkbox/Checkbox.js";import"../dayPicker/DayPicker.js";import{InputBase as Z}from"../input/Input.js";import"../inputOtp/InputOtpBase.js";import"../maskInput/MaskInput.js";import"../radio/RadioGroup.js";import"../radio/ui/RadioItem.js";import"../slider/SliderBase.js";import"../switch/Switch.js";import"../textarea/Textarea.js";import"../uploader/UploaderBase.js";import"../../controlled/editor/ui/Editor.js";import"../../controlled/input/MaskInputControl.js";import"../../../dropdownList/ui/dropdownItem/DropdownItem.js";import{DropdownList as _}from"../../../dropdownList/DropdownList.js";import{AnimatePresence as $}from"../../../../../../node_modules/framer-motion/dist/es/components/AnimatePresence/index.js";import{motion as a}from"../../../../../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js";import{autoUpdate as x}from"../../../../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";import{flip as l,offset as H}from"../../../../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js";const oo=({options:A,multiple:n,value:m,onChange:B,defaultOpen:F,attachmentProps:N,searchable:i,invalid:O,displayValue:g,label:P,disabled:f,readOnly:C,className:j,externalHandlers:o,inputValue:h,filterDisabled:s,onInputChange:z,classes:t},D)=>{var b;const{floating:L,...d}=(t==null?void 0:t.list)??{},u=v(null),w=v(null),{refs:I,floatingStyles:E}=T({placement:"bottom-start",strategy:"absolute",middleware:[l({boundary:"clippingAncestors",crossAxis:!1}),H(4)],whileElementsMounted:x}),{open:R,setOpen:c,state:M,changeHandler:S,options:U,search:q,onInputChange:G,comboboxDisplayValue:y}=V({multiple:n,value:m,onChange:B,searchable:i,defaultOpen:F,displayValue:g,initialOptions:A,filterDisabled:s,externalHandlers:o,externalInputValue:h,externalOnInputChange:z}),J=()=>m?n&&i?y(m):i?q:y(m):"";return W(u,()=>c(!1)),K("div",{ref:u,className:p("relative w-full",t==null?void 0:t.root,j),children:[r(Z,{ref:X(D,w,I.setReference),label:P,invalid:O,readOnly:C||!i,value:h||J(),onChange:G,disabled:f,onClick:e=>{var k;c(!0),(k=o==null?void 0:o.clickHandler)==null||k.call(o,e)},onBlur:o==null?void 0:o.blurHandler,onFocus:o==null?void 0:o.focusHandler,classes:{input:p({"cursor-pointer":!i,"cursor-default":f,"pointer-events-none":f||C}),...t==null?void 0:t.input},autoComplete:"off",attachmentProps:{icon:r(Y,{name:"arrows/arrowRight",className:p("size-6 rotate-90 text-color-blue-grey-600 duration-100",{"-rotate-90":R})}),onClickIcon:()=>c(e=>!e),...N}}),r($,{children:R&&r(a.div,{ref:I.setFloating,initial:{opacity:0},animate:{opacity:1},transition:{duration:.1},className:p("z-[1000]",L),style:{...E,width:(b=u.current)==null?void 0:b.getBoundingClientRect().width},children:r(_,{options:U,multiple:n,onPick:S,value:M,displayValue:g,classes:d,target:w})})})]})},Qo=Q(oo);export{Qo as Combobox};
+import{jsxs as G,jsx as p}from"react/jsx-runtime";import{forwardRef as J,useRef as K,useEffect as Q}from"react";import{useFloating as T}from"../../../../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";import{useCombobox as V}from"./hooks/useCombobox.js";import{useClickOutside as W}from"../../../../hooks/useClickOutside.js";import{cn as u}from"../../../../utils/cn.js";import{mergeRefs as X}from"../../../../utils/mergeRefs.js";import"../../../button/Button.js";import"../../../buttonIcon/ButtonIcon.js";import"../../../calendar/Calendar.js";import"../../../calendar/model/utils.js";import"../../../accordion/Accordion.js";import"react-dom";import"../../../modal/ui/IframeModalContent.js";import"../../../../../../node_modules/react-hot-toast/dist/index.js";import{Icon as Y}from"../../../icon/Icon.js";import"../../../table/ui/primitives/Primitives.js";import"../../../carousel/ui/CarouselContent.js";import"../../../slot/Slot.js";import"../autocomplete/Autocomplete.js";import"../checkbox/Checkbox.js";import"../dayPicker/DayPicker.js";import{InputBase as Z}from"../input/Input.js";import"../inputOtp/InputOtpBase.js";import"../maskInput/MaskInput.js";import"../radio/RadioGroup.js";import"../radio/ui/RadioItem.js";import"../slider/SliderBase.js";import"../switch/Switch.js";import"../textarea/Textarea.js";import"../uploader/UploaderBase.js";import"../../controlled/editor/ui/Editor.js";import"../../controlled/input/MaskInputControl.js";import"../../../dropdownList/ui/dropdownItem/DropdownItem.js";import{DropdownList as _}from"../../../dropdownList/DropdownList.js";import{AnimatePresence as $}from"../../../../../../node_modules/framer-motion/dist/es/components/AnimatePresence/index.js";import{motion as l}from"../../../../../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js";import{autoUpdate as x}from"../../../../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";import{flip as H,offset as oo}from"../../../../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js";const to=({options:I,multiple:c,value:e,onChange:d,defaultOpen:k,attachmentProps:v,searchable:r,invalid:A,displayValue:h,label:a,disabled:g,readOnly:R,className:B,externalHandlers:o,inputValue:b,filterDisabled:E,onInputChange:F,classes:t},L)=>{var y;const{floating:N,...O}=(t==null?void 0:t.list)??{},C=K(null),{refs:i,floatingStyles:P}=T({placement:"bottom-start",strategy:"absolute",middleware:[H({boundary:"clippingAncestors",crossAxis:!1}),oo(4)],whileElementsMounted:x}),{open:w,setOpen:f,state:j,changeHandler:z,options:D,search:M,onInputChange:S,comboboxDisplayValue:s}=V({multiple:c,value:e,onChange:d,searchable:r,defaultOpen:k,displayValue:h,initialOptions:I,filterDisabled:E,externalHandlers:o,externalInputValue:b,externalOnInputChange:F});Q(()=>{if(!i.domReference.current)return;const m=i.domReference.current,n=new AbortController;return m.addEventListener("keydown",q=>{switch(q.key){case" ":w||f(!0)}},{signal:n.signal}),()=>{n.abort()}},[]);const U=()=>e?c&&r?s(e):r?M:s(e):"";return W(C,()=>f(!1)),G("div",{ref:C,className:u("relative w-full",t==null?void 0:t.root,B),children:[p(Z,{ref:X(L,i.setReference),label:a,invalid:A,readOnly:R||!r,value:b||U(),onChange:S,disabled:g,onClick:m=>{var n;f(!0),(n=o==null?void 0:o.clickHandler)==null||n.call(o,m)},onBlur:o==null?void 0:o.blurHandler,onFocus:o==null?void 0:o.focusHandler,classes:{input:u({"cursor-pointer":!r,"cursor-default":g,"pointer-events-none":g||R}),...t==null?void 0:t.input},autoComplete:"off",attachmentProps:{icon:p(Y,{name:"arrows/arrowRight",className:u("size-6 rotate-90 text-color-blue-grey-600 duration-100",{"-rotate-90":w})}),onClickIcon:()=>f(m=>!m),...v}}),p($,{children:w&&p(l.div,{ref:i.setFloating,initial:{opacity:0},animate:{opacity:1},transition:{duration:.1},className:u("z-[1000]",N),style:{...P,width:(y=C.current)==null?void 0:y.getBoundingClientRect().width},children:p(_,{options:D,multiple:c,onPick:z,value:j,displayValue:h,classes:O,target:i.domReference})})})]})},Qo=J(to);export{Qo as Combobox};
 //# sourceMappingURL=combobox.js.map

package/dist/lib/shared/ui/formElements/uncontrolled/combobox/combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.js","sources":["../../../../../../../lib/shared/ui/formElements/uncontrolled/combobox/combobox.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, useRef } from 'react'\nimport { autoUpdate, flip, offset, useFloating } from '@floating-ui/react'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport { useCombobox } from './hooks'\nimport type { ChangeHandler, ComboboxValue } from './model'\nimport type { ComboboxItemOption } from './ui'\nimport { useClickOutside } from '$/shared/hooks'\nimport { type DeepPartial } from '$/shared/types'\nimport { Icon } from '$/shared/ui'\nimport { DropdownList, type DropdownListClasses, type DropdownListProps } from '$/shared/ui/dropdownList'\nimport { type IFieldAttachmentProps } from '$/shared/ui/formElements/ui'\nimport { InputBase, type InputBaseProps } from '$/shared/ui/formElements/uncontrolled/input'\nimport { cn, mergeRefs } from '$/shared/utils'\n\nexport type ComboboxClasses = {\n  root?: string\n  list?: { floating?: string } & DropdownListClasses\n  input?: InputBaseProps['classes']\n}\n\nexport type ExternalHandlers<Multi extends boolean> = {\n  changeHandler?: ChangeHandler<Multi>\n  clickHandler?: (event: React.MouseEvent<HTMLElement>) => void\n  blurHandler?: (event: React.FocusEvent<HTMLElement>) => void\n  focusHandler?: (event: React.FocusEvent<HTMLElement>) => void\n  inputChangeHandler?: (value: string) => void\n}\n\nexport interface ComboboxProps<Multi extends boolean> extends Omit<DropdownListProps<Multi>, 'options' | 'value' | 'onChange'> {\n  /**\n   * Список опций\n   */\n  options: ComboboxItemOption[]\n  /**\n   * Выбранное значение\n   */\n  value?: ComboboxValue<Multi>\n  /**\n   * Функция для изменения значения\n   */\n  onChange?: ChangeHandler<Multi>\n  /**\n   * Свойство управляющее поиском\n   */\n  searchable?: boolean\n  /**\n   * Открыть список по умолчанию\n   */\n  defaultOpen?: boolean\n  /**\n   * Свойства дополнительной иконки\n   */\n  attachmentProps?: DeepPartial<IFieldAttachmentProps>\n  /**\n   * Пометить поле как не валидное\n   */\n  invalid?: boolean\n  /**\n   * Функция для управления отображаемым значением\n   */\n  displayValue?: (option: ComboboxItemOption) => string\n  /**\n   * Отображаемый лейбл\n   */\n  label: string\n  /**\n   * Выключено поле\n   */\n  disabled?: boolean\n  /**\n   * Только для чтения\n   */\n  readOnly?: boolean\n  /**\n   * Дополнительные стили\n   */\n  classes?: ComboboxClasses\n  /**\n   * Дополнительные события\n   */\n  externalHandlers?: ExternalHandlers<Multi>\n  /**\n   * Функция для изменения значения поиска\n   */\n  onInputChange?: (value: string) => void\n  /**\n   * Значение инпута\n   */\n  inputValue?: string\n  /**\n   * Выключить фильтрацию списка\n   */\n  filterDisabled?: boolean\n}\n\nconst InnerComponent = <Multi extends boolean>(\n  {\n    options: initialOptions,\n    multiple,\n    value,\n    onChange,\n    defaultOpen,\n    attachmentProps,\n    searchable,\n    invalid,\n    displayValue,\n    label,\n    disabled,\n    readOnly,\n    className,\n    externalHandlers,\n    inputValue,\n    filterDisabled,\n    onInputChange: externalInputChangeHandler,\n    classes\n  }: ComboboxProps<Multi>,\n  ref: ForwardedRef<HTMLInputElement>\n) => {\n  const { floating, ...dropdownClasses } = classes?.list ?? {}\n\n  const containerRef = useRef<HTMLDivElement>(null)\n  const inputRef = useRef<HTMLInputElement>(null)\n\n  const { refs, floatingStyles } = useFloating<HTMLInputElement>({\n    placement: 'bottom-start',\n    strategy: 'absolute',\n    middleware: [\n      flip({\n        boundary: 'clippingAncestors',\n        crossAxis: false\n      }),\n      offset(4)\n    ],\n    whileElementsMounted: autoUpdate\n  })\n\n  const { open, setOpen, state, changeHandler, options, search, onInputChange, comboboxDisplayValue } = useCombobox({\n    multiple,\n    value,\n    onChange,\n    searchable,\n    defaultOpen,\n    displayValue,\n    initialOptions,\n    filterDisabled,\n    externalHandlers,\n    externalInputValue: inputValue,\n    externalOnInputChange: externalInputChangeHandler\n  })\n\n  const getLabel = () => {\n    if (!value) return ''\n\n    if (multiple && searchable) {\n      return comboboxDisplayValue(value)\n    } else if (searchable) {\n      return search\n    } else {\n      return comboboxDisplayValue(value)\n    }\n  }\n\n  useClickOutside(containerRef, () => setOpen(false))\n\n  return (\n    <div ref={containerRef} className={cn('relative w-full', classes?.root, className)}>\n      <InputBase\n        ref={mergeRefs(ref, inputRef, refs.setReference)}\n        label={label}\n        invalid={invalid}\n        readOnly={readOnly || !searchable}\n        value={inputValue || getLabel()}\n        onChange={onInputChange}\n        disabled={disabled}\n        onClick={(event) => {\n          setOpen(true)\n          externalHandlers?.clickHandler?.(event)\n        }}\n        onBlur={externalHandlers?.blurHandler}\n        onFocus={externalHandlers?.focusHandler}\n        classes={{\n          input: cn({\n            'cursor-pointer': !searchable,\n            'cursor-default': disabled,\n            'pointer-events-none': disabled || readOnly\n          }),\n          ...classes?.input\n        }}\n        autoComplete='off'\n        attachmentProps={{\n          icon: (\n            <Icon\n              name='arrows/arrowRight'\n              className={cn('size-6 rotate-90 text-color-blue-grey-600 duration-100', {\n                '-rotate-90': open\n              })}\n            />\n          ),\n          onClickIcon: () => setOpen((prev) => !prev),\n          ...attachmentProps\n        }}\n      />\n\n      <AnimatePresence>\n        {open && (\n          <motion.div\n            ref={refs.setFloating}\n            initial={{ opacity: 0 }}\n            animate={{ opacity: 1 }}\n            transition={{ duration: 0.1 }}\n            className={cn('z-[1000]', floating)}\n            style={{ ...floatingStyles, width: containerRef.current?.getBoundingClientRect().width }}\n          >\n            <DropdownList\n              options={options}\n              multiple={multiple}\n              onPick={changeHandler}\n              value={state}\n              displayValue={displayValue}\n              classes={dropdownClasses}\n              target={inputRef}\n            />\n          </motion.div>\n        )}\n      </AnimatePresence>\n    </div>\n  )\n}\n\nexport const Combobox = forwardRef(InnerComponent) as <Multi extends boolean>(\n  props: ComboboxProps<Multi> & { ref?: ForwardedRef<HTMLInputElement> }\n) => React.JSX.Element\n"],"names":["InnerComponent","initialOptions","multiple","value","onChange","defaultOpen","attachmentProps","searchable","invalid","displayValue","label","disabled","readOnly","className","externalHandlers","inputValue","filterDisabled","externalInputChangeHandler","classes","ref","floating","dropdownClasses","containerRef","useRef","inputRef","refs","floatingStyles","useFloating","flip","offset","autoUpdate","open","setOpen","state","changeHandler","options","search","onInputChange","comboboxDisplayValue","useCombobox","getLabel","useClickOutside","jsxs","cn","jsx","InputBase","mergeRefs","event","_a","Icon","prev","AnimatePresence","motion","DropdownList","Combobox","forwardRef"],"mappings":"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"}
+{"version":3,"file":"combobox.js","sources":["../../../../../../../lib/shared/ui/formElements/uncontrolled/combobox/combobox.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, useEffect, useRef } from 'react'\nimport { autoUpdate, flip, offset, useFloating } from '@floating-ui/react'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport { useCombobox } from './hooks'\nimport type { ChangeHandler, ComboboxValue } from './model'\nimport type { ComboboxItemOption } from './ui'\nimport { useClickOutside } from '$/shared/hooks'\nimport { type DeepPartial } from '$/shared/types'\nimport { Icon } from '$/shared/ui'\nimport { DropdownList, type DropdownListClasses, type DropdownListProps } from '$/shared/ui/dropdownList'\nimport { type IFieldAttachmentProps } from '$/shared/ui/formElements/ui'\nimport { InputBase, type InputBaseProps } from '$/shared/ui/formElements/uncontrolled/input'\nimport { cn, mergeRefs } from '$/shared/utils'\n\nexport type ComboboxClasses = {\n  root?: string\n  list?: { floating?: string } & DropdownListClasses\n  input?: InputBaseProps['classes']\n}\n\nexport type ExternalHandlers<Multi extends boolean> = {\n  changeHandler?: ChangeHandler<Multi>\n  clickHandler?: (event: React.MouseEvent<HTMLElement>) => void\n  blurHandler?: (event: React.FocusEvent<HTMLElement>) => void\n  focusHandler?: (event: React.FocusEvent<HTMLElement>) => void\n  inputChangeHandler?: (value: string) => void\n}\n\nexport interface ComboboxProps<Multi extends boolean> extends Omit<DropdownListProps<Multi>, 'options' | 'value' | 'onChange'> {\n  /**\n   * Список опций\n   */\n  options: ComboboxItemOption[]\n  /**\n   * Выбранное значение\n   */\n  value?: ComboboxValue<Multi>\n  /**\n   * Функция для изменения значения\n   */\n  onChange?: ChangeHandler<Multi>\n  /**\n   * Свойство управляющее поиском\n   */\n  searchable?: boolean\n  /**\n   * Открыть список по умолчанию\n   */\n  defaultOpen?: boolean\n  /**\n   * Свойства дополнительной иконки\n   */\n  attachmentProps?: DeepPartial<IFieldAttachmentProps>\n  /**\n   * Пометить поле как не валидное\n   */\n  invalid?: boolean\n  /**\n   * Функция для управления отображаемым значением\n   */\n  displayValue?: (option: ComboboxItemOption) => string\n  /**\n   * Отображаемый лейбл\n   */\n  label: string\n  /**\n   * Выключено поле\n   */\n  disabled?: boolean\n  /**\n   * Только для чтения\n   */\n  readOnly?: boolean\n  /**\n   * Дополнительные стили\n   */\n  classes?: ComboboxClasses\n  /**\n   * Дополнительные события\n   */\n  externalHandlers?: ExternalHandlers<Multi>\n  /**\n   * Функция для изменения значения поиска\n   */\n  onInputChange?: (value: string) => void\n  /**\n   * Значение инпута\n   */\n  inputValue?: string\n  /**\n   * Выключить фильтрацию списка\n   */\n  filterDisabled?: boolean\n}\n\nconst InnerComponent = <Multi extends boolean>(\n  {\n    options: initialOptions,\n    multiple,\n    value,\n    onChange,\n    defaultOpen,\n    attachmentProps,\n    searchable,\n    invalid,\n    displayValue,\n    label,\n    disabled,\n    readOnly,\n    className,\n    externalHandlers,\n    inputValue,\n    filterDisabled,\n    onInputChange: externalInputChangeHandler,\n    classes\n  }: ComboboxProps<Multi>,\n  ref: ForwardedRef<HTMLInputElement>\n) => {\n  const { floating, ...dropdownClasses } = classes?.list ?? {}\n\n  const containerRef = useRef<HTMLDivElement>(null)\n\n  const { refs, floatingStyles } = useFloating<HTMLInputElement>({\n    placement: 'bottom-start',\n    strategy: 'absolute',\n    middleware: [\n      flip({\n        boundary: 'clippingAncestors',\n        crossAxis: false\n      }),\n      offset(4)\n    ],\n    whileElementsMounted: autoUpdate\n  })\n\n  const { open, setOpen, state, changeHandler, options, search, onInputChange, comboboxDisplayValue } = useCombobox({\n    multiple,\n    value,\n    onChange,\n    searchable,\n    defaultOpen,\n    displayValue,\n    initialOptions,\n    filterDisabled,\n    externalHandlers,\n    externalInputValue: inputValue,\n    externalOnInputChange: externalInputChangeHandler\n  })\n\n  useEffect(() => {\n    if (!refs.domReference.current) return\n\n    const input = refs.domReference.current\n\n    const abortController = new AbortController()\n\n    input.addEventListener(\n      'keydown',\n      (event) => {\n        switch (event.key) {\n          case ' ':\n            if (!open) setOpen(true)\n        }\n      },\n      { signal: abortController.signal }\n    )\n\n    return () => {\n      abortController.abort()\n    }\n  }, [])\n\n  const getLabel = () => {\n    if (!value) return ''\n\n    if (multiple && searchable) {\n      return comboboxDisplayValue(value)\n    } else if (searchable) {\n      return search\n    } else {\n      return comboboxDisplayValue(value)\n    }\n  }\n\n  useClickOutside(containerRef, () => setOpen(false))\n\n  return (\n    <div ref={containerRef} className={cn('relative w-full', classes?.root, className)}>\n      <InputBase\n        ref={mergeRefs(ref, refs.setReference)}\n        label={label}\n        invalid={invalid}\n        readOnly={readOnly || !searchable}\n        value={inputValue || getLabel()}\n        onChange={onInputChange}\n        disabled={disabled}\n        onClick={(event) => {\n          setOpen(true)\n          externalHandlers?.clickHandler?.(event)\n        }}\n        onBlur={externalHandlers?.blurHandler}\n        onFocus={externalHandlers?.focusHandler}\n        classes={{\n          input: cn({\n            'cursor-pointer': !searchable,\n            'cursor-default': disabled,\n            'pointer-events-none': disabled || readOnly\n          }),\n          ...classes?.input\n        }}\n        autoComplete='off'\n        attachmentProps={{\n          icon: (\n            <Icon\n              name='arrows/arrowRight'\n              className={cn('size-6 rotate-90 text-color-blue-grey-600 duration-100', {\n                '-rotate-90': open\n              })}\n            />\n          ),\n          onClickIcon: () => setOpen((prev) => !prev),\n          ...attachmentProps\n        }}\n      />\n\n      <AnimatePresence>\n        {open && (\n          <motion.div\n            ref={refs.setFloating}\n            initial={{ opacity: 0 }}\n            animate={{ opacity: 1 }}\n            transition={{ duration: 0.1 }}\n            className={cn('z-[1000]', floating)}\n            style={{ ...floatingStyles, width: containerRef.current?.getBoundingClientRect().width }}\n          >\n            <DropdownList\n              options={options}\n              multiple={multiple}\n              onPick={changeHandler}\n              value={state}\n              displayValue={displayValue}\n              classes={dropdownClasses}\n              target={refs.domReference}\n            />\n          </motion.div>\n        )}\n      </AnimatePresence>\n    </div>\n  )\n}\n\nexport const Combobox = forwardRef(InnerComponent) as <Multi extends boolean>(\n  props: ComboboxProps<Multi> & { ref?: ForwardedRef<HTMLInputElement> }\n) => React.JSX.Element\n"],"names":["InnerComponent","initialOptions","multiple","value","onChange","defaultOpen","attachmentProps","searchable","invalid","displayValue","label","disabled","readOnly","className","externalHandlers","inputValue","filterDisabled","externalInputChangeHandler","classes","ref","floating","dropdownClasses","containerRef","useRef","refs","floatingStyles","useFloating","flip","offset","autoUpdate","open","setOpen","state","changeHandler","options","search","onInputChange","comboboxDisplayValue","useCombobox","useEffect","input","abortController","event","getLabel","useClickOutside","jsxs","cn","jsx","InputBase","mergeRefs","_a","Icon","prev","AnimatePresence","motion","DropdownList","Combobox","forwardRef"],"mappings":"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"}