CINXE.COM
Releases · facebook/react · GitHub
<!DOCTYPE html> <html lang="en" data-color-mode="auto" data-light-theme="light" data-dark-theme="dark" data-a11y-animated-images="system" data-a11y-link-underlines="true" > <head> <meta charset="utf-8"> <link rel="dns-prefetch" href="https://github.githubassets.com"> <link rel="dns-prefetch" href="https://avatars.githubusercontent.com"> <link rel="dns-prefetch" href="https://github-cloud.s3.amazonaws.com"> <link rel="dns-prefetch" href="https://user-images.githubusercontent.com/"> <link rel="preconnect" href="https://github.githubassets.com" crossorigin> <link rel="preconnect" href="https://avatars.githubusercontent.com"> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/light-3e154969b9f9.css" /><link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/dark-9c5b7a476542.css" /><link data-color-theme="dark_dimmed" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_dimmed-afda8eb0fb33.css" /><link data-color-theme="dark_high_contrast" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_high_contrast-2494e44ccdc5.css" /><link data-color-theme="dark_colorblind" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_colorblind-56fff47acadc.css" /><link data-color-theme="light_colorblind" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_colorblind-71cd4cc132ec.css" /><link data-color-theme="light_high_contrast" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_high_contrast-fd5499848985.css" /><link data-color-theme="light_tritanopia" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_tritanopia-31d17ba3e139.css" /><link data-color-theme="dark_tritanopia" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_tritanopia-68d6b2c79663.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-primitives-4cf0d59ab51a.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-af846850481e.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/global-8b10f05a77e6.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/github-2f6e722088eb.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/repository-9c77ed90200e.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/releases-d27bae89dc62.css" /> <script type="application/json" id="client-env">{"locale":"en","featureFlags":["copilot_immersive_title_favicon","copilot_new_references_ui","copilot_beta_features_opt_in","copilot_chat_static_thread_suggestions","copilot_conversational_ux_history_refs","copilot_implicit_context","copilot_smell_icebreaker_ux","experimentation_azure_variant_endpoint","failbot_handle_non_errors","geojson_azure_maps","ghost_pilot_confidence_truncation_25","ghost_pilot_confidence_truncation_40","hovercard_accessibility","issues_react_new_timeline","issues_react_avatar_refactor","issues_react_remove_placeholders","issues_react_blur_item_picker_on_close","marketing_pages_search_explore_provider","react_keyboard_shortcuts_dialog","remove_child_patch","sample_network_conn_type","site_metered_billing_update","lifecycle_label_name_updates"]}</script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/wp-runtime-54d03e99b237.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_oddbird_popover-polyfill_dist_popover_js-aff936e590ed.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_arianotify-polyfill_ariaNotify-polyfill_js-node_modules_github_mi-3abb8f-3f7d38a7b47d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_failbot_failbot_ts-93b6a0551aa9.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/environment-7b93e0f0c8ff.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_primer_behaviors_dist_esm_index_mjs-4aa4b0e95669.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_selector-observer_dist_index_esm_js-f690fd9ae3d5.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_relative-time-element_dist_index_js-6d3967acd51c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_combobox-nav_dist_index_js-node_modules_github_g-emoji-element_di-6ce195-53781cbc550f.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_auto-complete-element_dist_index_js-node_modules_github_catalyst_-8e9f78-a74b4e0a8a6b.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_text-expander-element_dist_index_js-f5498b8d4e5d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_filter-input-element_dist_index_js-node_modules_github_remote-inp-b5f1d7-492b5042c841.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_file-attachment-element_dist_index_js-node_modules_primer_view-co-381a4f-a11b2f0361af.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/github-elements-aa9238e3dc93.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/element-registry-477414219299.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_braintree_browser-detection_dist_browser-detection_js-node_modules_githu-bb80ec-634de60bacfa.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_lit-html_lit-html_js-ce7225a304c5.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_morphdom_dist_morphdom-e-7c534c-f8a5485c982a.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_turbo_dist_turbo_es2017-esm_js-d2aff86c7695.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_remote-form_dist_index_js-node_modules_delegated-events_dist_inde-893f9f-6cf3320416b8.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_color-convert_index_js-0e07cc183eed.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_quote-selection_dist_index_js-node_modules_github_session-resume_-69cfcc-ceb1758d1876.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_updatable-content_updatable-content_ts-3f0e021c7215.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_task-list_ts-app_assets_modules_github_sso_ts-ui_packages-900dde-24e9d16a679d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_sticky-scroll-into-view_ts-7cbef09a422c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_ajax-error_ts-app_assets_modules_github_behaviors_include-d0d0a6-0e9fa537dc4f.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_commenting_edit_ts-app_assets_modules_github_behaviors_ht-83c235-fb43816ab83c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/behaviors-5631d4370dcb.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_delegated-events_dist_index_js-node_modules_github_catalyst_lib_index_js-f6223d90c7ba.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/notifications-global-3366f6b6298e.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_virtualized-list_es_index_js-node_modules_github_template-parts_lib_index_js-96453a51f920.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_filter-input-element_dist_index_js-node_modules_github_remote-inp-3eebbd-3db38ec23e06.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_decorators_js-node_modules_delegated-events_di-e161aa-c2a0ad78c9c9.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_file-attachment-element_dist_index_js-node_modules_github_remote--3c9c82-b40c741b02c1.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_ref-selector_ts-5f691453c17a.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/repositories-20529d793dc5.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/primer-react-765944243383.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/react-core-cd0a67881543.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/react-lib-7b7b5264f6c1.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/octicons-react-45c3a19dd792.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_tanstack_query-core_build_modern_queryClient_js-e40bb86d3e93.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_emotion_is-prop-valid_dist_emotion-is-prop-valid_esm_js-node_modules_emo-37e3d5-31653d7f2342.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_stacktrace-parser_dist_s-e7dcdd-074052b7d26b.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_oddbird_popover-polyfill_dist_popover-fn_js-4896ddd4b7bb.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/notifications-subscriptions-menu-3eda30673b32.js"></script> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-react.9fa170e9435ed4b922b9.module.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/notifications-subscriptions-menu.1bcff9205c241e99cff2.module.css" /> <title>Releases · facebook/react · GitHub</title> <meta name="route-pattern" content="/:user_id/:repository/releases(.:format)" data-turbo-transient> <meta name="route-controller" content="releases" data-turbo-transient> <meta name="route-action" content="index" data-turbo-transient> <meta name="current-catalog-service-hash" content="6f13f31f798a93a6b08d3be0727120e9af35851fac7b9c620d6cf9a70068c136"> <meta name="request-id" content="A38C:1F6C3D:6AC97:79D3E:674F2312" data-pjax-transient="true"/><meta name="html-safe-nonce" content="725aead164b0632a2f13cbb9f8d865dc12270c185cad999ddd0a2e37a89faa30" data-pjax-transient="true"/><meta name="visitor-payload" content="eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiJBMzhDOjFGNkMzRDo2QUM5Nzo3OUQzRTo2NzRGMjMxMiIsInZpc2l0b3JfaWQiOiI2NzYzNDQ3NDQ2OTk3NTA4ODgyIiwicmVnaW9uX2VkZ2UiOiJzb3V0aGVhc3Rhc2lhIiwicmVnaW9uX3JlbmRlciI6InNvdXRoZWFzdGFzaWEifQ==" data-pjax-transient="true"/><meta name="visitor-hmac" content="34d04508709c229ca11095ef865aafd437737ea20c38cf45220b725eba68abab" data-pjax-transient="true"/> <meta name="hovercard-subject-tag" content="repository:10270250" data-turbo-transient> <meta name="github-keyboard-shortcuts" content="repository,copilot" data-turbo-transient="true" /> <meta name="selected-link" value="repo_releases" data-turbo-transient> <link rel="assets" href="https://github.githubassets.com/"> <meta name="google-site-verification" content="Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I"> <meta name="octolytics-url" content="https://collector.github.com/github/collect" /> <meta name="analytics-location" content="/<user-name>/<repo-name>/releases/index" data-turbo-transient="true" /> <meta name="user-login" content=""> <meta name="viewport" content="width=device-width"> <meta name="description" content="The library for web and native user interfaces. Contribute to facebook/react development by creating an account on GitHub."> <link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="GitHub"> <link rel="fluid-icon" href="https://github.com/fluidicon.png" title="GitHub"> <meta property="fb:app_id" content="1401488693436528"> <meta name="apple-itunes-app" content="app-id=1477376905, app-argument=https://github.com/facebook/react/releases" /> <meta name="twitter:image" content="https://opengraph.githubassets.com/ce13f210bf4ec4c7a15895c42ba89edd3ab3478a693f64b642ca977116899afd/facebook/react" /><meta name="twitter:site" content="@github" /><meta name="twitter:card" content="summary_large_image" /><meta name="twitter:title" content="Releases · facebook/react" /><meta name="twitter:description" content="The library for web and native user interfaces. Contribute to facebook/react development by creating an account on GitHub." /> <meta property="og:image" content="https://opengraph.githubassets.com/ce13f210bf4ec4c7a15895c42ba89edd3ab3478a693f64b642ca977116899afd/facebook/react" /><meta property="og:image:alt" content="The library for web and native user interfaces. Contribute to facebook/react development by creating an account on GitHub." /><meta property="og:image:width" content="1200" /><meta property="og:image:height" content="600" /><meta property="og:site_name" content="GitHub" /><meta property="og:type" content="object" /><meta property="og:title" content="Releases · facebook/react" /><meta property="og:url" content="/facebook/react/releases" /><meta property="og:description" content="The library for web and native user interfaces. Contribute to facebook/react development by creating an account on GitHub." /> <meta name="hostname" content="github.com"> <meta name="expected-hostname" content="github.com"> <meta http-equiv="x-pjax-version" content="a3fccbbc47e59efe5da179856996add616f03e34d3398e2c6cd7ed1869365f99" data-turbo-track="reload"> <meta http-equiv="x-pjax-csp-version" content="ace39c3b6632770952207593607e6e0be0db363435a8b877b1f96abe6430f345" data-turbo-track="reload"> <meta http-equiv="x-pjax-css-version" content="3adbaefc258174e49a9472f62ba4ed262e7c0112f9e7266a3e927bd7b898716f" data-turbo-track="reload"> <meta http-equiv="x-pjax-js-version" content="4beabdd0fbb99b09cd036910100c0444b454c234ffa1d1e7fa9530b1077bb7ab" data-turbo-track="reload"> <meta name="turbo-cache-control" content="no-preview" data-turbo-transient=""> <link rel="alternate" type="application/atom+xml" title="react Release Notes" href="https://github.com/facebook/react/releases.atom" /> <link rel="alternate" type="application/atom+xml" title="react Tags" href="https://github.com/facebook/react/tags.atom" /> <meta name="go-import" content="github.com/facebook/react git https://github.com/facebook/react.git"> <meta name="octolytics-dimension-user_id" content="69631" /><meta name="octolytics-dimension-user_login" content="facebook" /><meta name="octolytics-dimension-repository_id" content="10270250" /><meta name="octolytics-dimension-repository_nwo" content="facebook/react" /><meta name="octolytics-dimension-repository_public" content="true" /><meta name="octolytics-dimension-repository_is_fork" content="false" /><meta name="octolytics-dimension-repository_network_root_id" content="10270250" /><meta name="octolytics-dimension-repository_network_root_nwo" content="facebook/react" /> <meta name="turbo-body-classes" content="logged-out env-production page-responsive"> <meta name="browser-stats-url" content="https://api.github.com/_private/browser/stats"> <meta name="browser-errors-url" content="https://api.github.com/_private/browser/errors"> <link rel="mask-icon" href="https://github.githubassets.com/assets/pinned-octocat-093da3e6fa40.svg" color="#000000"> <link rel="alternate icon" class="js-site-favicon" type="image/png" href="https://github.githubassets.com/favicons/favicon.png"> <link rel="icon" class="js-site-favicon" type="image/svg+xml" href="https://github.githubassets.com/favicons/favicon.svg" data-base-href="https://github.githubassets.com/favicons/favicon"> <meta name="theme-color" content="#1e2327"> <meta name="color-scheme" content="light dark" /> <link rel="manifest" href="/manifest.json" crossOrigin="use-credentials"> </head> <body class="logged-out env-production page-responsive" style="word-wrap: break-word;"> <div data-turbo-body class="logged-out env-production page-responsive" style="word-wrap: break-word;"> <div class="position-relative header-wrapper js-header-wrapper "> <a href="#start-of-content" data-skip-target-assigned="false" class="px-2 py-4 color-bg-accent-emphasis color-fg-on-emphasis show-on-focus js-skip-to-content">Skip to content</a> <span data-view-component="true" class="progress-pjax-loader Progress position-fixed width-full"> <span style="width: 0%;" data-view-component="true" class="Progress-item progress-pjax-loader-bar left-0 top-0 color-bg-accent-emphasis"></span> </span> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/primer-react-765944243383.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/react-core-cd0a67881543.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/react-lib-7b7b5264f6c1.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/octicons-react-45c3a19dd792.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_tanstack_query-core_build_modern_queryClient_js-e40bb86d3e93.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_emotion_is-prop-valid_dist_emotion-is-prop-valid_esm_js-node_modules_emo-37e3d5-31653d7f2342.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_stacktrace-parser_dist_s-e7dcdd-074052b7d26b.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_oddbird_popover-polyfill_dist_popover-fn_js-4896ddd4b7bb.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_ui-commands_ui-commands_ts-3f8e5a72ee96.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/keyboard-shortcuts-dialog-a6c605212a80.js"></script> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-react.9fa170e9435ed4b922b9.module.css" /> <react-partial partial-name="keyboard-shortcuts-dialog" data-ssr="false" data-attempted-ssr="false" > <script type="application/json" data-target="react-partial.embeddedData">{"props":{"docsUrl":"https://docs.github.com/get-started/accessibility/keyboard-shortcuts"}}</script> <div data-target="react-partial.reactRoot"></div> </react-partial> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_remote-form_dist_index_js-node_modules_delegated-events_dist_inde-94fd67-9df03b4ed507.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/sessions-8fa3b694f335.js"></script> <header class="HeaderMktg header-logged-out js-details-container js-header Details f4 py-3" role="banner" data-is-top="true" data-color-mode=light data-light-theme=light data-dark-theme=dark> <h2 class="sr-only">Navigation Menu</h2> <button type="button" class="HeaderMktg-backdrop d-lg-none border-0 position-fixed top-0 left-0 width-full height-full js-details-target" aria-label="Toggle navigation"> <span class="d-none">Toggle navigation</span> </button> <div class="d-flex flex-column flex-lg-row flex-items-center px-3 px-md-4 px-lg-5 height-full position-relative z-1"> <div class="d-flex flex-justify-between flex-items-center width-full width-lg-auto"> <div class="flex-1"> <button aria-label="Toggle navigation" aria-expanded="false" type="button" data-view-component="true" class="js-details-target js-nav-padding-recalculate js-header-menu-toggle Button--link Button--medium Button d-lg-none color-fg-inherit p-1"> <span class="Button-content"> <span class="Button-label"><div class="HeaderMenu-toggle-bar rounded my-1"></div> <div class="HeaderMenu-toggle-bar rounded my-1"></div> <div class="HeaderMenu-toggle-bar rounded my-1"></div></span> </span> </button> </div> <a class="mr-lg-3 color-fg-inherit flex-order-2 js-prevent-focus-on-mobile-nav" href="/" aria-label="Homepage" data-analytics-event="{"category":"Marketing nav","action":"click to go to homepage","label":"ref_page:Marketing;ref_cta:Logomark;ref_loc:Header"}"> <svg height="32" aria-hidden="true" viewBox="0 0 24 24" version="1.1" width="32" data-view-component="true" class="octicon octicon-mark-github"> <path d="M12.5.75C6.146.75 1 5.896 1 12.25c0 5.089 3.292 9.387 7.863 10.91.575.101.79-.244.79-.546 0-.273-.014-1.178-.014-2.142-2.889.532-3.636-.704-3.866-1.35-.13-.331-.69-1.352-1.18-1.625-.402-.216-.977-.748-.014-.762.906-.014 1.553.834 1.769 1.179 1.035 1.74 2.688 1.25 3.349.948.1-.747.402-1.25.733-1.538-2.559-.287-5.232-1.279-5.232-5.678 0-1.25.445-2.285 1.178-3.09-.115-.288-.517-1.467.115-3.048 0 0 .963-.302 3.163 1.179.92-.259 1.897-.388 2.875-.388.977 0 1.955.13 2.875.388 2.2-1.495 3.162-1.179 3.162-1.179.633 1.581.23 2.76.115 3.048.733.805 1.179 1.825 1.179 3.09 0 4.413-2.688 5.39-5.247 5.678.417.36.776 1.05.776 2.128 0 1.538-.014 2.774-.014 3.162 0 .302.216.662.79.547C20.709 21.637 24 17.324 24 12.25 24 5.896 18.854.75 12.5.75Z"></path> </svg> </a> <div class="flex-1 flex-order-2 text-right"> <a href="/login?return_to=https%3A%2F%2Fgithub.com%2Ffacebook%2Freact%2Freleases" class="HeaderMenu-link HeaderMenu-button d-inline-flex d-lg-none flex-order-1 f5 no-underline border color-border-default rounded-2 px-2 py-1 color-fg-inherit js-prevent-focus-on-mobile-nav" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"site header menu","repository_id":null,"auth_type":"SIGN_UP","originating_url":"https://github.com/facebook/react/releases","user_id":null}}" data-hydro-click-hmac="24040e3513ae61081bbcdf8ed1991baef7cc868876352e7086c4e53075c8c717" data-analytics-event="{"category":"Marketing nav","action":"click to Sign in","label":"ref_page:Marketing;ref_cta:Sign in;ref_loc:Header"}" > Sign in </a> </div> </div> <div class="HeaderMenu js-header-menu height-fit position-lg-relative d-lg-flex flex-column flex-auto top-0"> <div class="HeaderMenu-wrapper d-flex flex-column flex-self-start flex-lg-row flex-auto rounded rounded-lg-0"> <nav class="HeaderMenu-nav" aria-label="Global"> <ul class="d-lg-flex list-style-none"> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Product <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 pb-2 pb-lg-4 d-lg-flex flex-wrap dropdown-menu-wide"> <div class="HeaderMenu-column px-lg-4 border-lg-right mb-4 mb-lg-0 pr-lg-7"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0"> <ul class="list-style-none f5" > <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"github_copilot","context":"product","tag":"link","label":"github_copilot_link_product_navbar"}" href="https://github.com/features/copilot"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-copilot color-fg-subtle mr-3"> <path d="M23.922 16.992c-.861 1.495-5.859 5.023-11.922 5.023-6.063 0-11.061-3.528-11.922-5.023A.641.641 0 0 1 0 16.736v-2.869a.841.841 0 0 1 .053-.22c.372-.935 1.347-2.292 2.605-2.656.167-.429.414-1.055.644-1.517a10.195 10.195 0 0 1-.052-1.086c0-1.331.282-2.499 1.132-3.368.397-.406.89-.717 1.474-.952 1.399-1.136 3.392-2.093 6.122-2.093 2.731 0 4.767.957 6.166 2.093.584.235 1.077.546 1.474.952.85.869 1.132 2.037 1.132 3.368 0 .368-.014.733-.052 1.086.23.462.477 1.088.644 1.517 1.258.364 2.233 1.721 2.605 2.656a.832.832 0 0 1 .053.22v2.869a.641.641 0 0 1-.078.256ZM12.172 11h-.344a4.323 4.323 0 0 1-.355.508C10.703 12.455 9.555 13 7.965 13c-1.725 0-2.989-.359-3.782-1.259a2.005 2.005 0 0 1-.085-.104L4 11.741v6.585c1.435.779 4.514 2.179 8 2.179 3.486 0 6.565-1.4 8-2.179v-6.585l-.098-.104s-.033.045-.085.104c-.793.9-2.057 1.259-3.782 1.259-1.59 0-2.738-.545-3.508-1.492a4.323 4.323 0 0 1-.355-.508h-.016.016Zm.641-2.935c.136 1.057.403 1.913.878 2.497.442.544 1.134.938 2.344.938 1.573 0 2.292-.337 2.657-.751.384-.435.558-1.15.558-2.361 0-1.14-.243-1.847-.705-2.319-.477-.488-1.319-.862-2.824-1.025-1.487-.161-2.192.138-2.533.529-.269.307-.437.808-.438 1.578v.021c0 .265.021.562.063.893Zm-1.626 0c.042-.331.063-.628.063-.894v-.02c-.001-.77-.169-1.271-.438-1.578-.341-.391-1.046-.69-2.533-.529-1.505.163-2.347.537-2.824 1.025-.462.472-.705 1.179-.705 2.319 0 1.211.175 1.926.558 2.361.365.414 1.084.751 2.657.751 1.21 0 1.902-.394 2.344-.938.475-.584.742-1.44.878-2.497Z"></path><path d="M14.5 14.25a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1Zm-5 0a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1Z"></path> </svg> <div> <div class="color-fg-default h4">GitHub Copilot</div> Write better code with AI </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"security","context":"product","tag":"link","label":"security_link_product_navbar"}" href="https://github.com/features/security"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-shield-check color-fg-subtle mr-3"> <path d="M16.53 9.78a.75.75 0 0 0-1.06-1.06L11 13.19l-1.97-1.97a.75.75 0 0 0-1.06 1.06l2.5 2.5a.75.75 0 0 0 1.06 0l5-5Z"></path><path d="m12.54.637 8.25 2.675A1.75 1.75 0 0 1 22 4.976V10c0 6.19-3.771 10.704-9.401 12.83a1.704 1.704 0 0 1-1.198 0C5.77 20.705 2 16.19 2 10V4.976c0-.758.489-1.43 1.21-1.664L11.46.637a1.748 1.748 0 0 1 1.08 0Zm-.617 1.426-8.25 2.676a.249.249 0 0 0-.173.237V10c0 5.46 3.28 9.483 8.43 11.426a.199.199 0 0 0 .14 0C17.22 19.483 20.5 15.461 20.5 10V4.976a.25.25 0 0 0-.173-.237l-8.25-2.676a.253.253 0 0 0-.154 0Z"></path> </svg> <div> <div class="color-fg-default h4">Security</div> Find and fix vulnerabilities </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"actions","context":"product","tag":"link","label":"actions_link_product_navbar"}" href="https://github.com/features/actions"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-workflow color-fg-subtle mr-3"> <path d="M1 3a2 2 0 0 1 2-2h6.5a2 2 0 0 1 2 2v6.5a2 2 0 0 1-2 2H7v4.063C7 16.355 7.644 17 8.438 17H12.5v-2.5a2 2 0 0 1 2-2H21a2 2 0 0 1 2 2V21a2 2 0 0 1-2 2h-6.5a2 2 0 0 1-2-2v-2.5H8.437A2.939 2.939 0 0 1 5.5 15.562V11.5H3a2 2 0 0 1-2-2Zm2-.5a.5.5 0 0 0-.5.5v6.5a.5.5 0 0 0 .5.5h6.5a.5.5 0 0 0 .5-.5V3a.5.5 0 0 0-.5-.5ZM14.5 14a.5.5 0 0 0-.5.5V21a.5.5 0 0 0 .5.5H21a.5.5 0 0 0 .5-.5v-6.5a.5.5 0 0 0-.5-.5Z"></path> </svg> <div> <div class="color-fg-default h4">Actions</div> Automate any workflow </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"codespaces","context":"product","tag":"link","label":"codespaces_link_product_navbar"}" href="https://github.com/features/codespaces"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-codespaces color-fg-subtle mr-3"> <path d="M3.5 3.75C3.5 2.784 4.284 2 5.25 2h13.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 18.75 13H5.25a1.75 1.75 0 0 1-1.75-1.75Zm-2 12c0-.966.784-1.75 1.75-1.75h17.5c.966 0 1.75.784 1.75 1.75v4a1.75 1.75 0 0 1-1.75 1.75H3.25a1.75 1.75 0 0 1-1.75-1.75ZM5.25 3.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h13.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Zm-2 12a.25.25 0 0 0-.25.25v4c0 .138.112.25.25.25h17.5a.25.25 0 0 0 .25-.25v-4a.25.25 0 0 0-.25-.25Z"></path><path d="M10 17.75a.75.75 0 0 1 .75-.75h6.5a.75.75 0 0 1 0 1.5h-6.5a.75.75 0 0 1-.75-.75Zm-4 0a.75.75 0 0 1 .75-.75h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1-.75-.75Z"></path> </svg> <div> <div class="color-fg-default h4">Codespaces</div> Instant dev environments </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"issues","context":"product","tag":"link","label":"issues_link_product_navbar"}" href="https://github.com/features/issues"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-issue-opened color-fg-subtle mr-3"> <path d="M12 1c6.075 0 11 4.925 11 11s-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1ZM2.5 12a9.5 9.5 0 0 0 9.5 9.5 9.5 9.5 0 0 0 9.5-9.5A9.5 9.5 0 0 0 12 2.5 9.5 9.5 0 0 0 2.5 12Zm9.5 2a2 2 0 1 1-.001-3.999A2 2 0 0 1 12 14Z"></path> </svg> <div> <div class="color-fg-default h4">Issues</div> Plan and track work </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"code_review","context":"product","tag":"link","label":"code_review_link_product_navbar"}" href="https://github.com/features/code-review"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-code-review color-fg-subtle mr-3"> <path d="M10.3 6.74a.75.75 0 0 1-.04 1.06l-2.908 2.7 2.908 2.7a.75.75 0 1 1-1.02 1.1l-3.5-3.25a.75.75 0 0 1 0-1.1l3.5-3.25a.75.75 0 0 1 1.06.04Zm3.44 1.06a.75.75 0 1 1 1.02-1.1l3.5 3.25a.75.75 0 0 1 0 1.1l-3.5 3.25a.75.75 0 1 1-1.02-1.1l2.908-2.7-2.908-2.7Z"></path><path d="M1.5 4.25c0-.966.784-1.75 1.75-1.75h17.5c.966 0 1.75.784 1.75 1.75v12.5a1.75 1.75 0 0 1-1.75 1.75h-9.69l-3.573 3.573A1.458 1.458 0 0 1 5 21.043V18.5H3.25a1.75 1.75 0 0 1-1.75-1.75ZM3.25 4a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h2.5a.75.75 0 0 1 .75.75v3.19l3.72-3.72a.749.749 0 0 1 .53-.22h10a.25.25 0 0 0 .25-.25V4.25a.25.25 0 0 0-.25-.25Z"></path> </svg> <div> <div class="color-fg-default h4">Code Review</div> Manage code changes </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"discussions","context":"product","tag":"link","label":"discussions_link_product_navbar"}" href="https://github.com/features/discussions"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-comment-discussion color-fg-subtle mr-3"> <path d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0 1 14.25 14H8.061l-2.574 2.573A1.458 1.458 0 0 1 3 15.543V14H1.75A1.75 1.75 0 0 1 0 12.25v-9.5C0 1.784.784 1 1.75 1ZM1.5 2.75v9.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-9.5a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Z"></path><path d="M22.5 8.75a.25.25 0 0 0-.25-.25h-3.5a.75.75 0 0 1 0-1.5h3.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0 1 22.25 20H21v1.543a1.457 1.457 0 0 1-2.487 1.03L15.939 20H10.75A1.75 1.75 0 0 1 9 18.25v-1.465a.75.75 0 0 1 1.5 0v1.465c0 .138.112.25.25.25h5.5a.75.75 0 0 1 .53.22l2.72 2.72v-2.19a.75.75 0 0 1 .75-.75h2a.25.25 0 0 0 .25-.25v-9.5Z"></path> </svg> <div> <div class="color-fg-default h4">Discussions</div> Collaborate outside of code </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"code_search","context":"product","tag":"link","label":"code_search_link_product_navbar"}" href="https://github.com/features/code-search"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-code-square color-fg-subtle mr-3"> <path d="M10.3 8.24a.75.75 0 0 1-.04 1.06L7.352 12l2.908 2.7a.75.75 0 1 1-1.02 1.1l-3.5-3.25a.75.75 0 0 1 0-1.1l3.5-3.25a.75.75 0 0 1 1.06.04Zm3.44 1.06a.75.75 0 1 1 1.02-1.1l3.5 3.25a.75.75 0 0 1 0 1.1l-3.5 3.25a.75.75 0 1 1-1.02-1.1l2.908-2.7-2.908-2.7Z"></path><path d="M2 3.75C2 2.784 2.784 2 3.75 2h16.5c.966 0 1.75.784 1.75 1.75v16.5A1.75 1.75 0 0 1 20.25 22H3.75A1.75 1.75 0 0 1 2 20.25Zm1.75-.25a.25.25 0 0 0-.25.25v16.5c0 .138.112.25.25.25h16.5a.25.25 0 0 0 .25-.25V3.75a.25.25 0 0 0-.25-.25Z"></path> </svg> <div> <div class="color-fg-default h4">Code Search</div> Find more, search less </div> </a></li> </ul> </div> </div> <div class="HeaderMenu-column px-lg-4"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0 border-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="product-explore-heading">Explore</span> <ul class="list-style-none f5" aria-labelledby="product-explore-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"all_features","context":"product","tag":"link","label":"all_features_link_product_navbar"}" href="https://github.com/features"> All features </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"documentation","context":"product","tag":"link","label":"documentation_link_product_navbar"}" href="https://docs.github.com"> Documentation <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"github_skills","context":"product","tag":"link","label":"github_skills_link_product_navbar"}" href="https://skills.github.com"> GitHub Skills <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"blog","context":"product","tag":"link","label":"blog_link_product_navbar"}" href="https://github.blog"> Blog <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> </ul> </div> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Solutions <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 d-lg-flex flex-wrap dropdown-menu-wide"> <div class="HeaderMenu-column px-lg-4 border-lg-right mb-4 mb-lg-0 pr-lg-7"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0 pb-lg-3 mb-3 mb-lg-0"> <span class="d-block h4 color-fg-default my-1" id="solutions-by-company-size-heading">By company size</span> <ul class="list-style-none f5" aria-labelledby="solutions-by-company-size-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"enterprises","context":"solutions","tag":"link","label":"enterprises_link_solutions_navbar"}" href="https://github.com/enterprise"> Enterprises </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"small_and_medium_teams","context":"solutions","tag":"link","label":"small_and_medium_teams_link_solutions_navbar"}" href="https://github.com/team"> Small and medium teams </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"startups","context":"solutions","tag":"link","label":"startups_link_solutions_navbar"}" href="https://github.com/enterprise/startups"> Startups </a></li> </ul> </div> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="solutions-by-use-case-heading">By use case</span> <ul class="list-style-none f5" aria-labelledby="solutions-by-use-case-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"devsecops","context":"solutions","tag":"link","label":"devsecops_link_solutions_navbar"}" href="/solutions/use-case/devsecops"> DevSecOps </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"devops","context":"solutions","tag":"link","label":"devops_link_solutions_navbar"}" href="/solutions/use-case/devops"> DevOps </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"ci_cd","context":"solutions","tag":"link","label":"ci_cd_link_solutions_navbar"}" href="/solutions/use-case/ci-cd"> CI/CD </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"view_all_use_cases","context":"solutions","tag":"link","label":"view_all_use_cases_link_solutions_navbar"}" href="/solutions/use-case"> View all use cases </a></li> </ul> </div> </div> <div class="HeaderMenu-column px-lg-4"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="solutions-by-industry-heading">By industry</span> <ul class="list-style-none f5" aria-labelledby="solutions-by-industry-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"healthcare","context":"solutions","tag":"link","label":"healthcare_link_solutions_navbar"}" href="/solutions/industry/healthcare"> Healthcare </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"financial_services","context":"solutions","tag":"link","label":"financial_services_link_solutions_navbar"}" href="/solutions/industry/financial-services"> Financial services </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"manufacturing","context":"solutions","tag":"link","label":"manufacturing_link_solutions_navbar"}" href="/solutions/industry/manufacturing"> Manufacturing </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"government","context":"solutions","tag":"link","label":"government_link_solutions_navbar"}" href="/solutions/industry/government"> Government </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"view_all_industries","context":"solutions","tag":"link","label":"view_all_industries_link_solutions_navbar"}" href="/solutions/industry"> View all industries </a></li> </ul> </div> </div> <div class="HeaderMenu-trailing-link rounded-bottom-2 flex-shrink-0 mt-lg-4 px-lg-4 py-4 py-lg-3 f5 text-semibold"> <a href="/solutions"> View all solutions <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-right HeaderMenu-trailing-link-icon"> <path d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L9.94 8 6.22 4.28a.75.75 0 0 1 0-1.06Z"></path> </svg> </a> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Resources <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 pb-2 pb-lg-4 d-lg-flex flex-wrap dropdown-menu-wide"> <div class="HeaderMenu-column px-lg-4 border-lg-right mb-4 mb-lg-0 pr-lg-7"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="resources-topics-heading">Topics</span> <ul class="list-style-none f5" aria-labelledby="resources-topics-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"ai","context":"resources","tag":"link","label":"ai_link_resources_navbar"}" href="/resources/articles/ai"> AI </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"devops","context":"resources","tag":"link","label":"devops_link_resources_navbar"}" href="/resources/articles/devops"> DevOps </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"security","context":"resources","tag":"link","label":"security_link_resources_navbar"}" href="/resources/articles/security"> Security </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"software_development","context":"resources","tag":"link","label":"software_development_link_resources_navbar"}" href="/resources/articles/software-development"> Software Development </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"view_all","context":"resources","tag":"link","label":"view_all_link_resources_navbar"}" href="/resources/articles"> View all </a></li> </ul> </div> </div> <div class="HeaderMenu-column px-lg-4"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0 border-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="resources-explore-heading">Explore</span> <ul class="list-style-none f5" aria-labelledby="resources-explore-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"learning_pathways","context":"resources","tag":"link","label":"learning_pathways_link_resources_navbar"}" href="https://resources.github.com/learn/pathways"> Learning Pathways <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"white_papers_ebooks_webinars","context":"resources","tag":"link","label":"white_papers_ebooks_webinars_link_resources_navbar"}" href="https://resources.github.com"> White papers, Ebooks, Webinars <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"customer_stories","context":"resources","tag":"link","label":"customer_stories_link_resources_navbar"}" href="https://github.com/customer-stories"> Customer Stories </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"partners","context":"resources","tag":"link","label":"partners_link_resources_navbar"}" href="https://partner.github.com"> Partners <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> </ul> </div> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Open Source <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 pb-2 pb-lg-4 px-lg-4"> <div class="HeaderMenu-column"> <div class="border-bottom pb-3 pb-lg-0 pb-lg-3 mb-3 mb-lg-0 mb-lg-3"> <ul class="list-style-none f5" > <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"github_sponsors","context":"open_source","tag":"link","label":"github_sponsors_link_open_source_navbar"}" href="/sponsors"> <div> <div class="color-fg-default h4">GitHub Sponsors</div> Fund open source developers </div> </a></li> </ul> </div> <div class="border-bottom pb-3 pb-lg-0 pb-lg-3 mb-3 mb-lg-0 mb-lg-3"> <ul class="list-style-none f5" > <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"the_readme_project","context":"open_source","tag":"link","label":"the_readme_project_link_open_source_navbar"}" href="https://github.com/readme"> <div> <div class="color-fg-default h4">The ReadME Project</div> GitHub community articles </div> </a></li> </ul> </div> <div class="border-bottom pb-3 pb-lg-0 border-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="open-source-repositories-heading">Repositories</span> <ul class="list-style-none f5" aria-labelledby="open-source-repositories-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"topics","context":"open_source","tag":"link","label":"topics_link_open_source_navbar"}" href="https://github.com/topics"> Topics </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"trending","context":"open_source","tag":"link","label":"trending_link_open_source_navbar"}" href="https://github.com/trending"> Trending </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"collections","context":"open_source","tag":"link","label":"collections_link_open_source_navbar"}" href="https://github.com/collections"> Collections </a></li> </ul> </div> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Enterprise <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 pb-2 pb-lg-4 px-lg-4"> <div class="HeaderMenu-column"> <div class="border-bottom pb-3 pb-lg-0 pb-lg-3 mb-3 mb-lg-0 mb-lg-3"> <ul class="list-style-none f5" > <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"enterprise_platform","context":"enterprise","tag":"link","label":"enterprise_platform_link_enterprise_navbar"}" href="/enterprise"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-stack color-fg-subtle mr-3"> <path d="M11.063 1.456a1.749 1.749 0 0 1 1.874 0l8.383 5.316a1.751 1.751 0 0 1 0 2.956l-8.383 5.316a1.749 1.749 0 0 1-1.874 0L2.68 9.728a1.751 1.751 0 0 1 0-2.956Zm1.071 1.267a.25.25 0 0 0-.268 0L3.483 8.039a.25.25 0 0 0 0 .422l8.383 5.316a.25.25 0 0 0 .268 0l8.383-5.316a.25.25 0 0 0 0-.422Z"></path><path d="M1.867 12.324a.75.75 0 0 1 1.035-.232l8.964 5.685a.25.25 0 0 0 .268 0l8.964-5.685a.75.75 0 0 1 .804 1.267l-8.965 5.685a1.749 1.749 0 0 1-1.874 0l-8.965-5.685a.75.75 0 0 1-.231-1.035Z"></path><path d="M1.867 16.324a.75.75 0 0 1 1.035-.232l8.964 5.685a.25.25 0 0 0 .268 0l8.964-5.685a.75.75 0 0 1 .804 1.267l-8.965 5.685a1.749 1.749 0 0 1-1.874 0l-8.965-5.685a.75.75 0 0 1-.231-1.035Z"></path> </svg> <div> <div class="color-fg-default h4">Enterprise platform</div> AI-powered developer platform </div> </a></li> </ul> </div> <div class="border-bottom pb-3 pb-lg-0 border-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="enterprise-available-add-ons-heading">Available add-ons</span> <ul class="list-style-none f5" aria-labelledby="enterprise-available-add-ons-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"advanced_security","context":"enterprise","tag":"link","label":"advanced_security_link_enterprise_navbar"}" href="https://github.com/enterprise/advanced-security"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-shield-check color-fg-subtle mr-3"> <path d="M16.53 9.78a.75.75 0 0 0-1.06-1.06L11 13.19l-1.97-1.97a.75.75 0 0 0-1.06 1.06l2.5 2.5a.75.75 0 0 0 1.06 0l5-5Z"></path><path d="m12.54.637 8.25 2.675A1.75 1.75 0 0 1 22 4.976V10c0 6.19-3.771 10.704-9.401 12.83a1.704 1.704 0 0 1-1.198 0C5.77 20.705 2 16.19 2 10V4.976c0-.758.489-1.43 1.21-1.664L11.46.637a1.748 1.748 0 0 1 1.08 0Zm-.617 1.426-8.25 2.676a.249.249 0 0 0-.173.237V10c0 5.46 3.28 9.483 8.43 11.426a.199.199 0 0 0 .14 0C17.22 19.483 20.5 15.461 20.5 10V4.976a.25.25 0 0 0-.173-.237l-8.25-2.676a.253.253 0 0 0-.154 0Z"></path> </svg> <div> <div class="color-fg-default h4">Advanced Security</div> Enterprise-grade security features </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"github_copilot","context":"enterprise","tag":"link","label":"github_copilot_link_enterprise_navbar"}" href="/features/copilot#enterprise"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-copilot color-fg-subtle mr-3"> <path d="M23.922 16.992c-.861 1.495-5.859 5.023-11.922 5.023-6.063 0-11.061-3.528-11.922-5.023A.641.641 0 0 1 0 16.736v-2.869a.841.841 0 0 1 .053-.22c.372-.935 1.347-2.292 2.605-2.656.167-.429.414-1.055.644-1.517a10.195 10.195 0 0 1-.052-1.086c0-1.331.282-2.499 1.132-3.368.397-.406.89-.717 1.474-.952 1.399-1.136 3.392-2.093 6.122-2.093 2.731 0 4.767.957 6.166 2.093.584.235 1.077.546 1.474.952.85.869 1.132 2.037 1.132 3.368 0 .368-.014.733-.052 1.086.23.462.477 1.088.644 1.517 1.258.364 2.233 1.721 2.605 2.656a.832.832 0 0 1 .053.22v2.869a.641.641 0 0 1-.078.256ZM12.172 11h-.344a4.323 4.323 0 0 1-.355.508C10.703 12.455 9.555 13 7.965 13c-1.725 0-2.989-.359-3.782-1.259a2.005 2.005 0 0 1-.085-.104L4 11.741v6.585c1.435.779 4.514 2.179 8 2.179 3.486 0 6.565-1.4 8-2.179v-6.585l-.098-.104s-.033.045-.085.104c-.793.9-2.057 1.259-3.782 1.259-1.59 0-2.738-.545-3.508-1.492a4.323 4.323 0 0 1-.355-.508h-.016.016Zm.641-2.935c.136 1.057.403 1.913.878 2.497.442.544 1.134.938 2.344.938 1.573 0 2.292-.337 2.657-.751.384-.435.558-1.15.558-2.361 0-1.14-.243-1.847-.705-2.319-.477-.488-1.319-.862-2.824-1.025-1.487-.161-2.192.138-2.533.529-.269.307-.437.808-.438 1.578v.021c0 .265.021.562.063.893Zm-1.626 0c.042-.331.063-.628.063-.894v-.02c-.001-.77-.169-1.271-.438-1.578-.341-.391-1.046-.69-2.533-.529-1.505.163-2.347.537-2.824 1.025-.462.472-.705 1.179-.705 2.319 0 1.211.175 1.926.558 2.361.365.414 1.084.751 2.657.751 1.21 0 1.902-.394 2.344-.938.475-.584.742-1.44.878-2.497Z"></path><path d="M14.5 14.25a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1Zm-5 0a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1Z"></path> </svg> <div> <div class="color-fg-default h4">GitHub Copilot</div> Enterprise-grade AI features </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"premium_support","context":"enterprise","tag":"link","label":"premium_support_link_enterprise_navbar"}" href="/premium-support"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-comment-discussion color-fg-subtle mr-3"> <path d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0 1 14.25 14H8.061l-2.574 2.573A1.458 1.458 0 0 1 3 15.543V14H1.75A1.75 1.75 0 0 1 0 12.25v-9.5C0 1.784.784 1 1.75 1ZM1.5 2.75v9.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-9.5a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Z"></path><path d="M22.5 8.75a.25.25 0 0 0-.25-.25h-3.5a.75.75 0 0 1 0-1.5h3.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0 1 22.25 20H21v1.543a1.457 1.457 0 0 1-2.487 1.03L15.939 20H10.75A1.75 1.75 0 0 1 9 18.25v-1.465a.75.75 0 0 1 1.5 0v1.465c0 .138.112.25.25.25h5.5a.75.75 0 0 1 .53.22l2.72 2.72v-2.19a.75.75 0 0 1 .75-.75h2a.25.25 0 0 0 .25-.25v-9.5Z"></path> </svg> <div> <div class="color-fg-default h4">Premium Support</div> Enterprise-grade 24/7 support </div> </a></li> </ul> </div> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <a class="HeaderMenu-link no-underline px-0 px-lg-2 py-3 py-lg-2 d-block d-lg-inline-block" data-analytics-event="{"location":"navbar","action":"pricing","context":"global","tag":"link","label":"pricing_link_global_navbar"}" href="https://github.com/pricing">Pricing</a> </li> </ul> </nav> <div class="d-flex flex-column flex-lg-row width-full flex-justify-end flex-lg-items-center text-center mt-3 mt-lg-0 text-lg-left ml-lg-3"> <qbsearch-input class="search-input" data-scope="repo:facebook/react" data-custom-scopes-path="/search/custom_scopes" data-delete-custom-scopes-csrf="XtC1aKwIq2rGElP0O9x0weq7k7UUST5-6ZqNb_KJRo1ICoGcpqDKoy8GcWsz_g7hOo54gAUTKskfdMFGapWKHg" data-max-custom-scopes="10" data-header-redesign-enabled="false" data-initial-value="" data-blackbird-suggestions-path="/search/suggestions" data-jump-to-suggestions-path="/_graphql/GetSuggestedNavigationDestinations" data-current-repository="facebook/react" data-current-org="facebook" data-current-owner="" data-logged-in="false" data-copilot-chat-enabled="false" data-nl-search-enabled="false" data-retain-scroll-position="true"> <div class="search-input-container search-with-dialog position-relative d-flex flex-row flex-items-center mr-4 rounded" data-action="click:qbsearch-input#searchInputContainerClicked" > <button type="button" class="header-search-button placeholder input-button form-control d-flex flex-1 flex-self-stretch flex-items-center no-wrap width-full py-0 pl-2 pr-0 text-left border-0 box-shadow-none" data-target="qbsearch-input.inputButton" aria-label="Search or jump to…" aria-haspopup="dialog" placeholder="Search or jump to..." data-hotkey=s,/ autocapitalize="off" data-analytics-event="{"location":"navbar","action":"searchbar","context":"global","tag":"input","label":"searchbar_input_global_navbar"}" data-action="click:qbsearch-input#handleExpand" > <div class="mr-2 color-fg-muted"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-search"> <path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path> </svg> </div> <span class="flex-1" data-target="qbsearch-input.inputButtonText">Search or jump to...</span> <div class="d-flex" data-target="qbsearch-input.hotkeyIndicator"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="20" aria-hidden="true" class="mr-1"><path fill="none" stroke="#979A9C" opacity=".4" d="M3.5.5h12c1.7 0 3 1.3 3 3v13c0 1.7-1.3 3-3 3h-12c-1.7 0-3-1.3-3-3v-13c0-1.7 1.3-3 3-3z"></path><path fill="#979A9C" d="M11.8 6L8 15.1h-.9L10.8 6h1z"></path></svg> </div> </button> <input type="hidden" name="type" class="js-site-search-type-field"> <div class="Overlay--hidden " data-modal-dialog-overlay> <modal-dialog data-action="close:qbsearch-input#handleClose cancel:qbsearch-input#handleClose" data-target="qbsearch-input.searchSuggestionsDialog" role="dialog" id="search-suggestions-dialog" aria-modal="true" aria-labelledby="search-suggestions-dialog-header" data-view-component="true" class="Overlay Overlay--width-large Overlay--height-auto"> <h1 id="search-suggestions-dialog-header" class="sr-only">Search code, repositories, users, issues, pull requests...</h1> <div class="Overlay-body Overlay-body--paddingNone"> <div data-view-component="true"> <div class="search-suggestions position-fixed width-full color-shadow-large border color-fg-default color-bg-default overflow-hidden d-flex flex-column query-builder-container" style="border-radius: 12px;" data-target="qbsearch-input.queryBuilderContainer" hidden > <!-- '"` --><!-- </textarea></xmp> --></option></form><form id="query-builder-test-form" action="" accept-charset="UTF-8" method="get"> <query-builder data-target="qbsearch-input.queryBuilder" id="query-builder-query-builder-test" data-filter-key=":" data-view-component="true" class="QueryBuilder search-query-builder"> <div class="FormControl FormControl--fullWidth"> <label id="query-builder-test-label" for="query-builder-test" class="FormControl-label sr-only"> Search </label> <div class="QueryBuilder-StyledInput width-fit " data-target="query-builder.styledInput" > <span id="query-builder-test-leadingvisual-wrap" class="FormControl-input-leadingVisualWrap QueryBuilder-leadingVisualWrap"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-search FormControl-input-leadingVisual"> <path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path> </svg> </span> <div data-target="query-builder.styledInputContainer" class="QueryBuilder-StyledInputContainer"> <div aria-hidden="true" class="QueryBuilder-StyledInputContent" data-target="query-builder.styledInputContent" ></div> <div class="QueryBuilder-InputWrapper"> <div aria-hidden="true" class="QueryBuilder-Sizer" data-target="query-builder.sizer"></div> <input id="query-builder-test" name="query-builder-test" value="" autocomplete="off" type="text" role="combobox" spellcheck="false" aria-expanded="false" aria-describedby="validation-a65d3319-1744-452b-92f0-84aed02f8904" data-target="query-builder.input" data-action=" input:query-builder#inputChange blur:query-builder#inputBlur keydown:query-builder#inputKeydown focus:query-builder#inputFocus " data-view-component="true" class="FormControl-input QueryBuilder-Input FormControl-medium" /> </div> </div> <span class="sr-only" id="query-builder-test-clear">Clear</span> <button role="button" id="query-builder-test-clear-button" aria-labelledby="query-builder-test-clear query-builder-test-label" data-target="query-builder.clearButton" data-action=" click:query-builder#clear focus:query-builder#clearButtonFocus blur:query-builder#clearButtonBlur " variant="small" hidden="hidden" type="button" data-view-component="true" class="Button Button--iconOnly Button--invisible Button--medium mr-1 px-2 py-0 d-flex flex-items-center rounded-1 color-fg-muted"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x-circle-fill Button-visual"> <path d="M2.343 13.657A8 8 0 1 1 13.658 2.343 8 8 0 0 1 2.343 13.657ZM6.03 4.97a.751.751 0 0 0-1.042.018.751.751 0 0 0-.018 1.042L6.94 8 4.97 9.97a.749.749 0 0 0 .326 1.275.749.749 0 0 0 .734-.215L8 9.06l1.97 1.97a.749.749 0 0 0 1.275-.326.749.749 0 0 0-.215-.734L9.06 8l1.97-1.97a.749.749 0 0 0-.326-1.275.749.749 0 0 0-.734.215L8 6.94Z"></path> </svg> </button> </div> <template id="search-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-search"> <path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path> </svg> </template> <template id="code-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code"> <path d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z"></path> </svg> </template> <template id="file-code-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-file-code"> <path d="M4 1.75C4 .784 4.784 0 5.75 0h5.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v8.586A1.75 1.75 0 0 1 14.25 15h-9a.75.75 0 0 1 0-1.5h9a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 10 4.25V1.5H5.75a.25.25 0 0 0-.25.25v2.5a.75.75 0 0 1-1.5 0Zm1.72 4.97a.75.75 0 0 1 1.06 0l2 2a.75.75 0 0 1 0 1.06l-2 2a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734l1.47-1.47-1.47-1.47a.75.75 0 0 1 0-1.06ZM3.28 7.78 1.81 9.25l1.47 1.47a.751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018l-2-2a.75.75 0 0 1 0-1.06l2-2a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Zm8.22-6.218V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path> </svg> </template> <template id="history-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-history"> <path d="m.427 1.927 1.215 1.215a8.002 8.002 0 1 1-1.6 5.685.75.75 0 1 1 1.493-.154 6.5 6.5 0 1 0 1.18-4.458l1.358 1.358A.25.25 0 0 1 3.896 6H.25A.25.25 0 0 1 0 5.75V2.104a.25.25 0 0 1 .427-.177ZM7.75 4a.75.75 0 0 1 .75.75v2.992l2.028.812a.75.75 0 0 1-.557 1.392l-2.5-1A.751.751 0 0 1 7 8.25v-3.5A.75.75 0 0 1 7.75 4Z"></path> </svg> </template> <template id="repo-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo"> <path d="M2 2.5A2.5 2.5 0 0 1 4.5 0h8.75a.75.75 0 0 1 .75.75v12.5a.75.75 0 0 1-.75.75h-2.5a.75.75 0 0 1 0-1.5h1.75v-2h-8a1 1 0 0 0-.714 1.7.75.75 0 1 1-1.072 1.05A2.495 2.495 0 0 1 2 11.5Zm10.5-1h-8a1 1 0 0 0-1 1v6.708A2.486 2.486 0 0 1 4.5 9h8ZM5 12.25a.25.25 0 0 1 .25-.25h3.5a.25.25 0 0 1 .25.25v3.25a.25.25 0 0 1-.4.2l-1.45-1.087a.249.249 0 0 0-.3 0L5.4 15.7a.25.25 0 0 1-.4-.2Z"></path> </svg> </template> <template id="bookmark-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-bookmark"> <path d="M3 2.75C3 1.784 3.784 1 4.75 1h6.5c.966 0 1.75.784 1.75 1.75v11.5a.75.75 0 0 1-1.227.579L8 11.722l-3.773 3.107A.751.751 0 0 1 3 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v9.91l3.023-2.489a.75.75 0 0 1 .954 0l3.023 2.49V2.75a.25.25 0 0 0-.25-.25Z"></path> </svg> </template> <template id="plus-circle-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-plus-circle"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm7.25-3.25v2.5h2.5a.75.75 0 0 1 0 1.5h-2.5v2.5a.75.75 0 0 1-1.5 0v-2.5h-2.5a.75.75 0 0 1 0-1.5h2.5v-2.5a.75.75 0 0 1 1.5 0Z"></path> </svg> </template> <template id="circle-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-dot-fill"> <path d="M8 4a4 4 0 1 1 0 8 4 4 0 0 1 0-8Z"></path> </svg> </template> <template id="trash-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-trash"> <path d="M11 1.75V3h2.25a.75.75 0 0 1 0 1.5H2.75a.75.75 0 0 1 0-1.5H5V1.75C5 .784 5.784 0 6.75 0h2.5C10.216 0 11 .784 11 1.75ZM4.496 6.675l.66 6.6a.25.25 0 0 0 .249.225h5.19a.25.25 0 0 0 .249-.225l.66-6.6a.75.75 0 0 1 1.492.149l-.66 6.6A1.748 1.748 0 0 1 10.595 15h-5.19a1.75 1.75 0 0 1-1.741-1.575l-.66-6.6a.75.75 0 1 1 1.492-.15ZM6.5 1.75V3h3V1.75a.25.25 0 0 0-.25-.25h-2.5a.25.25 0 0 0-.25.25Z"></path> </svg> </template> <template id="team-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-people"> <path d="M2 5.5a3.5 3.5 0 1 1 5.898 2.549 5.508 5.508 0 0 1 3.034 4.084.75.75 0 1 1-1.482.235 4 4 0 0 0-7.9 0 .75.75 0 0 1-1.482-.236A5.507 5.507 0 0 1 3.102 8.05 3.493 3.493 0 0 1 2 5.5ZM11 4a3.001 3.001 0 0 1 2.22 5.018 5.01 5.01 0 0 1 2.56 3.012.749.749 0 0 1-.885.954.752.752 0 0 1-.549-.514 3.507 3.507 0 0 0-2.522-2.372.75.75 0 0 1-.574-.73v-.352a.75.75 0 0 1 .416-.672A1.5 1.5 0 0 0 11 5.5.75.75 0 0 1 11 4Zm-5.5-.5a2 2 0 1 0-.001 3.999A2 2 0 0 0 5.5 3.5Z"></path> </svg> </template> <template id="project-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-project"> <path d="M1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25V1.75C0 .784.784 0 1.75 0ZM1.5 1.75v12.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25ZM11.75 3a.75.75 0 0 1 .75.75v7.5a.75.75 0 0 1-1.5 0v-7.5a.75.75 0 0 1 .75-.75Zm-8.25.75a.75.75 0 0 1 1.5 0v5.5a.75.75 0 0 1-1.5 0ZM8 3a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 3Z"></path> </svg> </template> <template id="pencil-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-pencil"> <path d="M11.013 1.427a1.75 1.75 0 0 1 2.474 0l1.086 1.086a1.75 1.75 0 0 1 0 2.474l-8.61 8.61c-.21.21-.47.364-.756.445l-3.251.93a.75.75 0 0 1-.927-.928l.929-3.25c.081-.286.235-.547.445-.758l8.61-8.61Zm.176 4.823L9.75 4.81l-6.286 6.287a.253.253 0 0 0-.064.108l-.558 1.953 1.953-.558a.253.253 0 0 0 .108-.064Zm1.238-3.763a.25.25 0 0 0-.354 0L10.811 3.75l1.439 1.44 1.263-1.263a.25.25 0 0 0 0-.354Z"></path> </svg> </template> <template id="copilot-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copilot"> <path d="M7.998 15.035c-4.562 0-7.873-2.914-7.998-3.749V9.338c.085-.628.677-1.686 1.588-2.065.013-.07.024-.143.036-.218.029-.183.06-.384.126-.612-.201-.508-.254-1.084-.254-1.656 0-.87.128-1.769.693-2.484.579-.733 1.494-1.124 2.724-1.261 1.206-.134 2.262.034 2.944.765.05.053.096.108.139.165.044-.057.094-.112.143-.165.682-.731 1.738-.899 2.944-.765 1.23.137 2.145.528 2.724 1.261.566.715.693 1.614.693 2.484 0 .572-.053 1.148-.254 1.656.066.228.098.429.126.612.012.076.024.148.037.218.924.385 1.522 1.471 1.591 2.095v1.872c0 .766-3.351 3.795-8.002 3.795Zm0-1.485c2.28 0 4.584-1.11 5.002-1.433V7.862l-.023-.116c-.49.21-1.075.291-1.727.291-1.146 0-2.059-.327-2.71-.991A3.222 3.222 0 0 1 8 6.303a3.24 3.24 0 0 1-.544.743c-.65.664-1.563.991-2.71.991-.652 0-1.236-.081-1.727-.291l-.023.116v4.255c.419.323 2.722 1.433 5.002 1.433ZM6.762 2.83c-.193-.206-.637-.413-1.682-.297-1.019.113-1.479.404-1.713.7-.247.312-.369.789-.369 1.554 0 .793.129 1.171.308 1.371.162.181.519.379 1.442.379.853 0 1.339-.235 1.638-.54.315-.322.527-.827.617-1.553.117-.935-.037-1.395-.241-1.614Zm4.155-.297c-1.044-.116-1.488.091-1.681.297-.204.219-.359.679-.242 1.614.091.726.303 1.231.618 1.553.299.305.784.54 1.638.54.922 0 1.28-.198 1.442-.379.179-.2.308-.578.308-1.371 0-.765-.123-1.242-.37-1.554-.233-.296-.693-.587-1.713-.7Z"></path><path d="M6.25 9.037a.75.75 0 0 1 .75.75v1.501a.75.75 0 0 1-1.5 0V9.787a.75.75 0 0 1 .75-.75Zm4.25.75v1.501a.75.75 0 0 1-1.5 0V9.787a.75.75 0 0 1 1.5 0Z"></path> </svg> </template> <template id="copilot-error-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copilot-error"> <path d="M16 11.24c0 .112-.072.274-.21.467L13 9.688V7.862l-.023-.116c-.49.21-1.075.291-1.727.291-.198 0-.388-.009-.571-.029L6.833 5.226a4.01 4.01 0 0 0 .17-.782c.117-.935-.037-1.395-.241-1.614-.193-.206-.637-.413-1.682-.297-.683.076-1.115.231-1.395.415l-1.257-.91c.579-.564 1.413-.877 2.485-.996 1.206-.134 2.262.034 2.944.765.05.053.096.108.139.165.044-.057.094-.112.143-.165.682-.731 1.738-.899 2.944-.765 1.23.137 2.145.528 2.724 1.261.566.715.693 1.614.693 2.484 0 .572-.053 1.148-.254 1.656.066.228.098.429.126.612.012.076.024.148.037.218.924.385 1.522 1.471 1.591 2.095Zm-5.083-8.707c-1.044-.116-1.488.091-1.681.297-.204.219-.359.679-.242 1.614.091.726.303 1.231.618 1.553.299.305.784.54 1.638.54.922 0 1.28-.198 1.442-.379.179-.2.308-.578.308-1.371 0-.765-.123-1.242-.37-1.554-.233-.296-.693-.587-1.713-.7Zm2.511 11.074c-1.393.776-3.272 1.428-5.43 1.428-4.562 0-7.873-2.914-7.998-3.749V9.338c.085-.628.677-1.686 1.588-2.065.013-.07.024-.143.036-.218.029-.183.06-.384.126-.612-.18-.455-.241-.963-.252-1.475L.31 4.107A.747.747 0 0 1 0 3.509V3.49a.748.748 0 0 1 .625-.73c.156-.026.306.047.435.139l14.667 10.578a.592.592 0 0 1 .227.264.752.752 0 0 1 .046.249v.022a.75.75 0 0 1-1.19.596Zm-1.367-.991L5.635 7.964a5.128 5.128 0 0 1-.889.073c-.652 0-1.236-.081-1.727-.291l-.023.116v4.255c.419.323 2.722 1.433 5.002 1.433 1.539 0 3.089-.505 4.063-.934Z"></path> </svg> </template> <template id="workflow-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-workflow"> <path d="M0 1.75C0 .784.784 0 1.75 0h3.5C6.216 0 7 .784 7 1.75v3.5A1.75 1.75 0 0 1 5.25 7H4v4a1 1 0 0 0 1 1h4v-1.25C9 9.784 9.784 9 10.75 9h3.5c.966 0 1.75.784 1.75 1.75v3.5A1.75 1.75 0 0 1 14.25 16h-3.5A1.75 1.75 0 0 1 9 14.25v-.75H5A2.5 2.5 0 0 1 2.5 11V7h-.75A1.75 1.75 0 0 1 0 5.25Zm1.75-.25a.25.25 0 0 0-.25.25v3.5c0 .138.112.25.25.25h3.5a.25.25 0 0 0 .25-.25v-3.5a.25.25 0 0 0-.25-.25Zm9 9a.25.25 0 0 0-.25.25v3.5c0 .138.112.25.25.25h3.5a.25.25 0 0 0 .25-.25v-3.5a.25.25 0 0 0-.25-.25Z"></path> </svg> </template> <template id="book-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-book"> <path d="M0 1.75A.75.75 0 0 1 .75 1h4.253c1.227 0 2.317.59 3 1.501A3.743 3.743 0 0 1 11.006 1h4.245a.75.75 0 0 1 .75.75v10.5a.75.75 0 0 1-.75.75h-4.507a2.25 2.25 0 0 0-1.591.659l-.622.621a.75.75 0 0 1-1.06 0l-.622-.621A2.25 2.25 0 0 0 5.258 13H.75a.75.75 0 0 1-.75-.75Zm7.251 10.324.004-5.073-.002-2.253A2.25 2.25 0 0 0 5.003 2.5H1.5v9h3.757a3.75 3.75 0 0 1 1.994.574ZM8.755 4.75l-.004 7.322a3.752 3.752 0 0 1 1.992-.572H14.5v-9h-3.495a2.25 2.25 0 0 0-2.25 2.25Z"></path> </svg> </template> <template id="code-review-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code-review"> <path d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v8.5A1.75 1.75 0 0 1 14.25 13H8.061l-2.574 2.573A1.458 1.458 0 0 1 3 14.543V13H1.75A1.75 1.75 0 0 1 0 11.25v-8.5C0 1.784.784 1 1.75 1ZM1.5 2.75v8.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-8.5a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Zm5.28 1.72a.75.75 0 0 1 0 1.06L5.31 7l1.47 1.47a.751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018l-2-2a.75.75 0 0 1 0-1.06l2-2a.75.75 0 0 1 1.06 0Zm2.44 0a.75.75 0 0 1 1.06 0l2 2a.75.75 0 0 1 0 1.06l-2 2a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L10.69 7 9.22 5.53a.75.75 0 0 1 0-1.06Z"></path> </svg> </template> <template id="codespaces-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-codespaces"> <path d="M0 11.25c0-.966.784-1.75 1.75-1.75h12.5c.966 0 1.75.784 1.75 1.75v3A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25Zm2-9.5C2 .784 2.784 0 3.75 0h8.5C13.216 0 14 .784 14 1.75v5a1.75 1.75 0 0 1-1.75 1.75h-8.5A1.75 1.75 0 0 1 2 6.75Zm1.75-.25a.25.25 0 0 0-.25.25v5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-5a.25.25 0 0 0-.25-.25Zm-2 9.5a.25.25 0 0 0-.25.25v3c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-3a.25.25 0 0 0-.25-.25Z"></path><path d="M7 12.75a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1-.75-.75Zm-4 0a.75.75 0 0 1 .75-.75h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1-.75-.75Z"></path> </svg> </template> <template id="comment-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-comment"> <path d="M1 2.75C1 1.784 1.784 1 2.75 1h10.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 13.25 12H9.06l-2.573 2.573A1.458 1.458 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> </template> <template id="comment-discussion-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-comment-discussion"> <path d="M1.75 1h8.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 10.25 10H7.061l-2.574 2.573A1.458 1.458 0 0 1 2 11.543V10h-.25A1.75 1.75 0 0 1 0 8.25v-5.5C0 1.784.784 1 1.75 1ZM1.5 2.75v5.5c0 .138.112.25.25.25h1a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h3.5a.25.25 0 0 0 .25-.25v-5.5a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25Zm13 2a.25.25 0 0 0-.25-.25h-.5a.75.75 0 0 1 0-1.5h.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 14.25 12H14v1.543a1.458 1.458 0 0 1-2.487 1.03L9.22 12.28a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l2.22 2.22v-2.19a.75.75 0 0 1 .75-.75h1a.25.25 0 0 0 .25-.25Z"></path> </svg> </template> <template id="organization-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-organization"> <path d="M1.75 16A1.75 1.75 0 0 1 0 14.25V1.75C0 .784.784 0 1.75 0h8.5C11.216 0 12 .784 12 1.75v12.5c0 .085-.006.168-.018.25h2.268a.25.25 0 0 0 .25-.25V8.285a.25.25 0 0 0-.111-.208l-1.055-.703a.749.749 0 1 1 .832-1.248l1.055.703c.487.325.779.871.779 1.456v5.965A1.75 1.75 0 0 1 14.25 16h-3.5a.766.766 0 0 1-.197-.026c-.099.017-.2.026-.303.026h-3a.75.75 0 0 1-.75-.75V14h-1v1.25a.75.75 0 0 1-.75.75Zm-.25-1.75c0 .138.112.25.25.25H4v-1.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 .75.75v1.25h2.25a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25ZM3.75 6h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5ZM3 3.75A.75.75 0 0 1 3.75 3h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 3 3.75Zm4 3A.75.75 0 0 1 7.75 6h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 7 6.75ZM7.75 3h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5ZM3 9.75A.75.75 0 0 1 3.75 9h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 3 9.75ZM7.75 9h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5Z"></path> </svg> </template> <template id="rocket-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-rocket"> <path d="M14.064 0h.186C15.216 0 16 .784 16 1.75v.186a8.752 8.752 0 0 1-2.564 6.186l-.458.459c-.314.314-.641.616-.979.904v3.207c0 .608-.315 1.172-.833 1.49l-2.774 1.707a.749.749 0 0 1-1.11-.418l-.954-3.102a1.214 1.214 0 0 1-.145-.125L3.754 9.816a1.218 1.218 0 0 1-.124-.145L.528 8.717a.749.749 0 0 1-.418-1.11l1.71-2.774A1.748 1.748 0 0 1 3.31 4h3.204c.288-.338.59-.665.904-.979l.459-.458A8.749 8.749 0 0 1 14.064 0ZM8.938 3.623h-.002l-.458.458c-.76.76-1.437 1.598-2.02 2.5l-1.5 2.317 2.143 2.143 2.317-1.5c.902-.583 1.74-1.26 2.499-2.02l.459-.458a7.25 7.25 0 0 0 2.123-5.127V1.75a.25.25 0 0 0-.25-.25h-.186a7.249 7.249 0 0 0-5.125 2.123ZM3.56 14.56c-.732.732-2.334 1.045-3.005 1.148a.234.234 0 0 1-.201-.064.234.234 0 0 1-.064-.201c.103-.671.416-2.273 1.15-3.003a1.502 1.502 0 1 1 2.12 2.12Zm6.94-3.935c-.088.06-.177.118-.266.175l-2.35 1.521.548 1.783 1.949-1.2a.25.25 0 0 0 .119-.213ZM3.678 8.116 5.2 5.766c.058-.09.117-.178.176-.266H3.309a.25.25 0 0 0-.213.119l-1.2 1.95ZM12 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> </template> <template id="shield-check-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-shield-check"> <path d="m8.533.133 5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667l5.25-1.68a1.748 1.748 0 0 1 1.066 0Zm-.61 1.429.001.001-5.25 1.68a.251.251 0 0 0-.174.237V7c0 1.36.275 2.666 1.057 3.859.784 1.194 2.121 2.342 4.366 3.298a.196.196 0 0 0 .154 0c2.245-.957 3.582-2.103 4.366-3.297C13.225 9.666 13.5 8.358 13.5 7V3.48a.25.25 0 0 0-.174-.238l-5.25-1.68a.25.25 0 0 0-.153 0ZM11.28 6.28l-3.5 3.5a.75.75 0 0 1-1.06 0l-1.5-1.5a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l.97.97 2.97-2.97a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </template> <template id="heart-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-heart"> <path d="m8 14.25.345.666a.75.75 0 0 1-.69 0l-.008-.004-.018-.01a7.152 7.152 0 0 1-.31-.17 22.055 22.055 0 0 1-3.434-2.414C2.045 10.731 0 8.35 0 5.5 0 2.836 2.086 1 4.25 1 5.797 1 7.153 1.802 8 3.02 8.847 1.802 10.203 1 11.75 1 13.914 1 16 2.836 16 5.5c0 2.85-2.045 5.231-3.885 6.818a22.066 22.066 0 0 1-3.744 2.584l-.018.01-.006.003h-.002ZM4.25 2.5c-1.336 0-2.75 1.164-2.75 3 0 2.15 1.58 4.144 3.365 5.682A20.58 20.58 0 0 0 8 13.393a20.58 20.58 0 0 0 3.135-2.211C12.92 9.644 14.5 7.65 14.5 5.5c0-1.836-1.414-3-2.75-3-1.373 0-2.609.986-3.029 2.456a.749.749 0 0 1-1.442 0C6.859 3.486 5.623 2.5 4.25 2.5Z"></path> </svg> </template> <template id="server-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-server"> <path d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v4c0 .372-.116.717-.314 1 .198.283.314.628.314 1v4a1.75 1.75 0 0 1-1.75 1.75H1.75A1.75 1.75 0 0 1 0 12.75v-4c0-.358.109-.707.314-1a1.739 1.739 0 0 1-.314-1v-4C0 1.784.784 1 1.75 1ZM1.5 2.75v4c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-4a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Zm.25 5.75a.25.25 0 0 0-.25.25v4c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-4a.25.25 0 0 0-.25-.25ZM7 4.75A.75.75 0 0 1 7.75 4h4.5a.75.75 0 0 1 0 1.5h-4.5A.75.75 0 0 1 7 4.75ZM7.75 10h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM3 4.75A.75.75 0 0 1 3.75 4h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 3 4.75ZM3.75 10h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5Z"></path> </svg> </template> <template id="globe-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-globe"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM5.78 8.75a9.64 9.64 0 0 0 1.363 4.177c.255.426.542.832.857 1.215.245-.296.551-.705.857-1.215A9.64 9.64 0 0 0 10.22 8.75Zm4.44-1.5a9.64 9.64 0 0 0-1.363-4.177c-.307-.51-.612-.919-.857-1.215a9.927 9.927 0 0 0-.857 1.215A9.64 9.64 0 0 0 5.78 7.25Zm-5.944 1.5H1.543a6.507 6.507 0 0 0 4.666 5.5c-.123-.181-.24-.365-.352-.552-.715-1.192-1.437-2.874-1.581-4.948Zm-2.733-1.5h2.733c.144-2.074.866-3.756 1.58-4.948.12-.197.237-.381.353-.552a6.507 6.507 0 0 0-4.666 5.5Zm10.181 1.5c-.144 2.074-.866 3.756-1.58 4.948-.12.197-.237.381-.353.552a6.507 6.507 0 0 0 4.666-5.5Zm2.733-1.5a6.507 6.507 0 0 0-4.666-5.5c.123.181.24.365.353.552.714 1.192 1.436 2.874 1.58 4.948Z"></path> </svg> </template> <template id="issue-opened-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-issue-opened"> <path d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path><path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"></path> </svg> </template> <template id="device-mobile-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-device-mobile"> <path d="M3.75 0h8.5C13.216 0 14 .784 14 1.75v12.5A1.75 1.75 0 0 1 12.25 16h-8.5A1.75 1.75 0 0 1 2 14.25V1.75C2 .784 2.784 0 3.75 0ZM3.5 1.75v12.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25ZM8 13a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path> </svg> </template> <template id="package-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-package"> <path d="m8.878.392 5.25 3.045c.54.314.872.89.872 1.514v6.098a1.75 1.75 0 0 1-.872 1.514l-5.25 3.045a1.75 1.75 0 0 1-1.756 0l-5.25-3.045A1.75 1.75 0 0 1 1 11.049V4.951c0-.624.332-1.201.872-1.514L7.122.392a1.75 1.75 0 0 1 1.756 0ZM7.875 1.69l-4.63 2.685L8 7.133l4.755-2.758-4.63-2.685a.248.248 0 0 0-.25 0ZM2.5 5.677v5.372c0 .09.047.171.125.216l4.625 2.683V8.432Zm6.25 8.271 4.625-2.683a.25.25 0 0 0 .125-.216V5.677L8.75 8.432Z"></path> </svg> </template> <template id="credit-card-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-credit-card"> <path d="M10.75 9a.75.75 0 0 0 0 1.5h1.5a.75.75 0 0 0 0-1.5h-1.5Z"></path><path d="M0 3.75C0 2.784.784 2 1.75 2h12.5c.966 0 1.75.784 1.75 1.75v8.5A1.75 1.75 0 0 1 14.25 14H1.75A1.75 1.75 0 0 1 0 12.25ZM14.5 6.5h-13v5.75c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25Zm0-2.75a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25V5h13Z"></path> </svg> </template> <template id="play-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-play"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm4.879-2.773 4.264 2.559a.25.25 0 0 1 0 .428l-4.264 2.559A.25.25 0 0 1 6 10.559V5.442a.25.25 0 0 1 .379-.215Z"></path> </svg> </template> <template id="gift-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-gift"> <path d="M2 2.75A2.75 2.75 0 0 1 4.75 0c.983 0 1.873.42 2.57 1.232.268.318.497.668.68 1.042.183-.375.411-.725.68-1.044C9.376.42 10.266 0 11.25 0a2.75 2.75 0 0 1 2.45 4h.55c.966 0 1.75.784 1.75 1.75v2c0 .698-.409 1.301-1 1.582v4.918A1.75 1.75 0 0 1 13.25 16H2.75A1.75 1.75 0 0 1 1 14.25V9.332C.409 9.05 0 8.448 0 7.75v-2C0 4.784.784 4 1.75 4h.55c-.192-.375-.3-.8-.3-1.25ZM7.25 9.5H2.5v4.75c0 .138.112.25.25.25h4.5Zm1.5 0v5h4.5a.25.25 0 0 0 .25-.25V9.5Zm0-4V8h5.5a.25.25 0 0 0 .25-.25v-2a.25.25 0 0 0-.25-.25Zm-7 0a.25.25 0 0 0-.25.25v2c0 .138.112.25.25.25h5.5V5.5h-5.5Zm3-4a1.25 1.25 0 0 0 0 2.5h2.309c-.233-.818-.542-1.401-.878-1.793-.43-.502-.915-.707-1.431-.707ZM8.941 4h2.309a1.25 1.25 0 0 0 0-2.5c-.516 0-1 .205-1.43.707-.337.392-.646.975-.879 1.793Z"></path> </svg> </template> <template id="code-square-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code-square"> <path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25Zm7.47 3.97a.75.75 0 0 1 1.06 0l2 2a.75.75 0 0 1 0 1.06l-2 2a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L10.69 8 9.22 6.53a.75.75 0 0 1 0-1.06ZM6.78 6.53 5.31 8l1.47 1.47a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215l-2-2a.75.75 0 0 1 0-1.06l2-2a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </template> <template id="device-desktop-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-device-desktop"> <path d="M14.25 1c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 14.25 12h-3.727c.099 1.041.52 1.872 1.292 2.757A.752.752 0 0 1 11.25 16h-6.5a.75.75 0 0 1-.565-1.243c.772-.885 1.192-1.716 1.292-2.757H1.75A1.75 1.75 0 0 1 0 10.25v-7.5C0 1.784.784 1 1.75 1ZM1.75 2.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25ZM9.018 12H6.982a5.72 5.72 0 0 1-.765 2.5h3.566a5.72 5.72 0 0 1-.765-2.5Z"></path> </svg> </template> <div class="position-relative"> <ul role="listbox" class="ActionListWrap QueryBuilder-ListWrap" aria-label="Suggestions" data-action=" combobox-commit:query-builder#comboboxCommit mousedown:query-builder#resultsMousedown " data-target="query-builder.resultsList" data-persist-list=false id="query-builder-test-results" ></ul> </div> <div class="FormControl-inlineValidation" id="validation-a65d3319-1744-452b-92f0-84aed02f8904" hidden="hidden"> <span class="FormControl-inlineValidation--visual"> <svg aria-hidden="true" height="12" viewBox="0 0 12 12" version="1.1" width="12" data-view-component="true" class="octicon octicon-alert-fill"> <path d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"></path> </svg> </span> <span></span> </div> </div> <div data-target="query-builder.screenReaderFeedback" aria-live="polite" aria-atomic="true" class="sr-only"></div> </query-builder></form> <div class="d-flex flex-row color-fg-muted px-3 text-small color-bg-default search-feedback-prompt"> <a target="_blank" href="https://docs.github.com/search-github/github-code-search/understanding-github-code-search-syntax" data-view-component="true" class="Link color-fg-accent text-normal ml-2"> Search syntax tips </a> <div class="d-flex flex-1"></div> </div> </div> </div> </div> </modal-dialog></div> </div> <div data-action="click:qbsearch-input#retract" class="dark-backdrop position-fixed" hidden data-target="qbsearch-input.darkBackdrop"></div> <div class="color-fg-default"> <dialog-helper> <dialog data-target="qbsearch-input.feedbackDialog" data-action="close:qbsearch-input#handleDialogClose cancel:qbsearch-input#handleDialogClose" id="feedback-dialog" aria-modal="true" aria-labelledby="feedback-dialog-title" aria-describedby="feedback-dialog-description" data-view-component="true" class="Overlay Overlay-whenNarrow Overlay--size-medium Overlay--motion-scaleFade Overlay--disableScroll"> <div data-view-component="true" class="Overlay-header"> <div class="Overlay-headerContentWrap"> <div class="Overlay-titleWrap"> <h1 class="Overlay-title " id="feedback-dialog-title"> Provide feedback </h1> </div> <div class="Overlay-actionWrap"> <button data-close-dialog-id="feedback-dialog" aria-label="Close" type="button" data-view-component="true" class="close-button Overlay-closeButton"><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg></button> </div> </div> </div> <scrollable-region data-labelled-by="feedback-dialog-title"> <div data-view-component="true" class="Overlay-body"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form id="code-search-feedback-form" data-turbo="false" action="/search/feedback" accept-charset="UTF-8" method="post"><input type="hidden" data-csrf="true" name="authenticity_token" value="xClwzZzKm1amckmuMIBZPaaoX1LsCimMqVJflFzHkkJq+/rg4PkzEvFgSJY6bCabjuJxxfNRWYhnAjKvTqvKSA==" /> <p>We read every piece of feedback, and take your input very seriously.</p> <textarea name="feedback" class="form-control width-full mb-2" style="height: 120px" id="feedback"></textarea> <input name="include_email" id="include_email" aria-label="Include my email address so I can be contacted" class="form-control mr-2" type="checkbox"> <label for="include_email" style="font-weight: normal">Include my email address so I can be contacted</label> </form></div> </scrollable-region> <div data-view-component="true" class="Overlay-footer Overlay-footer--alignEnd"> <button data-close-dialog-id="feedback-dialog" type="button" data-view-component="true" class="btn"> Cancel </button> <button form="code-search-feedback-form" data-action="click:qbsearch-input#submitFeedback" type="submit" data-view-component="true" class="btn-primary btn"> Submit feedback </button> </div> </dialog></dialog-helper> <custom-scopes data-target="qbsearch-input.customScopesManager"> <dialog-helper> <dialog data-target="custom-scopes.customScopesModalDialog" data-action="close:qbsearch-input#handleDialogClose cancel:qbsearch-input#handleDialogClose" id="custom-scopes-dialog" aria-modal="true" aria-labelledby="custom-scopes-dialog-title" aria-describedby="custom-scopes-dialog-description" data-view-component="true" class="Overlay Overlay-whenNarrow Overlay--size-medium Overlay--motion-scaleFade Overlay--disableScroll"> <div data-view-component="true" class="Overlay-header Overlay-header--divided"> <div class="Overlay-headerContentWrap"> <div class="Overlay-titleWrap"> <h1 class="Overlay-title " id="custom-scopes-dialog-title"> Saved searches </h1> <h2 id="custom-scopes-dialog-description" class="Overlay-description">Use saved searches to filter your results more quickly</h2> </div> <div class="Overlay-actionWrap"> <button data-close-dialog-id="custom-scopes-dialog" aria-label="Close" type="button" data-view-component="true" class="close-button Overlay-closeButton"><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg></button> </div> </div> </div> <scrollable-region data-labelled-by="custom-scopes-dialog-title"> <div data-view-component="true" class="Overlay-body"> <div data-target="custom-scopes.customScopesModalDialogFlash"></div> <div hidden class="create-custom-scope-form" data-target="custom-scopes.createCustomScopeForm"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form id="custom-scopes-dialog-form" data-turbo="false" action="/search/custom_scopes" accept-charset="UTF-8" method="post"><input type="hidden" data-csrf="true" name="authenticity_token" value="Ysgu9wk6YcEFn3mBvxsswv+fGIxqiLQC0rxka4ZruhD1EPMccTuKR5rFTLfDsHY86j2CxUmILFUA7YaaOPPCtg==" /> <div data-target="custom-scopes.customScopesModalDialogFlash"></div> <input type="hidden" id="custom_scope_id" name="custom_scope_id" data-target="custom-scopes.customScopesIdField"> <div class="form-group"> <label for="custom_scope_name">Name</label> <auto-check src="/search/custom_scopes/check_name" required> <input type="text" name="custom_scope_name" id="custom_scope_name" data-target="custom-scopes.customScopesNameField" class="form-control" autocomplete="off" placeholder="github-ruby" required maxlength="50"> <input type="hidden" data-csrf="true" value="uiU66CMvKuoJVC0K4/6mXXLRlfAyUo3PP4svj5iGqzaqqeee1Oh8tP4yrfA1f/4hSC7LqELBQj5B77vl1r2Piw==" /> </auto-check> </div> <div class="form-group"> <label for="custom_scope_query">Query</label> <input type="text" name="custom_scope_query" id="custom_scope_query" data-target="custom-scopes.customScopesQueryField" class="form-control" autocomplete="off" placeholder="(repo:mona/a OR repo:mona/b) AND lang:python" required maxlength="500"> </div> <p class="text-small color-fg-muted"> To see all available qualifiers, see our <a class="Link--inTextBlock" href="https://docs.github.com/search-github/github-code-search/understanding-github-code-search-syntax">documentation</a>. </p> </form> </div> <div data-target="custom-scopes.manageCustomScopesForm"> <div data-target="custom-scopes.list"></div> </div> </div> </scrollable-region> <div data-view-component="true" class="Overlay-footer Overlay-footer--alignEnd Overlay-footer--divided"> <button data-action="click:custom-scopes#customScopesCancel" type="button" data-view-component="true" class="btn"> Cancel </button> <button form="custom-scopes-dialog-form" data-action="click:custom-scopes#customScopesSubmit" data-target="custom-scopes.customScopesSubmitButton" type="submit" data-view-component="true" class="btn-primary btn"> Create saved search </button> </div> </dialog></dialog-helper> </custom-scopes> </div> </qbsearch-input> <div class="position-relative HeaderMenu-link-wrap d-lg-inline-block"> <a href="/login?return_to=https%3A%2F%2Fgithub.com%2Ffacebook%2Freact%2Freleases" class="HeaderMenu-link HeaderMenu-link--sign-in HeaderMenu-button flex-shrink-0 no-underline d-none d-lg-inline-flex border border-lg-0 rounded rounded-lg-0 px-2 py-1" style="margin-left: 12px;" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"site header menu","repository_id":null,"auth_type":"SIGN_UP","originating_url":"https://github.com/facebook/react/releases","user_id":null}}" data-hydro-click-hmac="24040e3513ae61081bbcdf8ed1991baef7cc868876352e7086c4e53075c8c717" data-analytics-event="{"category":"Marketing nav","action":"click to go to homepage","label":"ref_page:Marketing;ref_cta:Sign in;ref_loc:Header"}" > Sign in </a> </div> <a href="/signup?ref_cta=Sign+up&ref_loc=header+logged+out&ref_page=%2F%3Cuser-name%3E%2F%3Crepo-name%3E%2Freleases%2Findex&source=header-repo&source_repo=facebook%2Freact" class="HeaderMenu-link HeaderMenu-link--sign-up HeaderMenu-button flex-shrink-0 d-flex d-lg-inline-flex no-underline border color-border-default rounded px-2 py-1" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"site header menu","repository_id":null,"auth_type":"SIGN_UP","originating_url":"https://github.com/facebook/react/releases","user_id":null}}" data-hydro-click-hmac="24040e3513ae61081bbcdf8ed1991baef7cc868876352e7086c4e53075c8c717" data-analytics-event="{"category":"Sign up","action":"click to sign up for account","label":"ref_page:/<user-name>/<repo-name>/releases/index;ref_cta:Sign up;ref_loc:header logged out"}" > Sign up </a> <button type="button" class="sr-only js-header-menu-focus-trap d-block d-lg-none">Reseting focus</button> </div> </div> </div> </div> </header> <div hidden="hidden" data-view-component="true" class="js-stale-session-flash stale-session-flash flash flash-warn flash-full"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-alert"> <path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <span class="js-stale-session-flash-signed-in" hidden>You signed in with another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <span class="js-stale-session-flash-signed-out" hidden>You signed out in another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <span class="js-stale-session-flash-switched" hidden>You switched accounts on another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <button id="icon-button-5471f48b-5855-415a-8b5d-deffaa2097be" aria-labelledby="tooltip-cae7062a-f646-4caa-adf9-768a6c9c9c2e" type="button" data-view-component="true" class="Button Button--iconOnly Button--invisible Button--medium flash-close js-flash-close"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x Button-visual"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button><tool-tip id="tooltip-cae7062a-f646-4caa-adf9-768a6c9c9c2e" for="icon-button-5471f48b-5855-415a-8b5d-deffaa2097be" popover="manual" data-direction="s" data-type="label" data-view-component="true" class="sr-only position-absolute">Dismiss alert</tool-tip> </div> </div> <div id="start-of-content" class="show-on-focus"></div> <div id="js-flash-container" class="flash-container" data-turbo-replace> <template class="js-flash-template"> <div class="flash flash-full {{ className }}"> <div > <button autofocus class="flash-close js-flash-close" type="button" aria-label="Dismiss this message"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> <div aria-atomic="true" role="alert" class="js-flash-alert"> <div>{{ message }}</div> </div> </div> </div> </template> </div> <div class="application-main " data-commit-hovercards-enabled data-discussion-hovercards-enabled data-issue-and-pr-hovercards-enabled > <div itemscope itemtype="http://schema.org/SoftwareSourceCode" class=""> <main id="js-repo-pjax-container" > <div id="repository-container-header" class="pt-3 hide-full-screen" style="background-color: var(--page-header-bgColor, var(--color-page-header-bg));" data-turbo-replace> <div class="d-flex flex-nowrap flex-justify-end mb-3 px-3 px-lg-5" style="gap: 1rem;"> <div class="flex-auto min-width-0 width-fit"> <div class=" d-flex flex-wrap flex-items-center wb-break-word f3 text-normal"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo color-fg-muted mr-2"> <path d="M2 2.5A2.5 2.5 0 0 1 4.5 0h8.75a.75.75 0 0 1 .75.75v12.5a.75.75 0 0 1-.75.75h-2.5a.75.75 0 0 1 0-1.5h1.75v-2h-8a1 1 0 0 0-.714 1.7.75.75 0 1 1-1.072 1.05A2.495 2.495 0 0 1 2 11.5Zm10.5-1h-8a1 1 0 0 0-1 1v6.708A2.486 2.486 0 0 1 4.5 9h8ZM5 12.25a.25.25 0 0 1 .25-.25h3.5a.25.25 0 0 1 .25.25v3.25a.25.25 0 0 1-.4.2l-1.45-1.087a.249.249 0 0 0-.3 0L5.4 15.7a.25.25 0 0 1-.4-.2Z"></path> </svg> <span class="author flex-self-stretch" itemprop="author"> <a class="url fn" rel="author" data-hovercard-type="organization" data-hovercard-url="/orgs/facebook/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/facebook"> facebook </a> </span> <span class="mx-1 flex-self-stretch color-fg-muted">/</span> <strong itemprop="name" class="mr-2 flex-self-stretch"> <a data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" href="/facebook/react">react</a> </strong> <span></span><span class="Label Label--secondary v-align-middle mr-1">Public</span> </div> </div> <div id="repository-details-container" class="flex-shrink-0" data-turbo-replace style="max-width: 70%;"> <ul class="pagehead-actions flex-shrink-0 d-none d-md-inline" style="padding: 2px 0;"> <li> <a href="/login?return_to=%2Ffacebook%2Freact" rel="nofollow" id="repository-details-watch-button" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"notification subscription menu watch","repository_id":null,"auth_type":"LOG_IN","originating_url":"https://github.com/facebook/react/releases","user_id":null}}" data-hydro-click-hmac="9b4aa92288418065fd4ee219df697bc309b756d85ef7b864f5b2da28cedb8a2b" aria-label="You must be signed in to change notification settings" data-view-component="true" class="btn-sm btn"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-bell mr-2"> <path d="M8 16a2 2 0 0 0 1.985-1.75c.017-.137-.097-.25-.235-.25h-3.5c-.138 0-.252.113-.235.25A2 2 0 0 0 8 16ZM3 5a5 5 0 0 1 10 0v2.947c0 .05.015.098.042.139l1.703 2.555A1.519 1.519 0 0 1 13.482 13H2.518a1.516 1.516 0 0 1-1.263-2.36l1.703-2.554A.255.255 0 0 0 3 7.947Zm5-3.5A3.5 3.5 0 0 0 4.5 5v2.947c0 .346-.102.683-.294.97l-1.703 2.556a.017.017 0 0 0-.003.01l.001.006c0 .002.002.004.004.006l.006.004.007.001h10.964l.007-.001.006-.004.004-.006.001-.007a.017.017 0 0 0-.003-.01l-1.703-2.554a1.745 1.745 0 0 1-.294-.97V5A3.5 3.5 0 0 0 8 1.5Z"></path> </svg>Notifications </a> <tool-tip id="tooltip-564404fa-5ae5-4830-8ccc-4e48ee65983a" for="repository-details-watch-button" popover="manual" data-direction="s" data-type="description" data-view-component="true" class="sr-only position-absolute">You must be signed in to change notification settings</tool-tip> </li> <li> <a icon="repo-forked" id="fork-button" href="/login?return_to=%2Ffacebook%2Freact" rel="nofollow" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"repo details fork button","repository_id":10270250,"auth_type":"LOG_IN","originating_url":"https://github.com/facebook/react/releases","user_id":null}}" data-hydro-click-hmac="630d02c14633305b73469d25359c032f6e26819ab4476599e98dff2afb3206e7" data-view-component="true" class="btn-sm btn"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo-forked mr-2"> <path d="M5 5.372v.878c0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75v-.878a2.25 2.25 0 1 1 1.5 0v.878a2.25 2.25 0 0 1-2.25 2.25h-1.5v2.128a2.251 2.251 0 1 1-1.5 0V8.5h-1.5A2.25 2.25 0 0 1 3.5 6.25v-.878a2.25 2.25 0 1 1 1.5 0ZM5 3.25a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Zm6.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm-3 8.75a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Z"></path> </svg>Fork <span id="repo-network-counter" data-pjax-replace="true" data-turbo-replace="true" title="47,063" data-view-component="true" class="Counter">47.1k</span> </a> </li> <li> <div data-view-component="true" class="BtnGroup d-flex"> <a href="/login?return_to=%2Ffacebook%2Freact" rel="nofollow" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"star button","repository_id":10270250,"auth_type":"LOG_IN","originating_url":"https://github.com/facebook/react/releases","user_id":null}}" data-hydro-click-hmac="56f4c3f42f7ccd0172b46e67b867020e3b06e20cfcaff3aaf5c1fdec73a5fb31" aria-label="You must be signed in to star a repository" data-view-component="true" class="tooltipped tooltipped-sw btn-sm btn"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-star v-align-text-bottom d-inline-block mr-2"> <path d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"></path> </svg><span data-view-component="true" class="d-inline"> Star </span> <span id="repo-stars-counter-star" aria-label="229878 users starred this repository" data-singular-suffix="user starred this repository" data-plural-suffix="users starred this repository" data-turbo-replace="true" title="229,878" data-view-component="true" class="Counter js-social-count">230k</span> </a></div> </li> </ul> </div> </div> <div id="responsive-meta-container" data-turbo-replace> </div> <nav data-pjax="#js-repo-pjax-container" aria-label="Repository" data-view-component="true" class="js-repo-nav js-sidenav-container-pjax js-responsive-underlinenav overflow-hidden UnderlineNav px-3 px-md-4 px-lg-5"> <ul data-view-component="true" class="UnderlineNav-body list-style-none"> <li data-view-component="true" class="d-inline-flex"> <a id="code-tab" href="/facebook/react" data-tab-item="i0code-tab" data-selected-links="repo_source repo_downloads repo_commits repo_releases repo_tags repo_branches repo_packages repo_deployments repo_attestations /facebook/react" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g c" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Code","target":"UNDERLINE_NAV.TAB"}" aria-current="page" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item selected"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code UnderlineNav-octicon d-none d-sm-inline"> <path d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z"></path> </svg> <span data-content="Code">Code</span> <span id="code-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="Not available" data-view-component="true" class="Counter"></span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="issues-tab" href="/facebook/react/issues" data-tab-item="i1issues-tab" data-selected-links="repo_issues repo_labels repo_milestones /facebook/react/issues" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g i" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Issues","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-issue-opened UnderlineNav-octicon d-none d-sm-inline"> <path d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path><path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"></path> </svg> <span data-content="Issues">Issues</span> <span id="issues-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="723" data-view-component="true" class="Counter">723</span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="pull-requests-tab" href="/facebook/react/pulls" data-tab-item="i2pull-requests-tab" data-selected-links="repo_pulls checks /facebook/react/pulls" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g p" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Pull requests","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-pull-request UnderlineNav-octicon d-none d-sm-inline"> <path d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"></path> </svg> <span data-content="Pull requests">Pull requests</span> <span id="pull-requests-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="155" data-view-component="true" class="Counter">155</span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="actions-tab" href="/facebook/react/actions" data-tab-item="i3actions-tab" data-selected-links="repo_actions /facebook/react/actions" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g a" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Actions","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-play UnderlineNav-octicon d-none d-sm-inline"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm4.879-2.773 4.264 2.559a.25.25 0 0 1 0 .428l-4.264 2.559A.25.25 0 0 1 6 10.559V5.442a.25.25 0 0 1 .379-.215Z"></path> </svg> <span data-content="Actions">Actions</span> <span id="actions-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="Not available" data-view-component="true" class="Counter"></span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="projects-tab" href="/facebook/react/projects" data-tab-item="i4projects-tab" data-selected-links="repo_projects new_repo_project repo_project /facebook/react/projects" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g b" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Projects","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-table UnderlineNav-octicon d-none d-sm-inline"> <path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25ZM6.5 6.5v8h7.75a.25.25 0 0 0 .25-.25V6.5Zm8-1.5V1.75a.25.25 0 0 0-.25-.25H6.5V5Zm-13 1.5v7.75c0 .138.112.25.25.25H5v-8ZM5 5V1.5H1.75a.25.25 0 0 0-.25.25V5Z"></path> </svg> <span data-content="Projects">Projects</span> <span id="projects-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="0" hidden="hidden" data-view-component="true" class="Counter">0</span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="wiki-tab" href="/facebook/react/wiki" data-tab-item="i5wiki-tab" data-selected-links="repo_wiki /facebook/react/wiki" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g w" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Wiki","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-book UnderlineNav-octicon d-none d-sm-inline"> <path d="M0 1.75A.75.75 0 0 1 .75 1h4.253c1.227 0 2.317.59 3 1.501A3.743 3.743 0 0 1 11.006 1h4.245a.75.75 0 0 1 .75.75v10.5a.75.75 0 0 1-.75.75h-4.507a2.25 2.25 0 0 0-1.591.659l-.622.621a.75.75 0 0 1-1.06 0l-.622-.621A2.25 2.25 0 0 0 5.258 13H.75a.75.75 0 0 1-.75-.75Zm7.251 10.324.004-5.073-.002-2.253A2.25 2.25 0 0 0 5.003 2.5H1.5v9h3.757a3.75 3.75 0 0 1 1.994.574ZM8.755 4.75l-.004 7.322a3.752 3.752 0 0 1 1.992-.572H14.5v-9h-3.495a2.25 2.25 0 0 0-2.25 2.25Z"></path> </svg> <span data-content="Wiki">Wiki</span> <span id="wiki-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="Not available" data-view-component="true" class="Counter"></span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="security-tab" href="/facebook/react/security" data-tab-item="i6security-tab" data-selected-links="security overview alerts policy token_scanning code_scanning /facebook/react/security" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g s" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Security","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-shield UnderlineNav-octicon d-none d-sm-inline"> <path d="M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <span data-content="Security">Security</span> <include-fragment src="/facebook/react/security/overall-count" accept="text/fragment+html"></include-fragment> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="insights-tab" href="/facebook/react/pulse" data-tab-item="i7insights-tab" data-selected-links="repo_graphs repo_contributors dependency_graph dependabot_updates pulse people community /facebook/react/pulse" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Insights","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-graph UnderlineNav-octicon d-none d-sm-inline"> <path d="M1.5 1.75V13.5h13.75a.75.75 0 0 1 0 1.5H.75a.75.75 0 0 1-.75-.75V1.75a.75.75 0 0 1 1.5 0Zm14.28 2.53-5.25 5.25a.75.75 0 0 1-1.06 0L7 7.06 4.28 9.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.25-3.25a.75.75 0 0 1 1.06 0L10 7.94l4.72-4.72a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> <span data-content="Insights">Insights</span> <span id="insights-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="Not available" data-view-component="true" class="Counter"></span> </a></li> </ul> <div style="visibility:hidden;" data-view-component="true" class="UnderlineNav-actions js-responsive-underlinenav-overflow position-absolute pr-3 pr-md-4 pr-lg-5 right-0"> <action-menu data-select-variant="none" data-view-component="true"> <focus-group direction="vertical" mnemonics retain> <button id="action-menu-8d2a5ca7-cb08-423a-b8f1-96ab1f160660-button" popovertarget="action-menu-8d2a5ca7-cb08-423a-b8f1-96ab1f160660-overlay" aria-controls="action-menu-8d2a5ca7-cb08-423a-b8f1-96ab1f160660-list" aria-haspopup="true" aria-labelledby="tooltip-be4e752b-a995-4e1b-910b-2e16d1792c9c" type="button" data-view-component="true" class="Button Button--iconOnly Button--secondary Button--medium UnderlineNav-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-kebab-horizontal Button-visual"> <path d="M8 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3ZM1.5 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Zm13 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path> </svg> </button><tool-tip id="tooltip-be4e752b-a995-4e1b-910b-2e16d1792c9c" for="action-menu-8d2a5ca7-cb08-423a-b8f1-96ab1f160660-button" popover="manual" data-direction="s" data-type="label" data-view-component="true" class="sr-only position-absolute">Additional navigation options</tool-tip> <anchored-position id="action-menu-8d2a5ca7-cb08-423a-b8f1-96ab1f160660-overlay" anchor="action-menu-8d2a5ca7-cb08-423a-b8f1-96ab1f160660-button" align="start" side="outside-bottom" anchor-offset="normal" popover="auto" data-view-component="true"> <div data-view-component="true" class="Overlay Overlay--size-auto"> <div data-view-component="true" class="Overlay-body Overlay-body--paddingNone"> <action-list> <div data-view-component="true"> <ul aria-labelledby="action-menu-8d2a5ca7-cb08-423a-b8f1-96ab1f160660-button" id="action-menu-8d2a5ca7-cb08-423a-b8f1-96ab1f160660-list" role="menu" data-view-component="true" class="ActionListWrap--inset ActionListWrap"> <li hidden="hidden" data-menu-item="i0code-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-d5762343-6c73-4785-b756-792ec7c40848" href="/facebook/react" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code"> <path d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Code </span> </a> </li> <li hidden="hidden" data-menu-item="i1issues-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-e92ba3c4-6fca-4647-bfc2-da550710420b" href="/facebook/react/issues" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-issue-opened"> <path d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path><path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Issues </span> </a> </li> <li hidden="hidden" data-menu-item="i2pull-requests-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-d8035943-a35c-42b7-9dab-f05bc5d79270" href="/facebook/react/pulls" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-pull-request"> <path d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Pull requests </span> </a> </li> <li hidden="hidden" data-menu-item="i3actions-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-1675afae-1079-4109-895b-c0110a7a4f94" href="/facebook/react/actions" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-play"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm4.879-2.773 4.264 2.559a.25.25 0 0 1 0 .428l-4.264 2.559A.25.25 0 0 1 6 10.559V5.442a.25.25 0 0 1 .379-.215Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Actions </span> </a> </li> <li hidden="hidden" data-menu-item="i4projects-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-d62869b7-dec4-4971-8924-0e123ef69e81" href="/facebook/react/projects" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-table"> <path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25ZM6.5 6.5v8h7.75a.25.25 0 0 0 .25-.25V6.5Zm8-1.5V1.75a.25.25 0 0 0-.25-.25H6.5V5Zm-13 1.5v7.75c0 .138.112.25.25.25H5v-8ZM5 5V1.5H1.75a.25.25 0 0 0-.25.25V5Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Projects </span> </a> </li> <li hidden="hidden" data-menu-item="i5wiki-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-cb6c072b-5c70-428b-9fe4-438dc6454637" href="/facebook/react/wiki" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-book"> <path d="M0 1.75A.75.75 0 0 1 .75 1h4.253c1.227 0 2.317.59 3 1.501A3.743 3.743 0 0 1 11.006 1h4.245a.75.75 0 0 1 .75.75v10.5a.75.75 0 0 1-.75.75h-4.507a2.25 2.25 0 0 0-1.591.659l-.622.621a.75.75 0 0 1-1.06 0l-.622-.621A2.25 2.25 0 0 0 5.258 13H.75a.75.75 0 0 1-.75-.75Zm7.251 10.324.004-5.073-.002-2.253A2.25 2.25 0 0 0 5.003 2.5H1.5v9h3.757a3.75 3.75 0 0 1 1.994.574ZM8.755 4.75l-.004 7.322a3.752 3.752 0 0 1 1.992-.572H14.5v-9h-3.495a2.25 2.25 0 0 0-2.25 2.25Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Wiki </span> </a> </li> <li hidden="hidden" data-menu-item="i6security-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-523ac1cc-cefa-47f8-ad70-85fb7c0f86e2" href="/facebook/react/security" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-shield"> <path d="M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Security </span> </a> </li> <li hidden="hidden" data-menu-item="i7insights-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-992d4297-f4ba-4d53-8393-71672d0fbb38" href="/facebook/react/pulse" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-graph"> <path d="M1.5 1.75V13.5h13.75a.75.75 0 0 1 0 1.5H.75a.75.75 0 0 1-.75-.75V1.75a.75.75 0 0 1 1.5 0Zm14.28 2.53-5.25 5.25a.75.75 0 0 1-1.06 0L7 7.06 4.28 9.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.25-3.25a.75.75 0 0 1 1.06 0L10 7.94l4.72-4.72a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Insights </span> </a> </li> </ul> </div></action-list> </div> </div></anchored-position> </focus-group> </action-menu></div> </nav> </div> <turbo-frame id="repo-content-turbo-frame" target="_top" data-turbo-action="advance" class=""> <div id="repo-content-pjax-container" class="repository-content " > <h1 class='sr-only'>Releases: facebook/react</h1> <div class="clearfix container-xl px-3 px-md-4 px-lg-5 mt-4"> <div class="d-flex flex-justify-center"> <div class="d-flex flex-column flex-sm-row flex-wrap mb-3 pb-3 col-11 flex-justify-between border-bottom" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <nav aria-label="Releases and Tags" class="mb-2 flex-1"> <a class="js-selected-navigation-item selected subnav-item" aria-current="page" data-selected-links="repo_releases /facebook/react/releases" href="/facebook/react/releases">Releases</a> <a class="js-selected-navigation-item subnav-item" data-selected-links="repo_tags /facebook/react/tags" href="/facebook/react/tags">Tags</a> </nav> <div class="d-flex flex-column flex-md-row"> <div> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="position-relative ml-md-2" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-turbo="false" action="/facebook/react/releases" accept-charset="UTF-8" method="get"> <input id="release-filter" type="search" name="q" class="form-control subnav-search-input width-full" value="" placeholder="Find a release" aria-label="Find a release" > <input type="hidden" name="expanded" value="true"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-search subnav-search-icon"> <path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path> </svg> </form> </div> </div> </div> </div> <div hidden id="release_page_title">Releases · facebook/react</div> <div data-pjax data-hpc> <section aria-labelledby="hd-c8ec42a4"> <h2 class="sr-only" id="hd-c8ec42a4">eslint-plugin-react-hooks@5.0.0 (Oct 11, 2024)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2024-10-11T13:32:09Z"> 11 Oct 13:32 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/12292047?s=40&v=4" alt="@eps1lon" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/eps1lon/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/eps1lon">eps1lon</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/eslint-plugin-react-hooks%405.0.0" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> eslint-plugin-react-hooks@5.0.0 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/09111202d617477b63507b41e8b6c3101b4afd87/hovercard" href="/facebook/react/commit/09111202d617477b63507b41e8b6c3101b4afd87" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">0911120</code></a><details class="dropdown dropdown-signed-commit details-reset details-overlay js-dropdown-details d-inline-block ml-1"> <summary class="color-fg-success" > <svg aria-label="Verified commit signature" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </summary> <div class="anim-scale-in" style="position: relative; z-index: 200;"> <div class="dropdown-menu dropdown-menu-s py-0 color-fg-default text-left"> <div class="p-3 signed-commit-header d-flex"> <div class="pr-1"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified mr-2"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </div> <div class="flex-1"> This commit was created on GitHub.com and signed with GitHub’s <strong>verified signature</strong>. </div> </div> <div class="signed-commit-footer p-3 rounded-bottom-2"> <span class="d-block">GPG key ID: <span class="color-fg-muted">B5690EEEBB952194</span></span> <div class="my-1"> </div> <a class="Link--inTextBlock" href="https://docs.github.com/github/authenticating-to-github/displaying-verification-statuses-for-all-of-your-commits">Learn about vigilant mode</a>. </div> </div> </div> </details> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-eca4dc00-b18a-11ef-935c-ac22a3d313f5"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-eca4dc00-b18a-11ef-935c-ac22a3d313f5"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="ZXNsaW50LXBsdWdpbi1yZWFjdC1ob29rc0A1LjAuMA==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...eslint-plugin-react-hooks%405.0.0" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/eslint-plugin-react-hooks%405.0.0" data-view-component="true" class="Link--primary Link">eslint-plugin-react-hooks@5.0.0 (Oct 11, 2024)</a></span> <span> <a href="/facebook/react/releases/latest" data-view-component="true" class="Link v-align-text-bottom d-none d-md-inline-block"><span data-view-component="true" class="Label Label--success Label--large">Latest</span></a> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> <a href="/facebook/react/releases/latest" data-view-component="true" class="Link v-align-text-bottom"><span data-view-component="true" class="Label Label--success Label--large">Latest</span></a> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><p>This release only contains <code>eslint-plugin-react-hooks</code>. Notably, new violations and support for ESLint v9 were added.</p> <h2><code>eslint-plugin-react-hooks</code></h2> <ul> <li><strong>New Violations:</strong> Component names now need to start with an uppercase letter instead of a non-lowercase letter. This means <code>_Button</code> or <code>_component</code> are no longer valid. (<a href="https://github.com/kassens">@kassens</a>) in <a href="https://github.com/facebook/react/pull/25162" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/25162/hovercard">#25162</a><br> For example, in <div class="highlight highlight-source-tsx notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="function _Component() { useState() ^^^^^^^^ A React Hook "useState" is called in function "_Component" which is neither a Component nor a custom React Hook function. }"><pre><span class="pl-k">function</span> <span class="pl-en">_Component</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-en">useState</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">^</span><span class="pl-c1">^</span><span class="pl-c1">^</span><span class="pl-c1">^</span><span class="pl-c1">^</span><span class="pl-c1">^</span><span class="pl-c1">^</span><span class="pl-c1">^</span> <span class="pl-smi">A</span> <span class="pl-smi">React</span> <span class="pl-smi">Hook</span> <span class="pl-s">"useState"</span> <span class="pl-s1">is</span> <span class="pl-s1">called</span> <span class="pl-k">in</span> <span class="pl-k">function</span> <span class="pl-s">"_Component"</span> <span class="pl-s1">which</span> is <span class="pl-s1">neither</span> <span class="pl-s1">a</span> <span class="pl-smi">Component</span> <span class="pl-s1">nor</span> <span class="pl-s1">a</span> <span class="pl-s1">custom</span> <span class="pl-smi">React</span> <span class="pl-smi">Hook</span> <span class="pl-k">function</span><span class="pl-kos">.</span> <span class="pl-kos">}</span></pre></div> <code>_Component</code> should be renamed to <code>Component</code>.</li> </ul> <ul> <li>Add support for ESLint v9. (<a href="https://github.com/eps1lon">@eps1lon</a> in <a href="https://github.com/facebook/react/pull/28773" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/28773/hovercard">#28773</a>)</li> <li>Consider dispatch from <code>useActionState</code> stable. (<a href="https://github.com/eps1lon">@eps1lon</a> in <a href="https://github.com/facebook/react/pull/29665" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/29665/hovercard">#29665</a>)</li> <li>Accept <code>as</code> expression in callback. (<a href="https://github.com/StyleShit">@StyleShit</a> in <a href="https://github.com/facebook/react/pull/28202" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/28202/hovercard">#28202</a>)</li> <li>Accept <code>as</code> expressions in deps array. (<a href="https://github.com/StyleShit">@StyleShit</a> in <a href="https://github.com/facebook/react/pull/28189" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/28189/hovercard">#28189</a>)</li> <li>Treat <code>React.use()</code> the same as <code>use()</code>. (<a href="https://github.com/kassens">@kassens</a> in <a href="https://github.com/facebook/react/pull/27769" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/27769/hovercard">#27769</a>)</li> <li>Move <code>use()</code> lint to non-experimental. (<a href="https://github.com/kassens">@kassens</a> in <a href="https://github.com/facebook/react/pull/27768" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/27768/hovercard">#27768</a>)</li> <li>Support Flow <code>as</code> expressions. (<a href="https://github.com/cpojer">@cpojer</a> in <a href="https://github.com/facebook/react/pull/27590" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/27590/hovercard">#27590</a>)</li> <li>Allow <code>useEffect(fn, undefined)</code>. (<a href="https://github.com/kassens">@kassens</a> in <a href="https://github.com/facebook/react/pull/27525" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/27525/hovercard">#27525</a>)</li> <li>Disallow hooks in async functions. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/27045" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/27045/hovercard">#27045</a>)</li> <li>Rename experimental <code>useEvent</code> to <code>useEffectEvent</code>. (<a href="https://github.com/sebmarkbage">@sebmarkbage</a> in <a href="https://github.com/facebook/react/pull/25881" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/25881/hovercard">#25881</a>)</li> <li>Lint for presence of <code>useEvent</code> functions in dependency lists. (<a href="https://github.com/poteto">@poteto</a> in <a href="https://github.com/facebook/react/pull/25512" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/25512/hovercard">#25512</a>)</li> <li>Check <code>useEvent</code> references instead. (<a href="https://github.com/poteto">@poteto</a> in <a href="https://github.com/facebook/react/pull/25319" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/25319/hovercard">#25319</a>)</li> <li>Update <code>RulesOfHooks</code> with <code>useEvent</code> rules. (<a href="https://github.com/poteto">@poteto</a> in <a href="https://github.com/facebook/react/pull/25285" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/25285/hovercard">#25285</a>)</li> </ul></div> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details open="open" data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/eslint-plugin-react-hooks@5.0.0" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="htWkAjWWcdkzQI0gdptAYWap1oHQ1ys7nFZjZAaY1TKhQABMOeBN_8_fMQaRj1vBjHCaDq8Iap6kuOhEHKFGzw" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="RE_kwDOAJy2Ks4Ks4ZT"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-28c2d8" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (167): eps1lon, 01:20PM on October 11" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">167</span> </button> <tool-tip id="tooltip-13c195d7-7dfa-4217-9564-e55271733a07" for="reactions--reaction_button_component-28c2d8" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">mkosir, Amoz19, nilsingwersen, gunters63, kevinpainchaud, fiskryeziu, aryaemami59, re-taro, Shakeskeyboarde, m3thom, and 157 more reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-1c8233" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (2): eps1lon, 01:20PM on October 11" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">2</span> </button> <tool-tip id="tooltip-ded88b91-2a1a-44a0-aa12-ddaff2324d21" for="reactions--reaction_button_component-1c8233" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">aalmanasir and GeorgeDzvengwe reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-573430" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (74): eps1lon, 01:20PM on October 11" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">74</span> </button> <tool-tip id="tooltip-63670bc6-eb37-4287-8d0f-7d1a880cb29f" for="reactions--reaction_button_component-573430" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">mkosir, Amoz19, QuantumChemist, kevinpainchaud, daniellmiranda, aryaemami59, re-taro, Shakeskeyboarde, alinnert, haodaking, and 64 more reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-c46e84" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (59): eps1lon, 01:20PM on October 11" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">59</span> </button> <tool-tip id="tooltip-e0085da0-61be-4aac-808e-14b96b8da71b" for="reactions--reaction_button_component-c46e84" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">mkosir, QuantumChemist, kevinpainchaud, aryaemami59, re-taro, Shakeskeyboarde, slk333, 4ndrs, ShobhitShah1, DavidGDA, and 49 more reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-a018c2" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (50): eps1lon, 01:20PM on October 11" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">50</span> </button> <tool-tip id="tooltip-df32da9e-42c2-4193-a375-ccde6ea0b4c6" for="reactions--reaction_button_component-a018c2" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">mkosir, Amoz19, QuantumChemist, LeunensMichiel, kevinpainchaud, aryaemami59, re-taro, monkey0722, Shakeskeyboarde, rodamaral, and 40 more reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-8572ca" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (20): eps1lon, 01:20PM on October 11" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">20</span> </button> <tool-tip id="tooltip-88c32faf-3441-49e2-b3a5-4e7046964a6b" for="reactions--reaction_button_component-8572ca" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">Dmitriy-Frostoff, MidlajYH, rodrigomoyano11, Denisskas, lucipas, JamBalaya56562, fadrian06, warmachine028, zdu-strong, Talaxy009, and 10 more reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="mkosir, Amoz19, nilsingwersen, gunters63, kevinpainchaud, fiskryeziu, aryaemami59, re-taro, Shakeskeyboarde, m3thom, and 157 more reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>167 reactions</span> </li> <li class="dropdown-item" aria-label="aalmanasir and GeorgeDzvengwe reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>2 reactions</span> </li> <li class="dropdown-item" aria-label="mkosir, Amoz19, QuantumChemist, kevinpainchaud, daniellmiranda, aryaemami59, re-taro, Shakeskeyboarde, alinnert, haodaking, and 64 more reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>74 reactions</span> </li> <li class="dropdown-item" aria-label="mkosir, QuantumChemist, kevinpainchaud, aryaemami59, re-taro, Shakeskeyboarde, slk333, 4ndrs, ShobhitShah1, DavidGDA, and 49 more reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>59 reactions</span> </li> <li class="dropdown-item" aria-label="mkosir, Amoz19, QuantumChemist, LeunensMichiel, kevinpainchaud, aryaemami59, re-taro, monkey0722, Shakeskeyboarde, rodamaral, and 40 more reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>50 reactions</span> </li> <li class="dropdown-item" aria-label="Dmitriy-Frostoff, MidlajYH, rodrigomoyano11, Denisskas, lucipas, JamBalaya56562, fadrian06, warmachine028, zdu-strong, Talaxy009, and 10 more reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>20 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">236 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-d8372b1c"> <h2 class="sr-only" id="hd-d8372b1c">18.3.1 (April 26, 2024)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2024-04-26T19:53:42Z"> 26 Apr 19:53 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/2440089?s=40&v=4" alt="@rickhanlonii" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/rickhanlonii/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/rickhanlonii">rickhanlonii</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v18.3.1" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v18.3.1 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/f1338f8080abd1386454a10bbf93d67bfe37ce85/hovercard" href="/facebook/react/commit/f1338f8080abd1386454a10bbf93d67bfe37ce85" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">f1338f8</code></a><details class="dropdown dropdown-signed-commit details-reset details-overlay js-dropdown-details d-inline-block ml-1"> <summary class="color-fg-success" > <svg aria-label="Verified commit signature" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </summary> <div class="anim-scale-in" style="position: relative; z-index: 200;"> <div class="dropdown-menu dropdown-menu-s py-0 color-fg-default text-left"> <div class="p-3 signed-commit-header d-flex"> <div class="pr-1"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified mr-2"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </div> <div class="flex-1"> This commit was signed with the committer’s <strong>verified signature</strong>. </div> </div> <div class="px-3 pt-3 d-flex"> <a class="pr-1" aria-label="acdlite" href="/acdlite"> <img src="https://avatars.githubusercontent.com/u/3624098?s=64&v=4" alt="" class="avatar avatar-2 avatar-user mr-2"> </a> <span class="signed-commit-signer-name flex-1"> <a class="signer" href="/acdlite">acdlite</a> Andrew Clark </span> </div> <div class="signed-commit-footer p-3 rounded-bottom-2"> <span class="d-block">SSH Key Fingerprint: <span class="color-fg-muted">kMgJy+7AI/mxxpuyx1Qgc7NZY55dREBRubChEAYfi7I</span></span> <a class="Link--inTextBlock" href="https://docs.github.com/github/authenticating-to-github/displaying-verification-statuses-for-all-of-your-commits">Learn about vigilant mode</a>. </div> </div> </div> </details> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-ecaae852-b18a-11ef-96e3-bafc73135c57"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-ecaae852-b18a-11ef-96e3-bafc73135c57"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE4LjMuMQ==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v18.3.1" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v18.3.1" data-view-component="true" class="Link--primary Link">18.3.1 (April 26, 2024)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><ul> <li>Export <code>act</code> from <code>react</code> <a href="https://github.com/facebook/react/commit/f1338f8080abd1386454a10bbf93d67bfe37ce85">f1338f</a></li> </ul></div> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v18.3.1" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="UzR7_E42fXX4_HlSVeebVwAAPpLgaMPO6QgzZR_bt-90od-yQkBBUwRjxXSy84D36tlyHZ-3gmvR5rhFBeIkEg" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="RE_kwDOAJy2Ks4JH1jJ"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-d623a4" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (291): rickhanlonii, 04:17PM on April 26" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">291</span> </button> <tool-tip id="tooltip-5b1cea4a-9cfc-44b1-b1de-fe90c7a6fc69" for="reactions--reaction_button_component-d623a4" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">franz-bendezu, rockyzhang24, IVLIU, jhosep98, golamrabbiazad, manyeyes, undesicimo, doooss, einer20, IntelligentSynthesis, and 281 more reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-d3eda6" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (83): rickhanlonii, 04:17PM on April 26" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">83</span> </button> <tool-tip id="tooltip-a8b075d2-9ad7-400d-a31b-8d97caf637b4" for="reactions--reaction_button_component-d3eda6" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">jafar-jabr, 1zilc, sergiocarneiro, lin72h, MuhamedAyoub, pwbriggs, undesicimo, silkyland, Marukome0743, MeherabSamir, and 73 more reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-4b7bb2" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (79): rickhanlonii, 04:17PM on April 26" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">79</span> </button> <tool-tip id="tooltip-85b8f9e2-4dde-4e1f-bc58-7f47f93c1caf" for="reactions--reaction_button_component-4b7bb2" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">hendriknielaender, advanceddev, marcio-grecio, Rel1cx, dbstratta, poteto, ZachLegros, clemstoquart, mkosir, ykzts, and 69 more reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-d7c450" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (96): rickhanlonii, 04:17PM on April 26" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">96</span> </button> <tool-tip id="tooltip-6565a117-f046-4d78-8edf-9b07ba132aa5" for="reactions--reaction_button_component-d7c450" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">4ndrs, batosai, marcio-grecio, dbstratta, hrasoa, poteto, mkosir, 1zilc, lin72h, xxrjun, and 86 more reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-81c560" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (88): rickhanlonii, 04:17PM on April 26" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">88</span> </button> <tool-tip id="tooltip-b9cc101d-f400-44a1-8cd6-a99b282b6932" for="reactions--reaction_button_component-81c560" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">hendriknielaender, KirianCaumes, sampain, xxrjun, marcio-grecio, dbstratta, poteto, esau-morais, mkosir, lin72h, and 78 more reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-64ec79" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (14): rickhanlonii, 04:17PM on April 26" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">14</span> </button> <tool-tip id="tooltip-97b2d521-f3ec-4a67-a953-5f0af6dc571b" for="reactions--reaction_button_component-64ec79" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">mtayyebdeveloper, CapitanArdeshir, subham007-coder, codewithnathan97, jaimin-bariya, youne-elma, Rucellmai61, trungle33, Quanzhitong, Sudharsan0727, and 4 more reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="franz-bendezu, rockyzhang24, IVLIU, jhosep98, golamrabbiazad, manyeyes, undesicimo, doooss, einer20, IntelligentSynthesis, and 281 more reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>291 reactions</span> </li> <li class="dropdown-item" aria-label="jafar-jabr, 1zilc, sergiocarneiro, lin72h, MuhamedAyoub, pwbriggs, undesicimo, silkyland, Marukome0743, MeherabSamir, and 73 more reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>83 reactions</span> </li> <li class="dropdown-item" aria-label="hendriknielaender, advanceddev, marcio-grecio, Rel1cx, dbstratta, poteto, ZachLegros, clemstoquart, mkosir, ykzts, and 69 more reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>79 reactions</span> </li> <li class="dropdown-item" aria-label="4ndrs, batosai, marcio-grecio, dbstratta, hrasoa, poteto, mkosir, 1zilc, lin72h, xxrjun, and 86 more reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>96 reactions</span> </li> <li class="dropdown-item" aria-label="hendriknielaender, KirianCaumes, sampain, xxrjun, marcio-grecio, dbstratta, poteto, esau-morais, mkosir, lin72h, and 78 more reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>88 reactions</span> </li> <li class="dropdown-item" aria-label="mtayyebdeveloper, CapitanArdeshir, subham007-coder, codewithnathan97, jaimin-bariya, youne-elma, Rucellmai61, trungle33, Quanzhitong, Sudharsan0727, and 4 more reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>14 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">439 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-fcccdaa9"> <h2 class="sr-only" id="hd-fcccdaa9">18.3.0 (April 25, 2024)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2024-04-26T19:48:51Z"> 26 Apr 19:48 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/2440089?s=40&v=4" alt="@rickhanlonii" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/rickhanlonii/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/rickhanlonii">rickhanlonii</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v18.3.0" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v18.3.0 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/8a015b68cc060079878e426610e64e86fb328f8d/hovercard" href="/facebook/react/commit/8a015b68cc060079878e426610e64e86fb328f8d" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">8a015b6</code></a><details class="dropdown dropdown-signed-commit details-reset details-overlay js-dropdown-details d-inline-block ml-1"> <summary class="color-fg-success" > <svg aria-label="Verified commit signature" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </summary> <div class="anim-scale-in" style="position: relative; z-index: 200;"> <div class="dropdown-menu dropdown-menu-s py-0 color-fg-default text-left"> <div class="p-3 signed-commit-header d-flex"> <div class="pr-1"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified mr-2"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </div> <div class="flex-1"> This commit was signed with the committer’s <strong>verified signature</strong>. </div> </div> <div class="px-3 pt-3 d-flex"> <a class="pr-1" aria-label="acdlite" href="/acdlite"> <img src="https://avatars.githubusercontent.com/u/3624098?s=64&v=4" alt="" class="avatar avatar-2 avatar-user mr-2"> </a> <span class="signed-commit-signer-name flex-1"> <a class="signer" href="/acdlite">acdlite</a> Andrew Clark </span> </div> <div class="signed-commit-footer p-3 rounded-bottom-2"> <span class="d-block">SSH Key Fingerprint: <span class="color-fg-muted">kMgJy+7AI/mxxpuyx1Qgc7NZY55dREBRubChEAYfi7I</span></span> <a class="Link--inTextBlock" href="https://docs.github.com/github/authenticating-to-github/displaying-verification-statuses-for-all-of-your-commits">Learn about vigilant mode</a>. </div> </div> </div> </details> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-ecae1fea-b18a-11ef-9113-0b4490184b71"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-ecae1fea-b18a-11ef-9113-0b4490184b71"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE4LjMuMA==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v18.3.0" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v18.3.0" data-view-component="true" class="Link--primary Link">18.3.0 (April 25, 2024)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><p>This release is identical to 18.2 but adds warnings for deprecated APIs and other changes that are needed for React 19.</p> <p>Read the <a href="https://react.dev/blog/2024/04/25/react-19-upgrade-guide" rel="nofollow">React 19 Upgrade Guide</a> for more info.</p> <h3>React</h3> <ul> <li>Allow writing to <code>this.refs</code> to support string ref codemod <a href="https://github.com/facebook/react/commit/9090712fd3ca4e1099e1f92e67933c2cb4f32552">909071</a></li> <li>Warn for deprecated <code>findDOMNode</code> outside StrictMode <a href="https://github.com/facebook/react/commit/c3b283964108b0e8dbcf1f9eb2e7e67815e39dfb">c3b283</a></li> <li>Warn for deprecated <code>test-utils</code> methods <a href="https://github.com/facebook/react/commit/d4ea75dc4258095593b6ac764289f42bddeb835c">d4ea75</a></li> <li>Warn for deprecated Legacy Context outside StrictMode <a href="https://github.com/facebook/react/commit/415ee0e6ea0fe3e288e65868df2e3241143d5f7f">415ee0</a></li> <li>Warn for deprecated string refs outside StrictMode <a href="https://github.com/facebook/react/pull/25383" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/25383/hovercard">#25383</a></li> <li>Warn for deprecated <code>defaultProps</code> for function components <a href="https://github.com/facebook/react/pull/25699" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/25699/hovercard">#25699</a></li> <li>Warn when spreading <code>key</code> <a href="https://github.com/facebook/react/pull/25697" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/25697/hovercard">#25697</a></li> <li>Warn when using <code>act</code> from <code>test-utils</code> <a href="https://github.com/facebook/react/commit/d4ea75dc4258095593b6ac764289f42bddeb835c">d4ea75</a></li> </ul> <h3>React DOM</h3> <ul> <li>Warn for deprecated <code>unmountComponentAtNode</code> <a href="https://github.com/facebook/react/commit/8a015b68cc060079878e426610e64e86fb328f8d">8a015b</a></li> <li>Warn for deprecated <code>renderToStaticNodeStream</code> <a href="https://github.com/facebook/react/pull/28874" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/28874/hovercard">#28874</a></li> </ul></div> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v18.3.0" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="Cn75t3DbYXhhWSKkgaE9c7x1uI7yb-WhWD07VFutOcIt6135fK1dXp3GnoJmtSbTVqz0AY2wpARg07B0QZSqPw" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="RE_kwDOAJy2Ks4JH1bm"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-e9d307" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (115): rickhanlonii, 04:22PM on April 25" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">115</span> </button> <tool-tip id="tooltip-af6751a9-3f2f-4faa-9b27-15100099f647" for="reactions--reaction_button_component-e9d307" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">ChrisWiles, eifr, poteto, clemstoquart, zdu-strong, lin72h, golamrabbiazad, makoto14, ParasSolanki, ramunecroft, and 105 more reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-64a4b6" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (24): rickhanlonii, 04:22PM on April 25" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">24</span> </button> <tool-tip id="tooltip-63a6e7f6-33b8-4805-8653-2b41e568b841" for="reactions--reaction_button_component-64a4b6" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">vozaldi, fadrian06, vikiboss, 1weiho, MidlajYH, lnhrdt, zudydy, gmerwan, oy-itstedpark, w00khyung, and 14 more reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-5c3d4c" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (39): rickhanlonii, 04:22PM on April 25" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">39</span> </button> <tool-tip id="tooltip-b0d9614b-a7d1-4a9a-a7d0-9482d94480d0" for="reactions--reaction_button_component-5c3d4c" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">ChrisWiles, Arechii, poteto, ykzts, zdu-strong, lin72h, golamrabbiazad, pwbriggs, syahrizaldev, fadrian06, and 29 more reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-3d954a" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (48): rickhanlonii, 04:22PM on April 25" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">48</span> </button> <tool-tip id="tooltip-0c961870-9453-4a83-817d-3fdc26ea372c" for="reactions--reaction_button_component-3d954a" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">4ndrs, ChrisWiles, poteto, controversial, Bikossor, rendrom, zdu-strong, lin72h, AhmedBaset, golamrabbiazad, and 38 more reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-4a0bfc" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (61): rickhanlonii, 04:22PM on April 25" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">61</span> </button> <tool-tip id="tooltip-9c625473-3560-4216-beda-2d3f1bf03cd3" for="reactions--reaction_button_component-4a0bfc" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">mzaien, llegomark, KirianCaumes, dbstratta, Abhiek187, 87xie, 4ndrs, ChrisWiles, rivajunior, poteto, and 51 more reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-632686" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (4): rickhanlonii, 04:22PM on April 25" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">4</span> </button> <tool-tip id="tooltip-1b660c50-0f5b-4908-9a29-8d4f04296397" for="reactions--reaction_button_component-632686" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">ixsamar, thisisengineer, kronos456, and MagdyKishk reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="ChrisWiles, eifr, poteto, clemstoquart, zdu-strong, lin72h, golamrabbiazad, makoto14, ParasSolanki, ramunecroft, and 105 more reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>115 reactions</span> </li> <li class="dropdown-item" aria-label="vozaldi, fadrian06, vikiboss, 1weiho, MidlajYH, lnhrdt, zudydy, gmerwan, oy-itstedpark, w00khyung, and 14 more reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>24 reactions</span> </li> <li class="dropdown-item" aria-label="ChrisWiles, Arechii, poteto, ykzts, zdu-strong, lin72h, golamrabbiazad, pwbriggs, syahrizaldev, fadrian06, and 29 more reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>39 reactions</span> </li> <li class="dropdown-item" aria-label="4ndrs, ChrisWiles, poteto, controversial, Bikossor, rendrom, zdu-strong, lin72h, AhmedBaset, golamrabbiazad, and 38 more reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>48 reactions</span> </li> <li class="dropdown-item" aria-label="mzaien, llegomark, KirianCaumes, dbstratta, Abhiek187, 87xie, 4ndrs, ChrisWiles, rivajunior, poteto, and 51 more reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>61 reactions</span> </li> <li class="dropdown-item" aria-label="ixsamar, thisisengineer, kronos456, and MagdyKishk reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>4 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">179 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-17310071"> <h2 class="sr-only" id="hd-17310071">18.2.0 (June 14, 2022)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2022-06-14T19:54:21Z"> 14 Jun 19:54 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/2716369?s=40&v=4" alt="@gnoff" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/gnoff/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/gnoff">gnoff</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v18.2.0" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v18.2.0 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/9e3b772b8cabbd8cadc7522ebe3dde3279e79d9e/hovercard" href="/facebook/react/commit/9e3b772b8cabbd8cadc7522ebe3dde3279e79d9e" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">9e3b772</code></a><details class="dropdown dropdown-signed-commit details-reset details-overlay js-dropdown-details d-inline-block ml-1"> <summary class="color-fg-success" > <svg aria-label="Verified commit signature" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </summary> <div class="anim-scale-in" style="position: relative; z-index: 200;"> <div class="dropdown-menu dropdown-menu-s py-0 color-fg-default text-left"> <div class="p-3 signed-commit-header d-flex"> <div class="pr-1"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified mr-2"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </div> <div class="flex-1"> This commit was created on GitHub.com and signed with GitHub’s <strong>verified signature</strong>. The key has expired. </div> </div> <div class="signed-commit-footer p-3 rounded-bottom-2"> <span class="d-block">GPG key ID: <span class="color-fg-muted">4AEE18F83AFDEB23</span></span> <div class="my-1"> <span data-view-component="true" class="Label Label--accent">Expired</span> </div> <a class="Link--inTextBlock" href="https://docs.github.com/github/authenticating-to-github/displaying-verification-statuses-for-all-of-your-commits">Learn about vigilant mode</a>. </div> </div> </div> </details> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-ecb24f5c-b18a-11ef-955f-8bc9f2588961"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-ecb24f5c-b18a-11ef-955f-8bc9f2588961"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE4LjIuMA==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v18.2.0" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v18.2.0" data-view-component="true" class="Link--primary Link">18.2.0 (June 14, 2022)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><h3>React DOM</h3> <ul> <li>Provide a component stack as a second argument to <code>onRecoverableError</code>. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24591" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24591/hovercard">#24591</a>)</li> <li>Fix hydrating into <code>document</code> causing a blank page on mismatch. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24523" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24523/hovercard">#24523</a>)</li> <li>Fix false positive hydration errors with Suspense. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24480" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24480/hovercard">#24480</a> and <a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/24532" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24532/hovercard">#24532</a>)</li> <li>Fix ignored <code>setState</code> in Safari when adding an iframe. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/24459" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24459/hovercard">#24459</a>)</li> </ul> <h3>React DOM Server</h3> <ul> <li>Pass information about server errors to the client. (<a href="https://github.com/salazarm">@salazarm</a> and <a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24551" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24551/hovercard">#24551</a> and <a href="https://github.com/facebook/react/pull/24591" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24591/hovercard">#24591</a>)</li> <li>Allow to provide a reason when aborting the HTML stream. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24680" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24680/hovercard">#24680</a>)</li> <li>Eliminate extraneous text separators in the HTML where possible. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24630" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24630/hovercard">#24630</a>)</li> <li>Disallow complex children inside <code><title></code> elements to match the browser constraints. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24679" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24679/hovercard">#24679</a>)</li> <li>Fix buffering in some worker environments by explicitly setting <code>highWaterMark</code> to <code>0</code>. (<a href="https://github.com/jplhomer">@jplhomer</a> in <a href="https://github.com/facebook/react/pull/24641" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24641/hovercard">#24641</a>)</li> </ul> <h3>Server Components (Experimental)</h3> <ul> <li>Add support for <code>useId()</code> inside Server Components. (<a href="https://github.com/gnoff">@gnoff</a>) in <a href="https://github.com/facebook/react/pull/24172" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24172/hovercard">#24172</a></li> </ul></div> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v18.2.0" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="ldVV69leHaZopjQ9MDKU0KnKOQJ4II34zY3DhuXRSrOyQPGl1SghgJQ5iBvXJo9wQxN1jQf_zF31Y0im_-jZTg" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="RE_kwDOAJy2Ks4EI4_d"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-6e9a92" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (499): gnoff, 07:51PM on June 14, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">499</span> </button> <tool-tip id="tooltip-68e9a1e1-b5f5-4b63-a996-46d16da53a17" for="reactions--reaction_button_component-6e9a92" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">apostolos, morellodev, marcotterra, chanan, dillingham, dcsaszar, davbrito, salvoravida, Resetnak, unrealapex, and 489 more reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-c1cd49" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (71): gnoff, 07:51PM on June 14, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">71</span> </button> <tool-tip id="tooltip-9e54d86d-9548-496f-b9a0-fa2a4c229f9f" for="reactions--reaction_button_component-c1cd49" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">wajeshubham, Huinno-YoonJaeYoon, leonardssh, anaslaham, mhndev, gregarega1993, Ahmedgkanria, lin72h, huynhdev24, Zinoujoker, and 61 more reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-8f4ae0" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (120): gnoff, 07:51PM on June 14, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">120</span> </button> <tool-tip id="tooltip-d2ff7a61-e2de-42fb-8cd1-bed84ad25c6f" for="reactions--reaction_button_component-8f4ae0" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">mkosir, kazuhitonakayama, rvitaliy, ivanov-v, fatihcandev, aramnazaryan, OmerWow, outbackStack, xiel, tronikelis, and 110 more reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-4ef753" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (178): gnoff, 07:51PM on June 14, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">178</span> </button> <tool-tip id="tooltip-1695bc11-d183-4e7e-8729-3e0078bee05d" for="reactions--reaction_button_component-4ef753" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">LakhderAmine99, pavinthan, RazvanRauta, morellodev, jplhomer, blittle, Berrones-Edwin, salvoravida, unrealapex, electron-space, and 168 more reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-d6fdae" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (148): gnoff, 07:51PM on June 14, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">148</span> </button> <tool-tip id="tooltip-e12ddaa9-3ac4-435f-a33a-3eb4a36a53dd" for="reactions--reaction_button_component-d6fdae" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">svengreb, unigazer, morellodev, blittle, kachkaev, jakejarvis, brneor, lmachens, salvoravida, unrealapex, and 138 more reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-32103f" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (76): gnoff, 07:51PM on June 14, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">76</span> </button> <tool-tip id="tooltip-80d5290e-f32b-412d-a04d-2fec5592c2b0" for="reactions--reaction_button_component-32103f" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">MrDanOak, adiezdev, outbackStack, tronikelis, MertHaddad, rivailruiz, andreLDias, EarlGeorge, jamieshark, libeyondea, and 66 more reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="apostolos, morellodev, marcotterra, chanan, dillingham, dcsaszar, davbrito, salvoravida, Resetnak, unrealapex, and 489 more reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>499 reactions</span> </li> <li class="dropdown-item" aria-label="wajeshubham, Huinno-YoonJaeYoon, leonardssh, anaslaham, mhndev, gregarega1993, Ahmedgkanria, lin72h, huynhdev24, Zinoujoker, and 61 more reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>71 reactions</span> </li> <li class="dropdown-item" aria-label="mkosir, kazuhitonakayama, rvitaliy, ivanov-v, fatihcandev, aramnazaryan, OmerWow, outbackStack, xiel, tronikelis, and 110 more reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>120 reactions</span> </li> <li class="dropdown-item" aria-label="LakhderAmine99, pavinthan, RazvanRauta, morellodev, jplhomer, blittle, Berrones-Edwin, salvoravida, unrealapex, electron-space, and 168 more reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>178 reactions</span> </li> <li class="dropdown-item" aria-label="svengreb, unigazer, morellodev, blittle, kachkaev, jakejarvis, brneor, lmachens, salvoravida, unrealapex, and 138 more reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>148 reactions</span> </li> <li class="dropdown-item" aria-label="MrDanOak, adiezdev, outbackStack, tronikelis, MertHaddad, rivailruiz, andreLDias, EarlGeorge, jamieshark, libeyondea, and 66 more reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>76 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">697 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-f7295828"> <h2 class="sr-only" id="hd-f7295828">18.1.0 (April 26, 2022)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2022-04-26T21:15:00Z"> 26 Apr 21:15 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/3624098?s=40&v=4" alt="@acdlite" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/acdlite/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/acdlite">acdlite</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v18.1.0" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v18.1.0 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/22edb9f777d27369fd2c1fad378f74e237b6dfd3/hovercard" href="/facebook/react/commit/22edb9f777d27369fd2c1fad378f74e237b6dfd3" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">22edb9f</code></a><details class="dropdown dropdown-signed-commit details-reset details-overlay js-dropdown-details d-inline-block ml-1"> <summary class="color-fg-success" > <svg aria-label="Verified commit signature" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </summary> <div class="anim-scale-in" style="position: relative; z-index: 200;"> <div class="dropdown-menu dropdown-menu-s py-0 color-fg-default text-left"> <div class="p-3 signed-commit-header d-flex"> <div class="pr-1"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-verified mr-2"> <path d="m9.585.52.929.68c.153.112.331.186.518.215l1.138.175a2.678 2.678 0 0 1 2.24 2.24l.174 1.139c.029.187.103.365.215.518l.68.928a2.677 2.677 0 0 1 0 3.17l-.68.928a1.174 1.174 0 0 0-.215.518l-.175 1.138a2.678 2.678 0 0 1-2.241 2.241l-1.138.175a1.17 1.17 0 0 0-.518.215l-.928.68a2.677 2.677 0 0 1-3.17 0l-.928-.68a1.174 1.174 0 0 0-.518-.215L3.83 14.41a2.678 2.678 0 0 1-2.24-2.24l-.175-1.138a1.17 1.17 0 0 0-.215-.518l-.68-.928a2.677 2.677 0 0 1 0-3.17l.68-.928c.112-.153.186-.331.215-.518l.175-1.14a2.678 2.678 0 0 1 2.24-2.24l1.139-.175c.187-.029.365-.103.518-.215l.928-.68a2.677 2.677 0 0 1 3.17 0ZM7.303 1.728l-.927.68a2.67 2.67 0 0 1-1.18.489l-1.137.174a1.179 1.179 0 0 0-.987.987l-.174 1.136a2.677 2.677 0 0 1-.489 1.18l-.68.928a1.18 1.18 0 0 0 0 1.394l.68.927c.256.348.424.753.489 1.18l.174 1.137c.078.509.478.909.987.987l1.136.174a2.67 2.67 0 0 1 1.18.489l.928.68c.414.305.979.305 1.394 0l.927-.68a2.67 2.67 0 0 1 1.18-.489l1.137-.174a1.18 1.18 0 0 0 .987-.987l.174-1.136a2.67 2.67 0 0 1 .489-1.18l.68-.928a1.176 1.176 0 0 0 0-1.394l-.68-.927a2.686 2.686 0 0 1-.489-1.18l-.174-1.137a1.179 1.179 0 0 0-.987-.987l-1.136-.174a2.677 2.677 0 0 1-1.18-.489l-.928-.68a1.176 1.176 0 0 0-1.394 0ZM11.28 6.78l-3.75 3.75a.75.75 0 0 1-1.06 0L4.72 8.78a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L7 8.94l3.22-3.22a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </div> <div class="flex-1"> This commit was created on GitHub.com and signed with GitHub’s <strong>verified signature</strong>. The key has expired. </div> </div> <div class="signed-commit-footer p-3 rounded-bottom-2"> <span class="d-block">GPG key ID: <span class="color-fg-muted">4AEE18F83AFDEB23</span></span> <div class="my-1"> <span data-view-component="true" class="Label Label--accent">Expired</span> </div> <a class="Link--inTextBlock" href="https://docs.github.com/github/authenticating-to-github/displaying-verification-statuses-for-all-of-your-commits">Learn about vigilant mode</a>. </div> </div> </div> </details> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-ecb8915a-b18a-11ef-95aa-bfd32cd8b911"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-ecb8915a-b18a-11ef-95aa-bfd32cd8b911"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE4LjEuMA==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v18.1.0" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v18.1.0" data-view-component="true" class="Link--primary Link">18.1.0 (April 26, 2022)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><h3>React DOM</h3> <ul> <li>Fix the false positive warning about <code>react-dom/client</code> when using UMD bundle. (<a href="https://github.com/alireza-molaee">@alireza-molaee</a> in <a href="https://github.com/facebook/react/pull/24274" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24274/hovercard">#24274</a>)</li> <li>Fix <code>suppressHydrationWarning</code> to work in production too. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/24271" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24271/hovercard">#24271</a>)</li> <li>Fix <code>componentWillUnmount</code> firing twice inside of Suspense. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/24308" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24308/hovercard">#24308</a>)</li> <li>Fix some transition updates being ignored. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/24353" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24353/hovercard">#24353</a>)</li> <li>Fix <code>useDeferredValue</code> causing an infinite loop when passed an unmemoized value. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/24247" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24247/hovercard">#24247</a>)</li> <li>Fix throttling of revealing Suspense fallbacks. (<a href="https://github.com/sunderls">@sunderls</a> in <a href="https://github.com/facebook/react/pull/24253" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24253/hovercard">#24253</a>)</li> <li>Fix an inconsistency in whether the props object is the same between renders. (<a href="https://github.com/Andarist">@Andarist</a> and <a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/24421" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24421/hovercard">#24421</a>)</li> <li>Fix a missing warning about a <code>setState</code> loop in <code>useEffect</code>. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/24298" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24298/hovercard">#24298</a>)</li> <li>Fix a spurious hydration error. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24404" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24404/hovercard">#24404</a>)</li> <li>Warn when calling <code>setState</code> in <code>useInsertionEffect</code>. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/24295" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24295/hovercard">#24295</a>)</li> <li>Ensure the reason for hydration errors is always displayed. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/24276" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24276/hovercard">#24276</a>)</li> </ul> <h3>React DOM Server</h3> <ul> <li>Fix escaping for the <code>bootstrapScriptContent</code> contents. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24385" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24385/hovercard">#24385</a>)</li> <li>Significantly improve performance of <code>renderToPipeableStream</code>. (<a href="https://github.com/gnoff">@gnoff</a> in <a href="https://github.com/facebook/react/pull/24291" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24291/hovercard">#24291</a>)</li> </ul> <h3>ESLint Plugin: React Hooks</h3> <ul> <li>Fix false positive errors with a large number of branches. (<a href="https://github.com/scyron6">@scyron6</a> in <a href="https://github.com/facebook/react/pull/24287" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24287/hovercard">#24287</a>)</li> <li>Don't consider a known dependency stable when the variable is reassigned. (<a href="https://github.com/afzalsayed96">@afzalsayed96</a> in <a href="https://github.com/facebook/react/pull/24343" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24343/hovercard">#24343</a>)</li> </ul> <h3>Use Subscription</h3> <ul> <li>Replace the implementation with the <code>use-sync-external-store</code> shim. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/24289" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/24289/hovercard">#24289</a>)</li> </ul></div> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v18.1.0" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="FlR0O2hjHLMkfkYENlJJF-Kru_U8XRK6Hy4DxPGKG-wxwdB1ZBUgldjh-iLRRlK3CHL3ekOCUx8nwIjk67OIEQ" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="RE_kwDOAJy2Ks4D5gd1"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-a52a48" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (249): acdlite, 09:13PM on April 26, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">249</span> </button> <tool-tip id="tooltip-7f8c85e5-d93a-4493-b289-a1675dad0ac2" for="reactions--reaction_button_component-a52a48" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">natewu, yusufneeson, rockchalkwushock, liu-yihong, NetLancer, jkoon90, devrsi0n, songjianet, gaby, donguks, and 239 more reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-ecd1af" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (53): acdlite, 09:13PM on April 26, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">53</span> </button> <tool-tip id="tooltip-0992f98f-806b-4927-bfb1-1e1c9c2cc1a7" for="reactions--reaction_button_component-ecd1af" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">dimaMachina, hundehausen, nathan3boss, sajadevo, naji0329, alexander-grube, yairdyule, HillLiu, thevuong, zhuangya, and 43 more reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-c2b13a" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (98): acdlite, 09:13PM on April 26, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">98</span> </button> <tool-tip id="tooltip-11c1b2d6-996a-46af-876c-94d675aaee87" for="reactions--reaction_button_component-c2b13a" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">dimaMachina, whoisjordangarcia, hundehausen, akamfoad, ecreeth, nathan3boss, sajadevo, naji0329, alexander-grube, import-brain, and 88 more reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-959bab" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (72): acdlite, 09:13PM on April 26, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">72</span> </button> <tool-tip id="tooltip-122e9967-64c6-47b0-ba17-5fc2a4e2e83e" for="reactions--reaction_button_component-959bab" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">eideard-hm, thevuong, lucasgdb, phobal, imjordanxd, beetcb, NoMoreViolence, raix, kasipavankumar, mkosir, and 62 more reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-4a67ad" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (84): acdlite, 09:13PM on April 26, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">84</span> </button> <tool-tip id="tooltip-29c02954-1de9-4061-8602-64cffde98c34" for="reactions--reaction_button_component-4a67ad" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">dimaMachina, hundehausen, svengreb, nathan3boss, sajadevo, naji0329, alexander-grube, import-brain, duzitug, TIMMLOPK, and 74 more reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-99c04d" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (46): acdlite, 09:13PM on April 26, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">46</span> </button> <tool-tip id="tooltip-fb99e90c-3df0-43d6-9dbd-0a55db3cf65a" for="reactions--reaction_button_component-99c04d" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">ahsouza, thepmsquare, 3lang3, rodamaral, world56, charlie043, NoMoreViolence, U-C-S, tobyleye, oliverloops, and 36 more reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="natewu, yusufneeson, rockchalkwushock, liu-yihong, NetLancer, jkoon90, devrsi0n, songjianet, gaby, donguks, and 239 more reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>249 reactions</span> </li> <li class="dropdown-item" aria-label="dimaMachina, hundehausen, nathan3boss, sajadevo, naji0329, alexander-grube, yairdyule, HillLiu, thevuong, zhuangya, and 43 more reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>53 reactions</span> </li> <li class="dropdown-item" aria-label="dimaMachina, whoisjordangarcia, hundehausen, akamfoad, ecreeth, nathan3boss, sajadevo, naji0329, alexander-grube, import-brain, and 88 more reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>98 reactions</span> </li> <li class="dropdown-item" aria-label="eideard-hm, thevuong, lucasgdb, phobal, imjordanxd, beetcb, NoMoreViolence, raix, kasipavankumar, mkosir, and 62 more reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>72 reactions</span> </li> <li class="dropdown-item" aria-label="dimaMachina, hundehausen, svengreb, nathan3boss, sajadevo, naji0329, alexander-grube, import-brain, duzitug, TIMMLOPK, and 74 more reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>84 reactions</span> </li> <li class="dropdown-item" aria-label="ahsouza, thepmsquare, 3lang3, rodamaral, world56, charlie043, NoMoreViolence, U-C-S, tobyleye, oliverloops, and 36 more reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>46 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">370 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-a5f2c9a1"> <h2 class="sr-only" id="hd-a5f2c9a1">18.0.0 (March 29, 2022)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2022-03-29T17:22:34Z"> 29 Mar 17:22 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/3624098?s=40&v=4" alt="@acdlite" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/acdlite/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/acdlite">acdlite</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v18.0.0" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v18.0.0 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/34aa5cfe0d9b6ec4667e02bf46ab34d83dfb2d6d/hovercard" href="/facebook/react/commit/34aa5cfe0d9b6ec4667e02bf46ab34d83dfb2d6d" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">34aa5cf</code></a> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-ecbe2ae8-b18a-11ef-863f-507608f7de8d"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-ecbe2ae8-b18a-11ef-863f-507608f7de8d"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE4LjAuMA==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v18.0.0" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v18.0.0" data-view-component="true" class="Link--primary Link">18.0.0 (March 29, 2022)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><p>Below is a list of all new features, APIs, deprecations, and breaking changes.<br> Read <a href="https://reactjs.org/blog/2022/03/29/react-v18.html" rel="nofollow">React 18 release post</a> and <a href="https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html" rel="nofollow">React 18 upgrade guide</a> for more information.</p> <h3>New Features</h3> <h3>React</h3> <ul> <li><code>useId</code> is a new hook for generating unique IDs on both the client and server, while avoiding hydration mismatches. It is primarily useful for component libraries integrating with accessibility APIs that require unique IDs. This solves an issue that already exists in React 17 and below, but it’s even more important in React 18 because of how the new streaming server renderer delivers HTML out-of-order.</li> <li><code>startTransition</code> and <code>useTransition</code> let you mark some state updates as not urgent. Other state updates are considered urgent by default. React will allow urgent state updates (for example, updating a text input) to interrupt non-urgent state updates (for example, rendering a list of search results).</li> <li><code>useDeferredValue</code> lets you defer re-rendering a non-urgent part of the tree. It is similar to debouncing, but has a few advantages compared to it. There is no fixed time delay, so React will attempt the deferred render right after the first render is reflected on the screen. The deferred render is interruptible and doesn't block user input.</li> <li><code>useSyncExternalStore</code> is a new hook that allows external stores to support concurrent reads by forcing updates to the store to be synchronous. It removes the need for <code>useEffect</code> when implementing subscriptions to external data sources, and is recommended for any library that integrates with state external to React.</li> <li><code>useInsertionEffect</code> is a new hook that allows CSS-in-JS libraries to address performance issues of injecting styles in render. Unless you’ve already built a CSS-in-JS library we don’t expect you to ever use this. This hook will run after the DOM is mutated, but before layout effects read the new layout. This solves an issue that already exists in React 17 and below, but is even more important in React 18 because React yields to the browser during concurrent rendering, giving it a chance to recalculate layout.</li> </ul> <h3>React DOM Client</h3> <p>These new APIs are now exported from <code>react-dom/client</code>:</p> <ul> <li><code>createRoot</code>: New method to create a root to <code>render</code> or <code>unmount</code>. Use it instead of <code>ReactDOM.render</code>. New features in React 18 don't work without it.</li> <li><code>hydrateRoot</code>: New method to hydrate a server rendered application. Use it instead of <code>ReactDOM.hydrate</code> in conjunction with the new React DOM Server APIs. New features in React 18 don't work without it.</li> </ul> <p>Both <code>createRoot</code> and <code>hydrateRoot</code> accept a new option called <code>onRecoverableError</code> in case you want to be notified when React recovers from errors during rendering or hydration for logging. By default, React will use <a href="https://developer.mozilla.org/en-US/docs/Web/API/reportError" rel="nofollow"><code>reportError</code></a>, or <code>console.error</code> in the older browsers.</p> <h3>React DOM Server</h3> <p>These new APIs are now exported from <code>react-dom/server</code> and have full support for streaming Suspense on the server:</p> <ul> <li><code>renderToPipeableStream</code>: for streaming in Node environments.</li> <li><code>renderToReadableStream</code>: for modern edge runtime environments, such as Deno and Cloudflare workers.</li> </ul> <p>The existing <code>renderToString</code> method keeps working but is discouraged.</p> <h2>Deprecations</h2> <ul> <li><code>react-dom</code>: <code>ReactDOM.render</code> has been deprecated. Using it will warn and run your app in React 17 mode.</li> <li><code>react-dom</code>: <code>ReactDOM.hydrate</code> has been deprecated. Using it will warn and run your app in React 17 mode.</li> <li><code>react-dom</code>: <code>ReactDOM.unmountComponentAtNode</code> has been deprecated.</li> <li><code>react-dom</code>: <code>ReactDOM.renderSubtreeIntoContainer</code> has been deprecated.</li> <li><code>react-dom/server</code>: <code>ReactDOMServer.renderToNodeStream</code> has been deprecated.</li> </ul> <h2>Breaking Changes</h2> <h3>React</h3> <ul> <li><strong>Automatic batching:</strong> This release introduces a performance improvement that changes to the way React batches updates to do more batching automatically. See <a href="https://github.com/reactwg/react-18/discussions/21" data-hovercard-type="discussion" data-hovercard-url="/reactwg/react-18/discussions/21/hovercard">Automatic batching for fewer renders in React 18</a> for more info. In the rare case that you need to opt out, wrap the state update in <code>flushSync</code>.</li> <li><strong>Stricter Strict Mode</strong>: In the future, React will provide a feature that lets components preserve state between unmounts. To prepare for it, React 18 introduces a new development-only check to Strict Mode. React will automatically unmount and remount every component, whenever a component mounts for the first time, restoring the previous state on the second mount. If this breaks your app, consider removing Strict Mode until you can fix the components to be resilient to remounting with existing state.</li> <li><strong>Consistent useEffect timing</strong>: React now always synchronously flushes effect functions if the update was triggered during a discrete user input event such as a click or a keydown event. Previously, the behavior wasn't always predictable or consistent.</li> <li><strong>Stricter hydration errors</strong>: Hydration mismatches due to missing or extra text content are now treated like errors instead of warnings. React will no longer attempt to "patch up" individual nodes by inserting or deleting a node on the client in an attempt to match the server markup, and will revert to client rendering up to the closest <code><Suspense></code> boundary in the tree. This ensures the hydrated tree is consistent and avoids potential privacy and security holes that can be caused by hydration mismatches.</li> <li><strong>Suspense trees are always consistent:</strong> If a component suspends before it's fully added to the tree, React will not add it to the tree in an incomplete state or fire its effects. Instead, React will throw away the new tree completely, wait for the asynchronous operation to finish, and then retry rendering again from scratch. React will render the retry attempt concurrently, and without blocking the browser.</li> <li><strong>Layout Effects with Suspense</strong>: When a tree re-suspends and reverts to a fallback, React will now clean up layout effects, and then re-create them when the content inside the boundary is shown again. This fixes an issue which prevented component libraries from correctly measuring layout when used with Suspense.</li> <li><strong>New JS Environment Requirements</strong>: React now depends on modern browsers features including <code>Promise</code>, <code>Symbol</code>, and <code>Object.assign</code>. If you support older browsers and devices such as Internet Explorer which do not provide modern browser features natively or have non-compliant implementations, consider including a global polyfill in your bundled application.</li> </ul> <h3>Scheduler (Experimental)</h3> <ul> <li>Remove unstable <code>scheduler/tracing</code> API</li> </ul> <h2>Notable Changes</h2> <h3>React</h3> <ul> <li><strong>Components can now render <code>undefined</code>:</strong> React no longer throws if you return <code>undefined</code> from a component. This makes the allowed component return values consistent with values that are allowed in the middle of a component tree. We suggest to use a linter to prevent mistakes like forgetting a <code>return</code> statement before JSX.</li> <li><strong>In tests, <code>act</code> warnings are now opt-in:</strong> If you're running end-to-end tests, the <code>act</code> warnings are unnecessary. We've introduced an <a href="https://github.com/reactwg/react-18/discussions/102" data-hovercard-type="discussion" data-hovercard-url="/reactwg/react-18/discussions/102/hovercard">opt-in</a> mechanism so you can enable them only for unit tests where they are useful and beneficial.</li> <li><strong>No warning about <code>setState</code> on unmounted components:</strong> Previously, React warned about memory leaks when you call <code>setState</code> on an unmounted component. This warning was added for subscriptions, but people primarily run into it in scenarios where setting state is fine, and workarounds make the code worse. We've <a href="https://github.com/facebook/react/pull/22114" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/22114/hovercard">removed</a> this warning.</li> <li><strong>No suppression of console logs:</strong> When you use Strict Mode, React renders each component twice to help you find unexpected side effects. In React 17, we've suppressed console logs for one of the two renders to make the logs easier to read. In response to <a href="https://github.com/facebook/react/issues/21783" data-hovercard-type="issue" data-hovercard-url="/facebook/react/issues/21783/hovercard">community feedback</a> about this being confusing, we've removed the suppression. Instead, if you have React DevTools installed, the second log's renders will be displayed in grey, and there will be an option (off by default) to suppress them completely.</li> <li><strong>Improved memory usage:</strong> React now cleans up more internal fields on unmount, making the impact from unfixed memory leaks that may exist in your application code less severe.</li> </ul> <h3>React DOM Server</h3> <ul> <li><strong><code>renderToString</code>:</strong> Will no longer error when suspending on the server. Instead, it will emit the fallback HTML for the closest <code><Suspense></code> boundary and then retry rendering the same content on the client. It is still recommended that you switch to a streaming API like <code>renderToPipeableStream</code> or <code>renderToReadableStream</code> instead.</li> <li><strong><code>renderToStaticMarkup</code>:</strong> Will no longer error when suspending on the server. Instead, it will emit the fallback HTML for the closest <code><Suspense></code> boundary and retry rendering on the client.</li> </ul> <h2>All Changes</h2> <h2>React</h2> <ul> <li>Add <code>useTransition</code> and <code>useDeferredValue</code> to separate urgent updates from transitions. (<a href="https://github.com/facebook/react/pull/10426" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/10426/hovercard">#10426</a>, <a href="https://github.com/facebook/react/pull/10715" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/10715/hovercard">#10715</a>, <a href="https://github.com/facebook/react/pull/15593" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/15593/hovercard">#15593</a>, <a href="https://github.com/facebook/react/pull/15272" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/15272/hovercard">#15272</a>, <a href="https://github.com/facebook/react/pull/15578" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/15578/hovercard">#15578</a>, <a href="https://github.com/facebook/react/pull/15769" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/15769/hovercard">#15769</a>, <a href="https://github.com/facebook/react/pull/17058" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17058/hovercard">#17058</a>, <a href="https://github.com/facebook/react/pull/18796" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18796/hovercard">#18796</a>, <a href="https://github.com/facebook/react/pull/19121" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19121/hovercard">#19121</a>, <a href="https://github.com/facebook/react/pull/19703" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19703/hovercard">#19703</a>, <a href="https://github.com/facebook/react/pull/19719" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19719/hovercard">#19719</a>, <a href="https://github.com/facebook/react/pull/19724" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19724/hovercard">#19724</a>, <a href="https://github.com/facebook/react/pull/20672" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/20672/hovercard">#20672</a>, <a href="https://github.com/facebook/react/pull/20976" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/20976/hovercard">#20976</a> by [<a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/acdlite/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/acdlite">@acdlite</a>](<a href="https://git" rel="nofollow">https://git</a>...</li> </ul></div> <a href="/facebook/react/releases/tag/v18.0.0" data-view-component="true" class="Link">Read more</a> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v18.0.0" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="Or8KAF7t2DN0yh-a-OyXoWU6nqe0QwuCvckWzstLU2wdKq5OUpvkFYhVo7wf-IwBj-PSKMucSieFJ53u0XLAkQ" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="RE_kwDOAJy2Ks4DwkN8"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-76f4fe" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (711): acdlite, 05:17PM on March 29, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">711</span> </button> <tool-tip id="tooltip-57f615b5-cf03-4458-8e22-a0f79a54eb26" for="reactions--reaction_button_component-76f4fe" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">aabuhijleh, chayeoi, medanat, yezz123, targos, ricardocanelas, hundehausen, lin72h, andreasnilssondev, AlekseiAndriushin, and 701 more reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-205199" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (123): acdlite, 05:17PM on March 29, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">123</span> </button> <tool-tip id="tooltip-f8ca6fbc-1def-400b-996d-e6d28059eff6" for="reactions--reaction_button_component-205199" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">ricardocanelas, lin72h, reichhartd, birdview-HongKi, must479, kytosai, tronikelis, JulesPatry, xxxxue, pedro-lb, and 113 more reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-9f726e" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (313): acdlite, 05:17PM on March 29, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">313</span> </button> <tool-tip id="tooltip-1ccfeaac-f930-453b-8de4-1f84b5b58409" for="reactions--reaction_button_component-9f726e" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">ricardocanelas, hundehausen, lin72h, reichhartd, mario-jerkovic, mahmoudkandeel, RemyMachado, A1101101IR, saitergun, joulev, and 303 more reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-ac8a66" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (242): acdlite, 05:17PM on March 29, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">242</span> </button> <tool-tip id="tooltip-3d3c4a4b-7ed2-467e-a2a1-a3c294cdc973" for="reactions--reaction_button_component-ac8a66" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">ricardocanelas, lin72h, reichhartd, matuzalemsteles, mario-jerkovic, mahmoudkandeel, birdview-HongKi, josuazurbruegg, fpiaggio-optiwe, sshquack, and 232 more reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-8c42cc" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (256): acdlite, 05:17PM on March 29, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">256</span> </button> <tool-tip id="tooltip-3cbc19a4-00ff-4fd7-a4fe-6160db878618" for="reactions--reaction_button_component-8c42cc" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">Danieltf100, medanat, leonardopliski, luoxuhai, aslupin, andipaetzold, RafaelBahiense, ricardocanelas, hundehausen, lin72h, and 246 more reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-97096c" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (109): acdlite, 05:17PM on March 29, 2022" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">109</span> </button> <tool-tip id="tooltip-8eeded9c-701e-4548-a425-19c7167c654c" for="reactions--reaction_button_component-97096c" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">luoxuhai, yezz123, ricardocanelas, reichhartd, sudovijay, tronikelis, JulesPatry, Illu, xxxxue, pedro-lb, and 99 more reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="aabuhijleh, chayeoi, medanat, yezz123, targos, ricardocanelas, hundehausen, lin72h, andreasnilssondev, AlekseiAndriushin, and 701 more reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>711 reactions</span> </li> <li class="dropdown-item" aria-label="ricardocanelas, lin72h, reichhartd, birdview-HongKi, must479, kytosai, tronikelis, JulesPatry, xxxxue, pedro-lb, and 113 more reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>123 reactions</span> </li> <li class="dropdown-item" aria-label="ricardocanelas, hundehausen, lin72h, reichhartd, mario-jerkovic, mahmoudkandeel, RemyMachado, A1101101IR, saitergun, joulev, and 303 more reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>313 reactions</span> </li> <li class="dropdown-item" aria-label="ricardocanelas, lin72h, reichhartd, matuzalemsteles, mario-jerkovic, mahmoudkandeel, birdview-HongKi, josuazurbruegg, fpiaggio-optiwe, sshquack, and 232 more reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>242 reactions</span> </li> <li class="dropdown-item" aria-label="Danieltf100, medanat, leonardopliski, luoxuhai, aslupin, andipaetzold, RafaelBahiense, ricardocanelas, hundehausen, lin72h, and 246 more reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>256 reactions</span> </li> <li class="dropdown-item" aria-label="luoxuhai, yezz123, ricardocanelas, reichhartd, sudovijay, tronikelis, JulesPatry, Illu, xxxxue, pedro-lb, and 99 more reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>109 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">960 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-7f13ba13"> <h2 class="sr-only" id="hd-7f13ba13">17.0.2 (March 22, 2021)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2021-03-22T22:00:26Z"> 22 Mar 22:00 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/810438?s=40&v=4" alt="@gaearon" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/gaearon/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/gaearon">gaearon</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v17.0.2" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v17.0.2 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/12adaffef7105e2714f82651ea51936c563fe15c/hovercard" href="/facebook/react/commit/12adaffef7105e2714f82651ea51936c563fe15c" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">12adaff</code></a> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-ecc3b6de-b18a-11ef-934a-864c4a830647"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-ecc3b6de-b18a-11ef-934a-864c4a830647"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE3LjAuMg==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v17.0.2" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v17.0.2" data-view-component="true" class="Link--primary Link">17.0.2 (March 22, 2021)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><h3>React DOM</h3> <ul> <li>Remove an unused dependency to address the <a href="https://developer.chrome.com/blog/enabling-shared-array-buffer/" rel="nofollow"><code>SharedArrayBuffer</code> cross-origin isolation warning</a>. (<a href="https://github.com/koba04">@koba04</a> and <a href="https://github.com/bvaughn">@bvaughn</a> in <a href="https://github.com/facebook/react/pull/20831" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/20831/hovercard">#20831</a>, <a href="https://github.com/facebook/react/pull/20832" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/20832/hovercard">#20832</a>, and <a href="https://github.com/facebook/react/pull/20840" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/20840/hovercard">#20840</a>)</li> </ul> <h2>Artifacts</h2> <ul> <li>react: <a href="https://unpkg.com/react@17.0.2/umd/" rel="nofollow">https://unpkg.com/react@17.0.2/umd/</a></li> <li>react-art: <a href="https://unpkg.com/react-art@17.0.2/umd/" rel="nofollow">https://unpkg.com/react-art@17.0.2/umd/</a></li> <li>react-dom: <a href="https://unpkg.com/react-dom@17.0.2/umd/" rel="nofollow">https://unpkg.com/react-dom@17.0.2/umd/</a></li> <li>react-is: <a href="https://unpkg.com/react-is@17.0.2/umd/" rel="nofollow">https://unpkg.com/react-is@17.0.2/umd/</a></li> <li>react-test-renderer: <a href="https://unpkg.com/react-test-renderer@17.0.2/umd/" rel="nofollow">https://unpkg.com/react-test-renderer@17.0.2/umd/</a></li> <li>scheduler: <a href="https://unpkg.com/scheduler@0.20.2/umd/" rel="nofollow">https://unpkg.com/scheduler@0.20.2/umd/</a></li> </ul></div> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v17.0.2" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="ZbsEEuphFCy2-e-oIKJc1WXMSn0Mydx0UdS6ZWGJbgxCLqBc5hcoCkpmU47Htkd1jxUG8nMWndFpOjFFe7D98Q" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="MDc6UmVsZWFzZTQwMTkwMDY1"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-6ee8c4" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (148): gaearon, 08:01PM on March 22, 2021" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">148</span> </button> <tool-tip id="tooltip-1af66f0c-8aed-4d88-a406-ab4abdd7acea" for="reactions--reaction_button_component-6ee8c4" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">asumaran, moongue, niubaba63, ogawaryu, lkzwc, cdslily, Mayandev, cococov, Nikolozi-Code, luvagu, and 138 more reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-5cceda" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (42): gaearon, 08:01PM on March 22, 2021" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">42</span> </button> <tool-tip id="tooltip-d7660b02-6535-4fae-8044-ec2d7e903fc1" for="reactions--reaction_button_component-5cceda" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">asumaran, cococov, sungkwangkim, leandrowilliam, shourysharma, andrey1997acer, zeayal, NavidMansuri5155, pH-7, 365kim, and 32 more reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-d54ca0" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (51): gaearon, 08:01PM on March 22, 2021" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">51</span> </button> <tool-tip id="tooltip-4161ba5d-354e-43ad-8f26-42a5332ce6e5" for="reactions--reaction_button_component-d54ca0" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">asumaran, cococov, sungkwangkim, shourysharma, raysubham, andrey1997acer, zeayal, imaksp, NavidMansuri5155, pH-7, and 41 more reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-b09891" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (53): gaearon, 08:01PM on March 22, 2021" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">53</span> </button> <tool-tip id="tooltip-7d056e2c-baea-4bed-b042-94559ee16473" for="reactions--reaction_button_component-b09891" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">asumaran, mohitsinhchavda, shourysharma, raysubham, andrey1997acer, zeayal, NavidMansuri5155, 365kim, masudparvezsajjad, zereight, and 43 more reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-30114a" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (55): gaearon, 08:01PM on March 22, 2021" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">55</span> </button> <tool-tip id="tooltip-59e53785-fc2c-4240-9bc6-70603828ba65" for="reactions--reaction_button_component-30114a" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">asumaran, maxpou, cococov, sungkwangkim, leandrowilliam, crazy-grizzly, mohitsinhchavda, shourysharma, raysubham, theory-of-soul, and 45 more reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-e9e9a8" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (40): gaearon, 08:01PM on March 22, 2021" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">40</span> </button> <tool-tip id="tooltip-d4b17403-0374-4497-a13c-0af0b5be45e3" for="reactions--reaction_button_component-e9e9a8" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">asumaran, cococov, shourysharma, andrey1997acer, zeayal, NavidMansuri5155, jettandres, DJLuis97, 365kim, rodamaral, and 30 more reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="asumaran, moongue, niubaba63, ogawaryu, lkzwc, cdslily, Mayandev, cococov, Nikolozi-Code, luvagu, and 138 more reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>148 reactions</span> </li> <li class="dropdown-item" aria-label="asumaran, cococov, sungkwangkim, leandrowilliam, shourysharma, andrey1997acer, zeayal, NavidMansuri5155, pH-7, 365kim, and 32 more reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>42 reactions</span> </li> <li class="dropdown-item" aria-label="asumaran, cococov, sungkwangkim, shourysharma, raysubham, andrey1997acer, zeayal, imaksp, NavidMansuri5155, pH-7, and 41 more reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>51 reactions</span> </li> <li class="dropdown-item" aria-label="asumaran, mohitsinhchavda, shourysharma, raysubham, andrey1997acer, zeayal, NavidMansuri5155, 365kim, masudparvezsajjad, zereight, and 43 more reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>53 reactions</span> </li> <li class="dropdown-item" aria-label="asumaran, maxpou, cococov, sungkwangkim, leandrowilliam, crazy-grizzly, mohitsinhchavda, shourysharma, raysubham, theory-of-soul, and 45 more reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>55 reactions</span> </li> <li class="dropdown-item" aria-label="asumaran, cococov, shourysharma, andrey1997acer, zeayal, NavidMansuri5155, jettandres, DJLuis97, 365kim, rodamaral, and 30 more reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>40 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">187 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-32fafd61"> <h2 class="sr-only" id="hd-32fafd61">17.0.1 (October 22, 2020)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2021-03-22T21:59:46Z"> 22 Mar 21:59 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/810438?s=40&v=4" alt="@gaearon" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/gaearon/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/gaearon">gaearon</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v17.0.1" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v17.0.1 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/8e5adfbd7e605bda9c5e96c10e015b3dc0df688e/hovercard" href="/facebook/react/commit/8e5adfbd7e605bda9c5e96c10e015b3dc0df688e" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">8e5adfb</code></a> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-ecc70f3c-b18a-11ef-941c-1f4ef69c7865"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-ecc70f3c-b18a-11ef-941c-1f4ef69c7865"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE3LjAuMQ==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v17.0.1" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v17.0.1" data-view-component="true" class="Link--primary Link">17.0.1 (October 22, 2020)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><h3>React DOM</h3> <ul> <li>Fix a crash in IE11. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/20071" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/20071/hovercard">#20071</a>)</li> </ul></div> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v17.0.1" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="5Ee75aUHDveamVsnwoYb0ySgLFDR0x47Td7E6v1OLHTD0h-rqXEy0WYG5wElkgBzznlg364MX551ME_K53e_iQ" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="MDc6UmVsZWFzZTQwMTkwMDQ0"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-59ebae" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (2): gaearon, 12:23PM on October 22, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">2</span> </button> <tool-tip id="tooltip-c5073e5d-39af-4ae9-8872-aebc993585ea" for="reactions--reaction_button_component-59ebae" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">chris6090 and ikhtearalamshawonmollah54321 reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-d070f1" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (14): gaearon, 12:23PM on October 22, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">14</span> </button> <tool-tip id="tooltip-09daf93c-c09d-4ed1-a22b-a14bb3dd28ee" for="reactions--reaction_button_component-d070f1" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">hoa00, farm16, ArthurIanb, joshkautz, vituchini, liuhaiyang1997, Schweinepriester, theoludwig, huynhdev24, njosueofficol, and 4 more reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-22ee04" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (2): gaearon, 12:23PM on October 22, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">2</span> </button> <tool-tip id="tooltip-ee2c524d-2c29-4854-a8cd-9ea66fe38c43" for="reactions--reaction_button_component-22ee04" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">chris6090 and ikhtearalamshawonmollah54321 reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-a31e7d" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (14): gaearon, 12:23PM on October 22, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">14</span> </button> <tool-tip id="tooltip-8b1c892e-eeee-47b3-9697-cd3cebd14659" for="reactions--reaction_button_component-a31e7d" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">SonNg2k, farzadrastgar, rex11458, sadeghbarati, Jmenache, 010265mohamadazat, jose1937JS, vahidalvandi, njosueofficol, krishangopalgupta, and 4 more reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-c7973e" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (3): gaearon, 12:23PM on October 22, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">3</span> </button> <tool-tip id="tooltip-8dd574b9-9aa5-4e08-8d09-1228b10df718" for="reactions--reaction_button_component-c7973e" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">dream2023, chris6090, and ikhtearalamshawonmollah54321 reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-57fc9f" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (5): gaearon, 12:23PM on October 22, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">5</span> </button> <tool-tip id="tooltip-324c1ba0-e973-4960-87b3-cb07f7932b02" for="reactions--reaction_button_component-57fc9f" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">zereight, sadeghbarati, kstejas, vkzkvkzk, and chris6090 reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="chris6090 and ikhtearalamshawonmollah54321 reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>2 reactions</span> </li> <li class="dropdown-item" aria-label="hoa00, farm16, ArthurIanb, joshkautz, vituchini, liuhaiyang1997, Schweinepriester, theoludwig, huynhdev24, njosueofficol, and 4 more reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>14 reactions</span> </li> <li class="dropdown-item" aria-label="chris6090 and ikhtearalamshawonmollah54321 reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>2 reactions</span> </li> <li class="dropdown-item" aria-label="SonNg2k, farzadrastgar, rex11458, sadeghbarati, Jmenache, 010265mohamadazat, jose1937JS, vahidalvandi, njosueofficol, krishangopalgupta, and 4 more reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>14 reactions</span> </li> <li class="dropdown-item" aria-label="dream2023, chris6090, and ikhtearalamshawonmollah54321 reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>3 reactions</span> </li> <li class="dropdown-item" aria-label="zereight, sadeghbarati, kstejas, vkzkvkzk, and chris6090 reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>5 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">29 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-178b9fbf"> <h2 class="sr-only" id="hd-178b9fbf">17.0.0 (October 20, 2020)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2020-10-20T20:45:11Z"> 20 Oct 20:45 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/810438?s=40&v=4" alt="@gaearon" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/gaearon/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/gaearon">gaearon</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v17.0.0" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v17.0.0 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/89b610969d70d788f8c9769e3fa5b0044f5737ab/hovercard" href="/facebook/react/commit/89b610969d70d788f8c9769e3fa5b0044f5737ab" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">89b6109</code></a> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-eccaccf8-b18a-11ef-9c13-a1713d909d0b"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-eccaccf8-b18a-11ef-9c13-a1713d909d0b"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE3LjAuMA==" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v17.0.0" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v17.0.0" data-view-component="true" class="Link--primary Link">17.0.0 (October 20, 2020)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><p>Today, we are releasing React 17!</p> <p><strong><a href="https://reactjs.org/blog/2020/10/20/react-v17.html" rel="nofollow">Learn more about React 17 and how to update to it on the official React blog.</a></strong></p> <h3>React</h3> <ul> <li>Add <code>react/jsx-runtime</code> and <code>react/jsx-dev-runtime</code> for the <a href="https://babeljs.io/blog/2020/03/16/7.9.0#a-new-jsx-transform-11154-https-githubcom-babel-babel-pull-11154" rel="nofollow">new JSX transform</a>. (<a href="https://github.com/lunaruan">@lunaruan</a> in <a href="https://github.com/facebook/react/pull/18299" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18299/hovercard">#18299</a>)</li> <li>Build component stacks from native error frames. (<a href="https://github.com/sebmarkbage">@sebmarkbage</a> in <a href="https://github.com/facebook/react/pull/18561" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18561/hovercard">#18561</a>)</li> <li>Allow to specify <code>displayName</code> on context for improved stacks. (<a href="https://github.com/eps1lon">@eps1lon</a> in <a href="https://github.com/facebook/react/pull/18224" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18224/hovercard">#18224</a>)</li> <li>Prevent <code>'use strict'</code> from leaking in the UMD bundles. (<a href="https://github.com/koba04">@koba04</a> in <a href="https://github.com/facebook/react/pull/19614" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19614/hovercard">#19614</a>)</li> <li>Stop using <code>fb.me</code> for redirects. (<a href="https://github.com/cylim">@cylim</a> in <a href="https://github.com/facebook/react/pull/19598" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19598/hovercard">#19598</a>)</li> </ul> <h3>React DOM</h3> <ul> <li>Delegate events to roots instead of <code>document</code>. (<a href="https://github.com/trueadm">@trueadm</a> in <a href="https://github.com/facebook/react/pull/18195" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18195/hovercard">#18195</a> and <a href="https://github.com/facebook/react/pulls?q=is%3Apr+author%3Atrueadm+modern+event+is%3Amerged">others</a>)</li> <li>Clean up all effects before running any next effects. (<a href="https://github.com/bvaughn">@bvaughn</a> in <a href="https://github.com/facebook/react/pull/17947" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17947/hovercard">#17947</a>)</li> <li>Run <code>useEffect</code> cleanup functions asynchronously. (<a href="https://github.com/bvaughn">@bvaughn</a> in <a href="https://github.com/facebook/react/pull/17925" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17925/hovercard">#17925</a>)</li> <li>Use browser <code>focusin</code> and <code>focusout</code> for <code>onFocus</code> and <code>onBlur</code>. (<a href="https://github.com/trueadm">@trueadm</a> in <a href="https://github.com/facebook/react/pull/19186" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19186/hovercard">#19186</a>)</li> <li>Make all <code>Capture</code> events use the browser capture phase. (<a href="https://github.com/trueadm">@trueadm</a> in <a href="https://github.com/facebook/react/pull/19221" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19221/hovercard">#19221</a>)</li> <li>Don't emulate bubbling of the <code>onScroll</code> event. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/19464" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19464/hovercard">#19464</a>)</li> <li>Throw if <code>forwardRef</code> or <code>memo</code> component returns <code>undefined</code>. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/19550" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19550/hovercard">#19550</a>)</li> <li>Remove event pooling. (<a href="https://github.com/trueadm">@trueadm</a> in <a href="https://github.com/facebook/react/pull/18969" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18969/hovercard">#18969</a>)</li> <li>Stop exposing internals that won’t be needed by React Native Web. (<a href="https://github.com/necolas">@necolas</a> in <a href="https://github.com/facebook/react/pull/18483" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18483/hovercard">#18483</a>)</li> <li>Attach all known event listeners when the root mounts. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/19659" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19659/hovercard">#19659</a>)</li> <li>Disable <code>console</code> in the second render pass of DEV mode double render. (<a href="https://github.com/sebmarkbage">@sebmarkbage</a> in <a href="https://github.com/facebook/react/pull/18547" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18547/hovercard">#18547</a>)</li> <li>Deprecate the undocumented and misleading <code>ReactTestUtils.SimulateNative</code> API. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/13407" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/13407/hovercard">#13407</a>)</li> <li>Rename private field names used in the internals. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/18377" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18377/hovercard">#18377</a>)</li> <li>Don't call User Timing API in development. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/18417" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18417/hovercard">#18417</a>)</li> <li>Disable console during the repeated render in Strict Mode. (<a href="https://github.com/sebmarkbage">@sebmarkbage</a> in <a href="https://github.com/facebook/react/pull/18547" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18547/hovercard">#18547</a>)</li> <li>In Strict Mode, double-render components without Hooks too. (<a href="https://github.com/eps1lon">@eps1lon</a> in <a href="https://github.com/facebook/react/pull/18430" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18430/hovercard">#18430</a>)</li> <li>Allow calling <code>ReactDOM.flushSync</code> during lifecycle methods (but warn). (<a href="https://github.com/sebmarkbage">@sebmarkbage</a> in <a href="https://github.com/facebook/react/pull/18759" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18759/hovercard">#18759</a>)</li> <li>Add the <code>code</code> property to the keyboard event objects. (<a href="https://github.com/bl00mber">@bl00mber</a> in <a href="https://github.com/facebook/react/pull/18287" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18287/hovercard">#18287</a>)</li> <li>Add the <code>disableRemotePlayback</code> property for <code>video</code> elements. (<a href="https://github.com/tombrowndev">@tombrowndev</a> in <a href="https://github.com/facebook/react/pull/18619" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18619/hovercard">#18619</a>)</li> <li>Add the <code>enterKeyHint</code> property for <code>input</code> elements. (<a href="https://github.com/eps1lon">@eps1lon</a> in <a href="https://github.com/facebook/react/pull/18634" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18634/hovercard">#18634</a>)</li> <li>Warn when no <code>value</code> is provided to <code><Context.Provider></code>. (<a href="https://github.com/charlie1404">@charlie1404</a> in <a href="https://github.com/facebook/react/pull/19054" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19054/hovercard">#19054</a>)</li> <li>Warn when <code>memo</code> or <code>forwardRef</code> components return <code>undefined</code>. (<a href="https://github.com/bvaughn">@bvaughn</a> in <a href="https://github.com/facebook/react/pull/19550" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19550/hovercard">#19550</a>)</li> <li>Improve the error message for invalid updates. (<a href="https://github.com/JoviDeCroock">@JoviDeCroock</a> in <a href="https://github.com/facebook/react/pull/18316" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18316/hovercard">#18316</a>)</li> <li>Exclude forwardRef and memo from stack frames. (<a href="https://github.com/sebmarkbage">@sebmarkbage</a> in <a href="https://github.com/facebook/react/pull/18559" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18559/hovercard">#18559</a>)</li> <li>Improve the error message when switching between controlled and uncontrolled inputs. (<a href="https://github.com/vcarl">@vcarl</a> in <a href="https://github.com/facebook/react/pull/17070" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17070/hovercard">#17070</a>)</li> <li>Keep <code>onTouchStart</code>, <code>onTouchMove</code>, and <code>onWheel</code> passive. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/19654" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19654/hovercard">#19654</a>)</li> <li>Fix <code>setState</code> hanging in development inside a closed iframe. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/19220" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19220/hovercard">#19220</a>)</li> <li>Fix rendering bailout for lazy components with <code>defaultProps</code>. (<a href="https://github.com/jddxf">@jddxf</a> in <a href="https://github.com/facebook/react/pull/18539" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18539/hovercard">#18539</a>)</li> <li>Fix a false positive warning when <code>dangerouslySetInnerHTML</code> is <code>undefined</code>. (<a href="https://github.com/eps1lon">@eps1lon</a> in <a href="https://github.com/facebook/react/pull/18676" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18676/hovercard">#18676</a>)</li> <li>Fix Test Utils with non-standard <code>require</code> implementation. (<a href="https://github.com/just-boris">@just-boris</a> in <a href="https://github.com/facebook/react/pull/18632" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18632/hovercard">#18632</a>)</li> <li>Fix <code>onBeforeInput</code> reporting an incorrect <code>event.type</code>. (<a href="https://github.com/eps1lon">@eps1lon</a> in <a href="https://github.com/facebook/react/pull/19561" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19561/hovercard">#19561</a>)</li> <li>Fix <code>event.relatedTarget</code> reported as <code>undefined</code> in Firefox. (<a href="https://github.com/claytercek">@claytercek</a> in <a href="https://github.com/facebook/react/pull/19607" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19607/hovercard">#19607</a>)</li> <li>Fix "unspecified error" in IE11. (<a href="https://github.com/hemakshis">@hemakshis</a> in <a href="https://github.com/facebook/react/pull/19664" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19664/hovercard">#19664</a>)</li> <li>Fix rendering into a shadow root. (<a href="https://github.com/Jack-Works">@Jack-Works</a> in <a href="https://github.com/facebook/react/pull/15894" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/15894/hovercard">#15894</a>)</li> <li>Fix <code>movementX/Y</code> polyfill with capture events. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/19672" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19672/hovercard">#19672</a>)</li> <li>Use delegation for <code>onSubmit</code> and <code>onReset</code> events. (<a href="https://github.com/gaearon">@gaearon</a> in <a href="https://github.com/facebook/react/pull/19333" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19333/hovercard">#19333</a>)</li> <li>Improve memory usage. (<a href="https://github.com/trueadm">@trueadm</a> in <a href="https://github.com/facebook/react/pull/18970" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18970/hovercard">#18970</a>)</li> </ul> <h3>React DOM Server</h3> <ul> <li>Make <code>useCallback</code> behavior consistent with <code>useMemo</code> for the server renderer. (<a href="https://github.com/alexmckenley">@alexmckenley</a> in <a href="https://github.com/facebook/react/pull/18783" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18783/hovercard">#18783</a>)</li> <li>Fix state leaking when a function component throws. (<a href="https://github.com/pmaccart">@pmaccart</a> in <a href="https://github.com/facebook/react/pull/19212" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19212/hovercard">#19212</a>)</li> </ul> <h3>React Test Renderer</h3> <ul> <li>Improve <code>findByType</code> error message. (<a href="https://github.com/henryqdineen">@henryqdineen</a> in <a href="https://github.com/facebook/react/pull/17439" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17439/hovercard">#17439</a>)</li> </ul> <h3>Concurrent Mode (Experimental)</h3> <ul> <li>Revamp the priority batching heuristics. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/18796" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18796/hovercard">#18796</a>)</li> <li>Add the <code>unstable_</code> prefix before the experimental APIs. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/18825" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18825/hovercard">#18825</a>)</li> <li>Remove <code>unstable_discreteUpdates</code> and <code>unstable_flushDiscreteUpdates</code>. (<a href="https://github.com/trueadm">@trueadm</a> in <a href="https://github.com/facebook/react/pull/18825" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18825/hovercard">#18825</a>)</li> <li>Remove the <code>timeoutMs</code> argument. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/19703" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19703/hovercard">#19703</a>)</li> <li>Disable <code><div hidden /></code> prerendering in favor of a different future API. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/18917" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18917/hovercard">#18917</a>)</li> <li>Add <code>unstable_expectedLoadTime</code> to Suspense for CPU-bound trees. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/19936" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19936/hovercard">#19936</a>)</li> <li>Add an experimental <code>unstable_useOpaqueIdentifier</code> Hook. (<a href="https://github.com/lunaruan">@lunaruan</a> in <a href="https://github.com/facebook/react/pull/17322" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17322/hovercard">#17322</a>)</li> <li>Add an experimental <code>unstable_startTransition</code> API. (<a href="https://github.com/rickhanlonii">@rickhanlonii</a> in <a href="https://github.com/facebook/react/pull/19696" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19696/hovercard">#19696</a>)</li> <li>Using <code>act</code> in the test renderer no longer flushes Suspense fallbacks. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/18596" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18596/hovercard">#18596</a>)</li> <li>Use global render timeout for CPU Suspense. (<a href="https://github.com/sebmarkbage">@sebmarkbage</a> in <a href="https://github.com/facebook/react/pull/19643" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/19643/hovercard">#19643</a>)</li> <li>Clear the existing root content before mounting. (<a href="https://github.com/bvaughn">@bvaughn</a> in <a href="https://github.com/facebook/react/pull/18730" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18730/hovercard">#18730</a>)</li> <li>Fix a bug with error boundaries. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/18265" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18265/hovercard">#18265</a>)</li> <li>Fix a bug causing dropped updates in a suspended tree. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/18384" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18384/hovercard">#18384</a> and <a href="https://github.com/facebook/react/pull/18457" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18457/hovercard">#18457</a>)</li> <li>Fix a bug causing dropped render phase updates. (<a href="https://github.com/acdlite">@acdlite</a> in <a href="https://github.com/facebook/react/pull/18537" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18537/hovercard">#18537</a>)</li> <li>Fix a bug in Suspens...</li> </ul></div> <a href="/facebook/react/releases/tag/v17.0.0" data-view-component="true" class="Link">Read more</a> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v17.0.0" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="cCxTr73gdM55ZWnmF_IOPsmAo4BjmyyFxdEqIhNKbXFXuffhsZZI6IX61cDw5hWeI1nvDxxEbSD9P6ECCXP-jA" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="MDc6UmVsZWFzZTMyODMzMDY0"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-41c963" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (21): gaearon, 08:33PM on October 20, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">21</span> </button> <tool-tip id="tooltip-01cff6a5-9212-463f-95a3-cca677c519ae" for="reactions--reaction_button_component-41c963" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">kwiniarski97, eduardo-fernandes-marques, andriyor, sadeghbarati, bulabulaka, Jmenache, lucas-dolsan, yusoofsh, HazemKhaled, jamesalmeida, and 11 more reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-41d332" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (2): gaearon, 08:33PM on October 20, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">2</span> </button> <tool-tip id="tooltip-f98d7a0c-0ddb-4c53-ae60-fe28678e8f1f" for="reactions--reaction_button_component-41d332" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">subham007-coder and lin72h reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-adadf1" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (7): gaearon, 08:33PM on October 20, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">7</span> </button> <tool-tip id="tooltip-16fb070d-3c0d-41c3-bf2d-85379f9d76d4" for="reactions--reaction_button_component-adadf1" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">perseus98, hansfpc, Shubhamsharma585, kyuhyunIm, chris6090, lin72h, and ikhtearalamshawonmollah54321 reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-479440" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (9): gaearon, 08:33PM on October 20, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">9</span> </button> <tool-tip id="tooltip-eb33f8b0-f3ee-472f-afe6-5bbe37ed2d08" for="reactions--reaction_button_component-479440" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">0xping, gonzalovazquez, theenadayalan-byjus, hansfpc, Shubhamsharma585, kyuhyunIm, chris6090, lin72h, and ikhtearalamshawonmollah54321 reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-56ca96" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (8): gaearon, 08:33PM on October 20, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">8</span> </button> <tool-tip id="tooltip-37ff8385-16cf-4c62-9009-da64c0fd12db" for="reactions--reaction_button_component-56ca96" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">duzitug, hansfpc, gokul-pathak, Shubhamsharma585, kyuhyunIm, chris6090, lin72h, and ikhtearalamshawonmollah54321 reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-fef687" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (5): gaearon, 08:33PM on October 20, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">5</span> </button> <tool-tip id="tooltip-a3541ce9-9a23-4dc9-b9e0-8ae7e08b2ec1" for="reactions--reaction_button_component-fef687" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">huynhdev24, Shubhamsharma585, kyuhyunIm, Arnavdons, and chris6090 reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="kwiniarski97, eduardo-fernandes-marques, andriyor, sadeghbarati, bulabulaka, Jmenache, lucas-dolsan, yusoofsh, HazemKhaled, jamesalmeida, and 11 more reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>21 reactions</span> </li> <li class="dropdown-item" aria-label="subham007-coder and lin72h reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>2 reactions</span> </li> <li class="dropdown-item" aria-label="perseus98, hansfpc, Shubhamsharma585, kyuhyunIm, chris6090, lin72h, and ikhtearalamshawonmollah54321 reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>7 reactions</span> </li> <li class="dropdown-item" aria-label="0xping, gonzalovazquez, theenadayalan-byjus, hansfpc, Shubhamsharma585, kyuhyunIm, chris6090, lin72h, and ikhtearalamshawonmollah54321 reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>9 reactions</span> </li> <li class="dropdown-item" aria-label="duzitug, hansfpc, gokul-pathak, Shubhamsharma585, kyuhyunIm, chris6090, lin72h, and ikhtearalamshawonmollah54321 reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>8 reactions</span> </li> <li class="dropdown-item" aria-label="huynhdev24, Shubhamsharma585, kyuhyunIm, Arnavdons, and chris6090 reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>5 reactions</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">29 people reacted</div> </div> </div> </div> </div></div> </div> </section> <section aria-labelledby="hd-7c744c88"> <h2 class="sr-only" id="hd-7c744c88">16.14.0 (October 14, 2020)</h2> <div class="d-flex flex-column flex-md-row my-5 flex-justify-center"> <div class="col-md-2 d-flex flex-md-column flex-row flex-wrap pr-md-6 mb-2 mb-md-0 flex-items-start pt-md-4"> <div class="mb-2 f4 mr-3 mr-md-0 col-12 pt-1 pt-sm-0"> <relative-time class="no-wrap" prefix="" datetime="2020-10-14T19:58:32Z"> 14 Oct 19:58 </relative-time> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <img src="https://avatars.githubusercontent.com/u/810438?s=40&v=4" alt="@gaearon" size="20" height="20" width="20" data-view-component="true" class="avatar avatar-small circle" /> <a class="color-fg-muted wb-break-all" data-hovercard-type="user" data-hovercard-url="/users/gaearon/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/gaearon">gaearon</a> </div> <div class="mr-3 mr-md-0 d-flex pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/facebook/react/tree/v16.14.0" data-view-component="true" class="Link Link--muted"> <div data-view-component="true" class="css-truncate css-truncate-target"> <svg aria-label="Tag" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span class="ml-1 wb-break-all"> v16.14.0 </span> </div></a> </div> <div style="position: relative; top: 1px;" class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a data-hovercard-type="commit" data-hovercard-url="/facebook/react/commit/4337c1c00609ec8d7ae399c736e9d37bb159fac5/hovercard" href="/facebook/react/commit/4337c1c00609ec8d7ae399c736e9d37bb159fac5" data-view-component="true" class="Link Link--muted mb-2"> <svg aria-label="Commit" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-commit"> <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> </svg> <code class="f5 ml-1 wb-break-all">4337c1c</code></a> </div> <div class="mb-md-2 mr-3 mr-md-0 pt-1 pt-sm-0"> <details class="details-reset details-overlay " id="tag-select-menu-ecd3f18e-b18a-11ef-866d-bb637fbc2b02"> <summary data-view-component="true" class="btn-sm btn text-left"> <i></i><span data-menu-button="">Compare</span><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-triangle-down ml-2 mr-n1"> <path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path> </svg> </summary> <details-menu class="SelectMenu text-md-left " style="z-index: 500"> <div class="SelectMenu-modal"> <header class="SelectMenu-header"> <span class="SelectMenu-title">Choose a tag to compare</span> <button class="SelectMenu-closeButton" type="button" data-toggle-for="tag-select-menu-ecd3f18e-b18a-11ef-866d-bb637fbc2b02"> <svg aria-label="Close menu" aria-hidden="false" role="img" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> </header> <div class="SelectMenu-filter"> <input aria-label="Find a tag" autofocus class="SelectMenu-input form-control" data-ref-filter placeholder="Find a tag" type="text" > </div> <ref-selector type="tag" query-endpoint="/facebook/react/refs" cache-key="v0:1733174867.0" current-committish="djE2LjE0LjA=" default-branch="bWFpbg==" name-with-owner="ZmFjZWJvb2svcmVhY3Q=" prefetch-on-mouseover > <template data-target="ref-selector.fetchFailedTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Could not load tags</div> </template> <template data-target="ref-selector.noMatchTemplate"> <div class="SelectMenu-message" data-index="{{ index }}">Nothing to show</div> </template> <template data-target="ref-selector.itemTemplate"> <a href="/facebook/react/compare/{{ urlEncodedRefName }}...v16.14.0" class="SelectMenu-item" role="menuitemradio" rel="nofollow" aria-checked="{{ isCurrent }}" data-index="{{ index }}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check SelectMenu-icon SelectMenu-icon--check"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> <span class="flex-1 css-truncate css-truncate-overflow {{ isFilteringClass }}">{{ refName }}</span> <span hidden="{{ isNotDefault }}" class="Label Label--secondary flex-self-start">default</span> </a> </template> <template data-target="ref-selector.hiddenCurrentItemTemplate"> <input hidden="hidden" type="radio" value="{{ refName }}" checked="checked" name="" id="" /> </template> <div data-target="ref-selector.listContainer" role="menu" class="SelectMenu-list" style="max-height: 330px"> <div class="SelectMenu-loading pt-3 pb-0 overflow-hidden"> <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </div> </div> <footer class="SelectMenu-footer"><a href="/facebook/react/tags">View all tags</a></footer> </ref-selector> </div> </details-menu> </details> </div> </div> <div class="col-md-9" > <div data-view-component="true" class="Box"> <div data-view-component="true" class="Box-body"> <div class="d-flex flex-md-row flex-column"> <div class="d-flex flex-row flex-1 mb-3 wb-break-word"> <div class="flex-1" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <span data-view-component="true" class="f1 text-bold d-inline mr-3"><a href="/facebook/react/releases/tag/v16.14.0" data-view-component="true" class="Link--primary Link">16.14.0 (October 14, 2020)</a></span> <span> <div class="ml-2 d-none d-md-inline"> </div> </span> </div> <div class="mt-3 ml-2 d-md-none"> </div> <div class="ml-2 mt-3 d-md-none"> </div> </div> <div class="d-flex mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> </div> </div> <div data-pjax="true" data-test-selector="body-content" data-view-component="true" class="markdown-body my-3"><h3>React</h3> <ul> <li>Add support for the <a href="https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html" rel="nofollow">new JSX transform</a>. (<a href="https://github.com/lunaruan">@lunaruan</a> in <a href="https://github.com/facebook/react/pull/18299" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18299/hovercard">#18299</a>)</li> </ul></div> </div> <div data-view-component="true" class="Box-footer"> <div class="mb-3"> <details data-view-component="true"> <summary role="button" data-view-component="true"> <span data-view-component="true" class="f3 text-bold d-inline mr-3">Assets</span> <span title="2" data-view-component="true" class="Counter ml-1">2</span> </summary> <div data-view-component="true"> <include-fragment loading="lazy" src="https://github.com/facebook/react/releases/expanded_assets/v16.14.0" > <span data-view-component="true"> <svg style="box-sizing: content-box; color: var(--color-icon-primary);" width="32" height="32" viewBox="0 0 16 16" fill="none" aria-hidden="true" data-view-component="true" class="anim-rotate"> <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" fill="none" /> <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" /> </svg> <span class="sr-only">Loading</span> </span> </include-fragment> </div> </details> </div> <div class="d-flex flex-row flex-wrap flex-justify-between js-comment"> <div data-view-component="true" class="comment-reactions js-reactions-container js-reaction-buttons-container social-reactions reactions-container has-reactions d-flex"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form class="js-pick-reaction" data-turbo="false" action="/facebook/react/reactions" accept-charset="UTF-8" method="post"><input type="hidden" name="_method" value="put" autocomplete="off" /><input type="hidden" name="authenticity_token" value="45oShrsU06P_FkI1XrzFEOe8IzPA_m7NvWyk8ZTpREDED7bIt2LvhQOJ_hO5qN6wDWVvvL8hL2iFgi_RjtDXvQ" autocomplete="off" /> <input type="hidden" name="input[subjectId]" value="MDc6UmVsZWFzZTMyNTgyODYw"> <div class="js-comment-reactions-options d-flex flex-items-center flex-row flex-wrap"> <button name="input[content]" id="reactions--reaction_button_component-782b4b" value="THUMBS_UP react" data-button-index-position="0" data-reaction-label="+1" data-reaction-content="+1" aria-pressed="false" aria-label="thumbs up (11): gaearon, 07:32PM on October 14, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji">👍</g-emoji> <span class="js-discussion-reaction-group-count">11</span> </button> <tool-tip id="tooltip-64c06c51-908f-44e7-b74e-de0a1b99320a" for="reactions--reaction_button_component-782b4b" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">joshkautz, ZTT820, Old-Rain, tt-xiaofang, Daweed234, chris6090, euashish, AkashARakash, danmaster01, Hariomkabra, and ikhtearalamshawonmollah54321 reacted with thumbs up emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-e535b7" value="LAUGH react" data-button-index-position="2" data-reaction-label="Laugh" data-reaction-content="smile" aria-pressed="false" aria-label="laugh (1): gaearon, 07:32PM on October 14, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji">😄</g-emoji> <span class="js-discussion-reaction-group-count">1</span> </button> <tool-tip id="tooltip-97380df2-8b63-4012-93d6-4b1f4c33062b" for="reactions--reaction_button_component-e535b7" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">subham007-coder reacted with laugh emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-31af21" value="HOORAY react" data-button-index-position="3" data-reaction-label="Hooray" data-reaction-content="tada" aria-pressed="false" aria-label="hooray (3): gaearon, 07:32PM on October 14, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji">🎉</g-emoji> <span class="js-discussion-reaction-group-count">3</span> </button> <tool-tip id="tooltip-9a56bd38-d75b-4bef-a893-8b04935d8f2c" for="reactions--reaction_button_component-31af21" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">Daweed234, chris6090, and ikhtearalamshawonmollah54321 reacted with hooray emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-72cf9d" value="HEART react" data-button-index-position="5" data-reaction-label="Heart" data-reaction-content="heart" aria-pressed="false" aria-label="heart (3): gaearon, 07:32PM on October 14, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji">❤️</g-emoji> <span class="js-discussion-reaction-group-count">3</span> </button> <tool-tip id="tooltip-72c65e3c-d3ad-45dd-93c7-6f87bf96b2a9" for="reactions--reaction_button_component-72cf9d" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">huynhdev24, chris6090, and ikhtearalamshawonmollah54321 reacted with heart emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-5a8df9" value="ROCKET react" data-button-index-position="6" data-reaction-label="Rocket" data-reaction-content="rocket" aria-pressed="false" aria-label="rocket (2): gaearon, 07:32PM on October 14, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji">🚀</g-emoji> <span class="js-discussion-reaction-group-count">2</span> </button> <tool-tip id="tooltip-a3b289cc-76c6-44ec-9f8a-0ef96aeae03d" for="reactions--reaction_button_component-5a8df9" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">chris6090 and ikhtearalamshawonmollah54321 reacted with rocket emoji</tool-tip> <button name="input[content]" id="reactions--reaction_button_component-680502" value="EYES react" data-button-index-position="7" data-reaction-label="Eyes" data-reaction-content="eyes" aria-pressed="false" aria-label="eyes (1): gaearon, 07:32PM on October 14, 2020" type="submit" disabled="disabled" data-view-component="true" class="social-reaction-summary-item js-reaction-group-button btn-link d-flex no-underline color-fg-muted flex-items-baseline mr-2"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji">👀</g-emoji> <span class="js-discussion-reaction-group-count">1</span> </button> <tool-tip id="tooltip-655a3b10-c4fb-4b19-92ac-1c3a4aee5f46" for="reactions--reaction_button_component-680502" popover="manual" data-direction="n" data-type="description" data-view-component="true" class="sr-only position-absolute">EPJ-suporte2-dev reacted with eyes emoji</tool-tip> <div class="js-reactions-container"> <details class="dropdown details-reset details-overlay d-inline-block js-all-reactions-popover" hidden> <summary aria-haspopup="true" data-view-component="true" class="Button--link Button--medium Button"> <span class="Button-content"> <span class="Button-label">All reactions</span> </span> </summary> <ul class="dropdown-menu dropdown-menu-se"> <li class="dropdown-item" aria-label="joshkautz, ZTT820, Old-Rain, tt-xiaofang, Daweed234, chris6090, euashish, AkashARakash, danmaster01, Hariomkabra, and ikhtearalamshawonmollah54321 reacted with thumbs up emoji"> <g-emoji alias="+1" fallback-src="https://github.githubassets.com/assets/1f44d-41cb66fe1e22.png" class="social-button-emoji mr-2">👍</g-emoji> <span>11 reactions</span> </li> <li class="dropdown-item" aria-label="subham007-coder reacted with laugh emoji"> <g-emoji alias="smile" fallback-src="https://github.githubassets.com/assets/1f604-7528822fb4c5.png" class="social-button-emoji mr-2">😄</g-emoji> <span>1 reaction</span> </li> <li class="dropdown-item" aria-label="Daweed234, chris6090, and ikhtearalamshawonmollah54321 reacted with hooray emoji"> <g-emoji alias="tada" fallback-src="https://github.githubassets.com/assets/1f389-36899a2cb781.png" class="social-button-emoji mr-2">🎉</g-emoji> <span>3 reactions</span> </li> <li class="dropdown-item" aria-label="huynhdev24, chris6090, and ikhtearalamshawonmollah54321 reacted with heart emoji"> <g-emoji alias="heart" fallback-src="https://github.githubassets.com/assets/2764-982dc91ea48a.png" class="social-button-emoji mr-2">❤️</g-emoji> <span>3 reactions</span> </li> <li class="dropdown-item" aria-label="chris6090 and ikhtearalamshawonmollah54321 reacted with rocket emoji"> <g-emoji alias="rocket" fallback-src="https://github.githubassets.com/assets/1f680-d0ef47fdb515.png" class="social-button-emoji mr-2">🚀</g-emoji> <span>2 reactions</span> </li> <li class="dropdown-item" aria-label="EPJ-suporte2-dev reacted with eyes emoji"> <g-emoji alias="eyes" fallback-src="https://github.githubassets.com/assets/1f440-ee44e91e92a7.png" class="social-button-emoji mr-2">👀</g-emoji> <span>1 reaction</span> </li> </ul> </details> </div> </div> </form> <div data-view-component="true" class="color-fg-muted mt-1">14 people reacted</div> </div> </div> </div> </div></div> </div> </section> <div class="paginate-container d-none d-sm-flex flex-sm-justify-center" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <div role="navigation" aria-label="Pagination" class="pagination"><span class="previous_page disabled" aria-label="Previous page">Previous</span> <em class="current" aria-label="Page 1" aria-current="page">1</em> <a rel="next" aria-label="Page 2" href="/facebook/react/releases?page=2">2</a> <a aria-label="Page 3" href="/facebook/react/releases?page=3">3</a> <a aria-label="Page 4" href="/facebook/react/releases?page=4">4</a> <a aria-label="Page 5" href="/facebook/react/releases?page=5">5</a> <span class="gap">…</span> <a aria-label="Page 10" href="/facebook/react/releases?page=10">10</a> <a aria-label="Page 11" href="/facebook/react/releases?page=11">11</a> <a class="next_page" aria-label="Next page" rel="next" href="/facebook/react/releases?page=2">Next</a></div> </div> <div class="paginate-container d-sm-none mb-5" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <div role="navigation" aria-label="Pagination" class="pagination"><span class="previous_page disabled" aria-label="Previous page">Previous</span> <a class="next_page" aria-label="Next page" rel="next" href="/facebook/react/releases?page=2">Next</a></div> </div> </div> </div> </div> </turbo-frame> </main> </div> </div> <footer class="footer pt-8 pb-6 f6 color-fg-muted p-responsive" role="contentinfo" > <h2 class='sr-only'>Footer</h2> <div class="d-flex flex-justify-center flex-items-center flex-column-reverse flex-lg-row flex-wrap flex-lg-nowrap"> <div class="d-flex flex-items-center flex-shrink-0 mx-2"> <a aria-label="Homepage" title="GitHub" class="footer-octicon mr-2" href="https://github.com"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-mark-github"> <path d="M12.5.75C6.146.75 1 5.896 1 12.25c0 5.089 3.292 9.387 7.863 10.91.575.101.79-.244.79-.546 0-.273-.014-1.178-.014-2.142-2.889.532-3.636-.704-3.866-1.35-.13-.331-.69-1.352-1.18-1.625-.402-.216-.977-.748-.014-.762.906-.014 1.553.834 1.769 1.179 1.035 1.74 2.688 1.25 3.349.948.1-.747.402-1.25.733-1.538-2.559-.287-5.232-1.279-5.232-5.678 0-1.25.445-2.285 1.178-3.09-.115-.288-.517-1.467.115-3.048 0 0 .963-.302 3.163 1.179.92-.259 1.897-.388 2.875-.388.977 0 1.955.13 2.875.388 2.2-1.495 3.162-1.179 3.162-1.179.633 1.581.23 2.76.115 3.048.733.805 1.179 1.825 1.179 3.09 0 4.413-2.688 5.39-5.247 5.678.417.36.776 1.05.776 2.128 0 1.538-.014 2.774-.014 3.162 0 .302.216.662.79.547C20.709 21.637 24 17.324 24 12.25 24 5.896 18.854.75 12.5.75Z"></path> </svg> </a> <span> © 2024 GitHub, Inc. </span> </div> <nav aria-label="Footer"> <h3 class="sr-only" id="sr-footer-heading">Footer navigation</h3> <ul class="list-style-none d-flex flex-justify-center flex-wrap mb-2 mb-lg-0" aria-labelledby="sr-footer-heading"> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to Terms","label":"text:terms"}" href="https://docs.github.com/site-policy/github-terms/github-terms-of-service" data-view-component="true" class="Link--secondary Link">Terms</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to privacy","label":"text:privacy"}" href="https://docs.github.com/site-policy/privacy-policies/github-privacy-statement" data-view-component="true" class="Link--secondary Link">Privacy</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to security","label":"text:security"}" href="https://github.com/security" data-view-component="true" class="Link--secondary Link">Security</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to status","label":"text:status"}" href="https://www.githubstatus.com/" data-view-component="true" class="Link--secondary Link">Status</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to docs","label":"text:docs"}" href="https://docs.github.com/" data-view-component="true" class="Link--secondary Link">Docs</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to contact","label":"text:contact"}" href="https://support.github.com?tags=dotcom-footer" data-view-component="true" class="Link--secondary Link">Contact</a> </li> <li class="mx-2" > <cookie-consent-link> <button type="button" class="Link--secondary underline-on-hover border-0 p-0 color-bg-transparent" data-action="click:cookie-consent-link#showConsentManagement" data-analytics-event="{"location":"footer","action":"cookies","context":"subfooter","tag":"link","label":"cookies_link_subfooter_footer"}" > Manage cookies </button> </cookie-consent-link> </li> <li class="mx-2"> <cookie-consent-link> <button type="button" class="Link--secondary underline-on-hover border-0 p-0 color-bg-transparent" data-action="click:cookie-consent-link#showConsentManagement" data-analytics-event="{"location":"footer","action":"dont_share_info","context":"subfooter","tag":"link","label":"dont_share_info_link_subfooter_footer"}" > Do not share my personal information </button> </cookie-consent-link> </li> </ul> </nav> </div> </footer> <ghcc-consent id="ghcc" class="position-fixed bottom-0 left-0" style="z-index: 999999" data-initial-cookie-consent-allowed="" data-cookie-consent-required="false"></ghcc-consent> <div id="ajax-error-message" class="ajax-error-message flash flash-error" hidden> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-alert"> <path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <button type="button" class="flash-close js-ajax-error-dismiss" aria-label="Dismiss error"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> You can’t perform that action at this time. </div> <template id="site-details-dialog"> <details class="details-reset details-overlay details-overlay-dark lh-default color-fg-default hx_rsm" open> <summary role="button" aria-label="Close dialog"></summary> <details-dialog class="Box Box--overlay d-flex flex-column anim-fade-in fast hx_rsm-dialog hx_rsm-modal"> <button class="Box-btn-octicon m-0 btn-octicon position-absolute right-0 top-0" type="button" aria-label="Close dialog" data-close-dialog> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> <div class="octocat-spinner my-6 js-details-dialog-spinner"></div> </details-dialog> </details> </template> <div class="Popover js-hovercard-content position-absolute" style="display: none; outline: none;"> <div class="Popover-message Popover-message--bottom-left Popover-message--large Box color-shadow-large" style="width:360px;"> </div> </div> <template id="snippet-clipboard-copy-button"> <div class="zeroclipboard-container position-absolute right-0 top-0"> <clipboard-copy aria-label="Copy" class="ClipboardButton btn js-clipboard-copy m-2 p-0" data-copy-feedback="Copied!" data-tooltip-direction="w"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy js-clipboard-copy-icon m-2"> <path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"></path><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check js-clipboard-check-icon color-fg-success d-none m-2"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </clipboard-copy> </div> </template> <template id="snippet-clipboard-copy-button-unpositioned"> <div class="zeroclipboard-container"> <clipboard-copy aria-label="Copy" class="ClipboardButton btn btn-invisible js-clipboard-copy m-2 p-0 d-flex flex-justify-center flex-items-center" data-copy-feedback="Copied!" data-tooltip-direction="w"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy js-clipboard-copy-icon"> <path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"></path><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check js-clipboard-check-icon color-fg-success d-none"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </clipboard-copy> </div> </template> </div> <div id="js-global-screen-reader-notice" class="sr-only mt-n1" aria-live="polite" aria-atomic="true" ></div> <div id="js-global-screen-reader-notice-assertive" class="sr-only mt-n1" aria-live="assertive" aria-atomic="true"></div> </body> </html>