@addsign/moje-agenda-shared-lib 1.0.42 → 1.0.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/form/AutocompleteSearchBar.js +9 -5
- package/dist/components/form/AutocompleteSearchBar.js.map +1 -1
- package/dist/components/form/AutocompleteSearchBarServer.js +8 -2
- package/dist/components/form/AutocompleteSearchBarServer.js.map +1 -1
- package/dist/utils/PdfManager.js +2 -3
- package/dist/utils/PdfManager.js.map +1 -1
- package/package.json +1 -1
|
@@ -100,12 +100,16 @@ const AutocompleteSearchBar = ({
|
|
|
100
100
|
showId
|
|
101
101
|
]);
|
|
102
102
|
useClickAway(ref, () => {
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
103
|
+
if (isFocused) {
|
|
104
|
+
setSearchResults([]);
|
|
105
|
+
if (!selectedOption) {
|
|
106
|
+
setQuery("");
|
|
107
|
+
onChange(null);
|
|
108
|
+
}
|
|
109
|
+
handleBlur();
|
|
110
|
+
onBlur();
|
|
111
|
+
setIsFocused(false);
|
|
107
112
|
}
|
|
108
|
-
handleBlur();
|
|
109
113
|
});
|
|
110
114
|
const handleQueryChange = (event) => {
|
|
111
115
|
setQuery(event.target.value);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AutocompleteSearchBar.js","sources":["../../../lib/components/form/AutocompleteSearchBar.tsx"],"sourcesContent":["import { useState, useEffect, useRef } from \"react\";\r\nimport { useClickAway } from \"react-use\";\r\nimport { IOptionItem, useFederationContext } from \"../../main\";\r\nimport { MdClose, MdExpandLess, MdExpandMore } from \"react-icons/md\";\r\n\r\ninterface OptionListProps {\r\n options: IOptionItem[];\r\n selectedOptionIndex: number;\r\n handleOptionClick: (option: IOptionItem) => void;\r\n label?: string;\r\n}\r\n\r\ninterface SearchInputProps {\r\n value: string;\r\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\r\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;\r\n onFocus: () => void;\r\n clearQuery: () => void;\r\n inputRef: React.RefObject<HTMLInputElement>;\r\n placeholder?: string;\r\n isFocused?: boolean;\r\n onBlur: () => void;\r\n isLoading?: boolean;\r\n clearable?: boolean;\r\n}\r\n\r\nconst AutocompleteSearchBar: React.FC<{\r\n label: string;\r\n name: string;\r\n required?: boolean;\r\n disabled?: boolean;\r\n description?: string;\r\n fetchUrl?: string;\r\n valueKey: string;\r\n labelKey: string;\r\n onChange: (value: any) => void;\r\n onFocus: () => void;\r\n onBlur: () => void;\r\n placeholder?: string;\r\n serverSearch?: boolean;\r\n value?: string;\r\n initOptions?: IOptionItem[];\r\n showId?: boolean;\r\n clearable?: boolean;\r\n rounded?: boolean;\r\n}> = ({\r\n label,\r\n name,\r\n required,\r\n disabled,\r\n description,\r\n fetchUrl,\r\n valueKey,\r\n labelKey,\r\n onChange,\r\n onFocus,\r\n onBlur,\r\n placeholder,\r\n serverSearch = false,\r\n value,\r\n initOptions,\r\n showId,\r\n clearable = true,\r\n rounded = true,\r\n}) => {\r\n const [query, setQuery] = useState(\"\");\r\n const [loading, setLoading] = useState(false);\r\n const [options, setOptions] = useState<IOptionItem[]>([]);\r\n const [selectedOptionIndex, setSelectedOptionIndex] = useState(-1);\r\n const [selectedOption, setSelectedOption] = useState<IOptionItem | null>(\r\n null\r\n );\r\n const [searchResults, setSearchResults] = useState<IOptionItem[]>([]);\r\n const inputRef = useRef<HTMLInputElement>(null);\r\n const ref = useRef(null);\r\n const federationContext = useFederationContext();\r\n\r\n const [isFocused, setIsFocused] = useState(false);\r\n\r\n const [errors] = useState<any>({});\r\n\r\n useEffect(() => {\r\n const fetchOptions = async () => {\r\n setLoading(true);\r\n\r\n const { data } = await federationContext.apiClient.get(fetchUrl || \"\");\r\n // osetreni obou variant navratu z BE\r\n const tmpData = data.content || data;\r\n\r\n setOptions(\r\n tmpData.map((item: any) => ({\r\n value: item[valueKey],\r\n label: item[labelKey] + (showId ? \" (\" + item[valueKey] + \")\" : \"\"),\r\n }))\r\n ); // Adjust map according to actual API response\r\n setLoading(false);\r\n };\r\n\r\n if (fetchUrl) fetchOptions();\r\n }, [fetchUrl, labelKey, showId, valueKey, federationContext.apiClient]);\r\n\r\n useEffect(() => {\r\n if (initOptions) setOptions(initOptions);\r\n }, [initOptions]);\r\n\r\n useEffect(() => {\r\n if (value && options) {\r\n const initOption = options.find((it) => it.value == value);\r\n\r\n if (initOption) {\r\n setQuery(initOption.label);\r\n setSelectedOption(initOption);\r\n }\r\n }\r\n }, [value, options]);\r\n\r\n useEffect(() => {\r\n const fetchOptions = async () => {\r\n setLoading(true);\r\n const { data } = await federationContext.apiClient.get(fetchUrl + query);\r\n setOptions(\r\n data.map((item: any) => ({\r\n value: item[valueKey],\r\n label: item[labelKey] + (showId ? \" (\" + item[valueKey] + \")\" : \"\"),\r\n }))\r\n ); // Adjust map according to actual API response\r\n setSearchResults(\r\n data.map((item: any) => ({\r\n value: item[valueKey],\r\n label: item[labelKey] + (showId ? \" (\" + item[valueKey] + \")\" : \"\"),\r\n }))\r\n ); // Adjust map according to actual API response\r\n\r\n setLoading(false);\r\n };\r\n\r\n if (serverSearch) fetchOptions();\r\n }, [\r\n query,\r\n serverSearch,\r\n valueKey,\r\n labelKey,\r\n fetchUrl,\r\n federationContext.apiClient,\r\n showId,\r\n ]);\r\n\r\n useClickAway(ref, () => {\r\n setSearchResults([]);\r\n if (!selectedOption) {\r\n setQuery(\"\");\r\n onChange(null);\r\n }\r\n\r\n handleBlur();\r\n });\r\n\r\n const handleQueryChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n setQuery(event.target.value);\r\n setSelectedOption(null);\r\n setSelectedOptionIndex(-1);\r\n setSearchResults(\r\n options.filter((option) =>\r\n option?.label\r\n ?.toLowerCase()\r\n .includes(event.target?.value?.toLowerCase())\r\n )\r\n );\r\n };\r\n const handleFocus = () => {\r\n setIsFocused(true);\r\n onFocus();\r\n setSearchResults(\r\n options /*.filter((option) =>\r\n option.label.toLowerCase().includes(query.toLowerCase()),\r\n ),*/\r\n );\r\n inputRef.current?.select(); // Add this line\r\n };\r\n\r\n const handleClearQuery = () => {\r\n setQuery(\"\");\r\n onChange(null);\r\n setSelectedOption(null);\r\n setTimeout(() => {\r\n setSelectedOptionIndex(-1);\r\n setSearchResults(options);\r\n }, 1000);\r\n };\r\n\r\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n if (event.key === \"ArrowUp\" && searchResults.length > 0) {\r\n setSelectedOptionIndex((prevIndex) =>\r\n prevIndex > 0 ? prevIndex - 1 : searchResults.length - 1\r\n );\r\n } else if (event.key === \"ArrowDown\" && searchResults.length > 0) {\r\n setSelectedOptionIndex((prevIndex) =>\r\n prevIndex < searchResults.length - 1 ? prevIndex + 1 : 0\r\n );\r\n } else if (event.key === \"Enter\" && selectedOptionIndex !== -1) {\r\n handleOptionClick(searchResults[selectedOptionIndex]);\r\n } else if (event.key === \"Escape\" && selectedOptionIndex !== -1) {\r\n handleBlur();\r\n }\r\n };\r\n\r\n const handleOptionClick = (option: IOptionItem) => {\r\n setQuery(option.label);\r\n setSelectedOption(option);\r\n setSelectedOptionIndex(-1);\r\n\r\n onChange(option.value);\r\n\r\n handleBlur();\r\n };\r\n const handleBlur = () => {\r\n setSearchResults([]);\r\n onBlur();\r\n setIsFocused(false);\r\n };\r\n\r\n return (\r\n <div className=\"w-full flex-col justify-start items-start gap-1.5 inline-flex\">\r\n <div\r\n className=\"self-stretch flex-col justify-start items-start gap-1.5 flex relative\"\r\n ref={ref}\r\n >\r\n {label && (\r\n <label\r\n className=\"text-slate-700 text-sm leading-tight font-medium\"\r\n htmlFor={name}\r\n >\r\n {label} {required ? \"*\" : \"\"}\r\n </label>\r\n )}\r\n <div\r\n className={`self-stretch px-3 py-1.5 justify-start items-center gap-2 inline-flex outline-none border bg-white\r\n ${\r\n isFocused\r\n ? \"outline-4 outline-indigo-200 outline-offset-0 border-indigo-300\"\r\n : \"\"\r\n } \r\n ${\r\n isFocused && errors[name]?.message\r\n ? \"outline-4 outline-red-200 outline-offset-0 border-none\"\r\n : \"\"\r\n } \r\n ${!isFocused && errors[name]?.message ? \"border-red-200\" : \"\"} \r\n ${disabled ? \"bg-gray-100\" : \"bg-transparent\"}\r\n ${rounded ? \" rounded-lg \" : \" rounded-none \"}`}\r\n >\r\n <div className=\"Content grow shrink basis-0 min-h-5 xl:min-h-7 justify-start items-start gap-2 flex relative flex-col w-full mx-auto\">\r\n <SearchInput\r\n value={query}\r\n onChange={handleQueryChange}\r\n onKeyDown={handleKeyDown}\r\n onFocus={handleFocus} // Pass the onFocus handler\r\n clearQuery={handleClearQuery} // Pass the onFocus handler\r\n inputRef={inputRef}\r\n placeholder={placeholder}\r\n isFocused={isFocused}\r\n onBlur={handleBlur}\r\n isLoading={loading}\r\n clearable={clearable}\r\n />\r\n </div>\r\n </div>\r\n {searchResults.length > 0 && (\r\n <OptionList\r\n options={searchResults}\r\n selectedOptionIndex={selectedOptionIndex}\r\n handleOptionClick={handleOptionClick}\r\n label={label}\r\n />\r\n )}\r\n </div>\r\n {description && (\r\n <div className=\"HintText self-stretch text-slate-600 text-sm font-normal leading-tight\">\r\n {description}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nconst OptionList: React.FC<OptionListProps> = ({\r\n options,\r\n selectedOptionIndex,\r\n handleOptionClick,\r\n label,\r\n}) => {\r\n const containerRef = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n // Ensure the selected option is scrolled into view\r\n if (selectedOptionIndex >= 0 && selectedOptionIndex < options.length) {\r\n const selectedElement = containerRef.current?.children[\r\n selectedOptionIndex\r\n ] as HTMLDivElement;\r\n selectedElement?.scrollIntoView({\r\n behavior: \"instant\",\r\n block: \"nearest\",\r\n });\r\n }\r\n }, [selectedOptionIndex, options.length]);\r\n\r\n return (\r\n <div\r\n ref={containerRef}\r\n className={`overflow-y-auto resultOptionContainer w-full max-h-96 outline-indigo-200 absolute outline-4 bg-white border border-gray-200 drop-shadow-xl z-50 ${label ? \"top-[68px]\" : \"top-[40px]\"} *:\r\n \r\n `}\r\n >\r\n {options?.map((option, index) => (\r\n <div\r\n key={option.value as string}\r\n className={`py-2 px-4 flex items-center justify-between gap-8 hover:bg-gray-200 cursor-pointer text-sm ${\r\n selectedOptionIndex === index ? \"bg-gray-200\" : \"\"\r\n }`}\r\n onClick={() => handleOptionClick(option)}\r\n >\r\n <p className=\"font-normal\">{option.label}</p>\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SearchInput: React.FC<SearchInputProps> = ({\r\n value,\r\n onChange,\r\n onKeyDown,\r\n onFocus,\r\n onBlur,\r\n inputRef,\r\n placeholder,\r\n clearQuery,\r\n isFocused,\r\n isLoading,\r\n clearable = true,\r\n}) => {\r\n const handleExpandMoreClick = () => {\r\n inputRef.current?.focus();\r\n onFocus();\r\n };\r\n\r\n const handleClearQuery = () => {\r\n clearQuery();\r\n };\r\n\r\n return (\r\n <div className=\"relative flex items-center w-full sharedResource text-sm bg-white\">\r\n <input\r\n type=\"text\"\r\n className={`pl-1 py-1 border-gray-800 bg-white w-full ${\r\n isLoading ? \"pr-10 \" : \"pr-20\"\r\n }`}\r\n value={value}\r\n onChange={onChange}\r\n onKeyDown={onKeyDown}\r\n onFocus={onFocus}\r\n ref={inputRef}\r\n placeholder={placeholder}\r\n disabled={isLoading}\r\n />\r\n {isLoading && (\r\n <div className=\"loader absolute right-0 text-gray-500\">\r\n {/* You can replace this div with an SVG or another icon of your choice */}\r\n <svg\r\n className=\"animate-spin h-5 w-5\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n >\r\n <circle\r\n className=\"opacity-25\"\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"4\"\r\n />\r\n <path\r\n className=\"opacity-75\"\r\n fill=\"currentColor\"\r\n d=\"M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z\"\r\n />\r\n </svg>\r\n </div>\r\n )}\r\n {isFocused && !isLoading && (\r\n <MdExpandLess\r\n className=\"material-icons absolute right-0 cursor-pointer text-gray-900 lext-lg\"\r\n onClick={onBlur}\r\n />\r\n )}\r\n {!isFocused && !isLoading && (\r\n <MdExpandMore\r\n className=\"material-icons absolute right-0 cursor-pointer text-gray-900 lext-lg\"\r\n onClick={handleExpandMoreClick}\r\n />\r\n )}\r\n {value && clearable && !isLoading && (\r\n <MdClose\r\n className=\"material-icons absolute right-6 cursor-pointer text-gray-900 lext-lg\"\r\n onClick={handleClearQuery}\r\n />\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nexport default AutocompleteSearchBar;\r\n"],"names":["_b","_a"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AutocompleteSearchBar.js","sources":["../../../lib/components/form/AutocompleteSearchBar.tsx"],"sourcesContent":["import { useState, useEffect, useRef } from \"react\";\r\nimport { useClickAway } from \"react-use\";\r\nimport { IOptionItem, useFederationContext } from \"../../main\";\r\nimport { MdClose, MdExpandLess, MdExpandMore } from \"react-icons/md\";\r\n\r\ninterface OptionListProps {\r\n options: IOptionItem[];\r\n selectedOptionIndex: number;\r\n handleOptionClick: (option: IOptionItem) => void;\r\n label?: string;\r\n}\r\n\r\ninterface SearchInputProps {\r\n value: string;\r\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\r\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;\r\n onFocus: () => void;\r\n clearQuery: () => void;\r\n inputRef: React.RefObject<HTMLInputElement>;\r\n placeholder?: string;\r\n isFocused?: boolean;\r\n onBlur: () => void;\r\n isLoading?: boolean;\r\n clearable?: boolean;\r\n}\r\n\r\nconst AutocompleteSearchBar: React.FC<{\r\n label: string;\r\n name: string;\r\n required?: boolean;\r\n disabled?: boolean;\r\n description?: string;\r\n fetchUrl?: string;\r\n valueKey: string;\r\n labelKey: string;\r\n onChange: (value: any) => void;\r\n onFocus: () => void;\r\n onBlur: () => void;\r\n placeholder?: string;\r\n serverSearch?: boolean;\r\n value?: string;\r\n initOptions?: IOptionItem[];\r\n showId?: boolean;\r\n clearable?: boolean;\r\n rounded?: boolean;\r\n}> = ({\r\n label,\r\n name,\r\n required,\r\n disabled,\r\n description,\r\n fetchUrl,\r\n valueKey,\r\n labelKey,\r\n onChange,\r\n onFocus,\r\n onBlur,\r\n placeholder,\r\n serverSearch = false,\r\n value,\r\n initOptions,\r\n showId,\r\n clearable = true,\r\n rounded = true,\r\n}) => {\r\n const [query, setQuery] = useState(\"\");\r\n const [loading, setLoading] = useState(false);\r\n const [options, setOptions] = useState<IOptionItem[]>([]);\r\n const [selectedOptionIndex, setSelectedOptionIndex] = useState(-1);\r\n const [selectedOption, setSelectedOption] = useState<IOptionItem | null>(\r\n null\r\n );\r\n const [searchResults, setSearchResults] = useState<IOptionItem[]>([]);\r\n const inputRef = useRef<HTMLInputElement>(null);\r\n const ref = useRef(null);\r\n const federationContext = useFederationContext();\r\n\r\n const [isFocused, setIsFocused] = useState(false);\r\n\r\n const [errors] = useState<any>({});\r\n\r\n useEffect(() => {\r\n const fetchOptions = async () => {\r\n setLoading(true);\r\n\r\n const { data } = await federationContext.apiClient.get(fetchUrl || \"\");\r\n // osetreni obou variant navratu z BE\r\n const tmpData = data.content || data;\r\n\r\n setOptions(\r\n tmpData.map((item: any) => ({\r\n value: item[valueKey],\r\n label: item[labelKey] + (showId ? \" (\" + item[valueKey] + \")\" : \"\"),\r\n }))\r\n ); // Adjust map according to actual API response\r\n setLoading(false);\r\n };\r\n\r\n if (fetchUrl) fetchOptions();\r\n }, [fetchUrl, labelKey, showId, valueKey, federationContext.apiClient]);\r\n\r\n useEffect(() => {\r\n if (initOptions) setOptions(initOptions);\r\n }, [initOptions]);\r\n\r\n useEffect(() => {\r\n if (value && options) {\r\n const initOption = options.find((it) => it.value == value);\r\n\r\n if (initOption) {\r\n setQuery(initOption.label);\r\n setSelectedOption(initOption);\r\n }\r\n }\r\n }, [value, options]);\r\n\r\n useEffect(() => {\r\n const fetchOptions = async () => {\r\n setLoading(true);\r\n const { data } = await federationContext.apiClient.get(fetchUrl + query);\r\n setOptions(\r\n data.map((item: any) => ({\r\n value: item[valueKey],\r\n label: item[labelKey] + (showId ? \" (\" + item[valueKey] + \")\" : \"\"),\r\n }))\r\n ); // Adjust map according to actual API response\r\n setSearchResults(\r\n data.map((item: any) => ({\r\n value: item[valueKey],\r\n label: item[labelKey] + (showId ? \" (\" + item[valueKey] + \")\" : \"\"),\r\n }))\r\n ); // Adjust map according to actual API response\r\n\r\n setLoading(false);\r\n };\r\n\r\n if (serverSearch) fetchOptions();\r\n }, [\r\n query,\r\n serverSearch,\r\n valueKey,\r\n labelKey,\r\n fetchUrl,\r\n federationContext.apiClient,\r\n showId,\r\n ]);\r\n\r\n useClickAway(ref, () => {\r\n if (isFocused) {\r\n setSearchResults([]);\r\n if (!selectedOption) {\r\n setQuery(\"\");\r\n onChange(null);\r\n }\r\n\r\n handleBlur();\r\n onBlur();\r\n setIsFocused(false);\r\n }\r\n });\r\n\r\n const handleQueryChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n setQuery(event.target.value);\r\n setSelectedOption(null);\r\n setSelectedOptionIndex(-1);\r\n setSearchResults(\r\n options.filter((option) =>\r\n option?.label\r\n ?.toLowerCase()\r\n .includes(event.target?.value?.toLowerCase())\r\n )\r\n );\r\n };\r\n const handleFocus = () => {\r\n setIsFocused(true);\r\n onFocus();\r\n setSearchResults(\r\n options /*.filter((option) =>\r\n option.label.toLowerCase().includes(query.toLowerCase()),\r\n ),*/\r\n );\r\n inputRef.current?.select(); // Add this line\r\n };\r\n\r\n const handleClearQuery = () => {\r\n setQuery(\"\");\r\n onChange(null);\r\n setSelectedOption(null);\r\n setTimeout(() => {\r\n setSelectedOptionIndex(-1);\r\n setSearchResults(options);\r\n }, 1000);\r\n };\r\n\r\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n if (event.key === \"ArrowUp\" && searchResults.length > 0) {\r\n setSelectedOptionIndex((prevIndex) =>\r\n prevIndex > 0 ? prevIndex - 1 : searchResults.length - 1\r\n );\r\n } else if (event.key === \"ArrowDown\" && searchResults.length > 0) {\r\n setSelectedOptionIndex((prevIndex) =>\r\n prevIndex < searchResults.length - 1 ? prevIndex + 1 : 0\r\n );\r\n } else if (event.key === \"Enter\" && selectedOptionIndex !== -1) {\r\n handleOptionClick(searchResults[selectedOptionIndex]);\r\n } else if (event.key === \"Escape\" && selectedOptionIndex !== -1) {\r\n handleBlur();\r\n }\r\n };\r\n\r\n const handleOptionClick = (option: IOptionItem) => {\r\n setQuery(option.label);\r\n setSelectedOption(option);\r\n setSelectedOptionIndex(-1);\r\n\r\n onChange(option.value);\r\n\r\n handleBlur();\r\n };\r\n const handleBlur = () => {\r\n setSearchResults([]);\r\n onBlur();\r\n setIsFocused(false);\r\n };\r\n\r\n return (\r\n <div className=\"w-full flex-col justify-start items-start gap-1.5 inline-flex\">\r\n <div\r\n className=\"self-stretch flex-col justify-start items-start gap-1.5 flex relative\"\r\n ref={ref}\r\n >\r\n {label && (\r\n <label\r\n className=\"text-slate-700 text-sm leading-tight font-medium\"\r\n htmlFor={name}\r\n >\r\n {label} {required ? \"*\" : \"\"}\r\n </label>\r\n )}\r\n <div\r\n className={`self-stretch px-3 py-1.5 justify-start items-center gap-2 inline-flex outline-none border bg-white\r\n ${\r\n isFocused\r\n ? \"outline-4 outline-indigo-200 outline-offset-0 border-indigo-300\"\r\n : \"\"\r\n } \r\n ${\r\n isFocused && errors[name]?.message\r\n ? \"outline-4 outline-red-200 outline-offset-0 border-none\"\r\n : \"\"\r\n } \r\n ${!isFocused && errors[name]?.message ? \"border-red-200\" : \"\"} \r\n ${disabled ? \"bg-gray-100\" : \"bg-transparent\"}\r\n ${rounded ? \" rounded-lg \" : \" rounded-none \"}`}\r\n >\r\n <div className=\"Content grow shrink basis-0 min-h-5 xl:min-h-7 justify-start items-start gap-2 flex relative flex-col w-full mx-auto\">\r\n <SearchInput\r\n value={query}\r\n onChange={handleQueryChange}\r\n onKeyDown={handleKeyDown}\r\n onFocus={handleFocus} // Pass the onFocus handler\r\n clearQuery={handleClearQuery} // Pass the onFocus handler\r\n inputRef={inputRef}\r\n placeholder={placeholder}\r\n isFocused={isFocused}\r\n onBlur={handleBlur}\r\n isLoading={loading}\r\n clearable={clearable}\r\n />\r\n </div>\r\n </div>\r\n {searchResults.length > 0 && (\r\n <OptionList\r\n options={searchResults}\r\n selectedOptionIndex={selectedOptionIndex}\r\n handleOptionClick={handleOptionClick}\r\n label={label}\r\n />\r\n )}\r\n </div>\r\n {description && (\r\n <div className=\"HintText self-stretch text-slate-600 text-sm font-normal leading-tight\">\r\n {description}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nconst OptionList: React.FC<OptionListProps> = ({\r\n options,\r\n selectedOptionIndex,\r\n handleOptionClick,\r\n label,\r\n}) => {\r\n const containerRef = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n // Ensure the selected option is scrolled into view\r\n if (selectedOptionIndex >= 0 && selectedOptionIndex < options.length) {\r\n const selectedElement = containerRef.current?.children[\r\n selectedOptionIndex\r\n ] as HTMLDivElement;\r\n selectedElement?.scrollIntoView({\r\n behavior: \"instant\",\r\n block: \"nearest\",\r\n });\r\n }\r\n }, [selectedOptionIndex, options.length]);\r\n\r\n return (\r\n <div\r\n ref={containerRef}\r\n className={`overflow-y-auto resultOptionContainer w-full max-h-96 outline-indigo-200 absolute outline-4 bg-white border border-gray-200 drop-shadow-xl z-50 ${label ? \"top-[68px]\" : \"top-[40px]\"} *:\r\n \r\n `}\r\n >\r\n {options?.map((option, index) => (\r\n <div\r\n key={option.value as string}\r\n className={`py-2 px-4 flex items-center justify-between gap-8 hover:bg-gray-200 cursor-pointer text-sm ${\r\n selectedOptionIndex === index ? \"bg-gray-200\" : \"\"\r\n }`}\r\n onClick={() => handleOptionClick(option)}\r\n >\r\n <p className=\"font-normal\">{option.label}</p>\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SearchInput: React.FC<SearchInputProps> = ({\r\n value,\r\n onChange,\r\n onKeyDown,\r\n onFocus,\r\n onBlur,\r\n inputRef,\r\n placeholder,\r\n clearQuery,\r\n isFocused,\r\n isLoading,\r\n clearable = true,\r\n}) => {\r\n const handleExpandMoreClick = () => {\r\n inputRef.current?.focus();\r\n onFocus();\r\n };\r\n\r\n const handleClearQuery = () => {\r\n clearQuery();\r\n };\r\n\r\n return (\r\n <div className=\"relative flex items-center w-full sharedResource text-sm bg-white\">\r\n <input\r\n type=\"text\"\r\n className={`pl-1 py-1 border-gray-800 bg-white w-full ${\r\n isLoading ? \"pr-10 \" : \"pr-20\"\r\n }`}\r\n value={value}\r\n onChange={onChange}\r\n onKeyDown={onKeyDown}\r\n onFocus={onFocus}\r\n ref={inputRef}\r\n placeholder={placeholder}\r\n disabled={isLoading}\r\n />\r\n {isLoading && (\r\n <div className=\"loader absolute right-0 text-gray-500\">\r\n {/* You can replace this div with an SVG or another icon of your choice */}\r\n <svg\r\n className=\"animate-spin h-5 w-5\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n >\r\n <circle\r\n className=\"opacity-25\"\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"4\"\r\n />\r\n <path\r\n className=\"opacity-75\"\r\n fill=\"currentColor\"\r\n d=\"M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z\"\r\n />\r\n </svg>\r\n </div>\r\n )}\r\n {isFocused && !isLoading && (\r\n <MdExpandLess\r\n className=\"material-icons absolute right-0 cursor-pointer text-gray-900 lext-lg\"\r\n onClick={onBlur}\r\n />\r\n )}\r\n {!isFocused && !isLoading && (\r\n <MdExpandMore\r\n className=\"material-icons absolute right-0 cursor-pointer text-gray-900 lext-lg\"\r\n onClick={handleExpandMoreClick}\r\n />\r\n )}\r\n {value && clearable && !isLoading && (\r\n <MdClose\r\n className=\"material-icons absolute right-6 cursor-pointer text-gray-900 lext-lg\"\r\n onClick={handleClearQuery}\r\n />\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nexport default AutocompleteSearchBar;\r\n"],"names":["_b","_a"],"mappings":"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"}
|
|
@@ -21,7 +21,8 @@ const AutocompleteSearchBarServer = ({
|
|
|
21
21
|
onBlur,
|
|
22
22
|
placeholder,
|
|
23
23
|
returnObject,
|
|
24
|
-
value
|
|
24
|
+
value,
|
|
25
|
+
required
|
|
25
26
|
}) => {
|
|
26
27
|
const [query, setQuery] = useState("");
|
|
27
28
|
const [selectedOptionIndex, setSelectedOptionIndex] = useState(-1);
|
|
@@ -33,6 +34,7 @@ const AutocompleteSearchBarServer = ({
|
|
|
33
34
|
const ref = useRef(null);
|
|
34
35
|
const federationContext = useFederationContext();
|
|
35
36
|
const [isFocused, setIsFocused] = useState(false);
|
|
37
|
+
const [isLoading, setIsLoading] = useState(false);
|
|
36
38
|
useEffect(() => {
|
|
37
39
|
if (!value) {
|
|
38
40
|
setQuery("");
|
|
@@ -41,7 +43,9 @@ const AutocompleteSearchBarServer = ({
|
|
|
41
43
|
}, [value]);
|
|
42
44
|
useEffect(() => {
|
|
43
45
|
const fetchOptions = async () => {
|
|
46
|
+
setIsLoading(true);
|
|
44
47
|
const { data } = await federationContext.apiClient.get(fetchUrl + query);
|
|
48
|
+
setIsLoading(false);
|
|
45
49
|
const tmpData = data.content || data;
|
|
46
50
|
setSearchResults(
|
|
47
51
|
tmpData.map((item) => ({
|
|
@@ -57,6 +61,7 @@ const AutocompleteSearchBarServer = ({
|
|
|
57
61
|
}, [query, valueKey, labelKey, fetchUrl, federationContext.apiClient]);
|
|
58
62
|
useClickAway(ref, () => {
|
|
59
63
|
if (isFocused) {
|
|
64
|
+
setIsLoading(false);
|
|
60
65
|
setSearchResults([]);
|
|
61
66
|
setQuery("");
|
|
62
67
|
if (!selectedOption) {
|
|
@@ -125,6 +130,7 @@ const AutocompleteSearchBarServer = ({
|
|
|
125
130
|
label,
|
|
126
131
|
name: String(name) + "_InputField",
|
|
127
132
|
onInputChange: handleQueryChange,
|
|
133
|
+
required,
|
|
128
134
|
type: "text",
|
|
129
135
|
value: (selectedOption == null ? void 0 : selectedOption.label) || query,
|
|
130
136
|
disabled,
|
|
@@ -154,7 +160,7 @@ const AutocompleteSearchBarServer = ({
|
|
|
154
160
|
"div",
|
|
155
161
|
{
|
|
156
162
|
className: `absolute text-sm py-2 px-4 w-full outline-4 bg-white border text-gray-400 border-gray-200 drop-shadow-xl z-50 ${label ? "top-[68px]" : "top-[40px]"}`,
|
|
157
|
-
children: "Nic nenalezeno"
|
|
163
|
+
children: !isLoading && "Nic nenalezeno"
|
|
158
164
|
}
|
|
159
165
|
),
|
|
160
166
|
searchResults.length > 0 && isFocused && query && /* @__PURE__ */ jsx(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AutocompleteSearchBarServer.js","sources":["../../../lib/components/form/AutocompleteSearchBarServer.tsx"],"sourcesContent":["import { useState, useEffect, useRef } from \"react\";\r\nimport { useClickAway } from \"react-use\";\r\nimport { MdExpandLess, MdExpandMore } from \"react-icons/md\";\r\nimport { InputField, IOptionItem, useFederationContext } from \"../../main\";\r\n\r\ninterface OptionListProps {\r\n options: IOptionItem[];\r\n selectedOptionIndex: number;\r\n handleOptionClick: (option: IOptionItem) => void;\r\n label?: string;\r\n}\r\n\r\nconst AutocompleteSearchBarServer: React.FC<{\r\n label: string;\r\n name: string;\r\n required?: boolean;\r\n disabled?: boolean;\r\n description?: string;\r\n fetchUrl?: string;\r\n valueKey: string;\r\n labelKey: string | ((item: any) => string);\r\n onChange: (value: any) => void;\r\n onFocus: () => void;\r\n onBlur: () => void;\r\n placeholder?: string;\r\n value?: string;\r\n initOptions?: IOptionItem[];\r\n clearable?: boolean;\r\n returnObject: boolean;\r\n}> = ({\r\n label,\r\n name,\r\n disabled,\r\n description,\r\n fetchUrl,\r\n valueKey,\r\n labelKey,\r\n onChange,\r\n onFocus,\r\n onBlur,\r\n placeholder,\r\n returnObject,\r\n value,\r\n}) => {\r\n const [query, setQuery] = useState(\"\");\r\n const [selectedOptionIndex, setSelectedOptionIndex] = useState(-1);\r\n const [selectedOption, setSelectedOption] = useState<IOptionItem | null>(\r\n null\r\n );\r\n const [searchResults, setSearchResults] = useState<IOptionItem[]>([]);\r\n const inputRef = useRef<HTMLInputElement>(null);\r\n const ref = useRef(null);\r\n const federationContext = useFederationContext();\r\n const [isFocused, setIsFocused] = useState(false);\r\n // const [errors] = useState<any>({});\r\n\r\n useEffect(() => {\r\n if (!value) {\r\n setQuery(\"\");\r\n setSelectedOption(null);\r\n }\r\n }, [value]);\r\n\r\n //fetch options\r\n useEffect(() => {\r\n const fetchOptions = async () => {\r\n const { data } = await federationContext.apiClient.get(fetchUrl + query);\r\n const tmpData = data.content || data;\r\n\r\n setSearchResults(\r\n tmpData.map((item: any) => ({\r\n value: item[valueKey],\r\n label: labelKey instanceof Function ? labelKey(item) : item[labelKey],\r\n }))\r\n );\r\n };\r\n setSearchResults([]);\r\n\r\n if (query && valueKey && labelKey && fetchUrl && !selectedOption) {\r\n fetchOptions();\r\n }\r\n }, [query, valueKey, labelKey, fetchUrl, federationContext.apiClient]);\r\n\r\n useClickAway(ref, () => {\r\n if (isFocused) {\r\n setSearchResults([]);\r\n setQuery(\"\");\r\n if (!selectedOption) {\r\n onChange(null);\r\n }\r\n onBlur();\r\n setIsFocused(false);\r\n }\r\n });\r\n\r\n const handleQueryChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n if (event.target.value == selectedOption?.label) {\r\n return;\r\n } else if (event.target.value) {\r\n setIsFocused(true);\r\n setSearchResults([]);\r\n setQuery(event.target.value);\r\n\r\n setSelectedOption(null);\r\n setSelectedOptionIndex(-1);\r\n } else {\r\n //clear handler\r\n onChange(null);\r\n setQuery(\"\");\r\n setSelectedOption(null);\r\n setTimeout(() => {\r\n setSelectedOptionIndex(-1);\r\n setSearchResults([]);\r\n }, 100);\r\n setIsFocused(false);\r\n }\r\n };\r\n const handleFocus = () => {\r\n setIsFocused(true);\r\n setSearchResults([]);\r\n onFocus();\r\n inputRef.current?.select(); // Add this line\r\n };\r\n\r\n const handleOptionClick = (option: IOptionItem) => {\r\n setSelectedOption(option);\r\n setSearchResults([]);\r\n setSelectedOptionIndex(-1);\r\n setQuery(\"\");\r\n onChange(returnObject ? option : option.value);\r\n setIsFocused(false);\r\n };\r\n const handleBlur = () => {\r\n setSearchResults([]);\r\n setTimeout(() => {\r\n if (!selectedOption) {\r\n setQuery(\"\");\r\n onChange(null);\r\n }\r\n }, 1);\r\n\r\n onBlur();\r\n setIsFocused(false);\r\n };\r\n\r\n return (\r\n <div\r\n className=\"w-full flex-col justify-start items-start gap-1.5 inline-flex relative\"\r\n ref={ref}\r\n >\r\n <InputField\r\n manualRef={inputRef}\r\n label={label}\r\n name={String(name) + \"_InputField\"}\r\n onInputChange={handleQueryChange}\r\n type=\"text\"\r\n value={selectedOption?.label || query}\r\n disabled={disabled}\r\n clearable\r\n className=\" min-w-[100px] px-0 \"\r\n rounded={true}\r\n placeholder={placeholder}\r\n debounceTimeout={1000}\r\n description={description}\r\n onFocus={handleFocus}\r\n onBlur={handleBlur}\r\n disableAutocomplete\r\n >\r\n <div className=\" h-6 w-6 items-center flex justify-center hover:bg-gray-100 rounded-full text-lg cursor-pointer\">\r\n {isFocused && <MdExpandLess />}\r\n {!isFocused && <MdExpandMore />}\r\n </div>\r\n </InputField>\r\n {searchResults.length == 0 && isFocused && !query && (\r\n <div\r\n className={`absolute text-sm py-2 px-4 w-full outline-4 bg-white text-gray-400 border border-gray-200 drop-shadow-xl z-50 ${label ? \"top-[68px]\" : \"top-[40px]\"}`}\r\n >\r\n Začněte psát...\r\n </div>\r\n )}\r\n {searchResults.length == 0 && isFocused && query && (\r\n <div\r\n className={`absolute text-sm py-2 px-4 w-full outline-4 bg-white border text-gray-400 border-gray-200 drop-shadow-xl z-50 ${label ? \"top-[68px]\" : \"top-[40px]\"}`}\r\n >\r\n Nic nenalezeno\r\n </div>\r\n )}\r\n {searchResults.length > 0 && isFocused && query && (\r\n <OptionList\r\n options={searchResults}\r\n selectedOptionIndex={selectedOptionIndex}\r\n handleOptionClick={handleOptionClick}\r\n label={label}\r\n />\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nconst OptionList: React.FC<OptionListProps> = ({\r\n options,\r\n selectedOptionIndex,\r\n handleOptionClick,\r\n label,\r\n}) => {\r\n const containerRef = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n // Ensure the selected option is scrolled into view\r\n if (selectedOptionIndex >= 0 && selectedOptionIndex < options.length) {\r\n const selectedElement = containerRef.current?.children[\r\n selectedOptionIndex\r\n ] as HTMLDivElement;\r\n selectedElement?.scrollIntoView({\r\n behavior: \"instant\",\r\n block: \"nearest\",\r\n });\r\n }\r\n }, [selectedOptionIndex, options.length]);\r\n const handleMouseDown = (event: any) => {\r\n event.preventDefault();\r\n };\r\n return (\r\n <div\r\n ref={containerRef}\r\n className={`overflow-y-auto resultOptionContainer w-full max-h-96 outline-indigo-200 absolute outline-4 bg-white border border-gray-200 drop-shadow-xl z-50 ${label ? \"top-[68px]\" : \"top-[40px]\"} *:\r\n \r\n `}\r\n >\r\n {options?.map((option, index) => (\r\n <div\r\n key={option.value as string}\r\n className={`py-2 px-4 flex items-center justify-between gap-8 hover:bg-gray-200 cursor-pointer text-sm ${\r\n selectedOptionIndex === index ? \"bg-gray-200\" : \"\"\r\n }`}\r\n onClick={(e) => {\r\n e.preventDefault();\r\n handleOptionClick(option);\r\n }}\r\n onMouseDown={handleMouseDown}\r\n >\r\n <p className=\"font-normal\">{option.label}</p>\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nexport default AutocompleteSearchBarServer;\r\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AutocompleteSearchBarServer.js","sources":["../../../lib/components/form/AutocompleteSearchBarServer.tsx"],"sourcesContent":["import { useState, useEffect, useRef } from \"react\";\r\nimport { useClickAway } from \"react-use\";\r\nimport { MdExpandLess, MdExpandMore } from \"react-icons/md\";\r\nimport { InputField, IOptionItem, useFederationContext } from \"../../main\";\r\n\r\ninterface OptionListProps {\r\n options: IOptionItem[];\r\n selectedOptionIndex: number;\r\n handleOptionClick: (option: IOptionItem) => void;\r\n label?: string;\r\n}\r\n\r\nconst AutocompleteSearchBarServer: React.FC<{\r\n label: string;\r\n name: string;\r\n required?: boolean;\r\n disabled?: boolean;\r\n description?: string;\r\n fetchUrl?: string;\r\n valueKey: string;\r\n labelKey: string | ((item: any) => string);\r\n onChange: (value: any) => void;\r\n onFocus: () => void;\r\n onBlur: () => void;\r\n placeholder?: string;\r\n value?: string;\r\n initOptions?: IOptionItem[];\r\n clearable?: boolean;\r\n returnObject: boolean;\r\n}> = ({\r\n label,\r\n name,\r\n disabled,\r\n description,\r\n fetchUrl,\r\n valueKey,\r\n labelKey,\r\n onChange,\r\n onFocus,\r\n onBlur,\r\n placeholder,\r\n returnObject,\r\n value,\r\n required,\r\n}) => {\r\n const [query, setQuery] = useState(\"\");\r\n const [selectedOptionIndex, setSelectedOptionIndex] = useState(-1);\r\n const [selectedOption, setSelectedOption] = useState<IOptionItem | null>(\r\n null\r\n );\r\n const [searchResults, setSearchResults] = useState<IOptionItem[]>([]);\r\n const inputRef = useRef<HTMLInputElement>(null);\r\n const ref = useRef(null);\r\n const federationContext = useFederationContext();\r\n const [isFocused, setIsFocused] = useState(false);\r\n const [isLoading, setIsLoading] = useState(false);\r\n // const [errors] = useState<any>({});\r\n\r\n useEffect(() => {\r\n if (!value) {\r\n setQuery(\"\");\r\n setSelectedOption(null);\r\n }\r\n }, [value]);\r\n\r\n //fetch options\r\n useEffect(() => {\r\n const fetchOptions = async () => {\r\n setIsLoading(true);\r\n const { data } = await federationContext.apiClient.get(fetchUrl + query);\r\n setIsLoading(false);\r\n const tmpData = data.content || data;\r\n\r\n setSearchResults(\r\n tmpData.map((item: any) => ({\r\n value: item[valueKey],\r\n label: labelKey instanceof Function ? labelKey(item) : item[labelKey],\r\n }))\r\n );\r\n };\r\n setSearchResults([]);\r\n\r\n if (query && valueKey && labelKey && fetchUrl && !selectedOption) {\r\n fetchOptions();\r\n }\r\n }, [query, valueKey, labelKey, fetchUrl, federationContext.apiClient]);\r\n\r\n useClickAway(ref, () => {\r\n if (isFocused) {\r\n setIsLoading(false);\r\n setSearchResults([]);\r\n setQuery(\"\");\r\n if (!selectedOption) {\r\n onChange(null);\r\n }\r\n onBlur();\r\n setIsFocused(false);\r\n }\r\n });\r\n\r\n const handleQueryChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n if (event.target.value == selectedOption?.label) {\r\n return;\r\n } else if (event.target.value) {\r\n setIsFocused(true);\r\n setSearchResults([]);\r\n setQuery(event.target.value);\r\n\r\n setSelectedOption(null);\r\n setSelectedOptionIndex(-1);\r\n } else {\r\n //clear handler\r\n onChange(null);\r\n setQuery(\"\");\r\n setSelectedOption(null);\r\n setTimeout(() => {\r\n setSelectedOptionIndex(-1);\r\n setSearchResults([]);\r\n }, 100);\r\n setIsFocused(false);\r\n }\r\n };\r\n const handleFocus = () => {\r\n setIsFocused(true);\r\n setSearchResults([]);\r\n onFocus();\r\n inputRef.current?.select(); // Add this line\r\n };\r\n\r\n const handleOptionClick = (option: IOptionItem) => {\r\n setSelectedOption(option);\r\n setSearchResults([]);\r\n setSelectedOptionIndex(-1);\r\n setQuery(\"\");\r\n onChange(returnObject ? option : option.value);\r\n setIsFocused(false);\r\n };\r\n const handleBlur = () => {\r\n setSearchResults([]);\r\n setTimeout(() => {\r\n if (!selectedOption) {\r\n setQuery(\"\");\r\n onChange(null);\r\n }\r\n }, 1);\r\n\r\n onBlur();\r\n setIsFocused(false);\r\n };\r\n\r\n return (\r\n <div\r\n className=\"w-full flex-col justify-start items-start gap-1.5 inline-flex relative\"\r\n ref={ref}\r\n >\r\n <InputField\r\n manualRef={inputRef}\r\n label={label}\r\n name={String(name) + \"_InputField\"}\r\n onInputChange={handleQueryChange}\r\n required={required}\r\n type=\"text\"\r\n value={selectedOption?.label || query}\r\n disabled={disabled}\r\n clearable\r\n className=\" min-w-[100px] px-0 \"\r\n rounded={true}\r\n placeholder={placeholder}\r\n debounceTimeout={1000}\r\n description={description}\r\n onFocus={handleFocus}\r\n onBlur={handleBlur}\r\n disableAutocomplete\r\n >\r\n <div className=\" h-6 w-6 items-center flex justify-center hover:bg-gray-100 rounded-full text-lg cursor-pointer\">\r\n {isFocused && <MdExpandLess />}\r\n {!isFocused && <MdExpandMore />}\r\n </div>\r\n </InputField>\r\n {searchResults.length == 0 && isFocused && !query && (\r\n <div\r\n className={`absolute text-sm py-2 px-4 w-full outline-4 bg-white text-gray-400 border border-gray-200 drop-shadow-xl z-50 ${label ? \"top-[68px]\" : \"top-[40px]\"}`}\r\n >\r\n Začněte psát...\r\n </div>\r\n )}\r\n {searchResults.length == 0 && isFocused && query && (\r\n <div\r\n className={`absolute text-sm py-2 px-4 w-full outline-4 bg-white border text-gray-400 border-gray-200 drop-shadow-xl z-50 ${label ? \"top-[68px]\" : \"top-[40px]\"}`}\r\n >\r\n {!isLoading && \"Nic nenalezeno\"}\r\n </div>\r\n )}\r\n {searchResults.length > 0 && isFocused && query && (\r\n <OptionList\r\n options={searchResults}\r\n selectedOptionIndex={selectedOptionIndex}\r\n handleOptionClick={handleOptionClick}\r\n label={label}\r\n />\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nconst OptionList: React.FC<OptionListProps> = ({\r\n options,\r\n selectedOptionIndex,\r\n handleOptionClick,\r\n label,\r\n}) => {\r\n const containerRef = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n // Ensure the selected option is scrolled into view\r\n if (selectedOptionIndex >= 0 && selectedOptionIndex < options.length) {\r\n const selectedElement = containerRef.current?.children[\r\n selectedOptionIndex\r\n ] as HTMLDivElement;\r\n selectedElement?.scrollIntoView({\r\n behavior: \"instant\",\r\n block: \"nearest\",\r\n });\r\n }\r\n }, [selectedOptionIndex, options.length]);\r\n const handleMouseDown = (event: any) => {\r\n event.preventDefault();\r\n };\r\n return (\r\n <div\r\n ref={containerRef}\r\n className={`overflow-y-auto resultOptionContainer w-full max-h-96 outline-indigo-200 absolute outline-4 bg-white border border-gray-200 drop-shadow-xl z-50 ${label ? \"top-[68px]\" : \"top-[40px]\"} *:\r\n \r\n `}\r\n >\r\n {options?.map((option, index) => (\r\n <div\r\n key={option.value as string}\r\n className={`py-2 px-4 flex items-center justify-between gap-8 hover:bg-gray-200 cursor-pointer text-sm ${\r\n selectedOptionIndex === index ? \"bg-gray-200\" : \"\"\r\n }`}\r\n onClick={(e) => {\r\n e.preventDefault();\r\n handleOptionClick(option);\r\n }}\r\n onMouseDown={handleMouseDown}\r\n >\r\n <p className=\"font-normal\">{option.label}</p>\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nexport default AutocompleteSearchBarServer;\r\n"],"names":[],"mappings":"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"}
|
package/dist/utils/PdfManager.js
CHANGED
|
@@ -123,8 +123,7 @@ class PDFManager {
|
|
|
123
123
|
appendPageTitleWithLine(title, fontSize = 14) {
|
|
124
124
|
this.appendText(title, { fontSize, bold: true });
|
|
125
125
|
this.appendSquare({
|
|
126
|
-
color: "#
|
|
127
|
-
// Green square
|
|
126
|
+
color: "#000",
|
|
128
127
|
height: 0.2,
|
|
129
128
|
width: 180,
|
|
130
129
|
marginTop: -fontSize / 3,
|
|
@@ -138,7 +137,7 @@ class PDFManager {
|
|
|
138
137
|
}
|
|
139
138
|
appendPageTitleWithSquare(title) {
|
|
140
139
|
this.appendSquare({
|
|
141
|
-
color: "#
|
|
140
|
+
color: "#000",
|
|
142
141
|
// Green square
|
|
143
142
|
height: 10,
|
|
144
143
|
width: 10,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PdfManager.js","sources":["../../lib/utils/PdfManager.ts"],"sourcesContent":["import jsPDF from \"jspdf\";\r\nimport \"jspdf-autotable\";\r\nimport fontArial from \"../fonts/arial\";\r\nimport fontArialBold from \"../fonts/arialBold\";\r\n\r\nclass PDFManager {\r\n private doc: jsPDF;\r\n private currentYPosition: number;\r\n private pageHeight: number;\r\n\r\n constructor() {\r\n this.doc = new jsPDF();\r\n this.pageHeight = this.doc.internal.pageSize.height; // Get page height\r\n this.currentYPosition = 10; // Start position at the top of the page\r\n this.loadFonts();\r\n }\r\n\r\n private loadFonts() {\r\n this.doc.addFileToVFS(\"arial.ttf\", fontArial);\r\n this.doc.addFont(\"arial.ttf\", \"Arial\", \"normal\");\r\n this.doc.addFileToVFS(\"arialBold.ttf\", fontArialBold);\r\n this.doc.addFont(\"arialBold.ttf\", \"Arial\", \"bold\");\r\n this.doc.setFont(\"Arial\", \"normal\");\r\n }\r\n\r\n /**\r\n * Checks if a page break is needed and adds a new page if required.\r\n */\r\n private checkPageBreak(lineHeight: number) {\r\n if (this.currentYPosition + lineHeight >= this.pageHeight) {\r\n this.doc.addPage();\r\n this.currentYPosition = 10; // Reset Y position for the new page\r\n }\r\n }\r\n\r\n /**\r\n * Appends text to the current PDF document.\r\n */\r\n appendText(\r\n text: string,\r\n options: {\r\n fontSize?: number;\r\n bold?: boolean;\r\n marginLeft?: number;\r\n marginTop?: number;\r\n marginBottom?: number;\r\n } = {},\r\n textOptions: any = {},\r\n ) {\r\n const {\r\n fontSize = 12,\r\n bold = false,\r\n marginTop = 0,\r\n marginLeft = 0,\r\n marginBottom = 0,\r\n } = options;\r\n const lineHeight = fontSize * 0.5; // Approximate line height based on font size\r\n const maxWidth = textOptions.width || 180 - marginLeft; // Adjust width based on offset\r\n\r\n this.doc.setFontSize(fontSize);\r\n\r\n this.doc.setFont(\"Arial\", bold ? \"bold\" : \"normal\");\r\n\r\n // Split the text into multiple lines if it exceeds the maxWidth\r\n const textLines = this.doc.splitTextToSize(text, maxWidth);\r\n this.currentYPosition += marginTop;\r\n // Loop through each line and append it to the document\r\n textLines.forEach((line: string) => {\r\n this.checkPageBreak(lineHeight); // Check if new page is needed\r\n this.doc.text(line, 10 + marginLeft, this.currentYPosition, {\r\n maxWidth, ...textOptions\r\n });\r\n\r\n this.currentYPosition += lineHeight; // Update Y position after each line\r\n });\r\n this.currentYPosition += marginBottom;\r\n }\r\n\r\n appendSquare(\r\n options: {\r\n color?: [number, number, number] | string; // RGB color or string (default is black)\r\n height?: number; // Square height (default is 10 units)\r\n width?: number; // Square width (default is 10 units)\r\n marginLeft?: number; // Left margin before the table\r\n marginTop?: number; // Top margin before the table\r\n marginBottom?: number; // Bottom margin after the table\r\n startX?: number; // X coordinate where the square starts (default is 10)\r\n fill?: boolean; // Whether the square should be filled or outlined (default is true)\r\n } = {},\r\n ) {\r\n const {\r\n color = [0, 0, 0], // Default black color\r\n height = 10, // Default square height\r\n width = 10, // Default square width\r\n marginTop = 0, // Default no offset\r\n marginBottom = 0, // Default no offset\r\n marginLeft = 0, // Default no offset\r\n startX = 10, // Default starting X position\r\n fill = true, // Default to filled square\r\n } = options;\r\n\r\n // Adjust currentYPosition for any offset\r\n this.currentYPosition += marginTop;\r\n\r\n // Check if a new page is needed\r\n this.checkPageBreak(height + marginTop + marginBottom);\r\n\r\n // Set the color for the square\r\n if (Array.isArray(color)) {\r\n this.doc.setFillColor(...color); // For RGB color\r\n this.doc.setDrawColor(...color); // For outline color in case it's not filled\r\n } else {\r\n this.doc.setFillColor(color); // For string color (e.g., 'red', '#FF0000')\r\n this.doc.setDrawColor(color); // For outline color in case it's not filled\r\n }\r\n\r\n // Draw the square (filled or outlined)\r\n if (fill) {\r\n this.doc.rect(startX + marginLeft, this.currentYPosition, width, height, \"F\"); // F for filled\r\n } else {\r\n this.doc.rect(startX + marginLeft, this.currentYPosition, width, height, \"S\"); // S for outlined (stroke)\r\n }\r\n\r\n // Update Y position after the square (including bottom margin)\r\n this.currentYPosition += height + marginBottom;\r\n }\r\n appendTable(\r\n headers: string[] | null, // The table headers\r\n data: any[][], // The table data as an array of arrays\r\n options: {\r\n bold?: boolean; // Bold font for headers\r\n marginLeft?: number; // Left margin before the table\r\n marginRight?: number; // Left margin before the table\r\n marginTop?: number; // Top margin before the table\r\n marginBottom?: number; // Bottom margin after the table\r\n } = {},\r\n tableOptions: any = {},\r\n ) {\r\n const {\r\n bold = true,\r\n marginLeft = 0,\r\n marginRight = 0,\r\n marginTop = 0,\r\n marginBottom = 0,\r\n } = options;\r\n\r\n // Adjust the current Y position with the top margin\r\n this.currentYPosition += marginTop;\r\n\r\n // Append the table using autoTable\r\n (this.doc as any).autoTable({\r\n head: headers ? [headers] : null,\r\n body: data,\r\n startY: this.currentYPosition,\r\n margin: { left: 10 + marginLeft, right: 10 + marginRight }, // Adjust the left margin\r\n styles: { ...tableOptions.styles },\r\n headStyles: { fontStyle: bold ? \"bold\" : \"normal\" },\r\n ...tableOptions,\r\n });\r\n\r\n // Update the Y position after the table\r\n this.currentYPosition =\r\n (this.doc as any).lastAutoTable.finalY + marginBottom;\r\n }\r\n\r\n //helper function for appening title with square\r\n appendPageTitle(title: string) {\r\n this.appendText(title, { fontSize: 14, bold: true });\r\n\r\n }\r\n appendPageTitleWithLine(title: string, fontSize: number = 14) {\r\n this.appendText(title, { fontSize: fontSize, bold: true });\r\n this.appendSquare({\r\n color: \"#002EA3\", // Green square\r\n height: 0.2,\r\n width: 180,\r\n marginTop: -fontSize / 3, // Add space between squares\r\n marginBottom: (fontSize / 2) + 1, // Add space between squares\r\n startX: 10,\r\n fill: true, // Filled green square\r\n });\r\n }\r\n\r\n appendPageTitleWithSquare(title: string) {\r\n this.appendSquare({\r\n color: \"#002EA3\", // Green square\r\n height: 10,\r\n width: 10,\r\n marginTop: 0, // Add space between squares\r\n marginBottom: 0, // Add space between squares\r\n startX: 10,\r\n fill: true, // Filled green square\r\n });\r\n this.appendText(title, { fontSize: 14, bold: true, marginLeft: 12, marginTop: -6, marginBottom: 5 });\r\n\r\n }\r\n\r\n\r\n\r\n\r\n /**\r\n * Saves the current PDF document.\r\n */\r\n savePDF(fileName: string = \"report.pdf\") {\r\n this.doc.save(fileName);\r\n this.doc.close()\r\n }\r\n}\r\n\r\nexport default PDFManager;\r\n"],"names":["jsPDF"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PdfManager.js","sources":["../../lib/utils/PdfManager.ts"],"sourcesContent":["import jsPDF from \"jspdf\";\r\nimport \"jspdf-autotable\";\r\nimport fontArial from \"../fonts/arial\";\r\nimport fontArialBold from \"../fonts/arialBold\";\r\n\r\nclass PDFManager {\r\n private doc: jsPDF;\r\n private currentYPosition: number;\r\n private pageHeight: number;\r\n\r\n constructor() {\r\n this.doc = new jsPDF();\r\n this.pageHeight = this.doc.internal.pageSize.height; // Get page height\r\n this.currentYPosition = 10; // Start position at the top of the page\r\n this.loadFonts();\r\n }\r\n\r\n private loadFonts() {\r\n this.doc.addFileToVFS(\"arial.ttf\", fontArial);\r\n this.doc.addFont(\"arial.ttf\", \"Arial\", \"normal\");\r\n this.doc.addFileToVFS(\"arialBold.ttf\", fontArialBold);\r\n this.doc.addFont(\"arialBold.ttf\", \"Arial\", \"bold\");\r\n this.doc.setFont(\"Arial\", \"normal\");\r\n }\r\n\r\n /**\r\n * Checks if a page break is needed and adds a new page if required.\r\n */\r\n private checkPageBreak(lineHeight: number) {\r\n if (this.currentYPosition + lineHeight >= this.pageHeight) {\r\n this.doc.addPage();\r\n this.currentYPosition = 10; // Reset Y position for the new page\r\n }\r\n }\r\n\r\n /**\r\n * Appends text to the current PDF document.\r\n */\r\n appendText(\r\n text: string,\r\n options: {\r\n fontSize?: number;\r\n bold?: boolean;\r\n marginLeft?: number;\r\n marginTop?: number;\r\n marginBottom?: number;\r\n } = {},\r\n textOptions: any = {},\r\n ) {\r\n const {\r\n fontSize = 12,\r\n bold = false,\r\n marginTop = 0,\r\n marginLeft = 0,\r\n marginBottom = 0,\r\n } = options;\r\n const lineHeight = fontSize * 0.5; // Approximate line height based on font size\r\n const maxWidth = textOptions.width || 180 - marginLeft; // Adjust width based on offset\r\n\r\n this.doc.setFontSize(fontSize);\r\n\r\n this.doc.setFont(\"Arial\", bold ? \"bold\" : \"normal\");\r\n\r\n // Split the text into multiple lines if it exceeds the maxWidth\r\n const textLines = this.doc.splitTextToSize(text, maxWidth);\r\n this.currentYPosition += marginTop;\r\n // Loop through each line and append it to the document\r\n textLines.forEach((line: string) => {\r\n this.checkPageBreak(lineHeight); // Check if new page is needed\r\n this.doc.text(line, 10 + marginLeft, this.currentYPosition, {\r\n maxWidth, ...textOptions\r\n });\r\n\r\n this.currentYPosition += lineHeight; // Update Y position after each line\r\n });\r\n this.currentYPosition += marginBottom;\r\n }\r\n\r\n appendSquare(\r\n options: {\r\n color?: [number, number, number] | string; // RGB color or string (default is black)\r\n height?: number; // Square height (default is 10 units)\r\n width?: number; // Square width (default is 10 units)\r\n marginLeft?: number; // Left margin before the table\r\n marginTop?: number; // Top margin before the table\r\n marginBottom?: number; // Bottom margin after the table\r\n startX?: number; // X coordinate where the square starts (default is 10)\r\n fill?: boolean; // Whether the square should be filled or outlined (default is true)\r\n } = {},\r\n ) {\r\n const {\r\n color = [0, 0, 0], // Default black color\r\n height = 10, // Default square height\r\n width = 10, // Default square width\r\n marginTop = 0, // Default no offset\r\n marginBottom = 0, // Default no offset\r\n marginLeft = 0, // Default no offset\r\n startX = 10, // Default starting X position\r\n fill = true, // Default to filled square\r\n } = options;\r\n\r\n // Adjust currentYPosition for any offset\r\n this.currentYPosition += marginTop;\r\n\r\n // Check if a new page is needed\r\n this.checkPageBreak(height + marginTop + marginBottom);\r\n\r\n // Set the color for the square\r\n if (Array.isArray(color)) {\r\n this.doc.setFillColor(...color); // For RGB color\r\n this.doc.setDrawColor(...color); // For outline color in case it's not filled\r\n } else {\r\n this.doc.setFillColor(color); // For string color (e.g., 'red', '#FF0000')\r\n this.doc.setDrawColor(color); // For outline color in case it's not filled\r\n }\r\n\r\n // Draw the square (filled or outlined)\r\n if (fill) {\r\n this.doc.rect(startX + marginLeft, this.currentYPosition, width, height, \"F\"); // F for filled\r\n } else {\r\n this.doc.rect(startX + marginLeft, this.currentYPosition, width, height, \"S\"); // S for outlined (stroke)\r\n }\r\n\r\n // Update Y position after the square (including bottom margin)\r\n this.currentYPosition += height + marginBottom;\r\n }\r\n appendTable(\r\n headers: string[] | null, // The table headers\r\n data: any[][], // The table data as an array of arrays\r\n options: {\r\n bold?: boolean; // Bold font for headers\r\n marginLeft?: number; // Left margin before the table\r\n marginRight?: number; // Left margin before the table\r\n marginTop?: number; // Top margin before the table\r\n marginBottom?: number; // Bottom margin after the table\r\n } = {},\r\n tableOptions: any = {},\r\n ) {\r\n const {\r\n bold = true,\r\n marginLeft = 0,\r\n marginRight = 0,\r\n marginTop = 0,\r\n marginBottom = 0,\r\n } = options;\r\n\r\n // Adjust the current Y position with the top margin\r\n this.currentYPosition += marginTop;\r\n\r\n // Append the table using autoTable\r\n (this.doc as any).autoTable({\r\n head: headers ? [headers] : null,\r\n body: data,\r\n startY: this.currentYPosition,\r\n margin: { left: 10 + marginLeft, right: 10 + marginRight }, // Adjust the left margin\r\n styles: { ...tableOptions.styles },\r\n headStyles: { fontStyle: bold ? \"bold\" : \"normal\" },\r\n ...tableOptions,\r\n });\r\n\r\n // Update the Y position after the table\r\n this.currentYPosition =\r\n (this.doc as any).lastAutoTable.finalY + marginBottom;\r\n }\r\n\r\n //helper function for appening title with square\r\n appendPageTitle(title: string) {\r\n this.appendText(title, { fontSize: 14, bold: true });\r\n\r\n }\r\n appendPageTitleWithLine(title: string, fontSize: number = 14) {\r\n this.appendText(title, { fontSize: fontSize, bold: true });\r\n this.appendSquare({\r\n color: \"#000\",\r\n height: 0.2,\r\n width: 180,\r\n marginTop: -fontSize / 3, // Add space between squares\r\n marginBottom: (fontSize / 2) + 1, // Add space between squares\r\n startX: 10,\r\n fill: true, // Filled green square\r\n });\r\n }\r\n\r\n appendPageTitleWithSquare(title: string) {\r\n this.appendSquare({\r\n color: \"#000\", // Green square\r\n height: 10,\r\n width: 10,\r\n marginTop: 0, // Add space between squares\r\n marginBottom: 0, // Add space between squares\r\n startX: 10,\r\n fill: true, // Filled green square\r\n });\r\n this.appendText(title, { fontSize: 14, bold: true, marginLeft: 12, marginTop: -6, marginBottom: 5 });\r\n\r\n }\r\n\r\n\r\n\r\n\r\n /**\r\n * Saves the current PDF document.\r\n */\r\n savePDF(fileName: string = \"report.pdf\") {\r\n this.doc.save(fileName);\r\n this.doc.close()\r\n }\r\n}\r\n\r\nexport default PDFManager;\r\n"],"names":["jsPDF"],"mappings":"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"}
|