diff --git a/README.md b/README.md
index 0941b332d3..7a94a56c47 100644
--- a/README.md
+++ b/README.md
@@ -2,6 +2,9 @@
DevExtreme Reactive is a set of business React components that deeply integrate with Bootstrap and Material-UI libraries.
+## This project is not in development. We continue to support and fix bugs in it
+We are currently investigating the possibility of making our [DevExtreme](https://github.com/DevExpress/DevExtreme) components [native](https://github.com/DevExpress/DevExtreme/issues/16468). They will replace DevExtreme Reactive components. To create a new application, use [devextreme react](https://github.com/DevExpress/devextreme-react). We are now working on migration guides for those who already have applications based on Reactive to make the migration easier.
+
## Common Features
- Composable and extendable plugin-based architecture
diff --git a/packages/dx-site/src/components/docs/survey-header-addon.jsx b/packages/dx-site/src/components/docs/header-addon.jsx
similarity index 68%
rename from packages/dx-site/src/components/docs/survey-header-addon.jsx
rename to packages/dx-site/src/components/docs/header-addon.jsx
index 5c2f5dc349..559c136581 100644
--- a/packages/dx-site/src/components/docs/survey-header-addon.jsx
+++ b/packages/dx-site/src/components/docs/header-addon.jsx
@@ -1,10 +1,11 @@
/* globals document */
import * as React from 'react';
-import styles from './survey-header-addon.module.scss';
+import * as PropTypes from 'prop-types';
+import styles from './header-addon.module.scss';
-const COOKIE_ID = 'dx-cookie-survey';
+const COOKIE_ID = 'dx-cookie-header-addon';
-const SurveyHeaderAddon = React.memo(() => {
+const HeaderAddon = React.memo(({ spanText, link, linkText }) => {
const [shown, setShown] = React.useState(typeof document !== 'undefined' && document.cookie.indexOf(COOKIE_ID) === -1);
const onClick = React.useCallback(() => {
@@ -23,17 +24,17 @@ const SurveyHeaderAddon = React.memo(() => {
>
{/* eslint-disable-next-line */}
- Dismiss
+ Dismiss
@@ -42,4 +43,10 @@ const SurveyHeaderAddon = React.memo(() => {
} return null;
});
-export default SurveyHeaderAddon;
+HeaderAddon.propTypes = {
+ spanText: PropTypes.string.isRequired,
+ linkText: PropTypes.string.isRequired,
+ link: PropTypes.string.isRequired,
+};
+
+export default HeaderAddon;
diff --git a/packages/dx-site/src/components/docs/header-addon.module.scss b/packages/dx-site/src/components/docs/header-addon.module.scss
new file mode 100644
index 0000000000..022cb65d2a
--- /dev/null
+++ b/packages/dx-site/src/components/docs/header-addon.module.scss
@@ -0,0 +1,20 @@
+.main {
+ width: 100%;
+ background-color: rgb(95, 208, 238);
+ color: #114e5f;
+ }
+
+ .underline {
+ padding-right: 20px;
+ text-decoration: underline;
+ cursor: pointer;
+ }
+
+ .row {
+ justify-content: space-between;
+ margin: 0px;
+ }
+
+ .link {
+ color: #114e5f !important;
+ }
\ No newline at end of file
diff --git a/packages/dx-site/src/components/docs/survey-header-addon.module.scss b/packages/dx-site/src/components/docs/survey-header-addon.module.scss
deleted file mode 100644
index d0d26af960..0000000000
--- a/packages/dx-site/src/components/docs/survey-header-addon.module.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-.main {
- width: 100%;
- background-color: rgb(95, 208, 238);
- color: #114e5f;
-}
-
-.underline {
- padding-right: 20px;
- text-decoration: underline;
- cursor: pointer;
-}
-
-.row {
- justify-content: space-between;
- margin: 0px;
-}
-
-.link {
- color: #114e5f !important;
-}
diff --git a/packages/dx-site/src/components/layouts/page-layout.jsx b/packages/dx-site/src/components/layouts/page-layout.jsx
index 23f0ef502b..f15ae6a04a 100644
--- a/packages/dx-site/src/components/layouts/page-layout.jsx
+++ b/packages/dx-site/src/components/layouts/page-layout.jsx
@@ -5,7 +5,7 @@ import Header from '../header';
import VersionLink from '../docs/version-link';
import LandingProductLinks from '../landing/product-links';
import ContentContainer from './content-container';
-// import SurveyHeaderAddon from '../docs/survey-header-addon';
+import HeaderAddon from '../docs/header-addon';
class PageLayout extends React.PureComponent {
static propTypes = {
@@ -29,7 +29,9 @@ class PageLayout extends React.PureComponent {
>
)}
- // addon={}
+ addon={
+
+ }
/>
{children}