feat(WEB-304): remaning UI from design system primitives

components/TempDesignSystem/Text/Subtitle/index.tsx

@@ -1,21 +1,27 @@
+import { Slot } from "@radix-ui/react-slot"
+
 import { subtitleVariants } from "./variants"
 
 import type { SubtitleProps } from "./subtitle"
 
 export default function Subtitle({
-  children,
+  asChild = false,
   className = "",
   color,
   hideEmpty = true,
+  textAlign,
   textTransform,
+  ...props
 }: SubtitleProps) {
-  if (hideEmpty && !children) {
+  if (hideEmpty && !props.children) {
     return null
   }
+  const Comp = asChild ? Slot : "p"
   const classNames = subtitleVariants({
     className,
     color,
+    textAlign,
     textTransform,
   })
-  return <p className={classNames}>{children}</p>
+  return <Comp className={classNames} {...props} />
 }