@zentauri-ui/zentauri-components 1.4.6 → 1.4.51

package/dist/ui/typography.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/ui/typography/variants.ts","../../src/ui/typography/heading-base.tsx","../../src/ui/typography/heading.tsx","../../src/ui/typography/text-base.tsx","../../src/ui/typography/text.tsx","../../src/ui/typography/list-base.tsx","../../src/ui/typography/list.tsx","../../src/ui/typography/blockquote-base.tsx","../../src/ui/typography/blockquote.tsx","../../src/ui/typography/inline-code-base.tsx","../../src/ui/typography/inline-code.tsx","../../src/ui/typography/code-block-base.tsx","../../src/ui/typography/code-block.tsx"],"names":["jsx","tone","className","children","ref","ordered","marker","rest"],"mappings":"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","file":"typography.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\n/** Semantic text colors aligned with slate/cyan/violet accents used across the kit (dark-first). */\nexport const typographyToneVariants = cva(\"\", {\n  variants: {\n    tone: {\n      default: \"text-slate-50 border-white/15\",\n      muted: \"text-slate-400 border-white/15\",\n      primary: \"text-cyan-300 border-cyan-300/40\",\n      secondary: \"text-slate-300 border-white/15\",\n      accent: \"text-violet-300 border-violet-300/40\",\n      destructive: \"text-rose-400 border-rose-300/40\",\n      info: \"text-sky-300 border-sky-300/40\",\n      success: \"text-emerald-300 border-emerald-300/40\",\n      warning: \"text-amber-300 border-amber-300/40\",\n      error: \"text-red-300 border-red-300/40\",\n      \"gradient-pink-violet\": \"bg-linear-to-r from-pink-400 to-violet-400 bg-clip-text text-transparent w-fit\",\n      \"gradient-cyan-violet\": \"bg-linear-to-r from-cyan-400 to-violet-400 bg-clip-text text-transparent w-fit\",\n      \"gradient-cyan-blue\": \"bg-linear-to-r from-cyan-400 to-blue-400 bg-clip-text text-transparent w-fit\",\n      \"gradient-cyan-green\": \"bg-linear-to-r from-cyan-400 to-green-400 bg-clip-text text-transparent w-fit\",\n      \"gradient-cyan-orange\": \"bg-linear-to-r from-cyan-400 to-orange-400 bg-clip-text text-transparent w-fit\",\n      \"gradient-cyan-red\": \"bg-linear-to-r from-cyan-400 to-red-400 bg-clip-text text-transparent w-fit\",\n      \"gradient-cyan-purple\": \"bg-linear-to-r from-cyan-400 to-purple-400 bg-clip-text text-transparent w-fit\",\n      \"gradient-cyan-pink\": \"bg-linear-to-r from-cyan-400 to-pink-400 bg-clip-text text-transparent w-fit\",\n    },\n  },\n  defaultVariants: {\n    tone: \"default\",\n  },\n});\n\nexport const headingLevelVariants = cva(\"scroll-m-20\", {\n  variants: {\n    level: {\n      1: \"text-4xl font-bold tracking-tight md:text-5xl\",\n      2: \"text-3xl font-semibold tracking-tight\",\n      3: \"text-2xl font-semibold tracking-tight\",\n      4: \"text-xl font-semibold tracking-tight\",\n      5: \"text-lg font-medium\",\n      6: \"text-base font-medium\",\n    },\n  },\n});\n\nexport const textSizeVariants = cva(\"\", {\n  variants: {\n    size: {\n      sm: \"text-sm leading-relaxed\",\n      base: \"text-base leading-relaxed\",\n      lg: \"text-lg leading-relaxed\",\n    },\n  },\n  defaultVariants: {\n    size: \"base\",\n  },\n});\n\n/** Marker style for unordered lists; ignored when `ordered` is true (decimal numbering). */\nexport const unorderedListMarkerVariants = cva(\"space-y-2 pl-5\", {\n  variants: {\n    marker: {\n      disc: \"list-disc\",\n      circle: \"[list-style-type:circle]\",\n      none: \"list-none pl-0\",\n    },\n  },\n  defaultVariants: {\n    marker: \"disc\",\n  },\n});\n\nexport const orderedListVariants = cva(\"list-decimal space-y-2 pl-5\");\n","import { forwardRef } from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { HeadingProps } from \"./types\";\nimport {\n  headingLevelVariants,\n  typographyToneVariants,\n} from \"./variants\";\n\nconst HEADING_TAGS = {\n  1: \"h1\",\n  2: \"h2\",\n  3: \"h3\",\n  4: \"h4\",\n  5: \"h5\",\n  6: \"h6\",\n} as const;\n\nexport const HeadingBase = (props: HeadingProps) => {\n    const {\n      level,\n      displayLevel,\n      tone,\n      bold,\n      italic,\n      underline,\n      strikethrough,\n      ref,\n      className,\n      children,\n      ...rest\n    } = props;\n\n    const Tag = HEADING_TAGS[level];\n    const scale = displayLevel ?? level;\n\n    return (\n      <Tag\n        ref={ref}\n        data-slot=\"typography-heading\"\n        data-level={level}\n        className={cn(\n          typographyToneVariants({ tone }),\n          headingLevelVariants({ level: scale }),\n          bold && \"font-bold\",\n          italic && \"italic\",\n          underline && \"underline underline-offset-4\",\n          strikethrough && \"line-through\",\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </Tag>\n    );\n};\n\nHeadingBase.displayName = \"Heading\";\n","import { HeadingBase } from \"./heading-base\";\nimport type { HeadingProps } from \"./types\";\n\nexport const Heading = (props: HeadingProps) => {\n  return <HeadingBase {...props} />;\n};\n\nHeading.displayName = \"Heading\";\n","import { cn } from \"../../lib/utils\";\n\nimport type { TextProps } from \"./types\";\nimport { textSizeVariants, typographyToneVariants } from \"./variants\";\n\nexport const TextBase = (props: TextProps) => {\n    const {\n      as = \"p\",\n      size = \"base\",\n      tone,\n      bold,\n      italic,\n      underline,\n      strikethrough,\n      highlight,\n      className,\n      children,\n      ...rest\n    } = props;\n\n    const Component = as;\n\n    return (\n      <Component\n        data-slot=\"typography-text\"\n        className={cn(\n          typographyToneVariants({ tone }),\n          textSizeVariants({ size }),\n          bold && \"font-semibold\",\n          italic && \"italic\",\n          underline && \"underline underline-offset-2\",\n          strikethrough && \"line-through\",\n          highlight && \"rounded bg-amber-400/15 px-0.5\",\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n};\n\nTextBase.displayName = \"Text\";\n","import { TextBase } from \"./text-base\";\nimport type { TextProps } from \"./types\";\n\nexport const Text = (props: TextProps) => {\n  return <TextBase {...props} />;\n};\n\nText.displayName = \"Text\";\n","import { cn } from \"../../lib/utils\";\n\nimport type { ListProps, ListItemProps } from \"./types\";\nimport {\n  orderedListVariants,\n  typographyToneVariants,\n  unorderedListMarkerVariants,\n} from \"./variants\";\n\nexport function ListBase(props: ListProps) {\n  if (\"ordered\" in props && props.ordered === true) {\n    const {\n      tone,\n      className,\n      children,\n      ref,\n      ordered,\n      marker,\n      ...rest\n    } = props;\n\n    void ordered;\n    void marker;\n\n    return (\n      <ol\n        ref={ref}\n        data-slot=\"typography-list\"\n        data-list-type=\"ordered\"\n        className={cn(\n          typographyToneVariants({ tone }),\n          orderedListVariants(),\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </ol>\n    );\n  }\n\n  const {\n    marker = \"disc\",\n    tone,\n    className,\n    children,\n    ref,\n    ordered,\n    ...rest\n  } = props;\n\n  void ordered;\n\n  return (\n    <ul\n      ref={ref}\n      data-slot=\"typography-list\"\n      data-list-type=\"unordered\"\n      className={cn(\n        typographyToneVariants({ tone }),\n        unorderedListMarkerVariants({ marker }),\n        className,\n      )}\n      {...rest}\n    >\n      {children}\n    </ul>\n  );\n}\n\nListBase.displayName = \"List\";\n\nexport function ListItemBase(props: ListItemProps) {\n  const { className, children, ref, ...rest } = props;\n\n  return (\n    <li\n      ref={ref}\n      data-slot=\"typography-list-item\"\n      className={cn(\"leading-relaxed\", className)}\n      {...rest}\n    >\n      {children}\n    </li>\n  );\n}\n\nListItemBase.displayName = \"ListItem\";\n","import type { ListProps } from \"./types\";\n\nimport { ListBase, ListItemBase } from \"./list-base\";\n\nexport const ListItem = ListItemBase;\n\nfunction ListRoot(props: ListProps) {\n  return <ListBase {...props} />;\n}\n\nexport const List = Object.assign(ListRoot, {\n  Item: ListItem,\n});\n\nListRoot.displayName = \"List\";\n","import { forwardRef } from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { BlockquoteProps } from \"./types\";\nimport { typographyToneVariants } from \"./variants\";\n\nexport const BlockquoteBase = (props: BlockquoteProps) => {\n  const {\n    tone,\n    attribution,\n    className,\n    children,\n    ref,\n    ...rest\n  } = props;\n\n  return (\n    <blockquote\n      ref={ref}\n      data-slot=\"typography-blockquote\"\n      className={cn(\n        typographyToneVariants({ tone }),\n        \"border-l-4 py-1 pl-4 italic\",\n        className,\n      )}\n      {...rest}\n    >\n      <div className=\"space-y-2 leading-relaxed\">{children}</div>\n      {attribution ? (\n        <footer className=\"mt-3 text-sm not-italic\">\n          <cite>{attribution}</cite>\n        </footer>\n      ) : null}\n    </blockquote>\n  );\n};\n\nBlockquoteBase.displayName = \"Blockquote\";\n","import { BlockquoteBase } from \"./blockquote-base\";\nimport type { BlockquoteProps } from \"./types\";\n\nexport const Blockquote = (props: BlockquoteProps) => {\n  return <BlockquoteBase {...props} />;\n};\n\nBlockquote.displayName = \"Blockquote\";\n","import { forwardRef } from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { InlineCodeProps } from \"./types\";\nimport { typographyToneVariants } from \"./variants\";\n\nexport const InlineCodeBase = (props: InlineCodeProps) => {\n    const { tone, className, children, ref, ...rest } = props;\n\n    return (\n      <code\n        ref={ref}\n        data-slot=\"typography-inline-code\"\n        className={cn(\n          typographyToneVariants({ tone }),\n          \"rounded-md border border-white/10 bg-white/6 px-1.5 py-0.5 font-mono text-[0.925em] font-normal\",\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </code>\n    );\n};\n\nInlineCodeBase.displayName = \"InlineCode\";\n","import { InlineCodeBase } from \"./inline-code-base\";\nimport type { InlineCodeProps } from \"./types\";\n\nexport const InlineCode = (props: InlineCodeProps) => {\n  return <InlineCodeBase {...props} />;\n};\n\nInlineCode.displayName = \"InlineCode\";\n","import { forwardRef } from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { CodeBlockProps } from \"./types\";\nimport { typographyToneVariants } from \"./variants\";\n\nexport const CodeBlockBase = (props: CodeBlockProps) => {\n    const {\n      tone,\n      language,\n      className,\n      children,\n      ref,\n      ...rest\n    } = props;\n\n    const ariaLabel = language ? `Code sample (${language})` : \"Code sample\";\n\n    return (\n      <pre\n        ref={ref}\n        data-slot=\"typography-code-block\"\n        aria-label={ariaLabel}\n        className={cn(\n          typographyToneVariants({ tone }),\n          \"overflow-x-auto rounded-xl border border-white/10 bg-slate-950/80 p-4 text-sm leading-relaxed shadow-inner shadow-slate-950/40\",\n          className,\n        )}\n        {...rest}\n      >\n        <code className=\"font-mono text-[0.95em]\">{children}</code>\n      </pre>\n    );\n};\n\nCodeBlockBase.displayName = \"CodeBlock\";\n","import { CodeBlockBase } from \"./code-block-base\";\nimport type { CodeBlockProps } from \"./types\";\n\nexport const CodeBlock = (props: CodeBlockProps) => {\n  return <CodeBlockBase {...props} />;\n};\n\nCodeBlock.displayName = \"CodeBlock\";\n"]}

