@tecsinapse/react-web-kit 1.18.1 → 1.18.2
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/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,17 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [1.18.2](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-web-kit@1.18.1...@tecsinapse/react-web-kit@1.18.2) (2022-08-02)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* width tooltip (max-content) ([c4328dc](https://github.com/tecsinapse/design-system/commit/c4328dc98181586fea213c7900dd4d5236352a44))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
6
17
|
## [1.18.1](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-web-kit@1.18.0...@tecsinapse/react-web-kit@1.18.1) (2022-08-01)
|
|
7
18
|
|
|
8
19
|
**Note:** Version bump only for package @tecsinapse/react-web-kit
|
|
@@ -90,6 +90,7 @@ const TooltipSpan = (0, _styled.default)('span')(({
|
|
|
90
90
|
} = computed || {};
|
|
91
91
|
return (0, _react.css)`
|
|
92
92
|
position: absolute;
|
|
93
|
+
width: max-content;
|
|
93
94
|
padding: ${theme.spacing.micro} ${theme.spacing.centi};
|
|
94
95
|
border-radius: ${theme.borderRadius.mili};
|
|
95
96
|
opacity: 0;
|
|
@@ -129,7 +130,7 @@ const Container = (0, _styled.default)('div')`
|
|
|
129
130
|
& > span {
|
|
130
131
|
opacity: 1;
|
|
131
132
|
visibility: visible;
|
|
132
|
-
|
|
133
|
+
display: flex;
|
|
133
134
|
transform: ${({
|
|
134
135
|
position
|
|
135
136
|
}) => position === 'left' || position === 'right' ? 'translateX(0%)' : 'translateY(0%)'};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/atoms/Tooltip/styled.ts"],"names":["bottomOrTopStylesCommon","width","position","includes","bottomOrTopArrowCommon","topStyles","theme","spacing","centi","topArrow","color","secondary","xdark","bottomStyles","bottomArrow","leftAndRightCommonStyles","height","leftOrRightArrowCommon","leftStyles","leftArrow","rightStyles","rightArrow","TooltipSpan","computed","micro","borderRadius","mili","zIndex","absolute","Container"],"mappings":"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
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/atoms/Tooltip/styled.ts"],"names":["bottomOrTopStylesCommon","width","position","includes","bottomOrTopArrowCommon","topStyles","theme","spacing","centi","topArrow","color","secondary","xdark","bottomStyles","bottomArrow","leftAndRightCommonStyles","height","leftOrRightArrowCommon","leftStyles","leftArrow","rightStyles","rightArrow","TooltipSpan","computed","micro","borderRadius","mili","zIndex","absolute","Container"],"mappings":"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","sourcesContent":["import { css } from '@emotion/react';\nimport { StyleProps, ThemeProp } from '@tecsinapse/react-core';\nimport styled from '@emotion/styled';\nimport { ComputedType, Position } from './Tooltip';\n\ntype InjectedProps = { computed?: ComputedType; position?: Position };\n\n/** Bottom/Top commons */\nconst bottomOrTopStylesCommon = (width: number, position) =>\n ['top', 'bottom'].includes(position as Position) &&\n css`\n left: 50%;\n margin-left: -${width / 2}px;\n `;\n\nconst bottomOrTopArrowCommon = (position?: Position) =>\n ['top', 'bottom'].includes(position as Position) &&\n css`\n left: 50%;\n margin-left: -5px;\n `;\n\n/** Top */\nconst topStyles = (theme: ThemeProp, position?: Position) =>\n position === 'top' &&\n css`\n bottom: 100%;\n margin-bottom: ${theme.spacing.centi};\n transform: translateY(10%);\n `;\n\nconst topArrow = (theme: ThemeProp, position?: Position) =>\n position === 'top' &&\n css`\n top: 100%;\n border-color: ${theme.color.secondary.xdark} transparent transparent\n transparent;\n `;\n\n/** Bottom */\nconst bottomStyles = (theme: ThemeProp, position?: Position) =>\n position === 'bottom' &&\n css`\n top: 100%;\n margin-top: ${theme.spacing.centi};\n transform: translateY(-10%);\n `;\n\nconst bottomArrow = (theme: ThemeProp, position?: Position) =>\n position === 'bottom' &&\n css`\n bottom: 100%;\n border-color: transparent transparent ${theme.color.secondary.xdark}\n transparent;\n `;\n\n/** Bottom/Top commons */\nconst leftAndRightCommonStyles = (height: number, position?: Position) =>\n ['right', 'left'].includes(position as Position) &&\n css`\n top: 50%;\n margin-top: -${height / 2}px;\n `;\n\nconst leftOrRightArrowCommon = (position?: Position) =>\n ['right', 'left'].includes(position as Position) &&\n css`\n top: 50%;\n margin-top: -5px;\n `;\n\n/** Left */\nconst leftStyles = (theme: ThemeProp, position?: Position) =>\n position === 'left' &&\n css`\n right: 100%;\n margin-right: ${theme.spacing.centi};\n transform: translateX(10%);\n `;\n\nconst leftArrow = (theme: ThemeProp, position?: Position) =>\n position === 'left' &&\n css`\n left: 100%;\n border-color: transparent transparent transparent\n ${theme.color.secondary.xdark};\n `;\n\n/** Right */\nconst rightStyles = (theme: ThemeProp, position?: Position) =>\n position === 'right' &&\n css`\n left: 100%;\n margin-left: ${theme.spacing.centi};\n transform: translateX(-10%);\n `;\n\nconst rightArrow = (theme: ThemeProp, position?: Position) =>\n position === 'right' &&\n css`\n right: 100%;\n border-color: transparent ${theme.color.secondary.xdark} transparent\n transparent;\n `;\n\nexport const TooltipSpan = styled('span')<Partial<StyleProps> & InjectedProps>(\n ({ theme, computed, position }) => {\n const { width = 0, height = 0 } = computed || {};\n return css`\n position: absolute;\n width: max-content;\n padding: ${theme.spacing.micro} ${theme.spacing.centi};\n border-radius: ${theme.borderRadius.mili};\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.3s, visibility 0.3s, transform 0.3s;\n background-color: ${theme.color.secondary.xdark};\n z-index: ${theme.zIndex.absolute};\n\n ${bottomOrTopStylesCommon(width, position)}\n ${bottomStyles(theme, position)}\n ${topStyles(theme, position)}\n \n ${leftAndRightCommonStyles(height, position)}\n ${leftStyles(theme, position)}\n ${rightStyles(theme, position)}\n\n &::after {\n content: '';\n position: absolute;\n border-style: solid;\n border-width: 5px;\n\n ${bottomOrTopArrowCommon(position)}\n ${bottomArrow(theme, position)}\n ${topArrow(theme, position)}\n \n ${leftOrRightArrowCommon(position)}\n ${leftArrow(theme, position)}\n ${rightArrow(theme, position)}\n }\n `;\n }\n);\n\nexport const Container = styled('div')<{ position?: Position }>`\n position: relative;\n &:hover {\n & > span {\n opacity: 1;\n visibility: visible;\n display: flex;\n transform: ${({ position }) =>\n position === 'left' || position === 'right'\n ? 'translateX(0%)'\n : 'translateY(0%)'};\n }\n }\n`;\n"],"file":"styled.js"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tecsinapse/react-web-kit",
|
|
3
3
|
"description": "TecSinapse React components",
|
|
4
|
-
"version": "1.18.
|
|
4
|
+
"version": "1.18.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
7
|
"license": "MIT",
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
"@emotion/native": "^11.0.0",
|
|
18
18
|
"@emotion/react": "^11.4.1",
|
|
19
19
|
"@emotion/styled": "^11.3.0",
|
|
20
|
-
"@tecsinapse/react-core": "^1.17.
|
|
20
|
+
"@tecsinapse/react-core": "^1.17.2",
|
|
21
21
|
"@types/react-native": "^0.64.4",
|
|
22
22
|
"react-native-vector-icons": "^9.2.0",
|
|
23
23
|
"react-transition-group": "^4.4.2"
|
|
@@ -36,5 +36,5 @@
|
|
|
36
36
|
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
|
|
37
37
|
"react-native-web": "^0.17.1"
|
|
38
38
|
},
|
|
39
|
-
"gitHead": "
|
|
39
|
+
"gitHead": "077c192810529eb555031e7e35ef90477f8f830d"
|
|
40
40
|
}
|
|
@@ -108,6 +108,7 @@ export const TooltipSpan = styled('span')<Partial<StyleProps> & InjectedProps>(
|
|
|
108
108
|
const { width = 0, height = 0 } = computed || {};
|
|
109
109
|
return css`
|
|
110
110
|
position: absolute;
|
|
111
|
+
width: max-content;
|
|
111
112
|
padding: ${theme.spacing.micro} ${theme.spacing.centi};
|
|
112
113
|
border-radius: ${theme.borderRadius.mili};
|
|
113
114
|
opacity: 0;
|
|
@@ -148,7 +149,7 @@ export const Container = styled('div')<{ position?: Position }>`
|
|
|
148
149
|
& > span {
|
|
149
150
|
opacity: 1;
|
|
150
151
|
visibility: visible;
|
|
151
|
-
|
|
152
|
+
display: flex;
|
|
152
153
|
transform: ${({ position }) =>
|
|
153
154
|
position === 'left' || position === 'right'
|
|
154
155
|
? 'translateX(0%)'
|