@netfoundry/docusaurus-shared 0.0.168

package/src/components/OsTabs/OsTabs.tsx

@@ -0,0 +1,30 @@
+import React, {useState, useEffect, ReactNode, JSX} from 'react';
+import OriginalTabs from '@theme/Tabs';
+import { osName } from 'react-device-detect';
+import type { ComponentProps } from 'react';
+
+
+export type OsTabsProps = ComponentProps<typeof OriginalTabs>;
+
+export function OsTabs(props: OsTabsProps): JSX.Element {
+    const [defaultValue, setDefaultValue] = useState<string | null>(null);
+
+    useEffect(() => {
+        const tabs = ['iOS', 'Android', 'Mac OS', 'Windows', 'Linux'];
+        if (tabs.includes(osName)) {
+            setDefaultValue(osName);
+        } else {
+            setDefaultValue('Windows');
+        }
+    }, []);
+
+    return (
+        <>
+            <OriginalTabs {...props} defaultValue={defaultValue}>
+                {props.children}
+            </OriginalTabs>
+            {/* Uncomment the following line to debug the detected and selected values */}
+            {/* <h2>detected={osName}, selected={defaultValue}</h2> */}
+        </>
+    );
+}

package/src/components/OsTabs/index.ts

@@ -0,0 +1,2 @@
+export { OsTabs } from './OsTabs';
+export type { OsTabsProps } from './OsTabs';

package/src/components/StarUs/StarUs.tsx

@@ -0,0 +1,19 @@
+import React, {ReactNode} from 'react';
+import styles from './styles.module.css';
+import GitHubButton from 'react-github-btn';
+
+export type StarUsProps = {
+    repoUrl?: string;
+    label?: string;
+};
+
+export default function StarUs({repoUrl = '', label = ''}: StarUsProps): ReactNode {
+    return (
+        <div className={styles.starUsRoot}>
+            <span style={{color: "whitesmoke"}}>{label}&nbsp;</span>
+            <span style={{height: "20px"}}>
+                 <GitHubButton href={repoUrl} data-icon="octicon-star" data-show-count="true" aria-label="Star buttons/github-buttons on GitHub">Star</GitHubButton>
+            </span>
+        </div>
+    );
+}

package/src/components/StarUs/index.ts

@@ -0,0 +1,2 @@
+export { default as StarUs } from './StarUs';
+export type { StarUsProps } from './StarUs';

package/src/components/StarUs/styles.module.css

@@ -0,0 +1,6 @@
+.starUsRoot {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: linear-gradient(90deg, #0068F9FF 0%, #F4044DFF 100%);
+}

package/src/components/index.ts

@@ -0,0 +1,11 @@
+export * from './Alert'
+export * from './CodeBlock';
+export * from './Common';
+export * from './NetFoundry'
+export * from './NetFoundryFooter';
+export * from './NetFoundryHighlight';
+export * from './NetFoundryHorizontalSection';
+export * from './NetFoundryLayout';
+export * from './NetFoundryNavbarItems';
+export * from './OsTabs';
+export * from './StarUs';

package/src/css/layout.css

@@ -0,0 +1,14 @@
+html,
+body,
+#__docusaurus {
+    height: 100%;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+}
+
+.main-wrapper > div {
+    /* work around issue from docusaurus doc grow/shrinking based on content */
+    width: 100%;
+    max-width: var(--ziti-max-width);
+}