npm - construct-hub-webapp - Versions diffs - 0.1.323 → 0.1.324 - Mend

construct-hub-webapp 0.1.323 → 0.1.324

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.

Files changed (29) hide show

package/build/static/js/{2.0f0bddaf.chunk.js.map → 2.9c8dd6d5.chunk.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["constants/pageInfo.ts","components/Page/Page.tsx","constants/keywords.ts","components/LanguageSupportTooltip/LanguageSupportTooltip.tsx","components/PackageTag/PackageTag.tsx","components/Time/Time.tsx","../../../src/link-box.tsx","../../../src/ChevronRight.tsx","components/CatalogCard/testIds.ts","components/CatalogCard/CatalogCardContainer.tsx","components/CatalogCard/CatalogCardSkeleton.tsx","components/CatalogCard/CatalogCard.tsx","components/Results/ResultsGrid.tsx","components/Results/Results.tsx","components/CatalogSearch/testIds.ts","components/CatalogSearch/CatalogSearchInputs.tsx","components/CatalogSearch/Dropdown.tsx","components/CatalogSearch/CatalogSearch.tsx","../../../src/ChevronLeft.tsx","../../../src/ArrowForward.tsx","../../../src/skeleton.tsx","../../../src/use-previous.ts"],"names":["pageInfo","home","event","name","faq","packageProfile","search","siteTerms","notFound","page","pageType","Page","children","meta","pageName","trackPageView","usePageView","useEffect","suffix","title","description","formattedTitle","Helmet","process","content","charSet","property","KEYWORD_IGNORE_LIST","Set","LanguageSupportTooltip","language","isSupported","TEMP_SUPPORTED_LANGUAGES","has","langName","LANGUAGE_NAME_MAP","message","hasArrow","label","placement","PackageTag","value","zIndex","tagProps","NavLink","to","getSearchPath","query","_hover","textDecoration","Time","forwardRef","ref","date","formatString","format","boxProps","as","dateTime","toISOString","displayName","LinkOverlay","className","cx","rel","isExternal","target","__css","position","cursor","display","top","left","width","height","LinkBox","ChevronRightIcon","createIcon","d","testIds","createTestIds","CardContainer","Card","h","p","w","overflow","templateColumns","templateRows","CatalogCardContainer","isLink","bg","container","CatalogCardSkeleton","spacing","align","direction","px","py","CatalogCard","currentLanguage","pkg","publishDate","metadata","Date","fontSize","author","languages","targets","Object","keys","getUrl","params","getPackagePath","version","authorName","maxH","maxW","Link","color","fontWeight","isTruncated","ml","Flex","tags","flexWrap","startsWith","mr","variant","keywords","filter","v","Boolean","slice","map","tag","noOfLines","Stack","entries","LANGUAGE_RENDER_MAP","sort","right","LANGUAGES","indexOf","lang","info","isSupportedByLibrary","Language","TypeScript","includes","isSupportedByConstructHub","Icon","icon","opacity","ResultsGrid","columns","base","sm","md","lg","xl","ResultsComponent","results","idx","Results","memo","languageOptions","fromEntries","key","LanguageDropdown","placeholder","items","onSelect","selected","text","options","strategy","Button","borderColor","boxShadow","trigger","rightIcon","ChevronDown","menu","item","onClick","CatalogSearchInputs","onQueryChange","onLanguageChange","input","onChange","languageItem","languageDropdownMenu","languageDropdown","languageDropdownValue","colorScheme","submit","type","CatalogSearch","onSubmit","props","Form","form","autoRows","gap","ChevronLeftIcon","ArrowForwardIcon","StyledSkeleton","chakra","baseStyle","backgroundClip","pointerEvents","userSelect","visibility","fade","keyframes","from","Skeleton","styles","useStyleConfig","isFirstRender","React","useIsFirstRender","omitThemingProps","wasPreviouslyLoaded","useRef","usePrevious","_className","animation","fadeDuration","speed"],"mappings":"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","file":"static/js/2.0f0bddaf.chunk.js","sourcesContent":["export const pageInfo = {\n home: {\n event: {\n name: \"Home Load\",\n },\n },\n faq: {\n event: {\n name: \"Frequently Asked Questions Load\",\n },\n },\n packageProfile: {\n event: {\n name: \"Package Profile Load\",\n },\n },\n search: {\n event: {\n name: \"Search Load\",\n },\n },\n siteTerms: {\n event: {\n name: \"Site Terms Load\",\n },\n },\n notFound: {\n page: {\n pageType: \"errorPage\",\n },\n event: {\n name: \"404 Page Load\",\n },\n },\n} as const;\n","import { FunctionComponent, useEffect } from \"react\";\nimport { Helmet } from \"react-helmet\";\nimport { pageInfo } from \"../../constants/pageInfo\";\nimport { usePageView } from \"../../contexts/Analytics\";\n\nexport interface PageProps {\n pageName: keyof typeof pageInfo;\n meta: {\n suffix?: boolean;\n title: string;\n description: string;\n };\n}\n\nexport const Page: FunctionComponent<PageProps> = ({\n children,\n meta,\n pageName,\n}) => {\n const trackPageView = usePageView(pageInfo[pageName]);\n\n useEffect(() => {\n trackPageView();\n }, [trackPageView]);\n\n const { suffix = true, title, description } = meta;\n const formattedTitle = suffix ? `${title} - Construct Hub` : title;\n\n return (\n <>\n <Helmet>\n {process.env.NODE_ENV === \"development\" && (\n <meta\n content=\"default-src 'self' 'unsafe-inline' https://.awsstatic.com https://amazonwebservices.d2.sc.omtrdc.net; connect-src 'self' https://.shortbread.aws.dev ws://localhost:3000 https://.awsstatic.com https://amazonwebservices.d2.sc.omtrdc.net; frame-src 'none'; img-src 'self' https:// http://.omtrdc.net; object-src 'none'; style-src 'self' 'unsafe-inline';\"\n httpEquiv=\"Content-Security-Policy\"\n />\n )}\n\n <meta content=\"width=device-width, initial-scale=1\" name=\"viewport\" />\n <meta charSet=\"utf-8\" />\n\n <title>{formattedTitle}</title>\n <meta content={formattedTitle} property=\"og:title\" />\n <meta content={formattedTitle} name=\"twitter:title\" />\n <meta content=\"summary\" name=\"twitter:card\" />\n\n <meta content={description} name=\"description\" />\n <meta content={description} property=\"og:description\" />\n <meta content={description} name=\"twitter:description\" />\n </Helmet>\n {children}\n </>\n );\n};\n","export const KEYWORD_IGNORE_LIST = new Set([\n \"aws-cdk\",\n \"aws\",\n \"awscdk\",\n \"cdk-construct\",\n \"cdk\",\n \"construct\",\n \"constructs\",\n]);\n","import { Tooltip } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport {\n Language,\n LANGUAGE_NAME_MAP,\n TEMP_SUPPORTED_LANGUAGES,\n} from \"../../constants/languages\";\n\nexport interface LanguageSupportTooltipProps {\n language: Language;\n}\n\nexport const LanguageSupportTooltip: FunctionComponent<LanguageSupportTooltipProps> =\n ({ children, language }) => {\n const isSupported = TEMP_SUPPORTED_LANGUAGES.has(language);\n const langName = LANGUAGE_NAME_MAP[language];\n\n const message = isSupported\n ? `Click to view documentation in ${langName}`\n : `Documentation support for ${langName} is coming soon!`;\n\n return (\n <Tooltip hasArrow label={message} placement=\"top-start\">\n <span>{children}</span>\n </Tooltip>\n );\n };\n","import { Tag, TagLabel, TagProps } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Language } from \"../../constants/languages\";\nimport { getSearchPath } from \"../../util/url\";\nimport { NavLink } from \"../NavLink\";\n\nexport interface PackageTagProps extends TagProps {\n language?: Language;\n value: string;\n label?: string;\n zIndex?: string \| number;\n}\n\nexport const PackageTag: FunctionComponent<PackageTagProps> = ({\n children,\n language,\n value,\n label = value,\n zIndex,\n ...tagProps\n}) => {\n return (\n <NavLink\n aria-label={`Tag: ${label}`}\n to={getSearchPath({ query: `${value}`, language })}\n zIndex={zIndex}\n >\n <Tag\n _hover={{\n textDecoration: \"underline\",\n }}\n {...tagProps}\n >\n <TagLabel>{children}</TagLabel>\n </Tag>\n </NavLink>\n );\n};\n","import { Box, BoxProps, forwardRef } from \"@chakra-ui/react\";\nimport { format } from \"date-fns\";\n\nexport interface TimeOptions {\n date: Date;\n format: string;\n}\n\nexport interface TimeProps extends BoxProps, TimeOptions {}\n\nexport const Time = forwardRef<TimeProps, \"time\">(\n ({ date, format: formatString, ...boxProps }, ref) => {\n return (\n <Box as=\"time\" dateTime={date.toISOString()} ref={ref} {...boxProps}>\n {format(date, formatString)}\n </Box>\n );\n }\n);\n\nTime.displayName = \"Time\";\n","import { chakra, forwardRef, HTMLChakraProps } from \"@chakra-ui/system\"\nimport { cx } from \"@chakra-ui/utils\"\nimport as React from \"react\"\n\nexport interface LinkOverlayProps extends HTMLChakraProps<\"a\"> {\n /*\n If `true`, the link will open in new tab\n /\n isExternal?: boolean\n}\n\nexport const LinkOverlay = forwardRef<LinkOverlayProps, \"a\">((props, ref) => {\n const { isExternal, target, rel, className, ...rest } = props\n return (\n <chakra.a\n {...rest}\n ref={ref}\n className={cx(\"chakra-linkbox__overlay\", className)}\n rel={isExternal ? \"noopener noreferrer\" : rel}\n target={isExternal ? \"_blank\" : target}\n __css={{\n position: \"static\",\n \"&::before\": {\n content: \"''\",\n cursor: \"inherit\",\n display: \"block\",\n position: \"absolute\",\n top: 0,\n left: 0,\n zIndex: 0,\n width: \"100%\",\n height: \"100%\",\n },\n }}\n />\n )\n})\n\nexport interface LinkBoxProps extends HTMLChakraProps<\"div\"> {}\n\n/\n `LinkBox` is used to wrap content areas within a link while ensuring semantic html\n \n @see Docs https://chakra-ui.com/docs/navigation/link-overlay\n * @see Resources https://www.sarasoueidan.com/blog/nested-links\n /\nexport const LinkBox = forwardRef<LinkBoxProps, \"div\">((props, ref) => {\n const { className, ...rest } = props\n\n return (\n <chakra.div\n ref={ref}\n position=\"relative\"\n {...rest}\n className={cx(\"chakra-linkbox\", className)}\n __css={{\n / Elevate the links and abbreviations up /\n \"a[href]:not(.chakra-linkbox__overlay), abbr[title]\": {\n position: \"relative\",\n zIndex: 1,\n },\n }}\n />\n )\n})\n","import { createIcon } from \"@chakra-ui/icon\"\n\nexport const ChevronRightIcon = createIcon({\n d: \"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\",\n displayName: \"ChevronRightIcon\",\n})\n","import { createTestIds } from \"../../util/createTestIds\";\n\nconst testIds = createTestIds(\"catalogCard\", [\n \"container\",\n \"name\",\n \"version\",\n \"tags\",\n \"description\",\n \"date\",\n \"author\",\n \"languages\",\n] as const);\n\nexport default testIds;\n","import { Grid, LinkBox } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Card } from \"../Card\";\nimport testIds from \"./testIds\";\n\nconst CardContainer: FunctionComponent = ({ children }) => (\n <Card h={64} p={0} w=\"100%\">\n <Grid\n as=\"article\"\n h=\"100%\"\n overflow=\"hidden\"\n templateColumns=\"1fr\"\n templateRows=\"2fr 1fr\"\n >\n {children}\n </Grid>\n </Card>\n);\n\nexport const CatalogCardContainer: FunctionComponent<{ isLink?: boolean }> = ({\n children,\n isLink,\n}) => {\n return isLink ? (\n <LinkBox\n _hover={{\n \"> :first-child\": {\n bg: \"gray.50\",\n },\n }}\n data-testid={testIds.container}\n >\n <CardContainer>{children}</CardContainer>\n </LinkBox>\n ) : (\n <CardContainer>{children}</CardContainer>\n );\n};\n","import { Box, Divider, Skeleton, Stack } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\n\nexport const CatalogCardSkeleton: FunctionComponent = () => (\n <>\n <Stack p={4} spacing={4}>\n <Skeleton h={5} w=\"50%\" />\n <Stack align=\"center\" direction=\"row\" spacing={2}>\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n </Stack>\n <Skeleton h={3} w=\"75%\" />\n <Skeleton h={3} w=\"50%\" />\n </Stack>\n <Box>\n <Divider />\n <Stack px={4} py={2} spacing={2}>\n <Skeleton h={5} w=\"25%\" />\n <Stack align=\"center\" direction=\"row\" spacing={2}>\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n </Stack>\n </Stack>\n </Box>\n </>\n);\n","import {\n Box,\n Divider,\n Flex,\n LinkBox,\n Link as UILink,\n LinkOverlay,\n Stack,\n Text,\n} from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport { CatalogPackage } from \"../../api/package/packages\";\nimport { KEYWORD_IGNORE_LIST } from \"../../constants/keywords\";\nimport {\n Language,\n LANGUAGES,\n LANGUAGE_RENDER_MAP,\n TEMP_SUPPORTED_LANGUAGES,\n} from \"../../constants/languages\";\nimport { getPackagePath, getSearchPath } from \"../../util/url\";\nimport { LanguageSupportTooltip } from \"../LanguageSupportTooltip\";\nimport { PackageTag } from \"../PackageTag\";\nimport { Time } from \"../Time\";\nimport { CatalogCardContainer } from \"./CatalogCardContainer\";\nimport { CatalogCardSkeleton } from \"./CatalogCardSkeleton\";\nimport testIds from \"./testIds\";\n\nexport interface CatalogCardProps {\n /\n Specifies the language to link to by default\n /\n language?: Language;\n /\n If undefined, will render a skeleton\n /\n pkg?: CatalogPackage;\n}\n\nexport const CatalogCard: FunctionComponent<CatalogCardProps> = ({\n language: currentLanguage,\n pkg,\n}) => {\n if (!pkg) {\n return (\n <CatalogCardContainer>\n <CatalogCardSkeleton />\n </CatalogCardContainer>\n );\n }\n\n const publishDate = pkg.metadata?.date ? (\n <Time\n date={new Date(pkg.metadata.date)}\n fontSize=\"sm\"\n format=\"MMMM dd, yyyy\"\n />\n ) : null;\n\n const author = pkg.author ?? {};\n const languages = pkg.languages ?? {};\n const targets = Object.keys(languages) as Language[];\n\n const getUrl = (params?: Partial<Parameters<typeof getPackagePath>[0]>) =>\n getPackagePath({\n name: pkg.name,\n version: pkg.version,\n language: currentLanguage,\n ...params,\n });\n\n const authorName = typeof author === \"string\" ? author : author.name;\n\n return (\n <CatalogCardContainer isLink>\n <Stack maxH=\"100%\" maxW=\"100%\" overflow=\"hidden\" p={4} spacing={0}>\n {/ Name & Version /}\n <LinkOverlay as={Link} to={getUrl()}>\n <Text\n color=\"blue.800\"\n data-testid={testIds.name}\n fontWeight=\"semibold\"\n isTruncated\n >\n {pkg.name}\n\n <Text\n as=\"span\"\n color=\"blue.500\"\n data-testid={testIds.version}\n fontSize=\"xs\"\n ml={2}\n >\n {pkg.version}\n </Text>\n </Text>\n </LinkOverlay>\n\n {/ Tags /}\n <LinkBox\n as={Flex}\n data-testid={testIds.tags}\n flexWrap=\"wrap\"\n maxH={6}\n overflow=\"hidden\"\n >\n {[\n pkg.name.startsWith(\"@aws-cdk/\") ? (\n <PackageTag\n key=\"official\"\n label=\"official\"\n language={currentLanguage}\n mr={1}\n value=\"@aws-cdk\"\n variant=\"official\"\n >\n Official\n </PackageTag>\n ) : null,\n ...(pkg.keywords ?? [])\n .filter((v) => Boolean(v) && !KEYWORD_IGNORE_LIST.has(v))\n .slice(0, 3)\n .map((tag) => {\n return (\n <PackageTag\n key={tag}\n language={currentLanguage}\n mr={1}\n value={`\"${tag}\"`}\n zIndex=\"0 !important\"\n >\n {tag}\n </PackageTag>\n );\n }),\n ]}\n </LinkBox>\n <Text data-testid={testIds.description} fontSize=\"sm\" noOfLines={2}>\n {pkg.description}\n </Text>\n </Stack>\n\n {/ Bottom Details /}\n <Box>\n <Divider />\n <Stack maxW=\"100%\" overflow=\"hidden\" px={4} py={2} spacing={2}>\n <Text data-testid={testIds.date} fontSize=\"sm\" isTruncated>\n {publishDate}\n </Text>\n\n <UILink\n as={Link}\n color=\"blue.500\"\n data-testid={testIds.author}\n fontSize=\"sm\"\n to={getSearchPath({ query: authorName })}\n >\n {authorName}\n </UILink>\n\n {/ Language Support Icons /}\n <LinkBox\n align=\"center\"\n as={Stack}\n data-testid={testIds.languages}\n direction=\"row\"\n >\n {Object.entries(LANGUAGE_RENDER_MAP)\n // Ensure entries are always sorted in a stable way\n .sort(\n ([left], [right]) =>\n LANGUAGES.indexOf(left as Language) -\n LANGUAGES.indexOf(right as Language)\n )\n .map(([lang, info]) => {\n const language = lang as Language;\n\n const isSupportedByLibrary =\n language === Language.TypeScript \|\|\n targets.includes(language);\n\n const isSupportedByConstructHub =\n language === Language.TypeScript \|\| // TypeScript is always supported\n // Otherwise, the language must be supported by ConstructHub\n TEMP_SUPPORTED_LANGUAGES.has(language);\n\n if (!isSupportedByLibrary) return null;\n\n const { name, icon: Icon } = info;\n\n const icon = (\n <Icon\n aria-label={`Supports ${name}`}\n h={6}\n opacity={isSupportedByConstructHub ? 1 : 0.2}\n w={6}\n />\n );\n\n return (\n <LanguageSupportTooltip key={language} language={language}>\n {isSupportedByConstructHub ? (\n <Link\n aria-label={`View package docs for ${language}`}\n to={getUrl({ language })}\n >\n {icon}\n </Link>\n ) : (\n icon\n )}\n </LanguageSupportTooltip>\n );\n })}\n </LinkBox>\n </Stack>\n </Box>\n </CatalogCardContainer>\n );\n};\n","import { SimpleGrid } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\n\nexport const ResultsGrid: FunctionComponent = ({ children }) => (\n <SimpleGrid\n columns={{\n base: 1,\n sm: 2,\n md: 3,\n lg: 4,\n xl: 5,\n \"2xl\": 6,\n }}\n spacing={6}\n >\n {children}\n </SimpleGrid>\n);\n","import { FunctionComponent, memo } from \"react\";\nimport { Packages } from \"../../api/package/packages\";\nimport { Language } from \"../../constants/languages\";\nimport { CatalogCard } from \"../CatalogCard\";\nimport { ResultsGrid } from \"./ResultsGrid\";\n\nexport interface ResultsProps {\n language?: Language;\n results: Packages[\"packages\"];\n skeleton?: {\n loading: boolean;\n noOfItems: number;\n };\n}\n\nconst ResultsComponent: FunctionComponent<ResultsProps> = ({\n language,\n results,\n}) => {\n return (\n <ResultsGrid>\n {results.map((pkg, idx) => (\n <CatalogCard key={`${pkg.name}-${idx}`} language={language} pkg={pkg} />\n ))}\n </ResultsGrid>\n );\n};\n\nexport const Results = memo(ResultsComponent) as typeof ResultsComponent;\n","import { createTestIds } from \"../../util/createTestIds\";\n\nconst testIds = createTestIds(\"catalogSearch\", [\n \"form\",\n \"input\",\n \"languageDropdown\",\n \"languageDropdownMenu\",\n \"languageDropdownValue\",\n \"languageItem\",\n \"submit\",\n] as const);\n\nexport default testIds;\n","import { Button, forwardRef, Input } from \"@chakra-ui/react\";\nimport type { ChangeEventHandler, FunctionComponent } from \"react\";\nimport {\n Language,\n TEMP_SUPPORTED_LANGUAGES,\n LANGUAGE_NAME_MAP,\n} from \"../../constants/languages\";\nimport { Dropdown, DropdownProps } from \"./Dropdown\";\nimport testIds from \"./testIds\";\n\ntype LanguageItems = Partial<Record<Language, string>>;\n\nconst languageOptions = Object.fromEntries(\n Object.entries(LANGUAGE_NAME_MAP).filter(([key]) =>\n TEMP_SUPPORTED_LANGUAGES.has(key as Language)\n )\n) as LanguageItems;\n\nconst LanguageDropdown: FunctionComponent<DropdownProps<LanguageItems>> =\n Dropdown;\n\n/\n @deprecated Use `<SearchBar />` instead.\n /\nexport interface CatalogSearchInputsProps {\n /\n Controls the query state value\n /\n query: string;\n /\n Controls the query state change event\n /\n onQueryChange: ChangeEventHandler<HTMLInputElement>;\n /\n Controls the language state value\n /\n language?: Language;\n /\n Controls the language state change event\n /\n onLanguageChange: (language?: Language) => void;\n}\n\nexport const CatalogSearchInputs = forwardRef<\n CatalogSearchInputsProps,\n \"input\"\n>(({ query, onQueryChange, language, onLanguageChange }, ref) => (\n <>\n <Input\n bg=\"white\"\n borderColor=\"blue.100\"\n boxShadow=\"base\"\n data-testid={testIds.input}\n name=\"query\"\n onChange={onQueryChange}\n placeholder=\"Search Constructs...\"\n ref={ref}\n value={query}\n />\n <LanguageDropdown\n items={languageOptions}\n onSelect={onLanguageChange}\n placeholder=\"Language...\"\n selected={language}\n testIds={{\n item: testIds.languageItem,\n menu: testIds.languageDropdownMenu,\n trigger: testIds.languageDropdown,\n value: testIds.languageDropdownValue,\n }}\n />\n <Button\n boxShadow=\"base\"\n colorScheme=\"blue\"\n data-testid={testIds.submit}\n type=\"submit\"\n >\n Search\n </Button>\n </>\n));\n","import { ChevronDownIcon } from \"@chakra-ui/icons\";\nimport {\n Button,\n Menu,\n MenuButton,\n MenuItem,\n MenuList,\n Text,\n} from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\n\nexport interface DropdownProps<T = Record<string, string>> {\n testIds: {\n item: string;\n menu: string;\n trigger: string;\n value: string;\n };\n placeholder: string;\n selected?: T[keyof T];\n onSelect: (val?: keyof T) => void;\n items: T;\n}\n\nexport const Dropdown: FunctionComponent<DropdownProps> = ({\n placeholder,\n items,\n onSelect,\n selected,\n testIds,\n}) => {\n const text = selected ? items[selected] : placeholder;\n const options = Object.entries(items);\n\n return (\n <Menu strategy=\"fixed\">\n <MenuButton\n as={Button}\n bg=\"white\"\n borderColor=\"blue.100\"\n boxShadow=\"base\"\n data-testid={testIds.trigger}\n rightIcon={<ChevronDownIcon color=\"blue.500\" />}\n variant=\"outline\"\n >\n <Text data-testid={testIds.value}>{text}</Text>\n </MenuButton>\n <MenuList data-testid={testIds.menu}>\n <MenuItem data-testid={testIds.item} onClick={() => onSelect()}>\n Any\n </MenuItem>\n {options.map(([name, displayName]) => (\n <MenuItem\n data-testid={testIds.item}\n key={name}\n onClick={() => onSelect(name)}\n >\n {displayName}\n </MenuItem>\n ))}\n </MenuList>\n </Menu>\n );\n};\n","import { Grid } from \"@chakra-ui/react\";\nimport type { FormEventHandler, FunctionComponent } from \"react\";\nimport { Form } from \"../Form\";\nimport {\n CatalogSearchInputs,\n CatalogSearchInputsProps,\n} from \"./CatalogSearchInputs\";\nimport testIds from \"./testIds\";\n\nexport interface CatalogSearchProps extends CatalogSearchInputsProps {\n /\n Called when the catalog search form is submitted (via enter keypress or submit click)\n /\n onSubmit: FormEventHandler<HTMLFormElement>;\n}\n\n/\n @deprecated Use `<SearchBar />` instead.\n /\nexport const CatalogSearch: FunctionComponent<CatalogSearchProps> = ({\n onSubmit,\n ...props\n}) => {\n return (\n <Form data-testid={testIds.form} onSubmit={onSubmit}>\n <Grid\n autoRows=\"1fr\"\n gap={4}\n templateColumns={{ sm: \"1fr\", md: \"3fr 1fr 1fr\" }}\n width=\"full\"\n >\n <CatalogSearchInputs {...props} />\n </Grid>\n </Form>\n );\n};\n","import { createIcon } from \"@chakra-ui/icon\"\n\nexport const ChevronLeftIcon = createIcon({\n d: \"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z\",\n displayName: \"ChevronLeftIcon\",\n})\n","import { createIcon } from \"@chakra-ui/icon\"\n\nexport const ArrowForwardIcon = createIcon({\n d: \"M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z\",\n displayName: \"ArrowForwardIcon\",\n})\n","import { useBreakpointValue } from \"@chakra-ui/media-query\"\nimport {\n chakra,\n forwardRef,\n keyframes,\n omitThemingProps,\n ThemingProps,\n useStyleConfig,\n HTMLChakraProps,\n} from \"@chakra-ui/system\"\nimport { usePrevious } from \"@chakra-ui/hooks\"\nimport { cx, __DEV__ } from \"@chakra-ui/utils\"\nimport as React from \"react\"\n\nexport interface SkeletonOptions {\n /*\n The color at the animation start\n /\n startColor?: string\n /\n The color at the animation end\n /\n endColor?: string\n /\n If `true`, it'll render its children with a nice fade transition\n /\n isLoaded?: boolean\n /\n The animation speed in seconds\n * @default\n * 0.8\n /\n speed?: number\n /\n The fadeIn duration in seconds\n \n @default\n * 0.4\n /\n fadeDuration?: number\n}\n\nconst StyledSkeleton = chakra(\"div\", {\n baseStyle: {\n boxShadow: \"none\",\n backgroundClip: \"padding-box\",\n cursor: \"default\",\n color: \"transparent\",\n pointerEvents: \"none\",\n userSelect: \"none\",\n \"&::before, &::after, \": {\n visibility: \"hidden\",\n },\n },\n})\n\nexport type ISkeleton = SkeletonOptions\n\nexport interface SkeletonProps\n extends HTMLChakraProps<\"div\">,\n SkeletonOptions,\n ThemingProps<\"Skeleton\"> {}\n\nconst fade = keyframes({\n from: { opacity: 0 },\n to: { opacity: 1 },\n})\n\nconst useIsFirstRender = () => {\n const isFirstRender = React.useRef(true)\n\n React.useEffect(() => {\n isFirstRender.current = false\n }, [])\n\n return isFirstRender.current\n}\n\nexport const Skeleton = forwardRef<SkeletonProps, \"div\">((props, ref) => {\n const styles = useStyleConfig(\"Skeleton\", props)\n const isFirstRender = useIsFirstRender()\n\n const {\n startColor,\n endColor,\n isLoaded,\n fadeDuration,\n speed,\n className,\n ...rest\n } = omitThemingProps(props)\n\n const wasPreviouslyLoaded = usePrevious(isLoaded)\n\n const _className = cx(\"chakra-skeleton\", className)\n\n if (isLoaded) {\n const animation =\n isFirstRender \|\| wasPreviouslyLoaded ? \"none\" : `${fade} ${fadeDuration}s`\n\n return (\n <chakra.div\n ref={ref}\n className={_className}\n __css={{ animation }}\n {...rest}\n />\n )\n }\n\n return (\n <StyledSkeleton ref={ref} className={_className} {...rest} __css={styles} />\n )\n})\n\nSkeleton.defaultProps = {\n fadeDuration: 0.4,\n speed: 0.8,\n}\n\nif (__DEV__) {\n Skeleton.displayName = \"Skeleton\"\n}\n\nfunction range(count: number) {\n return Array(count)\n .fill(1)\n .map((_, index) => index + 1)\n}\n\nexport interface SkeletonTextProps extends SkeletonProps {\n spacing?: SkeletonProps[\"margin\"]\n skeletonHeight?: SkeletonProps[\"height\"]\n startColor?: SkeletonProps[\"startColor\"]\n endColor?: SkeletonProps[\"endColor\"]\n isLoaded?: SkeletonProps[\"isLoaded\"]\n}\n\nconst defaultNoOfLines = 3\n\nexport const SkeletonText: React.FC<SkeletonTextProps> = (props) => {\n const {\n noOfLines = defaultNoOfLines,\n spacing = \"0.5rem\",\n skeletonHeight = \"0.5rem\",\n className,\n startColor,\n endColor,\n isLoaded,\n fadeDuration,\n speed,\n children,\n ...rest\n } = props\n\n const noOfLinesValue =\n useBreakpointValue(\n typeof noOfLines === \"number\" ? [noOfLines] : noOfLines,\n ) \|\| defaultNoOfLines\n const numbers = range(noOfLinesValue)\n\n const getWidth = (index: number) => {\n if (noOfLinesValue > 1) {\n return index === numbers.length ? \"80%\" : \"100%\"\n }\n return \"100%\"\n }\n\n const _className = cx(\"chakra-skeleton__group\", className)\n\n return (\n <chakra.div className={_className} {...rest}>\n {numbers.map((number, index) => {\n if (isLoaded && index > 0) {\n // skip other lines\n return null\n }\n\n const sizeProps = isLoaded\n ? null\n : {\n mb: number === numbers.length ? \"0\" : spacing,\n width: getWidth(number),\n height: skeletonHeight,\n }\n\n return (\n <Skeleton\n key={numbers.length.toString() + number}\n startColor={startColor}\n endColor={endColor}\n isLoaded={isLoaded}\n fadeDuration={fadeDuration}\n speed={speed}\n {...sizeProps}\n >\n {\n // allows animating the children\n index === 0 ? children : undefined\n }\n </Skeleton>\n )\n })}\n </chakra.div>\n )\n}\n\nif (__DEV__) {\n SkeletonText.displayName = \"SkeletonText\"\n}\n\nexport const SkeletonCircle: React.FC<SkeletonProps> = ({\n size = \"2rem\",\n ...rest\n}) => <Skeleton borderRadius=\"full\" boxSize={size} {...rest} />\n\nif (__DEV__) {\n SkeletonCircle.displayName = \"SkeletonCircle\"\n}\n","import { useRef, useEffect } from \"react\"\n\nexport function usePrevious<T>(value: T) {\n const ref = useRef<T \| undefined>()\n\n useEffect(() => {\n ref.current = value\n }, [value])\n\n return ref.current as T\n}\n"],"sourceRoot":""}
1	+ {"version":3,"sources":["constants/pageInfo.ts","components/Page/Page.tsx","constants/keywords.ts","components/LanguageSupportTooltip/LanguageSupportTooltip.tsx","components/PackageTag/PackageTag.tsx","components/Time/Time.tsx","../../../src/link-box.tsx","../../../src/ChevronRight.tsx","components/CatalogCard/testIds.ts","components/CatalogCard/CatalogCardContainer.tsx","components/CatalogCard/CatalogCardSkeleton.tsx","components/CatalogCard/CatalogCard.tsx","components/Results/ResultsGrid.tsx","components/Results/Results.tsx","components/CatalogSearch/testIds.ts","components/CatalogSearch/CatalogSearchInputs.tsx","components/CatalogSearch/Dropdown.tsx","components/CatalogSearch/CatalogSearch.tsx","../../../src/ChevronLeft.tsx","../../../src/ArrowForward.tsx","../../../src/skeleton.tsx","../../../src/use-previous.ts"],"names":["pageInfo","home","event","name","faq","packageProfile","search","siteTerms","notFound","page","pageType","Page","children","meta","pageName","trackPageView","usePageView","useEffect","suffix","title","description","formattedTitle","Helmet","process","content","charSet","property","KEYWORD_IGNORE_LIST","Set","LanguageSupportTooltip","language","isSupported","TEMP_SUPPORTED_LANGUAGES","has","langName","LANGUAGE_NAME_MAP","message","hasArrow","label","placement","PackageTag","value","zIndex","tagProps","NavLink","to","getSearchPath","query","_hover","textDecoration","Time","forwardRef","ref","date","formatString","format","boxProps","as","dateTime","toISOString","displayName","LinkOverlay","className","cx","rel","isExternal","target","__css","position","cursor","display","top","left","width","height","LinkBox","ChevronRightIcon","createIcon","d","testIds","createTestIds","CardContainer","Card","h","p","w","overflow","templateColumns","templateRows","CatalogCardContainer","isLink","bg","container","CatalogCardSkeleton","spacing","align","direction","px","py","CatalogCard","currentLanguage","pkg","publishDate","metadata","Date","fontSize","author","languages","targets","Object","keys","getUrl","params","getPackagePath","version","authorName","maxH","maxW","Link","color","fontWeight","isTruncated","ml","Flex","tags","flexWrap","startsWith","mr","variant","keywords","filter","v","Boolean","slice","map","tag","noOfLines","Stack","entries","LANGUAGE_RENDER_MAP","sort","right","LANGUAGES","indexOf","lang","info","isSupportedByLibrary","Language","TypeScript","includes","isSupportedByConstructHub","Icon","icon","opacity","ResultsGrid","columns","base","sm","md","lg","xl","ResultsComponent","results","idx","Results","memo","languageOptions","fromEntries","key","LanguageDropdown","placeholder","items","onSelect","selected","text","options","strategy","Button","borderColor","boxShadow","trigger","rightIcon","ChevronDown","menu","item","onClick","CatalogSearchInputs","onQueryChange","onLanguageChange","input","onChange","languageItem","languageDropdownMenu","languageDropdown","languageDropdownValue","colorScheme","submit","type","CatalogSearch","onSubmit","props","Form","form","autoRows","gap","ChevronLeftIcon","ArrowForwardIcon","StyledSkeleton","chakra","baseStyle","backgroundClip","pointerEvents","userSelect","visibility","fade","keyframes","from","Skeleton","styles","useStyleConfig","isFirstRender","React","useIsFirstRender","omitThemingProps","wasPreviouslyLoaded","useRef","usePrevious","_className","animation","fadeDuration","speed"],"mappings":"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","file":"static/js/2.9c8dd6d5.chunk.js","sourcesContent":["export const pageInfo = {\n home: {\n event: {\n name: \"Home Load\",\n },\n },\n faq: {\n event: {\n name: \"Frequently Asked Questions Load\",\n },\n },\n packageProfile: {\n event: {\n name: \"Package Profile Load\",\n },\n },\n search: {\n event: {\n name: \"Search Load\",\n },\n },\n siteTerms: {\n event: {\n name: \"Site Terms Load\",\n },\n },\n notFound: {\n page: {\n pageType: \"errorPage\",\n },\n event: {\n name: \"404 Page Load\",\n },\n },\n} as const;\n","import { FunctionComponent, useEffect } from \"react\";\nimport { Helmet } from \"react-helmet\";\nimport { pageInfo } from \"../../constants/pageInfo\";\nimport { usePageView } from \"../../contexts/Analytics\";\n\nexport interface PageProps {\n pageName: keyof typeof pageInfo;\n meta: {\n suffix?: boolean;\n title: string;\n description: string;\n };\n}\n\nexport const Page: FunctionComponent<PageProps> = ({\n children,\n meta,\n pageName,\n}) => {\n const trackPageView = usePageView(pageInfo[pageName]);\n\n useEffect(() => {\n trackPageView();\n }, [trackPageView]);\n\n const { suffix = true, title, description } = meta;\n const formattedTitle = suffix ? `${title} - Construct Hub` : title;\n\n return (\n <>\n <Helmet>\n {process.env.NODE_ENV === \"development\" && (\n <meta\n content=\"default-src 'self' 'unsafe-inline' https://.awsstatic.com https://amazonwebservices.d2.sc.omtrdc.net; connect-src 'self' https://.shortbread.aws.dev ws://localhost:3000 https://.awsstatic.com https://amazonwebservices.d2.sc.omtrdc.net; frame-src 'none'; img-src 'self' https:// http://.omtrdc.net; object-src 'none'; style-src 'self' 'unsafe-inline';\"\n httpEquiv=\"Content-Security-Policy\"\n />\n )}\n\n <meta content=\"width=device-width, initial-scale=1\" name=\"viewport\" />\n <meta charSet=\"utf-8\" />\n\n <title>{formattedTitle}</title>\n <meta content={formattedTitle} property=\"og:title\" />\n <meta content={formattedTitle} name=\"twitter:title\" />\n <meta content=\"summary\" name=\"twitter:card\" />\n\n <meta content={description} name=\"description\" />\n <meta content={description} property=\"og:description\" />\n <meta content={description} name=\"twitter:description\" />\n </Helmet>\n {children}\n </>\n );\n};\n","export const KEYWORD_IGNORE_LIST = new Set([\n \"aws-cdk\",\n \"aws\",\n \"awscdk\",\n \"cdk-construct\",\n \"cdk\",\n \"construct\",\n \"constructs\",\n]);\n","import { Tooltip } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport {\n Language,\n LANGUAGE_NAME_MAP,\n TEMP_SUPPORTED_LANGUAGES,\n} from \"../../constants/languages\";\n\nexport interface LanguageSupportTooltipProps {\n language: Language;\n}\n\nexport const LanguageSupportTooltip: FunctionComponent<LanguageSupportTooltipProps> =\n ({ children, language }) => {\n const isSupported = TEMP_SUPPORTED_LANGUAGES.has(language);\n const langName = LANGUAGE_NAME_MAP[language];\n\n const message = isSupported\n ? `Click to view documentation in ${langName}`\n : `Documentation support for ${langName} is coming soon!`;\n\n return (\n <Tooltip hasArrow label={message} placement=\"top-start\">\n <span>{children}</span>\n </Tooltip>\n );\n };\n","import { Tag, TagLabel, TagProps } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Language } from \"../../constants/languages\";\nimport { getSearchPath } from \"../../util/url\";\nimport { NavLink } from \"../NavLink\";\n\nexport interface PackageTagProps extends TagProps {\n language?: Language;\n value: string;\n label?: string;\n zIndex?: string \| number;\n}\n\nexport const PackageTag: FunctionComponent<PackageTagProps> = ({\n children,\n language,\n value,\n label = value,\n zIndex,\n ...tagProps\n}) => {\n return (\n <NavLink\n aria-label={`Tag: ${label}`}\n to={getSearchPath({ query: `${value}`, language })}\n zIndex={zIndex}\n >\n <Tag\n _hover={{\n textDecoration: \"underline\",\n }}\n {...tagProps}\n >\n <TagLabel>{children}</TagLabel>\n </Tag>\n </NavLink>\n );\n};\n","import { Box, BoxProps, forwardRef } from \"@chakra-ui/react\";\nimport { format } from \"date-fns\";\n\nexport interface TimeOptions {\n date: Date;\n format: string;\n}\n\nexport interface TimeProps extends BoxProps, TimeOptions {}\n\nexport const Time = forwardRef<TimeProps, \"time\">(\n ({ date, format: formatString, ...boxProps }, ref) => {\n return (\n <Box as=\"time\" dateTime={date.toISOString()} ref={ref} {...boxProps}>\n {format(date, formatString)}\n </Box>\n );\n }\n);\n\nTime.displayName = \"Time\";\n","import { chakra, forwardRef, HTMLChakraProps } from \"@chakra-ui/system\"\nimport { cx } from \"@chakra-ui/utils\"\nimport as React from \"react\"\n\nexport interface LinkOverlayProps extends HTMLChakraProps<\"a\"> {\n /*\n If `true`, the link will open in new tab\n /\n isExternal?: boolean\n}\n\nexport const LinkOverlay = forwardRef<LinkOverlayProps, \"a\">((props, ref) => {\n const { isExternal, target, rel, className, ...rest } = props\n return (\n <chakra.a\n {...rest}\n ref={ref}\n className={cx(\"chakra-linkbox__overlay\", className)}\n rel={isExternal ? \"noopener noreferrer\" : rel}\n target={isExternal ? \"_blank\" : target}\n __css={{\n position: \"static\",\n \"&::before\": {\n content: \"''\",\n cursor: \"inherit\",\n display: \"block\",\n position: \"absolute\",\n top: 0,\n left: 0,\n zIndex: 0,\n width: \"100%\",\n height: \"100%\",\n },\n }}\n />\n )\n})\n\nexport interface LinkBoxProps extends HTMLChakraProps<\"div\"> {}\n\n/\n `LinkBox` is used to wrap content areas within a link while ensuring semantic html\n \n @see Docs https://chakra-ui.com/docs/navigation/link-overlay\n * @see Resources https://www.sarasoueidan.com/blog/nested-links\n /\nexport const LinkBox = forwardRef<LinkBoxProps, \"div\">((props, ref) => {\n const { className, ...rest } = props\n\n return (\n <chakra.div\n ref={ref}\n position=\"relative\"\n {...rest}\n className={cx(\"chakra-linkbox\", className)}\n __css={{\n / Elevate the links and abbreviations up /\n \"a[href]:not(.chakra-linkbox__overlay), abbr[title]\": {\n position: \"relative\",\n zIndex: 1,\n },\n }}\n />\n )\n})\n","import { createIcon } from \"@chakra-ui/icon\"\n\nexport const ChevronRightIcon = createIcon({\n d: \"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\",\n displayName: \"ChevronRightIcon\",\n})\n","import { createTestIds } from \"../../util/createTestIds\";\n\nconst testIds = createTestIds(\"catalogCard\", [\n \"container\",\n \"name\",\n \"version\",\n \"tags\",\n \"description\",\n \"date\",\n \"author\",\n \"languages\",\n] as const);\n\nexport default testIds;\n","import { Grid, LinkBox } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Card } from \"../Card\";\nimport testIds from \"./testIds\";\n\nconst CardContainer: FunctionComponent = ({ children }) => (\n <Card h={64} p={0} w=\"100%\">\n <Grid\n as=\"article\"\n h=\"100%\"\n overflow=\"hidden\"\n templateColumns=\"1fr\"\n templateRows=\"2fr 1fr\"\n >\n {children}\n </Grid>\n </Card>\n);\n\nexport const CatalogCardContainer: FunctionComponent<{ isLink?: boolean }> = ({\n children,\n isLink,\n}) => {\n return isLink ? (\n <LinkBox\n _hover={{\n \"> :first-child\": {\n bg: \"gray.50\",\n },\n }}\n data-testid={testIds.container}\n >\n <CardContainer>{children}</CardContainer>\n </LinkBox>\n ) : (\n <CardContainer>{children}</CardContainer>\n );\n};\n","import { Box, Divider, Skeleton, Stack } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\n\nexport const CatalogCardSkeleton: FunctionComponent = () => (\n <>\n <Stack p={4} spacing={4}>\n <Skeleton h={5} w=\"50%\" />\n <Stack align=\"center\" direction=\"row\" spacing={2}>\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n </Stack>\n <Skeleton h={3} w=\"75%\" />\n <Skeleton h={3} w=\"50%\" />\n </Stack>\n <Box>\n <Divider />\n <Stack px={4} py={2} spacing={2}>\n <Skeleton h={5} w=\"25%\" />\n <Stack align=\"center\" direction=\"row\" spacing={2}>\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n <Skeleton h={5} w={10} />\n </Stack>\n </Stack>\n </Box>\n </>\n);\n","import {\n Box,\n Divider,\n Flex,\n LinkBox,\n Link as UILink,\n LinkOverlay,\n Stack,\n Text,\n} from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport { CatalogPackage } from \"../../api/package/packages\";\nimport { KEYWORD_IGNORE_LIST } from \"../../constants/keywords\";\nimport {\n Language,\n LANGUAGES,\n LANGUAGE_RENDER_MAP,\n TEMP_SUPPORTED_LANGUAGES,\n} from \"../../constants/languages\";\nimport { getPackagePath, getSearchPath } from \"../../util/url\";\nimport { LanguageSupportTooltip } from \"../LanguageSupportTooltip\";\nimport { PackageTag } from \"../PackageTag\";\nimport { Time } from \"../Time\";\nimport { CatalogCardContainer } from \"./CatalogCardContainer\";\nimport { CatalogCardSkeleton } from \"./CatalogCardSkeleton\";\nimport testIds from \"./testIds\";\n\nexport interface CatalogCardProps {\n /\n Specifies the language to link to by default\n /\n language?: Language;\n /\n If undefined, will render a skeleton\n /\n pkg?: CatalogPackage;\n}\n\nexport const CatalogCard: FunctionComponent<CatalogCardProps> = ({\n language: currentLanguage,\n pkg,\n}) => {\n if (!pkg) {\n return (\n <CatalogCardContainer>\n <CatalogCardSkeleton />\n </CatalogCardContainer>\n );\n }\n\n const publishDate = pkg.metadata?.date ? (\n <Time\n date={new Date(pkg.metadata.date)}\n fontSize=\"sm\"\n format=\"MMMM dd, yyyy\"\n />\n ) : null;\n\n const author = pkg.author ?? {};\n const languages = pkg.languages ?? {};\n const targets = Object.keys(languages) as Language[];\n\n const getUrl = (params?: Partial<Parameters<typeof getPackagePath>[0]>) =>\n getPackagePath({\n name: pkg.name,\n version: pkg.version,\n language: currentLanguage,\n ...params,\n });\n\n const authorName = typeof author === \"string\" ? author : author.name;\n\n return (\n <CatalogCardContainer isLink>\n <Stack maxH=\"100%\" maxW=\"100%\" overflow=\"hidden\" p={4} spacing={0}>\n {/ Name & Version /}\n <LinkOverlay as={Link} to={getUrl()}>\n <Text\n color=\"blue.800\"\n data-testid={testIds.name}\n fontWeight=\"semibold\"\n isTruncated\n >\n {pkg.name}\n\n <Text\n as=\"span\"\n color=\"blue.500\"\n data-testid={testIds.version}\n fontSize=\"xs\"\n ml={2}\n >\n {pkg.version}\n </Text>\n </Text>\n </LinkOverlay>\n\n {/ Tags /}\n <LinkBox\n as={Flex}\n data-testid={testIds.tags}\n flexWrap=\"wrap\"\n maxH={6}\n overflow=\"hidden\"\n >\n {[\n pkg.name.startsWith(\"@aws-cdk/\") ? (\n <PackageTag\n key=\"official\"\n label=\"official\"\n language={currentLanguage}\n mr={1}\n value=\"@aws-cdk\"\n variant=\"official\"\n >\n Official\n </PackageTag>\n ) : null,\n ...(pkg.keywords ?? [])\n .filter((v) => Boolean(v) && !KEYWORD_IGNORE_LIST.has(v))\n .slice(0, 3)\n .map((tag) => {\n return (\n <PackageTag\n key={tag}\n language={currentLanguage}\n mr={1}\n value={`\"${tag}\"`}\n zIndex=\"0 !important\"\n >\n {tag}\n </PackageTag>\n );\n }),\n ]}\n </LinkBox>\n <Text data-testid={testIds.description} fontSize=\"sm\" noOfLines={2}>\n {pkg.description}\n </Text>\n </Stack>\n\n {/ Bottom Details /}\n <Box>\n <Divider />\n <Stack maxW=\"100%\" overflow=\"hidden\" px={4} py={2} spacing={2}>\n <Text data-testid={testIds.date} fontSize=\"sm\" isTruncated>\n {publishDate}\n </Text>\n\n <UILink\n as={Link}\n color=\"blue.500\"\n data-testid={testIds.author}\n fontSize=\"sm\"\n to={getSearchPath({ query: authorName })}\n >\n {authorName}\n </UILink>\n\n {/ Language Support Icons /}\n <LinkBox\n align=\"center\"\n as={Stack}\n data-testid={testIds.languages}\n direction=\"row\"\n >\n {Object.entries(LANGUAGE_RENDER_MAP)\n // Ensure entries are always sorted in a stable way\n .sort(\n ([left], [right]) =>\n LANGUAGES.indexOf(left as Language) -\n LANGUAGES.indexOf(right as Language)\n )\n .map(([lang, info]) => {\n const language = lang as Language;\n\n const isSupportedByLibrary =\n language === Language.TypeScript \|\|\n targets.includes(language);\n\n const isSupportedByConstructHub =\n language === Language.TypeScript \|\| // TypeScript is always supported\n // Otherwise, the language must be supported by ConstructHub\n TEMP_SUPPORTED_LANGUAGES.has(language);\n\n if (!isSupportedByLibrary) return null;\n\n const { name, icon: Icon } = info;\n\n const icon = (\n <Icon\n aria-label={`Supports ${name}`}\n h={6}\n opacity={isSupportedByConstructHub ? 1 : 0.2}\n w={6}\n />\n );\n\n return (\n <LanguageSupportTooltip key={language} language={language}>\n {isSupportedByConstructHub ? (\n <Link\n aria-label={`View package docs for ${language}`}\n to={getUrl({ language })}\n >\n {icon}\n </Link>\n ) : (\n icon\n )}\n </LanguageSupportTooltip>\n );\n })}\n </LinkBox>\n </Stack>\n </Box>\n </CatalogCardContainer>\n );\n};\n","import { SimpleGrid } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\n\nexport const ResultsGrid: FunctionComponent = ({ children }) => (\n <SimpleGrid\n columns={{\n base: 1,\n sm: 2,\n md: 3,\n lg: 4,\n xl: 5,\n \"2xl\": 6,\n }}\n spacing={6}\n >\n {children}\n </SimpleGrid>\n);\n","import { FunctionComponent, memo } from \"react\";\nimport { Packages } from \"../../api/package/packages\";\nimport { Language } from \"../../constants/languages\";\nimport { CatalogCard } from \"../CatalogCard\";\nimport { ResultsGrid } from \"./ResultsGrid\";\n\nexport interface ResultsProps {\n language?: Language;\n results: Packages[\"packages\"];\n skeleton?: {\n loading: boolean;\n noOfItems: number;\n };\n}\n\nconst ResultsComponent: FunctionComponent<ResultsProps> = ({\n language,\n results,\n}) => {\n return (\n <ResultsGrid>\n {results.map((pkg, idx) => (\n <CatalogCard key={`${pkg.name}-${idx}`} language={language} pkg={pkg} />\n ))}\n </ResultsGrid>\n );\n};\n\nexport const Results = memo(ResultsComponent) as typeof ResultsComponent;\n","import { createTestIds } from \"../../util/createTestIds\";\n\nconst testIds = createTestIds(\"catalogSearch\", [\n \"form\",\n \"input\",\n \"languageDropdown\",\n \"languageDropdownMenu\",\n \"languageDropdownValue\",\n \"languageItem\",\n \"submit\",\n] as const);\n\nexport default testIds;\n","import { Button, forwardRef, Input } from \"@chakra-ui/react\";\nimport type { ChangeEventHandler, FunctionComponent } from \"react\";\nimport {\n Language,\n TEMP_SUPPORTED_LANGUAGES,\n LANGUAGE_NAME_MAP,\n} from \"../../constants/languages\";\nimport { Dropdown, DropdownProps } from \"./Dropdown\";\nimport testIds from \"./testIds\";\n\ntype LanguageItems = Partial<Record<Language, string>>;\n\nconst languageOptions = Object.fromEntries(\n Object.entries(LANGUAGE_NAME_MAP).filter(([key]) =>\n TEMP_SUPPORTED_LANGUAGES.has(key as Language)\n )\n) as LanguageItems;\n\nconst LanguageDropdown: FunctionComponent<DropdownProps<LanguageItems>> =\n Dropdown;\n\n/\n @deprecated Use `<SearchBar />` instead.\n /\nexport interface CatalogSearchInputsProps {\n /\n Controls the query state value\n /\n query: string;\n /\n Controls the query state change event\n /\n onQueryChange: ChangeEventHandler<HTMLInputElement>;\n /\n Controls the language state value\n /\n language?: Language;\n /\n Controls the language state change event\n /\n onLanguageChange: (language?: Language) => void;\n}\n\nexport const CatalogSearchInputs = forwardRef<\n CatalogSearchInputsProps,\n \"input\"\n>(({ query, onQueryChange, language, onLanguageChange }, ref) => (\n <>\n <Input\n bg=\"white\"\n borderColor=\"blue.100\"\n boxShadow=\"base\"\n data-testid={testIds.input}\n name=\"query\"\n onChange={onQueryChange}\n placeholder=\"Search Constructs...\"\n ref={ref}\n value={query}\n />\n <LanguageDropdown\n items={languageOptions}\n onSelect={onLanguageChange}\n placeholder=\"Language...\"\n selected={language}\n testIds={{\n item: testIds.languageItem,\n menu: testIds.languageDropdownMenu,\n trigger: testIds.languageDropdown,\n value: testIds.languageDropdownValue,\n }}\n />\n <Button\n boxShadow=\"base\"\n colorScheme=\"blue\"\n data-testid={testIds.submit}\n type=\"submit\"\n >\n Search\n </Button>\n </>\n));\n","import { ChevronDownIcon } from \"@chakra-ui/icons\";\nimport {\n Button,\n Menu,\n MenuButton,\n MenuItem,\n MenuList,\n Text,\n} from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\n\nexport interface DropdownProps<T = Record<string, string>> {\n testIds: {\n item: string;\n menu: string;\n trigger: string;\n value: string;\n };\n placeholder: string;\n selected?: T[keyof T];\n onSelect: (val?: keyof T) => void;\n items: T;\n}\n\nexport const Dropdown: FunctionComponent<DropdownProps> = ({\n placeholder,\n items,\n onSelect,\n selected,\n testIds,\n}) => {\n const text = selected ? items[selected] : placeholder;\n const options = Object.entries(items);\n\n return (\n <Menu strategy=\"fixed\">\n <MenuButton\n as={Button}\n bg=\"white\"\n borderColor=\"blue.100\"\n boxShadow=\"base\"\n data-testid={testIds.trigger}\n rightIcon={<ChevronDownIcon color=\"blue.500\" />}\n variant=\"outline\"\n >\n <Text data-testid={testIds.value}>{text}</Text>\n </MenuButton>\n <MenuList data-testid={testIds.menu}>\n <MenuItem data-testid={testIds.item} onClick={() => onSelect()}>\n Any\n </MenuItem>\n {options.map(([name, displayName]) => (\n <MenuItem\n data-testid={testIds.item}\n key={name}\n onClick={() => onSelect(name)}\n >\n {displayName}\n </MenuItem>\n ))}\n </MenuList>\n </Menu>\n );\n};\n","import { Grid } from \"@chakra-ui/react\";\nimport type { FormEventHandler, FunctionComponent } from \"react\";\nimport { Form } from \"../Form\";\nimport {\n CatalogSearchInputs,\n CatalogSearchInputsProps,\n} from \"./CatalogSearchInputs\";\nimport testIds from \"./testIds\";\n\nexport interface CatalogSearchProps extends CatalogSearchInputsProps {\n /\n Called when the catalog search form is submitted (via enter keypress or submit click)\n /\n onSubmit: FormEventHandler<HTMLFormElement>;\n}\n\n/\n @deprecated Use `<SearchBar />` instead.\n /\nexport const CatalogSearch: FunctionComponent<CatalogSearchProps> = ({\n onSubmit,\n ...props\n}) => {\n return (\n <Form data-testid={testIds.form} onSubmit={onSubmit}>\n <Grid\n autoRows=\"1fr\"\n gap={4}\n templateColumns={{ sm: \"1fr\", md: \"3fr 1fr 1fr\" }}\n width=\"full\"\n >\n <CatalogSearchInputs {...props} />\n </Grid>\n </Form>\n );\n};\n","import { createIcon } from \"@chakra-ui/icon\"\n\nexport const ChevronLeftIcon = createIcon({\n d: \"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z\",\n displayName: \"ChevronLeftIcon\",\n})\n","import { createIcon } from \"@chakra-ui/icon\"\n\nexport const ArrowForwardIcon = createIcon({\n d: \"M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z\",\n displayName: \"ArrowForwardIcon\",\n})\n","import { useBreakpointValue } from \"@chakra-ui/media-query\"\nimport {\n chakra,\n forwardRef,\n keyframes,\n omitThemingProps,\n ThemingProps,\n useStyleConfig,\n HTMLChakraProps,\n} from \"@chakra-ui/system\"\nimport { usePrevious } from \"@chakra-ui/hooks\"\nimport { cx, __DEV__ } from \"@chakra-ui/utils\"\nimport as React from \"react\"\n\nexport interface SkeletonOptions {\n /*\n The color at the animation start\n /\n startColor?: string\n /\n The color at the animation end\n /\n endColor?: string\n /\n If `true`, it'll render its children with a nice fade transition\n /\n isLoaded?: boolean\n /\n The animation speed in seconds\n * @default\n * 0.8\n /\n speed?: number\n /\n The fadeIn duration in seconds\n \n @default\n * 0.4\n /\n fadeDuration?: number\n}\n\nconst StyledSkeleton = chakra(\"div\", {\n baseStyle: {\n boxShadow: \"none\",\n backgroundClip: \"padding-box\",\n cursor: \"default\",\n color: \"transparent\",\n pointerEvents: \"none\",\n userSelect: \"none\",\n \"&::before, &::after, \": {\n visibility: \"hidden\",\n },\n },\n})\n\nexport type ISkeleton = SkeletonOptions\n\nexport interface SkeletonProps\n extends HTMLChakraProps<\"div\">,\n SkeletonOptions,\n ThemingProps<\"Skeleton\"> {}\n\nconst fade = keyframes({\n from: { opacity: 0 },\n to: { opacity: 1 },\n})\n\nconst useIsFirstRender = () => {\n const isFirstRender = React.useRef(true)\n\n React.useEffect(() => {\n isFirstRender.current = false\n }, [])\n\n return isFirstRender.current\n}\n\nexport const Skeleton = forwardRef<SkeletonProps, \"div\">((props, ref) => {\n const styles = useStyleConfig(\"Skeleton\", props)\n const isFirstRender = useIsFirstRender()\n\n const {\n startColor,\n endColor,\n isLoaded,\n fadeDuration,\n speed,\n className,\n ...rest\n } = omitThemingProps(props)\n\n const wasPreviouslyLoaded = usePrevious(isLoaded)\n\n const _className = cx(\"chakra-skeleton\", className)\n\n if (isLoaded) {\n const animation =\n isFirstRender \|\| wasPreviouslyLoaded ? \"none\" : `${fade} ${fadeDuration}s`\n\n return (\n <chakra.div\n ref={ref}\n className={_className}\n __css={{ animation }}\n {...rest}\n />\n )\n }\n\n return (\n <StyledSkeleton ref={ref} className={_className} {...rest} __css={styles} />\n )\n})\n\nSkeleton.defaultProps = {\n fadeDuration: 0.4,\n speed: 0.8,\n}\n\nif (__DEV__) {\n Skeleton.displayName = \"Skeleton\"\n}\n\nfunction range(count: number) {\n return Array(count)\n .fill(1)\n .map((_, index) => index + 1)\n}\n\nexport interface SkeletonTextProps extends SkeletonProps {\n spacing?: SkeletonProps[\"margin\"]\n skeletonHeight?: SkeletonProps[\"height\"]\n startColor?: SkeletonProps[\"startColor\"]\n endColor?: SkeletonProps[\"endColor\"]\n isLoaded?: SkeletonProps[\"isLoaded\"]\n}\n\nconst defaultNoOfLines = 3\n\nexport const SkeletonText: React.FC<SkeletonTextProps> = (props) => {\n const {\n noOfLines = defaultNoOfLines,\n spacing = \"0.5rem\",\n skeletonHeight = \"0.5rem\",\n className,\n startColor,\n endColor,\n isLoaded,\n fadeDuration,\n speed,\n children,\n ...rest\n } = props\n\n const noOfLinesValue =\n useBreakpointValue(\n typeof noOfLines === \"number\" ? [noOfLines] : noOfLines,\n ) \|\| defaultNoOfLines\n const numbers = range(noOfLinesValue)\n\n const getWidth = (index: number) => {\n if (noOfLinesValue > 1) {\n return index === numbers.length ? \"80%\" : \"100%\"\n }\n return \"100%\"\n }\n\n const _className = cx(\"chakra-skeleton__group\", className)\n\n return (\n <chakra.div className={_className} {...rest}>\n {numbers.map((number, index) => {\n if (isLoaded && index > 0) {\n // skip other lines\n return null\n }\n\n const sizeProps = isLoaded\n ? null\n : {\n mb: number === numbers.length ? \"0\" : spacing,\n width: getWidth(number),\n height: skeletonHeight,\n }\n\n return (\n <Skeleton\n key={numbers.length.toString() + number}\n startColor={startColor}\n endColor={endColor}\n isLoaded={isLoaded}\n fadeDuration={fadeDuration}\n speed={speed}\n {...sizeProps}\n >\n {\n // allows animating the children\n index === 0 ? children : undefined\n }\n </Skeleton>\n )\n })}\n </chakra.div>\n )\n}\n\nif (__DEV__) {\n SkeletonText.displayName = \"SkeletonText\"\n}\n\nexport const SkeletonCircle: React.FC<SkeletonProps> = ({\n size = \"2rem\",\n ...rest\n}) => <Skeleton borderRadius=\"full\" boxSize={size} {...rest} />\n\nif (__DEV__) {\n SkeletonCircle.displayName = \"SkeletonCircle\"\n}\n","import { useRef, useEffect } from \"react\"\n\nexport function usePrevious<T>(value: T) {\n const ref = useRef<T \| undefined>()\n\n useEffect(() => {\n ref.current = value\n }, [value])\n\n return ref.current as T\n}\n"],"sourceRoot":""}