package/src/ui/typography/blockquote-base.tsx

@@ -1,39 +0,0 @@
-import { forwardRef } from "react";
-
-import { cn } from "../../lib/utils";
-
-import type { BlockquoteProps } from "./types";
-import { typographyToneVariants } from "./variants";
-
-export const BlockquoteBase = (props: BlockquoteProps) => {
-  const {
-    tone,
-    attribution,
-    className,
-    children,
-    ref,
-    ...rest
-  } = props;
-
-  return (
-    <blockquote
-      ref={ref}
-      data-slot="typography-blockquote"
-      className={cn(
-        typographyToneVariants({ tone }),
-        "border-l-4 py-1 pl-4 italic",
-        className,
-      )}
-      {...rest}
-    >
-      <div className="space-y-2 leading-relaxed">{children}</div>
-      {attribution ? (
-        <footer className="mt-3 text-sm not-italic">
-          <cite>{attribution}</cite>
-        </footer>
-      ) : null}
-    </blockquote>
-  );
-};
-
-BlockquoteBase.displayName = "Blockquote";

package/src/ui/typography/blockquote.tsx

@@ -1,8 +0,0 @@
-import { BlockquoteBase } from "./blockquote-base";
-import type { BlockquoteProps } from "./types";
-
-export const Blockquote = (props: BlockquoteProps) => {
-  return <BlockquoteBase {...props} />;
-};
-
-Blockquote.displayName = "Blockquote";

