UNPKG

gif-picker-react

Version:

Multi-provider GIF Picker for React with pluggable provider support

1 lines 38.6 kB
{"version":3,"file":"index.cjs","names":["React","React","React","React"],"sources":["../src/components/ErrorBoundary.tsx","../src/context/PickerContext.ts","../src/context/ProviderContext.ts","../src/context/SettingsContext.ts","../src/components/placeholders/Placeholder.tsx","../src/components/placeholders/CategoryPlaceholder.tsx","../src/components/body/Category.tsx","../src/components/body/FeaturedCategory.tsx","../src/components/body/TrendingCategory.tsx","../src/components/body/CategoryList.tsx","../src/components/placeholders/ResultPlaceholder.tsx","../src/components/body/GifListPlaceholder.tsx","../src/components/body/ResultImage.tsx","../src/components/body/GifList.tsx","../src/components/body/SearchResult.tsx","../src/components/body/TrendingResult.tsx","../src/components/body/Body.tsx","../src/hooks/useAttribution.ts","../src/components/footer/Footer.tsx","../src/components/Button.tsx","../src/components/header/ClearButton.tsx","../src/components/header/Search.tsx","../src/components/header/Title.tsx","../src/components/header/Header.tsx","../src/components/PickerMain.tsx","../src/hooks/usePickerContext.ts","../src/hooks/useSettings.ts","../src/GifPickerReact.tsx","../src/index.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport interface ErrorBoundaryProps {\n\tchildren: React.ReactNode;\n}\n\nexport interface ErrorBoundaryState {\n\thasError: boolean;\n}\n\nexport default class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n\tconstructor(props: { children: React.ReactNode }) {\n\t\tsuper(props);\n\t\tthis.state = { hasError: false };\n\t}\n\n\tstatic getDerivedStateFromError(): ErrorBoundaryState {\n\t\treturn { hasError: true };\n\t}\n\n\tcomponentDidCatch(error: Error, errorInfo: any): void {\n\t\tconsole.error('GIF Picker React failed to render:', error, errorInfo);\n\t}\n\n\trender(): React.ReactNode {\n\t\tif (this.state.hasError) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn this.props.children;\n\t}\n}\n","import React, { Dispatch, SetStateAction } from 'react';\nimport { PickerContextType } from '../hooks/usePickerContext';\n\nconst PickerContext = React.createContext<\n\t[PickerContextType, Dispatch<SetStateAction<PickerContextType>>]\n>(null!);\n\nexport default PickerContext;\n","import * as React from 'react';\nimport { GifProvider } from '../types/GifProvider';\n\nconst ProviderContext = React.createContext<GifProvider>(null!);\n\nexport default ProviderContext;\n","import * as React from 'react';\nimport { GifPickerSettings } from '../hooks/useSettings';\n\nconst SettingsContext = React.createContext<GifPickerSettings>(null!);\n\nexport default SettingsContext;\n","import React from 'react';\nimport './Placeholder.css';\n\nexport interface PlaceholderProps extends React.DetailedHTMLProps<\n\tReact.HTMLAttributes<HTMLDivElement>,\n\tHTMLDivElement\n> {\n\twidth?: number | string;\n\theight?: number | string;\n\tclassName?: string;\n}\n\nfunction Placeholder(props: PlaceholderProps) {\n\treturn (\n\t\t<div\n\t\t\t{...props}\n\t\t\tclassName={`gpr-placeholder ${props.className || ''}`}\n\t\t\tstyle={{ width: props.width, height: props.height, ...props.style }}\n\t\t></div>\n\t);\n}\n\nexport default Placeholder;\n","import React, { useContext } from 'react';\nimport SettingsContext from '../../context/SettingsContext';\nimport './CategoryPlaceholder.css';\nimport Placeholder from './Placeholder';\n\nfunction CategoryPlaceholder() {\n\tconst settings = useContext(SettingsContext);\n\n\treturn (\n\t\t<Placeholder\n\t\t\tclassName=\"gpr-category-placeholder\"\n\t\t\theight={settings.categoryHeight}\n\t\t\twidth=\"100%\"\n\t\t/>\n\t);\n}\n\nexport default CategoryPlaceholder;\n","import React, { useContext } from 'react';\nimport SettingsContext from '../../context/SettingsContext';\nimport './Category.css';\n\nexport interface CategoryProps {\n\timage: string;\n\ttext: React.ReactNode | string;\n\tonClick?: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nfunction Category({ image, text, onClick }: CategoryProps): React.JSX.Element {\n\tconst settings = useContext(SettingsContext);\n\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\tclassName=\"gpr-btn gpr-category\"\n\t\t\tstyle={{ height: settings.categoryHeight }}\n\t\t\tdata-testid=\"gpr-category\"\n\t\t\tonClick={onClick}\n\t\t>\n\t\t\t<img\n\t\t\t\tsrc={image}\n\t\t\t\tloading=\"lazy\"\n\t\t\t/>\n\t\t\t<div className=\"gpr-category-overlay\">\n\t\t\t\t<div className=\"gpr-category-name\">{text}</div>\n\t\t\t</div>\n\t\t</button>\n\t);\n}\n\nexport default Category;\n","import React, { useContext } from 'react';\nimport PickerContext from '../../context/PickerContext';\nimport Category from './Category';\n\nexport interface FeaturedCategory {\n\timage: string;\n\tname: string;\n\tsearchTerm: string;\n}\n\nfunction FeaturedCategory({ image, name, searchTerm }: FeaturedCategory): React.JSX.Element {\n\tconst [pickerContext, setPickerContext] = useContext(PickerContext);\n\n\tfunction onClick(): void {\n\t\tconst contextCopy = Object.assign({}, pickerContext);\n\t\tcontextCopy.searchTerm = searchTerm;\n\t\tsetPickerContext(contextCopy);\n\t}\n\n\treturn (\n\t\t<Category\n\t\t\timage={image}\n\t\t\ttext={name}\n\t\t\tonClick={onClick}\n\t\t/>\n\t);\n}\n\nexport default FeaturedCategory;\n","import React, { useContext } from 'react';\nimport PickerContext from '../../context/PickerContext';\nimport Category from './Category';\nimport './TrendingCategory.css';\n\nexport interface FeaturedCategory {\n\timage: string;\n}\n\nfunction TrendingCategory({ image }: FeaturedCategory): React.JSX.Element {\n\tconst [pickerContext, setPickerContext] = useContext(PickerContext);\n\n\tfunction onClick(): void {\n\t\tconst contextCopy = Object.assign({}, pickerContext);\n\t\tcontextCopy.showTrending = true;\n\t\tsetPickerContext(contextCopy);\n\t}\n\n\treturn (\n\t\t<Category\n\t\t\timage={image}\n\t\t\tonClick={onClick}\n\t\t\ttext={\n\t\t\t\t<div className=\"gpr-text-trending-category\">\n\t\t\t\t\t<div className=\"gpr-icn-trending\" />\n\t\t\t\t\t<span>Trending GIFs</span>\n\t\t\t\t</div>\n\t\t\t}\n\t\t/>\n\t);\n}\n\nexport default TrendingCategory;\n","import React from 'react';\nimport { Gif, GifCategory } from '../../types/types';\nimport CategoryPlaceholder from '../placeholders/CategoryPlaceholder';\nimport './CategoryList.css';\nimport FeaturedCategory from './FeaturedCategory';\nimport TrendingCategory from './TrendingCategory';\n\nexport interface CategoryListProps {\n\tcategories?: GifCategory[];\n\ttrending?: Gif;\n\tcolumnsCount: number;\n}\n\nfunction CategoryList({\n\tcategories,\n\ttrending,\n\tcolumnsCount,\n}: CategoryListProps): React.JSX.Element {\n\t/**\n\t * Make sure that last categories row is always full by removing\n\t * excess categories so the total count is devisable by column count\n\t */\n\tfunction getCleanedCategories() {\n\t\tif (!categories) return undefined;\n\n\t\tconst SPECIAL_CATEGORIES_COUNT = 1; // Trending\n\t\tconst totalCategoriesCount = categories.length + SPECIAL_CATEGORIES_COUNT;\n\t\tconst excessCategoriesCount = totalCategoriesCount % columnsCount;\n\n\t\tif (excessCategoriesCount == 0) return categories;\n\t\treturn categories?.slice(0, -excessCategoriesCount);\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"gpr-category-list\"\n\t\t\tstyle={{ gridTemplateColumns: `repeat(${columnsCount}, 1fr)` }}\n\t\t>\n\t\t\t{categories && trending ? (\n\t\t\t\t<>\n\t\t\t\t\t<TrendingCategory image={trending.imageUrl} />\n\t\t\t\t\t{getCleanedCategories()?.map((cat, i) => (\n\t\t\t\t\t\t<FeaturedCategory\n\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\timage={cat.imageUrl}\n\t\t\t\t\t\t\tname={cat.name}\n\t\t\t\t\t\t\tsearchTerm={cat.searchTerm ?? cat.name}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\t<>\n\t\t\t\t\t{[...Array(10 * columnsCount)].map((_, i) => (\n\t\t\t\t\t\t<CategoryPlaceholder key={i} />\n\t\t\t\t\t))}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n\nexport default CategoryList;\n","import React, { useEffect, useState } from 'react';\nimport Placeholder from './Placeholder';\nimport './ResultPlaceholder.css';\n\nexport interface ResultPlaceholderProps {\n\theight: number | string;\n\tshowDelay?: number;\n}\n\nfunction ResultPlaceholder({ height, showDelay }: ResultPlaceholderProps) {\n\tconst [show, setShow] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (show) return;\n\t\tfunction showElement() {\n\t\t\tsetShow(true);\n\t\t}\n\t\tconst timeout = setTimeout(showElement, showDelay);\n\t\treturn () => clearTimeout(timeout);\n\t}, []);\n\n\treturn (\n\t\t<Placeholder\n\t\t\tclassName=\"gpr-result-placeholder\"\n\t\t\theight={height}\n\t\t\twidth=\"100%\"\n\t\t\tstyle={{ opacity: show ? 1 : 0 }}\n\t\t/>\n\t);\n}\n\nexport default ResultPlaceholder;\n","import React from 'react';\nimport ResultPlaceholder from '../placeholders/ResultPlaceholder';\n\nconst PLACEHOLDER_HEIGHTS = [\n\t[120, 100, 130, 175, 154, 110],\n\t[150, 115, 135, 154, 145, 170],\n\t[140, 125, 120, 150, 100, 125],\n\t[130, 145, 175, 120, 135, 100],\n];\n\nexport interface GifListPlaceholderProps {\n\tcolumnsCount: number;\n\tshowDelay?: number;\n}\n\nfunction GifListPlaceholder({ columnsCount, showDelay = 70 }: GifListPlaceholderProps) {\n\treturn (\n\t\t<div className=\"gpr-gif-list\">\n\t\t\t{[...Array(columnsCount)].map((_, i) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"gpr-gif-list-column\"\n\t\t\t\t\tkey={i}\n\t\t\t\t>\n\t\t\t\t\t{PLACEHOLDER_HEIGHTS[i % PLACEHOLDER_HEIGHTS.length].map((height, j) => (\n\t\t\t\t\t\t<ResultPlaceholder\n\t\t\t\t\t\t\tkey={j}\n\t\t\t\t\t\t\theight={height}\n\t\t\t\t\t\t\tshowDelay={(j + 1) * showDelay * columnsCount + showDelay * i}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t);\n}\n\nexport default GifListPlaceholder;\n","import React, { useContext } from 'react';\nimport SettingsContext from '../../context/SettingsContext';\nimport ProviderContext from '../../context/ProviderContext';\nimport './ResultImage.css';\nimport { Gif } from '../../types/types';\n\nexport interface ResultImageProps {\n\tgif: Gif;\n\tsearchTerm?: string;\n}\n\nfunction ResultImage({ gif, searchTerm }: ResultImageProps): React.JSX.Element {\n\tconst settings = useContext(SettingsContext);\n\tconst provider = useContext(ProviderContext);\n\n\tasync function onClick(): Promise<void> {\n\t\ttry {\n\t\t\tawait settings.onGifClick?.(gif);\n\t\t} catch (error) {\n\t\t\tconsole.error('[gif-picker-react] Failed to handle GIF selection', error);\n\t\t}\n\n\t\ttry {\n\t\t\tawait provider.onClick?.(gif, { searchTerm });\n\t\t} catch (error) {\n\t\t\tconsole.error('[gif-picker-react] Failed to register GIF click', error);\n\t\t}\n\t}\n\n\tasync function handleLoad(): Promise<void> {\n\t\ttry {\n\t\t\tawait provider.onLoad?.(gif, { searchTerm });\n\t\t} catch (error) {\n\t\t\tconsole.error('[gif-picker-react] Failed to handle GIF load', error);\n\t\t}\n\t}\n\n\tconst image = gif.preview ?? gif;\n\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\tclassName=\"gpr-btn gpr-result-image\"\n\t\t\tonClick={onClick}\n\t\t\taria-label=\"Select GIF\"\n\t\t>\n\t\t\t<img\n\t\t\t\tsrc={image.imageUrl}\n\t\t\t\theight={image.height}\n\t\t\t\twidth={image.width}\n\t\t\t\tloading=\"lazy\"\n\t\t\t\tonLoad={handleLoad}\n\t\t\t\talt={gif.description ?? ''}\n\t\t\t/>\n\t\t</button>\n\t);\n}\n\nexport default ResultImage;\n","import React, { useMemo } from 'react';\nimport './GifList.css';\nimport GifListPlaceholder from './GifListPlaceholder';\nimport ResultImage from './ResultImage';\nimport { Gif } from '../../types/types';\n\nexport interface GifListProps {\n\tisLoading: boolean;\n\tresult?: Gif[];\n\tsearchTerm?: string;\n\tcolumnsCount: number;\n}\n\nfunction GifList({ isLoading, result, searchTerm, columnsCount }: GifListProps): React.JSX.Element {\n\tconst columns = useMemo(() => generateColumns(result, columnsCount), [result, columnsCount]);\n\tconst isEmpty = !result || result.length === 0;\n\n\tif (isLoading) {\n\t\treturn <GifListPlaceholder columnsCount={columnsCount} />;\n\t}\n\n\tif (isEmpty) {\n\t\treturn (\n\t\t\t<div className=\"gpr-gif-list-no-result\">\n\t\t\t\t<span>No GIFs found!</span>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className=\"gpr-gif-list\">\n\t\t\t{columns.map((column, i) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"gpr-gif-list-column\"\n\t\t\t\t\tkey={i}\n\t\t\t\t>\n\t\t\t\t\t{column.map((gif) => (\n\t\t\t\t\t\t<ResultImage\n\t\t\t\t\t\t\tkey={gif.id}\n\t\t\t\t\t\t\tgif={gif}\n\t\t\t\t\t\t\tsearchTerm={searchTerm}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t);\n}\n\n/**\n * Splits gifs into multiple columns of similar height\n */\nfunction generateColumns(gifsList?: Gif[], columnsCount = 2) {\n\tif (!gifsList) {\n\t\treturn [];\n\t}\n\n\tconst columns: Gif[][] = new Array(columnsCount).fill(null).map(() => []);\n\tconst columnsHeight = new Array(columnsCount).fill(0);\n\n\tfor (const gif of gifsList) {\n\t\tconst height = gif.preview ? gif.preview.height : gif.height;\n\t\tconst width = gif.preview ? gif.preview.width : gif.width;\n\t\tconst aspectRatio = height / width;\n\n\t\t// We want to put image of this loop in shortest column (smallest width)\n\t\tconst shortestColumnIndex = columnsHeight.indexOf(Math.min(...columnsHeight));\n\t\tcolumns[shortestColumnIndex].push(gif);\n\n\t\t// Here we actually add aspect ratio rather than height since design is responsive\n\t\tcolumnsHeight[shortestColumnIndex] += aspectRatio;\n\t}\n\n\treturn columns;\n}\n\nexport default GifList;\n","import React, { useContext, useEffect, useState } from 'react';\nimport ProviderContext from '../../context/ProviderContext';\nimport GifList from './GifList';\nimport { Gif } from '../../types/types';\n\nexport interface SearchResultProps {\n\tsearchTerm: string;\n\tcolumnsCount: number;\n}\n\nfunction SearchResult({ searchTerm, columnsCount }: SearchResultProps) {\n\tconst [searchResult, setSearchResult] = useState<Gif[]>(null!);\n\tconst [isLoading, setLoading] = useState(true);\n\tconst provider = useContext(ProviderContext);\n\n\tuseEffect(() => {\n\t\tsetLoading(true);\n\t\tasync function search(): Promise<any> {\n\t\t\tconst result = await provider.search(searchTerm);\n\t\t\tsetSearchResult(result);\n\t\t\tsetLoading(false);\n\t\t}\n\t\tconst debounce = setTimeout(() => search(), 800);\n\t\treturn (): void => clearTimeout(debounce);\n\t}, [searchTerm]);\n\n\treturn (\n\t\t<GifList\n\t\t\tisLoading={isLoading}\n\t\t\tcolumnsCount={columnsCount}\n\t\t\tresult={searchResult}\n\t\t\tsearchTerm={searchTerm}\n\t\t/>\n\t);\n}\n\nexport default SearchResult;\n","import React, { useContext, useEffect, useState } from 'react';\nimport ProviderContext from '../../context/ProviderContext';\nimport GifList from './GifList';\nimport { Gif } from '../../types/types';\n\nexport interface TrendingResultProps {\n\tcolumnsCount: number;\n}\n\nfunction TrendingResult({ columnsCount }: TrendingResultProps) {\n\tconst [trendingResult, setSearchResult] = useState<Gif[]>(null!);\n\tconst [isLoading, setLoading] = useState(true);\n\n\tconst provider = useContext(ProviderContext);\n\n\tuseEffect(() => {\n\t\tsetLoading(true);\n\t\t(async () => {\n\t\t\tconst result = await provider.getTrending();\n\t\t\tsetSearchResult(result);\n\t\t\tsetLoading(false);\n\t\t})();\n\t}, []);\n\n\treturn (\n\t\t<GifList\n\t\t\tcolumnsCount={columnsCount}\n\t\t\tisLoading={isLoading}\n\t\t\tresult={trendingResult}\n\t\t/>\n\t);\n}\n\nexport default TrendingResult;\n","import React, { useContext, useEffect, useRef, useState } from 'react';\nimport PickerContext from '../../context/PickerContext';\nimport ProviderContext from '../../context/ProviderContext';\nimport './Body.css';\nimport CategoryList from './CategoryList';\nimport SearchResult from './SearchResult';\nimport TrendingResult from './TrendingResult';\nimport { Gif, GifCategory } from '../../types/types';\n\nconst MAX_COLUMN_WIDTH = 170;\n\nexport interface BodyProps {\n\t/**\n\t * Width prop is here is for sole purpose of updating the\n\t * columns calculations when width prop change\n\t */\n\twidth?: number | string;\n}\n\nfunction Body({ width }: BodyProps): React.JSX.Element {\n\tconst [categories, setCategories] = useState<GifCategory[] | undefined>(undefined);\n\tconst [trending, setTrending] = useState<Gif | undefined>(undefined);\n\tconst [pickerContext] = useContext(PickerContext);\n\tconst [columnsCount, setColumnsCount] = useState(1);\n\tconst provider = useContext(ProviderContext);\n\tconst ref = useRef<HTMLDivElement>(null);\n\n\t/**\n\t * Load categories and first trending image for home page\n\t */\n\tuseEffect(() => {\n\t\tlet cancelled = false;\n\t\t(async (): Promise<void> => {\n\t\t\ttry {\n\t\t\t\tconst [categoryList, trendingList] = await Promise.all([\n\t\t\t\t\tprovider.getCategories(),\n\t\t\t\t\tprovider.getTrending(),\n\t\t\t\t]);\n\n\t\t\t\tif (cancelled) return;\n\n\t\t\t\tsetCategories(categoryList);\n\n\t\t\t\tif (trendingList.length > 0) {\n\t\t\t\t\tsetTrending(trendingList[0]);\n\t\t\t\t}\n\t\t\t} catch (error) {\n\t\t\t\tif (cancelled) return;\n\n\t\t\t\tconsole.error('[gif-picker-react] Failed to load home page', error);\n\t\t\t}\n\t\t})();\n\t\treturn (): void => {\n\t\t\tcancelled = true;\n\t\t};\n\t}, [provider]);\n\n\t/**\n\t * Calculate amount of columns to display\n\t */\n\tuseEffect(() => {\n\t\tconst width = ref.current ? ref.current.offsetWidth : 0;\n\t\tlet columns = Math.floor(width / MAX_COLUMN_WIDTH);\n\t\tif (columns < 1) columns = 1;\n\t\tsetColumnsCount(columns);\n\t}, [ref.current, width]);\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"gpr-body\"\n\t\t\tref={ref}\n\t\t>\n\t\t\t{((): React.JSX.Element => {\n\t\t\t\tif (pickerContext.showTrending) {\n\t\t\t\t\treturn <TrendingResult columnsCount={columnsCount} />;\n\t\t\t\t} else if (pickerContext.searchTerm) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<SearchResult\n\t\t\t\t\t\t\tcolumnsCount={columnsCount}\n\t\t\t\t\t\t\tsearchTerm={pickerContext.searchTerm}\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<CategoryList\n\t\t\t\t\t\t\tcolumnsCount={columnsCount}\n\t\t\t\t\t\t\tcategories={categories}\n\t\t\t\t\t\t\ttrending={trending}\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t})()}\n\t\t</div>\n\t);\n}\n\nexport default Body;\n","import { useContext } from 'react';\nimport ProviderContext from '../context/ProviderContext';\nimport { GifProviderAttribution } from '../types/GifProvider';\n\nconst DEFAULT_ATTRIBUTION: GifProviderAttribution = {\n\tsearchPlaceholder: 'Search GIFs',\n};\n\nfunction useAttribution(): GifProviderAttribution {\n\tconst provider = useContext(ProviderContext);\n\tconst attribution = provider.getAttribution?.();\n\n\treturn { ...DEFAULT_ATTRIBUTION, ...attribution };\n}\n\nexport default useAttribution;\n","import React, { useContext } from 'react';\nimport SettingsContext from '../../context/SettingsContext';\nimport { Theme } from '../../GifPickerReact';\nimport useAttribution from '../../hooks/useAttribution';\nimport './Footer.css';\n\nfunction Footer(): React.JSX.Element | null {\n\tconst settings = useContext(SettingsContext);\n\tconst { branding } = useAttribution();\n\n\tif (!branding) {\n\t\treturn null;\n\t}\n\n\tconst logo = settings.theme === Theme.DARK ? (branding.logoDark ?? branding.logo) : branding.logo;\n\n\treturn (\n\t\t<div className=\"gpr-footer\">\n\t\t\t<a\n\t\t\t\tclassName=\"gpr-footer-link\"\n\t\t\t\thref={branding.href}\n\t\t\t\ttarget=\"_blank\"\n\t\t\t\trel=\"noreferrer\"\n\t\t\t>\n\t\t\t\t<img\n\t\t\t\t\tclassName=\"gpr-footer-logo\"\n\t\t\t\t\tsrc={logo}\n\t\t\t\t\talt={branding.alt ?? ''}\n\t\t\t\t/>\n\t\t\t</a>\n\t\t</div>\n\t);\n}\n\nexport default Footer;\n","import * as React from 'react';\n\ninterface PropsProps extends React.DetailedHTMLProps<\n\tReact.ButtonHTMLAttributes<HTMLButtonElement>,\n\tHTMLButtonElement\n> {}\n\nfunction Button(props: PropsProps): React.JSX.Element {\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t{...props}\n\t\t\tclassName={'gpr-btn ' + props.className}\n\t\t>\n\t\t\t{props.children}\n\t\t</button>\n\t);\n}\n\nexport default Button;\n","import React from 'react';\nimport Button from '../Button';\nimport './ClearButton.css';\n\nexport interface ClearButtonProps {\n\tonClick: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nfunction ClearButton({ onClick }: ClearButtonProps) {\n\treturn (\n\t\t<Button\n\t\t\tclassName=\"gpr-btn-clear-search\"\n\t\t\tonClick={onClick}\n\t\t>\n\t\t\t<div className=\"gpr-icn-clear-search\" />\n\t\t</Button>\n\t);\n}\n\nexport default ClearButton;\n","import React, { useContext } from 'react';\nimport PickerContext from '../../context/PickerContext';\nimport SettingsContext from '../../context/SettingsContext';\nimport ClearButton from './ClearButton';\nimport './Search.css';\nimport useAttribution from '../../hooks/useAttribution';\n\nfunction Search(): React.JSX.Element {\n\tconst [pickerContext, setPickerContext] = useContext(PickerContext);\n\tconst settings = useContext(SettingsContext);\n\tconst attribution = useAttribution();\n\n\tfunction onChange(event: React.ChangeEvent<HTMLInputElement>): void {\n\t\tconst contextCopy = Object.assign({}, pickerContext);\n\t\tcontextCopy.searchTerm = event.target.value;\n\t\tsetPickerContext(contextCopy);\n\t}\n\n\tfunction onClear(): void {\n\t\tconst contextCopy = Object.assign({}, pickerContext);\n\t\tcontextCopy.searchTerm = '';\n\t\tsetPickerContext(contextCopy);\n\t}\n\n\treturn (\n\t\t<div className=\"gpr-search-container\">\n\t\t\t<input\n\t\t\t\tautoFocus={settings.autoFocusSearch}\n\t\t\t\taria-label={attribution.searchPlaceholder}\n\t\t\t\tplaceholder={attribution.searchPlaceholder}\n\t\t\t\tclassName=\"gpr-search\"\n\t\t\t\tdata-testid=\"gpr-search-input\"\n\t\t\t\ttype=\"text\"\n\t\t\t\tdir=\"auto\"\n\t\t\t\tmaxLength={500}\n\t\t\t\tvalue={pickerContext.searchTerm}\n\t\t\t\tonChange={onChange}\n\t\t\t/>\n\t\t\t<div className=\"gpr-icn-search\" />\n\t\t\t{pickerContext.searchTerm.length > 0 && <ClearButton onClick={onClear} />}\n\t\t</div>\n\t);\n}\n\nexport default Search;\n","import React, { useContext } from 'react';\nimport PickerContext from '../../context/PickerContext';\nimport Button from '../Button';\nimport './Title.css';\n\nexport interface TitleProps {\n\tchildren: React.ReactNode;\n}\n\nfunction Title({ children }: TitleProps): React.JSX.Element {\n\tconst [pickerContext, setPickerContext] = useContext(PickerContext);\n\n\tfunction onClear(): void {\n\t\tconst contextCopy = Object.assign({}, pickerContext);\n\t\tcontextCopy.showTrending = false;\n\t\tsetPickerContext(contextCopy);\n\t}\n\n\treturn (\n\t\t<div className=\"gpr-title-container\">\n\t\t\t<div className=\"gpr-title\">{children}</div>\n\n\t\t\t<Button\n\t\t\t\tclassName={'gpr-btn-clear-search'}\n\t\t\t\tonClick={onClear}\n\t\t\t>\n\t\t\t\t<div className=\"gpr-icn-clear-search\" />\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n\nexport default Title;\n","import React, { useContext } from 'react';\nimport PickerContext from '../../context/PickerContext';\nimport './Header.css';\nimport Search from './Search';\nimport Title from './Title';\n\nfunction Header(): React.JSX.Element {\n\tconst [pickerContext] = useContext(PickerContext);\n\n\treturn (\n\t\t<div className=\"gpr-header\">\n\t\t\t{pickerContext.showTrending ? <Title>Trending GIFs</Title> : <Search />}\n\t\t</div>\n\t);\n}\n\nexport default Header;\n","import React, { useContext } from 'react';\nimport SettingsContext from '../context/SettingsContext';\nimport { Theme } from '../GifPickerReact';\n\nexport interface PickerMainProps {\n\tchildren: React.ReactNode;\n}\n\nfunction PickerMain({ children }: PickerMainProps): React.JSX.Element {\n\tconst settings = useContext(SettingsContext);\n\n\tconst style: React.CSSProperties = {\n\t\theight: settings.height,\n\t\twidth: settings.width,\n\t};\n\n\treturn (\n\t\t<aside\n\t\t\tclassName={`GifPickerReact gpr-main ${settings.theme === Theme.DARK ? ' gpr-dark-theme' : ''}`}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{children}\n\t\t</aside>\n\t);\n}\n\nexport default PickerMain;\n","import { Dispatch, SetStateAction, useState } from 'react';\n\nexport interface PickerContextType {\n\tsearchTerm: string;\n\tshowTrending: boolean;\n}\n\nfunction usePickerContext(\n\tinitialSearchTerm: string,\n): [PickerContextType, Dispatch<SetStateAction<PickerContextType>>] {\n\tconst DEFAULT_SETTINGS: PickerContextType = {\n\t\tsearchTerm: initialSearchTerm,\n\t\tshowTrending: false,\n\t};\n\n\tconst [pickerContext, setPickerContext] = useState<PickerContextType>(DEFAULT_SETTINGS);\n\n\treturn [pickerContext, setPickerContext];\n}\n\nexport default usePickerContext;\n","import { GifPickerReactProps, Theme } from '../GifPickerReact';\nimport { GifProvider } from '../types/GifProvider';\nimport { Gif } from '../types/types';\n\n/**\n * This is a parsed version of props with filled defaults\n */\nexport type GifPickerSettings = {\n\tprovider: GifProvider;\n\tonGifClick?: (gif: Gif) => Promise<void> | void;\n\tautoFocusSearch: boolean;\n\twidth: string;\n\theight: string;\n\tcategoryHeight: string;\n\ttheme: Theme;\n\tinitialSearchTerm: string;\n};\n\nfunction useSettings(props: GifPickerReactProps): GifPickerSettings {\n\tif (!props.provider) {\n\t\tthrow new Error('provider is a required prop that is missing');\n\t}\n\treturn {\n\t\tprovider: props.provider,\n\t\tonGifClick: props.onGifClick ?? undefined,\n\t\tautoFocusSearch: props.autoFocusSearch ?? true,\n\t\theight: praseDimension(props.height ?? 450),\n\t\twidth: praseDimension(props.width ?? 350),\n\t\tcategoryHeight: praseDimension(props.categoryHeight ?? 95),\n\t\ttheme: getTheme(props.theme),\n\t\tinitialSearchTerm: props.initialSearchTerm ?? '',\n\t};\n}\n\nfunction praseDimension(dimension: string | number): string {\n\tif (typeof dimension == 'number') {\n\t\treturn `${dimension}px`;\n\t} else if (typeof dimension == 'string') {\n\t\treturn dimension;\n\t} else {\n\t\tthrow new TypeError('Invalid dimension provided');\n\t}\n}\n\nfunction getTheme(theme?: Theme): Theme {\n\tif (theme === Theme.AUTO) {\n\t\treturn isSystemDarkTheme() ? Theme.DARK : Theme.LIGHT;\n\t} else {\n\t\treturn theme ?? Theme.LIGHT;\n\t}\n}\n\nfunction isSystemDarkTheme(): boolean {\n\tif (typeof window === 'undefined') {\n\t\treturn false;\n\t}\n\n\treturn !!window.matchMedia('(prefers-color-scheme: dark)').matches;\n}\n\nexport default useSettings;\n","import React from 'react';\nimport Body from './components/body/Body';\nimport Footer from './components/footer/Footer';\nimport Header from './components/header/Header';\nimport PickerMain from './components/PickerMain';\nimport PickerContext from './context/PickerContext';\nimport SettingsContext from './context/SettingsContext';\nimport ProviderContext from './context/ProviderContext';\nimport './GifPickerReact.css';\nimport usePickerContext from './hooks/usePickerContext';\nimport useSettings from './hooks/useSettings';\nimport { GifProvider } from './types/GifProvider';\nimport { Gif } from './types/types';\n\nexport enum Theme {\n\tLIGHT = 'light',\n\tDARK = 'dark',\n\tAUTO = 'auto',\n}\n\nexport interface GifPickerReactProps {\n\tprovider: GifProvider;\n\tonGifClick?: (gif: Gif) => void;\n\tautoFocusSearch?: boolean;\n\twidth?: number | string;\n\theight?: number | string;\n\tcategoryHeight?: number | string;\n\ttheme?: Theme;\n\tinitialSearchTerm?: string;\n}\n\nfunction GifPickerReact(props: GifPickerReactProps): React.JSX.Element {\n\tconst settings = useSettings(props);\n\tconst pickerContext = usePickerContext(settings.initialSearchTerm);\n\n\treturn (\n\t\t<SettingsContext.Provider value={settings}>\n\t\t\t<PickerContext.Provider value={pickerContext}>\n\t\t\t\t<ProviderContext.Provider value={props.provider}>\n\t\t\t\t\t<PickerMain>\n\t\t\t\t\t\t<Header />\n\t\t\t\t\t\t<Body width={props.width} />\n\t\t\t\t\t\t<Footer />\n\t\t\t\t\t</PickerMain>\n\t\t\t\t</ProviderContext.Provider>\n\t\t\t</PickerContext.Provider>\n\t\t</SettingsContext.Provider>\n\t);\n}\n\nexport default GifPickerReact;\n","import React from 'react';\nimport ErrorBoundary from './components/ErrorBoundary';\nimport GifPickerReact, { GifPickerReactProps } from './GifPickerReact';\n\nexport { Theme } from './GifPickerReact';\nexport type { GifProvider, GifProviderAttribution, GifEventContext } from './types/GifProvider';\nexport type { Gif, GifCategory, GifPreview } from './types/types';\n\nexport interface GifPickerProps extends GifPickerReactProps {}\n\nexport function GifPicker(props: GifPickerProps): React.JSX.Element {\n\treturn (\n\t\t<ErrorBoundary>\n\t\t\t<GifPickerReact {...props} />\n\t\t</ErrorBoundary>\n\t);\n}\n"],"mappings":"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"}