@julseb-lib/react 0.0.8 → 0.0.10
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.cjs.js +228 -227
- package/dist/index.es.js +1610 -1601
- package/dist/index.umd.js +45 -44
- package/dist/lib/components/Header/HeaderNav.tsx +3 -0
- package/dist/lib/components/Header/subtypes.ts +1 -0
- package/dist/lib/components/Header/types.ts +10 -1
- package/dist/lib/components/InputComponents/components/InputValidationHelper.tsx +6 -0
- package/dist/lib/components/InputContainer/InputContainer.tsx +10 -0
- package/dist/lib/components/InputContainer/styles.tsx +7 -0
- package/dist/lib/components/PageLayout/PageLayout.tsx +1 -3
- package/dist/lib/components/PageLayout/types.ts +1 -1
- package/package.json +1 -1
|
@@ -16,6 +16,7 @@ export function HeaderNav({
|
|
|
16
16
|
isOpen,
|
|
17
17
|
children,
|
|
18
18
|
links,
|
|
19
|
+
nav,
|
|
19
20
|
headerHeight,
|
|
20
21
|
variant,
|
|
21
22
|
navMobileVariant,
|
|
@@ -73,6 +74,8 @@ export function HeaderNav({
|
|
|
73
74
|
))
|
|
74
75
|
: null}
|
|
75
76
|
|
|
77
|
+
{nav && (nav as any)}
|
|
78
|
+
|
|
76
79
|
{children && children}
|
|
77
80
|
</Nav>
|
|
78
81
|
)
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/*=============================================== Header types ===============================================*/
|
|
2
2
|
|
|
3
|
+
import type { FC } from "react"
|
|
3
4
|
import type {
|
|
4
5
|
LibComponentBase,
|
|
5
6
|
LibHeaderPosition,
|
|
@@ -56,12 +57,20 @@ type HeaderPosition = HeaderNotFixed | HeaderFixed
|
|
|
56
57
|
|
|
57
58
|
type HeaderWithLinks = HeaderPosition & {
|
|
58
59
|
links: Array<LibHeaderLink>
|
|
60
|
+
nav?: never
|
|
61
|
+
children?: never
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
type HeaderWithNav = HeaderPosition & {
|
|
65
|
+
links?: never
|
|
66
|
+
nav: JSX.Element | FC | ReactChildren
|
|
59
67
|
children?: never
|
|
60
68
|
}
|
|
61
69
|
|
|
62
70
|
type HeaderWithChildren = HeaderPosition & {
|
|
63
71
|
links?: never
|
|
72
|
+
nav?: never
|
|
64
73
|
children?: ReactChildren
|
|
65
74
|
}
|
|
66
75
|
|
|
67
|
-
export type ILibHeader = HeaderWithLinks | HeaderWithChildren
|
|
76
|
+
export type ILibHeader = HeaderWithLinks | HeaderWithNav | HeaderWithChildren
|
|
@@ -84,6 +84,12 @@ export function InputValidationHelper({
|
|
|
84
84
|
<HelperBottom
|
|
85
85
|
data-testid={testid && `${testid}.ValidationHelper.Text`}
|
|
86
86
|
className={className && "ValidationTextBottom"}
|
|
87
|
+
$hasIcon
|
|
88
|
+
$iconSize={
|
|
89
|
+
(status === false
|
|
90
|
+
? iconNotPassedSize
|
|
91
|
+
: iconPassedSize) as number
|
|
92
|
+
}
|
|
87
93
|
>
|
|
88
94
|
{message}
|
|
89
95
|
</HelperBottom>
|
|
@@ -119,6 +119,7 @@ export const InputContainer = forwardRef<HTMLDivElement, ILibInputContainer>(
|
|
|
119
119
|
? helperBottom.fontStyle
|
|
120
120
|
: undefined
|
|
121
121
|
}
|
|
122
|
+
$hasIcon={false}
|
|
122
123
|
>
|
|
123
124
|
{typeof helperBottom === "string"
|
|
124
125
|
? helperBottom
|
|
@@ -137,6 +138,10 @@ export const InputContainer = forwardRef<HTMLDivElement, ILibInputContainer>(
|
|
|
137
138
|
`${testid}.HelperBottom.IconContainer`
|
|
138
139
|
}
|
|
139
140
|
className={className && "BottomIconContainer"}
|
|
141
|
+
$iconSize={
|
|
142
|
+
(helperBottom.iconSize ||
|
|
143
|
+
getIconSizeFromFont("small")) as number
|
|
144
|
+
}
|
|
140
145
|
>
|
|
141
146
|
<LibIcon
|
|
142
147
|
data-testid={
|
|
@@ -169,6 +174,11 @@ export const InputContainer = forwardRef<HTMLDivElement, ILibInputContainer>(
|
|
|
169
174
|
? helperBottom.fontStyle
|
|
170
175
|
: undefined
|
|
171
176
|
}
|
|
177
|
+
$hasIcon
|
|
178
|
+
$iconSize={
|
|
179
|
+
(helperBottom.iconSize ||
|
|
180
|
+
getIconSizeFromFont("small")) as number
|
|
181
|
+
}
|
|
172
182
|
>
|
|
173
183
|
{helperBottom.text}
|
|
174
184
|
</HelperBottom>
|
|
@@ -10,6 +10,7 @@ import {
|
|
|
10
10
|
FONT_SIZES,
|
|
11
11
|
FONT_WEIGHTS,
|
|
12
12
|
LINE_HEIGHTS,
|
|
13
|
+
SPACERS,
|
|
13
14
|
} from "../../"
|
|
14
15
|
import type { CssFontStyle } from "../../types"
|
|
15
16
|
|
|
@@ -59,8 +60,14 @@ const HelperBottomIconContainer = styled.span<{ $iconSize: number }>`
|
|
|
59
60
|
|
|
60
61
|
const HelperBottom = styled(Text).attrs({ tag: "small" })<{
|
|
61
62
|
$fontStyle?: CssFontStyle
|
|
63
|
+
$hasIcon?: boolean
|
|
64
|
+
$iconSize?: number
|
|
62
65
|
}>`
|
|
63
66
|
font-style: ${({ $fontStyle }) => $fontStyle};
|
|
67
|
+
width: ${({ $hasIcon, $iconSize }) =>
|
|
68
|
+
$hasIcon &&
|
|
69
|
+
$iconSize &&
|
|
70
|
+
`calc(100% - ${stringifyPx($iconSize)} - ${SPACERS.XXS})`};
|
|
64
71
|
` as FC<any>
|
|
65
72
|
|
|
66
73
|
setDefaultTheme([
|
|
@@ -14,7 +14,7 @@ interface ILibPageLayoutBase {
|
|
|
14
14
|
pageLoading?: ILibPageLoading
|
|
15
15
|
titleLoading?: string
|
|
16
16
|
helmet?: Omit<ILibHelmet, "children">
|
|
17
|
-
header?: Omit<ILibHeader, "children">
|
|
17
|
+
header?: Omit<ILibHeader, "children">
|
|
18
18
|
footer?: Omit<ILibFooter, "children">
|
|
19
19
|
}
|
|
20
20
|
|