construct-hub-webapp 0.1.276 → 0.1.280

package/package.json

@@ -65,7 +65,7 @@
     "json-schema": "^0.3.0",
     "npm-check-updates": "^11",
     "prettier": "^2.4.1",
-    "projen": "^0.29.10",
+    "projen": "^0.29.14",
     "react-app-rewired": "^2.1.8",
     "standard-version": "^9",
     "typescript": "^4.0.3"
@@ -77,12 +77,12 @@
     "@chakra-ui/theme-tools": "*",
     "@emotion/react": "^11",
     "@emotion/styled": "^11",
-    "@jsii/spec": "^1.37.0",
+    "@jsii/spec": "^1.38.0",
     "copy-to-clipboard": "^3.3.1",
     "date-fns": "^2.25.0",
     "framer-motion": "^4",
     "hast-util-sanitize": "^3.0.2",
-    "jsii-reflect": "^1.37.0",
+    "jsii-reflect": "^1.38.0",
     "lunr": "^2.3.9",
     "prism-react-renderer": "^1.2.1",
     "react": "^17.0.2",
@@ -104,7 +104,7 @@
   },
   "bundledDependencies": [],
   "license": "Apache-2.0",
-  "version": "0.1.276",
+  "version": "0.1.280",
   "eslintConfig": {
     "extends": [
       "react-app",

package/build/static/js/10.e14dabc8.chunk.js

@@ -1,2 +0,0 @@
-(this["webpackJsonpconstruct-hub-webapp"]=this["webpackJsonpconstruct-hub-webapp"]||[]).push([[10],{233:function(e,t,n){"use strict";n.d(t,"a",(function(){return o}));var r=n(0),a=n(246),c={home:{event:{name:"Home Load"}},faq:{event:{name:"Frequently Asked Questions Load"}},packageProfile:{event:{name:"Package Profile Load"}},search:{event:{name:"Search Load"}},siteTerms:{event:{name:"Site Terms Load"}},notFound:{page:{pageType:"errorPage"},event:{name:"404 Page Load"}}},i=n(118),s=n(1),o=function(e){var t=e.children,n=e.meta,o=e.pageName,l=Object(i.b)(c[o]);Object(r.useEffect)((function(){l()}),[l]);var u=n.suffix,d=void 0===u||u,b=n.title,j=n.description,f=d?"".concat(b," - Construct Hub"):b;return Object(s.jsxs)(s.Fragment,{children:[Object(s.jsxs)(a.a,{children:[!1,Object(s.jsx)("meta",{content:"width=device-width, initial-scale=1",name:"viewport"}),Object(s.jsx)("meta",{charSet:"utf-8"}),Object(s.jsx)("title",{children:f}),Object(s.jsx)("meta",{content:f,property:"og:title"}),Object(s.jsx)("meta",{content:f,name:"twitter:title"}),Object(s.jsx)("meta",{content:"summary",name:"twitter:card"}),Object(s.jsx)("meta",{content:j,name:"description"}),Object(s.jsx)("meta",{content:j,property:"og:description"}),Object(s.jsx)("meta",{content:j,name:"twitter:description"})]}),t]})}},247:function(e,t,n){"use strict";n.d(t,"c",(function(){return a})),n.d(t,"b",(function(){return c})),n.d(t,"d",(function(){return i})),n.d(t,"a",(function(){return o}));var r=n(10),a=function(e,t){return t?"".concat(t,"/").concat(e):e},c=function(e,t,n){var c="".concat(r.a.PACKAGES_PREFIX,"/"),i=a(e,n),s="/v".concat(t);return"".concat(c).concat(i).concat(s)},i=function(e){var t=e;return(t.startsWith("~")||t.startsWith("^"))&&(t=t.substring(1)),t},s=function(e){return i(e).split(".")[0]},o=function(e,t){var n=e.packages.filter((function(e){return e.name===t}));return n.length>1?n.sort((function(e,t){var n=s(e.version);return s(t.version).localeCompare(n)}))[0]:n[0]}},250:function(e,t,n){"use strict";n.d(t,"a",(function(){return u}));var r=n(6),a=n(23),c=n(19),i=n(195),s=n(301),o=n(1),l=["sources"],u=Object(c.a)((function(e,t){var n=e.sources,c=Object(a.a)(e,l);return Object(o.jsxs)(i.a,{as:"picture",children:[null===n||void 0===n?void 0:n.map((function(e,t){return Object(o.jsx)("source",{media:e.media,srcSet:e.srcSet},t)})),Object(o.jsx)(s.a,Object(r.a)({ref:t},c))]})}));u.displayName="Picture"},251:function(e,t,n){"use strict";n.d(t,"a",(function(){return i}));var r=n(224),a=n(47),c=n(1),i=function(e){var t=e.children,n=e.language;return a.e.has(n)?Object(c.jsx)(c.Fragment,{children:t}):Object(c.jsx)(r.a,{hasArrow:!0,label:"Documentation support for ".concat(a.b[n]," is coming soon!"),placement:"top-start",children:Object(c.jsx)("span",{children:t})})}},252:function(e,t,n){"use strict";n.d(t,"a",(function(){return u}));var r=n(6),a=n(23),c=n(19),i=n(195),s=n(598),o=n(1),l=["date","format"],u=Object(c.a)((function(e,t){var n=e.date,c=e.format,u=Object(a.a)(e,l);return Object(o.jsx)(i.a,Object(r.a)(Object(r.a)({as:"time",dateTime:n.toISOString(),ref:t},u),{},{children:Object(s.a)(n,c)}))}));u.displayName="Time"},299:function(e,t,n){"use strict";n.d(t,"a",(function(){return H}));var r,a=n(4),c=n(216),i=n(200),s=n(0);!function(e){e.Wide="wide"}(r||(r={}));var o=n(303),l=n(148),u=n(229),d=n(5),b=n(199),j=n(117),f=n(116),h=n(83),m=n(252),O=n(56),p=Object(O.a)("packageCard",["author","description","languages","published","title","version","comment","wideContainer"]),g=n(1),v=function(e){var t=e["data-testid"],n=e.label,r=e.value;return Object(g.jsxs)(b.a,{"data-testid":t,fontSize:"xs",children:[Object(g.jsx)("strong",{children:n})," ",r]})},x=function(){var e=Object(j.a)(),t=Object(d.a)(e,1)[0],n=L(),r=n.author,a=n.metadata.date,c=n.version,i="string"===typeof r?r:r.name;return Object(g.jsxs)(g.Fragment,{children:[Object(g.jsx)(v,{"data-testid":p.version,label:"Version",value:c}),Object(g.jsx)(v,{"data-testid":p.published,label:"Published",value:Object(g.jsx)(m.a,{date:new Date(a),fontSize:"xs",format:"MMM dd, yyyy"})}),Object(g.jsx)(v,{"data-testid":p.author,label:"Author",value:Object(g.jsx)(h.a,{to:Object(f.c)({query:'"'.concat(i,'"'),language:t}),children:i})})]})},y=n(208),w=n(224),k=n(301),S=n(214),C=n(29),E=n(84),N=function(){var e=Object(j.a)(),t=Object(d.a)(e,1)[0],n=L(),r=n.comment,a=n.description,c=n.metadata.constructFramework,i=n.name,s=n.version,l=null===c||void 0===c?void 0:c.name,u=null===c||void 0===c?void 0:c.majorVersion;return Object(g.jsxs)(g.Fragment,{children:[Object(g.jsx)(o.b,{as:C.b,to:Object(f.a)({name:i,version:s,language:t}),children:Object(g.jsxs)(y.a,{align:"center",children:[l&&Object(g.jsx)(w.a,{hasArrow:!0,label:E.b[l].name+(u?" v".concat(u):""),placement:"top",children:Object(g.jsx)(k.a,{alt:"".concat(E.b[l].name," icon"),h:5,mr:2,src:E.b[l].imgsrc,w:5,zIndex:1})}),Object(g.jsx)(S.a,{as:"h3",color:"blue.800","data-testid":p.title,fontSize:"md",fontWeight:"bold",children:i})]})}),Object(g.jsx)(b.a,{"data-testid":p.description,fontSize:"md",lineHeight:"tall",noOfLines:4,children:a||"No description available."}),r&&Object(g.jsxs)(b.a,{"data-testid":p.comment,fontSize:"md",lineHeight:"tall",noOfLines:4,children:[Object(g.jsxs)(b.a,{as:"span",color:"blue.500",fontSize:"md",fontWeight:"bold",lineHeight:"tall",children:["Editor's note:"," "]}),r]})]})},z=n(6),I=n(47),P=n(251),_={sm:5,md:6,lg:8},W=function(e){var t=e.isRounded,n=void 0!==t&&t,r=e.languages,a=e.name,c=e.size,i=void 0===c?"md":c,s=e.version,o=Object.keys(null!==r&&void 0!==r?r:{});return Object(g.jsx)(g.Fragment,{children:Object.entries(I.c).sort((function(e,t){var n=Object(d.a)(e,1)[0],r=Object(d.a)(t,1)[0];return I.a.indexOf(n)-I.a.indexOf(r)})).map((function(e){var t=Object(d.a)(e,2),r=t[0],c=t[1],l=r,u=l===I.d.TypeScript||o.includes(l),b=l===I.d.TypeScript||I.e.has(l);if(!u)return null;var j=c.name,h=c.icon,m=Object(g.jsx)(h,{"aria-label":"Supports ".concat(j),borderRadius:n?"50%":0,h:_[i],opacity:b?1:.2,w:_[i]});return Object(g.jsx)(P.a,{language:l,children:b?Object(g.jsx)(C.b,{"aria-label":"View package docs for ".concat(l),to:Object(f.a)({name:a,version:s,language:l}),children:m}):m},l)}))})},D=function(){var e=L();return Object(g.jsx)(W,Object(z.a)(Object(z.a)({},e),{},{size:"sm"}))},K=function(){return Object(g.jsx)(o.a,{_hover:{"> article":{bg:"gray.50"}},children:Object(g.jsxs)(l.a,{as:"article",bg:"white",border:"base",borderRadius:"sm",color:"gray.600","data-testid":p.wideContainer,gap:5,p:5,templateColumns:{base:"1fr",md:"2fr 1fr"},templateRows:{base:"auto",md:"1fr"},w:"100%",children:[Object(g.jsxs)(u.a,{spacing:2,children:[Object(g.jsx)(N,{}),Object(g.jsx)(u.a,{direction:"row",spacing:1,children:Object(g.jsx)(D,{})})]}),Object(g.jsx)(u.a,{alignSelf:"center","data-testid":p.languages,fontSize:"xs",spacing:1,children:Object(g.jsx)(x,{})})]})})},F=Object(s.createContext)(null),L=function(){return Object(s.useContext)(F)},R=function(e){var t=e.pkg,n=e.variant,a=void 0===n?r.Wide:n;return Object(g.jsx)(F.Provider,{value:t,children:a===r.Wide&&Object(g.jsx)(K,{})})},A=Object(a.a)({},r.Wide,(function(e){var t=e.items;return Object(g.jsx)(u.a,{spacing:4,children:t.map((function(e){return Object(g.jsx)(R,{pkg:e,variant:r.Wide},"".concat(e.name,"-").concat(e.version))}))})})),H=Object(s.memo)((function(e){var t=e.cardView,n=void 0===t?r.Wide:t,a=e.items;if(e.loading||!a)return Object(g.jsx)(c.a,{children:Object(g.jsx)(i.a,{size:"xl"})});var s=A[n];return Object(g.jsx)(s,{items:a})}));H.displayName="PackageList"},301:function(e,t,n){"use strict";n.d(t,"a",(function(){return j}));var r=n(19),a=n(22),c=n(26),i=n(8),s=n(0),o=n(5),l=n(145);function u(){return u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},u.apply(this,arguments)}function d(e,t){if(null==e)return{};var n,r,a={},c=Object.keys(e);for(r=0;r<c.length;r++)n=c[r],t.indexOf(n)>=0||(a[n]=e[n]);return a}var b=s.forwardRef((function(e,t){var n=e.htmlWidth,r=e.htmlHeight,a=e.alt,c=d(e,["htmlWidth","htmlHeight","alt"]);return s.createElement("img",u({width:n,height:r,ref:t,alt:a},c))})),j=Object(r.a)((function(e,t){var n=e.fallbackSrc,r=e.fallback,i=e.src,j=e.srcSet,f=e.align,h=e.fit,m=e.loading,O=e.ignoreFallback,p=e.crossOrigin,g=d(e,["fallbackSrc","fallback","src","srcSet","align","fit","loading","ignoreFallback","crossOrigin"]),v=null!=m||O||void 0===n&&void 0===r,x=function(e){var t=e.loading,n=e.src,r=e.srcSet,a=e.onLoad,c=e.onError,i=e.crossOrigin,u=e.sizes,d=e.ignoreFallback,b=Object(s.useState)("pending"),j=Object(o.a)(b,2),f=j[0],h=j[1];Object(s.useEffect)((function(){h(n?"loading":"pending")}),[n]);var m=Object(s.useRef)(),O=Object(s.useCallback)((function(){if(n){p();var e=new Image;e.src=n,i&&(e.crossOrigin=i),r&&(e.srcset=r),u&&(e.sizes=u),t&&(e.loading=t),e.onload=function(e){p(),h("loaded"),null==a||a(e)},e.onerror=function(e){p(),h("failed"),null==c||c(e)},m.current=e}}),[n,i,r,u,a,c,t]),p=function(){m.current&&(m.current.onload=null,m.current.onerror=null,m.current=null)};return Object(l.a)((function(){if(!d)return"loading"===f&&O(),function(){p()}}),[f,O,d]),d?"loaded":f}(u({},e,{ignoreFallback:v})),y=u({ref:t,objectFit:h,objectPosition:f},v?g:Object(c.g)(g,["onError","onLoad"]));return"loaded"!==x?r||s.createElement(a.a.img,u({as:b,className:"chakra-image__placeholder",src:n},y)):s.createElement(a.a.img,u({as:b,src:i,srcSet:j,crossOrigin:p,loading:m,className:"chakra-image"},y))}));i.a&&(j.displayName="Image")},303:function(e,t,n){"use strict";n.d(t,"b",(function(){return l})),n.d(t,"a",(function(){return u}));var r=n(19),a=n(22),c=n(16),i=n(0);function s(){return s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s.apply(this,arguments)}function o(e,t){if(null==e)return{};var n,r,a={},c=Object.keys(e);for(r=0;r<c.length;r++)n=c[r],t.indexOf(n)>=0||(a[n]=e[n]);return a}var l=Object(r.a)((function(e,t){var n=e.isExternal,r=e.target,l=e.rel,u=e.className,d=o(e,["isExternal","target","rel","className"]);return i.createElement(a.a.a,s({},d,{ref:t,className:Object(c.d)("chakra-linkbox__overlay",u),rel:n?"noopener noreferrer":l,target:n?"_blank":r,__css:{position:"static","&::before":{content:"''",cursor:"inherit",display:"block",position:"absolute",top:0,left:0,zIndex:0,width:"100%",height:"100%"}}}))})),u=Object(r.a)((function(e,t){var n=e.className,r=o(e,["className"]);return i.createElement(a.a.div,s({ref:t,position:"relative"},r,{className:Object(c.d)("chakra-linkbox",n),__css:{"a[href]:not(.chakra-linkbox__overlay), abbr[title]":{position:"relative",zIndex:1}}}))}))},360:function(e,t,n){"use strict";n.d(t,"a",(function(){return j}));var r=n(19),a=n(63),c=n(36),i=n(22),s=n(62),o=n(16),l=n(8),u=n(179),d=n(0);function b(){return b=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},b.apply(this,arguments)}var j=Object(r.a)((function(e,t){var n=Object(a.a)("Input",e),r=Object(c.b)(e),l=r.children,j=r.className,f=function(e,t){if(null==e)return{};var n,r,a={},c=Object.keys(e);for(r=0;r<c.length;r++)n=c[r],t.indexOf(n)>=0||(a[n]=e[n]);return a}(r,["children","className"]),h=Object(o.d)("chakra-input__group",j),m={},O=Object(u.a)(l),p=n.field;O.forEach((function(e){if(n){var t,r;if(p&&"InputLeftElement"===e.type.id)m.paddingStart=null!=(t=p.height)?t:p.h;if(p&&"InputRightElement"===e.type.id)m.paddingEnd=null!=(r=p.height)?r:p.h;"InputRightAddon"===e.type.id&&(m.borderEndRadius=0),"InputLeftAddon"===e.type.id&&(m.borderStartRadius=0)}}));var g=O.map((function(t){var n,r,a={size:(null==(n=t.props)?void 0:n.size)||e.size,variant:(null==(r=t.props)?void 0:r.variant)||e.variant};return"Input"!==t.type.id?d.cloneElement(t,a):d.cloneElement(t,Object.assign(a,m,t.props))}));return d.createElement(i.a.div,b({className:h,ref:t,__css:{width:"100%",display:"flex",position:"relative"}},f),d.createElement(s.b,{value:n},g))}));l.a&&(j.displayName="InputGroup")},361:function(e,t,n){"use strict";n.d(t,"a",(function(){return f})),n.d(t,"b",(function(){return h}));var r=n(4),a=n(22),c=n(19),i=n(62),s=n(8),o=n(16),l=n(0);function u(){return u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},u.apply(this,arguments)}function d(e,t){if(null==e)return{};var n,r,a={},c=Object.keys(e);for(r=0;r<c.length;r++)n=c[r],t.indexOf(n)>=0||(a[n]=e[n]);return a}var b=Object(a.a)("div",{baseStyle:{display:"flex",alignItems:"center",justifyContent:"center",position:"absolute",top:"0",zIndex:2}}),j=Object(c.a)((function(e,t){var n,a,c,s=e.placement,o=void 0===s?"left":s,j=d(e,["placement"]),f=Object(i.d)().field,h="left"===o?"insetStart":"insetEnd",m=(n={},Object(r.a)(n,h,"0"),Object(r.a)(n,"width",null!=(a=null==f?void 0:f.height)?a:null==f?void 0:f.h),Object(r.a)(n,"height",null!=(c=null==f?void 0:f.height)?c:null==f?void 0:f.h),Object(r.a)(n,"fontSize",null==f?void 0:f.fontSize),n);return l.createElement(b,u({ref:t,__css:m},j))}));j.id="InputElement",s.a&&(j.displayName="InputElement");var f=Object(c.a)((function(e,t){var n=e.className,r=d(e,["className"]),a=Object(o.d)("chakra-input__left-element",n);return l.createElement(j,u({ref:t,placement:"left",className:a},r))}));f.id="InputLeftElement",s.a&&(f.displayName="InputLeftElement");var h=Object(c.a)((function(e,t){var n=e.className,r=d(e,["className"]),a=Object(o.d)("chakra-input__right-element",n);return l.createElement(j,u({ref:t,placement:"right",className:a},r))}));h.id="InputRightElement",s.a&&(h.displayName="InputRightElement")},601:function(e,t,n){"use strict";n.r(t),n.d(t,"HomeRedesign",(function(){return W})),n.d(t,"default",(function(){return W}));var r=n(6),a=n(208),c=n(148),i=n(139),s=n(233),o=n(86),l=n(218),u=n(214),d=n(195),b=n(229),j=n(203),f=n(360),h=n(230),m=n(361),O=n(87),p=n(1),g=function(){return Object(p.jsxs)(a.a,{align:"center",bg:"blue.800",color:"white",direction:"column",justify:"center",py:12,children:[Object(p.jsx)(u.a,{as:"h1",size:"xl",children:"Build cloud infrastructure with reusable components"}),Object(p.jsxs)(u.a,{as:"h2",mt:2,size:"lg",children:["Provided by the"," ",Object(p.jsx)(d.a,{as:"span",color:"yellow.400",children:"community"}),", backed by"," ",Object(p.jsx)(d.a,{as:"span",color:"yellow.400",children:"AWS"}),"."]}),Object(p.jsxs)(a.a,{direction:"column",mt:8,children:[Object(p.jsxs)(b.a,{direction:"row",spacing:7,children:[Object(p.jsx)(j.a,{borderBottom:"1px solid",borderBottomColor:"yellow.400",children:"All CDKs"}),Object(p.jsx)(j.a,{children:"AWS CDK"}),Object(p.jsx)(j.a,{children:"CDK for Terraform"}),Object(p.jsx)(j.a,{children:"CDK for Kubernetes"})]}),Object(p.jsx)(O.a,{mt:4,children:Object(p.jsxs)(f.a,{children:[Object(p.jsx)(h.a,{bg:"white",placeholder:"Search over 600 construct libraries for all CDKS",variant:"filled"}),Object(p.jsx)(m.b,{children:Object(p.jsx)(l.a,{color:"gray.500"})})]})})]})]})},v=n(0),x=n(66),y=n(75),w=n(247),k=n(299),S=n(85),C=function(e){var t=e.name,n=e.showLastUpdated,a=e.showPackages,c=Object(S.b)(),i=c.data,s=c.loading,o=c.error,l=Object(v.useMemo)((function(){return s||o||!(null===i||void 0===i?void 0:i.packages)?[]:n?i.packages.sort(y.b[x.a.PublishDateDesc]).slice(0,n):a?a.map((function(e){var t=Object(w.a)(i,e.name);if(t)return Object(r.a)(Object(r.a)({},t),{},{comment:e.comment})})).filter((function(e){return void 0!==e})):void 0}),[i,o,s,n,a]);return l?Object(p.jsxs)(v.Fragment,{children:[Object(p.jsx)(u.a,{as:"h3",color:"blue.800",my:"4",size:"md",children:t}),Object(p.jsx)(k.a,{items:l,loading:s})]}):(console.warn("config.json is invalid - a section must specify showLastUpdated or showPackages."),null)},E=n(210),N=n(120),z=n(250),I=n(199),P=function(e){var t=e.title,n=e.description,r=e.children;return Object(p.jsxs)(b.a,{color:"blue.800",spacing:4,children:[Object(p.jsx)(u.a,{as:"h3",size:"md",children:t}),Object(p.jsx)(I.a,{size:"sm",children:n}),r]})},_=function(){return Object(p.jsx)(N.a,{borderRadius:"none",boxShadow:"none",h:"full",p:8,children:Object(p.jsxs)(b.a,{spacing:8,children:[Object(p.jsx)(P,{description:Object(p.jsxs)(p.Fragment,{children:["The construct hub is a"," ",Object(p.jsx)("strong",{children:"central destination to discover and share cloud application design patterns and reference architectures"})," ","defined for the AWS CDK, CDK for Kubernetes (CDK8s), CDK for Terraform (CDKtf) and any other construct-based tool."]}),title:"What is Construct Hub?",children:Object(p.jsxs)(a.a,{align:"center",justifyItems:"start",sx:{"& > *":{mt:4,mr:4}},wrap:"wrap",children:[Object(p.jsx)(z.a,{alt:"AWS CDK logo",src:"/assets/aws-cdk.png"}),Object(p.jsx)(z.a,{alt:"Terraform logo",src:"/assets/terraform.png"}),Object(p.jsx)(z.a,{alt:"Kubernetes logo",src:"/assets/kubernetes.png"})]})}),Object(p.jsx)(E.a,{}),Object(p.jsx)(P,{description:Object(p.jsxs)(p.Fragment,{children:["Constructs are ",Object(p.jsx)("strong",{children:"cloud building blocks"})," introduced by the Constructs Programming Model (CPM) that can be"," ",Object(p.jsx)("strong",{children:"used to assemble complete applications of any complexity."})," ","AWS, enterprises, start-ups, and individual developers use CDK constructs to share proven architecture patterns as reusable code libraries, so that everyone can benefit from the collective wisdom of the community."]}),title:"What is a construct?"}),Object(p.jsx)(E.a,{}),Object(p.jsx)(P,{description:Object(p.jsxs)(p.Fragment,{children:["Construct Hub is built to ",Object(p.jsx)("strong",{children:"serve the community"})," ","that uses the constructs programming model (CPM) and to allow them"," ",Object(p.jsx)("strong",{children:"find publicly available constructs they can reuse."})," ","Before the Construct Hub, developers did not have an easy way to discover construct libraries created by the community since they were published across various package managers and without a central index."]}),title:"Why should I use this?"})]})})},W=function(){var e=function(e){var t=Object(o.b)().data;return(null!==t&&void 0!==t?t:{})[e]}("featuredPackages"),t=(null!==e&&void 0!==e?e:i.a).sections;return Object(p.jsx)(s.a,{meta:{title:"Construct Hub",description:"Construct Hub helps developers find open-source construct libraries for use with AWS CDK, CDK8s, CDKTf and other construct-based tools.",suffix:!1},pageName:"home",children:Object(p.jsxs)(a.a,{direction:"column",children:[Object(p.jsx)(g,{}),Object(p.jsxs)(c.a,{gap:3,h:"full",p:3,pl:12,templateColumns:"2fr 1fr",templateRows:"1fr",children:[Object(p.jsx)(a.a,{direction:"column",children:t.map((function(e){return Object(p.jsx)(C,Object(r.a)({},e),e.name)}))}),Object(p.jsx)(_,{})]})]})})}}}]);
-//# sourceMappingURL=10.e14dabc8.chunk.js.map