package/src/ui/typography/code-block-base.tsx

@@ -1,37 +0,0 @@
-import { forwardRef } from "react";
-
-import { cn } from "../../lib/utils";
-
-import type { CodeBlockProps } from "./types";
-import { typographyToneVariants } from "./variants";
-
-export const CodeBlockBase = (props: CodeBlockProps) => {
-    const {
-      tone,
-      language,
-      className,
-      children,
-      ref,
-      ...rest
-    } = props;
-
-    const ariaLabel = language ? `Code sample (${language})` : "Code sample";
-
-    return (
-      <pre
-        ref={ref}
-        data-slot="typography-code-block"
-        aria-label={ariaLabel}
-        className={cn(
-          typographyToneVariants({ tone }),
-          "overflow-x-auto rounded-xl border border-white/10 bg-slate-950/80 p-4 text-sm leading-relaxed shadow-inner shadow-slate-950/40",
-          className,
-        )}
-        {...rest}
-      >
-        <code className="font-mono text-[0.95em]">{children}</code>
-      </pre>
-    );
-};
-
-CodeBlockBase.displayName = "CodeBlock";

package/src/ui/typography/code-block.tsx

@@ -1,8 +0,0 @@
-import { CodeBlockBase } from "./code-block-base";
-import type { CodeBlockProps } from "./types";
-
-export const CodeBlock = (props: CodeBlockProps) => {
-  return <CodeBlockBase {...props} />;
-};
-
-CodeBlock.displayName = "CodeBlock";

