@manamerge/mana-atomic-ui 1.0.183 → 1.0.185
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/index.d.ts +1 -0
- package/dist/index.js +44 -22
- package/dist/index.js.map +1 -1
- package/dist/themes/themes/manamerge/fonts/Gilmer-Bold.woff2 +0 -0
- package/dist/themes/themes/manamerge/fonts/Gilmer-Heavy.woff2 +0 -0
- package/dist/themes/themes/manamerge/fonts/Gilmer-Light.woff2 +0 -0
- package/dist/themes/themes/manamerge/fonts/Gilmer-Medium.woff2 +0 -0
- package/dist/themes/themes/manamerge/fonts/Gilmer-Regular.woff2 +0 -0
- package/dist/themes/themes/manamerge/layouts/pint3.ts +3 -2
- package/dist/themes/themes/manamerge/miscellaneous/colorpalette.ts +3 -0
- package/dist/themes/themes/manamerge/molecules/cardSimpleRender.ts +22 -16
- package/dist/types/components/Layouts/Pint3/Pint3.stories.d.ts +1 -0
- package/dist/types/components/Molecules/CardSimpleRender/CardSimpleRender.css.d.ts +1 -0
- package/dist/types/components/Molecules/CardSimpleRender/CardSimpleRender.d.ts +1 -0
- package/dist/types/components/Molecules/CardSimpleRender/CardSimpleRender.stories copy.d.ts +11 -0
- package/dist/types/themes/ManamergeTheme.d.ts +12 -8
- package/dist/types/themes/manamerge/layouts/pint3.d.ts +2 -1
- package/dist/types/themes/manamerge/miscellaneous/colorpalette.d.ts +3 -0
- package/dist/types/themes/manamerge/molecules/cardSimpleRender.d.ts +7 -7
- package/package.json +1 -1
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -1,36 +1,42 @@
|
|
|
1
|
+
import colors from "../miscellaneous/colorpalette";
|
|
2
|
+
|
|
1
3
|
const cardSimpleRender = {
|
|
2
4
|
"CardSimpleRender-primary": {
|
|
3
5
|
flexDirection: "column",
|
|
4
6
|
justifyContent: "space-between",
|
|
5
7
|
gap: "20px",
|
|
6
|
-
background:
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
borderRadius: "
|
|
10
|
-
padding: "
|
|
8
|
+
background: colors.five.a,
|
|
9
|
+
gradientColor: colors.two.a,
|
|
10
|
+
outline: `2px solid ${colors.two.b}40`,
|
|
11
|
+
borderRadius: "20px",
|
|
12
|
+
padding: "20px",
|
|
11
13
|
height: "100%",
|
|
12
|
-
maxWidth: "
|
|
13
|
-
minWidth: "
|
|
14
|
+
maxWidth: "550px",
|
|
15
|
+
minWidth: "250px",
|
|
14
16
|
focus: {
|
|
15
|
-
border:
|
|
16
|
-
|
|
17
|
-
|
|
17
|
+
// border: `2px dashed ${colors.two.c}`,
|
|
18
|
+
outline: `2px dashed ${colors.two.c}`,
|
|
19
|
+
// boxShadow: `5px 5px 2px 1px ${colors.two.c}13`,
|
|
20
|
+
transition: "outline 0.5s ease"
|
|
18
21
|
},
|
|
19
22
|
hover: {
|
|
20
|
-
border:
|
|
21
|
-
|
|
22
|
-
|
|
23
|
+
// border: `2px solid ${colors.two.c}`,
|
|
24
|
+
outline: `2px solid ${colors.two.c}`,
|
|
25
|
+
// boxShadow: `5px 5px 2px 1px ${colors.two.c}33`,
|
|
26
|
+
transition: "outline 0.5s ease"
|
|
23
27
|
},
|
|
24
28
|
|
|
25
29
|
atomIcon: {
|
|
26
|
-
variant: "
|
|
30
|
+
variant: "sm",
|
|
31
|
+
fill: colors.two.a,
|
|
32
|
+
stroke: colors.two.a
|
|
27
33
|
},
|
|
28
34
|
atomHeading: {
|
|
29
35
|
variant: "primary",
|
|
30
|
-
|
|
36
|
+
asTag: "h3"
|
|
31
37
|
},
|
|
32
38
|
atomText: {
|
|
33
|
-
variant: "
|
|
39
|
+
variant: "primary-light"
|
|
34
40
|
}
|
|
35
41
|
}
|
|
36
42
|
};
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
export declare const Card: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
3
3
|
moleculeVariant: string;
|
|
4
4
|
cardHover: boolean;
|
|
5
|
+
gradientPosition?: string | undefined;
|
|
5
6
|
}>> & string;
|
|
6
7
|
export declare const WrapperLine: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
7
8
|
export declare const AtomIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("../../Atoms/Icon/Icon").IconTypes, import("../../Atoms/Icon/Icon").IconTypes>, {
|
|
@@ -4,6 +4,7 @@ export interface CardSimpleRenderTypes {
|
|
|
4
4
|
icon?: FunctionComponent<SVGProps<SVGSVGElement>>;
|
|
5
5
|
title?: string;
|
|
6
6
|
description?: string;
|
|
7
|
+
gradientPosition?: "center" | "top" | "bottom" | "left" | "right" | "top left" | "top right" | "bottom left" | "bottom right";
|
|
7
8
|
children?: ReactNode;
|
|
8
9
|
onClick?: React.MouseEventHandler<HTMLElement>;
|
|
9
10
|
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { CardSimpleRenderTypes } from "./CardSimpleRender";
|
|
3
|
+
declare const meta: Meta<CardSimpleRenderTypes>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<CardSimpleRenderTypes>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const Hover: Story;
|
|
8
|
+
export declare const Flex: Story;
|
|
9
|
+
export declare const FlexExtra: Story;
|
|
10
|
+
export declare const Flex2: Story;
|
|
11
|
+
export declare const Isolado: Story;
|
|
@@ -1247,29 +1247,29 @@ export declare const ManamergeTheme: {
|
|
|
1247
1247
|
justifyContent: string;
|
|
1248
1248
|
gap: string;
|
|
1249
1249
|
background: string;
|
|
1250
|
-
|
|
1251
|
-
|
|
1250
|
+
gradientColor: string;
|
|
1251
|
+
outline: string;
|
|
1252
1252
|
borderRadius: string;
|
|
1253
1253
|
padding: string;
|
|
1254
1254
|
height: string;
|
|
1255
1255
|
maxWidth: string;
|
|
1256
1256
|
minWidth: string;
|
|
1257
1257
|
focus: {
|
|
1258
|
-
|
|
1259
|
-
boxShadow: string;
|
|
1258
|
+
outline: string;
|
|
1260
1259
|
transition: string;
|
|
1261
1260
|
};
|
|
1262
1261
|
hover: {
|
|
1263
|
-
|
|
1264
|
-
boxShadow: string;
|
|
1262
|
+
outline: string;
|
|
1265
1263
|
transition: string;
|
|
1266
1264
|
};
|
|
1267
1265
|
atomIcon: {
|
|
1268
1266
|
variant: string;
|
|
1267
|
+
fill: string;
|
|
1268
|
+
stroke: string;
|
|
1269
1269
|
};
|
|
1270
1270
|
atomHeading: {
|
|
1271
1271
|
variant: string;
|
|
1272
|
-
|
|
1272
|
+
asTag: string;
|
|
1273
1273
|
};
|
|
1274
1274
|
atomText: {
|
|
1275
1275
|
variant: string;
|
|
@@ -1331,10 +1331,11 @@ export declare const ManamergeTheme: {
|
|
|
1331
1331
|
pint3: {
|
|
1332
1332
|
"Pint3-primary": {
|
|
1333
1333
|
gap: string;
|
|
1334
|
-
|
|
1334
|
+
minHeight: string;
|
|
1335
1335
|
maxWidth: string;
|
|
1336
1336
|
column: {
|
|
1337
1337
|
gap: string;
|
|
1338
|
+
minHeight: string;
|
|
1338
1339
|
minWidth: string;
|
|
1339
1340
|
maxWidth: string;
|
|
1340
1341
|
};
|
|
@@ -1404,6 +1405,9 @@ export declare const ManamergeTheme: {
|
|
|
1404
1405
|
a: string;
|
|
1405
1406
|
b: string;
|
|
1406
1407
|
};
|
|
1408
|
+
five: {
|
|
1409
|
+
a: string;
|
|
1410
|
+
};
|
|
1407
1411
|
};
|
|
1408
1412
|
pages: {
|
|
1409
1413
|
vod: {
|
|
@@ -4,29 +4,29 @@ declare const cardSimpleRender: {
|
|
|
4
4
|
justifyContent: string;
|
|
5
5
|
gap: string;
|
|
6
6
|
background: string;
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
gradientColor: string;
|
|
8
|
+
outline: string;
|
|
9
9
|
borderRadius: string;
|
|
10
10
|
padding: string;
|
|
11
11
|
height: string;
|
|
12
12
|
maxWidth: string;
|
|
13
13
|
minWidth: string;
|
|
14
14
|
focus: {
|
|
15
|
-
|
|
16
|
-
boxShadow: string;
|
|
15
|
+
outline: string;
|
|
17
16
|
transition: string;
|
|
18
17
|
};
|
|
19
18
|
hover: {
|
|
20
|
-
|
|
21
|
-
boxShadow: string;
|
|
19
|
+
outline: string;
|
|
22
20
|
transition: string;
|
|
23
21
|
};
|
|
24
22
|
atomIcon: {
|
|
25
23
|
variant: string;
|
|
24
|
+
fill: string;
|
|
25
|
+
stroke: string;
|
|
26
26
|
};
|
|
27
27
|
atomHeading: {
|
|
28
28
|
variant: string;
|
|
29
|
-
|
|
29
|
+
asTag: string;
|
|
30
30
|
};
|
|
31
31
|
atomText: {
|
|
32
32
|
variant: string;
|