package/build/static/js/10.e14dabc8.chunk.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["constants/pageInfo.ts","components/Page/Page.tsx","api/package/util.ts","components/Picture/Picture.tsx","components/LanguageSupportTooltip/LanguageSupportTooltip.tsx","components/Time/Time.tsx","components/PackageCard/constants.ts","components/PackageCard/testIds.ts","components/PackageCard/Details.tsx","components/PackageCard/Heading.tsx","components/PackageLanguages/PackageLanguages.tsx","components/PackageCard/Languages.tsx","components/PackageCard/WideCard.tsx","components/PackageCard/PackageCard.tsx","components/PackageList/PackageList.tsx","components/PackageList/WideCardList.tsx","../../../src/image.tsx","../../../src/use-image.ts","../../../src/link-box.tsx","../../../src/input-group.tsx","../../../src/input-element.tsx","views/HomeRedesign/Hero.tsx","views/HomeRedesign/HomeSection.tsx","views/HomeRedesign/InfoSection.tsx","views/HomeRedesign/InfoPanel.tsx","views/HomeRedesign/HomeRedesign.tsx","hooks/useConfigValue/useConfigValue.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","getFullPackageName","scope","getAssetsPath","version","prefix","API_PATHS","PACKAGES_PREFIX","body","sanitizeVersion","ver","sanitized","startsWith","substring","extractMajor","split","findPackage","catalog","pkg","packages","filter","p","length","sort","p1","p2","mv1","localeCompare","Picture","forwardRef","ref","sources","props","as","map","source","idx","media","srcSet","displayName","LanguageSupportTooltip","language","TEMP_SUPPORTED_LANGUAGES","has","hasArrow","label","LANGUAGE_NAME_MAP","placement","Time","date","formatString","format","boxProps","dateTime","toISOString","PackageCardType","testIds","createTestIds","Detail","dataTestid","value","fontSize","Details","useLanguage","currentLanguage","usePackageCard","author","metadata","authorName","published","Date","NavLink","to","getSearchPath","query","Heading","comment","constructFramework","cdkType","cdkVersion","majorVersion","Link","getPackagePath","align","CDKTYPE_RENDER_MAP","alt","h","mr","src","imgsrc","w","zIndex","color","fontWeight","lineHeight","noOfLines","sizes","sm","md","lg","PackageLanguages","isRounded","languages","packageName","size","targets","Object","keys","entries","LANGUAGE_RENDER_MAP","left","right","LANGUAGES","indexOf","lang","info","isSupportedByLibrary","Language","TypeScript","includes","isSupportedByConstructHub","Icon","icon","borderRadius","opacity","Languages","WideCard","_hover","bg","border","wideContainer","gap","templateColumns","base","templateRows","spacing","direction","alignSelf","PackageCardContext","createContext","useContext","PackageCard","variant","Wide","Provider","listViews","items","PackageList","memo","cardView","loading","View","NativeImage","width","height","Image","crossOrigin","shouldIgnore","fallbackSrc","fallback","status","ignoreFallback","useState","setStatus","imageRef","useRef","load","useCallback","flush","img","onLoad","error","onError","useSafeLayoutEffect","useImage","shared","objectFit","objectPosition","rest","omit","className","LinkOverlay","cx","rel","isExternal","target","__css","position","cursor","display","top","LinkBox","InputGroup","styles","useMultiStyleConfig","omitThemingProps","_className","groupStyles","validChildren","getValidChildren","input","child","clones","theming","React","StyledElement","chakra","baseStyle","alignItems","justifyContent","InputElement","useStyles","attr","elementStyles","InputLeftElement","InputRightElement","Hero","justify","py","mt","borderBottom","borderBottomColor","Form","placeholder","Search","HomeSection","showLastUpdated","showPackages","useCatalog","data","results","useMemo","SORT_FUNCTIONS","CatalogSearchSort","PublishDateDesc","slice","undefined","my","console","warn","InfoSection","InfoPanel","Card","boxShadow","justifyItems","sx","wrap","HomeRedesign","homePackages","key","useConfig","useConfigValue","sections","DEFAULT_FEATURED_PACKAGES","pl","section"],"mappings":"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","file":"static/js/10.e14dabc8.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","import { API_PATHS } from \"../../constants/url\";\nimport { CatalogPackage, Packages } from \"./packages\";\n\nexport const getFullPackageName = (name: string, scope?: string) => {\n  return scope ? `${scope}/${name}` : name;\n};\n\nexport const getAssetsPath = (\n  name: string,\n  version: string,\n  scope?: string\n) => {\n  const prefix = `${API_PATHS.PACKAGES_PREFIX}/`;\n  const body = getFullPackageName(name, scope);\n  const suffix = `/v${version}`;\n  return `${prefix}${body}${suffix}`;\n};\n\nexport const sanitizeVersion = (ver: string) => {\n  let sanitized = ver;\n  if (sanitized.startsWith(\"~\") || sanitized.startsWith(\"^\")) {\n    sanitized = sanitized.substring(1);\n  }\n  return sanitized;\n};\n\nconst extractMajor = (ver: string) => {\n  let sanitized = sanitizeVersion(ver);\n  return sanitized.split(\".\")[0];\n};\n\nexport const findPackage = (\n  catalog: Packages,\n  pkg: string\n): CatalogPackage | undefined => {\n  const packages = catalog.packages.filter((p) => p.name === pkg);\n\n  if (packages.length > 1) {\n    return packages.sort((p1, p2) => {\n      const mv1 = extractMajor(p1.version);\n      const mv2 = extractMajor(p2.version);\n      return mv2.localeCompare(mv1);\n    })[0];\n  }\n\n  return packages[0];\n};\n","import { Box, HTMLChakraProps, forwardRef, Image } from \"@chakra-ui/react\";\n\nexport interface PictureProps extends HTMLChakraProps<\"img\"> {\n  alt: string;\n  src: string;\n  sources?: {\n    media?: string;\n    srcSet: string;\n  }[];\n}\n\nexport const Picture = forwardRef<PictureProps, \"img\">(\n  ({ sources, ...props }, ref) => (\n    <Box as=\"picture\">\n      {sources?.map((source, idx) => (\n        <source key={idx} media={source.media} srcSet={source.srcSet} />\n      ))}\n      <Image ref={ref} {...props} />\n    </Box>\n  )\n);\n\nPicture.displayName = \"Picture\";\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\n    if (isSupported) {\n      return <>{children}</>;\n    }\n\n    return (\n      <Tooltip\n        hasArrow\n        label={`Documentation support for ${LANGUAGE_NAME_MAP[language]} is coming soon!`}\n        placement=\"top-start\"\n      >\n        <span>{children}</span>\n      </Tooltip>\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","export enum PackageCardType {\n  Wide = \"wide\",\n}\n","import { createTestIds } from \"../../util/createTestIds\";\n\nconst testIds = createTestIds(\"packageCard\", [\n  \"author\",\n  \"description\",\n  \"languages\",\n  \"published\",\n  \"title\",\n  \"version\",\n  \"comment\",\n  \"wideContainer\",\n] as const);\n\nexport default testIds;\n","import { Text } from \"@chakra-ui/react\";\nimport type { FunctionComponent, ReactChild } from \"react\";\nimport { useLanguage } from \"../../hooks/useLanguage\";\nimport { getSearchPath } from \"../../util/url\";\nimport { NavLink } from \"../NavLink\";\nimport { Time } from \"../Time\";\nimport { usePackageCard } from \"./PackageCard\";\nimport testIds from \"./testIds\";\n\ninterface DetailProps {\n  \"data-testid\": string;\n  label: string;\n  value: ReactChild;\n}\n\nconst Detail: FunctionComponent<DetailProps> = ({\n  \"data-testid\": dataTestid,\n  label,\n  value,\n}) => (\n  <Text data-testid={dataTestid} fontSize=\"xs\">\n    <strong>{label}</strong> {value}\n  </Text>\n);\n\nexport const Details: FunctionComponent = () => {\n  const [currentLanguage] = useLanguage();\n\n  const {\n    author,\n    metadata: { date },\n    version,\n  } = usePackageCard();\n\n  const authorName = typeof author === \"string\" ? author : author.name;\n\n  return (\n    <>\n      <Detail data-testid={testIds.version} label=\"Version\" value={version} />\n      <Detail\n        data-testid={testIds.published}\n        label=\"Published\"\n        value={\n          <Time date={new Date(date)} fontSize=\"xs\" format=\"MMM dd, yyyy\" />\n        }\n      />\n      <Detail\n        data-testid={testIds.author}\n        label=\"Author\"\n        value={\n          <NavLink\n            to={getSearchPath({\n              query: `\"${authorName}\"`,\n              language: currentLanguage,\n            })}\n          >\n            {authorName}\n          </NavLink>\n        }\n      />\n    </>\n  );\n};\n","import {\n  Flex,\n  Image,\n  Heading as ChakraHeading,\n  LinkOverlay,\n  Text,\n  Tooltip,\n} from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport { CDKTYPE_RENDER_MAP } from \"../../constants/constructs\";\nimport { useLanguage } from \"../../hooks/useLanguage\";\nimport { getPackagePath } from \"../../util/url\";\nimport { usePackageCard } from \"./PackageCard\";\nimport testIds from \"./testIds\";\n\nexport const Heading: FunctionComponent = () => {\n  const [currentLanguage] = useLanguage();\n  const {\n    comment,\n    description,\n    metadata: { constructFramework },\n    name,\n    version,\n  } = usePackageCard();\n\n  const cdkType = constructFramework?.name;\n  const cdkVersion = constructFramework?.majorVersion;\n\n  return (\n    <>\n      <LinkOverlay\n        as={Link}\n        to={getPackagePath({\n          name,\n          version,\n          language: currentLanguage,\n        })}\n      >\n        <Flex align=\"center\">\n          {cdkType && (\n            <Tooltip\n              hasArrow\n              label={\n                CDKTYPE_RENDER_MAP[cdkType].name +\n                (cdkVersion ? ` v${cdkVersion}` : \"\")\n              }\n              placement=\"top\"\n            >\n              <Image\n                alt={`${CDKTYPE_RENDER_MAP[cdkType].name} icon`}\n                h={5}\n                mr={2}\n                src={CDKTYPE_RENDER_MAP[cdkType].imgsrc}\n                w={5}\n                zIndex={1}\n              />\n            </Tooltip>\n          )}\n          <ChakraHeading\n            as=\"h3\"\n            color=\"blue.800\"\n            data-testid={testIds.title}\n            fontSize=\"md\"\n            fontWeight=\"bold\"\n          >\n            {name}\n          </ChakraHeading>\n        </Flex>\n      </LinkOverlay>\n      <Text\n        data-testid={testIds.description}\n        fontSize=\"md\"\n        lineHeight=\"tall\"\n        noOfLines={4}\n      >\n        {description || \"No description available.\"}\n      </Text>\n      {comment && (\n        <Text\n          data-testid={testIds.comment}\n          fontSize=\"md\"\n          lineHeight=\"tall\"\n          noOfLines={4}\n        >\n          <Text\n            as=\"span\"\n            color=\"blue.500\"\n            fontSize=\"md\"\n            fontWeight=\"bold\"\n            lineHeight=\"tall\"\n          >\n            Editor&apos;s note:{\" \"}\n          </Text>\n          {comment}\n        </Text>\n      )}\n    </>\n  );\n};\n","import type { FunctionComponent } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport {\n  Language,\n  LANGUAGES,\n  LANGUAGE_RENDER_MAP,\n  TEMP_SUPPORTED_LANGUAGES,\n} from \"../../constants/languages\";\nimport { getPackagePath } from \"../../util/url\";\nimport { LanguageSupportTooltip } from \"../LanguageSupportTooltip\";\n\nconst sizes = {\n  sm: 5,\n  md: 6,\n  lg: 8,\n};\n\nexport interface PackageLanguagesProps {\n  isRounded?: boolean;\n  languages?: Partial<Record<Language, unknown>>;\n  name: string;\n  size?: \"sm\" | \"md\" | \"lg\";\n  version: string;\n}\n\nexport const PackageLanguages: FunctionComponent<PackageLanguagesProps> = ({\n  isRounded = false,\n  languages,\n  name: packageName,\n  size = \"md\",\n  version,\n}) => {\n  const targets = Object.keys(languages ?? {}) as Language[];\n  return (\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 || 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              borderRadius={isRounded ? \"50%\" : 0}\n              h={sizes[size]}\n              opacity={isSupportedByConstructHub ? 1 : 0.2}\n              w={sizes[size]}\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={getPackagePath({ name: packageName, version, language })}\n                >\n                  {icon}\n                </Link>\n              ) : (\n                icon\n              )}\n            </LanguageSupportTooltip>\n          );\n        })}\n    </>\n  );\n};\n","import type { FunctionComponent } from \"react\";\nimport { PackageLanguages } from \"../PackageLanguages\";\nimport { usePackageCard } from \"./PackageCard\";\n\nexport const Languages: FunctionComponent = () => {\n  const pkg = usePackageCard();\n  return <PackageLanguages {...pkg} size=\"sm\" />;\n};\n","import { Grid, Stack, LinkBox } from \"@chakra-ui/react\";\nimport { FunctionComponent } from \"react\";\nimport { Details } from \"./Details\";\nimport { Heading } from \"./Heading\";\nimport { Languages } from \"./Languages\";\nimport testIds from \"./testIds\";\n\nexport const WideCard: FunctionComponent = () => {\n  return (\n    <LinkBox\n      _hover={{\n        \"> article\": {\n          bg: \"gray.50\",\n        },\n      }}\n    >\n      <Grid\n        as=\"article\"\n        bg=\"white\"\n        border=\"base\"\n        borderRadius=\"sm\"\n        color=\"gray.600\"\n        data-testid={testIds.wideContainer}\n        gap={5}\n        p={5}\n        templateColumns={{ base: \"1fr\", md: \"2fr 1fr\" }}\n        templateRows={{ base: \"auto\", md: \"1fr\" }}\n        w=\"100%\"\n      >\n        {/* Name + Desc */}\n        <Stack spacing={2}>\n          <Heading />\n\n          <Stack direction=\"row\" spacing={1}>\n            <Languages />\n          </Stack>\n        </Stack>\n\n        <Stack\n          alignSelf=\"center\"\n          data-testid={testIds.languages}\n          fontSize=\"xs\"\n          spacing={1}\n        >\n          <Details />\n        </Stack>\n      </Grid>\n    </LinkBox>\n  );\n};\n","import { createContext, FunctionComponent, useContext } from \"react\";\nimport { CatalogPackage } from \"../../api/package/packages\";\nimport { PackageCardType } from \"./constants\";\nimport { WideCard } from \"./WideCard\";\n\nexport interface PackageCardProps {\n  pkg: CatalogPackage;\n  variant?: PackageCardType;\n}\n\nconst PackageCardContext = createContext<\n  (CatalogPackage & { comment?: string }) | null\n>(null);\n\nexport const usePackageCard = () => useContext(PackageCardContext)!;\n\nexport const PackageCard: FunctionComponent<PackageCardProps> = ({\n  pkg,\n  variant = PackageCardType.Wide,\n}) => {\n  return (\n    <PackageCardContext.Provider value={pkg}>\n      {variant === PackageCardType.Wide && <WideCard />}\n    </PackageCardContext.Provider>\n  );\n};\n","import { Center, Spinner } from \"@chakra-ui/react\";\nimport { FunctionComponent, memo } from \"react\";\nimport { CatalogPackage } from \"../../api/package/packages\";\nimport { PackageCardType } from \"../PackageCard\";\nimport { WideCardList } from \"./WideCardList\";\n\nconst listViews = {\n  [PackageCardType.Wide]: WideCardList,\n};\n\nexport interface PackageListViewProps {\n  items: CatalogPackage[];\n}\n\nexport interface PackageListProps extends Partial<PackageListViewProps> {\n  cardView?: PackageCardType;\n  loading?: boolean;\n  title?: string;\n}\n\nexport const PackageList: FunctionComponent<PackageListProps> = memo(\n  ({\n    cardView = PackageCardType.Wide,\n    items,\n    loading,\n    // title,\n  }) => {\n    if (loading || !items) {\n      return (\n        <Center>\n          <Spinner size=\"xl\" />\n        </Center>\n      );\n    }\n\n    const View = listViews[cardView];\n\n    return <View items={items} />;\n  }\n);\n\nPackageList.displayName = \"PackageList\";\n","import { Stack } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { PackageCard, PackageCardType } from \"../PackageCard\";\nimport { PackageListViewProps } from \"./PackageList\";\n\nexport const WideCardList: FunctionComponent<PackageListViewProps> = ({\n  items,\n}) => {\n  return (\n    <Stack spacing={4}>\n      {items.map((pkg) => (\n        <PackageCard\n          key={`${pkg.name}-${pkg.version}`}\n          pkg={pkg}\n          variant={PackageCardType.Wide}\n        />\n      ))}\n    </Stack>\n  );\n};\n","import {\n  chakra,\n  PropsOf,\n  SystemProps,\n  forwardRef,\n  HTMLChakraProps,\n} from \"@chakra-ui/system\"\nimport { omit, __DEV__ } from \"@chakra-ui/utils\"\nimport * as React from \"react\"\nimport { useImage, UseImageProps } from \"./use-image\"\n\ninterface NativeImageOptions {\n  /**\n   * The native HTML `width` attribute to the passed to the `img`\n   */\n  htmlWidth?: string | number\n  /**\n   * The native HTML `height` attribute to the passed to the `img`\n   */\n  htmlHeight?: string | number\n}\n\ninterface NativeImageProps extends PropsOf<\"img\">, NativeImageOptions {}\n\nconst NativeImage = React.forwardRef(\n  (props: NativeImageProps, ref: React.Ref<any>) => {\n    const { htmlWidth, htmlHeight, alt, ...rest } = props\n    return (\n      <img\n        width={htmlWidth}\n        height={htmlHeight}\n        ref={ref}\n        alt={alt}\n        {...rest}\n      />\n    )\n  },\n)\n\ninterface ImageOptions extends NativeImageOptions {\n  /**\n   * Fallback image `src` to show if image is loading or image fails.\n   *\n   * Note 🚨: We recommend you use a local image\n   */\n  fallbackSrc?: string\n  /**\n   * Fallback element to show if image is loading or image fails.\n   * @type React.ReactElement\n   */\n  fallback?: React.ReactElement\n  /**\n   * Defines loading strategy\n   */\n  loading?: \"eager\" | \"lazy\"\n  /**\n   * How the image to fit within its bounds.\n   * It maps to css `object-fit` property.\n   * @type SystemProps[\"objectFit\"]\n   */\n  fit?: SystemProps[\"objectFit\"]\n  /**\n   * How to align the image within its bounds.\n   * It maps to css `object-position` property.\n   * @type SystemProps[\"objectPosition\"]\n   */\n  align?: SystemProps[\"objectPosition\"]\n  /**\n   * If `true`, opt out of the `fallbackSrc` logic and use as `img`\n   */\n  ignoreFallback?: boolean\n}\n\nexport interface ImageProps\n  extends UseImageProps,\n    Omit<HTMLChakraProps<\"img\">, keyof UseImageProps>,\n    ImageOptions {}\n\n/**\n * React component that renders an image with support\n * for fallbacks\n *\n * @see Docs https://chakra-ui.com/image\n */\nexport const Image = forwardRef<ImageProps, \"img\">((props, ref) => {\n  const {\n    fallbackSrc,\n    fallback,\n    src,\n    srcSet,\n    align,\n    fit,\n    loading,\n    ignoreFallback,\n    crossOrigin,\n    ...rest\n  } = props\n\n  /**\n   * Defer to native `img` tag if `loading` prop is passed\n   * @see https://github.com/chakra-ui/chakra-ui/issues/1027\n   */\n  const shouldIgnore =\n    loading != null ||\n    ignoreFallback ||\n    (fallbackSrc === undefined && fallback === undefined) // if the user doesn't provide any kind of fallback we should ignore it\n\n  const status = useImage({\n    ...props,\n    ignoreFallback: shouldIgnore,\n  })\n\n  const shared = {\n    ref,\n    objectFit: fit,\n    objectPosition: align,\n    ...(shouldIgnore ? rest : omit(rest, [\"onError\", \"onLoad\"])),\n  }\n\n  if (status !== \"loaded\") {\n    /**\n     * If user passed a custom fallback component,\n     * let's render it here.\n     */\n    if (fallback) return fallback\n\n    return (\n      <chakra.img\n        as={NativeImage}\n        className=\"chakra-image__placeholder\"\n        src={fallbackSrc}\n        {...shared}\n      />\n    )\n  }\n\n  return (\n    <chakra.img\n      as={NativeImage}\n      src={src}\n      srcSet={srcSet}\n      crossOrigin={crossOrigin}\n      loading={loading}\n      className=\"chakra-image\"\n      {...shared}\n    />\n  )\n})\n\nexport interface ImgProps extends HTMLChakraProps<\"img\">, NativeImageOptions {}\n\n/**\n * Fallback component for most SSR users who want to use the native `img` with\n * support for chakra props\n */\nexport const Img = forwardRef<ImgProps, \"img\">((props, ref) => (\n  <chakra.img ref={ref} as={NativeImage} className=\"chakra-image\" {...props} />\n))\n\nif (__DEV__) {\n  Image.displayName = \"Image\"\n}\n","import { useSafeLayoutEffect } from \"@chakra-ui/hooks\"\nimport {\n  ImgHTMLAttributes,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\"\n\ntype NativeImageProps = ImgHTMLAttributes<HTMLImageElement>\n\nexport interface UseImageProps {\n  /**\n   * The image `src` attribute\n   */\n  src?: string\n  /**\n   * The image `srcset` attribute\n   */\n  srcSet?: string\n  /**\n   * The image `sizes` attribute\n   */\n  sizes?: string\n  /**\n   * A callback for when the image `src` has been loaded\n   */\n  onLoad?: NativeImageProps[\"onLoad\"]\n  /**\n   * A callback for when there was an error loading the image `src`\n   */\n  onError?: NativeImageProps[\"onError\"]\n  /**\n   * If `true`, opt out of the `fallbackSrc` logic and use as `img`\n   */\n  ignoreFallback?: boolean\n  /**\n   * The key used to set the crossOrigin on the HTMLImageElement into which the image will be loaded.\n   * This tells the browser to request cross-origin access when trying to download the image data.\n   */\n  crossOrigin?: NativeImageProps[\"crossOrigin\"]\n  loading?: NativeImageProps[\"loading\"]\n}\n\ntype Status = \"loading\" | \"failed\" | \"pending\" | \"loaded\"\n\ntype ImageEvent = React.SyntheticEvent<HTMLImageElement, Event>\n\n/**\n * React hook that loads an image in the browser,\n * and let's us know the `status` so we can show image\n * fallback if it is still `pending`\n *\n * @returns the status of the image loading progress\n *\n * @example\n *\n * ```jsx\n * function App(){\n *   const status = useImage({ src: \"image.png\" })\n *   return status === \"loaded\" ? <img src=\"image.png\" /> : <Placeholder />\n * }\n * ```\n */\nexport function useImage(props: UseImageProps) {\n  const {\n    loading,\n    src,\n    srcSet,\n    onLoad,\n    onError,\n    crossOrigin,\n    sizes,\n    ignoreFallback,\n  } = props\n\n  const [status, setStatus] = useState<Status>(\"pending\")\n\n  useEffect(() => {\n    setStatus(src ? \"loading\" : \"pending\")\n  }, [src])\n\n  const imageRef = useRef<HTMLImageElement | null>()\n\n  const load = useCallback(() => {\n    if (!src) return\n\n    flush()\n\n    const img = new Image()\n    img.src = src\n    if (crossOrigin) img.crossOrigin = crossOrigin\n    if (srcSet) img.srcset = srcSet\n    if (sizes) img.sizes = sizes\n    if (loading) img.loading = loading\n\n    img.onload = (event) => {\n      flush()\n      setStatus(\"loaded\")\n      onLoad?.((event as unknown) as ImageEvent)\n    }\n    img.onerror = (error) => {\n      flush()\n      setStatus(\"failed\")\n      onError?.(error as any)\n    }\n\n    imageRef.current = img\n  }, [src, crossOrigin, srcSet, sizes, onLoad, onError, loading])\n\n  const flush = () => {\n    if (imageRef.current) {\n      imageRef.current.onload = null\n      imageRef.current.onerror = null\n      imageRef.current = null\n    }\n  }\n\n  useSafeLayoutEffect(() => {\n    /**\n     * If user opts out of the fallback/placeholder\n     * logic, let's bail out.\n     */\n    if (ignoreFallback) return undefined\n\n    if (status === \"loading\") {\n      load()\n    }\n    return () => {\n      flush()\n    }\n  }, [status, load, ignoreFallback])\n\n  /**\n   * If user opts out of the fallback/placeholder\n   * logic, let's just return 'loaded'\n   */\n  return ignoreFallback ? \"loaded\" : status\n}\n\nexport type UseImageReturn = ReturnType<typeof useImage>\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 {\n  chakra,\n  forwardRef,\n  omitThemingProps,\n  StylesProvider,\n  ThemingProps,\n  useMultiStyleConfig,\n  HTMLChakraProps,\n} from \"@chakra-ui/system\"\nimport { cx, __DEV__ } from \"@chakra-ui/utils\"\nimport { getValidChildren } from \"@chakra-ui/react-utils\"\nimport * as React from \"react\"\n\nexport interface InputGroupProps\n  extends HTMLChakraProps<\"div\">,\n    ThemingProps<\"Input\"> {}\n\nexport const InputGroup = forwardRef<InputGroupProps, \"div\">((props, ref) => {\n  const styles = useMultiStyleConfig(\"Input\", props)\n  const { children, className, ...rest } = omitThemingProps(props)\n\n  const _className = cx(\"chakra-input__group\", className)\n  const groupStyles: InputGroupProps = {}\n\n  const validChildren = getValidChildren(children)\n\n  const input: any = styles.field\n\n  validChildren.forEach((child: any) => {\n    if (!styles) return\n\n    if (input && child.type.id === \"InputLeftElement\") {\n      groupStyles.paddingStart = input.height ?? input.h\n    }\n\n    if (input && child.type.id === \"InputRightElement\") {\n      groupStyles.paddingEnd = input.height ?? input.h\n    }\n\n    if (child.type.id === \"InputRightAddon\") {\n      groupStyles.borderEndRadius = 0\n    }\n\n    if (child.type.id === \"InputLeftAddon\") {\n      groupStyles.borderStartRadius = 0\n    }\n  })\n\n  const clones = validChildren.map((child: any) => {\n    /**\n     * Make it possible to override the size and variant from `Input`\n     */\n    const theming = {\n      size: child.props?.size || props.size,\n      variant: child.props?.variant || props.variant,\n    }\n\n    return child.type.id !== \"Input\"\n      ? React.cloneElement(child, theming)\n      : React.cloneElement(\n          child,\n          Object.assign(theming, groupStyles, child.props),\n        )\n  })\n\n  return (\n    <chakra.div\n      className={_className}\n      ref={ref}\n      __css={{\n        width: \"100%\",\n        display: \"flex\",\n        position: \"relative\",\n      }}\n      {...rest}\n    >\n      <StylesProvider value={styles}>{clones}</StylesProvider>\n    </chakra.div>\n  )\n})\n\nif (__DEV__) {\n  InputGroup.displayName = \"InputGroup\"\n}\n","import {\n  chakra,\n  forwardRef,\n  SystemStyleObject,\n  useStyles,\n  HTMLChakraProps,\n} from \"@chakra-ui/system\"\nimport { cx, __DEV__ } from \"@chakra-ui/utils\"\nimport * as React from \"react\"\n\nexport interface InputElementProps extends HTMLChakraProps<\"div\"> {\n  placement?: \"left\" | \"right\"\n}\n\nconst StyledElement = chakra(\"div\", {\n  baseStyle: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    position: \"absolute\",\n    top: \"0\",\n    zIndex: 2,\n  },\n})\n\nconst InputElement = forwardRef<InputElementProps, \"div\">((props, ref) => {\n  const { placement = \"left\", ...rest } = props\n\n  const styles = useStyles()\n  const input: any = styles.field\n\n  const attr = placement === \"left\" ? \"insetStart\" : \"insetEnd\"\n\n  const elementStyles: SystemStyleObject = {\n    [attr]: \"0\",\n    width: input?.height ?? input?.h,\n    height: input?.height ?? input?.h,\n    fontSize: input?.fontSize,\n  }\n\n  return <StyledElement ref={ref} __css={elementStyles} {...rest} />\n})\n\n// This is used in `input-group.tsx`\nInputElement.id = \"InputElement\"\n\nif (__DEV__) {\n  InputElement.displayName = \"InputElement\"\n}\n\nexport const InputLeftElement = forwardRef<InputElementProps, \"div\">(\n  (props, ref) => {\n    const { className, ...rest } = props\n    const _className = cx(\"chakra-input__left-element\", className)\n\n    return (\n      <InputElement\n        ref={ref}\n        placement=\"left\"\n        className={_className}\n        {...rest}\n      />\n    )\n  },\n)\n\n// This is used in `input-group.tsx`\nInputLeftElement.id = \"InputLeftElement\"\n\nif (__DEV__) {\n  InputLeftElement.displayName = \"InputLeftElement\"\n}\n\nexport const InputRightElement = forwardRef<InputElementProps, \"div\">(\n  (props, ref) => {\n    const { className, ...rest } = props\n    const _className = cx(\"chakra-input__right-element\", className)\n\n    return (\n      <InputElement\n        ref={ref}\n        placement=\"right\"\n        className={_className}\n        {...rest}\n      />\n    )\n  },\n)\n\n// This is used in `input-group.tsx`\nInputRightElement.id = \"InputRightElement\"\n\nif (__DEV__) {\n  InputRightElement.displayName = \"InputRightElement\"\n}\n","import { SearchIcon } from \"@chakra-ui/icons\";\nimport {\n  Box,\n  Flex,\n  Heading,\n  Input,\n  InputGroup,\n  InputRightElement,\n  Link,\n  Stack,\n} from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Form } from \"../../components/Form\";\n\n// All elements are currently static / have no real interactions\nexport const Hero: FunctionComponent = () => {\n  return (\n    <Flex\n      align=\"center\"\n      bg=\"blue.800\"\n      color=\"white\"\n      direction=\"column\"\n      justify=\"center\"\n      py={12}\n    >\n      <Heading as=\"h1\" size=\"xl\">\n        Build cloud infrastructure with reusable components\n      </Heading>\n      <Heading as=\"h2\" mt={2} size=\"lg\">\n        Provided by the{\" \"}\n        <Box as=\"span\" color=\"yellow.400\">\n          community\n        </Box>\n        , backed by{\" \"}\n        <Box as=\"span\" color=\"yellow.400\">\n          AWS\n        </Box>\n        .\n      </Heading>\n      <Flex direction=\"column\" mt={8}>\n        <Stack direction=\"row\" spacing={7}>\n          <Link borderBottom=\"1px solid\" borderBottomColor=\"yellow.400\">\n            All CDKs\n          </Link>\n          <Link>AWS CDK</Link>\n          <Link>CDK for Terraform</Link>\n          <Link>CDK for Kubernetes</Link>\n        </Stack>\n        <Form mt={4}>\n          <InputGroup>\n            <Input\n              bg=\"white\"\n              placeholder=\"Search over 600 construct libraries for all CDKS\"\n              variant=\"filled\"\n            />\n            <InputRightElement>\n              <SearchIcon color=\"gray.500\" />\n            </InputRightElement>\n          </InputGroup>\n        </Form>\n      </Flex>\n    </Flex>\n  );\n};\n","import { Heading } from \"@chakra-ui/react\";\nimport { Fragment, FunctionComponent, useMemo } from \"react\";\nimport { CatalogSearchSort } from \"../../api/catalog-search/constants\";\nimport { SORT_FUNCTIONS } from \"../../api/catalog-search/util\";\nimport { FeaturedPackagesDetail } from \"../../api/config\";\nimport type { CatalogPackage } from \"../../api/package/packages\";\nimport { findPackage } from \"../../api/package/util\";\nimport { PackageList } from \"../../components/PackageList\";\nimport { useCatalog } from \"../../contexts/Catalog\";\n\nexport interface HomeSectionProps {\n  name: string;\n  showLastUpdated?: number;\n  showPackages?: FeaturedPackagesDetail[];\n}\n\nexport const HomeSection: FunctionComponent<HomeSectionProps> = ({\n  name,\n  showLastUpdated,\n  showPackages,\n}) => {\n  const { data, loading, error } = useCatalog();\n\n  const results = useMemo(() => {\n    if (loading || error || !data?.packages) return [];\n\n    if (showLastUpdated) {\n      return data.packages\n        .sort(SORT_FUNCTIONS[CatalogSearchSort.PublishDateDesc])\n        .slice(0, showLastUpdated);\n    } else if (showPackages) {\n      return showPackages\n        .map((p) => {\n          const pkg = findPackage(data, p.name);\n          if (pkg) {\n            return {\n              ...pkg,\n              comment: p.comment,\n            };\n          }\n          return undefined;\n        })\n        .filter((pkg) => pkg !== undefined) as CatalogPackage[];\n    } else {\n      return undefined;\n    }\n  }, [data, error, loading, showLastUpdated, showPackages]);\n\n  if (!results) {\n    console.warn(\n      \"config.json is invalid - a section must specify showLastUpdated or showPackages.\"\n    );\n    return null;\n  }\n\n  return (\n    <Fragment>\n      <Heading as=\"h3\" color=\"blue.800\" my=\"4\" size=\"md\">\n        {name}\n      </Heading>\n\n      <PackageList items={results} loading={loading} />\n    </Fragment>\n  );\n};\n","import { Heading, Stack, Text } from \"@chakra-ui/react\";\nimport type { FunctionComponent, ReactNode } from \"react\";\n\nexport interface InfoSectionProps {\n  title: string;\n  description: ReactNode;\n}\n\nexport const InfoSection: FunctionComponent<InfoSectionProps> = ({\n  title,\n  description,\n  children,\n}) => (\n  <Stack color=\"blue.800\" spacing={4}>\n    <Heading as=\"h3\" size=\"md\">\n      {title}\n    </Heading>\n    <Text size=\"sm\">{description}</Text>\n    {children}\n  </Stack>\n);\n","import { Flex, Divider, Stack } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Card } from \"../../components/Card\";\nimport { Picture } from \"../../components/Picture\";\nimport { InfoSection } from \"./InfoSection\";\n\nexport const InfoPanel: FunctionComponent = () => {\n  return (\n    <Card borderRadius=\"none\" boxShadow=\"none\" h=\"full\" p={8}>\n      <Stack spacing={8}>\n        <InfoSection\n          description={\n            <>\n              The construct hub is a{\" \"}\n              <strong>\n                central destination to discover and share cloud application\n                design patterns and reference architectures\n              </strong>{\" \"}\n              defined for the AWS CDK, CDK for Kubernetes (CDK8s), CDK for\n              Terraform (CDKtf) and any other construct-based tool.\n            </>\n          }\n          title=\"What is Construct Hub?\"\n        >\n          <Flex\n            align=\"center\"\n            justifyItems=\"start\"\n            sx={{\n              \"& > *\": {\n                mt: 4,\n                mr: 4,\n              },\n            }}\n            wrap=\"wrap\"\n          >\n            <Picture alt=\"AWS CDK logo\" src=\"/assets/aws-cdk.png\" />\n            <Picture alt=\"Terraform logo\" src=\"/assets/terraform.png\" />\n            <Picture alt=\"Kubernetes logo\" src=\"/assets/kubernetes.png\" />\n          </Flex>\n        </InfoSection>\n        <Divider />\n        <InfoSection\n          description={\n            <>\n              Constructs are <strong>cloud building blocks</strong> introduced\n              by the Constructs Programming Model (CPM) that can be{\" \"}\n              <strong>\n                used to assemble complete applications of any complexity.\n              </strong>{\" \"}\n              AWS, enterprises, start-ups, and individual developers use CDK\n              constructs to share proven architecture patterns as reusable code\n              libraries, so that everyone can benefit from the collective wisdom\n              of the community.\n            </>\n          }\n          title=\"What is a construct?\"\n        />\n        <Divider />\n        <InfoSection\n          description={\n            <>\n              Construct Hub is built to <strong>serve the community</strong>{\" \"}\n              that uses the constructs programming model (CPM) and to allow them{\" \"}\n              <strong>\n                find publicly available constructs they can reuse.\n              </strong>{\" \"}\n              Before the Construct Hub, developers did not have an easy way to\n              discover construct libraries created by the community since they\n              were published across various package managers and without a\n              central index.\n            </>\n          }\n          title=\"Why should I use this?\"\n        />\n      </Stack>\n    </Card>\n  );\n};\n","import { Flex, Grid } from \"@chakra-ui/react\";\nimport { FunctionComponent } from \"react\";\nimport { DEFAULT_FEATURED_PACKAGES } from \"../../api/config\";\nimport { Page } from \"../../components/Page\";\nimport { useConfigValue } from \"../../hooks/useConfigValue\";\nimport { Hero } from \"./Hero\";\nimport { HomeSection } from \"./HomeSection\";\nimport { InfoPanel } from \"./InfoPanel\";\n\nexport const HomeRedesign: FunctionComponent = () => {\n  const homePackages = useConfigValue(\"featuredPackages\");\n  const sections = (homePackages ?? DEFAULT_FEATURED_PACKAGES).sections;\n\n  return (\n    <Page\n      meta={{\n        title: \"Construct Hub\",\n        description:\n          \"Construct Hub helps developers find open-source construct libraries for use with AWS CDK, CDK8s, CDKTf and other construct-based tools.\",\n        suffix: false,\n      }}\n      pageName=\"home\"\n    >\n      <Flex direction=\"column\">\n        <Hero />\n        <Grid\n          gap={3}\n          h=\"full\"\n          p={3}\n          pl={12}\n          templateColumns=\"2fr 1fr\"\n          templateRows=\"1fr\"\n        >\n          <Flex direction=\"column\">\n            {sections.map((section) => (\n              <HomeSection key={section.name} {...section}></HomeSection>\n            ))}\n          </Flex>\n          <InfoPanel />\n        </Grid>\n      </Flex>\n    </Page>\n  );\n};\n","import type { Config } from \"../../api/config\";\nimport { useConfig } from \"../../contexts/Config\";\n\nexport const useConfigValue = <T extends keyof Config>(key: T) => {\n  const { data } = useConfig();\n  return (data ?? {})[key];\n};\n"],"sourceRoot":""}

