@xyo-network/react-typedoc 7.5.8 → 7.5.12

package/src/ReflectionViewer/DeclarationContainer.tsx

@@ -1,34 +0,0 @@
-import { useTheme } from '@mui/material'
-import React from 'react'
-import { useLocation } from 'react-router-dom'
-import type { DeclarationReflection } from 'typedoc'
-
-import type { ContainerReflectionViewerProps } from './Container.tsx'
-import { ContainerReflectionViewer } from './Container.tsx'
-import { DeclarationReflectionViewer } from './Declaration.tsx'
-
-export interface DeclarationContainerReflectionViewerProps extends ContainerReflectionViewerProps {
-  reflection: DeclarationReflection
-}
-
-export const DeclarationContainerReflectionViewer: React.FC<DeclarationContainerReflectionViewerProps> = ({
-  reflection,
-  lookup,
-  itemRenderer = DeclarationReflectionViewer,
-  ...props
-}) => {
-  const { hash } = useLocation()
-  const theme = useTheme()
-
-  return (
-    <ContainerReflectionViewer
-      title="DeclarationContainerReflectionViewer"
-      paper={hash.slice(1) === reflection.name}
-      bgcolor={hash.slice(1) === reflection.name ? theme.vars.palette.background.default : undefined}
-      lookup={lookup}
-      itemRenderer={itemRenderer}
-      reflection={reflection}
-      {...props}
-    />
-  )
-}

package/src/ReflectionViewer/NameViewer.tsx

@@ -1,48 +0,0 @@
-import type { TypographyVariant } from '@mui/material'
-import {
-  Chip, Stack, Typography,
-} from '@mui/material'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import { FlexRow } from '@xylabs/react-flexbox'
-import React from 'react'
-
-import { JsonViewerButton } from '../JsonViewerButton.tsx'
-import type { SomeReflection } from '../SomeReflection.ts'
-import { trimFlagLabel } from '../trimFlagLabel.ts'
-import type { ReflectionViewerProps } from './ReflectionViewerProps.tsx'
-import { SomeTypeViewer } from './SomeTypeViewer/index.ts'
-
-export interface NameViewerProps extends FlexBoxProps {
-  reflection: SomeReflection
-  reflectionViewer: React.FC<ReflectionViewerProps>
-  variant?: TypographyVariant
-}
-
-export const NameViewer: React.FC<NameViewerProps> = ({
-  reflectionViewer, variant, reflection, ...props
-}) => {
-  return (
-    <FlexRow justifyContent="flex-start" {...props}>
-      <FlexRow marginRight={1}>
-        <Typography variant={variant} noWrap>
-          {reflection.name}
-          {reflection.type
-            ? <>:&nbsp;</>
-            : null}
-        </Typography>
-        <SomeTypeViewer reflection={reflection} reflectionViewer={reflectionViewer} />
-      </FlexRow>
-      <Stack direction="row" spacing={1}>
-        <Chip size="small" label={reflection.kind} />
-        {reflection.flags
-          ? Object.entries(reflection.flags).map(([flag, value]) => {
-              return value ? <Chip size="small" key={flag} label={trimFlagLabel(flag)} variant="outlined" /> : null
-            })
-          : null}
-      </Stack>
-      {document && document?.location.hostname === 'localhost' && (
-        <JsonViewerButton size="small" variant="contained" padding={0} marginX={1} src={reflection} />
-      )}
-    </FlexRow>
-  )
-}

package/src/ReflectionViewer/Project.tsx

