Merge pull request #274 from carbonplan/freeman-lab/climate-risk-asse…

…ssments new article
carbonplan · Jul 17, 2023 · c49a7b2 · c49a7b2 · vercel · Jul 17, 2023
2 parents 4ea0bb2 + 451bfaa
commit c49a7b2
Show file tree

Hide file tree

Showing 7 changed files with 904 additions and 0 deletions.
diff --git a/articles/climate-risk-assessments/components/circle.js b/articles/climate-risk-assessments/components/circle.js
@@ -0,0 +1,62 @@
+import { Box } from 'theme-ui'
+
+const PATHS = {
+  1: 'M11.7231 17.1001H12.8711C12.9691 17.1001 13.0111 17.0581 13.0111 16.9601V7.4401C13.0111 7.3421 12.9691 7.3001 12.8711 7.3001H12.2271C12.1431 7.3001 12.0871 7.3281 12.0171 7.3701L9.72113 8.6161C9.63713 8.6581 9.56713 8.7281 9.56713 8.8261V10.0441C9.56713 10.1421 9.60913 10.1701 9.67913 10.1701C9.72113 10.1701 9.76313 10.1561 9.81913 10.1281L11.5831 9.1481V16.9601C11.5831 17.0581 11.6251 17.1001 11.7231 17.1001Z',
+  2: 'M8.81913 16.7998H15.1611C15.2591 16.7998 15.3011 16.7578 15.3011 16.6598V15.5818C15.3011 15.4838 15.2591 15.4418 15.1611 15.4418H10.7931L13.6071 12.7678C14.5451 11.8858 15.0071 11.0598 15.0071 9.7858C15.0071 8.0778 13.8031 6.8598 11.8851 6.8598C9.92513 6.8598 8.70713 8.2878 8.69313 9.9258C8.69313 10.0798 8.76313 10.1358 8.86113 10.1358H9.91113C10.0371 10.1358 10.0931 10.0938 10.0931 9.9258C10.1351 8.9318 10.7931 8.2178 11.8851 8.2178C12.9351 8.2178 13.5931 8.8898 13.5931 9.8418C13.5931 10.5698 13.3551 11.1998 12.6551 11.8718L8.83313 15.4978C8.73513 15.5818 8.67913 15.6798 8.67913 15.8198V16.6598C8.67913 16.7578 8.72113 16.7998 8.81913 16.7998Z',
+  3: 'M11.9551 17.14C13.9851 17.14 15.3991 16.02 15.3991 14.144C15.3991 12.716 14.5731 12.016 13.8171 11.708C14.5591 11.232 14.9651 10.56 14.9651 9.566C14.9651 8.082 13.6911 7.06 11.9411 7.06C10.3311 7.06 8.98713 8.138 8.86113 9.762C8.84713 9.944 8.94513 10.014 9.05713 10.014H10.0791C10.1911 10.014 10.2471 10 10.2611 9.846C10.3871 8.922 11.1011 8.418 11.9691 8.418C12.8931 8.418 13.5791 8.894 13.5791 9.706C13.5791 10.574 13.0331 11.092 11.8851 11.092H11.1431C11.0451 11.092 10.9891 11.134 10.9891 11.246V12.31C10.9891 12.422 11.0311 12.464 11.1431 12.464H11.9411C13.2571 12.464 13.9711 13.052 13.9711 14.046C13.9711 15.222 13.1311 15.782 11.9971 15.782C10.9051 15.782 10.0511 15.18 9.92513 13.976C9.91113 13.822 9.84113 13.794 9.72913 13.794H8.70713C8.60913 13.794 8.51113 13.85 8.52513 14.046C8.65113 15.922 10.0371 17.14 11.9551 17.14Z',
+  4: 'M12.5471 16.7998H13.6671C13.7791 16.7998 13.8211 16.7578 13.8211 16.6598V14.9658H15.2071C15.3051 14.9658 15.3471 14.9238 15.3471 14.8258V13.7478C15.3471 13.6498 15.3051 13.6078 15.2071 13.6078H13.8211V7.1398C13.8211 7.0418 13.7791 6.9998 13.6811 6.9998H12.8131C12.7291 6.9998 12.6731 7.0418 12.6311 7.1118L8.17913 13.7198C8.10913 13.8178 8.06713 13.9018 8.06713 14.0418V14.8258C8.06713 14.9238 8.10913 14.9658 8.20713 14.9658H12.4071V16.6598C12.4071 16.7578 12.4491 16.7998 12.5471 16.7998ZM9.77513 13.6078L12.4071 9.7158V13.6078H9.77513Z',
+  5: 'M12.0284 17.2401C13.9464 17.2401 15.4444 16.1061 15.4444 13.8941C15.4444 11.8081 14.2264 10.6041 12.3224 10.6041C11.4824 10.6041 10.8244 10.8421 10.2364 11.2061L10.6004 8.6581H14.7864C14.8844 8.6581 14.9264 8.6161 14.9264 8.5181V7.4401C14.9264 7.3421 14.8844 7.3001 14.7864 7.3001H9.46644C9.36844 7.3001 9.34044 7.3421 9.32644 7.4401L8.72444 12.7041C8.71044 12.7881 8.76644 12.8441 8.85044 12.8441H9.85844C9.97044 12.8441 10.0264 12.7881 10.0964 12.7181C10.6704 12.2141 11.2864 11.9621 12.0424 11.9621C13.2744 11.9621 14.0304 12.7181 14.0304 13.9221C14.0304 15.1681 13.2604 15.8821 12.0704 15.8821C11.0344 15.8821 10.2504 15.2801 10.0684 14.2861C10.0404 14.1181 9.99844 14.0761 9.88644 14.0761H8.82244C8.72444 14.0761 8.65444 14.1321 8.65444 14.3001C8.79444 16.0641 10.0964 17.2401 12.0284 17.2401Z',
+  6: 'M12.0389 17.14C13.7889 17.14 15.4129 15.95 15.4129 13.906C15.4129 11.862 14.0409 10.672 12.2209 10.672C11.3809 10.672 10.5549 10.952 9.93888 11.54C10.0789 9.23 10.9889 8.39 12.0669 8.39C12.8089 8.39 13.4809 8.698 13.7469 9.594C13.7749 9.678 13.8029 9.734 13.9009 9.734H15.0069C15.0909 9.734 15.1749 9.706 15.1609 9.594C14.9649 8.068 13.7609 7.06 12.0669 7.06C9.95288 7.06 8.45488 8.768 8.45488 12.534C8.45488 15.894 10.0649 17.14 12.0389 17.14ZM12.0669 15.782C10.8909 15.782 10.1489 15.012 10.1489 13.906C10.1489 12.8 10.8909 12.03 12.0669 12.03C13.2569 12.03 13.9989 12.8 13.9989 13.906C13.9989 15.012 13.2569 15.782 12.0669 15.782Z',
+  7: 'M10.39 17.2998H11.538C11.608 17.2998 11.664 17.2718 11.692 17.2018L14.996 8.7878C15.052 8.6338 15.066 8.5638 15.066 8.4378V7.6398C15.066 7.5418 15.024 7.4998 14.926 7.4998H8.766C8.668 7.4998 8.626 7.5418 8.626 7.6398V8.7178C8.626 8.8158 8.668 8.8578 8.766 8.8578H13.512L10.292 17.0898C10.278 17.1318 10.264 17.1598 10.264 17.2018C10.264 17.2578 10.306 17.2998 10.39 17.2998Z',
+}
+
+const Circle = ({
+  id,
+  active,
+  hovered,
+  setActive,
+  setHovered,
+  sx,
+  ...props
+}) => {
+  return (
+    <Box
+      as='svg'
+      width='24'
+      height='24'
+      viewBox='0 0 24 24'
+      fill='none'
+      xmlns='http://www.w3.org/2000/svg'
+      sx={{
+        cursor: 'pointer',
+        '& circle': {
+          stroke: hovered === id ? 'primary' : 'yellow',
+          fill: 'background',
+          strokeOpacity: [hovered, active].includes(id) ? 1 : 0.4,
+          transition: '0.2s',
+        },
+        '& path': {
+          fill: hovered === id ? 'primary' : 'yellow',
+          fillOpacity: [hovered, active].includes(id) ? 1 : 0.4,
+          transition: '0.2s',
+        },
+        ...sx,
+      }}
+      onClick={() => setActive && setActive(id)}
+      onMouseEnter={() => setHovered && setHovered(id)}
+      onMouseLeave={() => setHovered && setHovered(null)}
+      {...props}
+    >
+      <circle
+        cx='12'
+        cy='12'
+        r='11.25'
+        strokeWidth='1.5'
+        strokeDasharray={id.includes('*') ? '3 3' : ''}
+      />
+      <path d={PATHS[id.replace('*', '')]} />
+    </Box>
+  )
+}
+
+export default Circle
diff --git a/articles/climate-risk-assessments/components/data-sources.js b/articles/climate-risk-assessments/components/data-sources.js
@@ -0,0 +1,136 @@
+import { Table } from '@carbonplan/components'
+import { Check as CheckInner } from '@carbonplan/icons'
+import { Box, Flex } from 'theme-ui'
+
+const Heading = ({ children, example, sx }) => (
+  <Box
+    sx={{
+      fontSize: [0, 0, 0, 1],
+      fontFamily: 'body',
+      letterSpacing: 'body',
+      mr: -1,
+      mb: [2, 0, 0, 0],
+      ...sx,
+    }}
+  >
+    {children}
+    {example && <Box sx={{ color: 'secondary', mt: 1 }}>{example}</Box>}
+  </Box>
+)
+
+const Check = () => {
+  return (
+    <Flex sx={{ height: '100%', alignItems: 'center' }}>
+      <CheckInner height={18} />
+    </Flex>
+  )
+}
+
+const DataSources = () => {
+  return (
+    <Table
+      columns={[5, 7, 7, 7]}
+      start={[
+        [1],
+        [1, 3, 3, 3],
+        [2, 4, 4, 4],
+        [3, 5, 5, 5],
+        [4, 6, 6, 6],
+        [5, 7, 7, 7],
+      ]}
+      width={[[5, 2, 2, 2], [1], [1], [1], [1], [1]]}
+      sx={{ '& td': { fontSize: 0 } }}
+      data={[
+        [
+          '',
+          'Climate science',
+          'Energy-system modeling',
+          'Energy economics',
+          'Financial risk',
+          'Energy law and policy',
+        ].map((d) => (
+          <Heading key={d} sx={{ mr: 0, mb: 0 }}>
+            {d}
+          </Heading>
+        )),
+        [
+          <Heading key='heading' example='(e.g., CMIP5, CMIP6, RCPS, SSPS)'>
+            Future projections from global climate models
+          </Heading>,
+          <Check key='1' />,
+          <Check key='2' />,
+          <Check key='3' />,
+          '',
+          '',
+        ],
+        [
+          <Heading
+            key='heading'
+            example='(e.g., weather station data from NOAA’S National Centers for Environmental Information (NCEI))'
+          >
+            Historical weather data
+          </Heading>,
+          <Check key='1' />,
+          '',
+          '',
+          '',
+          '',
+        ],
+        [
+          <Heading key='heading' example='(e.g., ERA5 reanalysis)'>
+            Historical reanalysis of global climate data
+          </Heading>,
+          <Check key='1' />,
+          <Check key='2' />,
+          <Check key='3' />,
+          '',
+          '',
+        ],
+        [
+          <Heading key='heading' example='(e.g., 427)'>
+            Asset-level climate risk data from private providers
+          </Heading>,
+          '',
+          '',
+          '',
+          <Check key='4' />,
+          '',
+        ],
+        [
+          <Heading
+            key='heading'
+            example='(e.g., National Climate Assessment, IPCC Sixth Assessment Report)'
+          >
+            Summary governmental climate reports
+          </Heading>,
+          '',
+          '',
+          '',
+          '',
+          <Check key='5' />,
+        ],
+        [
+          <Heading key='heading'>Hsiang et al., 2017</Heading>,
+          '',
+          <Check key='2' />,
+          '',
+          <Check key='4' />,
+          '',
+        ],
+        [
+          <Heading key='heading'>
+            Other (unspecified) peer-reviewed literature
+          </Heading>,
+          '',
+          '',
+          '',
+          <Check key='4' />,
+          <Check key='5' />,
+        ],
+      ]}
+      index={false}
+    />
+  )
+}
+
+export default DataSources
diff --git a/articles/climate-risk-assessments/components/flow-chart.js b/articles/climate-risk-assessments/components/flow-chart.js
diff --git a/articles/climate-risk-assessments/components/inline-secondary-code.js b/articles/climate-risk-assessments/components/inline-secondary-code.js
@@ -0,0 +1,22 @@
+import { Box } from 'theme-ui'
+
+const InlineSecondaryCode = ({ children }) => {
+  return (
+    <Box
+      as='span'
+      sx={{
+        pb: ['3px'],
+        pt: ['1px'],
+        mx: ['1px'],
+        fontSize: [1, 1, 1, 2],
+        fontFamily: 'mono',
+        letterSpacing: 'mono',
+        color: 'secondary',
+      }}
+    >
+      {children}
+    </Box>
+  )
+}
+
+export default InlineSecondaryCode