package/build/static/js/11.4fa20ae6.chunk.js

@@ -1,2 +0,0 @@
-(this["webpackJsonpconstruct-hub-webapp"]=this["webpackJsonpconstruct-hub-webapp"]||[]).push([[11],{233:function(e,t,n){"use strict";n.d(t,"a",(function(){return s}));var a=n(0),r=n(246),c={home:{event:{name:"Home Load"}},faq:{event:{name:"Frequently Asked Questions Load"}},packageProfile:{event:{name:"Package Profile Load"}},search:{event:{name:"Search Load"}},siteTerms:{event:{name:"Site Terms Load"}},notFound:{page:{pageType:"errorPage"},event:{name:"404 Page Load"}}},i=n(118),o=n(1),s=function(e){var t=e.children,n=e.meta,s=e.pageName,l=Object(i.b)(c[s]);Object(a.useEffect)((function(){l()}),[l]);var u=n.suffix,d=void 0===u||u,b=n.title,m=n.description,f=d?"".concat(b," - Construct Hub"):b;return Object(o.jsxs)(o.Fragment,{children:[Object(o.jsxs)(r.a,{children:[!1,Object(o.jsx)("meta",{content:"width=device-width, initial-scale=1",name:"viewport"}),Object(o.jsx)("meta",{charSet:"utf-8"}),Object(o.jsx)("title",{children:f}),Object(o.jsx)("meta",{content:f,property:"og:title"}),Object(o.jsx)("meta",{content:f,name:"twitter:title"}),Object(o.jsx)("meta",{content:"summary",name:"twitter:card"}),Object(o.jsx)("meta",{content:m,name:"description"}),Object(o.jsx)("meta",{content:m,property:"og:description"}),Object(o.jsx)("meta",{content:m,name:"twitter:description"})]}),t]})}},250:function(e,t,n){"use strict";n.d(t,"a",(function(){return u}));var a=n(6),r=n(23),c=n(19),i=n(195),o=n(301),s=n(1),l=["sources"],u=Object(c.a)((function(e,t){var n=e.sources,c=Object(r.a)(e,l);return Object(s.jsxs)(i.a,{as:"picture",children:[null===n||void 0===n?void 0:n.map((function(e,t){return Object(s.jsx)("source",{media:e.media,srcSet:e.srcSet},t)})),Object(s.jsx)(o.a,Object(a.a)({ref:t},c))]})}));u.displayName="Picture"},275:function(e,t,n){"use strict";n.r(t),n.d(t,"NotFound",(function(){return d})),n.d(t,"default",(function(){return d}));var a=n(216),r=n(208),c=n(154),i=n(29),o=n(233),s=n(250),l=n(1),u={optimal:[{media:"(max-width:1024px)",srcSet:"/assets/404-hive@50.webp"},{media:"(min-width:1024px)",srcSet:"/assets/404-hive@100.webp"},{media:"(min-width:1024px)",srcSet:"/assets/404-hive@100.png"}],fallback:"/assets/404-hive@50.png"},d=function(){return Object(l.jsx)(o.a,{meta:{title:"Not Found",description:"Oops! The page you were looking for does not exist"},pageName:"notFound",children:Object(l.jsxs)(a.a,{h:"100%",position:"relative",w:"100%",children:[Object(l.jsx)(s.a,{alt:"",inset:0,position:"absolute",sources:u.optimal,src:u.fallback,zIndex:"hide"}),Object(l.jsxs)(r.a,{align:"center",direction:"column",justify:"center",children:[Object(l.jsx)(s.a,{alt:"404 Image",sources:[{srcSet:"/assets/robot.webp"}],src:"/assets/robot.png"}),Object(l.jsx)(c.a,{as:i.b,colorScheme:"blue",to:"/",children:"Take Me Home"})]})]})})}},301:function(e,t,n){"use strict";n.d(t,"a",(function(){return m}));var a=n(19),r=n(22),c=n(26),i=n(8),o=n(0),s=n(5),l=n(145);function u(){return u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},u.apply(this,arguments)}function d(e,t){if(null==e)return{};var n,a,r={},c=Object.keys(e);for(a=0;a<c.length;a++)n=c[a],t.indexOf(n)>=0||(r[n]=e[n]);return r}var b=o.forwardRef((function(e,t){var n=e.htmlWidth,a=e.htmlHeight,r=e.alt,c=d(e,["htmlWidth","htmlHeight","alt"]);return o.createElement("img",u({width:n,height:a,ref:t,alt:r},c))})),m=Object(a.a)((function(e,t){var n=e.fallbackSrc,a=e.fallback,i=e.src,m=e.srcSet,f=e.align,j=e.fit,g=e.loading,p=e.ignoreFallback,h=e.crossOrigin,O=d(e,["fallbackSrc","fallback","src","srcSet","align","fit","loading","ignoreFallback","crossOrigin"]),v=null!=g||p||void 0===n&&void 0===a,x=function(e){var t=e.loading,n=e.src,a=e.srcSet,r=e.onLoad,c=e.onError,i=e.crossOrigin,u=e.sizes,d=e.ignoreFallback,b=Object(o.useState)("pending"),m=Object(s.a)(b,2),f=m[0],j=m[1];Object(o.useEffect)((function(){j(n?"loading":"pending")}),[n]);var g=Object(o.useRef)(),p=Object(o.useCallback)((function(){if(n){h();var e=new Image;e.src=n,i&&(e.crossOrigin=i),a&&(e.srcset=a),u&&(e.sizes=u),t&&(e.loading=t),e.onload=function(e){h(),j("loaded"),null==r||r(e)},e.onerror=function(e){h(),j("failed"),null==c||c(e)},g.current=e}}),[n,i,a,u,r,c,t]),h=function(){g.current&&(g.current.onload=null,g.current.onerror=null,g.current=null)};return Object(l.a)((function(){if(!d)return"loading"===f&&p(),function(){h()}}),[f,p,d]),d?"loaded":f}(u({},e,{ignoreFallback:v})),w=u({ref:t,objectFit:j,objectPosition:f},v?O:Object(c.g)(O,["onError","onLoad"]));return"loaded"!==x?a||o.createElement(r.a.img,u({as:b,className:"chakra-image__placeholder",src:n},w)):o.createElement(r.a.img,u({as:b,src:i,srcSet:m,crossOrigin:h,loading:g,className:"chakra-image"},w))}));i.a&&(m.displayName="Image")}}]);
-//# sourceMappingURL=11.4fa20ae6.chunk.js.map

