Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-05-30 19:54:16 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fix yoshiki insert bug in input

Browse Source
This commit is contained in:
Zoe Roux 2023-12-01 23:28:28 +01:00
parent 07259a7635
commit b2c67e7df4
5 changed files with 41 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
front/apps/mobile/package.json
View File

@ -53,7 +53,7 @@
"react-native-svg": "13.9.0", "react-native-svg": "13.9.0",
"react-native-uuid": "^2.0.1", "react-native-uuid": "^2.0.1",
"react-native-video": "^6.0.0-beta.0", "react-native-video": "^6.0.0-beta.0",
"yoshiki": "1.2.12" "yoshiki": "1.2.14"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "^7.23.5", "@babel/core": "^7.23.5",

2
front/apps/web/package.json
View File

@ -43,7 +43,7 @@
"srt-webvtt": "^2.0.0", "srt-webvtt": "^2.0.0",
"superjson": "^2.2.1", "superjson": "^2.2.1",
"sweetalert2": "^11.10.1", "sweetalert2": "^11.10.1",
"yoshiki": "1.2.12", "yoshiki": "1.2.14",
"zod": "^3.22.4" "zod": "^3.22.4"
}, },
"devDependencies": { "devDependencies": {

57
front/packages/primitives/src/input.tsx
View File

@ -19,54 +19,57 @@
*/ */
import { forwardRef, ReactNode, useState } from "react"; import { forwardRef, ReactNode, useState } from "react";
import { TextInput, TextInputProps, View } from "react-native"; import { TextInput, TextInputProps, View, ViewStyle } from "react-native";
import { px, Theme, useYoshiki } from "yoshiki/native"; import { px, Theme, useYoshiki } from "yoshiki/native";
import { focusReset, ts } from "./utils"; import { focusReset, ts } from "./utils";
import { YoshikiEnhanced } from "./image/base-image";
export const Input = forwardRef< export const Input = forwardRef<
TextInput, TextInput,
{ {
variant?: "small" | "big"; variant?: "small" | "big";
right?: ReactNode; right?: ReactNode;
containerStyle?: YoshikiEnhanced<ViewStyle>;
} & TextInputProps } & TextInputProps
>(function Input({ placeholderTextColor, variant = "small", right, ...props }, ref) { >(function Input(
const { css, theme } = useYoshiki(); { placeholderTextColor, variant = "small", right, containerStyle, ...props },
ref,
) {
const [focused, setFocused] = useState(false); const [focused, setFocused] = useState(false);
const { css, theme } = useYoshiki();
return ( return (
<View <View
{...css( {...css([
[ {
{ borderColor: (theme) => theme.accent,
borderColor: (theme) => theme.accent, borderRadius: ts(1),
borderRadius: ts(1), borderWidth: px(1),
borderWidth: px(1), borderStyle: "solid",
borderStyle: "solid", padding: ts(0.5),
padding: ts(0.5), flexDirection: "row",
flexDirection: "row", alignContent: "center",
alignContent: "center", alignItems: "center",
alignItems: "center", },
}, variant === "big" && {
variant === "big" && { borderRadius: ts(4),
borderRadius: ts(4), p: ts(1),
p: ts(1), },
}, focused && {
focused && { borderWidth: px(2),
borderWidth: px(2), },
}, containerStyle,
], ])}
props,
)}
> >
<TextInput <TextInput
ref={ref} ref={ref}
placeholderTextColor={placeholderTextColor ?? theme.colors.white} placeholderTextColor={placeholderTextColor ?? theme.paragraph}
onFocus={() => setFocused(true)} onFocus={() => setFocused(true)}
onBlur={() => setFocused(false)} onBlur={() => setFocused(false)}
{...css( {...css(
{ {
flexGrow: 1, flexGrow: 1,
color: (theme: Theme) => theme.colors.white, color: (theme: Theme) => theme.paragraph,
borderWidth: 0, borderWidth: 0,
...focusReset, ...focusReset,
}, },

4
front/packages/ui/src/navbar/index.tsx
View File

@ -87,8 +87,10 @@ const SearchBar = forwardRef<TextInput, Stylable>(function SearchBar(props, ref)
setQuery(q); setQuery(q);
}} }}
placeholder={t("navbar.search")} placeholder={t("navbar.search")}
placeholderTextColor={theme.colors.white}
containerStyle={{ height: ts(4), flexShrink: 1, borderColor: (theme) => theme.colors.white }}
{...tooltip(t("navbar.search"))} {...tooltip(t("navbar.search"))}
{...css({ height: ts(4), flexShrink: 1, borderColor: (theme) => theme.colors.white }, props)} {...props}
/> />
); );
}); });

12
front/yarn.lock
View File

@ -11283,7 +11283,7 @@ __metadata:
react-native-uuid: ^2.0.1 react-native-uuid: ^2.0.1
react-native-video: ^6.0.0-beta.0 react-native-video: ^6.0.0-beta.0
typescript: ^5.3.2 typescript: ^5.3.2
yoshiki: 1.2.12 yoshiki: 1.2.14
languageName: unknown languageName: unknown
linkType: soft linkType: soft
@ -15185,7 +15185,7 @@ __metadata:
sweetalert2: ^11.10.1 sweetalert2: ^11.10.1
typescript: ^5.3.2 typescript: ^5.3.2
webpack: ^5.89.0 webpack: ^5.89.0
yoshiki: 1.2.12 yoshiki: 1.2.14
zod: ^3.22.4 zod: ^3.22.4
languageName: unknown languageName: unknown
linkType: soft linkType: soft
@ -15612,9 +15612,9 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"yoshiki@npm:1.2.12": "yoshiki@npm:1.2.14":
version: 1.2.12 version: 1.2.14
resolution: "yoshiki@npm:1.2.12" resolution: "yoshiki@npm:1.2.14"
dependencies: dependencies:
"@types/inline-style-prefixer": ^5.0.0 "@types/inline-style-prefixer": ^5.0.0
"@types/node": 18.x.x "@types/node": 18.x.x
@ -15629,7 +15629,7 @@ __metadata:
optional: true optional: true
react-native-web: react-native-web:
optional: true optional: true
checksum: e5e59d8fa3df0039a19641f3d476cc7315cef31d0eb1a8a15fcff56f0a74f870b7d5d78b471b02a32dfab0582a02d33c6aa805a69035fa17ed621ecbe0f0c285 checksum: 0f7c6d8195f400492795576d84fbc4a503b59fe124b1dfc67664f6f41659e47ebc30c4dd4c3f74d4ce70dfa955c7deceaf2af0a27a383ed54fb1d7088e50f010
languageName: node languageName: node
linkType: hard linkType: hard