@cfx-dev/ui-components 5.0.2 → 5.0.4
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.
- package/dist/assets/css/Prose.css +1 -1
- package/dist/assets/general/global.css +1 -1
- package/dist/components/Prose/Prose.d.ts +8 -2
- package/dist/components/Prose/Prose.js +31 -8
- package/dist/styles-scss/global.scss +1 -0
- package/dist/styles-scss/tokens.scss +6 -0
- package/dist/utils/ui/ui.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
+
import { ResponsiveTextSize, TextColorProps } from '../Text';
|
|
3
|
+
import { ResponsiveValueType } from '../../utils/ui';
|
|
2
4
|
|
|
3
|
-
export type ProseProps = React.PropsWithChildren
|
|
4
|
-
|
|
5
|
+
export type ProseProps = React.PropsWithChildren & TextColorProps & {
|
|
6
|
+
size?: ResponsiveValueType<ResponsiveTextSize>;
|
|
7
|
+
className?: string;
|
|
8
|
+
lineHeight?: ResponsiveValueType<number>;
|
|
9
|
+
};
|
|
10
|
+
export declare function Prose(props: ProseProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,12 +1,35 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import { jsx as p } from "react/jsx-runtime";
|
|
2
|
+
import { getTextOpacity as g, DEFAULT_TEXT_COLOR as f, lineHeightResponsiveValueFormatter as _, textSizeResponsiveValueFormatter as h } from "../Text/Text.js";
|
|
3
|
+
import { ui as e } from "../../utils/ui/ui.js";
|
|
4
|
+
import { clsx as v } from "../../utils/clsx.js";
|
|
5
|
+
import { getColor as R } from "../../utils/color.js";
|
|
6
|
+
const u = "cfxui__Prose__root__e03c1", x = {
|
|
7
|
+
root: u
|
|
4
8
|
};
|
|
5
|
-
function
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
+
function d(t) {
|
|
10
|
+
const {
|
|
11
|
+
size: o = "normal",
|
|
12
|
+
lineHeight: s = o,
|
|
13
|
+
color: i,
|
|
14
|
+
opacity: r,
|
|
15
|
+
className: n,
|
|
16
|
+
children: l
|
|
17
|
+
} = t, c = R({
|
|
18
|
+
...t,
|
|
19
|
+
color: i || f,
|
|
20
|
+
opacity: g(r)
|
|
21
|
+
}), a = v(
|
|
22
|
+
x.root,
|
|
23
|
+
n,
|
|
24
|
+
e.getResponsiveClassnames("font-size", o),
|
|
25
|
+
e.getResponsiveClassnames("line-height", o)
|
|
26
|
+
), m = {
|
|
27
|
+
color: c,
|
|
28
|
+
...e.getResponsiveStyles("font-size", o, h),
|
|
29
|
+
...e.getResponsiveStyles("line-height", s, _)
|
|
30
|
+
};
|
|
31
|
+
return /* @__PURE__ */ p("div", { className: a, style: m, children: l });
|
|
9
32
|
}
|
|
10
33
|
export {
|
|
11
|
-
|
|
34
|
+
d as Prose
|
|
12
35
|
};
|
|
@@ -143,6 +143,12 @@
|
|
|
143
143
|
}
|
|
144
144
|
}
|
|
145
145
|
|
|
146
|
+
@mixin spacing-tokens() {
|
|
147
|
+
@each $name, $value in ui.$spacingMap {
|
|
148
|
+
@include ui.def('spacing-#{$name}', $value);
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
|
|
146
152
|
@mixin spacer-tokens() {
|
|
147
153
|
// Mobile sizes
|
|
148
154
|
@include ui.def('spacer-xxsmall', ui.gs(100));
|
package/dist/utils/ui/ui.js
CHANGED