{"version":3,"sources":["webpack://cep-gatsby-starter-code/./src/components/Resource/Action.js","webpack://cep-gatsby-starter-code/./src/components/Resource/index.js","webpack://cep-gatsby-starter-code/./src/components/Video/index.js","webpack://cep-gatsby-starter-code/./src/pages/classroom-resources/phonics.js","webpack://cep-gatsby-starter-code/./src/utils/resource-helper.js"],"names":["label","metadata","module","moduleName","link","download","noIcon","asLink","index","videoGuid","useStaticQuery","site","className","Link","to","Icon","marginRight","name","Button","target","forceExternal","data-click-type","data-click-name","rel","isSecondary","Modal","video","trigger","Video","guidSrc","autoPlay","Resource","tophat","tophatColor","img","icon","subject","title","subtitle","duration","description","actions","horizontal","alignedButtons","withBorder","getClassNames","classNames","renderImage","image","Image","filename","linkFromImg","actionProps","style","renderContent","dangerouslySetInnerHTML","__html","map","action","i","key","size","defaultProps","src","poster","autoplay","other","useState","ready","setReady","hostname","setHostname","useImageQuery","getFinalImagePath","getFinalImagePathByFilename","useEffect","window","location","protocol","port","qs","startsWith","imagePath","encodeURI","siteMetadata","gaId","getQueryString","width","height","frameBorder","allowFullScreen","scrolling","data","getKeyedResources","phonicsAlphabeticPrinciple","phonicsDecoding","phonicsWordStudy","phonicsMasterclass","taskCards","phonicsRtuAlphabetic","phonicsRtuDecoding","phonicsRtuWordStudy","isTabExpanded","setIsTabExpanded","alt","onClick","padding","allResourcesJson","edges","reduce","acc","curr","push","node","getRawResources","slug","splitSlug","split","length","charAt","toUpperCase","slice","join","deslugify"],"mappings":"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","file":"component---src-pages-classroom-resources-phonics-js-99075c5af2aa94d2a524.js","sourcesContent":["import { Link, graphql, useStaticQuery } from 'gatsby';\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport Button from '../Button';\nimport Icon from '../Icon';\n\nimport Modal from '../Modal';\nimport Video from '../Video';\nimport './styles.scss';\n\nconst Action = ({\n label,\n metadata,\n module,\n moduleName,\n link,\n download,\n noIcon,\n asLink,\n index,\n videoGuid,\n}) => {\n const { site } = useStaticQuery(\n graphql`\n query {\n site {\n siteMetadata {\n siteUrl\n tweetText\n emailSubject\n emailBody\n programHashtag\n }\n }\n }\n `\n );\n\n const renderModuleLink = () => {\n return (\n \n {!noIcon && (\n \n )}\n {label}\n \n );\n };\n\n const renderLink = () => {\n return asLink ? (\n \n {!noIcon && (\n \n )}\n {label}\n \n ) : (\n \n );\n };\n\n const renderDownload = () => {\n return (\n \n {!noIcon && (\n \n )}\n {label}\n \n );\n };\n\n const renderVideo = () => {\n return (\n \n {!noIcon && (\n \n )}\n {label}\n \n }\n >\n \n \n );\n };\n return (\n
\n {link && renderLink()}\n {module && renderModuleLink()}\n {download && renderDownload()}\n {metadata && {metadata}}\n {videoGuid && renderVideo()}\n
\n );\n};\n\nAction.propTypes = {\n label: PropTypes.node.isRequired,\n metadata: PropTypes.string,\n module: PropTypes.string,\n download: PropTypes.string,\n noIcon: PropTypes.bool,\n asLink: PropTypes.bool,\n};\n\nexport default Action;\n","import classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport { Column, Container, Row } from '../Grid';\nimport Icon from '../Icon';\nimport Image from '../Image';\nimport Action from './Action';\n\nimport './styles.scss';\n\nconst Resource = ({\n tophat,\n tophatColor,\n img,\n icon,\n subject,\n title,\n subtitle,\n duration,\n description,\n actions,\n horizontal,\n className,\n alignedButtons,\n withBorder,\n}) => {\n const getClassNames = () =>\n classNames(\n 'resource',\n horizontal && 'resource--horizontal',\n withBorder && 'resource--bordered',\n className\n );\n\n const renderImage = () => {\n let image = (\n <>\n \n {icon && }\n \n );\n\n if (actions && actions[0].linkFromImg) {\n const { metadata, label, ...actionProps } = actions[0];\n image = (\n \n );\n }\n\n return (\n <>\n {tophat && (\n \n {tophat}\n \n )}\n
{image}
\n \n );\n };\n\n const renderContent = () => {\n return (\n
\n {subject &&
{subject}
}\n

{title}

\n {subtitle &&
{subtitle}
}\n {duration && (\n
\n {duration}\n
\n )}\n {description && (\n
\n )}\n {actions && (\n \n {actions.map((action, i) => {\n return ;\n })}\n \n )}\n \n )};\n\n if (horizontal) {\n return (\n \n
\n \n {renderImage()}\n {renderContent()}\n \n
\n \n );\n }\n\n return (\n
\n {renderImage()}\n {renderContent()}\n
\n );\n};\n\nResource.defaultProps = {\n tophat: null,\n subject: null,\n subtitle: null,\n duration: null,\n description: null,\n actions: null,\n horizontal: false,\n className: null,\n alignedButtons: true,\n withBorder: true,\n};\n\nResource.propTypes = {\n /** The image's file name */\n img: PropTypes.string.isRequired,\n /** The icon's file name */\n icon: PropTypes.string,\n /** Text for the tophat */\n tophat: PropTypes.string,\n /** The subject */\n subject: PropTypes.string,\n /** The title */\n title: PropTypes.string.isRequired,\n /** The subtitle */\n subtitle: PropTypes.string,\n /** The duration */\n duration: PropTypes.string,\n /** The description */\n description: PropTypes.node,\n /** The actions */\n actions: PropTypes.arrayOf(PropTypes.object),\n /** Horizontal orientation */\n horizontal: PropTypes.bool,\n /** A custom class name */\n className: PropTypes.string,\n /** Align buttons in multiple cards horizontally */\n alignedButtons: PropTypes.bool,\n /** Surround the card with a border */\n withBorder: PropTypes.bool,\n};\n\nexport default Resource;\n","import classNames from 'classnames';\nimport { graphql, useStaticQuery } from 'gatsby';\nimport PropTypes from 'prop-types';\nimport React, { useEffect, useState } from 'react';\nimport useImageQuery from '../../hooks/useImageQuery';\nimport './styles.scss';\n\nconst Video = ({\n src,\n guidSrc,\n poster,\n autoplay,\n title,\n className,\n ...other\n}) => {\n const [ready, setReady] = useState(false);\n const [hostname, setHostname] = useState('');\n const { getFinalImagePath, getFinalImagePathByFilename } = useImageQuery();\n\n const { site } = useStaticQuery(graphql`\n query {\n site {\n siteMetadata {\n gaId\n }\n }\n }\n `);\n\n // This will run once after the initial render.\n useEffect(() => {\n setHostname(\n window.location.protocol +\n '//' +\n window.location.hostname +\n (window.location.port ? ':' + window.location.port : '')\n );\n setReady(true);\n }, []);\n\n const getQueryString = () => {\n let qs = `videoSrc=${src}`;\n\n if (poster) {\n if (poster.startsWith('https://') || poster.startsWith('http://')) {\n qs += `&posterSrc=${poster}`;\n } else {\n // If we reach here, this must be a local path\n let imagePath = getFinalImagePath(poster);\n if (!imagePath) {\n imagePath = getFinalImagePathByFilename(poster);\n }\n qs += `&posterSrc=${encodeURI(hostname + imagePath)}`;\n }\n }\n if (site.siteMetadata.gaId) {\n qs += `&gaId=${site.siteMetadata.gaId}`;\n }\n\n return qs;\n };\n\n return (\n <>\n {ready && (\n
\n \n
\n )}\n \n );\n};\n\nVideo.defaultProps = {\n src: null,\n poster: null,\n autoplay: false,\n className: null,\n};\n\nVideo.propTypes = {\n /** The URL of the video src. */\n src: PropTypes.string,\n /** The GUID of the DEX video. */\n guidSrc: PropTypes.string,\n /** The title of the video */\n title: PropTypes.string.isRequired,\n /** The URL for a poster image */\n poster: PropTypes.string,\n /** Toggle autoplay */\n autoplay: PropTypes.bool,\n /** A custom class name */\n className: PropTypes.string,\n};\n\nexport default Video;\n","import { graphql, Link } from 'gatsby';\nimport React, { useState } from 'react';\nimport { Column, Container, Row } from '../../components/Grid';\nimport Layout from '../../components/Layout';\nimport Section from '../../components/Section';\nimport Video from '../../components/Video';\nimport { getKeyedResources } from '../../utils/resource-helper';\nimport Resource from '../../components/Resource';\nimport Image from '../../components/Image';\n\nconst ClassroomResourcesPage = ({ data }) => {\n const {\n phonicsAlphabeticPrinciple,\n phonicsDecoding,\n phonicsWordStudy,\n phonicsMasterclass,\n taskCards,\n phonicsRtuAlphabetic,\n phonicsRtuDecoding,\n phonicsRtuWordStudy,\n } = getKeyedResources(data);\n const [isTabExpanded, setIsTabExpanded] = useState(false);\n\n return (\n \n
\n \n
\n
\n \n \n Back to Learning Resources Overview\n \n
\n setIsTabExpanded(!isTabExpanded)}\n >\n How to use these resources\n ▼\n \n {isTabExpanded && (\n
\n

\n 1. Start with the Explainer Video: Watch the\n Explainer video to understand the key concepts of each big\n idea of literacy.\n
\n 2. Dive into the Microlearns: Complete the 6–8\n minute, self-paced modules for each big idea. These\n modules provide research-based strategies and activities\n you can immediately use with your students.\n
\n 3. See the Strategies in Action: Watch the masterclass\n video, where a teacher demonstrates these strategies in a\n real-world classroom setting.\n
\n 4. Equip Yourself with Task Cards: Print the task\n cards to keep these strategies at your fingertips and use\n the printable manipulatives to support hands-on learning\n with students.\n
\n 5. Apply What You’ve Learned: Use the ready-to-use\n activity to teach foundational literacy skills like\n phonics, vocabulary, and comprehension directly in your\n classroom or after-school program.\n
\n Why This Approach Works: Each step builds on the\n previous one, helping you gain foundational knowledge, see\n effective strategies in practice, and implement them\n confidently. Whether you’re a classroom teacher or\n afterschool professional, these resources provide the tools\n you need to create engaging, impactful literacy experiences\n for K–2 learners.\n

\n
\n )}\n
\n
\n

\n Phonics\n

\n

\n Strengthen students’ understanding of the relationship between the\n sound of a word or letter and its literal meaning with these\n phonemics-focused resources.\n

\n
\n \n
\n
\n \n \n \n Back to Learning Resources Overview\n \n \n
\n
\n \n
\n
\n \n
\n
\n \n

\n Supporting Resources\n

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n Back to Learning Resources Overview\n \n \n
\n \n );\n};\n\nexport const query = graphql`\n query PhonicsResources {\n allResourcesJson(filter: { pages: { in: \"classroom-resources\" } }) {\n edges {\n node {\n slug\n tophat\n tophatColor\n img\n icon\n subject\n title\n subtitle\n duration\n description\n actions {\n label\n metadata\n module\n moduleName\n link\n download\n noIcon\n asLink\n videoGuid\n }\n horizontal\n className\n pages\n }\n }\n }\n }\n`;\n\nexport default ClassroomResourcesPage;\n","const deslugify = (slug) => {\n let splitSlug = slug.split('-');\n let camelCased = '';\n\n for (let i = 1; i < splitSlug.length; i++) {\n splitSlug[i] = splitSlug[i].charAt(0).toUpperCase() + splitSlug[i].slice(1);\n }\n\n camelCased = splitSlug.join('');\n return camelCased;\n};\n\n/**\n * Extracts the resources from the data object and flattens it to an\n * array of resources (objects).\n *\n * @param {Object} data GraphQL query response\n *\n * @returns {Array} An array of resources (objects)\n */\nexport const getRawResources = (data) =>\n data.allResourcesJson.edges.reduce((acc, curr) => {\n acc.push(curr.node);\n return acc;\n }, []);\n\n/**\n * Extracts the resources from the data object and modifies it into\n * an object with keys generated from the resource slug value. So a\n * resource with a slug value of \"slug-name\" will have a key of\n * \"slugName\". This is best used to destructure the resources you\n * want from the query.\n *\n * @param {Object} data GraphQL query response\n *\n * @returns {Object} An object with camel case keys generated from\n * the slug property of a resource.\n */\nexport const getKeyedResources = (data) =>\n getRawResources(data).reduce((acc, curr) => {\n acc[deslugify(curr.slug)] = curr;\n return acc;\n }, {});\n"],"sourceRoot":""}