Skip to content

Commit 9bc6a77

Browse files
ethansharethanshar
committed
support passing bg-color modifier to View component
1 parent fb3acdc commit 9bc6a77

File tree

5 files changed

+10
-7
lines changed

5 files changed

+10
-7
lines changed

‎generatedTypes/commons/modifiers.d.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,12 +62,13 @@ export declare type AlignmentLiterals = 'row' | 'spread' | 'center' | 'centerH'
6262
export declare type Modifier<T extends string> = Partial<Record<T, boolean>>;
6363
export declare type TypographyModifiers = Modifier<TypographyLiterals>;
6464
export declare type ColorsModifiers = Modifier<ColorLiterals>;
65+
export declare type BackgroundColorModifier = Modifier<'bg'>;
6566
export declare type AlignmentModifiers = Modifier<AlignmentLiterals>;
6667
export declare type PaddingModifiers = Modifier<PaddingLiterals>;
6768
export declare type MarginModifiers = Modifier<MarginLiterals>;
6869
export declare type FlexModifiers = Modifier<FlexLiterals>;
6970
export declare type BorderRadiusModifiers = Modifier<BorderRadiusLiterals>;
70-
export declare type ContainerModifiers = AlignmentModifiers & PaddingModifiers & MarginModifiers & FlexModifiers & BorderRadiusModifiers;
71+
export declare type ContainerModifiers = AlignmentModifiers & PaddingModifiers & MarginModifiers & FlexModifiers & BorderRadiusModifiers & BackgroundColorModifier;
7172
export declare function extractColorValue(props: Dictionary<any>): any;
7273
export declare function extractBackgroundColorValue(props: Dictionary<any>): any;
7374
export declare function extractTypographyValue(props: Dictionary<any>): undefined;

‎generatedTypes/components/text/index.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,5 +43,5 @@ declare class Text extends PureComponent<PropsTypes> {
4343
render(): JSX.Element;
4444
}
4545
export { Text };
46-
declare const _default: React.ComponentType<Pick<Pick<PropsTypes, "margin" | "marginL" | "marginT" | "marginR" | "marginB" | "marginH" | "marginV" | "center" | "style" | "testID" | "modifiers" | "color" | "uppercase" | "highlightString" | "highlightStyle" | "animated" | "allowFontScaling" | "ellipsizeMode" | "lineBreakMode" | "numberOfLines" | "onLayout" | "onPress" | "onLongPress" | "nativeID" | "maxFontSizeMultiplier" | "adjustsFontSizeToFit" | "minimumFontScale" | "suppressHighlighting" | "selectable" | "selectionColor" | "textBreakStrategy" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityStates" | "accessibilityState" | "accessibilityHint" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors">, "margin" | "marginL" | "marginT" | "marginR" | "marginB" | "marginH" | "marginV" | "center" | "style" | "testID" | "color" | "uppercase" | "highlightString" | "highlightStyle" | "animated" | "allowFontScaling" | "ellipsizeMode" | "lineBreakMode" | "numberOfLines" | "onLayout" | "onPress" | "onLongPress" | "nativeID" | "maxFontSizeMultiplier" | "adjustsFontSizeToFit" | "minimumFontScale" | "suppressHighlighting" | "selectable" | "selectionColor" | "textBreakStrategy" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityStates" | "accessibilityState" | "accessibilityHint" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors">>;
46+
declare const _default: React.ComponentType<Pick<Pick<PropsTypes, "margin" | "marginL" | "marginT" | "marginR" | "marginB" | "marginH" | "marginV" | "center" | "style" | "testID" | "modifiers" | "color" | "uppercase" | "highlightString" | "highlightStyle" | "animated" | "allowFontScaling" | "ellipsizeMode" | "lineBreakMode" | "numberOfLines" | "onLayout" | "onPress" | "onLongPress" | "nativeID" | "maxFontSizeMultiplier" | "adjustsFontSizeToFit" | "minimumFontScale" | "suppressHighlighting" | "selectable" | "selectionColor" | "textBreakStrategy" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityStates" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors">, "margin" | "marginL" | "marginT" | "marginR" | "marginB" | "marginH" | "marginV" | "center" | "style" | "testID" | "color" | "uppercase" | "highlightString" | "highlightStyle" | "animated" | "allowFontScaling" | "ellipsizeMode" | "lineBreakMode" | "numberOfLines" | "onLayout" | "onPress" | "onLongPress" | "nativeID" | "maxFontSizeMultiplier" | "adjustsFontSizeToFit" | "minimumFontScale" | "suppressHighlighting" | "selectable" | "selectionColor" | "textBreakStrategy" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityStates" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors">>;
4747
export default _default;

