Change node type in docs (#1766)

apps/framework-docs/src/components/language-wrappers.tsx

@@ -4,22 +4,31 @@ import { cn } from "@514labs/design-system-components/utils";
 
 interface LanguageProps {
  children: ReactNode;
+ NodeType?: "div" | "span";
 }
 
-export const TypeScript: React.FC<LanguageProps> = ({ children }) => {
+export const TypeScript: React.FC<LanguageProps> = ({
+ children,
+ NodeType = "div",
+}) => {
  const { language } = useLanguage();
  return (
- <div className={cn(language === "typescript" ? "" : "hidden")}>
+ <NodeType className={cn(language === "typescript" ? "" : "hidden")}>
  {children}
- </div>
+ </NodeType>
  );
  //return language === "typescript" ? <>{children}</> : null;
 };
 
-export const Python: React.FC<LanguageProps> = ({ children }) => {
+export const Python: React.FC<LanguageProps> = ({
+ children,
+ NodeType = "div",
+}) => {
  const { language } = useLanguage();
  return (
- <div className={cn(language === "python" ? "" : "hidden")}>{children}</div>
+ <NodeType className={cn(language === "python" ? "" : "hidden")}>
+ {children}
+ </NodeType>
  );
  //return language === "python" ? <>{children}</> : null;
 };

apps/framework-docs/src/pages/data-models/model-data.mdx

@@ -16,9 +16,11 @@ The schema defines the names and data types of the properties in your Data Model
 ### `Key<T>`
 </TypeScript>
 
-<Python>### `Key[T: (str, int)] = T`</Python>
+<Python>
+### `Key[T: (str, int)] = T`
+</Python>
 
-The <TypeScript>`Key<T>`</TypeScript><Python>`Key[T: (str, int)] = T`</Python> type is specific to Moose and is used to define a primary key for your Data Model. If your Data Model requires a composite key, you can apply the `Key` type to multiple columns.
+The <TypeScript NodeType={"span"}>`Key<T>`</TypeScript><Python NodeType={"span"}>`Key[T: (str, int)] = T`</Python> type is specific to Moose and is used to define a primary key for your Data Model. If your Data Model requires a composite key, you can apply the `Key` type to multiple columns.
 
 When provisioning the OLAP storage table, the `Key` type will be used to define the primary key. The meaning of a primary key depends on the database you are using. For instance, in Clickhouse, it will define the [primary key](https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/mergetree#primary-keys-and-indexes-in-queries) of the table.