package/build/static/js/11.4fa20ae6.chunk.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["constants/pageInfo.ts","components/Page/Page.tsx","components/Picture/Picture.tsx","views/NotFound/NotFound.tsx","../../../src/image.tsx","../../../src/use-image.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","Picture","forwardRef","ref","sources","props","as","map","source","idx","media","srcSet","displayName","bgSources","optimal","fallback","NotFound","h","position","w","alt","inset","src","zIndex","align","direction","justify","Link","colorScheme","to","NativeImage","width","height","Image","crossOrigin","shouldIgnore","loading","fallbackSrc","status","ignoreFallback","useState","setStatus","imageRef","useRef","load","useCallback","flush","img","onLoad","error","onError","sizes","useSafeLayoutEffect","useImage","shared","objectFit","objectPosition","rest","omit","className"],"mappings":"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","file":"static/js/11.4fa20ae6.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","import { Box, HTMLChakraProps, forwardRef, Image } from \"@chakra-ui/react\";\n\nexport interface PictureProps extends HTMLChakraProps<\"img\"> {\n  alt: string;\n  src: string;\n  sources?: {\n    media?: string;\n    srcSet: string;\n  }[];\n}\n\nexport const Picture = forwardRef<PictureProps, \"img\">(\n  ({ sources, ...props }, ref) => (\n    <Box as=\"picture\">\n      {sources?.map((source, idx) => (\n        <source key={idx} media={source.media} srcSet={source.srcSet} />\n      ))}\n      <Image ref={ref} {...props} />\n    </Box>\n  )\n);\n\nPicture.displayName = \"Picture\";\n","import { Button, Center, Flex } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport { Page } from \"../../components/Page\";\nimport { Picture } from \"../../components/Picture\";\n\nconst bgSources = {\n  optimal: [\n    { media: \"(max-width:1024px)\", srcSet: \"/assets/404-hive@50.webp\" },\n    { media: \"(min-width:1024px)\", srcSet: \"/assets/404-hive@100.webp\" },\n    { media: \"(min-width:1024px)\", srcSet: \"/assets/404-hive@100.png\" },\n  ],\n  fallback: \"/assets/404-hive@50.png\",\n};\n\nexport const NotFound: FunctionComponent = () => {\n  return (\n    <Page\n      meta={{\n        title: \"Not Found\",\n        description: \"Oops! The page you were looking for does not exist\",\n      }}\n      pageName=\"notFound\"\n    >\n      <Center h=\"100%\" position=\"relative\" w=\"100%\">\n        <Picture\n          alt=\"\"\n          inset={0}\n          position=\"absolute\"\n          sources={bgSources.optimal}\n          src={bgSources.fallback}\n          zIndex=\"hide\"\n        />\n        <Flex align=\"center\" direction=\"column\" justify=\"center\">\n          <Picture\n            alt=\"404 Image\"\n            sources={[{ srcSet: \"/assets/robot.webp\" }]}\n            src=\"/assets/robot.png\"\n          />\n          <Button as={Link} colorScheme=\"blue\" to=\"/\">\n            Take Me Home\n          </Button>\n        </Flex>\n      </Center>\n    </Page>\n  );\n};\n","import {\n  chakra,\n  PropsOf,\n  SystemProps,\n  forwardRef,\n  HTMLChakraProps,\n} from \"@chakra-ui/system\"\nimport { omit, __DEV__ } from \"@chakra-ui/utils\"\nimport * as React from \"react\"\nimport { useImage, UseImageProps } from \"./use-image\"\n\ninterface NativeImageOptions {\n  /**\n   * The native HTML `width` attribute to the passed to the `img`\n   */\n  htmlWidth?: string | number\n  /**\n   * The native HTML `height` attribute to the passed to the `img`\n   */\n  htmlHeight?: string | number\n}\n\ninterface NativeImageProps extends PropsOf<\"img\">, NativeImageOptions {}\n\nconst NativeImage = React.forwardRef(\n  (props: NativeImageProps, ref: React.Ref<any>) => {\n    const { htmlWidth, htmlHeight, alt, ...rest } = props\n    return (\n      <img\n        width={htmlWidth}\n        height={htmlHeight}\n        ref={ref}\n        alt={alt}\n        {...rest}\n      />\n    )\n  },\n)\n\ninterface ImageOptions extends NativeImageOptions {\n  /**\n   * Fallback image `src` to show if image is loading or image fails.\n   *\n   * Note 🚨: We recommend you use a local image\n   */\n  fallbackSrc?: string\n  /**\n   * Fallback element to show if image is loading or image fails.\n   * @type React.ReactElement\n   */\n  fallback?: React.ReactElement\n  /**\n   * Defines loading strategy\n   */\n  loading?: \"eager\" | \"lazy\"\n  /**\n   * How the image to fit within its bounds.\n   * It maps to css `object-fit` property.\n   * @type SystemProps[\"objectFit\"]\n   */\n  fit?: SystemProps[\"objectFit\"]\n  /**\n   * How to align the image within its bounds.\n   * It maps to css `object-position` property.\n   * @type SystemProps[\"objectPosition\"]\n   */\n  align?: SystemProps[\"objectPosition\"]\n  /**\n   * If `true`, opt out of the `fallbackSrc` logic and use as `img`\n   */\n  ignoreFallback?: boolean\n}\n\nexport interface ImageProps\n  extends UseImageProps,\n    Omit<HTMLChakraProps<\"img\">, keyof UseImageProps>,\n    ImageOptions {}\n\n/**\n * React component that renders an image with support\n * for fallbacks\n *\n * @see Docs https://chakra-ui.com/image\n */\nexport const Image = forwardRef<ImageProps, \"img\">((props, ref) => {\n  const {\n    fallbackSrc,\n    fallback,\n    src,\n    srcSet,\n    align,\n    fit,\n    loading,\n    ignoreFallback,\n    crossOrigin,\n    ...rest\n  } = props\n\n  /**\n   * Defer to native `img` tag if `loading` prop is passed\n   * @see https://github.com/chakra-ui/chakra-ui/issues/1027\n   */\n  const shouldIgnore =\n    loading != null ||\n    ignoreFallback ||\n    (fallbackSrc === undefined && fallback === undefined) // if the user doesn't provide any kind of fallback we should ignore it\n\n  const status = useImage({\n    ...props,\n    ignoreFallback: shouldIgnore,\n  })\n\n  const shared = {\n    ref,\n    objectFit: fit,\n    objectPosition: align,\n    ...(shouldIgnore ? rest : omit(rest, [\"onError\", \"onLoad\"])),\n  }\n\n  if (status !== \"loaded\") {\n    /**\n     * If user passed a custom fallback component,\n     * let's render it here.\n     */\n    if (fallback) return fallback\n\n    return (\n      <chakra.img\n        as={NativeImage}\n        className=\"chakra-image__placeholder\"\n        src={fallbackSrc}\n        {...shared}\n      />\n    )\n  }\n\n  return (\n    <chakra.img\n      as={NativeImage}\n      src={src}\n      srcSet={srcSet}\n      crossOrigin={crossOrigin}\n      loading={loading}\n      className=\"chakra-image\"\n      {...shared}\n    />\n  )\n})\n\nexport interface ImgProps extends HTMLChakraProps<\"img\">, NativeImageOptions {}\n\n/**\n * Fallback component for most SSR users who want to use the native `img` with\n * support for chakra props\n */\nexport const Img = forwardRef<ImgProps, \"img\">((props, ref) => (\n  <chakra.img ref={ref} as={NativeImage} className=\"chakra-image\" {...props} />\n))\n\nif (__DEV__) {\n  Image.displayName = \"Image\"\n}\n","import { useSafeLayoutEffect } from \"@chakra-ui/hooks\"\nimport {\n  ImgHTMLAttributes,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\"\n\ntype NativeImageProps = ImgHTMLAttributes<HTMLImageElement>\n\nexport interface UseImageProps {\n  /**\n   * The image `src` attribute\n   */\n  src?: string\n  /**\n   * The image `srcset` attribute\n   */\n  srcSet?: string\n  /**\n   * The image `sizes` attribute\n   */\n  sizes?: string\n  /**\n   * A callback for when the image `src` has been loaded\n   */\n  onLoad?: NativeImageProps[\"onLoad\"]\n  /**\n   * A callback for when there was an error loading the image `src`\n   */\n  onError?: NativeImageProps[\"onError\"]\n  /**\n   * If `true`, opt out of the `fallbackSrc` logic and use as `img`\n   */\n  ignoreFallback?: boolean\n  /**\n   * The key used to set the crossOrigin on the HTMLImageElement into which the image will be loaded.\n   * This tells the browser to request cross-origin access when trying to download the image data.\n   */\n  crossOrigin?: NativeImageProps[\"crossOrigin\"]\n  loading?: NativeImageProps[\"loading\"]\n}\n\ntype Status = \"loading\" | \"failed\" | \"pending\" | \"loaded\"\n\ntype ImageEvent = React.SyntheticEvent<HTMLImageElement, Event>\n\n/**\n * React hook that loads an image in the browser,\n * and let's us know the `status` so we can show image\n * fallback if it is still `pending`\n *\n * @returns the status of the image loading progress\n *\n * @example\n *\n * ```jsx\n * function App(){\n *   const status = useImage({ src: \"image.png\" })\n *   return status === \"loaded\" ? <img src=\"image.png\" /> : <Placeholder />\n * }\n * ```\n */\nexport function useImage(props: UseImageProps) {\n  const {\n    loading,\n    src,\n    srcSet,\n    onLoad,\n    onError,\n    crossOrigin,\n    sizes,\n    ignoreFallback,\n  } = props\n\n  const [status, setStatus] = useState<Status>(\"pending\")\n\n  useEffect(() => {\n    setStatus(src ? \"loading\" : \"pending\")\n  }, [src])\n\n  const imageRef = useRef<HTMLImageElement | null>()\n\n  const load = useCallback(() => {\n    if (!src) return\n\n    flush()\n\n    const img = new Image()\n    img.src = src\n    if (crossOrigin) img.crossOrigin = crossOrigin\n    if (srcSet) img.srcset = srcSet\n    if (sizes) img.sizes = sizes\n    if (loading) img.loading = loading\n\n    img.onload = (event) => {\n      flush()\n      setStatus(\"loaded\")\n      onLoad?.((event as unknown) as ImageEvent)\n    }\n    img.onerror = (error) => {\n      flush()\n      setStatus(\"failed\")\n      onError?.(error as any)\n    }\n\n    imageRef.current = img\n  }, [src, crossOrigin, srcSet, sizes, onLoad, onError, loading])\n\n  const flush = () => {\n    if (imageRef.current) {\n      imageRef.current.onload = null\n      imageRef.current.onerror = null\n      imageRef.current = null\n    }\n  }\n\n  useSafeLayoutEffect(() => {\n    /**\n     * If user opts out of the fallback/placeholder\n     * logic, let's bail out.\n     */\n    if (ignoreFallback) return undefined\n\n    if (status === \"loading\") {\n      load()\n    }\n    return () => {\n      flush()\n    }\n  }, [status, load, ignoreFallback])\n\n  /**\n   * If user opts out of the fallback/placeholder\n   * logic, let's just return 'loaded'\n   */\n  return ignoreFallback ? \"loaded\" : status\n}\n\nexport type UseImageReturn = ReturnType<typeof useImage>\n"],"sourceRoot":""}

