feat: add RTE Table

components/TempDesignSystem/Table/index.tsx

@@ -0,0 +1,27 @@
+import styles from "./table.module.css"
+
+function Table({ children }: React.PropsWithChildren) {
+  return <table className={styles.table}>{children}</table>
+}
+
+export default Table
+
+export function THead({ children }: React.PropsWithChildren) {
+  return <thead className={styles.thead}>{children}</thead>
+}
+
+export function TH({ children }: React.PropsWithChildren) {
+  return <th className={styles.th}>{children}</th>
+}
+
+export function TD({ children }: React.PropsWithChildren) {
+  return <td className={styles.td}>{children}</td>
+}
+
+export function TBody({ children }: React.PropsWithChildren) {
+  return <tbody className={styles.tbody}>{children}</tbody>
+}
+
+export function TR({ children }: React.PropsWithChildren) {
+  return <tr className={styles.tr}>{children}</tr>
+}

components/TempDesignSystem/Table/table.module.css

@@ -0,0 +1,26 @@
+.table {
+  border-radius: var(--Corner-radius-Medium);
+  border-collapse: collapse;
+  overflow: hidden;
+}
+
+.thead {
+  background-color: var(--Base-Background-Secondary-Normal, #f7e1d5);
+}
+
+.tbody {
+  background-color: var(--Base-Surface-Primary-light-Normal, #fff);
+}
+
+.tr:not(:last-of-type) {
+  border-bottom: 1px solid var(--Primary-Light-On-Surface-Divider, #f0c1b6);
+}
+
+.th {
+  padding: var(--Spacing-x2) var(--Spacing-x3);
+  text-align: left;
+}
+
+.td {
+  padding: var(--Spacing-x3);
+}