@soul-refiner/design-system 0.1.27 → 0.1.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/src/components/editor/editor.tsx +4 -0
  3. package/src/components/editor/plugins/text.tsx +16 -7
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@soul-refiner/design-system",
3
- "version": "0.1.27",
3
+ "version": "0.1.28",
4
4
  "main": "src/index.ts",
5
5
  "license": "MIT",
6
6
  "publishConfig": {
package/src/components/editor/editor.tsx CHANGED
@@ -67,6 +67,10 @@ const Wrapper = styled.div`
67
67
  text-decoration: underline;
68
68
  }
69
69
 
70
+ li {
71
+ color: var(--color-grey-3);
72
+ }
73
+
70
74
  .slate-code {
71
75
  & > * {
72
76
  font-family: 'Roboto Mono';
package/src/components/editor/plugins/text.tsx CHANGED
@@ -12,10 +12,13 @@ export const ParagraphElement = React.forwardRef<
12
12
  React.ElementRef<typeof PlateElement>,
13
13
  PlateElementProps
14
14
  >(({ children, ...props }: PlateRenderElementProps, ref) => {
15
+ const textAlign = (props as any)?.style?.textAlign;
15
16
  return (
16
17
  <PlateElement asChild ref={ref} {...props}>
17
18
  <>
18
- <P as="div">{children}</P>
19
+ <P as="div" $textAlign={textAlign}>
20
+ {children}
21
+ </P>
19
22
  </>
20
23
  </PlateElement>
21
24
  );
@@ -31,10 +34,11 @@ export const HOneElement = React.forwardRef<
31
34
  React.ElementRef<typeof PlateElement>,
32
35
  PlateElementProps
33
36
  >(({ children, ...props }: PlateRenderElementProps, ref) => {
37
+ const textAlign = (props as any)?.style?.textAlign;
34
38
  return (
35
39
  <PlateElement asChild ref={ref} {...props}>
36
40
  <>
37
- <H.One>{children}</H.One>
41
+ <H.One $textAlign={textAlign}>{children}</H.One>
38
42
  </>
39
43
  </PlateElement>
40
44
  );
@@ -50,10 +54,11 @@ export const HTwoElement = React.forwardRef<
50
54
  React.ElementRef<typeof PlateElement>,
51
55
  PlateElementProps
52
56
  >(({ children, ...props }: PlateRenderElementProps, ref) => {
57
+ const textAlign = (props as any)?.style?.textAlign;
53
58
  return (
54
59
  <PlateElement asChild ref={ref} {...props}>
55
60
  <>
56
- <H.Two>{children}</H.Two>
61
+ <H.Two $textAlign={textAlign}>{children}</H.Two>
57
62
  </>
58
63
  </PlateElement>
59
64
  );
@@ -69,10 +74,11 @@ export const HThreeElement = React.forwardRef<
69
74
  React.ElementRef<typeof PlateElement>,
70
75
  PlateElementProps
71
76
  >(({ children, ...props }: PlateRenderElementProps, ref) => {
77
+ const textAlign = (props as any)?.style?.textAlign;
72
78
  return (
73
79
  <PlateElement asChild ref={ref} {...props}>
74
80
  <>
75
- <H.Three>{children}</H.Three>
81
+ <H.Three $textAlign={textAlign}>{children}</H.Three>
76
82
  </>
77
83
  </PlateElement>
78
84
  );
@@ -88,10 +94,11 @@ export const HFourElement = React.forwardRef<
88
94
  React.ElementRef<typeof PlateElement>,
89
95
  PlateElementProps
90
96
  >(({ children, ...props }: PlateRenderElementProps, ref) => {
97
+ const textAlign = (props as any)?.style?.textAlign;
91
98
  return (
92
99
  <PlateElement asChild ref={ref} {...props}>
93
100
  <>
94
- <H.Four>{children}</H.Four>
101
+ <H.Four $textAlign={textAlign}>{children}</H.Four>
95
102
  </>
96
103
  </PlateElement>
97
104
  );
@@ -107,10 +114,11 @@ export const HFiveElement = React.forwardRef<
107
114
  React.ElementRef<typeof PlateElement>,
108
115
  PlateElementProps
109
116
  >(({ children, ...props }: PlateRenderElementProps, ref) => {
117
+ const textAlign = (props as any)?.style?.textAlign;
110
118
  return (
111
119
  <PlateElement asChild ref={ref} {...props}>
112
120
  <>
113
- <H.Five>{children}</H.Five>
121
+ <H.Five $textAlign={textAlign}>{children}</H.Five>
114
122
  </>
115
123
  </PlateElement>
116
124
  );
@@ -126,10 +134,11 @@ export const HSixElement = React.forwardRef<
126
134
  React.ElementRef<typeof PlateElement>,
127
135
  PlateElementProps
128
136
  >(({ children, ...props }: PlateRenderElementProps, ref) => {
137
+ const textAlign = (props as any)?.style?.textAlign;
129
138
  return (
130
139
  <PlateElement asChild ref={ref} {...props}>
131
140
  <>
132
- <H.Six>{children}</H.Six>
141
+ <H.Six $textAlign={textAlign}>{children}</H.Six>
133
142
  </>
134
143
  </PlateElement>
135
144
  );