package/src/ui/typography/heading-base.tsx

@@ -1,59 +0,0 @@
-import { forwardRef } from "react";
-
-import { cn } from "../../lib/utils";
-
-import type { HeadingProps } from "./types";
-import {
-  headingLevelVariants,
-  typographyToneVariants,
-} from "./variants";
-
-const HEADING_TAGS = {
-  1: "h1",
-  2: "h2",
-  3: "h3",
-  4: "h4",
-  5: "h5",
-  6: "h6",
-} as const;
-
-export const HeadingBase = (props: HeadingProps) => {
-    const {
-      level,
-      displayLevel,
-      tone,
-      bold,
-      italic,
-      underline,
-      strikethrough,
-      ref,
-      className,
-      children,
-      ...rest
-    } = props;
-
-    const Tag = HEADING_TAGS[level];
-    const scale = displayLevel ?? level;
-
-    return (
-      <Tag
-        ref={ref}
-        data-slot="typography-heading"
-        data-level={level}
-        className={cn(
-          typographyToneVariants({ tone }),
-          headingLevelVariants({ level: scale }),
-          bold && "font-bold",
-          italic && "italic",
-          underline && "underline underline-offset-4",
-          strikethrough && "line-through",
-          className,
-        )}
-        {...rest}
-      >
-        {children}
-      </Tag>
-    );
-};
-
-HeadingBase.displayName = "Heading";