@@ -1,37 +0,0 @@
-import React, { useMemo } from 'react'
-import type { ProjectReflection, ReflectionGroup } from 'typedoc'
-
-import { createLookup } from '../createLookup.ts'
-import type { ContainerReflectionViewerProps } from './Container.tsx'
-import { ReflectionGroupViewer } from './ReflectionGroupViewer.tsx'
-import { ReflectionViewer } from './ReflectionViewer.tsx'
-
-export const ProjectReflectionViewer: React.FC<ContainerReflectionViewerProps<ProjectReflection>> = ({
-  reflection,
-  hiddenFlags,
-  itemRenderer = ReflectionViewer,
-  ...props
-}) => {
-  const lookup = useMemo(() => createLookup(reflection), [reflection])
-  return (
-    <ReflectionViewer title="ProjectReflectionViewer" hiddenFlags={hiddenFlags} reflection={reflection} {...props}>
-      {useMemo(() => {
-        return reflection.groups?.map((group: ReflectionGroup) => {
-          return (
-            <ReflectionGroupViewer
-              autoScroll
-              variant="h6"
-              lookup={lookup}
-              key={group.title}
-              renderer={itemRenderer}
-              group={group}
-              reflection={reflection}
-              alignItems="stretch"
-              hiddenFlags={hiddenFlags}
-            />
-          )
-        })
-      }, [lookup, reflection, hiddenFlags, itemRenderer])}
-    </ReflectionViewer>
-  )
-}

package/src/ReflectionViewer/ReflectionGroupViewer.tsx

@@ -1,80 +0,0 @@
-import { Typography } from '@mui/material'
-import { FlexCol, FlexRow } from '@xylabs/react-flexbox'
-import React, { useEffect } from 'react'
-import { useLocation } from 'react-router-dom'
-import type {
-  ContainerReflection, ReflectionFlags, ReflectionGroup,
-} from 'typedoc'
-
-import { JsonViewerButton } from '../JsonViewerButton.tsx'
-import { resolveChildren } from '../resolveChildren.ts'
-import { ReflectionViewer } from './ReflectionViewer.tsx'
-import type { FlagFilter, ReflectionViewerProps } from './ReflectionViewerProps.tsx'
-
-export interface ReflectionGroupViewerProps extends ReflectionViewerProps<ContainerReflection> {
-  autoScroll?: boolean
-  group: ReflectionGroup
-  reflection: ContainerReflection
-  renderer?: React.FC<ReflectionViewerProps>
-}
-
-const hide = (flags?: ReflectionFlags, hiddenFlags: FlagFilter[] = []) => {
-  let hide = false
-  for (const hiddenFlag of hiddenFlags) {
-    if (flags?.[hiddenFlag]) {
-      hide = true
-    }
-  }
-  return hide
-}
-
-export const ReflectionGroupViewer: React.FC<ReflectionGroupViewerProps> = ({
-  autoScroll = false,
-  children,
-  hiddenFlags,
-  group,
-  lookup,
-  renderer = ReflectionViewer,
-  variant,
-  ...props
-}) => {
-  const resolvedChildren = resolveChildren(group, lookup) ?? []
-
-  const visibleChildren
-    = hiddenFlags
-      ? resolvedChildren.reduce((acc, item) => {
-          return acc + (hide(item.flags, hiddenFlags) ? 0 : 1)
-        }, 0)
-      : 1
-
-  const { hash } = useLocation()
-  useEffect(() => {
-    if (hash && autoScroll) {
-      document.querySelector(hash)?.scrollIntoView({ behavior: 'smooth' })
-    }
-  }, [hash, autoScroll])
-
-  return visibleChildren > 0
-    ? (
-        <FlexCol title="ReflectionGroupViewer" {...props}>
-          <FlexRow marginY={1} justifyContent="flex-start">
-            <Typography variant={variant}>{group.title}</Typography>
-            <JsonViewerButton size="small" variant="contained" padding={0} marginX={1} src={resolveChildren(group, lookup)} />
-          </FlexRow>
-          {resolveChildren(group, lookup).map((reflection) => {
-            return reflection
-              // I wrap this in a div since React does not understand that they have keys using the Renderer
-              ? (
-                  <div id={reflection.name} key={reflection.id}>
-                    {renderer({
-                      hiddenFlags, lookup, margin: 1, padding: 1, reflection,
-                    }) as React.ReactNode}
-                  </div>
-                )
-              : null
-          })}
-          {children}
-        </FlexCol>
-      )
-    : null
-}

package/src/ReflectionViewer/ReflectionViewer.tsx

