Typography Components

/**
 * Styled anchor/link element with Storybook theming
 */
const A: React.ComponentType<React.AnchorHTMLAttributes<HTMLAnchorElement>>;

/**
 * Styled blockquote element
 */
const Blockquote: React.ComponentType<React.BlockquoteHTMLAttributes<HTMLElement>>;

/**
 * Styled inline code element
 */
const Code: React.ComponentType<React.HTMLAttributes<HTMLElement>>;

/**
 * Styled div element
 */
const Div: React.ComponentType<React.HTMLAttributes<HTMLDivElement>>;

/**
 * Styled definition list element
 */
const DL: React.ComponentType<React.HTMLAttributes<HTMLDListElement>>;

/**
 * Styled heading elements (H1 through H6)
 */
const H1: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
const H2: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
const H3: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
const H4: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
const H5: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
const H6: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;

/**
 * Styled horizontal rule element
 */
const HR: React.ComponentType<React.HTMLAttributes<HTMLHRElement>>;

/**
 * Styled image element
 */
const Img: React.ComponentType<React.ImgHTMLAttributes<HTMLImageElement>>;

/**
 * Styled list item element
 */
const LI: React.ComponentType<React.LiHTMLAttributes<HTMLLIElement>>;

/**
 * Styled ordered list element
 */
const OL: React.ComponentType<React.OlHTMLAttributes<HTMLOListElement>>;

/**
 * Styled paragraph element
 */
const P: React.ComponentType<React.HTMLAttributes<HTMLParagraphElement>>;

/**
 * Styled preformatted text element
 */
const Pre: React.ComponentType<React.HTMLAttributes<HTMLPreElement>>;

/**
 * Styled span element
 */
const Span: React.ComponentType<React.HTMLAttributes<HTMLSpanElement>>;

/**
 * Styled table element
 */
const Table: React.ComponentType<React.TableHTMLAttributes<HTMLTableElement>>;

/**
 * Styled teletype text element
 */
const TT: React.ComponentType<React.HTMLAttributes<HTMLTitleElement>>;

/**
 * Styled unordered list element
 */
const UL: React.ComponentType<React.HTMLAttributes<HTMLUListElement>>;

/**
 * Typography link component with enhanced styling
 */
const Link: React.ComponentType<{
  href?: string;
  children: React.ReactNode;
  target?: string;
  rel?: string;
}>;

/**
 * Document wrapper component for content formatting
 */
const DocumentWrapper: React.ComponentType<{
  children: React.ReactNode;
}>;

/**
 * Typography component mapping object for MDX rendering
 * Maps HTML element names to styled React components
 */
const components: {
  h1: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
  h2: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
  h3: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
  h4: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
  h5: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
  h6: React.ComponentType<React.HTMLAttributes<HTMLHeadingElement>>;
  p: React.ComponentType<React.HTMLAttributes<HTMLParagraphElement>>;
  a: React.ComponentType<React.AnchorHTMLAttributes<HTMLAnchorElement>>;
  code: React.ComponentType<React.HTMLAttributes<HTMLElement>>;
  pre: React.ComponentType<React.HTMLAttributes<HTMLPreElement>>;
  hr: React.ComponentType<React.HTMLAttributes<HTMLHRElement>>;
  dl: React.ComponentType<React.HTMLAttributes<HTMLDListElement>>;
  blockquote: React.ComponentType<React.BlockquoteHTMLAttributes<HTMLElement>>;
  table: React.ComponentType<React.TableHTMLAttributes<HTMLTableElement>>;
  img: React.ComponentType<React.ImgHTMLAttributes<HTMLImageElement>>;
  div: React.ComponentType<React.HTMLAttributes<HTMLDivElement>>;
  span: React.ComponentType<React.HTMLAttributes<HTMLSpanElement>>;
  li: React.ComponentType<React.LiHTMLAttributes<HTMLLIElement>>;
  ul: React.ComponentType<React.HTMLAttributes<HTMLUListElement>>;
  ol: React.ComponentType<React.OlHTMLAttributes<HTMLOListElement>>;
  tt: React.ComponentType<React.HTMLAttributes<HTMLTitleElement>>;
  resetwrapper: React.ComponentType<React.HTMLAttributes<HTMLDivElement>>;
};

/**
 * Reset wrapper components for clean styling
 * Provides unstyled versions of HTML elements
 */
const resetComponents: Record<string, React.ComponentType>;

/**
 * Higher-order component utility for applying reset styles
 */
function withReset<T = {}>(component: React.ComponentType<T>): React.ComponentType<T>;

/**
 * Common code styling utilities
 */
const codeCommon: {
  // Common styling properties for code elements
  [key: string]: any;
};

import { H1, H2, P, Code, A } from "@storybook/components";

<H1>Main Title</H1>
<H2>Subtitle</H2>
<P>This is a paragraph with proper Storybook styling.</P>
<Code>const code = "highlighted";</Code>
<A href="https://storybook.js.org">Storybook Link</A>

import { Link, DocumentWrapper } from "@storybook/components";

<DocumentWrapper>
  <Link href="/docs">Documentation Link</Link>
</DocumentWrapper>

import { components } from "@storybook/components";

// Use with MDX or markdown renderers
const mdxComponents = {
  ...components,
  // Override specific components if needed
  h1: (props) => <components.h1 {...props} style={{ color: 'blue' }} />
};

import { resetComponents } from "@storybook/components";

// Use unstyled versions of HTML elements
<resetComponents.h1>Unstyled Heading</resetComponents.h1>

// All exports from DocumentFormatting
export * from './components/typography/DocumentFormatting';

// All exports from ResetWrapper  
export * from './components/typography/ResetWrapper';