添加标题组件

src/modules/editor/components/CompUI/customUI/Titles/Title3/component.tsx

@@ -0,0 +1,50 @@
+import { string } from "vue-types";
+import { useCompData } from ".";
+import { Text } from "../../..";
+import { createUIComp } from "../../../defines/createUIComp";
+import { css, cx } from "@linaria/core";
+
+export const Component = createUIComp({
+  props: {
+    compId: string().isRequired,
+  },
+  setup(props) {
+    const { children } = useCompData(props.compId);
+
+    return () => (
+      <div class="flex flex-col items-center">
+        <Text.Component
+          class=""
+          compId={children.title?.id}
+        />
+        <Text.Component
+          class=""
+          compId={children.subtitle?.id}
+        />
+      </div>
+    );
+  },
+});
+
+const border = css`
+  position: relative;
+  color: #999;
+  &::after {
+    content: "";
+    position: absolute;
+    bottom: 50%;
+    width: 100%;
+    height: 1px;
+    background-color: currentColor;
+  }
+  &.left {
+    &::after {
+      left: 0.06rem;
+    }
+  }
+  &.right {
+    &::after {
+      left: -0.06rem;
+    }
+  }
+`;

src/modules/editor/components/CompUI/customUI/Titles/Title3/index.ts

@@ -0,0 +1,26 @@
+//https://sku3d-test.obs.cn-east-3.myhuaweicloud.com/queenshow/1685591011649_FHii9K_thumbnail.png
+
+import { createAttrsForm } from "../../../defines/createAttrsForm";
+import { createOptions } from "../../../defines/createOptions";
+
+export { Component } from "./component";
+const thumbnail = "https://sku3d-test.obs.cn-east-3.myhuaweicloud.com/queenshow/1685591011649_FHii9K_thumbnail.png";
+
+export const { options, useCompData } = createOptions({
+  name: "标题3",
+  thumbnail: thumbnail,
+  value: {},
+  layout: {
+    padding: "0.2rem",
+  },
+  children: {
+    title: {
+      value: `<p style="text-align:center;"><span style="color:#333;font-size:20px;font-weight: bold;">产品详情</span></p>`,
+    },
+    subtitle: {
+        value: `<p style="text-align:center;">/ Product Details /</p>`,
+    },
+  },
+});
+
+export const Form = createAttrsForm([]);

src/modules/editor/components/CompUI/index.ts

@@ -7,5 +7,7 @@ export * as Cover from "./customUI/Covers/Cover";
 export * as Cover2 from "./customUI/Covers/Cover2";
 export * as Title1 from "./customUI/Titles/Title1";
 export * as Title2 from "./customUI/Titles/Title2";
+export * as Title3 from "./customUI/Titles/Title3";
+
 export * as Card2 from "./customUI/Cards/Card2";
 export * as Card3 from "./customUI/Cards/Card3";