package/build/static/js/12.1f0d32c6.chunk.js

@@ -1,2 +0,0 @@
-(this["webpackJsonpconstruct-hub-webapp"]=this["webpackJsonpconstruct-hub-webapp"]||[]).push([[12],{297:function(e,t,c){"use strict";c.d(t,"a",(function(){return o}));var n=c(199),a=c(1),r=function(e){var t=e.children;return Object(a.jsx)(n.a,{as:"em",color:"blue.500",fontWeight:"bold",children:t})},o=function(e){var t=e.limit,c=e.offset,o=e.count,i=e.filtered,s=t*c,l=s+t;return Object(a.jsxs)(n.a,{children:["Displaying"," ",Object(a.jsxs)(r,{children:[o?s+1:o," - ",l>o?o:l]})," ","of ",Object(a.jsx)(r,{children:o})," ",i?"search results":"constructs","."]})}},298:function(e,t,c){"use strict";c.d(t,"a",(function(){return n}));var n=25},300:function(e,t,c){"use strict";c.d(t,"a",(function(){return S}));var n=c(358),a=c(359),r=c(148),o=c(208),i=c(6),s=c(206),l=c(29),u=c(1),j=function(e){var t=e.icon,c=e.offset,n=e.getPageUrl,a={"aria-label":"Page ".concat(c," link"),borderRadius:"md",borderColor:"blue.500",colorScheme:"blue",icon:Object(u.jsx)(t,{color:"blue.500",h:5,w:5}),mx:2,h:10,w:10,variant:"outline"};return void 0!==c?Object(u.jsx)(s.a,Object(i.a)(Object(i.a)({},a),{},{as:l.b,to:n({offset:c})})):Object(u.jsx)(s.a,Object(i.a)(Object(i.a)({},a),{},{disabled:!0}))},f=c(5),b=c(230),d=c(199),g=c(0),O=c(20),h=function(e){var t=e.pageLimit,c=e.offset,n=e.getPageUrl,a=Object(g.useState)((c+1).toString()),r=Object(f.a)(a,2),i=r[0],s=r[1],l=Object(O.g)().push;Object(g.useEffect)((function(){s((c+1).toString())}),[c]);return Object(u.jsxs)(o.a,{align:"center",as:"form",mx:2,onSubmit:function(e){e.preventDefault(),l(n({offset:parseInt(i)-1}))},children:[Object(u.jsx)(b.a,{colorScheme:"blue",h:10,max:t+1,min:1,name:"page",onChange:function(e){e.preventDefault(),s(e.target.value)},p:0,textAlign:"center",type:"number",value:i,w:10}),Object(u.jsxs)(d.a,{ml:2,w:"max-content",children:["of ",t+1]})]})},p=c(357),x=c(154),v={children:"Next Page",colorScheme:"blue",rightIcon:Object(u.jsx)(p.a,{color:"white"})},m=function(e){var t=e.nextPageUrl;return t?Object(u.jsx)(x.a,Object(i.a)(Object(i.a)({},v),{},{as:l.b,to:t})):Object(u.jsx)(x.a,Object(i.a)(Object(i.a)({},v),{},{disabled:!0}))},S=function(e){var t=e.offset,c=e.pageLimit,i=e.getPageUrl,s=t<c?t+1:void 0,l=t>0?t-1:void 0;return Object(u.jsxs)(r.a,{alignItems:"center",pt:4,templateColumns:"repeat(3, 1fr)",templateRows:"1fr",children:[Object(u.jsx)(r.b,{colStart:2,justifySelf:"center",children:Object(u.jsx)(m,{nextPageUrl:s?i({offset:s}):void 0})}),Object(u.jsx)(r.b,{colStart:3,justifySelf:"end",children:Object(u.jsxs)(o.a,{align:"center",justify:"center",py:4,children:[Object(u.jsx)(h,{getPageUrl:i,offset:t,pageLimit:c}),Object(u.jsx)(j,{getPageUrl:i,icon:n.a,offset:l}),Object(u.jsx)(j,{getPageUrl:i,icon:a.a,offset:s})]})})]})}},605:function(e,t,c){"use strict";c.r(t),c.d(t,"SearchResults",(function(){return m})),c.d(t,"default",(function(){return m}));var n=c(6),a=c(208),r=c(195),o=c(210),i=c(0),s=c(20),l=c(123),u=c(233),j=c(354),f=c(10),b=c(122),d=c(124),g=c(121),O=c(116),h=c(300),p=c(297),x=c(298),v=c(1),m=function(){var e,t,c=Object(g.a)(),m=decodeURIComponent(null!==(e=c.get(f.b.SEARCH_QUERY))&&void 0!==e?e:""),S=c.get(f.b.LANGUAGE),w=Object(d.a)({defaultQuery:null!==m&&void 0!==m?m:void 0,defaultLanguage:null!==S&&void 0!==S?S:void 0}),y=function(e){var t=parseInt(e);return"NaN"==="".concat(t)?0:t}(null!==(t=c.get(f.b.OFFSET))&&void 0!==t?t:"0"),U=Object(s.g)().push,P=Object(b.a)({query:m,offset:y,limit:x.a,language:S}),E=P.results,L=P.page,C=P.pageLimit,R=function(e){var t,c;return Object(O.c)({query:null!==(t=e.q)&&void 0!==t?t:m,language:null!==S&&void 0!==S?S:void 0,offset:null!==(c=e.offset)&&void 0!==c?c:y})};return Object(i.useEffect)((function(){E.length&&(y<0||y>C)&&U(R(y<0?{offset:0}:{offset:C}))}),[E,C,y]),Object(i.useEffect)((function(){m!==w.query&&w.setQuery(m)}),[m]),Object(v.jsx)(u.a,{meta:{title:m||"Search",description:m?"".concat(E.length," results for ").concat(m," at Construct Hub"):"Search reusable components for your cloud application"},pageName:"search",children:Object(v.jsxs)(a.a,{direction:"column",maxW:"100vw",children:[Object(v.jsx)(r.a,{p:4,children:Object(v.jsx)(l.a,Object(n.a)({},w))}),Object(v.jsx)(o.a,{}),Object(v.jsxs)(r.a,{p:4,children:[Object(v.jsx)(a.a,{align:"center",justify:"space-between",pb:4,wrap:"wrap",children:Object(v.jsx)(p.a,{count:E.length,filtered:!!m,limit:x.a,offset:y})}),Object(v.jsx)(j.a,{language:null!==S&&void 0!==S?S:void 0,results:L}),Object(v.jsx)(h.a,{getPageUrl:R,limit:x.a,offset:y,pageLimit:C})]})]})})}}}]);
-//# sourceMappingURL=12.1f0d32c6.chunk.js.map