@@ -1,48 +0,0 @@
-import { FlexCol } from '@xylabs/react-flexbox'
-import React from 'react'
-import type { ReflectionFlags } from 'typedoc'
-
-import { CommentViewer } from '../CommentViewer.tsx'
-import type { SomeReflection } from '../SomeReflection.ts'
-import { NameViewer } from './NameViewer.tsx'
-import type { FlagFilter, ReflectionViewerProps } from './ReflectionViewerProps.tsx'
-
-const hide = (flags?: ReflectionFlags, hiddenFlags: FlagFilter[] = []) => {
-  let hide = false
-  for (const hiddenFlag of hiddenFlags) {
-    if (flags?.[hiddenFlag]) {
-      hide = true
-    }
-  }
-  return hide
-}
-
-export const ReflectionViewer: React.FC<ReflectionViewerProps> = ({
-  variant, nameViewer, children, reflection, hiddenFlags, ...props
-}) => {
-  const someReflection = reflection as SomeReflection
-
-  return hide(reflection?.flags, hiddenFlags)
-    ? null
-    : (
-        <FlexCol title="ReflectionViewer" alignItems="stretch" {...props}>
-          {nameViewer === undefined
-            ? <NameViewer marginY={0.25} variant={variant} reflection={someReflection} reflectionViewer={ReflectionViewer} />
-            : nameViewer}
-          {reflection.comment
-            ? <CommentViewer comment={reflection.comment} />
-            : null}
-          {/* sources && reflection.sources && children ? (
-        <>
-          {reflection.sources.map((source, index) => {
-            return <SourceViewer key={index} source={source} />
-          })}
-        </>
-        ) : null */}
-          {someReflection.parameters?.map((parameter) => {
-            return <ReflectionViewer hiddenFlags={hiddenFlags} marginY={0.25} marginX={1} key={parameter.id} reflection={parameter} />
-          }) ?? null}
-          {children}
-        </FlexCol>
-      )
-}

package/src/ReflectionViewer/ReflectionViewerProps.tsx

@@ -1,17 +0,0 @@
-import type { TypographyVariant } from '@mui/material'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import type { ReactElement } from 'react'
-import type { Reflection } from 'typedoc'
-
-import type { ReflectionLookup } from '../ReflectionLookup.ts'
-
-export type FlagFilter = 'isPublic' | 'isPrivate' | 'isProtected'
-
-export interface ReflectionViewerProps<T extends Reflection = Reflection> extends FlexBoxProps {
-  hiddenFlags?: FlagFilter[]
-  lookup?: ReflectionLookup
-  nameViewer?: ReactElement | null
-  reflection: T
-  sources?: boolean
-  variant?: TypographyVariant
-}

package/src/ReflectionViewer/SomeTypeViewer/SomeTypeViewer.tsx

@@ -1,27 +0,0 @@
-import type { TypographyProps } from '@mui/material'
-import { Typography } from '@mui/material'
-import React from 'react'
-
-import type { SomeReflection } from '../../SomeReflection.ts'
-import type { ReflectionViewerProps } from '../ReflectionViewerProps.tsx'
-import { buildTypeString } from './buildTypeString.tsx'
-
-export interface SomeTypeViewerProps extends TypographyProps {
-  opacity?: number
-  reflection: SomeReflection
-  reflectionViewer: React.FC<ReflectionViewerProps>
-}
-
-export const SomeTypeViewer: React.FC<SomeTypeViewerProps> = ({
-  opacity = 0.5, reflection, reflectionViewer, ...props
-}) => {
-  const typeReactNode = reflection.type ? buildTypeString(reflection.type, reflectionViewer) : ''
-  if (typeof typeReactNode === 'string') {
-    return (
-      <Typography title="SomeTypeViewer" style={{ opacity }} {...props}>
-        {typeReactNode}
-      </Typography>
-    )
-  }
-  return <>{typeReactNode}</>
-}

package/src/ReflectionViewer/SomeTypeViewer/TypeBuilder.ts

@@ -1,6 +0,0 @@
-import type { ReactNode } from 'react'
-import type { SomeType, Type } from 'typedoc'
-
-import type { ReflectionViewerProps } from '../ReflectionViewerProps.tsx'
-
-export type TypeBuilder = (type: SomeType | Type, reflectionViewer: React.FC<ReflectionViewerProps>, typeBuilder?: TypeBuilder) => ReactNode