package/src/ui/typography/heading.tsx

@@ -1,8 +0,0 @@
-import { HeadingBase } from "./heading-base";
-import type { HeadingProps } from "./types";
-
-export const Heading = (props: HeadingProps) => {
-  return <HeadingBase {...props} />;
-};
-
-Heading.displayName = "Heading";

package/src/ui/typography/index.ts

@@ -1,28 +0,0 @@
-export { Heading } from "./heading";
-export { Text } from "./text";
-export { List, ListItem } from "./list";
-export { Blockquote } from "./blockquote";
-export { InlineCode } from "./inline-code";
-export { CodeBlock } from "./code-block";
-
-export type {
-  BlockquoteProps,
-  CodeBlockProps,
-  HeadingLevel,
-  HeadingProps,
-  InlineCodeProps,
-  ListItemProps,
-  ListProps,
-  TextElement,
-  TextProps,
-  TypographyTone,
-  UnorderedMarker,
-} from "./types";
-
-export {
-  headingLevelVariants,
-  orderedListVariants,
-  textSizeVariants,
-  typographyToneVariants,
-  unorderedListMarkerVariants,
-} from "./variants";

package/src/ui/typography/inline-code-base.tsx

@@ -1,27 +0,0 @@
-import { forwardRef } from "react";
-
-import { cn } from "../../lib/utils";
-
-import type { InlineCodeProps } from "./types";
-import { typographyToneVariants } from "./variants";
-
-export const InlineCodeBase = (props: InlineCodeProps) => {
-    const { tone, className, children, ref, ...rest } = props;
-
-    return (
-      <code
-        ref={ref}
-        data-slot="typography-inline-code"
-        className={cn(
-          typographyToneVariants({ tone }),
-          "rounded-md border border-white/10 bg-white/6 px-1.5 py-0.5 font-mono text-[0.925em] font-normal",
-          className,
-        )}
-        {...rest}
-      >
-        {children}
-      </code>
-    );
-};
-
-InlineCodeBase.displayName = "InlineCode";

package/src/ui/typography/inline-code.tsx

@@ -1,8 +0,0 @@
-import { InlineCodeBase } from "./inline-code-base";
-import type { InlineCodeProps } from "./types";
-
-export const InlineCode = (props: InlineCodeProps) => {
-  return <InlineCodeBase {...props} />;
-};
-
-InlineCode.displayName = "InlineCode";

package/src/ui/typography/list-base.tsx