‎generatedTypes/components/view/index.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,5 +17,5 @@ interface ViewPropTypes extends ViewProps {
1717
inaccessible?: boolean;
1818
}
1919
declare type PropsTypes = BaseComponentInjectedProps & ViewPropTypes & ForwardRefInjectedProps & ContainerModifiers;
20-
declare const _default: React.ComponentType<Pick<Pick<PropsTypes, "br0" | "br10" | "br20" | "br30" | "br40" | "br50" | "br60" | "br100" | "padding" | "paddingL" | "paddingT" | "paddingR" | "paddingB" | "paddingH" | "paddingV" | "margin" | "marginL" | "marginT" | "marginR" | "marginB" | "marginH" | "marginV" | "flex" | "flexG" | "flexS" | "row" | "spread" | "center" | "centerH" | "centerV" | "left" | "right" | "top" | "bottom" | "style" | "testID" | "modifiers" | "animated" | "onLayout" | "nativeID" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityStates" | "accessibilityState" | "accessibilityHint" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "useSafeArea" | "inaccessible" | "hitSlop" | "pointerEvents" | "removeClippedSubviews" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture">, "br0" | "br10" | "br20" | "br30" | "br40" | "br50" | "br60" | "br100" | "padding" | "paddingL" | "paddingT" | "paddingR" | "paddingB" | "paddingH" | "paddingV" | "margin" | "marginL" | "marginT" | "marginR" | "marginB" | "marginH" | "marginV" | "flex" | "flexG" | "flexS" | "row" | "spread" | "center" | "centerH" | "centerV" | "left" | "right" | "top" | "bottom" | "style" | "testID" | "animated" | "onLayout" | "nativeID" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityStates" | "accessibilityState" | "accessibilityHint" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "useSafeArea" | "inaccessible" | "hitSlop" | "pointerEvents" | "removeClippedSubviews" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture">>;
20+
declare const _default: React.ComponentType<Pick<Pick<PropsTypes, "br0" | "br10" | "br20" | "br30" | "br40" | "br50" | "br60" | "br100" | "padding" | "paddingL" | "paddingT" | "paddingR" | "paddingB" | "paddingH" | "paddingV" | "margin" | "marginL" | "marginT" | "marginR" | "marginB" | "marginH" | "marginV" | "flex" | "flexG" | "flexS" | "bg" | "row" | "spread" | "center" | "centerH" | "centerV" | "left" | "right" | "top" | "bottom" | "style" | "testID" | "modifiers" | "animated" | "onLayout" | "nativeID" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityStates" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "useSafeArea" | "inaccessible" | "hitSlop" | "pointerEvents" | "removeClippedSubviews" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture">, "br0" | "br10" | "br20" | "br30" | "br40" | "br50" | "br60" | "br100" | "padding" | "paddingL" | "paddingT" | "paddingR" | "paddingB" | "paddingH" | "paddingV" | "margin" | "marginL" | "marginT" | "marginR" | "marginB" | "marginH" | "marginV" | "flex" | "flexG" | "flexS" | "bg" | "row" | "spread" | "center" | "centerH" | "centerV" | "left" | "right" | "top" | "bottom" | "style" | "testID" | "animated" | "onLayout" | "nativeID" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityStates" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "useSafeArea" | "inaccessible" | "hitSlop" | "pointerEvents" | "removeClippedSubviews" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture">>;
2121
export default _default;

‎generatedTypes/style/colors.d.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import _ from 'lodash';
2+
import tinycolor from 'tinycolor2';
23
export declare class Colors {
34
[key: string]: any;
45
constructor();
@@ -28,8 +29,8 @@ export declare class Colors {
2829
generateColorPalette: ((color: any) => string[]) & _.MemoizedFunction;
2930
isDark(color: string): boolean;
3031
isValidHex(string: string): boolean;
31-
getHexString(color: string): any;
32-
getHSL(color: string): any;
32+
getHexString(color: string): string;
33+
getHSL(color: string): tinycolor.ColorFormats.HSLA;
3334
isTransparent(color: string): boolean;
3435
areEqual(colorA: string, colorB: string): boolean;
3536
}

‎src/commons/modifiers.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,7 @@ export type Modifier<T extends string> = Partial<Record<T, boolean>>
7777

7878
export type TypographyModifiers = Modifier<TypographyLiterals>;
7979
export type ColorsModifiers = Modifier<ColorLiterals>;
80+
export type BackgroundColorModifier = Modifier<'bg'>;
8081
export type AlignmentModifiers = Modifier<AlignmentLiterals>;
8182
export type PaddingModifiers = Modifier<PaddingLiterals>;
8283
export type MarginModifiers = Modifier<MarginLiterals>;
@@ -88,8 +89,8 @@ export type ContainerModifiers =
8889
PaddingModifiers &
8990
MarginModifiers &
9091
FlexModifiers &
91-
BorderRadiusModifiers;
92-
92+
BorderRadiusModifiers &
93+
BackgroundColorModifier;
9394

9495

9596
export function extractColorValue(props: Dictionary<any>) {

0 commit comments

Comments
 (0)