package/build/static/js/12.1f0d32c6.chunk.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["views/SearchResults/components/ShowingDetails.tsx","views/SearchResults/constants.ts","views/SearchResults/components/ArrowButton.tsx","views/SearchResults/components/GoToPage.tsx","views/SearchResults/components/NextPage.tsx","views/SearchResults/components/PageControls.tsx","views/SearchResults/SearchResults.tsx"],"names":["Em","children","as","color","fontWeight","ShowingDetails","limit","offset","count","filtered","first","last","LIMIT","ArrowButton","Icon","icon","getPageUrl","props","borderRadius","borderColor","colorScheme","h","w","mx","variant","undefined","Link","to","disabled","GoToPage","pageLimit","useState","toString","inputValue","setInputValue","push","useHistory","useEffect","align","onSubmit","e","preventDefault","parseInt","max","min","name","onChange","target","value","p","textAlign","type","ml","btnProps","rightIcon","ArrowForward","NextPage","nextPageUrl","PageControls","nextOffset","prevOffset","alignItems","pt","templateColumns","templateRows","colStart","justifySelf","justify","py","ChevronLeftIcon","ChevronRightIcon","SearchResults","queryParams","useQueryParams","searchQuery","decodeURIComponent","get","QUERY_PARAMS","SEARCH_QUERY","languageQuery","LANGUAGE","searchAPI","useCatalogSearch","defaultQuery","defaultLanguage","val","result","toNum","OFFSET","useCatalogResults","query","language","results","page","getUrl","params","getSearchPath","q","length","setQuery","Page","meta","title","description","pageName","direction","maxW","CatalogSearch","pb","wrap","Results"],"mappings":"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","file":"static/js/12.1f0d32c6.chunk.js","sourcesContent":["import { Text } from \"@chakra-ui/react\";\nimport { FunctionComponent } from \"react\";\n\nexport interface ShowingDetailsProps {\n  limit: number;\n  offset: number;\n  count: number;\n  filtered: boolean;\n}\n\nconst Em: FunctionComponent = ({ children }) => (\n  <Text as=\"em\" color=\"blue.500\" fontWeight=\"bold\">\n    {children}\n  </Text>\n);\n\nexport const ShowingDetails: FunctionComponent<ShowingDetailsProps> = ({\n  limit,\n  offset,\n  count,\n  filtered,\n}) => {\n  const first = limit * offset;\n  const last = first + limit;\n  return (\n    <Text>\n      Displaying{\" \"}\n      <Em>\n        {count ? first + 1 : count} - {last > count ? count : last}\n      </Em>{\" \"}\n      of <Em>{count}</Em> {filtered ? \"search results\" : \"constructs\"}.\n    </Text>\n  );\n};\n","import type { QueryParamKey } from \"../../constants/url\";\n\nexport const LIMITS = [25, 50, 75, 100];\nexport const LIMIT = LIMITS[0];\n\nexport type SearchQueryParam = Extract<QueryParamKey, \"offset\" | \"q\">;\n","import { IconButton, IconProps } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Link } from \"react-router-dom\";\n\nexport interface ArrowButtonProps {\n  icon: FunctionComponent<IconProps>;\n  offset?: number;\n  getPageUrl: (params: { offset: number }) => string;\n}\n\nexport const ArrowButton: FunctionComponent<ArrowButtonProps> = ({\n  icon: Icon,\n  offset,\n  getPageUrl,\n}) => {\n  const label = `Page ${offset} link`;\n\n  const props = {\n    \"aria-label\": label,\n    borderRadius: \"md\",\n    borderColor: \"blue.500\",\n    colorScheme: \"blue\",\n    icon: <Icon color=\"blue.500\" h={5} w={5} />,\n    mx: 2,\n    h: 10,\n    w: 10,\n    variant: \"outline\",\n  };\n\n  if (offset !== undefined) {\n    return <IconButton {...props} as={Link} to={getPageUrl({ offset })} />;\n  }\n\n  return <IconButton {...props} disabled />;\n};\n","import { Flex, Input, Text } from \"@chakra-ui/react\";\nimport {\n  FormEventHandler,\n  FunctionComponent,\n  SyntheticEvent,\n  useEffect,\n  useState,\n} from \"react\";\nimport { useHistory } from \"react-router-dom\";\n\nexport interface GoToPageProps {\n  pageLimit: number;\n  offset: number;\n  getPageUrl: (params: { offset: number }) => string;\n}\n\nexport const GoToPage: FunctionComponent<GoToPageProps> = ({\n  pageLimit,\n  offset,\n  getPageUrl,\n}) => {\n  const [inputValue, setInputValue] = useState((offset + 1).toString());\n  const { push } = useHistory();\n\n  useEffect(() => {\n    setInputValue((offset + 1).toString());\n  }, [offset]);\n\n  const onInputChange = (e: SyntheticEvent<HTMLInputElement>) => {\n    e.preventDefault();\n    setInputValue((e.target as HTMLInputElement).value);\n  };\n\n  const onSubmit: FormEventHandler<HTMLInputElement> = (e) => {\n    e.preventDefault();\n    push(getPageUrl({ offset: parseInt(inputValue) - 1 }));\n  };\n\n  return (\n    <Flex align=\"center\" as=\"form\" mx={2} onSubmit={onSubmit}>\n      <Input\n        colorScheme=\"blue\"\n        h={10}\n        max={pageLimit + 1}\n        min={1}\n        name=\"page\"\n        onChange={onInputChange}\n        p={0}\n        textAlign=\"center\"\n        type=\"number\"\n        value={inputValue}\n        w={10}\n      />\n      <Text ml={2} w=\"max-content\">\n        of {pageLimit + 1}\n      </Text>\n    </Flex>\n  );\n};\n","import { ArrowForwardIcon } from \"@chakra-ui/icons\";\nimport { Button } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { Link } from \"react-router-dom\";\n\nexport interface NextPageProps {\n  nextPageUrl?: string;\n}\n\nconst btnProps = {\n  children: \"Next Page\",\n  colorScheme: \"blue\",\n  rightIcon: <ArrowForwardIcon color=\"white\" />,\n};\n\nexport const NextPage: FunctionComponent<NextPageProps> = ({ nextPageUrl }) => {\n  if (!nextPageUrl) {\n    return <Button {...btnProps} disabled />;\n  }\n\n  return <Button {...btnProps} as={Link} to={nextPageUrl} />;\n};\n","import { ChevronLeftIcon, ChevronRightIcon } from \"@chakra-ui/icons\";\nimport { Flex, Grid, GridItem } from \"@chakra-ui/react\";\nimport type { FunctionComponent } from \"react\";\nimport { ArrowButton } from \"./ArrowButton\";\nimport { GoToPage } from \"./GoToPage\";\nimport { NextPage } from \"./NextPage\";\n\nexport interface PageControlsProps {\n  limit: number;\n  offset: number;\n  pageLimit: number;\n  getPageUrl: (params: { offset?: number }) => string;\n}\n\nexport const PageControls: FunctionComponent<PageControlsProps> = ({\n  offset,\n  pageLimit,\n  getPageUrl,\n}) => {\n  const nextOffset = offset < pageLimit ? offset + 1 : undefined;\n  const prevOffset = offset > 0 ? offset - 1 : undefined;\n\n  return (\n    <Grid\n      alignItems=\"center\"\n      pt={4}\n      templateColumns=\"repeat(3, 1fr)\"\n      templateRows=\"1fr\"\n    >\n      <GridItem colStart={2} justifySelf=\"center\">\n        <NextPage\n          nextPageUrl={\n            nextOffset ? getPageUrl({ offset: nextOffset }) : undefined\n          }\n        />\n      </GridItem>\n      <GridItem colStart={3} justifySelf=\"end\">\n        <Flex align=\"center\" justify=\"center\" py={4}>\n          <GoToPage\n            getPageUrl={getPageUrl}\n            offset={offset}\n            pageLimit={pageLimit}\n          />\n          <ArrowButton\n            getPageUrl={getPageUrl}\n            icon={ChevronLeftIcon}\n            offset={prevOffset}\n          />\n          <ArrowButton\n            getPageUrl={getPageUrl}\n            icon={ChevronRightIcon}\n            offset={nextOffset}\n          />\n        </Flex>\n      </GridItem>\n    </Grid>\n  );\n};\n","import { Box, Divider, Flex } from \"@chakra-ui/react\";\nimport { FunctionComponent, useEffect } from \"react\";\nimport { useHistory } from \"react-router-dom\";\nimport { CatalogSearch } from \"../../components/CatalogSearch\";\nimport { Page } from \"../../components/Page\";\nimport { Results } from \"../../components/Results\";\nimport { Language } from \"../../constants/languages\";\nimport { QUERY_PARAMS } from \"../../constants/url\";\nimport { useCatalogResults } from \"../../hooks/useCatalogResults\";\nimport { useCatalogSearch } from \"../../hooks/useCatalogSearch\";\nimport { useQueryParams } from \"../../hooks/useQueryParams\";\nimport { getSearchPath } from \"../../util/url\";\nimport { PageControls } from \"./components/PageControls\";\nimport { ShowingDetails } from \"./components/ShowingDetails\";\nimport { LIMIT, SearchQueryParam } from \"./constants\";\n\nconst toNum = (val: string) => {\n  const result = parseInt(val);\n\n  if (`${result}` === \"NaN\") {\n    return 0;\n  }\n\n  return result;\n};\n\nexport const SearchResults: FunctionComponent = () => {\n  const queryParams = useQueryParams();\n\n  const searchQuery = decodeURIComponent(\n    queryParams.get(QUERY_PARAMS.SEARCH_QUERY) ?? \"\"\n  );\n\n  const languageQuery = queryParams.get(\n    QUERY_PARAMS.LANGUAGE\n  ) as Language | null;\n\n  const searchAPI = useCatalogSearch({\n    defaultQuery: searchQuery ?? undefined,\n    defaultLanguage: languageQuery ?? undefined,\n  });\n\n  const offset = toNum(queryParams.get(QUERY_PARAMS.OFFSET) ?? \"0\");\n\n  const { push } = useHistory();\n\n  const { results, page, pageLimit } = useCatalogResults({\n    query: searchQuery,\n    offset,\n    limit: LIMIT,\n    language: languageQuery,\n  });\n\n  const getUrl = (\n    params: Partial<{ [key in SearchQueryParam]: number | string }>\n  ) => {\n    return getSearchPath({\n      query: (params.q ?? searchQuery) as string,\n      language: languageQuery ?? undefined,\n      offset: params.offset ?? offset,\n    });\n  };\n\n  useEffect(() => {\n    // If the query has results but the page has nothing to show...\n    if (results.length && (offset < 0 || offset > pageLimit)) {\n      // Handle an out of bounds offset\n      if (offset < 0) {\n        push(getUrl({ offset: 0 }));\n      } else {\n        // Offset is too large, just take last page\n        push(getUrl({ offset: pageLimit }));\n      }\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [results, pageLimit, offset]);\n\n  useEffect(() => {\n    // Reflect changes to queryParam to search input (specifically for tag clicks)\n    if (searchQuery !== searchAPI.query) {\n      searchAPI.setQuery(searchQuery);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchQuery]);\n\n  return (\n    <Page\n      meta={{\n        title: searchQuery || \"Search\",\n        description: searchQuery\n          ? `${results.length} results for ${searchQuery} at Construct Hub`\n          : \"Search reusable components for your cloud application\",\n      }}\n      pageName=\"search\"\n    >\n      <Flex direction=\"column\" maxW=\"100vw\">\n        <Box p={4}>\n          <CatalogSearch {...searchAPI} />\n        </Box>\n        <Divider />\n        <Box p={4}>\n          <Flex align=\"center\" justify=\"space-between\" pb={4} wrap=\"wrap\">\n            <ShowingDetails\n              count={results.length}\n              filtered={!!searchQuery}\n              limit={LIMIT}\n              offset={offset}\n            />\n          </Flex>\n          <Results language={languageQuery ?? undefined} results={page} />\n          <PageControls\n            getPageUrl={getUrl}\n            limit={LIMIT}\n            offset={offset}\n            pageLimit={pageLimit}\n          />\n        </Box>\n      </Flex>\n    </Page>\n  );\n};\n"],"sourceRoot":""}

package/build/static/js/13.a1af9f29.chunk.js

@@ -1,2 +0,0 @@
-(this["webpackJsonpconstruct-hub-webapp"]=this["webpackJsonpconstruct-hub-webapp"]||[]).push([[13],{250:function(e,t,a){"use strict";a.d(t,"a",(function(){return u}));var r=a(6),c=a(23),n=a(19),i=a(195),s=a(301),o=a(1),l=["sources"],u=Object(n.a)((function(e,t){var a=e.sources,n=Object(c.a)(e,l);return Object(o.jsxs)(i.a,{as:"picture",children:[null===a||void 0===a?void 0:a.map((function(e,t){return Object(o.jsx)("source",{media:e.media,srcSet:e.srcSet},t)})),Object(o.jsx)(s.a,Object(r.a)({ref:t},n))]})}));u.displayName="Picture"},301:function(e,t,a){"use strict";a.d(t,"a",(function(){return j}));var r=a(19),c=a(22),n=a(26),i=a(8),s=a(0),o=a(5),l=a(145);function u(){return u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},u.apply(this,arguments)}function b(e,t){if(null==e)return{};var a,r,c={},n=Object.keys(e);for(r=0;r<n.length;r++)a=n[r],t.indexOf(a)>=0||(c[a]=e[a]);return c}var d=s.forwardRef((function(e,t){var a=e.htmlWidth,r=e.htmlHeight,c=e.alt,n=b(e,["htmlWidth","htmlHeight","alt"]);return s.createElement("img",u({width:a,height:r,ref:t,alt:c},n))})),j=Object(r.a)((function(e,t){var a=e.fallbackSrc,r=e.fallback,i=e.src,j=e.srcSet,f=e.align,h=e.fit,g=e.loading,p=e.ignoreFallback,O=e.crossOrigin,m=b(e,["fallbackSrc","fallback","src","srcSet","align","fit","loading","ignoreFallback","crossOrigin"]),x=null!=g||p||void 0===a&&void 0===r,v=function(e){var t=e.loading,a=e.src,r=e.srcSet,c=e.onLoad,n=e.onError,i=e.crossOrigin,u=e.sizes,b=e.ignoreFallback,d=Object(s.useState)("pending"),j=Object(o.a)(d,2),f=j[0],h=j[1];Object(s.useEffect)((function(){h(a?"loading":"pending")}),[a]);var g=Object(s.useRef)(),p=Object(s.useCallback)((function(){if(a){O();var e=new Image;e.src=a,i&&(e.crossOrigin=i),r&&(e.srcset=r),u&&(e.sizes=u),t&&(e.loading=t),e.onload=function(e){O(),h("loaded"),null==c||c(e)},e.onerror=function(e){O(),h("failed"),null==n||n(e)},g.current=e}}),[a,i,r,u,c,n,t]),O=function(){g.current&&(g.current.onload=null,g.current.onerror=null,g.current=null)};return Object(l.a)((function(){if(!b)return"loading"===f&&p(),function(){O()}}),[f,p,b]),b?"loaded":f}(u({},e,{ignoreFallback:x})),S=u({ref:t,objectFit:h,objectPosition:f},x?m:Object(n.g)(m,["onError","onLoad"]));return"loaded"!==v?r||s.createElement(c.a.img,u({as:d,className:"chakra-image__placeholder",src:a},S)):s.createElement(c.a.img,u({as:d,src:i,srcSet:j,crossOrigin:O,loading:g,className:"chakra-image"},S))}));i.a&&(j.displayName="Image")},604:function(e,t,a){"use strict";a.r(t),a.d(t,"Home",(function(){return K})),a.d(t,"default",(function(){return K}));var r=a(6),c=a(5),n=a(195),i=a(229),s=a(214),o=a(603),l=a(0),u=a(66),b=a(123),d=a(233),j=a(250),f=a(354),h=a(122),g=a(124),p=a(357),O=a(358),m=a(359),x=a(148),v=a(154),S=a(208),k=a(206),w=a(56),y=Object(w.a)("home",["headings","results","nextPageBtn","nextIcon","prevIcon"]),C=a(1),P={borderRadius:"md",borderColor:"blue.500",colorScheme:"blue",mx:2,h:10,w:10,variant:"outline"},I={color:"blue.500",h:5,w:5},D=function(e){var t=e.offset,a=e.pageLimit,c=e.setOffset,n=t===a,i=0===t,s=function(){c(t+1)};return Object(C.jsxs)(x.a,{alignItems:"center",pt:6,templateColumns:"repeat(3, 1fr)",templateRows:"1fr",children:[Object(C.jsx)(x.b,{colStart:2,justifySelf:"center",children:Object(C.jsx)(v.a,{colorScheme:"blue","data-testid":y.nextPageBtn,disabled:n,onClick:s,rightIcon:Object(C.jsx)(p.a,{color:"white"}),children:"Next Page"})}),Object(C.jsx)(x.b,{colStart:3,justifySelf:"end",children:Object(C.jsxs)(S.a,{align:"center",justify:"center",py:4,children:[Object(C.jsx)(k.a,Object(r.a)({"aria-label":"Previous Page","data-testid":y.prevIcon,disabled:i,icon:Object(C.jsx)(O.a,Object(r.a)({},I)),onClick:function(){c(t-1)}},P)),Object(C.jsx)(k.a,Object(r.a)({"aria-label":"Next Page","data-testid":y.nextIcon,disabled:n,icon:Object(C.jsx)(m.a,Object(r.a)({},I)),onClick:s},P))]})})]})},F={optimal:[{media:"(max-width:1024px)",srcSet:"/assets/hive@50.webp"},{media:"(min-width:1024px)",srcSet:"/assets/hive@100.webp"},{media:"(min-width:1024px)",srcSet:"/assets/hive@100.png"}],fallback:"/assets/hive@50.png"},K=function(){var e=Object(g.a)(),t=Object(l.useState)(0),a=Object(c.a)(t,2),p=a[0],O=a[1],m=Object(h.a)({offset:p,limit:20,query:"",language:null,sort:u.a.PublishDateDesc}),x=m.results,v=m.page,S=m.pageLimit;return Object(C.jsx)(d.a,{meta:{title:"Construct Hub",description:"Construct Hub helps developers find open-source construct libraries for use with AWS CDK, CDK8s, CDKTf and other construct-based tools.",suffix:!1},pageName:"home",children:Object(C.jsxs)(n.a,{position:"relative",children:[Object(C.jsx)(j.a,{alt:"",h:"540px",position:"absolute",sources:F.optimal,src:F.fallback,top:"0",w:"100%",zIndex:"hide"}),Object(C.jsxs)(i.a,{align:"stretch",direction:"column",justify:"center",m:"0 auto",maxW:"container.lg",p:[10,15,20],spacing:8,children:[Object(C.jsxs)(i.a,{color:"blue.800","data-testid":y.headings,spacing:4,textAlign:"center",children:[Object(C.jsx)(s.a,{size:"2xl",children:"Find reusable components for your cloud applications"}),Object(C.jsx)(s.a,{as:"h3",size:"md",children:"AWS CDK | CDK for Terraform | CDK For Kubernetes"}),Object(C.jsxs)(s.a,{as:"h4",mb:8,size:"sm",children:["Search from"," ",x.length?Object(C.jsx)(n.a,{as:"span",color:"blue.500",children:x.length}):Object(C.jsx)(o.a,{display:"inline-block",h:3,w:8})," ","construct libraries"]})]}),Object(C.jsx)(b.a,Object(r.a)({},e))]}),Object(C.jsxs)(n.a,{p:4,pb:8,children:[Object(C.jsx)(f.a,{results:v}),Object(C.jsx)(D,{offset:p,pageLimit:S,setOffset:O})]})]})})}}}]);
-//# sourceMappingURL=13.a1af9f29.chunk.js.map