@@ -1,88 +0,0 @@
-import { cn } from "../../lib/utils";
-
-import type { ListProps, ListItemProps } from "./types";
-import {
-  orderedListVariants,
-  typographyToneVariants,
-  unorderedListMarkerVariants,
-} from "./variants";
-
-export function ListBase(props: ListProps) {
-  if ("ordered" in props && props.ordered === true) {
-    const {
-      tone,
-      className,
-      children,
-      ref,
-      ordered,
-      marker,
-      ...rest
-    } = props;
-
-    void ordered;
-    void marker;
-
-    return (
-      <ol
-        ref={ref}
-        data-slot="typography-list"
-        data-list-type="ordered"
-        className={cn(
-          typographyToneVariants({ tone }),
-          orderedListVariants(),
-          className,
-        )}
-        {...rest}
-      >
-        {children}
-      </ol>
-    );
-  }
-
-  const {
-    marker = "disc",
-    tone,
-    className,
-    children,
-    ref,
-    ordered,
-    ...rest
-  } = props;
-
-  void ordered;
-
-  return (
-    <ul
-      ref={ref}
-      data-slot="typography-list"
-      data-list-type="unordered"
-      className={cn(
-        typographyToneVariants({ tone }),
-        unorderedListMarkerVariants({ marker }),
-        className,
-      )}
-      {...rest}
-    >
-      {children}
-    </ul>
-  );
-}
-
-ListBase.displayName = "List";
-
-export function ListItemBase(props: ListItemProps) {
-  const { className, children, ref, ...rest } = props;
-
-  return (
-    <li
-      ref={ref}
-      data-slot="typography-list-item"
-      className={cn("leading-relaxed", className)}
-      {...rest}
-    >
-      {children}
-    </li>
-  );
-}
-
-ListItemBase.displayName = "ListItem";

package/src/ui/typography/list.tsx

@@ -1,15 +0,0 @@
-import type { ListProps } from "./types";
-
-import { ListBase, ListItemBase } from "./list-base";
-
-export const ListItem = ListItemBase;
-
-function ListRoot(props: ListProps) {
-  return <ListBase {...props} />;
-}
-
-export const List = Object.assign(ListRoot, {
-  Item: ListItem,
-});
-
-ListRoot.displayName = "List";

package/src/ui/typography/text-base.tsx

@@ -1,43 +0,0 @@
-import { cn } from "../../lib/utils";
-
-import type { TextProps } from "./types";
-import { textSizeVariants, typographyToneVariants } from "./variants";
-
-export const TextBase = (props: TextProps) => {
-    const {
-      as = "p",
-      size = "base",
-      tone,
-      bold,
-      italic,
-      underline,
-      strikethrough,
-      highlight,
-      className,
-      children,
-      ...rest
-    } = props;
-
-    const Component = as;
-
-    return (
-      <Component
-        data-slot="typography-text"
-        className={cn(
-          typographyToneVariants({ tone }),
-          textSizeVariants({ size }),
-          bold && "font-semibold",
-          italic && "italic",
-          underline && "underline underline-offset-2",
-          strikethrough && "line-through",
-          highlight && "rounded bg-amber-400/15 px-0.5",
-          className,
-        )}
-        {...rest}
-      >
-        {children}
-      </Component>
-    );
-};
-
-TextBase.displayName = "Text";

package/src/ui/typography/text.tsx

@@ -1,8 +0,0 @@
-import { TextBase } from "./text-base";
-import type { TextProps } from "./types";
-
-export const Text = (props: TextProps) => {
-  return <TextBase {...props} />;
-};
-
-Text.displayName = "Text";

package/src/ui/typography/types.ts

