@backstage/plugin-techdocs 0.12.1 → 0.12.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -2,7 +2,7 @@ import { createApiRef, createRouteRef, useRouteRef, useApi, configApiRef, create
2
2
  import { ResponseError, NotFoundError } from '@backstage/errors';
3
3
  import { EventSourcePolyfill } from 'event-source-polyfill';
4
4
  import * as React from 'react';
5
- import React__default, { useEffect, useState, useReducer, useRef, useMemo, useCallback } from 'react';
5
+ import React__default, { useEffect, useState, useReducer, useRef, useMemo, useContext, createContext, useCallback } from 'react';
6
6
  import { useCopyToClipboard, useDebounce, useAsyncRetry, useAsync } from 'react-use';
7
7
  import { capitalize } from 'lodash';
8
8
  import { SubvalueCell, Link, Table, EmptyState, Button, WarningPanel, CodeSnippet, PageWithHeader, Content, ContentHeader, SupportButton, ErrorPage, Progress, HeaderLabel, Header, Page, ItemCardGrid, ItemCardHeader, HeaderTabs, MissingAnnotationEmptyState } from '@backstage/core-components';
@@ -10,22 +10,22 @@ import { favoriteEntityIcon, favoriteEntityTooltip, EntityRefLinks, getEntityRel
10
10
  import { RELATION_OWNED_BY } from '@backstage/catalog-model';
11
11
  import ShareIcon from '@material-ui/icons/Share';
12
12
  import { FilteredEntityLayout, FilterContainer, EntityListContainer } from '@backstage/plugin-catalog';
13
- import { makeStyles, ListItemText, ListItem, Divider, createStyles, Button as Button$1, Drawer, Grid, Typography, IconButton, TextField, InputAdornment, CircularProgress, useTheme, Card, CardMedia, CardContent, CardActions } from '@material-ui/core';
13
+ import { makeStyles, ListItemText, ListItem, Divider, Grid, TextField, InputAdornment, IconButton, CircularProgress, createStyles, Button as Button$1, Drawer, Typography, useTheme, Card, CardMedia, CardContent, CardActions } from '@material-ui/core';
14
14
  import TextTruncate from 'react-text-truncate';
15
+ import { useNavigate as useNavigate$1, useParams, Routes, Route } from 'react-router-dom';
15
16
  import { scmIntegrationsApiRef } from '@backstage/integration-react';
16
- import { Alert } from '@material-ui/lab';
17
- import { useParams, useNavigate as useNavigate$1, Routes, Route } from 'react-router-dom';
18
17
  import { replaceGitHubUrlType } from '@backstage/integration';
19
18
  import FeedbackOutlinedIcon from '@material-ui/icons/FeedbackOutlined';
20
19
  import ReactDOM from 'react-dom';
21
20
  import parseGitUrl from 'git-url-parse';
22
21
  import DOMPurify from 'dompurify';
23
- import Close from '@material-ui/icons/Close';
24
- import { LazyLog } from 'react-lazylog';
25
22
  import Autocomplete from '@material-ui/lab/Autocomplete';
26
23
  import { SearchContextProvider, useSearch } from '@backstage/plugin-search';
27
24
  import SearchIcon from '@material-ui/icons/Search';
28
25
  import { useNavigate, useOutlet } from 'react-router';
26
+ import { Alert } from '@material-ui/lab';
27
+ import Close from '@material-ui/icons/Close';
28
+ import { LazyLog } from 'react-lazylog';
29
29
  import CodeIcon from '@material-ui/icons/Code';
30
30
 
31
31
  const techdocsStorageApiRef = createApiRef({
@@ -388,7 +388,7 @@ const DefaultTechDocsHome = ({
388
388
  }))))));
389
389
  };
390
390
 