package/build/static/js/13.a1af9f29.chunk.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/Picture/Picture.tsx","../../../src/image.tsx","../../../src/use-image.ts","views/Home/testIds.ts","views/Home/HomePageControls.tsx","views/Home/Home.tsx"],"names":["Picture","forwardRef","ref","sources","props","as","map","source","idx","media","srcSet","displayName","NativeImage","alt","width","height","Image","crossOrigin","shouldIgnore","loading","fallbackSrc","fallback","status","ignoreFallback","useState","useEffect","setStatus","src","imageRef","useRef","load","useCallback","flush","img","event","onLoad","error","onError","sizes","useSafeLayoutEffect","useImage","shared","objectFit","objectPosition","align","rest","omit","className","testIds","createTestIds","iconBtnProps","borderRadius","borderColor","colorScheme","mx","h","w","variant","iconProps","color","HomePageControls","offset","pageLimit","setOffset","nextDisabled","prevDisabled","getNextPage","alignItems","pt","templateColumns","templateRows","colStart","justifySelf","nextPageBtn","disabled","onClick","rightIcon","ArrowForward","justify","py","prevIcon","icon","ChevronLeft","nextIcon","ChevronRight","optimal","Home","searchAPI","useCatalogSearch","useCatalogResults","limit","query","language","sort","CatalogSearchSort","PublishDateDesc","results","page","Page","meta","title","description","suffix","pageName","position","top","zIndex","direction","m","maxW","p","spacing","headings","textAlign","size","mb","length","display","CatalogSearch","pb","Results"],"mappings":"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","file":"static/js/13.a1af9f29.chunk.js","sourcesContent":["import { Box, HTMLChakraProps, forwardRef, Image } from \"@chakra-ui/react\";\n\nexport interface PictureProps extends HTMLChakraProps<\"img\"> {\n  alt: string;\n  src: string;\n  sources?: {\n    media?: string;\n    srcSet: string;\n  }[];\n}\n\nexport const Picture = forwardRef<PictureProps, \"img\">(\n  ({ sources, ...props }, ref) => (\n    <Box as=\"picture\">\n      {sources?.map((source, idx) => (\n        <source key={idx} media={source.media} srcSet={source.srcSet} />\n      ))}\n      <Image ref={ref} {...props} />\n    </Box>\n  )\n);\n\nPicture.displayName = \"Picture\";\n","import {\n  chakra,\n  PropsOf,\n  SystemProps,\n  forwardRef,\n  HTMLChakraProps,\n} from \"@chakra-ui/system\"\nimport { omit, __DEV__ } from \"@chakra-ui/utils\"\nimport * as React from \"react\"\nimport { useImage, UseImageProps } from \"./use-image\"\n\ninterface NativeImageOptions {\n  /**\n   * The native HTML `width` attribute to the passed to the `img`\n   */\n  htmlWidth?: string | number\n  /**\n   * The native HTML `height` attribute to the passed to the `img`\n   */\n  htmlHeight?: string | number\n}\n\ninterface NativeImageProps extends PropsOf<\"img\">, NativeImageOptions {}\n\nconst NativeImage = React.forwardRef(\n  (props: NativeImageProps, ref: React.Ref<any>) => {\n    const { htmlWidth, htmlHeight, alt, ...rest } = props\n    return (\n      <img\n        width={htmlWidth}\n        height={htmlHeight}\n        ref={ref}\n        alt={alt}\n        {...rest}\n      />\n    )\n  },\n)\n\ninterface ImageOptions extends NativeImageOptions {\n  /**\n   * Fallback image `src` to show if image is loading or image fails.\n   *\n   * Note 🚨: We recommend you use a local image\n   */\n  fallbackSrc?: string\n  /**\n   * Fallback element to show if image is loading or image fails.\n   * @type React.ReactElement\n   */\n  fallback?: React.ReactElement\n  /**\n   * Defines loading strategy\n   */\n  loading?: \"eager\" | \"lazy\"\n  /**\n   * How the image to fit within its bounds.\n   * It maps to css `object-fit` property.\n   * @type SystemProps[\"objectFit\"]\n   */\n  fit?: SystemProps[\"objectFit\"]\n  /**\n   * How to align the image within its bounds.\n   * It maps to css `object-position` property.\n   * @type SystemProps[\"objectPosition\"]\n   */\n  align?: SystemProps[\"objectPosition\"]\n  /**\n   * If `true`, opt out of the `fallbackSrc` logic and use as `img`\n   */\n  ignoreFallback?: boolean\n}\n\nexport interface ImageProps\n  extends UseImageProps,\n    Omit<HTMLChakraProps<\"img\">, keyof UseImageProps>,\n    ImageOptions {}\n\n/**\n * React component that renders an image with support\n * for fallbacks\n *\n * @see Docs https://chakra-ui.com/image\n */\nexport const Image = forwardRef<ImageProps, \"img\">((props, ref) => {\n  const {\n    fallbackSrc,\n    fallback,\n    src,\n    srcSet,\n    align,\n    fit,\n    loading,\n    ignoreFallback,\n    crossOrigin,\n    ...rest\n  } = props\n\n  /**\n   * Defer to native `img` tag if `loading` prop is passed\n   * @see https://github.com/chakra-ui/chakra-ui/issues/1027\n   */\n  const shouldIgnore =\n    loading != null ||\n    ignoreFallback ||\n    (fallbackSrc === undefined && fallback === undefined) // if the user doesn't provide any kind of fallback we should ignore it\n\n  const status = useImage({\n    ...props,\n    ignoreFallback: shouldIgnore,\n  })\n\n  const shared = {\n    ref,\n    objectFit: fit,\n    objectPosition: align,\n    ...(shouldIgnore ? rest : omit(rest, [\"onError\", \"onLoad\"])),\n  }\n\n  if (status !== \"loaded\") {\n    /**\n     * If user passed a custom fallback component,\n     * let's render it here.\n     */\n    if (fallback) return fallback\n\n    return (\n      <chakra.img\n        as={NativeImage}\n        className=\"chakra-image__placeholder\"\n        src={fallbackSrc}\n        {...shared}\n      />\n    )\n  }\n\n  return (\n    <chakra.img\n      as={NativeImage}\n      src={src}\n      srcSet={srcSet}\n      crossOrigin={crossOrigin}\n      loading={loading}\n      className=\"chakra-image\"\n      {...shared}\n    />\n  )\n})\n\nexport interface ImgProps extends HTMLChakraProps<\"img\">, NativeImageOptions {}\n\n/**\n * Fallback component for most SSR users who want to use the native `img` with\n * support for chakra props\n */\nexport const Img = forwardRef<ImgProps, \"img\">((props, ref) => (\n  <chakra.img ref={ref} as={NativeImage} className=\"chakra-image\" {...props} />\n))\n\nif (__DEV__) {\n  Image.displayName = \"Image\"\n}\n","import { useSafeLayoutEffect } from \"@chakra-ui/hooks\"\nimport {\n  ImgHTMLAttributes,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\"\n\ntype NativeImageProps = ImgHTMLAttributes<HTMLImageElement>\n\nexport interface UseImageProps {\n  /**\n   * The image `src` attribute\n   */\n  src?: string\n  /**\n   * The image `srcset` attribute\n   */\n  srcSet?: string\n  /**\n   * The image `sizes` attribute\n   */\n  sizes?: string\n  /**\n   * A callback for when the image `src` has been loaded\n   */\n  onLoad?: NativeImageProps[\"onLoad\"]\n  /**\n   * A callback for when there was an error loading the image `src`\n   */\n  onError?: NativeImageProps[\"onError\"]\n  /**\n   * If `true`, opt out of the `fallbackSrc` logic and use as `img`\n   */\n  ignoreFallback?: boolean\n  /**\n   * The key used to set the crossOrigin on the HTMLImageElement into which the image will be loaded.\n   * This tells the browser to request cross-origin access when trying to download the image data.\n   */\n  crossOrigin?: NativeImageProps[\"crossOrigin\"]\n  loading?: NativeImageProps[\"loading\"]\n}\n\ntype Status = \"loading\" | \"failed\" | \"pending\" | \"loaded\"\n\ntype ImageEvent = React.SyntheticEvent<HTMLImageElement, Event>\n\n/**\n * React hook that loads an image in the browser,\n * and let's us know the `status` so we can show image\n * fallback if it is still `pending`\n *\n * @returns the status of the image loading progress\n *\n * @example\n *\n * ```jsx\n * function App(){\n *   const status = useImage({ src: \"image.png\" })\n *   return status === \"loaded\" ? <img src=\"image.png\" /> : <Placeholder />\n * }\n * ```\n */\nexport function useImage(props: UseImageProps) {\n  const {\n    loading,\n    src,\n    srcSet,\n    onLoad,\n    onError,\n    crossOrigin,\n    sizes,\n    ignoreFallback,\n  } = props\n\n  const [status, setStatus] = useState<Status>(\"pending\")\n\n  useEffect(() => {\n    setStatus(src ? \"loading\" : \"pending\")\n  }, [src])\n\n  const imageRef = useRef<HTMLImageElement | null>()\n\n  const load = useCallback(() => {\n    if (!src) return\n\n    flush()\n\n    const img = new Image()\n    img.src = src\n    if (crossOrigin) img.crossOrigin = crossOrigin\n    if (srcSet) img.srcset = srcSet\n    if (sizes) img.sizes = sizes\n    if (loading) img.loading = loading\n\n    img.onload = (event) => {\n      flush()\n      setStatus(\"loaded\")\n      onLoad?.((event as unknown) as ImageEvent)\n    }\n    img.onerror = (error) => {\n      flush()\n      setStatus(\"failed\")\n      onError?.(error as any)\n    }\n\n    imageRef.current = img\n  }, [src, crossOrigin, srcSet, sizes, onLoad, onError, loading])\n\n  const flush = () => {\n    if (imageRef.current) {\n      imageRef.current.onload = null\n      imageRef.current.onerror = null\n      imageRef.current = null\n    }\n  }\n\n  useSafeLayoutEffect(() => {\n    /**\n     * If user opts out of the fallback/placeholder\n     * logic, let's bail out.\n     */\n    if (ignoreFallback) return undefined\n\n    if (status === \"loading\") {\n      load()\n    }\n    return () => {\n      flush()\n    }\n  }, [status, load, ignoreFallback])\n\n  /**\n   * If user opts out of the fallback/placeholder\n   * logic, let's just return 'loaded'\n   */\n  return ignoreFallback ? \"loaded\" : status\n}\n\nexport type UseImageReturn = ReturnType<typeof useImage>\n","import { createTestIds } from \"../../util/createTestIds\";\n\nconst testIds = createTestIds(\"home\", [\n  \"headings\",\n  \"results\",\n  \"nextPageBtn\",\n  \"nextIcon\",\n  \"prevIcon\",\n] as const);\n\nexport default testIds;\n","import {\n  ArrowForwardIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n} from \"@chakra-ui/icons\";\nimport { Grid, GridItem, Button, Flex, IconButton } from \"@chakra-ui/react\";\nimport type { Dispatch, FunctionComponent, SetStateAction } from \"react\";\nimport testIds from \"./testIds\";\n\nconst iconBtnProps = {\n  borderRadius: \"md\",\n  borderColor: \"blue.500\",\n  colorScheme: \"blue\",\n  mx: 2,\n  h: 10,\n  w: 10,\n  variant: \"outline\",\n};\n\nconst iconProps = {\n  color: \"blue.500\",\n  h: 5,\n  w: 5,\n};\n\nexport interface HomePageControlsProps {\n  offset: number;\n  pageLimit: number;\n  setOffset: Dispatch<SetStateAction<number>>;\n}\n\nexport const HomePageControls: FunctionComponent<HomePageControlsProps> = ({\n  offset,\n  pageLimit,\n  setOffset,\n}) => {\n  const nextDisabled = offset === pageLimit;\n  const prevDisabled = offset === 0;\n\n  const getNextPage = () => {\n    setOffset(offset + 1);\n  };\n\n  const getPrevPage = () => {\n    setOffset(offset - 1);\n  };\n\n  return (\n    <Grid\n      alignItems=\"center\"\n      pt={6}\n      templateColumns=\"repeat(3, 1fr)\"\n      templateRows=\"1fr\"\n    >\n      <GridItem colStart={2} justifySelf=\"center\">\n        <Button\n          colorScheme=\"blue\"\n          data-testid={testIds.nextPageBtn}\n          disabled={nextDisabled}\n          onClick={getNextPage}\n          rightIcon={<ArrowForwardIcon color=\"white\" />}\n        >\n          Next Page\n        </Button>\n      </GridItem>\n      <GridItem colStart={3} justifySelf=\"end\">\n        <Flex align=\"center\" justify=\"center\" py={4}>\n          <IconButton\n            aria-label=\"Previous Page\"\n            data-testid={testIds.prevIcon}\n            disabled={prevDisabled}\n            icon={<ChevronLeftIcon {...iconProps} />}\n            onClick={getPrevPage}\n            {...iconBtnProps}\n          />\n          <IconButton\n            aria-label=\"Next Page\"\n            data-testid={testIds.nextIcon}\n            disabled={nextDisabled}\n            icon={<ChevronRightIcon {...iconProps} />}\n            onClick={getNextPage}\n            {...iconBtnProps}\n          />\n        </Flex>\n      </GridItem>\n    </Grid>\n  );\n};\n","import { Box, Stack, Heading, Skeleton } from \"@chakra-ui/react\";\nimport { FunctionComponent, useState } from \"react\";\nimport { CatalogSearchSort } from \"../../api/catalog-search/constants\";\nimport { CatalogSearch } from \"../../components/CatalogSearch\";\nimport { Page } from \"../../components/Page\";\nimport { Picture } from \"../../components/Picture\";\nimport { Results } from \"../../components/Results\";\nimport { useCatalogResults } from \"../../hooks/useCatalogResults\";\nimport { useCatalogSearch } from \"../../hooks/useCatalogSearch\";\nimport { HomePageControls } from \"./HomePageControls\";\nimport testIds from \"./testIds\";\n\nconst sources = {\n  optimal: [\n    { media: \"(max-width:1024px)\", srcSet: \"/assets/hive@50.webp\" },\n    { media: \"(min-width:1024px)\", srcSet: \"/assets/hive@100.webp\" },\n    { media: \"(min-width:1024px)\", srcSet: \"/assets/hive@100.png\" },\n  ],\n  fallback: \"/assets/hive@50.png\",\n};\n\nexport const Home: FunctionComponent = () => {\n  const searchAPI = useCatalogSearch();\n  const [offset, setOffset] = useState(0);\n\n  const { results, page, pageLimit } = useCatalogResults({\n    offset,\n    limit: 20,\n    query: \"\",\n    language: null,\n    sort: CatalogSearchSort.PublishDateDesc,\n  });\n\n  return (\n    <Page\n      meta={{\n        title: \"Construct Hub\",\n        description:\n          \"Construct Hub helps developers find open-source construct libraries for use with AWS CDK, CDK8s, CDKTf and other construct-based tools.\",\n        suffix: false,\n      }}\n      pageName=\"home\"\n    >\n      <Box position=\"relative\">\n        <Picture\n          alt={\"\"}\n          h=\"540px\"\n          position=\"absolute\"\n          sources={sources.optimal}\n          src={sources.fallback}\n          top=\"0\"\n          w=\"100%\"\n          zIndex=\"hide\"\n        />\n        {/* Hero Section */}\n        <Stack\n          align=\"stretch\"\n          direction=\"column\"\n          justify=\"center\"\n          m=\"0 auto\"\n          maxW=\"container.lg\"\n          p={[10, 15, 20]}\n          spacing={8}\n        >\n          <Stack\n            color=\"blue.800\"\n            data-testid={testIds.headings}\n            spacing={4}\n            textAlign=\"center\"\n          >\n            <Heading size=\"2xl\">\n              Find reusable components for your cloud applications\n            </Heading>\n            <Heading as=\"h3\" size=\"md\">\n              AWS CDK | CDK for Terraform | CDK For Kubernetes\n            </Heading>\n            <Heading as=\"h4\" mb={8} size=\"sm\">\n              Search from{\" \"}\n              {!results.length ? (\n                <Skeleton display=\"inline-block\" h={3} w={8} />\n              ) : (\n                <Box as=\"span\" color=\"blue.500\">\n                  {results.length}\n                </Box>\n              )}{\" \"}\n              construct libraries\n            </Heading>\n          </Stack>\n          <CatalogSearch {...searchAPI} />\n        </Stack>\n\n        {/* TBD: Trending Libraries in favor of catalog results */}\n        <Box p={4} pb={8}>\n          <Results results={page} />\n          <HomePageControls\n            offset={offset}\n            pageLimit={pageLimit}\n            setOffset={setOffset}\n          />\n        </Box>\n      </Box>\n    </Page>\n  );\n};\n"],"sourceRoot":""}

package/build/static/js/2.b57d6cff.chunk.js

