-
Notifications
You must be signed in to change notification settings - Fork 33
/
Copy pathindex.html
5 lines (5 loc) · 49.7 KB
/
index.html
1
2
3
4
5
<!DOCTYPE html><html><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="ie=edge"/><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/><meta name="generator" content="Gatsby 2.0.72"/><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossOrigin="anonymous"/><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/solid.css" integrity="sha384-wnAC7ln+XN0UKdcPvJvtqIH3jOjs9pnKnq9qX68ImXvOGz2JuFoEiCjT8jyZQX2z" crossOrigin="anonymous"/><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/brands.css" integrity="sha384-nT8r1Kzllf71iZl81CdFzObMsaLOhqBU1JD2+XoAALbdtWaXDOlWOZTR4v1ktjPE" crossOrigin="anonymous"/><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/fontawesome.css" integrity="sha384-HbmWTHay9psM8qyzEKPc8odH4DsOuzdejtnr+OFtDmOcIVnhgReQ4GZBH7uwcjf6" crossOrigin="anonymous"/><link as="script" rel="preload" href="/component---src-pages-migrating-mdx-59886e834c5949c57443.js"/><link as="script" rel="preload" href="/1-0eb4f4b7f1c6415fff83.js"/><link as="script" rel="preload" href="/0-b247a513b06e4324b9e7.js"/><link as="script" rel="preload" href="/app-6b3dac389d26abe96cf3.js"/><link as="script" rel="preload" href="/webpack-runtime-006d62a9de38d0cb672c.js"/><link as="fetch" rel="preload" href="/static/d/624/path---migrating-954-eb3-YV2xtnt8tPyAY05Un6wm26zkpgI.json" crossOrigin="use-credentials"/><style data-href="/app.8710604f6f1470c332bb.css">.searchbox{display:inline-block;position:relative;width:200px;height:32px!important;white-space:nowrap;box-sizing:border-box;visibility:visible!important}.searchbox .algolia-autocomplete{display:block;width:100%;height:100%}.searchbox__wrapper{width:100%;height:100%;z-index:999;position:relative}.searchbox__input{display:inline-block;box-sizing:border-box;transition:box-shadow .4s ease,background .4s ease;border:0;border-radius:16px;box-shadow:inset 0 0 0 1px #ccc;background:#fff!important;padding:0 26px 0 32px;width:100%;height:100%;vertical-align:middle;white-space:normal;font-size:12px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.searchbox__input::-webkit-search-cancel-button,.searchbox__input::-webkit-search-decoration,.searchbox__input::-webkit-search-results-button,.searchbox__input::-webkit-search-results-decoration{display:none}.searchbox__input:hover{box-shadow:inset 0 0 0 1px #b3b3b3}.searchbox__input:active,.searchbox__input:focus{outline:0;box-shadow:inset 0 0 0 1px #aaa;background:#fff}.searchbox__input::-webkit-input-placeholder{color:#aaa}.searchbox__input:-ms-input-placeholder{color:#aaa}.searchbox__input::-ms-input-placeholder{color:#aaa}.searchbox__input::placeholder{color:#aaa}.searchbox__submit{position:absolute;top:0;margin:0;border:0;border-radius:16px 0 0 16px;background-color:rgba(69,142,225,0);padding:0;width:32px;height:100%;vertical-align:middle;text-align:center;font-size:inherit;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;right:inherit;left:0}.searchbox__submit:before{display:inline-block;margin-right:-4px;height:100%;vertical-align:middle;content:""}.searchbox__submit:active,.searchbox__submit:hover{cursor:pointer}.searchbox__submit:focus{outline:0}.searchbox__submit svg{width:14px;height:14px;vertical-align:middle;fill:#6d7e96}.searchbox__reset{display:block;position:absolute;top:8px;right:8px;margin:0;border:0;background:none;cursor:pointer;padding:0;font-size:inherit;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;fill:rgba(0,0,0,.5)}.searchbox__reset.hide{display:none}.searchbox__reset:focus{outline:0}.searchbox__reset svg{display:block;margin:4px;width:8px;height:8px}.searchbox__input:valid~.searchbox__reset{display:block;-webkit-animation-name:sbx-reset-in;animation-name:sbx-reset-in;-webkit-animation-duration:.15s;animation-duration:.15s}@-webkit-keyframes sbx-reset-in{0%{-webkit-transform:translate3d(-20%,0,0);transform:translate3d(-20%,0,0);opacity:0}to{-webkit-transform:none;transform:none;opacity:1}}@keyframes sbx-reset-in{0%{-webkit-transform:translate3d(-20%,0,0);transform:translate3d(-20%,0,0);opacity:0}to{-webkit-transform:none;transform:none;opacity:1}}.algolia-autocomplete .ds-dropdown-menu{box-shadow:0 .5rem 1rem rgba(0,0,0,.175)}@media (min-width:601px){.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu{right:0!important;left:inherit!important}.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu:before{right:48px}.algolia-autocomplete .ds-dropdown-menu{top:-6px;border-radius:4px;margin:6px 0 0;padding:0;text-align:left;height:auto;position:relative;background:transparent;border:none;z-index:999;max-width:600px;min-width:500px}}.algolia-autocomplete{display:block!important;flex:1 1}@media (max-width:600px){.algolia-autocomplete .ds-dropdown-menu{z-index:100;position:fixed!important;top:40px!important;left:auto!important;right:1rem!important;width:600px;max-width:calc(100% - 2rem);max-height:calc(100% - 5rem);display:block}.algolia-autocomplete .ds-dropdown-menu:before{right:6rem}}.algolia-autocomplete .ds-dropdown-menu .ds-suggestions{position:relative;z-index:1000}.algolia-autocomplete .ds-dropdown-menu .ds-suggestion{cursor:pointer}.algolia-autocomplete .ds-dropdown-menu [class^=ds-dataset-]{position:relative;border-radius:4px;overflow:auto;padding:0}.algolia-autocomplete .ds-dropdown-menu *{box-sizing:border-box}.algolia-autocomplete .algolia-docsearch-suggestion{position:relative;padding:0;overflow:hidden}.algolia-autocomplete .ds-cursor .algolia-docsearch-suggestion--wrapper{background:#f1f1f1;box-shadow:inset -2px 0 0 #61dafb}.algolia-autocomplete .algolia-docsearch-suggestion--highlight{background:#ffe564;padding:.1em .05em}.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight,.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl1 .algolia-docsearch-suggestion--highlight{color:inherit;background:inherit}.algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight{padding:0 0 1px;background:inherit;box-shadow:inset 0 -2px 0 0 rgba(69,142,225,.8);color:inherit}.algolia-autocomplete .algolia-docsearch-suggestion--content{display:block;float:right;width:70%;position:relative;padding:5.33333px 0 5.33333px 10.66667px;cursor:pointer}.algolia-autocomplete .algolia-docsearch-suggestion--content:before{content:"";position:absolute;display:block;top:0;height:100%;width:1px;background:#ececec;left:-1px}.algolia-autocomplete .algolia-docsearch-suggestion--category-header{position:relative;display:none;font-size:14px;letter-spacing:.08em;font-weight:700;background-color:#373940;text-transform:uppercase;color:#fff;margin:0;padding:5px 8px}.algolia-autocomplete .algolia-docsearch-suggestion--wrapper{background-color:#fff;width:100%;float:left;padding:8px 0 0}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column{float:left;width:30%;display:none;text-align:right;position:relative;padding:5.33333px 10.66667px;color:#777;font-size:.9em;word-wrap:break-word}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column:before{content:"";position:absolute;display:block;top:0;height:100%;width:1px;background:#ececec;right:0}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column .algolia-docsearch-suggestion--highlight{background-color:inherit;color:inherit}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-inline{display:none}.algolia-autocomplete .algolia-docsearch-suggestion--title{margin-bottom:4px;color:#02060c;font-size:.9em;font-weight:700}.algolia-autocomplete .algolia-docsearch-suggestion--text{display:block;line-height:1.2em;font-size:.85em;color:#63676d;padding-right:2px}.algolia-autocomplete .algolia-docsearch-suggestion--no-results{width:100%;padding:8px 0;text-align:center;font-size:1.2em;background-color:#373940;margin-top:-8px}.algolia-autocomplete .algolia-docsearch-suggestion--no-results .algolia-docsearch-suggestion--text{color:#fff;margin-top:4px}.algolia-autocomplete .algolia-docsearch-suggestion--no-results:before{display:none}.algolia-autocomplete .algolia-docsearch-suggestion code{padding:1px 5px;font-size:90%;border:none;color:#222;background-color:#ebebeb;border-radius:3px;font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.algolia-autocomplete .algolia-docsearch-suggestion code .algolia-docsearch-suggestion--highlight{background:none}.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__main .algolia-docsearch-suggestion--category-header,.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__secondary .algolia-docsearch-suggestion--subcategory-column{display:block}.algolia-autocomplete .algolia-docsearch-footer{background-color:#fff;width:100%;height:30px;z-index:2000;float:right;font-size:0;line-height:0}.algolia-autocomplete .algolia-docsearch-footer--logo{background-image:url(http://github.com/'data:image/svg+xml;utf8,<svg%20xmlns="http://www.w3.org/2000/svg"%20viewBox="0%200%20130%2018"><defs><linearGradient%20id="a"%20x1="-36.87%"%20x2="129.43%"%20y1="134.94%"%20y2="-27.7%"><stop%20stop-color="%2300AEFF"%20offset="0%"/><stop%20stop-color="%233369E7"%20offset="100%"/></linearGradient></defs><g%20fill="none"%20fill-rule="evenodd"><path%20fill="url(%23a)" d="M59.4.02h13.3a2.37 2.37 0 0 1 2.38 2.37V15.6a2.37 2.37 0 0 1-2.38 2.36H59.4a2.37 2.37 0 0 1-2.38-2.36V2.38A2.37 2.37 0 0 1 59.4.02z"/><path fill="%23FFF" d="M66.26 4.56c-2.82 0-5.1 2.27-5.1 5.08 0 2.8 2.28 5.07 5.1 5.07 2.8 0 5.1-2.26 5.1-5.07 0-2.8-2.28-5.07-5.1-5.07zm0 8.65c-2 0-3.6-1.6-3.6-3.56 0-1.97 1.6-3.58 3.6-3.58 1.98 0 3.6 1.6 3.6 3.58a3.58 3.58 0 0 1-3.6 3.57zm0-6.4v2.66c0 .07.08.13.15.1l2.4-1.24c.04-.02.06-.1.03-.14a2.96 2.96 0 0 0-2.46-1.5c-.06 0-.1.05-.1.1zm-3.33-1.96l-.3-.3a.78.78 0 0 0-1.12 0l-.36.36a.77.77 0 0 0 0 1.1l.3.3c.05.05.13.04.17 0 .2-.25.4-.5.6-.7.23-.23.46-.43.7-.6.07-.04.07-.1.03-.16zm5-.8V3.4a.78.78 0 0 0-.78-.78h-1.83a.78.78 0 0 0-.78.78v.63c0 .07.06.12.14.1a5.74 5.74 0 0 1 1.58-.22c.52 0 1.04.07 1.54.2a.1.1 0 0 0 .13-.1z"/><path fill="%23182359" d="M102.16 13.76c0 1.46-.37 2.52-1.12 3.2-.75.67-1.9 1-3.44 1-.56 0-1.74-.1-2.67-.3l.34-1.7c.78.17 1.82.2 2.36.2.86 0 1.48-.16 1.84-.5.37-.36.55-.88.55-1.57v-.35a6.37 6.37 0 0 1-.84.3 4.15 4.15 0 0 1-1.2.17 4.5 4.5 0 0 1-1.6-.28 3.38 3.38 0 0 1-1.26-.82 3.74 3.74 0 0 1-.8-1.35c-.2-.54-.3-1.5-.3-2.2 0-.67.1-1.5.3-2.06a3.92 3.92 0 0 1 .9-1.43 4.12 4.12 0 0 1 1.45-.92 5.3 5.3 0 0 1 1.94-.37c.7 0 1.35.1 1.97.2a15.86 15.86 0 0 1 1.6.33v8.46zm-5.95-4.2c0 .9.2 1.88.6 2.3.4.4.9.62 1.53.62.34 0 .66-.05.96-.15a2.75 2.75 0 0 0 .73-.33V6.7a8.53 8.53 0 0 0-1.42-.17c-.76-.02-1.36.3-1.77.8-.4.5-.62 1.4-.62 2.23zm16.13 0c0 .72-.1 1.26-.32 1.85a4.4 4.4 0 0 1-.9 1.53c-.38.42-.85.75-1.4.98-.54.24-1.4.37-1.8.37-.43 0-1.27-.13-1.8-.36a4.1 4.1 0 0 1-1.4-.97 4.5 4.5 0 0 1-.92-1.52 5.04 5.04 0 0 1-.33-1.84c0-.72.1-1.4.32-2 .22-.6.53-1.1.92-1.5.4-.43.86-.75 1.4-.98a4.55 4.55 0 0 1 1.78-.34 4.7 4.7 0 0 1 1.8.34c.54.23 1 .55 1.4.97.38.42.68.92.9 1.5.23.6.35 1.3.35 2zm-2.2 0c0-.92-.2-1.7-.6-2.22-.38-.54-.94-.8-1.64-.8-.72 0-1.27.26-1.67.8-.4.54-.58 1.3-.58 2.22 0 .93.2 1.56.6 2.1.38.54.94.8 1.64.8s1.25-.26 1.65-.8c.4-.55.6-1.17.6-2.1zm6.97 4.7c-3.5.02-3.5-2.8-3.5-3.27L113.57.92l2.15-.34v10c0 .25 0 1.87 1.37 1.88v1.8zm3.77 0h-2.15v-9.2l2.15-.33v9.54zM119.8 3.74c.7 0 1.3-.58 1.3-1.3 0-.7-.58-1.3-1.3-1.3-.73 0-1.3.6-1.3 1.3 0 .72.58 1.3 1.3 1.3zm6.43 1c.7 0 1.3.1 1.78.27.5.18.88.42 1.17.73.28.3.5.74.6 1.18.13.46.2.95.2 1.5v5.47a25.24 25.24 0 0 1-1.5.25c-.67.1-1.42.15-2.25.15a6.83 6.83 0 0 1-1.52-.16 3.2 3.2 0 0 1-1.18-.5 2.46 2.46 0 0 1-.76-.9c-.18-.37-.27-.9-.27-1.44 0-.52.1-.85.3-1.2.2-.37.48-.67.83-.9a3.6 3.6 0 0 1 1.23-.5 7.07 7.07 0 0 1 2.2-.1l.83.16v-.35c0-.25-.03-.48-.1-.7a1.5 1.5 0 0 0-.3-.58c-.15-.18-.34-.3-.58-.4a2.54 2.54 0 0 0-.92-.17c-.5 0-.94.06-1.35.13-.4.08-.75.16-1 .25l-.27-1.74c.27-.1.67-.18 1.2-.28a9.34 9.34 0 0 1 1.65-.14zm.18 7.74c.66 0 1.15-.04 1.5-.1V10.2a5.1 5.1 0 0 0-2-.1c-.23.03-.45.1-.64.2a1.17 1.17 0 0 0-.47.38c-.13.17-.18.26-.18.52 0 .5.17.8.5.98.32.2.74.3 1.3.3zM84.1 4.8c.72 0 1.3.08 1.8.26.48.17.87.42 1.15.73.3.3.5.72.6 1.17.14.45.2.94.2 1.47v5.48a25.24 25.24 0 0 1-1.5.26c-.67.1-1.42.14-2.25.14a6.83 6.83 0 0 1-1.52-.16 3.2 3.2 0 0 1-1.18-.5 2.46 2.46 0 0 1-.76-.9c-.18-.38-.27-.9-.27-1.44 0-.53.1-.86.3-1.22.2-.36.5-.65.84-.88a3.6 3.6 0 0 1 1.24-.5 7.07 7.07 0 0 1 2.2-.1c.26.03.54.08.84.15v-.35c0-.24-.03-.48-.1-.7a1.5 1.5 0 0 0-.3-.58c-.15-.17-.34-.3-.58-.4a2.54 2.54 0 0 0-.9-.15c-.5 0-.96.05-1.37.12-.4.07-.75.15-1 .24l-.26-1.75c.27-.08.67-.17 1.18-.26a8.9 8.9 0 0 1 1.66-.15zm.2 7.73c.65 0 1.14-.04 1.48-.1v-2.17a5.1 5.1 0 0 0-1.98-.1c-.24.03-.46.1-.65.18a1.17 1.17 0 0 0-.47.4c-.12.17-.17.26-.17.52 0 .5.18.8.5.98.32.2.75.3 1.3.3zm8.68 1.74c-3.5 0-3.5-2.82-3.5-3.28L89.45.92 91.6.6v10c0 .25 0 1.87 1.38 1.88v1.8z"/><path fill="%231D3657" d="M5.03 11.03c0 .7-.26 1.24-.76 1.64-.5.4-1.2.6-2.1.6-.88 0-1.6-.14-2.17-.42v-1.2c.36.16.74.3 1.14.38.4.1.78.15 1.13.15.5 0 .88-.1 1.12-.3a.94.94 0 0 0 .35-.77.98.98 0 0 0-.33-.74c-.22-.2-.68-.44-1.37-.72-.72-.3-1.22-.62-1.52-1C.23 8.27.1 7.82.1 7.3c0-.65.22-1.17.7-1.55.46-.37 1.08-.56 1.86-.56.76 0 1.5.16 2.25.48l-.4 1.05c-.7-.3-1.32-.44-1.87-.44-.4 0-.73.08-.94.26a.9.9 0 0 0-.33.72c0 .2.04.38.12.52.08.15.22.3.42.4.2.14.55.3 1.06.52.58.24 1 .47 1.27.67.27.2.47.44.6.7.12.26.18.57.18.92zM9 13.27c-.92 0-1.64-.27-2.16-.8-.52-.55-.78-1.3-.78-2.24 0-.97.24-1.73.72-2.3.5-.54 1.15-.82 2-.82.78 0 1.4.25 1.85.72.46.48.7 1.14.7 1.97v.67H7.35c0 .58.17 1.02.46 1.33.3.3.7.47 1.24.47.36 0 .68-.04.98-.1a5.1 5.1 0 0 0 .98-.33v1.02a3.87 3.87 0 0 1-.94.32 5.72 5.72 0 0 1-1.08.1zm-.22-5.2c-.4 0-.73.12-.97.38s-.37.62-.42 1.1h2.7c0-.48-.13-.85-.36-1.1-.23-.26-.54-.38-.94-.38zm7.7 5.1l-.26-.84h-.05c-.28.36-.57.6-.86.74-.28.13-.65.2-1.1.2-.6 0-1.05-.16-1.38-.48-.32-.32-.5-.77-.5-1.34 0-.62.24-1.08.7-1.4.45-.3 1.14-.47 2.07-.5l1.02-.03V9.2c0-.37-.1-.65-.27-.84-.17-.2-.45-.28-.82-.28-.3 0-.6.04-.88.13a6.68 6.68 0 0 0-.8.33l-.4-.9a4.4 4.4 0 0 1 1.05-.4 4.86 4.86 0 0 1 1.08-.12c.76 0 1.33.18 1.7.5.4.33.6.85.6 1.56v4h-.9zm-1.9-.87c.47 0 .83-.13 1.1-.38.3-.26.43-.62.43-1.08v-.52l-.76.03c-.6.03-1.02.13-1.3.3s-.4.45-.4.82c0 .26.08.47.24.6.16.16.4.23.7.23zm7.57-5.2c.25 0 .46.03.62.06l-.12 1.18a2.38 2.38 0 0 0-.56-.06c-.5 0-.92.16-1.24.5-.3.32-.47.75-.47 1.27v3.1h-1.27V7.23h1l.16 1.05h.05c.2-.36.45-.64.77-.85a1.83 1.83 0 0 1 1.02-.3zm4.12 6.17c-.9 0-1.58-.27-2.05-.8-.47-.52-.7-1.27-.7-2.25 0-1 .24-1.77.73-2.3.5-.54 1.2-.8 2.12-.8.63 0 1.2.1 1.7.34l-.4 1c-.52-.2-.96-.3-1.3-.3-1.04 0-1.55.68-1.55 2.05 0 .67.13 1.17.38 1.5.26.34.64.5 1.13.5a3.23 3.23 0 0 0 1.6-.4v1.1a2.53 2.53 0 0 1-.73.28 4.36 4.36 0 0 1-.93.08zm8.28-.1h-1.27V9.5c0-.45-.1-.8-.28-1.02-.18-.23-.47-.34-.88-.34-.53 0-.9.16-1.16.48-.25.3-.38.85-.38 1.6v2.94h-1.26V4.8h1.26v2.12c0 .34-.02.7-.06 1.1h.08a1.76 1.76 0 0 1 .72-.67c.3-.16.66-.24 1.07-.24 1.43 0 2.15.74 2.15 2.2v3.86zM42.2 7.1c.74 0 1.32.28 1.73.82.4.53.62 1.3.62 2.26 0 .97-.2 1.73-.63 2.27-.42.54-1 .82-1.75.82s-1.33-.27-1.75-.8h-.08l-.23.7h-.94V4.8h1.26v2l-.02.64-.03.56h.05c.4-.6 1-.9 1.78-.9zm-.33 1.04c-.5 0-.88.15-1.1.45-.22.3-.34.8-.35 1.5v.08c0 .72.12 1.24.35 1.57.23.32.6.48 1.12.48.44 0 .78-.17 1-.53.24-.35.36-.87.36-1.53 0-1.35-.47-2.03-1.4-2.03zm3.24-.92h1.4l1.2 3.37c.18.47.3.92.36 1.34h.04l.18-.72 1.37-4H51l-2.53 6.73c-.46 1.23-1.23 1.85-2.3 1.85-.3 0-.56-.03-.83-.1v-1c.2.05.4.08.65.08.6 0 1.03-.36 1.28-1.06l.22-.56-2.4-5.94z"/></g></svg>');background-repeat:no-repeat;background-position:50%;background-size:100%;overflow:hidden;text-indent:-9000px;width:110px;height:100%;display:block;margin-left:auto;margin-right:5px}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background-color:#fff}body,code{color:#1a1a1a}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace;background-color:rgba(255,229,100,.25);padding:.1rem}.Toc-SidePanel-module--side-panel--3VTld{order:2;position:-webkit-sticky;position:sticky;top:4rem;height:calc(100vh - 4rem);padding-top:1.5rem;padding-bottom:1.5rem;font-size:.875rem;overflow-y:auto}.Toc-SidePanel-module--side-panel--3VTld>ul{padding-left:0;border-left:1px solid #ececec}.Toc-SidePanel-module--side-panel--3VTld>ul ul{padding-left:1rem}.Toc-ListItem-module--list-item--3CS5U a{display:block;padding:.125rem 1.5rem;color:rgba(26,26,26,.6)}.Toc-ListItem-module--list-item--3CS5U a:hover{color:#007bff;text-decoration:none}.Heading-styles-module--heading--3cEKx{position:relative;pointer-events:none}.Heading-styles-module--heading--3cEKx:before{display:block;height:6rem;margin-top:-6rem;visibility:hidden;content:""}.Heading-styles-module--inner--3JhWJ{pointer-events:auto}.prism-module--prism--2-Zwl{display:block;font-size:14px;line-height:20px;white-space:pre-wrap;word-break:break-word;padding:20px;color:#fff;background-color:#282c34}.prism-module--prism--2-Zwl .token.attr-name{color:#c5a5c5}.prism-module--prism--2-Zwl .token.block-comment,.prism-module--prism--2-Zwl .token.cdata,.prism-module--prism--2-Zwl .token.comment,.prism-module--prism--2-Zwl .token.doctype,.prism-module--prism--2-Zwl .token.prolog{color:#999}.prism-module--prism--2-Zwl .token.constant,.prism-module--prism--2-Zwl .token.deleted,.prism-module--prism--2-Zwl .token.function-name,.prism-module--prism--2-Zwl .token.number,.prism-module--prism--2-Zwl .token.property,.prism-module--prism--2-Zwl .token.symbol{color:#5a9bcf}.prism-module--prism--2-Zwl .token.boolean{color:#ff8b50}.prism-module--prism--2-Zwl .token.tag{color:#fc929e}.prism-module--prism--2-Zwl .token.string{color:#8dc891}.prism-module--prism--2-Zwl .token.punctuation{color:#5fb3b3}.prism-module--prism--2-Zwl .token.builtin,.prism-module--prism--2-Zwl .token.char,.prism-module--prism--2-Zwl .token.inserted,.prism-module--prism--2-Zwl .token.selector{color:#d8dee9}.prism-module--prism--2-Zwl .token.function{color:#79b6f2}.prism-module--prism--2-Zwl .token.entity,.prism-module--prism--2-Zwl .token.operator,.prism-module--prism--2-Zwl .token.url,.prism-module--prism--2-Zwl .token.variable{color:#d7deea}.prism-module--prism--2-Zwl .token.attr-value{color:string}.prism-module--prism--2-Zwl .token.keyword{color:#c5a5c5}.prism-module--prism--2-Zwl .token.atrule,.prism-module--prism--2-Zwl .token.class-name{color:#fac863}.prism-module--prism--2-Zwl .token.important{font-weight:400}.prism-module--prism--2-Zwl .token.bold{font-style:700}.prism-module--prism--2-Zwl .token.italic{font-style:italic}.prism-module--prism--2-Zwl .token.entity{cursor:help}.prism-module--prism--2-Zwl .prism-module--namespace--lIdmI{opacity:.7}.CodeBlock-module--code-block--3lvoh{border-radius:8px;margin:0 -1rem 3rem}.card .CodeBlock-module--code-block--3lvoh{margin:0;border-radius:0 0 5px 5px}.Anchor-styles-module--wrapper--2R_tQ{position:relative;display:inline-block;padding-right:1em}.Anchor-styles-module--anchor--2zQH2{font-size:90%;position:absolute;right:.3em;padding-top:.1em;opacity:0}.__heading:hover .Anchor-styles-module--anchor--2zQH2,.Anchor-styles-module--anchor--2zQH2:focus{text-decoration:none;opacity:.5}</style><style data-href="/1.4b80f022cfee3052c9c7.css">.SideNav-MenuButton-module--menu-button--1QeY5{line-height:1;color:#212529}.SideNav-SidePanel-module--side-panel--19YKC{background-color:#f7f7f7}@media (min-width:768px){.SideNav-SidePanel-module--side-panel--19YKC{position:-webkit-sticky;position:sticky;top:4rem;z-index:1000;height:calc(100vh - 4rem);background-color:#f7f7f7;border-right:1px solid #ececec}}.SideNav-SidePanel-module--side-panel--19YKC>*+*{border-top:1px solid #ececec}@media (min-width:768px){.SideNav-OverflowWrapper-module--overflow-wrapper--8UzMg{overflow:hidden;display:block!important;height:100%!important}}@media (min-width:768px){.SideNav-TableOfContents-module--table-of-contents--3Fc1I{height:100%!important;overflow:auto;margin-right:-40px;padding-right:calc(40px + 1rem)}}.SideNav-TocLink-module--toc-link--lmq6G.active,.SideNav-TocLink-module--toc-link--lmq6G.SideNav-TocLink-module--active--RY6bM{font-weight:500;color:#1a1a1a!important}.SideNav-TocLink-module--toc-link--lmq6G.SideNav-TocLink-module--active--RY6bM{margin-top:1rem}.SideNav-TocLink-module--toc-link--lmq6G.SideNav-TocLink-module--active--RY6bM+*{margin-bottom:1rem}.SideNav-TocLink-module--toc-link--lmq6G,.SideNav-TocLink-module--toc-link--lmq6G:active,.SideNav-TocLink-module--toc-link--lmq6G:focus,.SideNav-TocLink-module--toc-link--lmq6G:hover{text-decoration:none;color:rgba(26,26,26,.75);transition:color .2s ease-out}.SideNav-TocLink-module--toc-link--lmq6G:active,.SideNav-TocLink-module--toc-link--lmq6G:focus,.SideNav-TocLink-module--toc-link--lmq6G:hover{text-decoration:none;color:#999}.SideNav-TocSubLink-module--toc-sub-link--3rUm5{font-size:90%;padding-top:.25rem}.Main-styles-module--nav--2hw03{position:-webkit-sticky;position:sticky;top:4rem;height:calc(100vh - 4rem);background-color:#f7f7f7}.Main-styles-module--main--2QNBf{order:1;padding:2rem 4rem}@media (max-width:767.98px){.Main-styles-module--main--2QNBf{padding:1rem .83rem}}.Main-styles-module--main--2QNBf>h2:not(:first-child){margin-top:3rem}.Main-styles-module--main--2QNBf>h3{margin-top:1.5rem}.Main-styles-module--main--2QNBf>ol li,.Main-styles-module--main--2QNBf>ul li{margin-bottom:.25rem}.Main-styles-module--main--2QNBf>table{width:100%;max-width:100%;margin-bottom:1rem}@media (max-width:767.98px){.Main-styles-module--main--2QNBf>table{display:block;overflow-x:auto;-ms-overflow-style:-ms-autohiding-scrollbar}}@media (min-width:992px){.Main-styles-module--main--2QNBf>ol,.Main-styles-module--main--2QNBf>p,.Main-styles-module--main--2QNBf>ul{max-width:80%}}.NavMain-StyledNavbar-module--styled-navbar--3Q3h8{min-height:4rem;background-color:#20232a}@media (min-width:768px){.NavMain-StyledNavbar-module--styled-navbar--3Q3h8{position:-webkit-sticky;position:sticky;top:0;z-index:1040}}.NavMain-StyledNavLink-module--styled-nav-link--3mHGK+.NavMain-StyledNavLink-module--styled-nav-link--3mHGK{margin-left:1rem}.NavMain-StyledNavLink-module--styled-nav-link--3mHGK.active{font-width:700}.NavMain-StyledNavLink-module--styled-nav-link--3mHGK i{font-size:1.2em}</style></head><body><div id="___gatsby"><div style="outline:none" tabindex="-1" role="group"><div><header role="banner" class="NavMain-StyledNavbar-module--styled-navbar--3Q3h8 navbar navbar-expand navbar-dark"><a href="#rb-docs-content" tabindex="0" class="NavMain-SkipToContentLink-module--skip-to-content-link--2GtSs sr-only sr-only-focusable bg-primary text-white px-4 py-2 mr-2">Skip to content</a><a href="/" class="navbar-brand"><img src="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMTI3Ljk4IDIwMTYuODciIGZpbGw9IiM0MWUwZmQiPgogIDxwYXRoICBkPSJNODg4IDExMTkuMTdjMTYtMzIuNjIgMzIuODQtNjUuMzcgNTAuMTctOTcuMzVsLjE1LS4yNyAxOC4zOS0zNS42OCAyNy4xNi00NSAuMTctLjI5YzEwLjE0LTE3LjI2IDIwLjY2LTM0LjY4IDMxLjI3LTUxLjc4bDE4LjY5LTMwLjg3YzI0Ljg4LTQxLjE5IDQ0Ljg4LTcxLjIzIDc2LjQzLTExNC43NiAxNy0yMy40MyAzMy4xMi00NCA1OC42Ni03NS45MmwuMDYtLjA2IDEuMjYtMS41OS40OS0uNjNjMTAuMzctMTMuMjIgMjAuODQtMjYuMjUgMzEuMTEtMzguNzNsLjM0LS40Mi4yLS4yNWMyMy44My0yOS41MSA0OC4xMi01OS4xMyA3Mi4xOS04OGw5LjU3LTExLjQ4VjM1Ni41NEgxMjY3Yy05LjIzLTguNjgtMTguNjYtMTcuMy0yOC4wOC0yNS42OS03Ni4zMi02Ny43Mi0xNTIuNDMtMTIwLjg1LTIyNi4yNy0xNTcuNzktNzUuNzEtMzcuOTItMTQ1LjYzLTU3LjE0LTIwNy44LTU3LjE0LTQ0LjM5IDAtODQuMDYgOS45NC0xMTcuOTEgMjkuNTMtMzIuNTUgMTguODQtNTkuOSA0Ni45MS04MS4zMSA4My40NC0yMC4wNiAzNC4yMy0zNC44NCA3NS44OS00My45NSAxMjMuODEtMTcuNTQgOTIuMzctMTMuNzQgMjA4IDExIDMzNC4zNCAzLjEyIDE1LjkgNi41NiAzMiAxMC4yNSA0OC0xOS43NCA2LTM4LjkxIDEyLjE4LTU3LjEzIDE4LjUzLTExOS4yNiA0MS41OC0yMTkgOTUuOTEtMjg4LjQyIDE1Ny4xNC0zNiAzMS43MS02My44NCA2NS4yMy04Mi44OSA5OS42Mi0yMC4yNCAzNi41Ny0zMC41MSA3NC4wOC0zMC41MSAxMTEuNDkgMCA3NSA0MS41NSAxNTEgMTIwLjE1IDIxOS45NCA3NCA2NC45MyAxNzguNjUgMTIxLjYyIDMwMi41NSAxNjQgMTEuNTEgMy45MSAyMy4yMiA3LjcxIDM1IDExLjM0LTQuMTIgMTcuOTMtNy45MyAzNi0xMS4zNiA1NC0yMy41NiAxMjQuMDgtMjYuMzEgMjM3LjYyLTggMzI4LjM1IDkuNTEgNDcgMjQuNjEgODcuODkgNDQuODkgMTIxLjU3IDIxLjU2IDM1LjggNDguOTMgNjMuNDQgODEuMzQgODIuMTMgMzQuMTUgMTkuNjkgNzQuMzQgMjkuNjcgMTE5LjQ1IDI5LjY3IDYxLjQyIDAgMTMwLjA5LTE4LjIxIDIwNC4xMS01NC4xMyA3Mi41Ni0zNS4yMSAxNDYuNjMtODUuNjQgMjIwLjEzLTE0OS44OSAxMS4zMy05LjkgMjMtMjAuNDkgMzQuNjYtMzEuNTNoMTcuNDF2LTE3NC4zOWwtNi4zNC03LjgtMy0zLjY3LTc5LjgyLTk4LjU1LTQ0LjM1LTU0Ljc1Yy0yMi4zOS0yNy42NC01OC4yNS03OC43OS0xMDEtMTQ0LTM0LTUxLjg0LTU4Ljc2LTkzLjQ3LTcwLjUtMTEzLjYzbC0xLjI4LTIuMjFjLTIwLjQ5LTM1LjMzLTM1LjcxLTYzLjc5LTQ3LjkzLTg2LjY0LTE1LjMtMjguNjMtMzAuMzktNTcuODctNDQuOTEtODdsMi42Ni01LjE3em0tODAuODYtMTcyLjg5Yy0xMy41My0zNC43LTI1LjkyLTY5LjEzLTM3LTEwMi44MSAzNC41Ny03LjEzIDcwLjUxLTEzLjUzIDEwNy4zMi0xOS4xMS0xMi4yOCAyMC4xMS0yNC4zNCA0MC40MS0zNiA2MC42NHMtMjMuMTIgNDAuNjktMzQuMzIgNjEuMjh6bS0zOC4yNSA0NjIuMWMxMS40NS0zNC44NiAyNC4zMS03MC41NiAzOC4zOS0xMDYuNTkgMTEuMjkgMjAuNyAyMi44NyA0MS4zIDM0LjU4IDYxLjUzIDEyLjI3IDIxLjE5IDI1IDQyLjQ4IDM3Ljk1IDYzLjU4LTM4LjQ2LTUuMzItNzUuNjItMTEuNTMtMTEwLjkyLTE4LjUxek03MDcuMTggMzk3LjE2YzktNjEuNzQgMjkuMTQtMTA1Ljg3IDU1LjM3LTEyMS4wNiAxMC44OS02LjMxIDI1LjM0LTkuNSA0Mi45My05LjUgMzguNDcgMCA4OC4yNCAxNS4xIDE0My45MSA0My42NyA2MC4zNCAzMSAxMjUuNzcgNzcuMTEgMTg5LjIyIDEzMy40NXE1LjkgNS4yNCAxMi4wNyAxMC44OWMtNTUuODEgNjEuNzEtMTEwLjgxIDEzMC4yOC0xNjMuNjggMjA0LjEtOTAuMDggOC44LTE3Ni42OCAyMS45NC0yNTcuNzYgMzkuMTEtMi45My0xMi44NC01LjY4LTI1Ljc1LTguMi0zOC41bC0uMjQtMS4zMmMtMTkuMzMtOTguNzYtMjQuMDQtMTg5LTEzLjYyLTI2MC44NHptMTEuMzEgNzI3Yy0zOC4xIDg0LTcwLjQ4IDE2Ny4xNi05Ni4zNyAyNDcuNDYtOS0yLjgtMTcuODktNS43Mi0yNi42NS04LjctMTAzLTM1LjIxLTE4OC43OS04MC42Ni0yNDguMDgtMTMxLjQzLTQ1LjM3LTM4Ljg1LTcyLjQ1LTc5LjgzLTcyLjQ1LTEwOS42MyAwLTMwLjU5IDI3LjA5LTcwIDc0LjM0LTEwOC4yIDU1LTQ0LjQ3IDEzMy4yNy04NS4xMSAyMjYuMTktMTE3LjUgMTUuNzktNS40OCAzMS44Ny0xMC43MyA0OC0xNS42NCAyNS41MyA3OS4xMyA1Ny40OCAxNjAuOTkgOTUuMDEgMjQzLjYzem0uMTIgNDc0LjkyYzIuODYtMTUgNi0zMC4wOSA5LjQzLTQ1LjA5IDgwIDE2LjM3IDE2Ny41OSAyOC43MSAyNjAuNzUgMzYuNzEgNTMuMzggNzQuMzQgMTA4Ljg0IDE0My4zNyAxNjUuMDUgMjA1LjQ0LTYuOTQgNi4zOS0xMy45NCAxMi42OC0yMC45IDE4Ljc5LTgxLjM3IDcxLjEzLTE2My4wOSAxMjIuNTUtMjM2LjI4IDE0OC43MWwtMS41Mi41NGMtMzIuOCAxMS41OC02Mi4wOSAxNy40NS04NyAxNy40NS0xOC4zOCAwLTMzLjIyLTMuMTgtNDQuMTEtOS40Ni0yNi41MS0xNS4yOS00Ny4xNC01OC40Ni01Ni42LTExOC40NS0xMS4wNi02OS45MS03LjE5LTE1Ny45NyAxMS4xNy0yNTQuNjV6IgogICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEyMy45OCAtMTE1LjkyKSIgaWQ9Il9Hcm91cF8iIGRhdGEtbmFtZT0iJmx0O0dyb3VwJmd0OyIgLz4KICA8cGF0aCBkPSJNMjE5NS4wNyAxMjA1LjFxLTU2LjI2LTEwMy40NS0xNjUuNTQtMTM0LjIzYTIuODUgMi44NSAwIDAgMS0xLjc5LTIuODUgMyAzIDAgMCAxIDEuMzctMi42OGM1NC4yNC0zMC4xNiA5NS45My03My4xMSAxMjUuMTUtMTI3LjlxNDQuMTUtODIuODkgNDQuMTYtMTk5LjQ5YzAtMTI4LjI1LTMyLjQ1LTIyMy42NS05Ny4wNi0yODcuMTFzLTE1MC42Mi05NS0yNTcuNy05NWgtNTc4LjM1Yy0xLjI1IDAtMi4yNyAxLjMxLTIuMjcgMi45M1YxODk0LjNjMCAxLjYyIDEgMi45MyAyLjI3IDIuOTNoNTQ2LjU3cTExNS40MiAwIDE5OS4xMS0zMy42OWM1NS45MS0yMi40MiAxMDEuNC01Mi42OCAxMzcuMjEtOTAuNjhzNjEuOTItODMuMzMgNzguNjYtMTM2YzE2Ljc0LTUyLjIzIDI1LjEtMTA4LjggMjUuMS0xNjkuMjQuMDQtMTA1LjM3LTE5LjA4LTE5Mi41Ny01Ni44OS0yNjIuNTJ6bS03MjIuMzItNjI4YzAtMS42MiAxLTIuOTMgMi4yNy0yLjkzaDMzOS40NmM1Ni45NSAwIDEwMC41MSAxNiAxMzAuNjUgNDcuNTVzNDUuMiA4Ni40IDQ1LjIgMTY0LjE4YzAgNjkuMTgtMTYuNzQgMTIxLjkyLTUwLjI1IDE1OS4wOHMtNzUuMzcgNTUuMzItMTI1LjYzIDU1LjMySDE0NzVjLTEuMjUgMC0yLjI3LTEuMzEtMi4yNy0yLjkzem01MTguMTYgMTAzNS44Yy0zNC44NiA0Mi43Ni04NC40MSA2NC0xNDguMDcgNjRIMTQ3NWMtMS4yNSAwLTIuMjctMS4zMS0yLjI3LTIuOTN2LTQ3Ni40YzAtMS42MiAxLTIuOTMgMi4yNy0yLjkzaDM2Ny44MmM2My42NiAwIDExMi41NyAxOS44OSAxNDguMDcgNjEuMzVzNTIuOTMgOTkuODIgNTIuOTMgMTc2LjNjLjAyIDc3Ljc3LTE3Ljc2IDEzOC4yNy01Mi45MSAxODAuNjF6IgogICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEyMy45OCAtMTE1LjkyKSIgLz48L3N2Zz4K" alt="react-bootstrap" height="30"/></a><div class="d-none d-md-flex navbar-nav" role="navigation" id="top"><a href="/" data-rb-event-key="/" class="NavMain-StyledNavLink-module--styled-nav-link--3mHGK nav-link">Home</a><a href="/getting-started/introduction" data-rb-event-key="/getting-started/introduction" class="NavMain-StyledNavLink-module--styled-nav-link--3mHGK nav-link">Getting Started</a><a href="/components/alerts" data-rb-event-key="/components/alerts" class="NavMain-StyledNavLink-module--styled-nav-link--3mHGK nav-link">Components</a></div><div class="ml-auto pr-md-5 navbar-nav"><a target="_blank" rel="noopener noreferrer" href="https://github.com/react-bootstrap/react-bootstrap" data-rb-event-key="https://github.com/react-bootstrap/react-bootstrap" class="NavMain-StyledNavLink-module--styled-nav-link--3mHGK nav-link"><i class="fab fa-github"></i><span class="sr-only">Github</span></a><a target="_blank" rel="noopener noreferrer" href="https://discord.gg/0ZcbPKXt5bXLs9XK" data-rb-event-key="https://discord.gg/0ZcbPKXt5bXLs9XK" class="NavMain-StyledNavLink-module--styled-nav-link--3mHGK nav-link"><i class="fab fa-discord"></i><span class="sr-only">Discord</span></a></div></header><div class="container-fluid"><div class="flex-xl-nowrap row"><div class="col-xl-2 col-md-3 col-12 SideNav-SidePanel-module--side-panel--19YKC d-flex flex-column"><form class="py-3 d-flex align-items-center"><input type="text" placeholder="Search…" id="docs-search-input" class="form-control"/><button type="button" class="SideNav-MenuButton-module--menu-button--1QeY5 p-0 d-md-none ml-3 btn btn-link"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"></path></svg></button></form><div class="collapse SideNav-OverflowWrapper-module--overflow-wrapper--8UzMg"><nav role="complementary" class="SideNav-TableOfContents-module--table-of-contents--3Fc1I pt-2 pb-4"><a href="/getting-started/introduction/" class="js-search-toc-item SideNav-TocLink-module--toc-link--lmq6G nav-link">Getting started</a><a href="/layout/grid/" class="js-search-toc-item SideNav-TocLink-module--toc-link--lmq6G nav-link">Layout</a><a href="/components/alerts/" class="js-search-toc-item SideNav-TocLink-module--toc-link--lmq6G nav-link">Components</a><a href="/utilities/transitions/" class="js-search-toc-item SideNav-TocLink-module--toc-link--lmq6G nav-link">Utilities</a><a href="/migrating/" class="js-search-toc-item js-search-active SideNav-TocLink-module--toc-link--lmq6G SideNav-TocLink-module--active--RY6bM nav-link">Migrating</a></nav></div></div><div class="d-none d-xl-block col-xl-2 Toc-SidePanel-module--side-panel--3VTld"><ul class="list-unstyled"></ul></div><main id="rb-docs-content" class="Main-styles-module--main--2QNBf col-xl-8 col-md-9 col-12"><h1 id="migrating-to-v1" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ">Migrating to v1</div></h1><p>React Bootstrap v1 adds full compatibility with Bootstrap 4. Because bootstrap 4 is a major rewrite of the project there
are significant breaking changes from the pre <code>v1</code> react-bootstrap.</p><h2 id="versioning" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Versioning<a href="#versioning" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h2><p>We will continue to provide general maintainance for Bootstrap 3 components, because there are many projects that continue to depend on Bootstrap 3 support in
<code>react-bootstrap</code>. <code>react-bootstrap</code> package versions will be as follows:</p><ul><li>Bootstrap 3 support will continue in react-bootstrap versions < <code>v1.0.0</code></li><li>Bootstrap 4 support will be in react-bootstrap versions >= <code>v1.0.0</code></li></ul><p>We are <strong>not</strong> committing to keeping breaking changes in lockstep with bootstraps major releases,
there may be a react-bootstrap v2 targeting Bootstrap v4 depending on what's best for the project.</p><h2 id="summary-of-breaking-changes-from-v0320" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Summary of breaking changes from v0.32.0<a href="#summary-of-breaking-changes-from-v0320" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h2><p>Below is a <em>rough</em> account of the breaking API changes as well as the minimal change to migrate</p><ul><li><code>bsStyle</code> -> <code>variant</code></li><li><code>bsClass</code> -> <code>bsPrefix</code></li><li><code>bsRole</code> has been removed from all components. Components now communicate
via context to allow intermediate nesting of child components</li><li><code>componentClass</code> -> <code>as</code></li><li>All utils have been removed from main exports, most were internal already and the rest have been moved to external libraries</li></ul><h3 id="grid" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Grid<a href="#grid" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>renamed to Container</li><li>removed Clearfix</li></ul><h4 id="col" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Col<a href="#col" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h4><ul><li>removed visibility props</li><li>consolidated col <code>span</code>, <code>offset</code>, and <code>order</code> into an object value prop per breakpoint.</li></ul><h3 id="navbar" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Navbar<a href="#navbar" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>removed <code>Navbar.Header</code></li><li>removed <code>Navbar.Form</code></li><li>removed <code>fluid</code>, use your own <code>Container</code> component in.</li><li><code>inverse</code> removed and replaced with <code>variant="dark"</code></li><li>positioning props have been consolidated into <code>fixed={top|bottom}</code> and <code>sticky={top|bottom}</code>, staticTop has been removed</li></ul><h4 id="navbarheader" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">NavbarHeader<a href="#navbarheader" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h4><ul><li>removed, not present in v4</li></ul><h4 id="navbartoggle" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">NavbarToggle<a href="#navbartoggle" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h4><ul><li>name changed to <code>Navbar.Toggle</code></li></ul><h4 id="navbarbrand" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">NavbarBrand<a href="#navbarbrand" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h4><ul><li>Renders a <code><a></code> when an <code>href</code> is provided</li><li>The presence of <code>children</code> does not skip the wrapping <code>span</code>, use <code>as</code> along with <code>children</code> for custom rendering</li></ul><h3 id="nav" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Nav<a href="#nav" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li><code>activeHref</code> is removed (only activeKey now)</li><li><code>bsStyle</code> renamed to <code>variant</code></li><li>NavLink hrefs will be used as <code>eventKey</code>s when <code>eventKey</code> is absent</li><li>Local <code>onSelect</code> handlers are ignored when in the context of a TabContainer or Navbar (MAYBE ADD BACK?)</li></ul><h4 id="navitem" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Nav.Item<a href="#navitem" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h4><ul><li>Renders <em>only</em> the outer "item" element, use inconjunction with the new <code>NavLink</code> component</li><li>default element changed to <code><div></code> from a <code><li></code></li><li><code>active</code> prop removed and moved to <code>NavLink</code></li></ul><h3 id="inputgroup" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">InputGroup<a href="#inputgroup" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>removed InputGroupButton, and InputGroupAddon</li><li>added InputGroup.Prepend, InputGroup.Append, InputGroup.Text, InputGroup.Checkbox, InputGroup.Radio</li></ul><h3 id="badge--label" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Badge & Label<a href="#badge--label" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>removed <code>Label</code>, the <code>Badge</code> component covers both</li><li><code>bsStyle</code> renamed to <code>variant</code></li></ul><h3 id="panel" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Panel<a href="#panel" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>removed, replaced with Card components</li></ul><h3 id="dropdown" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Dropdown<a href="#dropdown" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>Removed the <code>disabled</code> prop on Dropdown, pass it directly to Dropdown.Toggle</li><li>Removed bsRole, use function children to render custom Toggles or Menus</li><li>Removed SplitButton.toggle (replaced with a <code>split</code> prop on the basic Toggle)</li><li><code>noCaret</code> is removed because it's not optional with the styles anymore</li><li>bsPrefixes are not passed from the parent Dropdown anymore</li><li>onSelect behavior is now passed to Menu and Toggle via the Context api</li><li>DropdownMenu is not rendered until opened</li><li><code>divider</code> has been split out into <code>Dropdown.Divider</code></li><li><code>header</code> has been split out into <code>Dropdown.Header</code></li></ul><h4 id="dropdownbutton" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">DropdownButton<a href="#dropdownbutton" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h4><ul><li>Extra props are passed to the underlying Dropdown component, not the Toggle.</li></ul><h4 id="splitbutton" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">SplitButton<a href="#splitbutton" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h4><ul><li>Extra props are passed to the underlying Dropdown component, not the Toggle.</li></ul><h3 id="navbutton" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">NavButton<a href="#navbutton" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>Extra props are passed to the underlying Dropdown component, not the Toggle.</li></ul><h4 id="menuitem" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">MenuItem<a href="#menuitem" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h4><ul><li>renamed to <code>DropdownItem</code> (also exported on <code>Dropdown</code> as <code>Dropdown.Item</code>)</li></ul><h3 id="alert" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Alert<a href="#alert" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li><code>onDismiss</code> renamed to <code>onClose</code></li></ul><h3 id="well" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Well<a href="#well" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>removed.</li></ul><h3 id="controllabel" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">ControlLabel<a href="#controllabel" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>renamed to <code>FormLabel</code> (also exported on <code>Form</code> as <code>Form.Label</code>)</li></ul><h3 id="formgroup" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">FormGroup<a href="#formgroup" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>renamed to <code>FormGroup</code> (also exported on <code>Form</code> as <code>Form.Group</code>)</li></ul><h3 id="formcontrol" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">FormControl<a href="#formcontrol" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>renamed to <code>FormControl</code> (also exported on <code>Form</code> as <code>Form.Control</code>)</li></ul><h3 id="checkbox-and-radio" class="Heading-styles-module--heading--3cEKx __heading"><div class="Heading-styles-module--inner--3JhWJ"><span class="Anchor-styles-module--wrapper--2R_tQ">Checkbox and Radio<a href="#checkbox-and-radio" class="Anchor-styles-module--anchor--2zQH2" aria-hidden="true"><span aria-hidden="true">#</span></a></span></div></h3><ul><li>Consolidated into a single component. Component's name is <code>FormCheck</code> (also exported on <code>Form</code> as <code>Form.Check</code>)</li></ul></main></div></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script><script id="gatsby-script-loader">/*<![CDATA[*/window.page={"componentChunkName":"component---src-pages-migrating-mdx","jsonName":"migrating-954","path":"/migrating/"};window.dataPath="624/path---migrating-954-eb3-YV2xtnt8tPyAY05Un6wm26zkpgI";/*]]>*/</script><script id="gatsby-chunk-mapping">/*<![CDATA[*/window.___chunkMapping={"app":["/app.8710604f6f1470c332bb.css","/app-6b3dac389d26abe96cf3.js"],"component---src-pages-components-figures-js":["/component---src-pages-components-figures-js.662ec9548ddff82f6850.css","/component---src-pages-components-figures-js-35aa1184216085adfc93.js"],"component---src-pages-components-forms-js":["/component---src-pages-components-forms-js.e713e86ed071681693cd.css","/component---src-pages-components-forms-js-cf65b878c7d5a74c83de.js"],"component---src-pages-components-images-js":["/component---src-pages-components-images-js.662ec9548ddff82f6850.css","/component---src-pages-components-images-js-1b933bdd290fcd19e064.js"],"component---src-pages-components-input-group-js":["/component---src-pages-components-input-group-js.662ec9548ddff82f6850.css","/component---src-pages-components-input-group-js-2993417e7646dae17fec.js"],"component---src-pages-components-jumbotron-js":["/component---src-pages-components-jumbotron-js.662ec9548ddff82f6850.css","/component---src-pages-components-jumbotron-js-f2b797d5b3a5d93b26db.js"],"component---src-pages-components-modal-js":["/component---src-pages-components-modal-js.4649ade1e701f891d6da.css","/component---src-pages-components-modal-js-55daf8efef1356e0ff62.js"],"component---src-pages-components-navbar-js":["/component---src-pages-components-navbar-js.cb5207f964fc196c01d3.css","/component---src-pages-components-navbar-js-8dcf1857331296572549.js"],"component---src-pages-components-overlays-js":["/component---src-pages-components-overlays-js.999aec9f363fb1f0628f.css","/component---src-pages-components-overlays-js-b3af079cc2b9c998681a.js"],"component---src-pages-components-pagination-js":["/component---src-pages-components-pagination-js.662ec9548ddff82f6850.css","/component---src-pages-components-pagination-js-a60e54e35236eda44ad1.js"],"component---src-pages-components-progress-js":["/component---src-pages-components-progress-js.662ec9548ddff82f6850.css","/component---src-pages-components-progress-js-8a0c33a8c81eb641ea10.js"],"component---src-pages-components-table-js":["/component---src-pages-components-table-js.662ec9548ddff82f6850.css","/component---src-pages-components-table-js-75a59a115b69720fbe4f.js"],"component---src-pages-components-tabs-js":["/component---src-pages-components-tabs-js.314578dd561869d44071.css","/component---src-pages-components-tabs-js-6bce5fd1d0d5e3f93b85.js"],"component---src-pages-getting-started-theming-js":["/component---src-pages-getting-started-theming-js.5725cc89cf1f32d3977c.css","/component---src-pages-getting-started-theming-js-e2ca9b3e1778c3173b17.js"],"component---src-pages-index-js":["/component---src-pages-index-js.a3ca3e6c1bc0734de74b.css","/component---src-pages-index-js-7f222e660f111746122f.js"],"component---src-pages-layout-grid-js":["/component---src-pages-layout-grid-js.e56c28fa91e4dc767b87.css","/component---src-pages-layout-grid-js-13a27637b80fb354b88f.js"],"component---src-pages-layout-media-js":["/component---src-pages-layout-media-js.662ec9548ddff82f6850.css","/component---src-pages-layout-media-js-11921916ba956e15b6d2.js"],"component---src-pages-utilities-react-overlays-js":["/component---src-pages-utilities-react-overlays-js-a872b0f714a11dcc70f0.js"],"component---src-pages-utilities-responsive-embed-js":["/component---src-pages-utilities-responsive-embed-js.662ec9548ddff82f6850.css","/component---src-pages-utilities-responsive-embed-js-519f4a31895f9196b88c.js"],"component---src-pages-components-alerts-mdx":["/component---src-pages-components-alerts-mdx.cb5207f964fc196c01d3.css","/component---src-pages-components-alerts-mdx-9fd8c4df7adf82f3de33.js"],"component---src-pages-components-breadcrumb-mdx":["/component---src-pages-components-breadcrumb-mdx.662ec9548ddff82f6850.css","/component---src-pages-components-breadcrumb-mdx-0abd50f42d772adba11b.js"],"component---src-pages-components-button-group-mdx":["/component---src-pages-components-button-group-mdx.662ec9548ddff82f6850.css","/component---src-pages-components-button-group-mdx-563a43122503f8c8a084.js"],"component---src-pages-components-badge-mdx":["/component---src-pages-components-badge-mdx.662ec9548ddff82f6850.css","/component---src-pages-components-badge-mdx-9fb7922853cfd308bdbe.js"],"component---src-pages-components-carousel-mdx":["/component---src-pages-components-carousel-mdx.662ec9548ddff82f6850.css","/component---src-pages-components-carousel-mdx-7f8e019dc91dbee5ee47.js"],"component---src-pages-components-buttons-mdx":["/component---src-pages-components-buttons-mdx.821a02a576dfd5e3ee88.css","/component---src-pages-components-buttons-mdx-d2d741418cb453764a11.js"],"component---src-pages-components-cards-mdx":["/component---src-pages-components-cards-mdx.03139d635a5e489b6fb7.css","/component---src-pages-components-cards-mdx-a58b4d03c3a238a2cfa2.js"],"component---src-pages-components-list-group-mdx":["/component---src-pages-components-list-group-mdx.e01b42ce2b0f25796217.css","/component---src-pages-components-list-group-mdx-df39127f56015b7df509.js"],"component---src-pages-components-dropdowns-mdx":["/component---src-pages-components-dropdowns-mdx.522336aabf2e16326d16.css","/component---src-pages-components-dropdowns-mdx-7e7ef0843890bdc0c7e5.js"],"component---src-pages-components-navs-mdx":["/component---src-pages-components-navs-mdx.cb5207f964fc196c01d3.css","/component---src-pages-components-navs-mdx-d2df64e0beb8fc85569e.js"],"component---src-pages-getting-started-support-mdx":["/component---src-pages-getting-started-support-mdx-f39622838939c35c56d8.js"],"component---src-pages-getting-started-introduction-mdx":["/component---src-pages-getting-started-introduction-mdx.5725cc89cf1f32d3977c.css","/component---src-pages-getting-started-introduction-mdx-070167aa696ff766d939.js"],"component---src-pages-migrating-mdx":["/component---src-pages-migrating-mdx-59886e834c5949c57443.js"],"component---src-pages-utilities-transitions-mdx":["/component---src-pages-utilities-transitions-mdx.cb5207f964fc196c01d3.css","/component---src-pages-utilities-transitions-mdx-840642e53d7dd885cba1.js"]};/*]]>*/</script><script src="/webpack-runtime-006d62a9de38d0cb672c.js" async=""></script><script src="/app-6b3dac389d26abe96cf3.js" async=""></script><script src="/0-b247a513b06e4324b9e7.js" async=""></script><script src="/1-0eb4f4b7f1c6415fff83.js" async=""></script><script src="/component---src-pages-migrating-mdx-59886e834c5949c57443.js" async=""></script></body></html>