@@ -1,90 +0,0 @@
-import type { VariantProps } from "class-variance-authority";
-import type {
-  ComponentProps,
-  HTMLAttributes,
-  RefObject,
-} from "react";
-
-import type {
-  textSizeVariants,
-  typographyToneVariants,
-  unorderedListMarkerVariants,
-} from "./variants";
-
-export type TypographyTone = NonNullable<
-  VariantProps<typeof typographyToneVariants>["tone"]
->;
-
-export type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
-
-export type HeadingProps = Omit<
-  ComponentProps<"h1">,
-  "color"
-> & {
-  level: HeadingLevel;
-  /** Visual scale; defaults to `level`. */
-  displayLevel?: HeadingLevel;
-  tone?: TypographyTone;
-  bold?: boolean;
-  italic?: boolean;
-  underline?: boolean;
-  strikethrough?: boolean;
-  ref?: RefObject<HTMLHeadingElement>;
-};
-
-export type TextElement = "p" | "span" | "div" | "label";
-
-export type TextProps = Omit<HTMLAttributes<HTMLElement>, "color"> & {
-  as?: TextElement;
-  size?: NonNullable<VariantProps<typeof textSizeVariants>["size"]>;
-  tone?: TypographyTone;
-  bold?: boolean;
-  italic?: boolean;
-  underline?: boolean;
-  strikethrough?: boolean;
-  highlight?: boolean;
-};
-
-export type UnorderedMarker = NonNullable<
-  VariantProps<typeof unorderedListMarkerVariants>["marker"]
->;
-
-export type ListProps =
-  | (Omit<ComponentProps<"ul">, "color"> & {
-      ordered?: false;
-      marker?: UnorderedMarker;
-      tone?: TypographyTone;
-    })
-  | (Omit<ComponentProps<"ol">, "color"> & {
-      ordered: true;
-      marker?: undefined;
-      tone?: TypographyTone;
-    });
-
-export type ListItemProps = ComponentProps<"li"> & {
-  ref?: RefObject<HTMLLIElement>;
-};
-
-export type BlockquoteProps = ComponentProps<"blockquote"> & {
-  tone?: TypographyTone;
-  /** Attribution label shown in a footer (distinct from the HTML `cite` URL attribute). */
-  attribution?: string;
-  ref?: RefObject<HTMLQuoteElement>;
-};
-
-export type InlineCodeProps = Omit<
-  ComponentProps<"code">,
-  "color"
-> & {
-  tone?: TypographyTone;
-};
-
-export type CodeBlockProps = Omit<
-  ComponentProps<"pre">,
-  "color"
-> & {
-  tone?: TypographyTone;
-  /** Hint for stacked highlighting stacks / aria-labels. */
-  language?: string;
-  ref?: RefObject<HTMLPreElement>;
-};

package/src/ui/typography/typography.test.tsx

@@ -1,80 +0,0 @@
-import { render, screen } from "@testing-library/react";
-import { describe, expect, it } from "vitest";
-
-import {
-  Blockquote,
-  CodeBlock,
-  Heading,
-  InlineCode,
-  List,
-  ListItem,
-  Text,
-} from "./index";
-
-describe("Typography primitives", () => {
-  it("should render Heading as the requested level with displayName", () => {
-    render(<Heading level={2}>Section</Heading>);
-    expect(
-      screen.getByRole("heading", { level: 2, name: "Section" }),
-    ).toBeInTheDocument();
-    expect(Heading.displayName).toBe("Heading");
-  });
-
-  it("should apply tone classes on Text", () => {
-    const { container } = render(
-      <Text tone="muted" data-testid="muted-text">
-        Body
-      </Text>,
-    );
-    const node = container.querySelector('[data-testid="muted-text"]');
-    expect(node?.className).toMatch(/text-slate-400/);
-  });
-
-  it("should render unordered List with list marker utilities", () => {
-    const { container } = render(
-      <List>
-        <ListItem>Alpha</ListItem>
-      </List>,
-    );
-    const ul = container.querySelector('[data-slot="typography-list"]');
-    expect(ul?.tagName).toBe("UL");
-    expect(ul?.className).toMatch(/list-disc/);
-  });
-
-  it("should render ordered List as ol", () => {
-    const { container } = render(
-      <List ordered>
-        <ListItem>One</ListItem>
-      </List>,
-    );
-    const ol = container.querySelector('[data-slot="typography-list"]');
-    expect(ol?.tagName).toBe("OL");
-    expect(ol?.className).toMatch(/list-decimal/);
-  });
-
-  it("should render Blockquote with optional attribution footer", () => {
-    render(
-      <Blockquote attribution="Source">
-        <p>Quoted</p>
-      </Blockquote>,
-    );
-    expect(screen.getByText("Quoted")).toBeInTheDocument();
-    expect(screen.getByText("Source")).toBeInTheDocument();
-  });
-
-  it("should render InlineCode with monospace styling token", () => {
-    const { container } = render(<InlineCode>npm i</InlineCode>);
-    const code = container.querySelector('[data-slot="typography-inline-code"]');
-    expect(code?.tagName).toBe("CODE");
-    expect(code?.className).toMatch(/font-mono/);
-  });
-
-  it("should render CodeBlock with nested code element", () => {
-    const { container } = render(
-      <CodeBlock language="tsx">{`const x = 1;`}</CodeBlock>,
-    );
-    const pre = container.querySelector('[data-slot="typography-code-block"]');
-    expect(pre?.tagName).toBe("PRE");
-    expect(pre?.querySelector("code")?.textContent).toContain("const x");
-  });
-});