@@ -1,2 +0,0 @@
-(this["webpackJsonpconstruct-hub-webapp"]=this["webpackJsonpconstruct-hub-webapp"]||[]).push([[2],{233:function(e,t,a){"use strict";a.d(t,"a",(function(){return o}));var n=a(0),r=a(246),c={home:{event:{name:"Home Load"}},faq:{event:{name:"Frequently Asked Questions Load"}},packageProfile:{event:{name:"Package Profile Load"}},search:{event:{name:"Search Load"}},siteTerms:{event:{name:"Site Terms Load"}},notFound:{page:{pageType:"errorPage"},event:{name:"404 Page Load"}}},i=a(118),s=a(1),o=function(e){var t=e.children,a=e.meta,o=e.pageName,l=Object(i.b)(c[o]);Object(n.useEffect)((function(){l()}),[l]);var u=a.suffix,d=void 0===u||u,j=a.title,b=a.description,f=d?"".concat(j," - Construct Hub"):j;return Object(s.jsxs)(s.Fragment,{children:[Object(s.jsxs)(r.a,{children:[!1,Object(s.jsx)("meta",{content:"width=device-width, initial-scale=1",name:"viewport"}),Object(s.jsx)("meta",{charSet:"utf-8"}),Object(s.jsx)("title",{children:f}),Object(s.jsx)("meta",{content:f,property:"og:title"}),Object(s.jsx)("meta",{content:f,name:"twitter:title"}),Object(s.jsx)("meta",{content:"summary",name:"twitter:card"}),Object(s.jsx)("meta",{content:b,name:"description"}),Object(s.jsx)("meta",{content:b,property:"og:description"}),Object(s.jsx)("meta",{content:b,name:"twitter:description"})]}),t]})}},251:function(e,t,a){"use strict";a.d(t,"a",(function(){return i}));var n=a(224),r=a(47),c=a(1),i=function(e){var t=e.children,a=e.language;return r.e.has(a)?Object(c.jsx)(c.Fragment,{children:t}):Object(c.jsx)(n.a,{hasArrow:!0,label:"Documentation support for ".concat(r.b[a]," is coming soon!"),placement:"top-start",children:Object(c.jsx)("span",{children:t})})}},252:function(e,t,a){"use strict";a.d(t,"a",(function(){return u}));var n=a(6),r=a(23),c=a(19),i=a(195),s=a(598),o=a(1),l=["date","format"],u=Object(c.a)((function(e,t){var a=e.date,c=e.format,u=Object(r.a)(e,l);return Object(o.jsx)(i.a,Object(n.a)(Object(n.a)({as:"time",dateTime:a.toISOString(),ref:t},u),{},{children:Object(s.a)(a,c)}))}));u.displayName="Time"},277:function(e,t,a){"use strict";a.d(t,"a",(function(){return n}));var n=new Set(["aws-cdk","aws","awscdk","cdk-construct","cdk","construct","constructs"])},302:function(e,t,a){"use strict";a.d(t,"a",(function(){return u}));var n=a(6),r=a(23),c=a(356),i=a(116),s=a(83),o=a(1),l=["children","language","value","label","zIndex"],u=function(e){var t=e.children,a=e.language,u=e.value,d=e.label,j=void 0===d?u:d,b=e.zIndex,f=Object(r.a)(e,l);return Object(o.jsx)(s.a,{"aria-label":"Tag: ".concat(j),to:Object(i.c)({query:"".concat(u),language:a}),zIndex:b,children:Object(o.jsx)(c.a,Object(n.a)(Object(n.a)({_hover:{textDecoration:"underline"}},f),{},{children:Object(o.jsx)(c.b,{children:t})}))})}},303:function(e,t,a){"use strict";a.d(t,"b",(function(){return l})),a.d(t,"a",(function(){return u}));var n=a(19),r=a(22),c=a(16),i=a(0);function s(){return s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},s.apply(this,arguments)}function o(e,t){if(null==e)return{};var a,n,r={},c=Object.keys(e);for(n=0;n<c.length;n++)a=c[n],t.indexOf(a)>=0||(r[a]=e[a]);return r}var l=Object(n.a)((function(e,t){var a=e.isExternal,n=e.target,l=e.rel,u=e.className,d=o(e,["isExternal","target","rel","className"]);return i.createElement(r.a.a,s({},d,{ref:t,className:Object(c.d)("chakra-linkbox__overlay",u),rel:a?"noopener noreferrer":l,target:a?"_blank":n,__css:{position:"static","&::before":{content:"''",cursor:"inherit",display:"block",position:"absolute",top:0,left:0,zIndex:0,width:"100%",height:"100%"}}}))})),u=Object(n.a)((function(e,t){var a=e.className,n=o(e,["className"]);return i.createElement(r.a.div,s({ref:t,position:"relative"},n,{className:Object(c.d)("chakra-linkbox",a),__css:{"a[href]:not(.chakra-linkbox__overlay), abbr[title]":{position:"relative",zIndex:1}}}))}))},354:function(e,t,a){"use strict";a.d(t,"a",(function(){return P}));var n=a(0),r=a(5),c=a(17),i=a(6),s=a(229),o=a(303),l=a(199),u=a(208),d=a(195),j=a(210),b=a(203),f=a(29),O=a(277),h=a(47),m=a(116),p=a(251),v=a(302),x=a(252),g=a(148),w=a(120),y=a(56),k=Object(y.a)("catalogCard",["container","name","version","tags","description","date","author","languages"]),N=a(1),L=function(e){var t=e.children;return Object(N.jsx)(w.a,{h:64,p:0,w:"100%",children:Object(N.jsx)(g.a,{as:"article",h:"100%",overflow:"hidden",templateColumns:"1fr",templateRows:"2fr 1fr",children:t})})},S=function(e){var t=e.children;return e.isLink?Object(N.jsx)(o.a,{_hover:{"> :first-child":{bg:"gray.50"}},"data-testid":k.container,children:Object(N.jsx)(L,{children:t})}):Object(N.jsx)(L,{children:t})},_=a(603),E=function(){return Object(N.jsxs)(N.Fragment,{children:[Object(N.jsxs)(s.a,{p:4,spacing:4,children:[Object(N.jsx)(_.a,{h:5,w:"50%"}),Object(N.jsxs)(s.a,{align:"center",direction:"row",spacing:2,children:[Object(N.jsx)(_.a,{h:5,w:10}),Object(N.jsx)(_.a,{h:5,w:10}),Object(N.jsx)(_.a,{h:5,w:10})]}),Object(N.jsx)(_.a,{h:3,w:"75%"}),Object(N.jsx)(_.a,{h:3,w:"50%"})]}),Object(N.jsxs)(d.a,{children:[Object(N.jsx)(j.a,{}),Object(N.jsxs)(s.a,{px:4,py:2,spacing:2,children:[Object(N.jsx)(_.a,{h:5,w:"25%"}),Object(N.jsxs)(s.a,{align:"center",direction:"row",spacing:2,children:[Object(N.jsx)(_.a,{h:5,w:10}),Object(N.jsx)(_.a,{h:5,w:10}),Object(N.jsx)(_.a,{h:5,w:10}),Object(N.jsx)(_.a,{h:5,w:10})]})]})]})]})},T=function(e){var t,a,n,g,w=e.language,y=e.pkg;if(!y)return Object(N.jsx)(S,{children:Object(N.jsx)(E,{})});var L=(null===(t=y.metadata)||void 0===t?void 0:t.date)?Object(N.jsx)(x.a,{date:new Date(y.metadata.date),fontSize:"sm",format:"MMMM dd, yyyy"}):null,_=null!==(a=y.author)&&void 0!==a?a:{},T=null!==(n=y.languages)&&void 0!==n?n:{},z=Object.keys(T),I=function(e){return Object(m.a)(Object(i.a)({name:y.name,version:y.version,language:w},e))},C="string"===typeof _?_:_.name;return Object(N.jsxs)(S,{isLink:!0,children:[Object(N.jsxs)(s.a,{maxH:"100%",maxW:"100%",overflow:"hidden",p:4,spacing:0,children:[Object(N.jsx)(o.b,{as:f.b,to:I(),children:Object(N.jsxs)(l.a,{color:"blue.800","data-testid":k.name,fontWeight:"semibold",isTruncated:!0,children:[y.name,Object(N.jsx)(l.a,{as:"span",color:"blue.500","data-testid":k.version,fontSize:"xs",ml:2,children:y.version})]})}),Object(N.jsx)(o.a,{as:u.a,"data-testid":k.tags,flexWrap:"wrap",maxH:6,overflow:"hidden",children:[y.name.startsWith("@aws-cdk/")?Object(N.jsx)(v.a,{label:"official",language:w,mr:1,value:"@aws-cdk",variant:"official",children:"Official"},"official"):null].concat(Object(c.a)((null!==(g=y.keywords)&&void 0!==g?g:[]).filter((function(e){return Boolean(e)&&!O.a.has(e)})).slice(0,3).map((function(e){return Object(N.jsx)(v.a,{language:w,mr:1,value:'"'.concat(e,'"'),zIndex:"0 !important",children:e},e)}))))}),Object(N.jsx)(l.a,{"data-testid":k.description,fontSize:"sm",noOfLines:2,children:y.description})]}),Object(N.jsxs)(d.a,{children:[Object(N.jsx)(j.a,{}),Object(N.jsxs)(s.a,{maxW:"100%",overflow:"hidden",px:4,py:2,spacing:2,children:[Object(N.jsx)(l.a,{"data-testid":k.date,fontSize:"sm",isTruncated:!0,children:L}),Object(N.jsx)(b.a,{as:f.b,color:"blue.500","data-testid":k.author,fontSize:"sm",to:Object(m.c)({query:C}),children:C}),Object(N.jsx)(o.a,{align:"center",as:s.a,"data-testid":k.languages,direction:"row",children:Object.entries(h.c).sort((function(e,t){var a=Object(r.a)(e,1)[0],n=Object(r.a)(t,1)[0];return h.a.indexOf(a)-h.a.indexOf(n)})).map((function(e){var t=Object(r.a)(e,2),a=t[0],n=t[1],c=a,i=c===h.d.TypeScript||z.includes(c),s=c===h.d.TypeScript||h.e.has(c);if(!i)return null;var o=n.name,l=n.icon,u=Object(N.jsx)(l,{"aria-label":"Supports ".concat(o),h:6,opacity:s?1:.2,w:6});return Object(N.jsx)(p.a,{language:c,children:s?Object(N.jsx)(f.b,{"aria-label":"View package docs for ".concat(c),to:I({language:c}),children:u}):u},c)}))})]})]})]})},z=a(209),I=function(e){var t=e.children;return Object(N.jsx)(z.a,{columns:{base:1,sm:2,md:3,lg:4,xl:5,"2xl":6},spacing:6,children:t})},C=function(e){var t=e.language,a=e.results;return Object(N.jsx)(I,{children:a.map((function(e,a){return Object(N.jsx)(T,{language:t,pkg:e},"".concat(e.name,"-").concat(a))}))})},P=Object(n.memo)(C)},356:function(e,t,a){"use strict";a.d(t,"a",(function(){return j})),a.d(t,"b",(function(){return b}));var n=a(104),r=a(19),c=a(63),i=a(36),s=a(62),o=a(22),l=a(8),u=a(0);function d(){return d=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},d.apply(this,arguments)}var j=Object(r.a)((function(e,t){var a=Object(c.a)("Tag",e),n=Object(i.b)(e),r=d({display:"inline-flex",verticalAlign:"top",alignItems:"center",maxWidth:"100%"},a.container);return u.createElement(s.b,{value:a},u.createElement(o.a.span,d({ref:t},n,{__css:r})))}));l.a&&(j.displayName="Tag");var b=Object(r.a)((function(e,t){var a=Object(s.d)();return u.createElement(o.a.span,d({ref:t,isTruncated:!0},e,{__css:a.label}))}));l.a&&(b.displayName="TagLabel");var f=Object(r.a)((function(e,t){return u.createElement(n.a,d({ref:t,verticalAlign:"top",marginEnd:"0.5rem"},e))}));l.a&&(f.displayName="TagLeftIcon");var O=Object(r.a)((function(e,t){return u.createElement(n.a,d({ref:t,verticalAlign:"top",marginStart:"0.5rem"},e))}));l.a&&(O.displayName="TagRightIcon");var h=function(e){return u.createElement(n.a,d({verticalAlign:"inherit",viewBox:"0 0 512 512"},e),u.createElement("path",{fill:"currentColor",d:"M289.94 256l95-95A24 24 0 00351 127l-95 95-95-95a24 24 0 00-34 34l95 95-95 95a24 24 0 1034 34l95-95 95 95a24 24 0 0034-34z"}))};l.a&&(h.displayName="TagCloseIcon");l.a},357:function(e,t,a){"use strict";a.d(t,"a",(function(){return r}));var n=a(76),r=Object(n.a)({d:"M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z",displayName:"ArrowForwardIcon"})},358:function(e,t,a){"use strict";a.d(t,"a",(function(){return r}));var n=a(76),r=Object(n.a)({d:"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z",displayName:"ChevronLeftIcon"})},359:function(e,t,a){"use strict";a.d(t,"a",(function(){return r}));var n=a(76),r=Object(n.a)({d:"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z",displayName:"ChevronRightIcon"})},603:function(e,t,a){"use strict";a.d(t,"a",(function(){return O}));a(5),a(62);var n=a(8);a(26),a(115);a(226);var r=a(0);var c=a(22),i=a(58),s=a(19),o=a(63),l=a(36);var u=a(16);function d(){return d=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},d.apply(this,arguments)}function j(e,t){if(null==e)return{};var a,n,r={},c=Object.keys(e);for(n=0;n<c.length;n++)a=c[n],t.indexOf(a)>=0||(r[a]=e[a]);return r}var b=Object(c.a)("div",{baseStyle:{boxShadow:"none",backgroundClip:"padding-box",cursor:"default",color:"transparent",pointerEvents:"none",userSelect:"none","&::before, &::after, *":{visibility:"hidden"}}}),f=Object(i.b)({from:{opacity:0},to:{opacity:1}}),O=Object(s.a)((function(e,t){var a=Object(o.b)("Skeleton",e),n=function(){var e=r.useRef(!0);return r.useEffect((function(){e.current=!1}),[]),e.current}(),i=Object(l.b)(e),s=i.isLoaded,O=i.fadeDuration,h=i.className,m=j(i,["startColor","endColor","isLoaded","fadeDuration","speed","className"]),p=function(e){var t=Object(r.useRef)();return Object(r.useEffect)((function(){t.current=e}),[e]),t.current}(s),v=Object(u.d)("chakra-skeleton",h);if(s){var x=n||p?"none":f+" "+O+"s";return r.createElement(c.a.div,d({ref:t,className:v,__css:{animation:x}},m))}return r.createElement(b,d({ref:t,className:v},m,{__css:a}))}));O.defaultProps={fadeDuration:.4,speed:.8},n.a&&(O.displayName="Skeleton");n.a;n.a}}]);
-//# sourceMappingURL=2.b57d6cff.chunk.js.map

package/build/static/js/2.b57d6cff.chunk.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["constants/pageInfo.ts","components/Page/Page.tsx","components/LanguageSupportTooltip/LanguageSupportTooltip.tsx","components/Time/Time.tsx","constants/keywords.ts","components/PackageTag/PackageTag.tsx","../../../src/link-box.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","../../../src/tag.tsx","../../../src/ArrowForward.tsx","../../../src/ChevronLeft.tsx","../../../src/ChevronRight.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","LanguageSupportTooltip","language","TEMP_SUPPORTED_LANGUAGES","has","hasArrow","label","LANGUAGE_NAME_MAP","placement","Time","forwardRef","ref","date","formatString","format","boxProps","as","dateTime","toISOString","displayName","KEYWORD_IGNORE_LIST","Set","PackageTag","value","zIndex","tagProps","NavLink","to","getSearchPath","query","_hover","textDecoration","LinkOverlay","className","cx","rel","isExternal","target","__css","position","cursor","display","top","left","width","height","LinkBox","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","Tag","styles","useMultiStyleConfig","ownProps","omitThemingProps","containerStyles","verticalAlign","alignItems","maxWidth","TagLabel","useStyles","TagLeftIcon","marginEnd","TagRightIcon","marginStart","TagCloseIcon","props","viewBox","fill","d","ArrowForwardIcon","createIcon","ChevronLeftIcon","ChevronRightIcon","StyledSkeleton","chakra","baseStyle","boxShadow","backgroundClip","pointerEvents","userSelect","visibility","fade","keyframes","from","Skeleton","useStyleConfig","isFirstRender","React","useIsFirstRender","wasPreviouslyLoaded","useRef","usePrevious","_className","animation","fadeDuration","speed"],"mappings":"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","file":"static/js/2.b57d6cff.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","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\n    if (isSupported) {\n      return <>{children}</>;\n    }\n\n    return (\n      <Tooltip\n        hasArrow\n        label={`Documentation support for ${LANGUAGE_NAME_MAP[language]} is coming soon!`}\n        placement=\"top-start\"\n      >\n        <span>{children}</span>\n      </Tooltip>\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","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 { 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 { 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 { 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 { Icon, IconProps } from \"@chakra-ui/icon\"\nimport {\n  chakra,\n  forwardRef,\n  omitThemingProps,\n  StylesProvider,\n  SystemStyleObject,\n  ThemingProps,\n  useMultiStyleConfig,\n  useStyles,\n  HTMLChakraProps,\n} from \"@chakra-ui/system\"\nimport { __DEV__ } from \"@chakra-ui/utils\"\nimport * as React from \"react\"\n\nexport interface TagProps\n  extends HTMLChakraProps<\"span\">,\n    ThemingProps<\"Tag\"> {}\n\n/**\n * The tag component is used to label or categorize UI elements.\n * To style the tag globally, change the styles in `theme.components.Tag`\n * @see Docs https://chakra-ui.com/tag\n */\nexport const Tag = forwardRef<TagProps, \"span\">((props, ref) => {\n  const styles = useMultiStyleConfig(\"Tag\", props)\n  const ownProps = omitThemingProps(props)\n\n  const containerStyles: SystemStyleObject = {\n    display: \"inline-flex\",\n    verticalAlign: \"top\",\n    alignItems: \"center\",\n    maxWidth: \"100%\",\n    ...styles.container,\n  }\n\n  return (\n    <StylesProvider value={styles}>\n      <chakra.span ref={ref} {...ownProps} __css={containerStyles} />\n    </StylesProvider>\n  )\n})\n\nif (__DEV__) {\n  Tag.displayName = \"Tag\"\n}\n\nexport interface TagLabelProps extends HTMLChakraProps<\"span\"> {}\n\nexport const TagLabel = forwardRef<TagLabelProps, \"span\">((props, ref) => {\n  const styles = useStyles()\n  return <chakra.span ref={ref} isTruncated {...props} __css={styles.label} />\n})\n\nif (__DEV__) {\n  TagLabel.displayName = \"TagLabel\"\n}\n\nexport const TagLeftIcon = forwardRef<IconProps, \"svg\">((props, ref) => (\n  <Icon ref={ref} verticalAlign=\"top\" marginEnd=\"0.5rem\" {...props} />\n))\n\nif (__DEV__) {\n  TagLeftIcon.displayName = \"TagLeftIcon\"\n}\n\nexport const TagRightIcon = forwardRef<IconProps, \"svg\">((props, ref) => (\n  <Icon ref={ref} verticalAlign=\"top\" marginStart=\"0.5rem\" {...props} />\n))\n\nif (__DEV__) {\n  TagRightIcon.displayName = \"TagRightIcon\"\n}\n\nconst TagCloseIcon: React.FC<IconProps> = (props) => (\n  <Icon verticalAlign=\"inherit\" viewBox=\"0 0 512 512\" {...props}>\n    <path\n      fill=\"currentColor\"\n      d=\"M289.94 256l95-95A24 24 0 00351 127l-95 95-95-95a24 24 0 00-34 34l95 95-95 95a24 24 0 1034 34l95-95 95 95a24 24 0 0034-34z\"\n    />\n  </Icon>\n)\n\nif (__DEV__) {\n  TagCloseIcon.displayName = \"TagCloseIcon\"\n}\n\nexport interface TagCloseButtonProps\n  extends Omit<HTMLChakraProps<\"button\">, \"disabled\"> {\n  isDisabled?: boolean\n}\n\n/**\n * TagCloseButton is used to close \"remove\" the tag\n * @see Docs https://chakra-ui.com/tag\n */\nexport const TagCloseButton: React.FC<TagCloseButtonProps> = (props) => {\n  const { isDisabled, children, ...rest } = props\n\n  const styles = useStyles()\n\n  const btnStyles: SystemStyleObject = {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    outline: \"0\",\n    ...styles.closeButton,\n  }\n\n  return (\n    <chakra.button\n      {...rest}\n      type=\"button\"\n      aria-label=\"close\"\n      disabled={isDisabled}\n      __css={btnStyles}\n    >\n      {children || <TagCloseIcon />}\n    </chakra.button>\n  )\n}\n\nif (__DEV__) {\n  TagCloseButton.displayName = \"TagCloseButton\"\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 { 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 ChevronRightIcon = createIcon({\n  d: \"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\",\n  displayName: \"ChevronRightIcon\",\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":""}