package/src/ReflectionViewer/SomeTypeViewer/buildArrayString.tsx

@@ -1,14 +0,0 @@
-import type { ArrayType } from 'typedoc'
-
-import type { ReflectionViewerProps } from '../ReflectionViewerProps.tsx'
-import type { TypeBuilder } from './TypeBuilder.ts'
-
-export const buildArrayString = (typeObj: ArrayType, reflectionViewer: React.FC<ReflectionViewerProps>, typeBuilder: TypeBuilder) => {
-  const parts: string[] = []
-  const typeString = typeBuilder(typeObj.elementType, reflectionViewer)
-  if (typeof typeString === 'string') {
-    parts.push(typeString)
-  }
-  parts.push('[]')
-  return parts
-}

package/src/ReflectionViewer/SomeTypeViewer/buildIntersectionString.tsx

@@ -1,18 +0,0 @@
-import type { IntersectionType } from 'typedoc'
-
-import type { ReflectionViewerProps } from '../ReflectionViewerProps.tsx'
-import type { TypeBuilder } from './TypeBuilder.ts'
-
-export const buildIntersectionString = (typeObj: IntersectionType, reflectionViewer: React.FC<ReflectionViewerProps>, typeBuilder: TypeBuilder) => {
-  const parts: string[] = []
-  if (typeObj.types) {
-    parts.push(
-      typeObj.types
-        .map((arg) => {
-          return typeBuilder(arg, reflectionViewer)
-        })
-        .join(' & '),
-    )
-  }
-  return parts
-}

package/src/ReflectionViewer/SomeTypeViewer/buildReferenceString.ts

@@ -1,20 +0,0 @@
-import type { ReferenceType } from 'typedoc'
-
-import type { ReflectionViewerProps } from '../ReflectionViewerProps.tsx'
-import type { TypeBuilder } from './TypeBuilder.ts'
-
-export const buildReferenceString = (typeObj: ReferenceType, reflectionViewer: React.FC<ReflectionViewerProps>, typeBuilder: TypeBuilder) => {
-  const parts: string[] = [typeObj.name]
-  if (typeObj.typeArguments) {
-    parts.push(
-      '<',
-      typeObj.typeArguments
-        .map((arg) => {
-          return typeBuilder(arg, reflectionViewer)
-        })
-        .join(', '),
-      '>',
-    )
-  }
-  return parts
-}

package/src/ReflectionViewer/SomeTypeViewer/buildReflectionString.tsx

@@ -1,10 +0,0 @@
-import React from 'react'
-import type { ReflectionType } from 'typedoc'
-
-import type { ReflectionViewerProps } from '../ReflectionViewerProps.tsx'
-
-export const buildReflectionString = (typeObj: ReflectionType, reflectionViewer: React.FC<ReflectionViewerProps>) => {
-  if (typeObj.declaration) {
-    return <>{reflectionViewer({ reflection: typeObj.declaration })}</>
-  }
-}

package/src/ReflectionViewer/SomeTypeViewer/buildTypeString.tsx

