@veracity/vui 1.7.0-redesign.6 → 1.7.0
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/cjs/avatar/avatar.js +1 -1
- package/dist/cjs/button/button.d.ts +1 -1
- package/dist/cjs/button/button.d.ts.map +1 -1
- package/dist/cjs/button/button.js +23 -16
- package/dist/cjs/button/button.types.d.ts +4 -3
- package/dist/cjs/button/button.types.d.ts.map +1 -1
- package/dist/cjs/button/buttons.js +8 -8
- package/dist/cjs/button/consts.js +3 -3
- package/dist/cjs/button/theme.d.ts +44 -121
- package/dist/cjs/button/theme.d.ts.map +1 -1
- package/dist/cjs/button/theme.js +54 -135
- package/dist/cjs/buttonGroup/buttonGroup.d.ts.map +1 -1
- package/dist/cjs/buttonGroup/buttonGroup.js +5 -5
- package/dist/cjs/buttonGroup/buttonGroup.types.d.ts +3 -2
- package/dist/cjs/buttonGroup/buttonGroup.types.d.ts.map +1 -1
- package/dist/cjs/buttonGroup/helpers.d.ts.map +1 -1
- package/dist/cjs/buttonGroup/helpers.js +3 -2
- package/dist/cjs/buttonToggleGroup/buttonToggleGroup.d.ts.map +1 -1
- package/dist/cjs/buttonToggleGroup/buttonToggleGroup.js +1 -1
- package/dist/cjs/checkbox/checkbox.js +1 -1
- package/dist/cjs/copyToClipboard/copyToClipboard.js +1 -1
- package/dist/cjs/core/vuiProvider/globalStyle.d.ts.map +1 -1
- package/dist/cjs/core/vuiProvider/globalStyle.js +38 -56
- package/dist/cjs/footer/footerTrademark.js +1 -1
- package/dist/cjs/heading/theme.d.ts +1 -23
- package/dist/cjs/heading/theme.d.ts.map +1 -1
- package/dist/cjs/heading/theme.js +7 -29
- package/dist/cjs/icon/icon.types.d.ts +1 -1
- package/dist/cjs/icon/icon.types.d.ts.map +1 -1
- package/dist/cjs/icon/theme.d.ts +0 -5
- package/dist/cjs/icon/theme.d.ts.map +1 -1
- package/dist/cjs/icon/theme.js +0 -5
- package/dist/cjs/index.d.ts +0 -1
- package/dist/cjs/index.d.ts.map +1 -1
- package/dist/cjs/index.js +0 -1
- package/dist/cjs/input/input.js +1 -1
- package/dist/cjs/input/inputInput.js +1 -1
- package/dist/cjs/link/link.d.ts.map +1 -1
- package/dist/cjs/link/link.js +3 -3
- package/dist/cjs/link/link.types.d.ts +2 -0
- package/dist/cjs/link/link.types.d.ts.map +1 -1
- package/dist/cjs/link/theme.d.ts +4 -21
- package/dist/cjs/link/theme.d.ts.map +1 -1
- package/dist/cjs/link/theme.js +17 -30
- package/dist/cjs/list/listItem.d.ts.map +1 -1
- package/dist/cjs/list/listItem.js +2 -6
- package/dist/cjs/notification/consts.js +10 -10
- package/dist/cjs/notification/notification.d.ts.map +1 -1
- package/dist/cjs/notification/notification.js +8 -10
- package/dist/cjs/notification/notification.types.d.ts +2 -2
- package/dist/cjs/notification/notification.types.d.ts.map +1 -1
- package/dist/cjs/notification/notificationButton.d.ts.map +1 -1
- package/dist/cjs/notification/notificationButton.js +1 -5
- package/dist/cjs/notification/notificationIcon.d.ts.map +1 -1
- package/dist/cjs/notification/notificationIcon.js +2 -3
- package/dist/cjs/notification/notificationText.d.ts.map +1 -1
- package/dist/cjs/notification/notificationText.js +1 -1
- package/dist/cjs/notification/notificationTitle.d.ts +2 -2
- package/dist/cjs/notification/notificationTitle.d.ts.map +1 -1
- package/dist/cjs/notification/notificationTitle.js +2 -2
- package/dist/cjs/notification/theme.d.ts +16 -31
- package/dist/cjs/notification/theme.d.ts.map +1 -1
- package/dist/cjs/notification/theme.js +26 -32
- package/dist/cjs/p/theme.d.ts +8 -0
- package/dist/cjs/p/theme.d.ts.map +1 -1
- package/dist/cjs/p/theme.js +11 -3
- package/dist/cjs/progress/progress.js +1 -1
- package/dist/cjs/select/selectButton.js +1 -1
- package/dist/cjs/t/theme.d.ts +1 -10
- package/dist/cjs/t/theme.d.ts.map +1 -1
- package/dist/cjs/t/theme.js +1 -10
- package/dist/cjs/table/tbody.d.ts.map +1 -1
- package/dist/cjs/table/tbody.js +0 -4
- package/dist/cjs/table/theme.d.ts +0 -5
- package/dist/cjs/table/theme.d.ts.map +1 -1
- package/dist/cjs/table/theme.js +1 -6
- package/dist/cjs/tabs/tabs.types.d.ts +2 -2
- package/dist/cjs/tabs/tabs.types.d.ts.map +1 -1
- package/dist/cjs/tabs/tabsNavBar.d.ts.map +1 -1
- package/dist/cjs/tabs/tabsNavBar.js +5 -13
- package/dist/cjs/tabs/theme.d.ts +4 -40
- package/dist/cjs/tabs/theme.d.ts.map +1 -1
- package/dist/cjs/tabs/theme.js +4 -41
- package/dist/cjs/tag/tag.d.ts.map +1 -1
- package/dist/cjs/tag/tag.js +6 -9
- package/dist/cjs/tag/tag.types.d.ts +2 -3
- package/dist/cjs/tag/tag.types.d.ts.map +1 -1
- package/dist/cjs/tag/tagButton.js +1 -3
- package/dist/cjs/tag/theme.d.ts +32 -178
- package/dist/cjs/tag/theme.d.ts.map +1 -1
- package/dist/cjs/tag/theme.js +65 -182
- package/dist/cjs/textarea/textarea.js +1 -1
- package/dist/cjs/theme/components.d.ts +39 -497
- package/dist/cjs/theme/components.d.ts.map +1 -1
- package/dist/cjs/theme/components.js +68 -70
- package/dist/cjs/theme/defaultTheme.d.ts +46 -795
- package/dist/cjs/theme/defaultTheme.d.ts.map +1 -1
- package/dist/cjs/theme/foundations/colors.d.ts +0 -523
- package/dist/cjs/theme/foundations/colors.d.ts.map +1 -1
- package/dist/cjs/theme/foundations/colors.js +1 -389
- package/dist/cjs/theme/foundations/fontWeights.d.ts +1 -0
- package/dist/cjs/theme/foundations/fontWeights.d.ts.map +1 -1
- package/dist/cjs/theme/foundations/fontWeights.js +2 -1
- package/dist/cjs/theme/foundations/index.d.ts +1 -292
- package/dist/cjs/theme/foundations/index.d.ts.map +1 -1
- package/dist/cjs/theme/foundations/radii.d.ts +0 -5
- package/dist/cjs/theme/foundations/radii.d.ts.map +1 -1
- package/dist/cjs/theme/foundations/radii.js +3 -8
- package/dist/cjs/toast/toast.d.ts +1 -1
- package/dist/cjs/toast/toast.js +1 -1
- package/dist/cjs/toast/useToast.d.ts.map +1 -1
- package/dist/cjs/toast/useToast.js +1 -1
- package/dist/cjs/tutorial/tutorialCard.d.ts.map +1 -1
- package/dist/cjs/tutorial/tutorialCard.js +3 -3
- package/dist/esm/avatar/avatar.js +1 -1
- package/dist/esm/button/button.d.ts +1 -1
- package/dist/esm/button/button.d.ts.map +1 -1
- package/dist/esm/button/button.js +23 -16
- package/dist/esm/button/button.types.d.ts +4 -3
- package/dist/esm/button/button.types.d.ts.map +1 -1
- package/dist/esm/button/buttons.js +8 -8
- package/dist/esm/button/consts.js +3 -3
- package/dist/esm/button/theme.d.ts +44 -121
- package/dist/esm/button/theme.d.ts.map +1 -1
- package/dist/esm/button/theme.js +58 -135
- package/dist/esm/buttonGroup/buttonGroup.d.ts.map +1 -1
- package/dist/esm/buttonGroup/buttonGroup.js +6 -6
- package/dist/esm/buttonGroup/buttonGroup.types.d.ts +3 -2
- package/dist/esm/buttonGroup/buttonGroup.types.d.ts.map +1 -1
- package/dist/esm/buttonGroup/helpers.d.ts.map +1 -1
- package/dist/esm/buttonGroup/helpers.js +3 -2
- package/dist/esm/buttonToggleGroup/buttonToggleGroup.d.ts.map +1 -1
- package/dist/esm/buttonToggleGroup/buttonToggleGroup.js +1 -1
- package/dist/esm/checkbox/checkbox.js +1 -1
- package/dist/esm/copyToClipboard/copyToClipboard.js +1 -1
- package/dist/esm/core/vuiProvider/globalStyle.d.ts.map +1 -1
- package/dist/esm/core/vuiProvider/globalStyle.js +38 -56
- package/dist/esm/footer/footerTrademark.js +1 -1
- package/dist/esm/heading/theme.d.ts +1 -23
- package/dist/esm/heading/theme.d.ts.map +1 -1
- package/dist/esm/heading/theme.js +7 -29
- package/dist/esm/icon/icon.types.d.ts +1 -1
- package/dist/esm/icon/icon.types.d.ts.map +1 -1
- package/dist/esm/icon/theme.d.ts +0 -5
- package/dist/esm/icon/theme.d.ts.map +1 -1
- package/dist/esm/icon/theme.js +0 -5
- package/dist/esm/index.d.ts +0 -1
- package/dist/esm/index.d.ts.map +1 -1
- package/dist/esm/index.js +0 -1
- package/dist/esm/input/input.js +1 -1
- package/dist/esm/input/inputInput.js +1 -1
- package/dist/esm/link/link.d.ts.map +1 -1
- package/dist/esm/link/link.js +3 -3
- package/dist/esm/link/link.types.d.ts +2 -0
- package/dist/esm/link/link.types.d.ts.map +1 -1
- package/dist/esm/link/theme.d.ts +4 -21
- package/dist/esm/link/theme.d.ts.map +1 -1
- package/dist/esm/link/theme.js +17 -30
- package/dist/esm/list/listItem.d.ts.map +1 -1
- package/dist/esm/list/listItem.js +2 -6
- package/dist/esm/notification/consts.js +10 -10
- package/dist/esm/notification/notification.d.ts.map +1 -1
- package/dist/esm/notification/notification.js +9 -11
- package/dist/esm/notification/notification.types.d.ts +2 -2
- package/dist/esm/notification/notification.types.d.ts.map +1 -1
- package/dist/esm/notification/notificationButton.d.ts.map +1 -1
- package/dist/esm/notification/notificationButton.js +1 -4
- package/dist/esm/notification/notificationIcon.d.ts.map +1 -1
- package/dist/esm/notification/notificationIcon.js +2 -3
- package/dist/esm/notification/notificationText.d.ts.map +1 -1
- package/dist/esm/notification/notificationText.js +1 -1
- package/dist/esm/notification/notificationTitle.d.ts +2 -2
- package/dist/esm/notification/notificationTitle.d.ts.map +1 -1
- package/dist/esm/notification/notificationTitle.js +2 -2
- package/dist/esm/notification/theme.d.ts +16 -31
- package/dist/esm/notification/theme.d.ts.map +1 -1
- package/dist/esm/notification/theme.js +26 -32
- package/dist/esm/p/theme.d.ts +8 -0
- package/dist/esm/p/theme.d.ts.map +1 -1
- package/dist/esm/p/theme.js +11 -3
- package/dist/esm/progress/progress.js +1 -1
- package/dist/esm/select/selectButton.js +1 -1
- package/dist/esm/t/theme.d.ts +1 -10
- package/dist/esm/t/theme.d.ts.map +1 -1
- package/dist/esm/t/theme.js +1 -10
- package/dist/esm/table/tbody.d.ts.map +1 -1
- package/dist/esm/table/tbody.js +0 -4
- package/dist/esm/table/theme.d.ts +0 -5
- package/dist/esm/table/theme.d.ts.map +1 -1
- package/dist/esm/table/theme.js +1 -6
- package/dist/esm/tabs/tabs.types.d.ts +2 -2
- package/dist/esm/tabs/tabs.types.d.ts.map +1 -1
- package/dist/esm/tabs/tabsNavBar.d.ts.map +1 -1
- package/dist/esm/tabs/tabsNavBar.js +4 -12
- package/dist/esm/tabs/theme.d.ts +4 -40
- package/dist/esm/tabs/theme.d.ts.map +1 -1
- package/dist/esm/tabs/theme.js +4 -41
- package/dist/esm/tag/tag.d.ts.map +1 -1
- package/dist/esm/tag/tag.js +6 -9
- package/dist/esm/tag/tag.types.d.ts +2 -3
- package/dist/esm/tag/tag.types.d.ts.map +1 -1
- package/dist/esm/tag/tagButton.js +1 -3
- package/dist/esm/tag/theme.d.ts +32 -178
- package/dist/esm/tag/theme.d.ts.map +1 -1
- package/dist/esm/tag/theme.js +65 -182
- package/dist/esm/textarea/textarea.js +1 -1
- package/dist/esm/theme/components.d.ts +39 -497
- package/dist/esm/theme/components.d.ts.map +1 -1
- package/dist/esm/theme/components.js +0 -2
- package/dist/esm/theme/defaultTheme.d.ts +46 -795
- package/dist/esm/theme/defaultTheme.d.ts.map +1 -1
- package/dist/esm/theme/foundations/colors.d.ts +0 -523
- package/dist/esm/theme/foundations/colors.d.ts.map +1 -1
- package/dist/esm/theme/foundations/colors.js +0 -365
- package/dist/esm/theme/foundations/fontWeights.d.ts +1 -0
- package/dist/esm/theme/foundations/fontWeights.d.ts.map +1 -1
- package/dist/esm/theme/foundations/fontWeights.js +2 -1
- package/dist/esm/theme/foundations/index.d.ts +1 -292
- package/dist/esm/theme/foundations/index.d.ts.map +1 -1
- package/dist/esm/theme/foundations/radii.d.ts +0 -5
- package/dist/esm/theme/foundations/radii.d.ts.map +1 -1
- package/dist/esm/theme/foundations/radii.js +3 -8
- package/dist/esm/toast/toast.d.ts +1 -1
- package/dist/esm/toast/toast.js +1 -1
- package/dist/esm/toast/useToast.d.ts.map +1 -1
- package/dist/esm/toast/useToast.js +1 -1
- package/dist/esm/tutorial/tutorialCard.d.ts.map +1 -1
- package/dist/esm/tutorial/tutorialCard.js +3 -3
- package/package.json +1 -1
- package/src/avatar/avatar.tsx +1 -1
- package/src/button/button.tsx +28 -19
- package/src/button/button.types.ts +8 -4
- package/src/button/buttons.tsx +8 -8
- package/src/button/consts.ts +3 -3
- package/src/button/theme.ts +71 -143
- package/src/buttonGroup/buttonGroup.tsx +9 -6
- package/src/buttonGroup/buttonGroup.types.ts +3 -2
- package/src/buttonGroup/helpers.ts +4 -2
- package/src/buttonToggleGroup/buttonToggleGroup.tsx +2 -0
- package/src/checkbox/checkbox.tsx +1 -1
- package/src/copyToClipboard/copyToClipboard.tsx +1 -1
- package/src/core/vuiProvider/globalStyle.tsx +38 -56
- package/src/footer/footerTrademark.tsx +1 -1
- package/src/heading/theme.ts +7 -29
- package/src/icon/icon.types.ts +1 -1
- package/src/icon/theme.ts +0 -5
- package/src/index.ts +0 -1
- package/src/input/input.tsx +1 -1
- package/src/input/inputInput.tsx +1 -1
- package/src/link/link.tsx +3 -2
- package/src/link/link.types.ts +2 -0
- package/src/link/theme.ts +20 -30
- package/src/list/listItem.tsx +2 -6
- package/src/notification/consts.ts +10 -10
- package/src/notification/notification.tsx +11 -17
- package/src/notification/notification.types.ts +2 -2
- package/src/notification/notificationButton.tsx +5 -10
- package/src/notification/notificationIcon.tsx +3 -6
- package/src/notification/notificationText.tsx +1 -2
- package/src/notification/notificationTitle.tsx +9 -3
- package/src/notification/theme.ts +34 -32
- package/src/p/theme.ts +11 -3
- package/src/progress/progress.tsx +1 -1
- package/src/select/selectButton.tsx +1 -1
- package/src/t/theme.ts +1 -10
- package/src/table/tbody.tsx +0 -4
- package/src/table/theme.ts +1 -6
- package/src/tabs/tabs.types.ts +2 -2
- package/src/tabs/tabsNavBar.tsx +6 -23
- package/src/tabs/theme.ts +4 -41
- package/src/tag/tag.tsx +10 -11
- package/src/tag/tag.types.ts +31 -32
- package/src/tag/tagButton.tsx +2 -2
- package/src/tag/theme.ts +80 -183
- package/src/textarea/textarea.tsx +1 -1
- package/src/theme/components.ts +0 -2
- package/src/theme/foundations/colors.ts +0 -401
- package/src/theme/foundations/fontWeights.ts +2 -1
- package/src/theme/foundations/radii.ts +3 -8
- package/src/toast/toast.tsx +1 -1
- package/src/toast/useToast.tsx +1 -2
- package/src/tutorial/tutorialCard.tsx +3 -10
- package/dist/cjs/badge/badge.d.ts +0 -9
- package/dist/cjs/badge/badge.d.ts.map +0 -1
- package/dist/cjs/badge/badge.js +0 -35
- package/dist/cjs/badge/badge.types.d.ts +0 -17
- package/dist/cjs/badge/badge.types.d.ts.map +0 -1
- package/dist/cjs/badge/badge.types.js +0 -2
- package/dist/cjs/badge/index.d.ts +0 -3
- package/dist/cjs/badge/index.d.ts.map +0 -1
- package/dist/cjs/badge/index.js +0 -23
- package/dist/cjs/badge/theme.d.ts +0 -130
- package/dist/cjs/badge/theme.d.ts.map +0 -1
- package/dist/cjs/badge/theme.js +0 -135
- package/dist/cjs/onedesign-tokens/dist/js/es6/rem/button.d.ts +0 -85
- package/dist/cjs/onedesign-tokens/dist/js/es6/rem/button.d.ts.map +0 -1
- package/dist/cjs/onedesign-tokens/dist/js/es6/rem/button.js +0 -88
- package/dist/esm/badge/badge.d.ts +0 -9
- package/dist/esm/badge/badge.d.ts.map +0 -1
- package/dist/esm/badge/badge.js +0 -17
- package/dist/esm/badge/badge.types.d.ts +0 -17
- package/dist/esm/badge/badge.types.d.ts.map +0 -1
- package/dist/esm/badge/badge.types.js +0 -1
- package/dist/esm/badge/index.d.ts +0 -3
- package/dist/esm/badge/index.d.ts.map +0 -1
- package/dist/esm/badge/index.js +0 -2
- package/dist/esm/badge/theme.d.ts +0 -130
- package/dist/esm/badge/theme.d.ts.map +0 -1
- package/dist/esm/badge/theme.js +0 -133
- package/dist/esm/onedesign-tokens/dist/js/es6/rem/button.d.ts +0 -85
- package/dist/esm/onedesign-tokens/dist/js/es6/rem/button.d.ts.map +0 -1
- package/dist/esm/onedesign-tokens/dist/js/es6/rem/button.js +0 -84
- package/src/badge/badge.tsx +0 -36
- package/src/badge/badge.types.ts +0 -17
- package/src/badge/index.ts +0 -2
- package/src/badge/theme.ts +0 -140
- package/src/onedesign-tokens/dist/js/es6/rem/button.js +0 -85
|
@@ -13,7 +13,7 @@ export const FooterTrademark = vui((props, ref) => {
|
|
|
13
13
|
const styles = useStyleConfig('Footer', useFooterContext());
|
|
14
14
|
return (React.createElement(Box, { className: cs('vui-footerTrademark', className), ref: ref, w: "100%", wrap: true, ...styles.trademark, ...rest },
|
|
15
15
|
React.createElement(FooterColumn, { centerV: true, flex: { xs: '0 0 100%', md: '0 0 25%' } },
|
|
16
|
-
React.createElement(Link, { fontWeight: "demi", href: linkedIn ?? defaultLinkedInUrl, iconLeft: React.createElement(Link.Icon, { mr: 1, name: "fabLinkedin", size: "sm" }), isExternal: true
|
|
16
|
+
React.createElement(Link, { colorScheme: "white", fontWeight: "demi", href: linkedIn ?? defaultLinkedInUrl, iconLeft: React.createElement(Link.Icon, { mr: 1, name: "fabLinkedin", size: "sm" }), isExternal: true }, "Follow us")),
|
|
17
17
|
React.createElement(FooterColumn, { centerV: true, flex: { xs: '0 0 100%', md: '0 0 75%' } },
|
|
18
18
|
React.createElement(T, { size: "xs" },
|
|
19
19
|
React.createElement(T, { size: "xs", weight: "demi" }, "Veracity by DNV"),
|
|
@@ -1,59 +1,37 @@
|
|
|
1
1
|
declare const _default: {
|
|
2
|
-
baseStyle: {
|
|
3
|
-
color: string;
|
|
4
|
-
};
|
|
2
|
+
baseStyle: {};
|
|
5
3
|
defaultProps: {
|
|
6
4
|
size: string;
|
|
7
5
|
};
|
|
8
6
|
sizes: {
|
|
9
|
-
title: {
|
|
10
|
-
as: string;
|
|
11
|
-
fontFamily: string;
|
|
12
|
-
fontSize: string;
|
|
13
|
-
fontWeight: string;
|
|
14
|
-
lineHeight: string;
|
|
15
|
-
};
|
|
16
7
|
h1: {
|
|
17
8
|
as: string;
|
|
18
9
|
fontSize: string;
|
|
19
|
-
fontWeight: string;
|
|
20
|
-
lineHeight: string;
|
|
21
|
-
};
|
|
22
|
-
lead: {
|
|
23
|
-
as: string;
|
|
24
|
-
color: string;
|
|
25
|
-
fontSize: string;
|
|
26
|
-
fontWeight: string;
|
|
27
10
|
lineHeight: string;
|
|
28
11
|
};
|
|
29
12
|
h2: {
|
|
30
13
|
as: string;
|
|
31
14
|
fontSize: string;
|
|
32
|
-
fontWeight: string;
|
|
33
15
|
lineHeight: string;
|
|
34
16
|
};
|
|
35
17
|
h3: {
|
|
36
18
|
as: string;
|
|
37
19
|
fontSize: string;
|
|
38
|
-
fontWeight: string;
|
|
39
20
|
lineHeight: string;
|
|
40
21
|
};
|
|
41
22
|
h4: {
|
|
42
23
|
as: string;
|
|
43
24
|
fontSize: string;
|
|
44
|
-
fontWeight: string;
|
|
45
25
|
lineHeight: string;
|
|
46
26
|
};
|
|
47
27
|
h5: {
|
|
48
28
|
as: string;
|
|
49
29
|
fontSize: string;
|
|
50
|
-
fontWeight: string;
|
|
51
30
|
lineHeight: string;
|
|
52
31
|
};
|
|
53
32
|
h6: {
|
|
54
33
|
as: string;
|
|
55
34
|
fontSize: string;
|
|
56
|
-
fontWeight: string;
|
|
57
35
|
lineHeight: string;
|
|
58
36
|
};
|
|
59
37
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/heading/theme.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/heading/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCA,wBAKC"}
|
|
@@ -1,59 +1,37 @@
|
|
|
1
|
-
const baseStyle = {
|
|
2
|
-
color: 'darkBlue.18'
|
|
3
|
-
};
|
|
1
|
+
const baseStyle = {};
|
|
4
2
|
const defaultProps = {
|
|
5
3
|
size: 'h2'
|
|
6
4
|
};
|
|
7
5
|
const sizes = {
|
|
8
|
-
title: {
|
|
9
|
-
as: 'h1',
|
|
10
|
-
fontFamily: 'DNV Display',
|
|
11
|
-
fontSize: '64px',
|
|
12
|
-
fontWeight: 'medium',
|
|
13
|
-
lineHeight: '74px'
|
|
14
|
-
},
|
|
15
6
|
h1: {
|
|
16
7
|
as: 'h1',
|
|
17
|
-
fontSize: '
|
|
18
|
-
|
|
19
|
-
lineHeight: '62px'
|
|
20
|
-
},
|
|
21
|
-
lead: {
|
|
22
|
-
as: 'h2',
|
|
23
|
-
color: 'seaBlue.28',
|
|
24
|
-
fontSize: '28px',
|
|
25
|
-
fontWeight: 'regular',
|
|
26
|
-
lineHeight: '38px'
|
|
8
|
+
fontSize: '40px',
|
|
9
|
+
lineHeight: '52px'
|
|
27
10
|
},
|
|
28
11
|
h2: {
|
|
29
12
|
as: 'h2',
|
|
30
13
|
fontSize: '32px',
|
|
31
|
-
|
|
32
|
-
lineHeight: '42px'
|
|
14
|
+
lineHeight: '40px'
|
|
33
15
|
},
|
|
34
16
|
h3: {
|
|
35
17
|
as: 'h3',
|
|
36
18
|
fontSize: '24px',
|
|
37
|
-
fontWeight: 'regular',
|
|
38
19
|
lineHeight: '32px'
|
|
39
20
|
},
|
|
40
21
|
h4: {
|
|
41
22
|
as: 'h4',
|
|
42
23
|
fontSize: '20px',
|
|
43
|
-
|
|
44
|
-
lineHeight: '24px'
|
|
24
|
+
lineHeight: '28px'
|
|
45
25
|
},
|
|
46
26
|
h5: {
|
|
47
27
|
as: 'h5',
|
|
48
28
|
fontSize: '18px',
|
|
49
|
-
|
|
50
|
-
lineHeight: '26px'
|
|
29
|
+
lineHeight: '24px'
|
|
51
30
|
},
|
|
52
31
|
h6: {
|
|
53
32
|
as: 'h6',
|
|
54
33
|
fontSize: '16px',
|
|
55
|
-
|
|
56
|
-
lineHeight: '22px'
|
|
34
|
+
lineHeight: '20px'
|
|
57
35
|
}
|
|
58
36
|
};
|
|
59
37
|
const variants = {};
|
|
@@ -17,7 +17,7 @@ export declare type IconProps = SvgProps & ThemingProps<'Icon'> & {
|
|
|
17
17
|
icon?: IconProp;
|
|
18
18
|
/** Name of the icon stored in Veracity CDN. */
|
|
19
19
|
name?: IconProp;
|
|
20
|
-
/** Rotates the icon by given
|
|
20
|
+
/** Rotates the icon by given amout of degrees clockwise. */
|
|
21
21
|
rotate?: number;
|
|
22
22
|
/** Uses a scale of 1-10 and multiply of 16px to define icon size. */
|
|
23
23
|
scale?: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.types.d.ts","sourceRoot":"","sources":["../../../src/icon/icon.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAClC,OAAO,GAAG,EAAE,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAE7C,oBAAY,oBAAoB,GAAG;IACjC,UAAU,CAAC,EAAE;QACX,CAAC,EAAE,MAAM,EAAE,CAAA;QACX,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAA;QAC3C,QAAQ,EAAE,OAAO,CAAC,OAAO,GAAG,CAAC,CAAA;KAC9B,CAAA;IACD,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAAA;AAED,oBAAY,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAA;AAE1C,oBAAY,SAAS,GAAG,QAAQ,GAC9B,YAAY,CAAC,MAAM,CAAC,GAAG;IACrB,qCAAqC;IACrC,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,+CAA+C;IAC/C,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,
|
|
1
|
+
{"version":3,"file":"icon.types.d.ts","sourceRoot":"","sources":["../../../src/icon/icon.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAClC,OAAO,GAAG,EAAE,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAE7C,oBAAY,oBAAoB,GAAG;IACjC,UAAU,CAAC,EAAE;QACX,CAAC,EAAE,MAAM,EAAE,CAAA;QACX,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAA;QAC3C,QAAQ,EAAE,OAAO,CAAC,OAAO,GAAG,CAAC,CAAA;KAC9B,CAAA;IACD,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAAA;AAED,oBAAY,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAA;AAE1C,oBAAY,SAAS,GAAG,QAAQ,GAC9B,YAAY,CAAC,MAAM,CAAC,GAAG;IACrB,qCAAqC;IACrC,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,+CAA+C;IAC/C,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,4DAA4D;IAC5D,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA"}
|
package/dist/esm/icon/theme.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/icon/theme.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/icon/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,wBAKC"}
|
package/dist/esm/icon/theme.js
CHANGED
package/dist/esm/index.d.ts
CHANGED
package/dist/esm/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,OAAO,CAAA;AACrB,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,mBAAmB,CAAA;AACjC,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,KAAK,CAAA;AACnB,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,YAAY,CAAA;AAC1B,cAAc,WAAW,CAAA;AACzB,cAAc,OAAO,CAAA;AACrB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,KAAK,CAAA;AACnB,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,OAAO,CAAA;AACrB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA"}
|
package/dist/esm/index.js
CHANGED
package/dist/esm/input/input.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../src/link/link.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAGnE,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,QAAQ,MAAM,YAAY,CAAA;AAEjC,eAAO,MAAM,QAAQ,6HAUpB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI;
|
|
1
|
+
{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../src/link/link.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAGnE,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,QAAQ,MAAM,YAAY,CAAA;AAEjC,eAAO,MAAM,QAAQ,6HAUpB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI;UAgDT,eAAe;UACf,eAAe;CACtB,CAAA;AAKD,eAAe,IAAI,CAAA"}
|
package/dist/esm/link/link.js
CHANGED
|
@@ -6,7 +6,7 @@ import LinkIcon from './linkIcon';
|
|
|
6
6
|
import LinkText from './linkText';
|
|
7
7
|
export const LinkBase = styled.aBox `
|
|
8
8
|
align-items: center;
|
|
9
|
-
border-radius:
|
|
9
|
+
border-radius: sm;
|
|
10
10
|
cursor: pointer;
|
|
11
11
|
display: inline-flex;
|
|
12
12
|
line-height: normal;
|
|
@@ -20,9 +20,9 @@ export const LinkBase = styled.aBox `
|
|
|
20
20
|
* Exposes some props to the children via context.
|
|
21
21
|
*/
|
|
22
22
|
export const Link = vui((props, ref) => {
|
|
23
|
-
const { children, className, decoration, hoverDecoration = 'underline', iconLeft, iconRight, isExternal, isUnderlined, size, text, variant, weight, ...rest } = props;
|
|
23
|
+
const { children, className, colorScheme, decoration, hoverDecoration = 'underline', iconLeft, iconRight, isExternal, isUnderlined, size, text, variant, weight, ...rest } = props;
|
|
24
24
|
const styles = useStyleConfig('Link', props);
|
|
25
|
-
const context = useMemo(() => filterUndefined({ size, variant }), [size, variant]);
|
|
25
|
+
const context = useMemo(() => filterUndefined({ colorScheme, size, variant }), [colorScheme, size, variant]);
|
|
26
26
|
const aliasedProps = filterUndefined({
|
|
27
27
|
fontWeight: weight,
|
|
28
28
|
rel: isExternal ? 'noopener' : undefined,
|
|
@@ -2,6 +2,8 @@ import { IconProp } from '../icon';
|
|
|
2
2
|
import { SystemProps, TypographyProps } from '../system';
|
|
3
3
|
import { ThemingProps } from '../theme';
|
|
4
4
|
export declare type LinkProps = SystemProps & ThemingProps<'Link'> & {
|
|
5
|
+
/** Available theme colors for this component. @default blue */
|
|
6
|
+
colorScheme?: 'blue' | 'white';
|
|
5
7
|
/** Alias for textDecoration prop. @deprecated */
|
|
6
8
|
decoration?: TypographyProps['textDecoration'];
|
|
7
9
|
/** Alias for hoverTextDecoration prop. @deprecated */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"link.types.d.ts","sourceRoot":"","sources":["../../../src/link/link.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,SAAS,GAAG,WAAW,GACjC,YAAY,CAAC,MAAM,CAAC,GAAG;IACrB,iDAAiD;IACjD,UAAU,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC,CAAA;IAC9C,sDAAsD;IACtD,eAAe,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC,CAAA;IACnD,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IACjC,8CAA8C;IAC9C,SAAS,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAClC,6DAA6D;IAC7D,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,oCAAoC;IACpC,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,8CAA8C;IAC9C,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC,OAAO,CAAA;IACpC,6CAA6C;IAC7C,MAAM,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAA;CACvC,CAAA"}
|
|
1
|
+
{"version":3,"file":"link.types.d.ts","sourceRoot":"","sources":["../../../src/link/link.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,SAAS,GAAG,WAAW,GACjC,YAAY,CAAC,MAAM,CAAC,GAAG;IACrB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC9B,iDAAiD;IACjD,UAAU,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC,CAAA;IAC9C,sDAAsD;IACtD,eAAe,CAAC,EAAE,eAAe,CAAC,gBAAgB,CAAC,CAAA;IACnD,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IACjC,8CAA8C;IAC9C,SAAS,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAClC,6DAA6D;IAC7D,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,oCAAoC;IACpC,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,8CAA8C;IAC9C,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC,OAAO,CAAA;IACpC,6CAA6C;IAC7C,MAAM,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAA;CACvC,CAAA"}
|
package/dist/esm/link/theme.d.ts
CHANGED
|
@@ -1,16 +1,11 @@
|
|
|
1
|
-
|
|
1
|
+
import { Dict } from '../utils';
|
|
2
|
+
declare function variantDefault(props: Dict): {
|
|
2
3
|
container: {
|
|
3
4
|
color: string;
|
|
4
5
|
hoverColor: string;
|
|
5
6
|
};
|
|
6
7
|
};
|
|
7
|
-
declare function
|
|
8
|
-
container: {
|
|
9
|
-
color: string;
|
|
10
|
-
hoverColor: string;
|
|
11
|
-
};
|
|
12
|
-
};
|
|
13
|
-
declare function variantLight(): {
|
|
8
|
+
declare function variantLight(props: Dict): {
|
|
14
9
|
container: {
|
|
15
10
|
color: string;
|
|
16
11
|
hoverColor: string;
|
|
@@ -19,6 +14,7 @@ declare function variantLight(): {
|
|
|
19
14
|
declare const _default: {
|
|
20
15
|
baseStyle: {};
|
|
21
16
|
defaultProps: {
|
|
17
|
+
colorScheme: string;
|
|
22
18
|
size: string;
|
|
23
19
|
variant: string;
|
|
24
20
|
};
|
|
@@ -27,7 +23,6 @@ declare const _default: {
|
|
|
27
23
|
sm: {
|
|
28
24
|
container: {
|
|
29
25
|
fontSize: string;
|
|
30
|
-
lineHeight: string;
|
|
31
26
|
};
|
|
32
27
|
icon: {
|
|
33
28
|
size: string;
|
|
@@ -36,7 +31,6 @@ declare const _default: {
|
|
|
36
31
|
md: {
|
|
37
32
|
container: {
|
|
38
33
|
fontSize: string;
|
|
39
|
-
lineHeight: string;
|
|
40
34
|
};
|
|
41
35
|
icon: {
|
|
42
36
|
size: string;
|
|
@@ -45,16 +39,6 @@ declare const _default: {
|
|
|
45
39
|
lg: {
|
|
46
40
|
container: {
|
|
47
41
|
fontSize: string;
|
|
48
|
-
lineHeight: string;
|
|
49
|
-
};
|
|
50
|
-
icon: {
|
|
51
|
-
size: string;
|
|
52
|
-
};
|
|
53
|
-
};
|
|
54
|
-
xl: {
|
|
55
|
-
container: {
|
|
56
|
-
fontSize: string;
|
|
57
|
-
lineHeight: string;
|
|
58
42
|
};
|
|
59
43
|
icon: {
|
|
60
44
|
size: string;
|
|
@@ -69,7 +53,6 @@ declare const _default: {
|
|
|
69
53
|
hoverTextDecoration: string;
|
|
70
54
|
};
|
|
71
55
|
};
|
|
72
|
-
white: typeof variantWhite;
|
|
73
56
|
};
|
|
74
57
|
};
|
|
75
58
|
export default _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/link/theme.ts"],"names":[],"mappings":"AAAA,iBAAS,cAAc;;;;;
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/link/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAE/B,iBAAS,cAAc,CAAC,KAAK,EAAE,IAAI;;;;;EAclC;AAED,iBAAS,YAAY,CAAC,KAAK,EAAE,IAAI;;;;;EAShC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDD,wBAMC"}
|
package/dist/esm/link/theme.js
CHANGED
|
@@ -1,21 +1,20 @@
|
|
|
1
|
-
function variantDefault() {
|
|
1
|
+
function variantDefault(props) {
|
|
2
|
+
const { colorScheme: c } = props;
|
|
2
3
|
const container = {
|
|
3
|
-
color:
|
|
4
|
-
hoverColor:
|
|
5
|
-
};
|
|
6
|
-
return { container };
|
|
7
|
-
}
|
|
8
|
-
function variantWhite() {
|
|
9
|
-
const container = {
|
|
10
|
-
color: `white`,
|
|
11
|
-
hoverColor: `white`
|
|
4
|
+
color: `${c}.80`,
|
|
5
|
+
hoverColor: `${c}.60`
|
|
12
6
|
};
|
|
7
|
+
if (c === 'white') {
|
|
8
|
+
container.color = 'white';
|
|
9
|
+
container.hoverColor = 'white';
|
|
10
|
+
}
|
|
13
11
|
return { container };
|
|
14
12
|
}
|
|
15
|
-
function variantLight() {
|
|
13
|
+
function variantLight(props) {
|
|
14
|
+
const { colorScheme: c } = props;
|
|
16
15
|
const container = {
|
|
17
|
-
color:
|
|
18
|
-
hoverColor:
|
|
16
|
+
color: `${c}.60`,
|
|
17
|
+
hoverColor: `${c}.40`
|
|
19
18
|
};
|
|
20
19
|
return { container };
|
|
21
20
|
}
|
|
@@ -26,6 +25,7 @@ const variantPlain = {
|
|
|
26
25
|
};
|
|
27
26
|
const baseStyle = {};
|
|
28
27
|
const defaultProps = {
|
|
28
|
+
colorScheme: 'blue',
|
|
29
29
|
size: 'md',
|
|
30
30
|
variant: 'default'
|
|
31
31
|
};
|
|
@@ -33,8 +33,7 @@ const parts = ['container', 'icon', 'text'];
|
|
|
33
33
|
const sizes = {
|
|
34
34
|
sm: {
|
|
35
35
|
container: {
|
|
36
|
-
fontSize: '
|
|
37
|
-
lineHeight: '16px'
|
|
36
|
+
fontSize: 'sm'
|
|
38
37
|
},
|
|
39
38
|
icon: {
|
|
40
39
|
size: 'xs'
|
|
@@ -42,8 +41,7 @@ const sizes = {
|
|
|
42
41
|
},
|
|
43
42
|
md: {
|
|
44
43
|
container: {
|
|
45
|
-
fontSize: '
|
|
46
|
-
lineHeight: '20px'
|
|
44
|
+
fontSize: 'md'
|
|
47
45
|
},
|
|
48
46
|
icon: {
|
|
49
47
|
size: 'xs'
|
|
@@ -51,17 +49,7 @@ const sizes = {
|
|
|
51
49
|
},
|
|
52
50
|
lg: {
|
|
53
51
|
container: {
|
|
54
|
-
fontSize: '
|
|
55
|
-
lineHeight: '24px'
|
|
56
|
-
},
|
|
57
|
-
icon: {
|
|
58
|
-
size: 'sm'
|
|
59
|
-
}
|
|
60
|
-
},
|
|
61
|
-
xl: {
|
|
62
|
-
container: {
|
|
63
|
-
fontSize: 'lg',
|
|
64
|
-
lineHeight: '28px'
|
|
52
|
+
fontSize: 'lg'
|
|
65
53
|
},
|
|
66
54
|
icon: {
|
|
67
55
|
size: 'sm'
|
|
@@ -71,8 +59,7 @@ const sizes = {
|
|
|
71
59
|
const variants = {
|
|
72
60
|
default: variantDefault,
|
|
73
61
|
light: variantLight,
|
|
74
|
-
plain: variantPlain
|
|
75
|
-
white: variantWhite
|
|
62
|
+
plain: variantPlain
|
|
76
63
|
};
|
|
77
64
|
export default {
|
|
78
65
|
baseStyle,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"listItem.d.ts","sourceRoot":"","sources":["../../../src/list/listItem.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAkB5C,eAAO,MAAM,YAAY,
|
|
1
|
+
{"version":3,"file":"listItem.d.ts","sourceRoot":"","sources":["../../../src/list/listItem.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAkB5C,eAAO,MAAM,YAAY,8HAYxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,qDA6EnB,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -14,15 +14,11 @@ export const ListItemBase = styled.liBox `
|
|
|
14
14
|
transition-duration: fast;
|
|
15
15
|
|
|
16
16
|
&[aria-disabled='true'] {
|
|
17
|
-
background-color: disabled
|
|
18
|
-
color: disabled
|
|
17
|
+
background-color: disabled.bg;
|
|
18
|
+
color: disabled.color;
|
|
19
19
|
cursor: not-allowed;
|
|
20
20
|
user-select: none;
|
|
21
21
|
}
|
|
22
|
-
|
|
23
|
-
&:focus-visible {
|
|
24
|
-
z-index: 1;
|
|
25
|
-
}
|
|
26
22
|
`;
|
|
27
23
|
/**
|
|
28
24
|
* Displays a list item with text and optional icons. Can be shown as interactive or selected.
|
|
@@ -1,34 +1,34 @@
|
|
|
1
1
|
export const notificationStatusMapping = {
|
|
2
2
|
error: {
|
|
3
|
+
colorScheme: 'red',
|
|
3
4
|
iconProps: {
|
|
4
5
|
name: 'falTimesCircle'
|
|
5
|
-
}
|
|
6
|
-
variant: 'subtleRed'
|
|
6
|
+
}
|
|
7
7
|
},
|
|
8
8
|
info: {
|
|
9
|
+
colorScheme: 'blue',
|
|
9
10
|
iconProps: {
|
|
10
11
|
name: 'falInfoCircle'
|
|
11
|
-
}
|
|
12
|
-
variant: 'subtleBlue'
|
|
12
|
+
}
|
|
13
13
|
},
|
|
14
14
|
loading: {
|
|
15
|
+
colorScheme: 'blue',
|
|
15
16
|
iconProps: {
|
|
16
17
|
animation: 'vui-spin 0.6s linear infinite',
|
|
17
18
|
name: 'fadSpinnerThird',
|
|
18
19
|
pathFill: ['blue.40', 'blue.60']
|
|
19
|
-
}
|
|
20
|
-
variant: 'subtleBlue'
|
|
20
|
+
}
|
|
21
21
|
},
|
|
22
22
|
success: {
|
|
23
|
+
colorScheme: 'green',
|
|
23
24
|
iconProps: {
|
|
24
25
|
name: 'falCheckCircle'
|
|
25
|
-
}
|
|
26
|
-
variant: 'subtleGreen'
|
|
26
|
+
}
|
|
27
27
|
},
|
|
28
28
|
warning: {
|
|
29
|
+
colorScheme: 'yellow',
|
|
29
30
|
iconProps: {
|
|
30
31
|
name: 'falExclamationCircle'
|
|
31
|
-
}
|
|
32
|
-
variant: 'subtleYellow'
|
|
32
|
+
}
|
|
33
33
|
}
|
|
34
34
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAI3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAEnD;;;GAGG;AACH,eAAO,MAAM,YAAY;
|
|
1
|
+
{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAI3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAEnD;;;GAGG;AACH,eAAO,MAAM,YAAY;YAmDf,yBAAyB;UAC3B,uBAAuB;UACvB,uBAAuB;WACtB,wBAAwB;CAChC,CAAA;AAOD,eAAe,YAAY,CAAA"}
|
|
@@ -13,23 +13,21 @@ import NotificationTitle from './notificationTitle';
|
|
|
13
13
|
* Handles multiple states, like info, error or loading.
|
|
14
14
|
*/
|
|
15
15
|
export const Notification = vui((props, ref) => {
|
|
16
|
-
const { action, children, className, colorScheme: colorSchemeProp, icon, onClose, size, status, statusMapping, text, title, variant
|
|
16
|
+
const { action, children, className, colorScheme: colorSchemeProp = 'blue', icon, onClose, size, status, statusMapping, text, title, variant, ...rest } = props;
|
|
17
17
|
const statuses = { ...notificationStatusMapping, ...statusMapping };
|
|
18
|
-
const {
|
|
19
|
-
const styles = useStyleConfig('Notification', {
|
|
18
|
+
const { colorScheme = colorSchemeProp } = statuses[status ?? ''] ?? {};
|
|
19
|
+
const styles = useStyleConfig('Notification', { colorScheme, ...props });
|
|
20
20
|
const iconName = isString(icon) ? icon : statuses[status ?? '']?.iconProps?.name;
|
|
21
|
-
const context = filterUndefined({ size, status });
|
|
22
|
-
const titleDisplay = action ? 'block' : 'inline-flex';
|
|
23
|
-
const alignSelf = verticalAlign === 'center' ? 'center' : 'flex-start';
|
|
21
|
+
const context = filterUndefined({ colorScheme, size, status, variant });
|
|
24
22
|
return (React.createElement(NotificationProvider, { value: context },
|
|
25
|
-
React.createElement(Box, { borderRadius: "md",
|
|
26
|
-
iconName ? React.createElement(NotificationIcon, {
|
|
27
|
-
children ?? (React.createElement(NotificationText,
|
|
28
|
-
isReactText(title) ? React.createElement(NotificationTitle, {
|
|
23
|
+
React.createElement(Box, { borderRadius: "md", className: cs('vui-notification', className), px: 1.5, py: 1, ref: ref, w: "fit-content", ...styles.container, ...rest },
|
|
24
|
+
iconName ? React.createElement(NotificationIcon, { name: iconName }) : icon,
|
|
25
|
+
children ?? (React.createElement(NotificationText, null,
|
|
26
|
+
isReactText(title) ? React.createElement(NotificationTitle, { text: title }) : title,
|
|
29
27
|
" ",
|
|
30
28
|
text)),
|
|
31
29
|
action,
|
|
32
|
-
onClose &&
|
|
30
|
+
onClose && React.createElement(NotificationButton, { icon: "falTimes", onClick: onClose }))));
|
|
33
31
|
});
|
|
34
32
|
Notification.Button = NotificationButton;
|
|
35
33
|
Notification.Icon = NotificationIcon;
|
|
@@ -5,7 +5,7 @@ import { ThemingProps } from '../theme';
|
|
|
5
5
|
export declare type NotificationProps = Omit<BoxProps, 'size' | 'variant'> & ThemingProps<'Notification'> & {
|
|
6
6
|
/** Socket displaying a button on the right. */
|
|
7
7
|
action?: ReactNode;
|
|
8
|
-
/** Available theme colors for this component. @
|
|
8
|
+
/** Available theme colors for this component. @default blue */
|
|
9
9
|
colorScheme?: 'blue' | 'green' | 'red' | 'yellow';
|
|
10
10
|
/** Socket displaying an icon on the left. */
|
|
11
11
|
icon?: IconProp | JSX.Element;
|
|
@@ -22,7 +22,7 @@ export declare type NotificationProps = Omit<BoxProps, 'size' | 'variant'> & The
|
|
|
22
22
|
};
|
|
23
23
|
export declare type NotificationStatus = 'error' | 'info' | 'loading' | 'success' | 'warning';
|
|
24
24
|
export declare type NotificationStatusMapping = Record<string, {
|
|
25
|
+
colorScheme?: NotificationProps['colorScheme'];
|
|
25
26
|
iconProps: IconProps;
|
|
26
|
-
variant?: NotificationProps['variant'];
|
|
27
27
|
}>;
|
|
28
28
|
//# sourceMappingURL=notification.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notification.types.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,iBAAiB,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC,GAChE,YAAY,CAAC,cAAc,CAAC,GAAG;IAC7B,+CAA+C;IAC/C,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB
|
|
1
|
+
{"version":3,"file":"notification.types.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,iBAAiB,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC,GAChE,YAAY,CAAC,cAAc,CAAC,GAAG;IAC7B,+CAA+C;IAC/C,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;IACjD,6CAA6C;IAC7C,IAAI,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7B,0EAA0E;IAC1E,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yEAAyE;IACzE,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,+DAA+D;IAC/D,aAAa,CAAC,EAAE,yBAAyB,CAAA;IACzC,4CAA4C;IAC5C,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,CAAA;AAEH,oBAAY,kBAAkB,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;AAErF,oBAAY,yBAAyB,GAAG,MAAM,CAC5C,MAAM,EACN;IACE,WAAW,CAAC,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC9C,SAAS,EAAE,SAAS,CAAA;CACrB,CACF,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notificationButton.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationButton.tsx"],"names":[],"mappings":"AAEA,OAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"notificationButton.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationButton.tsx"],"names":[],"mappings":"AAEA,OAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAK/C,yDAAyD;AACzD,eAAO,MAAM,kBAAkB,uDAkB7B,CAAA;AAEF,eAAe,kBAAkB,CAAA"}
|
|
@@ -2,15 +2,12 @@ import React from 'react';
|
|
|
2
2
|
import Button from '../button';
|
|
3
3
|
import { useStyleConfig, vui } from '../core';
|
|
4
4
|
import { cs } from '../utils';
|
|
5
|
-
import { notificationStatusMapping } from './consts';
|
|
6
5
|
import { useNotificationContext } from './context';
|
|
7
6
|
/** Displays an action button within the Notification. */
|
|
8
7
|
export const NotificationButton = vui((props, ref) => {
|
|
9
8
|
const { className, ...rest } = props;
|
|
10
9
|
const mergedProps = { ...useNotificationContext(), ...props };
|
|
11
10
|
const styles = useStyleConfig('Notification', useNotificationContext());
|
|
12
|
-
|
|
13
|
-
const { variant } = notificationStatusMapping[status] ?? {};
|
|
14
|
-
return (React.createElement(Button, { className: cs('vui-notificationButton', className), ml: "0px", mr: "16px", my: "16px", px: "12px", py: "6px", ref: ref, ...styles.button, variant: variant, ...rest }));
|
|
11
|
+
return (React.createElement(Button, { className: cs('vui-notificationButton', className), colorScheme: mergedProps.colorScheme, ml: 1, mr: -0.5, ref: ref, size: "sm", variant: "text", ...styles.button, ...rest }));
|
|
15
12
|
});
|
|
16
13
|
export default NotificationButton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notificationIcon.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationIcon.tsx"],"names":[],"mappings":"AAGA,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAKzC,oEAAoE;AACpE,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"notificationIcon.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationIcon.tsx"],"names":[],"mappings":"AAGA,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAKzC,oEAAoE;AACpE,eAAO,MAAM,gBAAgB,kDAoB3B,CAAA;AAEF,eAAe,gBAAgB,CAAA"}
|
|
@@ -6,12 +6,11 @@ import { notificationStatusMapping } from './consts';
|
|
|
6
6
|
import { useNotificationContext } from './context';
|
|
7
7
|
/** Displays an icon based on the status within the Notification. */
|
|
8
8
|
export const NotificationIcon = vui((props, ref) => {
|
|
9
|
-
const { className,
|
|
9
|
+
const { className, ...rest } = props;
|
|
10
10
|
const mergedProps = { ...useNotificationContext(), ...props };
|
|
11
11
|
const styles = useStyleConfig('Notification', useNotificationContext());
|
|
12
12
|
const { status = '' } = mergedProps;
|
|
13
13
|
const { iconProps } = notificationStatusMapping[status] ?? {};
|
|
14
|
-
|
|
15
|
-
return (React.createElement(Icon, { alignSelf: alignSelf, className: cs('vui-notificationIcon', className), ml: "16px", mt: marginTop, ref: ref, size: "md", ...styles.icon, ...iconProps, ...rest }));
|
|
14
|
+
return (React.createElement(Icon, { className: cs('vui-notificationIcon', className), mr: 1, my: 0.5, ref: ref, size: "md", ...styles.icon, ...iconProps, ...rest }));
|
|
16
15
|
});
|
|
17
16
|
export default NotificationIcon;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notificationText.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationText.tsx"],"names":[],"mappings":"AAGA,OAAU,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAIhC,6CAA6C;AAC7C,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"notificationText.d.ts","sourceRoot":"","sources":["../../../src/notification/notificationText.tsx"],"names":[],"mappings":"AAGA,OAAU,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAIhC,6CAA6C;AAC7C,eAAO,MAAM,gBAAgB,6CAgB3B,CAAA;AAEF,eAAe,gBAAgB,CAAA"}
|
|
@@ -7,6 +7,6 @@ import { useNotificationContext } from './context';
|
|
|
7
7
|
export const NotificationText = vui((props, ref) => {
|
|
8
8
|
const { className, ...rest } = props;
|
|
9
9
|
const styles = useStyleConfig('Notification', useNotificationContext());
|
|
10
|
-
return (React.createElement(T, { className: cs('vui-notificationText', className), flex: "1", lineHeight: "24px", minW: 0,
|
|
10
|
+
return (React.createElement(T, { className: cs('vui-notificationText', className), flex: "1", lineHeight: "24px", minW: 0, py: 0.5, ref: ref, ...styles.text, ...rest }));
|
|
11
11
|
});
|
|
12
12
|
export default NotificationText;
|