Cleanup types

This commit is contained in:
Zoe Roux
2023-01-09 02:31:21 +09:00
parent ee7d062897
commit 6111e2f27c
4 changed files with 16 additions and 48 deletions

View File

@@ -3,11 +3,11 @@
// Licensed under the MIT license. See LICENSE file in the project root for details. // Licensed under the MIT license. See LICENSE file in the project root for details.
// //
import { FilterOr, WithState, YoshikiStyle, Length, StyleList } from "../type"; import { WithState, YoshikiStyle, StyleList } from "../type";
import { shorthandsFn } from "../shorthands"; import { shorthandsFn } from "../shorthands";
import { ImageStyle, StyleProp, TextStyle, ViewStyle } from "react-native"; import { ImageStyle, StyleProp, TextStyle, ViewStyle } from "react-native";
import { Theme } from "../theme"; import { Theme } from "../theme";
import { forceBreakpoint, WithBreakpoints } from "../utils"; import { forceBreakpoint } from "../utils";
// The extends any check is only used to make EnhancedStyle a distributive type. // The extends any check is only used to make EnhancedStyle a distributive type.
// This means EnhancedStyle<ViewStyle | TextStyle> = EnhancedStyle<ViewStyle> | EnhancedStyle<TextStyle> // This means EnhancedStyle<ViewStyle | TextStyle> = EnhancedStyle<ViewStyle> | EnhancedStyle<TextStyle>
@@ -15,11 +15,7 @@ export type EnhancedStyle<Properties> = Properties extends any
? { ? {
[key in keyof Properties]: YoshikiStyle<Properties[key]>; [key in keyof Properties]: YoshikiStyle<Properties[key]>;
} & { } & {
[key in keyof typeof shorthandsFn]?: FilterOr< [key in keyof typeof shorthandsFn]?: Parameters<typeof shorthandsFn[key]>[0];
Parameters<typeof shorthandsFn[key]>[0],
Length,
YoshikiStyle<number>
>;
} }
: never; : never;

View File

@@ -3,51 +3,46 @@
// Licensed under the MIT license. See LICENSE file in the project root for details. // Licensed under the MIT license. See LICENSE file in the project root for details.
// //
import type { CommonStyle } from "./type";
import type { ViewStyle } from "react-native";
type YSPs = CommonStyle<ViewStyle>;
export const shorthandsFn = { export const shorthandsFn = {
p: (v: YSPs["padding"]): YSPs => ({ p: (v: string | number) => ({
padding: v, padding: v,
}), }),
pX: (v: YSPs["paddingLeft"]): YSPs => ({ pX: (v: string | number) => ({
paddingLeft: v, paddingLeft: v,
paddingRight: v, paddingRight: v,
}), }),
paddingX: (v: YSPs["paddingLeft"]): YSPs => ({ paddingX: (v: string | number) => ({
paddingLeft: v, paddingLeft: v,
paddingRight: v, paddingRight: v,
}), }),
pY: (v: YSPs["paddingTop"]): YSPs => ({ pY: (v: string | number) => ({
paddingTop: v, paddingTop: v,
paddingBottom: v, paddingBottom: v,
}), }),
paddingY: (v: YSPs["paddingTop"]): YSPs => ({ paddingY: (v: string | number) => ({
paddingTop: v, paddingTop: v,
paddingBottom: v, paddingBottom: v,
}), }),
m: (v: YSPs["margin"]): YSPs => ({ m: (v: string | number) => ({
margin: v, margin: v,
}), }),
mX: (v: YSPs["marginLeft"]): YSPs => ({ mX: (v: string | number) => ({
marginLeft: v, marginLeft: v,
marginRight: v, marginRight: v,
}), }),
marginX: (v: YSPs["marginLeft"]): YSPs => ({ marginX: (v: string | number) => ({
marginLeft: v, marginLeft: v,
marginRight: v, marginRight: v,
}), }),
mY: (v: YSPs["marginTop"]): YSPs => ({ mY: (v: string | number) => ({
marginTop: v, marginTop: v,
marginBottom: v, marginBottom: v,
}), }),
marginY: (v: YSPs["marginTop"]): YSPs => ({ marginY: (v: string | number) => ({
marginTop: v, marginTop: v,
marginBottom: v, marginBottom: v,
}), }),
bg: (v: YSPs["backgroundColor"]): YSPs => ({ bg: (v: string) => ({
backgroundColor: v, backgroundColor: v,
}), }),
}; };

View File

@@ -4,8 +4,6 @@
// //
import { breakpoints, Theme } from "./theme"; import { breakpoints, Theme } from "./theme";
import { Properties as _CssProperties } from "csstype";
import { shorthandsFn } from "./shorthands";
export type YoshikiStyle<Property> = export type YoshikiStyle<Property> =
| Property | Property
@@ -35,25 +33,3 @@ export const processStyleList = <Style>(los: StyleList<Style>): Partial<Style> =
if (isReadonlyArray(los)) return los.reduce((acc, x) => ({ ...acc, ...processStyleList(x) }), {}); if (isReadonlyArray(los)) return los.reduce((acc, x) => ({ ...acc, ...processStyleList(x) }), {});
return los ? los : {}; return los ? los : {};
}; };
// dummy type only used for the API.
export type Length = { a: 1 };
export type CssProperties = _CssProperties<0 | Length | string>;
type FilterOrNever<T, Filter> = T extends Filter ? Filter : never;
export type FilterOr<T, Filter, Replacement = Filter> = [FilterOrNever<T, Filter>] extends [never]
? T
: Replacement;
type CombineWithLength<A, B> = {
[key in keyof A & keyof B]?: FilterOr<(A & B)[key], Length>;
};
export type CommonCss<Style> = CombineWithLength<CssProperties, Style>;
export type CommonStyle<Style> = {
[key in keyof CommonCss<Style>]: YoshikiStyle<CommonCss<Style>[key]>;
};
export type EnhancedStyle<Style> = CommonStyle<Style> & {
[key in keyof typeof shorthandsFn]?: Parameters<typeof shorthandsFn[key]>[0];
};

View File

@@ -5,8 +5,9 @@
import { useInsertionEffect } from "react"; import { useInsertionEffect } from "react";
import { prefix } from "inline-style-prefixer"; import { prefix } from "inline-style-prefixer";
import { Properties as CssProperties } from "csstype";
import { Theme, breakpoints, useTheme } from "../theme"; import { Theme, breakpoints, useTheme } from "../theme";
import { WithState, YoshikiStyle, CssProperties, StyleList, processStyleList } from "../type"; import { WithState, YoshikiStyle, StyleList, processStyleList } from "../type";
import { forceBreakpoint, isBreakpoints } from "../utils"; import { forceBreakpoint, isBreakpoints } from "../utils";
import { StyleRegistry, useStyleRegistry } from "./registry"; import { StyleRegistry, useStyleRegistry } from "./registry";
import { shorthandsFn } from "../shorthands"; import { shorthandsFn } from "../shorthands";