@@ -1,50 +0,0 @@
-import type { ReactNode } from 'react'
-import type { SomeType, Type } from 'typedoc'
-
-import type { ReflectionViewerProps } from '../ReflectionViewerProps.tsx'
-import { buildArrayString } from './buildArrayString.tsx'
-import { buildIntersectionString } from './buildIntersectionString.tsx'
-import { buildReferenceString } from './buildReferenceString.ts'
-import { buildReflectionString } from './buildReflectionString.tsx'
-import { buildUnionString } from './buildUnionString.tsx'
-import type { TypeBuilder } from './TypeBuilder.ts'
-
-export const buildTypeString: TypeBuilder = (type: SomeType | Type, reflectionViewer: React.FC<ReflectionViewerProps>): ReactNode => {
-  const someType = type as SomeType
-  const parts: string[] = []
-
-  switch (someType.type) {
-    case 'intrinsic': {
-      parts.push(someType.name)
-      break
-    }
-    case 'intersection': {
-      parts.push(...buildIntersectionString(someType, reflectionViewer, buildTypeString))
-      break
-    }
-    case 'literal': {
-      parts.push(JSON.stringify(someType.value))
-      break
-    }
-    case 'array': {
-      parts.push(...buildArrayString(someType, reflectionViewer, buildTypeString))
-      break
-    }
-    case 'reference': {
-      parts.push(...buildReferenceString(someType, reflectionViewer, buildTypeString))
-      break
-    }
-    case 'union': {
-      parts.push(...buildUnionString(someType, reflectionViewer, buildTypeString))
-      break
-    }
-    case 'reflection': {
-      return buildReflectionString(someType, reflectionViewer)
-    }
-    default: {
-      parts.push('#', someType.type, '#')
-      break
-    }
-  }
-  return parts.join('')
-}

package/src/ReflectionViewer/SomeTypeViewer/buildUnionString.tsx

@@ -1,18 +0,0 @@
-import type { UnionType } from 'typedoc'
-
-import type { ReflectionViewerProps } from '../ReflectionViewerProps.tsx'
-import type { TypeBuilder } from './TypeBuilder.ts'
-
-export const buildUnionString = (typeObj: UnionType, reflectionViewer: React.FC<ReflectionViewerProps>, typeBuilder: TypeBuilder) => {
-  const parts: string[] = []
-  if (typeObj.types) {
-    parts.push(
-      typeObj.types
-        .map((arg) => {
-          return typeBuilder(arg, reflectionViewer)
-        })
-        .join(' | '),
-    )
-  }
-  return parts
-}

package/src/ReflectionViewer/SomeTypeViewer/index.ts

@@ -1 +0,0 @@
-export * from './SomeTypeViewer.tsx'

package/src/ReflectionViewer/index.ts

@@ -1,8 +0,0 @@
-export * from './Container.tsx'
-export * from './Declaration.tsx'
-export * from './DeclarationContainer.tsx'
-export * from './Project.tsx'
-export * from './ReflectionGroupViewer.tsx'
-export * from './ReflectionViewer.tsx'
-export * from './ReflectionViewerProps.tsx'
-export * from './SomeTypeViewer/index.ts'

package/src/SomeReflection.ts

@@ -1,9 +0,0 @@
-import type {
-  ParameterReflection, Reflection, SomeType,
-} from 'typedoc'
-
-export type WithSomeType<T> = T & { type?: SomeType }
-
-export type WithSomeParameters<T> = T & { parameters?: ParameterReflection[] }
-
-export type SomeReflection = WithSomeParameters<WithSomeType<Reflection>>

package/src/SourceViewer.tsx

@@ -1,19 +0,0 @@
-import { Typography } from '@mui/material'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import { FlexCol } from '@xylabs/react-flexbox'
-import React from 'react'
-import type { SourceReference } from 'typedoc'
-
-export interface SourceViewerProps extends FlexBoxProps {
-  source: SourceReference
-}
-
-export const SourceViewer: React.FC<SourceViewerProps> = ({ source, ...props }) => {
-  return (
-    <FlexCol alignItems="stretch" {...props}>
-      <Typography style={{ opacity: 0.5 }} variant="body2">
-        <i>{source.fileName}</i>
-      </Typography>
-    </FlexCol>
-  )
-}

package/src/TreeViewer/Reflection.tsx

