{"version":3,"file":"index118.mjs","sources":["../src/components/input/wheelpicker/generic/index.tsx"],"sourcesContent":["import { FunctionComponent, ReactNode, useRef, useState } from \"react\";\nimport TextFieldAtom from \"../../../../atoms/textfield\";\nimport { LabelPairedChevronDownSmBoldIcon } from \"@deriv/quill-icons\";\nimport { useClickOutside } from \"../../../../hooks/useClickOutside\";\nimport {\n  DropdownDataType,\n  DropdownItemType,\n} from \"../../../../atoms/dropdown/container\";\nimport WheelpickerContainerAtom from \"../../../../atoms/dropdown/wheelpicker\";\n\nimport { usePortalClick } from \"../../../../hooks/usePortalClick\";\nimport { ActionSheetType } from \"../../../action-sheet\";\n\nexport type GenericWheelpickerType = {\n  className?: string;\n  label?: string;\n  placeholder?: string;\n  message?: string;\n\n  /** Variant props */\n  indicator?: \"neutral\" | \"fail\" | \"success\";\n  state?: \"default\" | \"disabled\";\n  type?: \"outline\" | \"fill\";\n  size?: \"lg\" | \"md\" | \"sm\";\n  textAlignment?: \"left\" | \"center\";\n\n  /** Custom  input props */\n  itemSize?: \"md\" | \"sm\";\n  itemWidth?: \"fill\" | \"fit-content\";\n  iconLeft?: ReactNode;\n  labelLeft?: string;\n  isRequired?: boolean;\n  optionalText?: string;\n  containerRef?: React.RefObject<HTMLDivElement>;\n  customValue?: string;\n  onChange?: (item: DropdownItemType | DropdownItemType[]) => void;\n  onClick?: () => void;\n  variant?: \"labelled\" | \"labelless\";\n  actionsheet?: ActionSheetType;\n\n  /**Custom Dropdown props */\n  data?: DropdownDataType[];\n  selected?: DropdownItemType[];\n};\n\nconst GenericWheelpicker: FunctionComponent<GenericWheelpickerType> = ({\n  className,\n  label = \"label\",\n  placeholder = \"Select an option\",\n  message,\n  indicator,\n  state,\n  type,\n  size = \"md\",\n  itemSize = \"sm\",\n  itemWidth = \"fill\",\n  textAlignment = \"left\",\n  iconLeft,\n  labelLeft,\n  isRequired,\n  optionalText,\n  containerRef,\n  selected: internalSelected,\n  actionsheet,\n  customValue,\n  onChange,\n  onClick,\n  data = [],\n  variant = \"labelled\",\n}) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const defaultRef = useRef<HTMLDivElement>(null);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const dropdownRef = containerRef || defaultRef;\n  const [selected, setSelected] = useState<DropdownItemType[] | undefined>(\n    internalSelected\n  );\n  const handleClick = (e: React.MouseEvent) => {\n    const { isPortalClick } = usePortalClick(\n      dropdownRef as React.RefObject<HTMLElement>\n    );\n\n    if (isPortalClick(e) || state === \"disabled\") {\n      return;\n    }\n\n    const target = e.target as HTMLElement;\n    if (target.closest('.wheelpicker-container')) {\n      setIsOpen(true);\n    } else {\n      setIsOpen(!isOpen);\n    }\n    onClick?.();\n  };\n\n  useClickOutside(\n    dropdownRef,\n    () => {\n      setIsOpen(false);\n    },\n    [\"wheelpicker-container\"]\n  );\n\n  return (\n    <TextFieldAtom\n      ref={inputRef}\n      containerRef={dropdownRef as React.RefObject<HTMLDivElement>}\n      label={label}\n      placeholder={placeholder}\n      message={message}\n      className={`quill-ui-next-pointer ${className}`}\n      allowTyping={false}\n      onClick={(e) => handleClick(e)}\n      iconRight={\n        <LabelPairedChevronDownSmBoldIcon\n          className={`quill-ui-next-rotatable ${\n            isOpen && \"quill-ui-next-rotate\"\n          }`}\n        />\n      }\n      indicator={indicator}\n      state={state}\n      type={type}\n      size={size}\n      textAlignment={textAlignment}\n      iconLeft={iconLeft}\n      labelLeft={labelLeft}\n      isRequired={isRequired}\n      optionalText={optionalText}\n      variant={variant}\n      value={customValue || selected?.map((item) => item.label).join(\" \")}\n      customContent={\n        <WheelpickerContainerAtom\n          width=\"100%\"\n          offsetTop={4}\n          textAlignment={textAlignment}\n          parent={dropdownRef}\n          isOpen={isOpen}\n          itemSize={itemSize}\n          itemWidth={itemWidth}\n          data={data}\n          containerSize=\"md\"\n          selected={selected}\n          actionsheet={{\n            onClose: () => setIsOpen(false),\n            ...actionsheet,\n          }}\n          onChange={(e: DropdownItemType | DropdownItemType[]) => {\n            onChange?.(e);\n            setSelected(e as DropdownItemType[]);\n            inputRef.current?.focus();\n          }}\n        />\n      }\n    />\n  );\n};\n\nGenericWheelpicker.displayName = \"GenericWheelpicker\";\n\nexport default GenericWheelpicker;\n"],"names":[],"mappings":";;;;;;;AA6CA,MAAM,qBAAgE,CAAC;AAAA,EACrE;AAAA,EACA,QAAQ;AAAA,EACR,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO,CAAC;AAAA,EACR,UAAU;AACZ,MAAM;AACJ,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AACpC,QAAA,aAAa,OAAuB,IAAI;AACxC,QAAA,WAAW,OAAyB,IAAI;AAC9C,QAAM,cAAc,gBAAgB;AAC9B,QAAA,CAAC,UAAU,WAAW,IAAI;AAAA,IAC9B;AAAA,EACF;AACM,QAAA,cAAc,CAAC,MAAwB;AACrC,UAAA,EAAE,kBAAkB;AAAA,MACxB;AAAA,IACF;AAEA,QAAI,cAAc,CAAC,KAAK,UAAU,YAAY;AAC5C;AAAA,IAAA;AAGF,UAAM,SAAS,EAAE;AACb,QAAA,OAAO,QAAQ,wBAAwB,GAAG;AAC5C,gBAAU,IAAI;AAAA,IAAA,OACT;AACL,gBAAU,CAAC,MAAM;AAAA,IAAA;AAET;AAAA,EACZ;AAEA;AAAA,IACE;AAAA,IACA,MAAM;AACJ,gBAAU,KAAK;AAAA,IACjB;AAAA,IACA,CAAC,uBAAuB;AAAA,EAC1B;AAGE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW,yBAAyB,SAAS;AAAA,MAC7C,aAAa;AAAA,MACb,SAAS,CAAC,MAAM,YAAY,CAAC;AAAA,MAC7B,WACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,2BACT,UAAU,sBACZ;AAAA,QAAA;AAAA,MACF;AAAA,MAEF;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO,gBAAe,qCAAU,IAAI,CAAC,SAAS,KAAK,OAAO,KAAK;AAAA,MAC/D,eACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,WAAW;AAAA,UACX;AAAA,UACA,QAAQ;AAAA,UACR;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,eAAc;AAAA,UACd;AAAA,UACA,aAAa;AAAA,YACX,SAAS,MAAM,UAAU,KAAK;AAAA,YAC9B,GAAG;AAAA,UACL;AAAA,UACA,UAAU,CAAC,MAA6C;;AACtD,iDAAW;AACX,wBAAY,CAAuB;AACnC,2BAAS,YAAT,mBAAkB;AAAA,UAAM;AAAA,QAC1B;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ;AAEJ;AAEA,mBAAmB,cAAc;"}