ncore-ui-kit 1.0.0-alpha.0 → 1.0.0-alpha.1
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/lib/module/components/localeSwitcher/index.js +11 -1
- package/lib/module/components/localeSwitcher/index.js.map +1 -1
- package/lib/module/components/paletteSwitcher/index.js +12 -2
- package/lib/module/components/paletteSwitcher/index.js.map +1 -1
- package/lib/module/components/themeSwitcher/index.js +11 -1
- package/lib/module/components/themeSwitcher/index.js.map +1 -1
- package/lib/module/index.js +1 -0
- package/lib/module/index.js.map +1 -1
- package/lib/module/package.json +1 -1
- package/lib/module/types/index.js.map +1 -1
- package/lib/module/utils/index.js +3 -1
- package/lib/module/utils/index.js.map +1 -1
- package/lib/package.json +1 -1
- package/lib/src/components/localeSwitcher/index.js +19 -7
- package/lib/src/components/paletteSwitcher/index.js +20 -8
- package/lib/src/components/themeSwitcher/index.js +19 -7
- package/lib/src/index.js +1 -0
- package/lib/src/utils/index.js +3 -1
- package/lib/tsconfig.build.tsbuildinfo +1 -1
- package/lib/typescript/package.json +1 -1
- package/lib/typescript/src/components/header/stylesheet.d.ts +312 -8
- package/lib/typescript/src/components/header/stylesheet.d.ts.map +1 -1
- package/lib/typescript/src/components/localeSwitcher/index.d.ts.map +1 -1
- package/lib/typescript/src/components/localeSwitcher/type.d.ts +1 -0
- package/lib/typescript/src/components/localeSwitcher/type.d.ts.map +1 -1
- package/lib/typescript/src/components/paletteSwitcher/index.d.ts.map +1 -1
- package/lib/typescript/src/components/paletteSwitcher/type.d.ts +1 -0
- package/lib/typescript/src/components/paletteSwitcher/type.d.ts.map +1 -1
- package/lib/typescript/src/components/themeSwitcher/index.d.ts.map +1 -1
- package/lib/typescript/src/components/themeSwitcher/type.d.ts +1 -0
- package/lib/typescript/src/components/themeSwitcher/type.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +2 -1
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/types/index.d.ts +9 -1
- package/lib/typescript/src/types/index.d.ts.map +1 -1
- package/lib/typescript/src/utils/index.d.ts +3 -1
- package/lib/typescript/src/utils/index.d.ts.map +1 -1
- package/package.json +4 -3
- package/src/components/localeSwitcher/index.tsx +27 -14
- package/src/components/localeSwitcher/type.ts +1 -0
- package/src/components/paletteSwitcher/index.tsx +28 -15
- package/src/components/paletteSwitcher/type.ts +1 -0
- package/src/components/themeSwitcher/index.tsx +27 -14
- package/src/components/themeSwitcher/type.ts +1 -0
- package/src/index.tsx +11 -0
- package/src/types/index.ts +17 -1
- package/src/utils/index.ts +7 -1
|
@@ -15,13 +15,15 @@ import type {
|
|
|
15
15
|
} from "../../types";
|
|
16
16
|
import Button from "../button";
|
|
17
17
|
import {
|
|
18
|
-
CayCoreIcon,
|
|
19
18
|
NIBGATCommunityIcon,
|
|
19
|
+
CayCoreIcon,
|
|
20
20
|
NIBGATIcon
|
|
21
21
|
} from "../../assets/svg";
|
|
22
|
+
import HighlightButton from "../highlightButton";
|
|
22
23
|
|
|
23
24
|
const PaletteSwitcher: FC<IPaletteSwitcherProps> = ({
|
|
24
25
|
variants: variantsProps = [],
|
|
26
|
+
isWorkWithHighlightButton,
|
|
25
27
|
isWorkWithNextShowSystem,
|
|
26
28
|
customTheme,
|
|
27
29
|
color,
|
|
@@ -117,21 +119,22 @@ const PaletteSwitcher: FC<IPaletteSwitcherProps> = ({
|
|
|
117
119
|
|
|
118
120
|
const currentVariant = variants[isWorkWithNextShowSystem ? viewVariantIndex : currentVariantIndex];
|
|
119
121
|
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
customBorderColor
|
|
122
|
+
const allProps = {
|
|
123
|
+
...props,
|
|
124
|
+
customBorderColor: currentVariant && currentVariant.borderColor ?
|
|
123
125
|
currentVariant.borderColor
|
|
124
126
|
:
|
|
125
|
-
color
|
|
126
|
-
|
|
127
|
-
customColor={currentVariant && currentVariant.backgroundColor ?
|
|
127
|
+
color,
|
|
128
|
+
customColor: currentVariant && currentVariant.backgroundColor ?
|
|
128
129
|
currentVariant.backgroundColor
|
|
129
130
|
:
|
|
130
|
-
color
|
|
131
|
-
|
|
132
|
-
icon={({
|
|
131
|
+
color,
|
|
132
|
+
icon: ({
|
|
133
133
|
color,
|
|
134
134
|
size
|
|
135
|
+
}: {
|
|
136
|
+
color: keyof NCoreUIKit.IconContentColors;
|
|
137
|
+
size: number;
|
|
135
138
|
}) => {
|
|
136
139
|
const Icon = currentVariant?.icon as NCoreUIKitIcon;
|
|
137
140
|
|
|
@@ -140,15 +143,25 @@ const PaletteSwitcher: FC<IPaletteSwitcherProps> = ({
|
|
|
140
143
|
color={color}
|
|
141
144
|
size={size}
|
|
142
145
|
/>;
|
|
143
|
-
}
|
|
144
|
-
onPress
|
|
146
|
+
},
|
|
147
|
+
onPress: () => {
|
|
145
148
|
NCoreUIKitTheme.switch({
|
|
146
149
|
paletteKey: paletteKeys[viewVariantIndex]
|
|
147
150
|
});
|
|
148
|
-
}
|
|
149
|
-
style
|
|
151
|
+
},
|
|
152
|
+
style: [
|
|
150
153
|
style
|
|
151
|
-
]
|
|
154
|
+
]
|
|
155
|
+
};
|
|
156
|
+
|
|
157
|
+
if(isWorkWithHighlightButton) {
|
|
158
|
+
return <HighlightButton
|
|
159
|
+
{...allProps}
|
|
160
|
+
/>;
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
return <Button
|
|
164
|
+
{...allProps}
|
|
152
165
|
/>;
|
|
153
166
|
};
|
|
154
167
|
export default PaletteSwitcher;
|
|
@@ -26,6 +26,7 @@ interface IPaletteSwitcherProps extends Omit<IButtonProps, "onPress"> {
|
|
|
26
26
|
themeKey?: keyof NCoreUIKit.ThemeKey;
|
|
27
27
|
};
|
|
28
28
|
style?: StyleProp<TextStyle>[] | StyleProp<TextStyle>;
|
|
29
|
+
isWorkWithHighlightButton?: boolean;
|
|
29
30
|
isWorkWithNextShowSystem?: boolean;
|
|
30
31
|
variants?: ThemeSwitchVariants;
|
|
31
32
|
}
|
|
@@ -18,9 +18,11 @@ import {
|
|
|
18
18
|
Sun as SunIcon
|
|
19
19
|
} from "lucide-react-native";
|
|
20
20
|
import Button from "../button";
|
|
21
|
+
import HighlightButton from "../highlightButton";
|
|
21
22
|
|
|
22
23
|
const ThemeSwitcher: FC<IThemeSwitcherProps> = ({
|
|
23
24
|
variants: variantsProps = [],
|
|
25
|
+
isWorkWithHighlightButton,
|
|
24
26
|
isWorkWithNextShowSystem,
|
|
25
27
|
customTheme,
|
|
26
28
|
color,
|
|
@@ -110,21 +112,22 @@ const ThemeSwitcher: FC<IThemeSwitcherProps> = ({
|
|
|
110
112
|
|
|
111
113
|
const currentVariant = variants[isWorkWithNextShowSystem ? viewVariantIndex : currentVariantIndex];
|
|
112
114
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
customBorderColor
|
|
115
|
+
const allProps = {
|
|
116
|
+
...props,
|
|
117
|
+
customBorderColor: currentVariant && currentVariant.borderColor ?
|
|
116
118
|
currentVariant.borderColor
|
|
117
119
|
:
|
|
118
|
-
color
|
|
119
|
-
|
|
120
|
-
customColor={currentVariant && currentVariant.backgroundColor ?
|
|
120
|
+
color,
|
|
121
|
+
customColor: currentVariant && currentVariant.backgroundColor ?
|
|
121
122
|
currentVariant.backgroundColor
|
|
122
123
|
:
|
|
123
|
-
color
|
|
124
|
-
|
|
125
|
-
icon={({
|
|
124
|
+
color,
|
|
125
|
+
icon: ({
|
|
126
126
|
color,
|
|
127
127
|
size
|
|
128
|
+
}: {
|
|
129
|
+
color: keyof NCoreUIKit.IconContentColors;
|
|
130
|
+
size: number;
|
|
128
131
|
}) => {
|
|
129
132
|
const Icon = currentVariant?.icon as NCoreUIKitIcon;
|
|
130
133
|
|
|
@@ -133,15 +136,25 @@ const ThemeSwitcher: FC<IThemeSwitcherProps> = ({
|
|
|
133
136
|
color={color}
|
|
134
137
|
size={size}
|
|
135
138
|
/>;
|
|
136
|
-
}
|
|
137
|
-
onPress
|
|
139
|
+
},
|
|
140
|
+
onPress: () => {
|
|
138
141
|
NCoreUIKitTheme.switch({
|
|
139
142
|
themeKey: themeKeys[viewVariantIndex]
|
|
140
143
|
});
|
|
141
|
-
}
|
|
142
|
-
style
|
|
144
|
+
},
|
|
145
|
+
style: [
|
|
143
146
|
style
|
|
144
|
-
]
|
|
147
|
+
]
|
|
148
|
+
};
|
|
149
|
+
|
|
150
|
+
if(isWorkWithHighlightButton) {
|
|
151
|
+
return <HighlightButton
|
|
152
|
+
{...allProps}
|
|
153
|
+
/>;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
return <Button
|
|
157
|
+
{...allProps}
|
|
145
158
|
/>;
|
|
146
159
|
};
|
|
147
160
|
export default ThemeSwitcher;
|
|
@@ -26,6 +26,7 @@ interface IThemeSwitcherProps extends Omit<IButtonProps, "onPress"> {
|
|
|
26
26
|
themeKey?: keyof NCoreUIKit.ThemeKey;
|
|
27
27
|
};
|
|
28
28
|
style?: StyleProp<TextStyle>[] | StyleProp<TextStyle>;
|
|
29
|
+
isWorkWithHighlightButton?: boolean;
|
|
29
30
|
isWorkWithNextShowSystem?: boolean;
|
|
30
31
|
variants?: ThemeSwitchVariants;
|
|
31
32
|
}
|
package/src/index.tsx
CHANGED
|
@@ -120,10 +120,13 @@ export type {
|
|
|
120
120
|
NCoreUIKitIcon,
|
|
121
121
|
ModalDataType,
|
|
122
122
|
SharpnessType,
|
|
123
|
+
PureWebStyles,
|
|
124
|
+
PureRNStyles,
|
|
123
125
|
LocalizeType,
|
|
124
126
|
PaletteType,
|
|
125
127
|
ThemesType,
|
|
126
128
|
LocaleType,
|
|
129
|
+
AllStyles,
|
|
127
130
|
ThemeType,
|
|
128
131
|
ModalType,
|
|
129
132
|
Mutable
|
|
@@ -133,3 +136,11 @@ export {
|
|
|
133
136
|
Portal,
|
|
134
137
|
Host
|
|
135
138
|
} from "./helpers/portalize";
|
|
139
|
+
|
|
140
|
+
export {
|
|
141
|
+
androidTypographyFixer,
|
|
142
|
+
windowHeight,
|
|
143
|
+
windowWidth,
|
|
144
|
+
webStyle,
|
|
145
|
+
uuid
|
|
146
|
+
} from "./utils";
|
package/src/types/index.ts
CHANGED
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
import {
|
|
2
|
-
type ForwardRefRenderFunction
|
|
2
|
+
type ForwardRefRenderFunction,
|
|
3
|
+
type CSSProperties
|
|
3
4
|
} from "react";
|
|
5
|
+
import type {
|
|
6
|
+
ImageStyle,
|
|
7
|
+
TextStyle,
|
|
8
|
+
ViewStyle
|
|
9
|
+
} from "react-native";
|
|
4
10
|
import {
|
|
5
11
|
type INCoreUIKitIconCallbackProps
|
|
6
12
|
} from "./icon";
|
|
@@ -57,6 +63,16 @@ export type {
|
|
|
57
63
|
ThemeType
|
|
58
64
|
};
|
|
59
65
|
|
|
66
|
+
export type PureRNStyles = Omit<ViewStyle & TextStyle & ImageStyle, "position" | "cursor" | "filter">;
|
|
67
|
+
|
|
68
|
+
export type PureWebStyles = Omit<CSSProperties, "position" | "cursor" | "filter">;
|
|
69
|
+
|
|
70
|
+
export type AllStyles = PureRNStyles & PureWebStyles & {
|
|
71
|
+
position?: CSSProperties["position"];
|
|
72
|
+
cursor?: CSSProperties["cursor"];
|
|
73
|
+
filter?: string;
|
|
74
|
+
};
|
|
75
|
+
|
|
60
76
|
export type RecursiveRecord = {
|
|
61
77
|
[key: string]: string | RecursiveRecord;
|
|
62
78
|
};
|
package/src/utils/index.ts
CHANGED
|
@@ -1,14 +1,20 @@
|
|
|
1
1
|
import {
|
|
2
|
+
type ViewStyle,
|
|
2
3
|
Dimensions,
|
|
3
4
|
Platform
|
|
4
5
|
} from "react-native";
|
|
6
|
+
import type {
|
|
7
|
+
AllStyles
|
|
8
|
+
} from "../types";
|
|
5
9
|
|
|
6
10
|
const dimensions = Dimensions.get("window");
|
|
7
11
|
|
|
8
12
|
export const windowHeight = dimensions.height;
|
|
9
13
|
export const windowWidth = dimensions.width;
|
|
10
14
|
|
|
11
|
-
export const webStyle = (styles:
|
|
15
|
+
export const webStyle = <T extends AllStyles>(styles: T): ViewStyle => {
|
|
16
|
+
return (Platform.OS === "web" ? styles : {}) as unknown as ViewStyle;
|
|
17
|
+
};
|
|
12
18
|
|
|
13
19
|
export const uuid = () => {
|
|
14
20
|
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {
|