@@ -1,67 +0,0 @@
-import { Add, Remove } from '@mui/icons-material'
-import { Typography } from '@mui/material'
-import { SimpleTreeView, TreeItem } from '@mui/x-tree-view'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import { FlexCol } from '@xylabs/react-flexbox'
-import React from 'react'
-import { useNavigate } from 'react-router-dom'
-import type { ContainerReflection, Reflection } from 'typedoc'
-
-import type { ReflectionLookup } from '../ReflectionLookup.ts'
-import type { FlagFilter } from '../ReflectionViewer/index.ts'
-
-export interface ReflectionTreeViewerProps<T extends Reflection = ContainerReflection> extends FlexBoxProps {
-  hiddenFlags?: FlagFilter[]
-  lookup?: ReflectionLookup
-  reflection: T
-  searchTerm?: string
-}
-
-export const ReflectionTreeViewer: React.FC<ReflectionTreeViewerProps> = ({
-  lookup, reflection, searchTerm, ...props
-}) => {
-  const navigate = useNavigate()
-  return (
-    <FlexCol alignItems="stretch" {...props}>
-      {/* TODO - move this into a title component */}
-      {/* {nameViewer === undefined ? <NameViewer variant={variant} reflection={reflection} /> : nameViewer} */}
-      {/* {reflection.comment ? <CommentViewer comment={reflection.comment} /> : null} */}
-      {/* {reflection.sources ? ( */}
-      {/*  <> */}
-      {/*    {reflection.sources.map((source, index) => { */}
-      {/*      return <SourceViewer key={index} source={source} /> */}
-      {/*    })} */}
-      {/*  </> */}
-      {/* ) : null} */}
-      {/* TODO - when searching do not include categories that dont have children, pull maps out of view */}
-      <SimpleTreeView
-        aria-label="XYO SDK Documentation"
-        slots={{ collapseIcon: Remove, expandIcon: Add }}
-        expandedItems={reflection.groups ? [reflection.groups[0].title] : []}
-      >
-        {reflection.groups?.map((group, index) => (
-          <TreeItem key={`primary-${index}`} itemId={group.title} label={<Typography variant="h6">{group.title}</Typography>}>
-            {group.children.map((child, jndex) => {
-              const searchTermTrimmed = searchTerm?.trim().toLowerCase()
-              const childReflection = typeof child === 'number' ? lookup?.[child as number] : child
-              return childReflection && (!searchTermTrimmed || childReflection.name.toLowerCase().includes(searchTermTrimmed))
-                ? (
-                    <TreeItem
-                      key={`secondary-${index}- ${jndex}`}
-                      itemId={`declaration-${childReflection?.id}`}
-                      label={childReflection.name}
-                      onClick={() => {
-                        const hash = `#${childReflection.name}`
-                        void navigate({ hash })
-                        document.querySelector(hash)?.scrollIntoView({ behavior: 'smooth' })
-                      }}
-                    />
-                  )
-                : null
-            })}
-          </TreeItem>
-        ))}
-      </SimpleTreeView>
-    </FlexCol>
-  )
-}

package/src/TreeViewer/ReflectionGroup.tsx

@@ -1,39 +0,0 @@
-import { Typography } from '@mui/material'
-import { FlexCol, FlexRow } from '@xylabs/react-flexbox'
-import React from 'react'
-
-import { JsonViewerButton } from '../JsonViewerButton.tsx'
-import type { ReflectionGroupViewerProps } from '../ReflectionViewer/index.ts'
-import { ReflectionViewer } from '../ReflectionViewer/index.ts'
-import { resolveChildren } from '../resolveChildren.ts'
-
-export const ReflectionGroupTreeViewer: React.FC<ReflectionGroupViewerProps> = ({
-  variant,
-  group,
-  children,
-  lookup,
-  renderer = ReflectionViewer,
-  ...props
-}) => {
-  return (
-    <FlexCol {...props}>
-      <FlexRow marginY={1} justifyContent="flex-start">
-        <Typography variant={variant}>{group.title}</Typography>
-        <JsonViewerButton size="small" variant="contained" padding={0} marginX={1} src={resolveChildren(group, lookup)} />
-      </FlexRow>
-      {resolveChildren(group, lookup).map((reflection) => {
-        return reflection
-        // I wrap this in a div since React does not understand that they have keys using the Renderer
-          ? (
-              <div key={reflection.id}>
-                {renderer({
-                  lookup, margin: 1, reflection,
-                }) as React.ReactNode}
-              </div>
-            )
-          : null
-      })}
-      {children}
-    </FlexCol>
-  )
-}

package/src/TreeViewer/index.ts

@@ -1,2 +0,0 @@
-export * from './Reflection.tsx'
-export * from './ReflectionGroup.tsx'