391
- const useStyles$1 = makeStyles({
391
+ const useStyles$2 = makeStyles({
392
392
  flexContainer: {
393
393
  flexWrap: "wrap"
394
394
  },
@@ -404,7 +404,7 @@ const DocsResultListItem = ({
404
404
  asLink = true,
405
405
  title
406
406
  }) => {
407
- const classes = useStyles$1();
407
+ const classes = useStyles$2();
408
408
  const TextItem = () => /* @__PURE__ */ React__default.createElement(ListItemText, {
409
409
  className: classes.itemText,
410
410
  primaryTypographyProps: {variant: "h6"},
@@ -714,6 +714,19 @@ const injectCss = ({css}) => {
714
714
  };
715
715
  };
716
716
 
717
+ const scrollIntoAnchor = () => {
718
+ return (dom) => {
719
+ setTimeout(() => {
720
+ var _a;
721
+ if (window.location.hash) {
722
+ const hash = window.location.hash.slice(1);
723
+ (_a = dom == null ? void 0 : dom.querySelector(`#${hash}`)) == null ? void 0 : _a.scrollIntoView();
724
+ }
725
+ }, 200);
726
+ return dom;
727
+ };
728
+ };
729
+
717
730
  const transform = async (html, transformers) => {
718
731
  let dom;
719
732
  if (typeof html === "string") {
@@ -729,88 +742,9 @@ const transform = async (html, transformers) => {
729
742
  return dom;
730
743
  };
731
744
 
732
- const useDrawerStyles = makeStyles((theme) => createStyles({
733
- paper: {
734
- width: "100%",
735
- [theme.breakpoints.up("sm")]: {
736
- width: "75%"
737
- },
738
- [theme.breakpoints.up("md")]: {
739
- width: "50%"
740
- },
741
- padding: theme.spacing(2.5)
742
- },
743
- root: {
744
- height: "100%",
745
- overflow: "hidden"
746
- }
747
- }));
748
- const TechDocsBuildLogsDrawerContent = ({
749
- buildLog,
750
- onClose
751
- }) => {
752
- const classes = useDrawerStyles();
753
- return /* @__PURE__ */ React.createElement(Grid, {
754
- container: true,
755
- direction: "column",
756
- className: classes.root,
757
- spacing: 0,
758
- wrap: "nowrap"
759
- }, /* @__PURE__ */ React.createElement(Grid, {
760
- item: true,
761
- container: true,
762
- justifyContent: "space-between",
763
- alignItems: "center",
764
- spacing: 0,
765
- wrap: "nowrap"
766
- }, /* @__PURE__ */ React.createElement(Typography, {
767
- variant: "h5"
768
- }, "Build Details"), /* @__PURE__ */ React.createElement(IconButton, {
769
- key: "dismiss",
770
- title: "Close the drawer",
771
- onClick: onClose,
772
- color: "inherit"
773
- }, /* @__PURE__ */ React.createElement(Close, null))), /* @__PURE__ */ React.createElement(LazyLog, {
774
- text: buildLog.length === 0 ? "Waiting for logs..." : buildLog.join("\n"),
775
- extraLines: 1,
776
- follow: true,
777
- selectableLines: true,
778
- enableSearch: true
779
- }));
780
- };
781
- const TechDocsBuildLogs = ({buildLog}) => {
782
- const classes = useDrawerStyles();
783
- const [open, setOpen] = useState(false);
784
- return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Button$1, {
785
- color: "inherit",
786
- onClick: () => setOpen(true)
787
- }, "Show Build Logs"), /* @__PURE__ */ React.createElement(Drawer, {
788
- classes: {paper: classes.paper},
789
- anchor: "right",
790
- open,
791
- onClose: () => setOpen(false)
792
- }, /* @__PURE__ */ React.createElement(TechDocsBuildLogsDrawerContent, {
793
- buildLog,
794
- onClose: () => setOpen(false)
795
- })));
796
- };
797
-
798
- const TechDocsNotFound = ({errorMessage}) => {
799
- const techdocsBuilder = useApi(configApiRef).getOptionalString("techdocs.builder");
800
- let additionalInfo = "";
801
- if (techdocsBuilder !== "local") {
802
- additionalInfo = "Note that techdocs.builder is not set to 'local' in your config, which means this Backstage app will not generate docs if they are not found. Make sure the project's docs are generated and published by some external process (e.g. CI/CD pipeline). Or change techdocs.builder to 'local' to generate docs from this Backstage instance.";
803
- }
804
- return /* @__PURE__ */ React__default.createElement(ErrorPage, {
805
- status: "404",
806
- statusMessage: errorMessage || "Documentation not found",
807
- additionalInfo
808
- });
809
- };
810
-
811
745
  const buildInitialFilters = (legacyPaths, entityId) => {
812
746
  return legacyPaths ? entityId : Object.entries(entityId).reduce((acc, [key, value]) => {
813
- return {...acc, [key]: value.toLocaleLowerCase("en-US")};
747
+ return {...acc, [key]: value == null ? void 0 : value.toLocaleLowerCase("en-US")};
814
748
  }, {});
815
749
  };
816
750
  const TechDocsSearchBar = ({
@@ -919,6 +853,161 @@ const TechDocsSearch = (props) => {
919
853
  }));
920
854
  };
921
855
 
856
+ const useDrawerStyles = makeStyles((theme) => createStyles({
857
+ paper: {
858
+ width: "100%",
859
+ [theme.breakpoints.up("sm")]: {
860
+ width: "75%"
861
+ },
862
+ [theme.breakpoints.up("md")]: {
863
+ width: "50%"
864
+ },
865
+ padding: theme.spacing(2.5)
866
+ },
867
+ root: {
868
+ height: "100%",
869
+ overflow: "hidden"
870
+ }
871
+ }));
872
+ const TechDocsBuildLogsDrawerContent = ({
873
+ buildLog,
874
+ onClose
875
+ }) => {
876
+ const classes = useDrawerStyles();
877
+ return /* @__PURE__ */ React.createElement(Grid, {
878
+ container: true,
879
+ direction: "column",
880
+ className: classes.root,
881
+ spacing: 0,
882
+ wrap: "nowrap"
883
+ }, /* @__PURE__ */ React.createElement(Grid, {
884
+ item: true,
885
+ container: true,
886
+ justifyContent: "space-between",
887
+ alignItems: "center",
888
+ spacing: 0,
889
+ wrap: "nowrap"
890
+ }, /* @__PURE__ */ React.createElement(Typography, {
891
+ variant: "h5"
892
+ }, "Build Details"), /* @__PURE__ */ React.createElement(IconButton, {
893
+ key: "dismiss",
894
+ title: "Close the drawer",
895
+ onClick: onClose,
896
+ color: "inherit"
897
+ }, /* @__PURE__ */ React.createElement(Close, null))), /* @__PURE__ */ React.createElement(LazyLog, {
898
+ text: buildLog.length === 0 ? "Waiting for logs..." : buildLog.join("\n"),
899
+ extraLines: 1,
900
+ follow: true,
901
+ selectableLines: true,
902
+ enableSearch: true
903
+ }));
904
+ };
905
+ const TechDocsBuildLogs = ({buildLog}) => {
906
+ const classes = useDrawerStyles();
907
+ const [open, setOpen] = useState(false);
908
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Button$1, {
909
+ color: "inherit",
910
+ onClick: () => setOpen(true)
911
+ }, "Show Build Logs"), /* @__PURE__ */ React.createElement(Drawer, {
912
+ classes: {paper: classes.paper},
913
+ anchor: "right",
914
+ open,
915
+ onClose: () => setOpen(false)
916
+ }, /* @__PURE__ */ React.createElement(TechDocsBuildLogsDrawerContent, {
917
+ buildLog,
918
+ onClose: () => setOpen(false)
919
+ })));
920
+ };
921
+
922
+ const TechDocsNotFound = ({errorMessage}) => {
923
+ const techdocsBuilder = useApi(configApiRef).getOptionalString("techdocs.builder");
924
+ let additionalInfo = "";
925
+ if (techdocsBuilder !== "local") {
926
+ additionalInfo = "Note that techdocs.builder is not set to 'local' in your config, which means this Backstage app will not generate docs if they are not found. Make sure the project's docs are generated and published by some external process (e.g. CI/CD pipeline). Or change techdocs.builder to 'local' to generate docs from this Backstage instance.";
927
+ }
928
+ return /* @__PURE__ */ React__default.createElement(ErrorPage, {
929
+ status: "404",
930
+ statusMessage: errorMessage || "Documentation not found",
931
+ additionalInfo
932
+ });
933
+ };
934
+
935
+ const useStyles$1 = makeStyles(() => ({
936
+ message: {
937
+ wordBreak: "break-word",
938
+ overflowWrap: "anywhere"
939
+ }
940
+ }));
941
+ const TechDocsStateIndicator = () => {
942
+ let StateAlert = null;
943
+ const classes = useStyles$1();
944
+ const {
945
+ state,
946
+ contentReload,
947
+ contentErrorMessage,
948
+ syncErrorMessage,
949
+ buildLog
950
+ } = useTechDocsReader();
951
+ const ReaderProgress = state === "CHECKING" ? /* @__PURE__ */ React__default.createElement(Progress, null) : null;
952
+ if (state === "INITIAL_BUILD") {
953
+ StateAlert = /* @__PURE__ */ React__default.createElement(Alert, {
954
+ variant: "outlined",
955
+ severity: "info",
956
+ icon: /* @__PURE__ */ React__default.createElement(CircularProgress, {
957
+ size: "24px"
958
+ }),
959
+ action: /* @__PURE__ */ React__default.createElement(TechDocsBuildLogs, {
960
+ buildLog
961
+ })
962
+ }, "Documentation is accessed for the first time and is being prepared. The subsequent loads are much faster.");
963
+ }
964
+ if (state === "CONTENT_STALE_REFRESHING") {
965
+ StateAlert = /* @__PURE__ */ React__default.createElement(Alert, {
966
+ variant: "outlined",
967
+ severity: "info",
968
+ icon: /* @__PURE__ */ React__default.createElement(CircularProgress, {
969
+ size: "24px"
970
+ }),
971
+ action: /* @__PURE__ */ React__default.createElement(TechDocsBuildLogs, {
972
+ buildLog
973
+ })
974
+ }, "A newer version of this documentation is being prepared and will be available shortly.");
975
+ }
976
+ if (state === "CONTENT_STALE_READY") {
977
+ StateAlert = /* @__PURE__ */ React__default.createElement(Alert, {
978
+ variant: "outlined",
979
+ severity: "success",
980
+ action: /* @__PURE__ */ React__default.createElement(Button$1, {
981
+ color: "inherit",
982
+ onClick: () => contentReload()
983
+ }, "Refresh")
984
+ }, "A newer version of this documentation is now available, please refresh to view.");
985
+ }
986
+ if (state === "CONTENT_STALE_ERROR") {
987
+ StateAlert = /* @__PURE__ */ React__default.createElement(Alert, {
988
+ variant: "outlined",
989
+ severity: "error",
990
+ action: /* @__PURE__ */ React__default.createElement(TechDocsBuildLogs, {
991
+ buildLog
992
+ }),
993
+ classes: {message: classes.message}
994
+ }, "Building a newer version of this documentation failed.", " ", syncErrorMessage);
995
+ }
996
+ if (state === "CONTENT_NOT_FOUND") {
997
+ StateAlert = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, syncErrorMessage && /* @__PURE__ */ React__default.createElement(Alert, {
998
+ variant: "outlined",
999
+ severity: "error",
1000
+ action: /* @__PURE__ */ React__default.createElement(TechDocsBuildLogs, {
1001
+ buildLog
1002
+ }),
1003
+ classes: {message: classes.message}
1004
+ }, "Building a newer version of this documentation failed.", " ", syncErrorMessage), /* @__PURE__ */ React__default.createElement(TechDocsNotFound, {
1005
+ errorMessage: contentErrorMessage
1006
+ }));
1007
+ }
1008
+ return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, ReaderProgress, StateAlert);
1009
+ };
1010
+
922
1011
  function calculateDisplayState({
923
1012
  contentLoading,
924
1013
  content,
@@ -1066,10 +1155,6 @@ function useReaderState(kind, namespace, name, path) {
1066
1155
  }
1067
1156
 
1068
1157
  const useStyles = makeStyles((theme) => ({
1069
- message: {
1070
- wordBreak: "break-word",
1071
- overflowWrap: "anywhere"
1072
- },
1073
1158
  searchBar: {
1074
1159
  marginLeft: "20rem",
1075
1160
  maxWidth: "calc(100% - 20rem * 2 - 3rem)",
@@ -1080,36 +1165,36 @@ const useStyles = makeStyles((theme) => ({
1080
1165
  }
1081
1166
  }
1082
1167
  }));
1083
- const Reader = ({entityRef, onReady, withSearch = true}) => {
1084
- var _a, _b;
1085
- const {kind, namespace, name} = entityRef;
1168
+ const TechDocsReaderContext = createContext({});
1169
+ const TechDocsReaderProvider = ({children}) => {
1170
+ const {namespace = "", kind = "", name = "", "*": path} = useParams();
1171
+ const value = useReaderState(kind, namespace, name, path);
1172
+ return /* @__PURE__ */ React__default.createElement(TechDocsReaderContext.Provider, {
1173
+ value
1174
+ }, children);
1175
+ };
1176
+ const withTechDocsReaderProvider = (Component) => (props) => /* @__PURE__ */ React__default.createElement(TechDocsReaderProvider, null, /* @__PURE__ */ React__default.createElement(Component, {
1177
+ ...props
1178
+ }));
1179
+ const useTechDocsReader = () => useContext(TechDocsReaderContext);
1180
+ const useTechDocsReaderDom = () => {
1181
+ const navigate = useNavigate$1();
1086
1182
  const theme = useTheme();
1087
- const classes = useStyles();
1088
- const {
1089
- state,
1090
- path,
1091
- contentReload,
1092
- content: rawPage,
1093
- contentErrorMessage,
1094
- syncErrorMessage,
1095
- buildLog
1096
- } = useReaderState(kind, namespace, name, useParams()["*"]);
1097
1183
  const techdocsStorageApi = useApi(techdocsStorageApiRef);
1098
- const [sidebars, setSidebars] = useState();
1099
- const navigate = useNavigate$1();
1100
- const shadowDomRef = useRef(null);
1101
1184
  const scmIntegrationsApi = useApi(scmIntegrationsApiRef);
1185
+ const {namespace = "", kind = "", name = ""} = useParams();
1186
+ const {state, path, content: rawPage} = useTechDocsReader();
1187
+ const [sidebars, setSidebars] = useState();
1188
+ const [dom, setDom] = useState(null);
1102
1189
  const updateSidebarPosition = useCallback(() => {
1103
- if (!!shadowDomRef.current && !!sidebars) {
1104
- const shadowDiv = shadowDomRef.current;
1105
- const shadowRoot = shadowDiv.shadowRoot || shadowDiv.attachShadow({mode: "open"});
1106
- const mdTabs = shadowRoot.querySelector(".md-container > .md-tabs");
1107
- sidebars.forEach((sidebar) => {
1108
- const newTop = Math.max(shadowDomRef.current.getBoundingClientRect().top, 0);
1109
- sidebar.style.top = mdTabs ? `${newTop + mdTabs.getBoundingClientRect().height}px` : `${newTop}px`;
1110
- });
1111
- }
1112
- }, [shadowDomRef, sidebars]);
1190
+ if (!dom || !sidebars)
1191
+ return;
1192
+ const mdTabs = dom.querySelector(".md-container > .md-tabs");
1193
+ sidebars.forEach((sidebar) => {
1194
+ const newTop = Math.max(dom.getBoundingClientRect().top, 0);
1195
+ sidebar.style.top = mdTabs ? `${newTop + mdTabs.getBoundingClientRect().height}px` : `${newTop}px`;
1196
+ });
1197
+ }, [dom, sidebars]);
1113
1198
  useEffect(() => {
1114
1199
  updateSidebarPosition();
1115
1200
  window.addEventListener("scroll", updateSidebarPosition, true);
@@ -1136,106 +1221,106 @@ const Reader = ({entityRef, onReady, withSearch = true}) => {
1136
1221
  addGitFeedbackLink(scmIntegrationsApi),
1137
1222
  injectCss({
1138
1223
  css: `
1139
- body {
1140
- font-family: ${theme.typography.fontFamily};
1141
- --md-text-color: ${theme.palette.text.primary};
1142
- --md-text-link-color: ${theme.palette.primary.main};
1224
+ body {
1225
+ font-family: ${theme.typography.fontFamily};
1226
+ --md-text-color: ${theme.palette.text.primary};
1227
+ --md-text-link-color: ${theme.palette.primary.main};
1143
1228
 
1144
- --md-code-fg-color: ${theme.palette.text.primary};
1145
- --md-code-bg-color: ${theme.palette.background.paper};
1146
- }
1147
- .md-main__inner { margin-top: 0; }
1148
- .md-sidebar { position: fixed; bottom: 100px; width: 20rem; }
1149
- .md-sidebar--secondary { right: 2rem; }
1150
- .md-content { margin-bottom: 50px }
1151
- .md-footer { position: fixed; bottom: 0px; width: 100vw; }
1152
- .md-footer-nav__link { width: 20rem;}
1153
- .md-content { margin-left: 20rem; max-width: calc(100% - 20rem * 2 - 3rem); }
1154
- .md-typeset { font-size: 1rem; }
1155
- .md-nav { font-size: 1rem; }
1156
- .md-grid { max-width: 90vw; margin: 0 }
1157
- .md-typeset table:not([class]) {
1158
- font-size: 1rem;
1159
- border: 1px solid ${theme.palette.text.primary};
1160
- border-bottom: none;
1161
- border-collapse: collapse;
1162
- }
1163
- .md-typeset table:not([class]) td, .md-typeset table:not([class]) th {
1164
- border-bottom: 1px solid ${theme.palette.text.primary};
1165
- }
1166
- .md-typeset table:not([class]) th { font-weight: bold; }
1167
- .md-typeset .admonition, .md-typeset details {
1168
- font-size: 1rem;
1169
- }
1170
- @media screen and (max-width: 76.1875em) {
1171
- .md-nav {
1172
- background-color: ${theme.palette.background.default};
1173
- transition: none !important
1229
+ --md-code-fg-color: ${theme.palette.text.primary};
1230
+ --md-code-bg-color: ${theme.palette.background.paper};
1174
1231
  }
1175
- .md-sidebar--secondary { display: none; }
1176
- .md-sidebar--primary { left: 72px; width: 10rem }
1177
- .md-content { margin-left: 10rem; max-width: calc(100% - 10rem); }
1178
- .md-content__inner { font-size: 0.9rem }
1179
- .md-footer {
1180
- position: static;
1181
- margin-left: 10rem;
1182
- width: calc(100% - 10rem);
1232
+ .md-main__inner { margin-top: 0; }
1233
+ .md-sidebar { position: fixed; bottom: 100px; width: 20rem; }
1234
+ .md-sidebar--secondary { right: 2rem; }
1235
+ .md-content { margin-bottom: 50px }
1236
+ .md-footer { position: fixed; bottom: 0px; width: 100vw; }
1237
+ .md-footer-nav__link { width: 20rem;}
1238
+ .md-content { margin-left: 20rem; max-width: calc(100% - 20rem * 2 - 3rem); }
1239
+ .md-typeset { font-size: 1rem; }
1240
+ .md-nav { font-size: 1rem; }
1241
+ .md-grid { max-width: 90vw; margin: 0 }
1242
+ .md-typeset table:not([class]) {
1243
+ font-size: 1rem;
1244
+ border: 1px solid ${theme.palette.text.primary};
1245
+ border-bottom: none;
1246
+ border-collapse: collapse;
1183
1247
  }
1184
- .md-nav--primary .md-nav__title {
1185
- white-space: normal;
1186
- height: auto;
1187
- line-height: 1rem;
1188
- cursor: auto;
1248
+ .md-typeset table:not([class]) td, .md-typeset table:not([class]) th {
1249
+ border-bottom: 1px solid ${theme.palette.text.primary};
1189
1250
  }
1190
- .md-nav--primary > .md-nav__title [for="none"] {
1191
- padding-top: 0;
1251
+ .md-typeset table:not([class]) th { font-weight: bold; }
1252
+ .md-typeset .admonition, .md-typeset details {
1253
+ font-size: 1rem;
1192
1254
  }
1193
- }
1194
- `
1255
+ @media screen and (max-width: 76.1875em) {
1256
+ .md-nav {
1257
+ background-color: ${theme.palette.background.default};
1258
+ transition: none !important
1259
+ }
1260
+ .md-sidebar--secondary { display: none; }
1261
+ .md-sidebar--primary { left: 72px; width: 10rem }
1262
+ .md-content { margin-left: 10rem; max-width: calc(100% - 10rem); }
1263
+ .md-content__inner { font-size: 0.9rem }
1264
+ .md-footer {
1265
+ position: static;
1266
+ margin-left: 10rem;
1267
+ width: calc(100% - 10rem);
1268
+ }
1269
+ .md-nav--primary .md-nav__title {
1270
+ white-space: normal;
1271
+ height: auto;
1272
+ line-height: 1rem;
1273
+ cursor: auto;
1274
+ }
1275
+ .md-nav--primary > .md-nav__title [for="none"] {
1276
+ padding-top: 0;
1277
+ }
1278
+ }
1279
+ `
1195
1280
  }),
1196
1281
  injectCss({
1197
1282
  css: `
1198
- .md-nav__link, .md-typeset a, .md-typeset a::before, .md-typeset .headerlink {
1199
- transition: none;
1200
- }
1201
- `
1283
+ .md-nav__link, .md-typeset a, .md-typeset a::before, .md-typeset .headerlink {
1284
+ transition: none;
1285
+ }
1286
+ `
1202
1287
  }),
1203
1288
  injectCss({
1204
1289
  css: `
1205
- .md-typeset pre > code::-webkit-scrollbar-thumb {
1206
- background-color: hsla(0, 0%, 0%, 0.32);
1207
- }
1208
- .md-typeset pre > code::-webkit-scrollbar-thumb:hover {
1209
- background-color: hsla(0, 0%, 0%, 0.87);
1210
- }
1290
+ .md-typeset pre > code::-webkit-scrollbar-thumb {
1291
+ background-color: hsla(0, 0%, 0%, 0.32);
1292
+ }
1293
+ .md-typeset pre > code::-webkit-scrollbar-thumb:hover {
1294
+ background-color: hsla(0, 0%, 0%, 0.87);
1295
+ }
1211
1296
  `
1212
1297
  }),
1213
1298
  injectCss({
1214
1299
  css: `
1215
- :host {
1216
- --md-admonition-icon--note: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"/></svg>');
1217
- --md-admonition-icon--abstract: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 5h16v2H4V5m0 4h16v2H4V9m0 4h16v2H4v-2m0 4h10v2H4v-2z"/></svg>');
1218
- --md-admonition-icon--info: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 9h-2V7h2m0 10h-2v-6h2m-1-9A10 10 0 002 12a10 10 0 0010 10 10 10 0 0010-10A10 10 0 0012 2z"/></svg>');
1219
- --md-admonition-icon--tip: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17.55 11.2c-.23-.3-.5-.56-.76-.82-.65-.6-1.4-1.03-2.03-1.66C13.3 7.26 13 4.85 13.91 3c-.91.23-1.75.75-2.45 1.32-2.54 2.08-3.54 5.75-2.34 8.9.04.1.08.2.08.33 0 .22-.15.42-.35.5-.22.1-.46.04-.64-.12a.83.83 0 01-.15-.17c-1.1-1.43-1.28-3.48-.53-5.12C5.89 10 5 12.3 5.14 14.47c.04.5.1 1 .27 1.5.14.6.4 1.2.72 1.73 1.04 1.73 2.87 2.97 4.84 3.22 2.1.27 4.35-.12 5.96-1.6 1.8-1.66 2.45-4.32 1.5-6.6l-.13-.26c-.2-.46-.47-.87-.8-1.25l.05-.01m-3.1 6.3c-.28.24-.73.5-1.08.6-1.1.4-2.2-.16-2.87-.82 1.19-.28 1.89-1.16 2.09-2.05.17-.8-.14-1.46-.27-2.23-.12-.74-.1-1.37.18-2.06.17.38.37.76.6 1.06.76 1 1.95 1.44 2.2 2.8.04.14.06.28.06.43.03.82-.32 1.72-.92 2.27h.01z"/></svg>');
1220
- --md-admonition-icon--success: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2m-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>');
1221
- --md-admonition-icon--question: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.07 11.25l-.9.92C13.45 12.89 13 13.5 13 15h-2v-.5c0-1.11.45-2.11 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41a2 2 0 00-2-2 2 2 0 00-2 2H8a4 4 0 014-4 4 4 0 014 4 3.2 3.2 0 01-.93 2.25M13 19h-2v-2h2M12 2A10 10 0 002 12a10 10 0 0010 10 10 10 0 0010-10c0-5.53-4.5-10-10-10z"/></svg>');
1222
- --md-admonition-icon--warning: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 14h-2v-4h2m0 8h-2v-2h2M1 21h22L12 2 1 21z"/></svg>');
1223
- --md-admonition-icon--failure: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2c5.53 0 10 4.47 10 10s-4.47 10-10 10S2 17.53 2 12 6.47 2 12 2m3.59 5L12 10.59 8.41 7 7 8.41 10.59 12 7 15.59 8.41 17 12 13.41 15.59 17 17 15.59 13.41 12 17 8.41 15.59 7z"/></svg>');
1224
- --md-admonition-icon--danger: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.5 20l4.86-9.73H13V4l-5 9.73h3.5V20M12 2c2.75 0 5.1 1 7.05 2.95C21 6.9 22 9.25 22 12s-1 5.1-2.95 7.05C17.1 21 14.75 22 12 22s-5.1-1-7.05-2.95C3 17.1 2 14.75 2 12s1-5.1 2.95-7.05C6.9 3 9.25 2 12 2z"/></svg>');
1225
- --md-admonition-icon--bug: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14 12h-4v-2h4m0 6h-4v-2h4m6-6h-2.81a5.985 5.985 0 00-1.82-1.96L17 4.41 15.59 3l-2.17 2.17a6.002 6.002 0 00-2.83 0L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8z"/></svg>');
1226
- --md-admonition-icon--example: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 13v-2h14v2H7m0 6v-2h14v2H7M7 7V5h14v2H7M3 8V5H2V4h2v4H3m-1 9v-1h3v4H2v-1h2v-.5H3v-1h1V17H2m2.25-7a.75.75 0 01.75.75c0 .2-.08.39-.21.52L3.12 13H5v1H2v-.92L4 11H2v-1h2.25z"/></svg>');
1227
- --md-admonition-icon--quote: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14 17h3l2-4V7h-6v6h3M6 17h3l2-4V7H5v6h3l-2 4z"/></svg>');
1228
- }
1229
- :host {
1230
- --md-footnotes-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 7v4H5.83l3.58-3.59L8 6l-6 6 6 6 1.41-1.42L5.83 13H21V7h-2z"/></svg>');
1231
- }
1232
- :host {
1233
- --md-details-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.59 16.58L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.42z"/></svg>');
1234
- }
1235
- :host {
1236
- --md-tasklist-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2A10 10 0 002 12a10 10 0 0010 10 10 10 0 0010-10A10 10 0 0012 2z"/></svg>');
1237
- --md-tasklist-icon--checked: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2m-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>');
1238
- }
1300
+ :host {
1301
+ --md-admonition-icon--note: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"/></svg>');
1302
+ --md-admonition-icon--abstract: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 5h16v2H4V5m0 4h16v2H4V9m0 4h16v2H4v-2m0 4h10v2H4v-2z"/></svg>');
1303
+ --md-admonition-icon--info: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 9h-2V7h2m0 10h-2v-6h2m-1-9A10 10 0 002 12a10 10 0 0010 10 10 10 0 0010-10A10 10 0 0012 2z"/></svg>');
1304
+ --md-admonition-icon--tip: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17.55 11.2c-.23-.3-.5-.56-.76-.82-.65-.6-1.4-1.03-2.03-1.66C13.3 7.26 13 4.85 13.91 3c-.91.23-1.75.75-2.45 1.32-2.54 2.08-3.54 5.75-2.34 8.9.04.1.08.2.08.33 0 .22-.15.42-.35.5-.22.1-.46.04-.64-.12a.83.83 0 01-.15-.17c-1.1-1.43-1.28-3.48-.53-5.12C5.89 10 5 12.3 5.14 14.47c.04.5.1 1 .27 1.5.14.6.4 1.2.72 1.73 1.04 1.73 2.87 2.97 4.84 3.22 2.1.27 4.35-.12 5.96-1.6 1.8-1.66 2.45-4.32 1.5-6.6l-.13-.26c-.2-.46-.47-.87-.8-1.25l.05-.01m-3.1 6.3c-.28.24-.73.5-1.08.6-1.1.4-2.2-.16-2.87-.82 1.19-.28 1.89-1.16 2.09-2.05.17-.8-.14-1.46-.27-2.23-.12-.74-.1-1.37.18-2.06.17.38.37.76.6 1.06.76 1 1.95 1.44 2.2 2.8.04.14.06.28.06.43.03.82-.32 1.72-.92 2.27h.01z"/></svg>');
1305
+ --md-admonition-icon--success: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2m-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>');
1306
+ --md-admonition-icon--question: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.07 11.25l-.9.92C13.45 12.89 13 13.5 13 15h-2v-.5c0-1.11.45-2.11 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41a2 2 0 00-2-2 2 2 0 00-2 2H8a4 4 0 014-4 4 4 0 014 4 3.2 3.2 0 01-.93 2.25M13 19h-2v-2h2M12 2A10 10 0 002 12a10 10 0 0010 10 10 10 0 0010-10c0-5.53-4.5-10-10-10z"/></svg>');
1307
+ --md-admonition-icon--warning: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 14h-2v-4h2m0 8h-2v-2h2M1 21h22L12 2 1 21z"/></svg>');
1308
+ --md-admonition-icon--failure: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2c5.53 0 10 4.47 10 10s-4.47 10-10 10S2 17.53 2 12 6.47 2 12 2m3.59 5L12 10.59 8.41 7 7 8.41 10.59 12 7 15.59 8.41 17 12 13.41 15.59 17 17 15.59 13.41 12 17 8.41 15.59 7z"/></svg>');
1309
+ --md-admonition-icon--danger: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.5 20l4.86-9.73H13V4l-5 9.73h3.5V20M12 2c2.75 0 5.1 1 7.05 2.95C21 6.9 22 9.25 22 12s-1 5.1-2.95 7.05C17.1 21 14.75 22 12 22s-5.1-1-7.05-2.95C3 17.1 2 14.75 2 12s1-5.1 2.95-7.05C6.9 3 9.25 2 12 2z"/></svg>');
1310
+ --md-admonition-icon--bug: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14 12h-4v-2h4m0 6h-4v-2h4m6-6h-2.81a5.985 5.985 0 00-1.82-1.96L17 4.41 15.59 3l-2.17 2.17a6.002 6.002 0 00-2.83 0L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8z"/></svg>');
1311
+ --md-admonition-icon--example: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 13v-2h14v2H7m0 6v-2h14v2H7M7 7V5h14v2H7M3 8V5H2V4h2v4H3m-1 9v-1h3v4H2v-1h2v-.5H3v-1h1V17H2m2.25-7a.75.75 0 01.75.75c0 .2-.08.39-.21.52L3.12 13H5v1H2v-.92L4 11H2v-1h2.25z"/></svg>');
1312
+ --md-admonition-icon--quote: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14 17h3l2-4V7h-6v6h3M6 17h3l2-4V7H5v6h3l-2 4z"/></svg>');
1313
+ }
1314
+ :host {
1315
+ --md-footnotes-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 7v4H5.83l3.58-3.59L8 6l-6 6 6 6 1.41-1.42L5.83 13H21V7h-2z"/></svg>');
1316
+ }
1317
+ :host {
1318
+ --md-details-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.59 16.58L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.42z"/></svg>');
1319
+ }
1320
+ :host {
1321
+ --md-tasklist-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2A10 10 0 002 12a10 10 0 0010 10 10 10 0 0010-10A10 10 0 0012 2z"/></svg>');
1322
+ --md-tasklist-icon--checked: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2m-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>');
1323
+ }
1239
1324
  `
1240
1325
  })
1241
1326
  ]), [
@@ -1250,25 +1335,16 @@ const Reader = ({entityRef, onReady, withSearch = true}) => {
1250
1335
  theme.palette.text.primary,
1251
1336
  theme.typography.fontFamily
1252
1337
  ]);
1253
- const postRender = useCallback(async (shadowRoot) => transform(shadowRoot.children[0], [
1254
- (dom) => {
1255
- setTimeout(() => {
1256
- var _a2;
1257
- if (window.location.hash) {
1258
- const hash = window.location.hash.slice(1);
1259
- (_a2 = shadowRoot == null ? void 0 : shadowRoot.getElementById(hash)) == null ? void 0 : _a2.scrollIntoView();
1260
- }
1261
- }, 200);
1262
- return dom;
1263
- },
1338
+ const postRender = useCallback(async (transformedElement) => transform(transformedElement, [
1339
+ scrollIntoAnchor(),
1264
1340
  addLinkClickListener({
1265
1341
  baseUrl: window.location.origin,
1266
1342
  onClick: (_, url) => {
1267
- var _a2;
1343
+ var _a;
1268
1344
  const parsedUrl = new URL(url);
1269
1345
  if (parsedUrl.hash) {
1270
1346
  navigate(`${parsedUrl.pathname}${parsedUrl.hash}`);
1271
- (_a2 = shadowRoot == null ? void 0 : shadowRoot.getElementById(parsedUrl.hash.slice(1))) == null ? void 0 : _a2.scrollIntoView();
1347
+ (_a = transformedElement == null ? void 0 : transformedElement.querySelector(`#${parsedUrl.hash.slice(1)}`)) == null ? void 0 : _a.scrollIntoView();
1272
1348
  } else {
1273
1349
  navigate(parsedUrl.pathname);
1274
1350
  }
@@ -1276,96 +1352,59 @@ const Reader = ({entityRef, onReady, withSearch = true}) => {
1276
1352
  }),
1277
1353
  onCssReady({
1278
1354
  docStorageUrl: await techdocsStorageApi.getApiOrigin(),
1279
- onLoading: (dom) => {
1280
- dom.style.setProperty("opacity", "0");
1355
+ onLoading: (renderedElement) => {
1356
+ renderedElement.style.setProperty("opacity", "0");
1281
1357
  },
1282
- onLoaded: (dom) => {
1283
- var _a2;
1284
- dom.style.removeProperty("opacity");
1285
- (_a2 = dom.querySelector(".md-nav__title")) == null ? void 0 : _a2.removeAttribute("for");
1286
- const sideDivs = Array.from(shadowRoot.querySelectorAll(".md-sidebar"));
1287
- setSidebars(sideDivs);
1288
- const docTopPosition = dom.getBoundingClientRect().top;
1289
- const mdTabs = dom.querySelector(".md-container > .md-tabs");
1290
- sideDivs.forEach((sidebar) => {
1291
- sidebar.style.top = mdTabs ? `${docTopPosition + mdTabs.getBoundingClientRect().height}px` : `${docTopPosition}px`;
1292
- });
1358
+ onLoaded: (renderedElement) => {
1359
+ var _a;
1360
+ renderedElement.style.removeProperty("opacity");
1361
+ (_a = renderedElement.querySelector(".md-nav__title")) == null ? void 0 : _a.removeAttribute("for");
1362
+ setSidebars(Array.from(renderedElement.querySelectorAll(".md-sidebar")));
1293
1363
  }
1294
1364
  })
1295
1365
  ]), [navigate, techdocsStorageApi]);
1296
1366
  useEffect(() => {
1297
- var _a2;
1298
- if (!rawPage || !shadowDomRef.current) {
1299
- if ((_a2 = shadowDomRef.current) == null ? void 0 : _a2.shadowRoot) {
1300
- shadowDomRef.current.shadowRoot.innerHTML = "";
1301
- }
1367
+ if (!rawPage)
1302
1368
  return () => {
1303
1369
  };
1304
- }
1305
- if (onReady) {
1306
- onReady();
1307
- }
1308
1370
  let shouldReplaceContent = true;
1309
- preRender(rawPage, path).then(async (transformedElement) => {
1310
- if (!(transformedElement == null ? void 0 : transformedElement.innerHTML)) {
1371
+ preRender(rawPage, path).then(async (preTransformedDomElement) => {
1372
+ if (!(preTransformedDomElement == null ? void 0 : preTransformedDomElement.innerHTML)) {
1311
1373
  return;
1312
1374
  }
1313
1375
  if (!shouldReplaceContent) {
1314
1376
  return;
1315
1377
  }
1316
- const shadowDiv = shadowDomRef.current;
1317
- const shadowRoot = shadowDiv.shadowRoot || shadowDiv.attachShadow({mode: "open"});
1318
- Array.from(shadowRoot.children).forEach((child) => shadowRoot.removeChild(child));
1319
- shadowRoot.appendChild(transformedElement);
1320
1378
  window.scroll({top: 0});
1321
- await postRender(shadowRoot);
1379
+ const postTransformedDomElement = await postRender(preTransformedDomElement);
1380
+ setDom(postTransformedDomElement);
1322
1381
  });
1323
1382
  return () => {
1324
1383
  shouldReplaceContent = false;
1325
1384
  };
1326
- }, [onReady, path, postRender, preRender, rawPage]);
1327
- return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, state === "CHECKING" && /* @__PURE__ */ React__default.createElement(Progress, null), state === "INITIAL_BUILD" && /* @__PURE__ */ React__default.createElement(Alert, {
1328
- variant: "outlined",
1329
- severity: "info",
1330
- icon: /* @__PURE__ */ React__default.createElement(CircularProgress, {
1331
- size: "24px"
1332
- }),
1333
- action: /* @__PURE__ */ React__default.createElement(TechDocsBuildLogs, {
1334
- buildLog
1335
- })
1336
- }, "Documentation is accessed for the first time and is being prepared. The subsequent loads are much faster."), state === "CONTENT_STALE_REFRESHING" && /* @__PURE__ */ React__default.createElement(Alert, {
1337
- variant: "outlined",
1338
- severity: "info",
1339
- icon: /* @__PURE__ */ React__default.createElement(CircularProgress, {
1340
- size: "24px"
1341
- }),
1342
- action: /* @__PURE__ */ React__default.createElement(TechDocsBuildLogs, {
1343
- buildLog
1344
- })
1345
- }, "A newer version of this documentation is being prepared and will be available shortly."), state === "CONTENT_STALE_READY" && /* @__PURE__ */ React__default.createElement(Alert, {
1346
- variant: "outlined",
1347
- severity: "success",
1348
- action: /* @__PURE__ */ React__default.createElement(Button$1, {
1349
- color: "inherit",
1350
- onClick: () => contentReload()
1351
- }, "Refresh")
1352
- }, "A newer version of this documentation is now available, please refresh to view."), state === "CONTENT_STALE_ERROR" && /* @__PURE__ */ React__default.createElement(Alert, {
1353
- variant: "outlined",
1354
- severity: "error",
1355
- action: /* @__PURE__ */ React__default.createElement(TechDocsBuildLogs, {
1356
- buildLog
1357
- }),
1358
- classes: {message: classes.message}
1359
- }, "Building a newer version of this documentation failed.", " ", syncErrorMessage), state === "CONTENT_NOT_FOUND" && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, syncErrorMessage && /* @__PURE__ */ React__default.createElement(Alert, {
1360
- variant: "outlined",
1361
- severity: "error",
1362
- action: /* @__PURE__ */ React__default.createElement(TechDocsBuildLogs, {
1363
- buildLog
1364
- }),
1365
- classes: {message: classes.message}
1366
- }, "Building a newer version of this documentation failed.", " ", syncErrorMessage), /* @__PURE__ */ React__default.createElement(TechDocsNotFound, {
1367
- errorMessage: contentErrorMessage
1368
- })), withSearch && ((_b = (_a = shadowDomRef == null ? void 0 : shadowDomRef.current) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.innerHTML) && /* @__PURE__ */ React__default.createElement(Grid, {
1385
+ }, [rawPage, path, preRender, postRender]);
1386
+ return dom;
1387
+ };
1388
+ const TheReader = ({
1389
+ entityRef,
1390
+ onReady = () => {
1391
+ },
1392
+ withSearch = true
1393
+ }) => {
1394
+ var _a, _b;
1395
+ const classes = useStyles();
1396
+ const dom = useTechDocsReaderDom();
1397
+ const shadowDomRef = useRef(null);
1398
+ useEffect(() => {
1399
+ if (!dom || !shadowDomRef.current)
1400
+ return;
1401
+ const shadowDiv = shadowDomRef.current;
1402
+ const shadowRoot = shadowDiv.shadowRoot || shadowDiv.attachShadow({mode: "open"});
1403
+ Array.from(shadowRoot.children).forEach((child) => shadowRoot.removeChild(child));
1404
+ shadowRoot.appendChild(dom);
1405
+ onReady();
1406
+ }, [dom, onReady]);
1407
+ return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(TechDocsStateIndicator, null), withSearch && ((_b = (_a = shadowDomRef == null ? void 0 : shadowDomRef.current) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.innerHTML) && /* @__PURE__ */ React__default.createElement(Grid, {
1369
1408
  container: true,
1370
1409
  className: classes.searchBar
1371
1410
  }, /* @__PURE__ */ React__default.createElement(TechDocsSearch, {
@@ -1375,6 +1414,16 @@ const Reader = ({entityRef, onReady, withSearch = true}) => {
1375
1414
  ref: shadowDomRef
1376
1415
  }));
1377
1416
  };
1417
+ const Reader = ({
1418
+ entityRef,
1419
+ onReady = () => {
1420
+ },
1421
+ withSearch = true
1422
+ }) => /* @__PURE__ */ React__default.createElement(TechDocsReaderProvider, null, /* @__PURE__ */ React__default.createElement(TheReader, {
1423
+ entityRef,
1424
+ onReady,
1425
+ withSearch
1426
+ }));
1378
1427
 
1379
1428
  const TechDocsPageHeader = ({
1380
1429
  entityRef,
@@ -1727,5 +1776,5 @@ var Router$1 = /*#__PURE__*/Object.freeze({
1727
1776
  EmbeddedDocsRouter: EmbeddedDocsRouter
1728
1777
  });
1729
1778
 
1730
- export { DefaultTechDocsHome, DocsCardGrid$2 as DocsCardGrid, DocsResultListItem, DocsTable, EmbeddedDocsRouter, EntityListDocsTable, EntityTechdocsContent, Reader, Router, TechDocsClient, TechDocsCustomHome$2 as TechDocsCustomHome, TechDocsIndexPage$2 as TechDocsIndexPage, TechDocsPage, TechDocsPageHeader, TechDocsPageWrapper, TechDocsPicker, TechDocsReaderPage, TechDocsStorageClient, TechdocsPage, isTechDocsAvailable, techdocsPlugin as plugin, techdocsApiRef, techdocsPlugin, techdocsStorageApiRef };
1779
+ export { DefaultTechDocsHome, DocsCardGrid$2 as DocsCardGrid, DocsResultListItem, DocsTable, EmbeddedDocsRouter, EntityListDocsTable, EntityTechdocsContent, Reader, Router, TechDocsClient, TechDocsCustomHome$2 as TechDocsCustomHome, TechDocsIndexPage$2 as TechDocsIndexPage, TechDocsPage, TechDocsPageHeader, TechDocsPageWrapper, TechDocsPicker, TechDocsReaderPage, TechDocsSearch, TechDocsStateIndicator, TechDocsStorageClient, TechdocsPage, isTechDocsAvailable, techdocsPlugin as plugin, techdocsApiRef, techdocsPlugin, techdocsStorageApiRef, useTechDocsReader, useTechDocsReaderDom, withTechDocsReaderProvider };
1731
1780
  //# sourceMappingURL=index.esm.js.map