package/src/ui/typography/variants.ts

@@ -1,72 +0,0 @@
-import { cva } from "class-variance-authority";
-
-/** Semantic text colors aligned with slate/cyan/violet accents used across the kit (dark-first). */
-export const typographyToneVariants = cva("", {
-  variants: {
-    tone: {
-      default: "text-slate-50 border-white/15",
-      muted: "text-slate-400 border-white/15",
-      primary: "text-cyan-300 border-cyan-300/40",
-      secondary: "text-slate-300 border-white/15",
-      accent: "text-violet-300 border-violet-300/40",
-      destructive: "text-rose-400 border-rose-300/40",
-      info: "text-sky-300 border-sky-300/40",
-      success: "text-emerald-300 border-emerald-300/40",
-      warning: "text-amber-300 border-amber-300/40",
-      error: "text-red-300 border-red-300/40",
-      "gradient-pink-violet": "bg-linear-to-r from-pink-400 to-violet-400 bg-clip-text text-transparent w-fit",
-      "gradient-cyan-violet": "bg-linear-to-r from-cyan-400 to-violet-400 bg-clip-text text-transparent w-fit",
-      "gradient-cyan-blue": "bg-linear-to-r from-cyan-400 to-blue-400 bg-clip-text text-transparent w-fit",
-      "gradient-cyan-green": "bg-linear-to-r from-cyan-400 to-green-400 bg-clip-text text-transparent w-fit",
-      "gradient-cyan-orange": "bg-linear-to-r from-cyan-400 to-orange-400 bg-clip-text text-transparent w-fit",
-      "gradient-cyan-red": "bg-linear-to-r from-cyan-400 to-red-400 bg-clip-text text-transparent w-fit",
-      "gradient-cyan-purple": "bg-linear-to-r from-cyan-400 to-purple-400 bg-clip-text text-transparent w-fit",
-      "gradient-cyan-pink": "bg-linear-to-r from-cyan-400 to-pink-400 bg-clip-text text-transparent w-fit",
-    },
-  },
-  defaultVariants: {
-    tone: "default",
-  },
-});
-
-export const headingLevelVariants = cva("scroll-m-20", {
-  variants: {
-    level: {
-      1: "text-4xl font-bold tracking-tight md:text-5xl",
-      2: "text-3xl font-semibold tracking-tight",
-      3: "text-2xl font-semibold tracking-tight",
-      4: "text-xl font-semibold tracking-tight",
-      5: "text-lg font-medium",
-      6: "text-base font-medium",
-    },
-  },
-});
-
-export const textSizeVariants = cva("", {
-  variants: {
-    size: {
-      sm: "text-sm leading-relaxed",
-      base: "text-base leading-relaxed",
-      lg: "text-lg leading-relaxed",
-    },
-  },
-  defaultVariants: {
-    size: "base",
-  },
-});
-
-/** Marker style for unordered lists; ignored when `ordered` is true (decimal numbering). */
-export const unorderedListMarkerVariants = cva("space-y-2 pl-5", {
-  variants: {
-    marker: {
-      disc: "list-disc",
-      circle: "[list-style-type:circle]",
-      none: "list-none pl-0",
-    },
-  },
-  defaultVariants: {
-    marker: "disc",
-  },
-});
-
-export const orderedListVariants = cva("list-decimal space-y-2 pl-5");