diff --git a/src/UI/Style.re b/src/UI/Style.re index f093c2f35..361b57ae8 100644 --- a/src/UI/Style.re +++ b/src/UI/Style.re @@ -205,7 +205,7 @@ type xy = { vertical: int, }; -type props = [ +type coreStyleProps = [ | `FlexGrow(int) | `FlexDirection(LayoutTypes.flexDirection) | `JustifyContent(LayoutTypes.justify) @@ -248,9 +248,11 @@ type fontProps = [ | `FontFamily(string) | `FontSize(int)]; these nodes are typed to only allow styles to be specified which are relevant to each */ -type textStyleProps = [ fontProps | props]; -type viewStyleProps = [ props]; -type imageStyleProps = [ props]; +type textStyleProps = [ fontProps | coreStyleProps]; +type viewStyleProps = [ coreStyleProps]; +type imageStyleProps = [ coreStyleProps]; + +type allProps = [ coreStyleProps | fontProps]; let emptyTextStyle: list(textStyleProps) = []; let emptyViewStyle: list(viewStyleProps) = []; @@ -344,58 +346,23 @@ let overflow = o => `Overflow(o); let color = o => `Color(o); let backgroundColor = o => `BackgroundColor(o); -let unwrapStyle = (styles: [> props | fontProps], rule, default) => - List.fold_left( - (default, style) => - switch (rule, style) { - | (`AlignItems, `AlignItems(alignItems)) => alignItems - | (`JustifyContent, `JustifyContent(justifyContent)) => justifyContent - | (`FlexGrow, `FlexGrow(flexGrow)) => flexGrow - | (`FlexDirection, `FlexDirection(flexDirection)) => flexDirection - | (`Position, `Position(position)) => position - | (`Margin, `Margin(margin)) => margin - | (`MarginTop, `MarginTop(marginTop)) => marginTop - | (`MarginBottom, `MarginBottom(marginBottom)) => marginBottom - | (`MarginRight, `MarginRight(marginRight)) => marginRight - | (`MarginLeft, `MarginLeft(marginLeft)) => marginLeft - | (`MarginVertical, `MarginVertical(marginVertical)) => marginVertical - | (`MarginHorizontal, `MarginHorizontal(marginHorizontal)) => marginHorizontal - | (`Margin4, `Margin4(m4)) => m4 - | (`Margin2, `Margin2(m2)) => m2 - | (`Overflow, `Overflow(overflow)) => overflow - | (`Border, `Border(border)) => border - | (`BorderBottom, `BorderBottom(borderBottom)) => borderBottom - | (`BorderTop, `BorderTop(borderTop)) => borderTop - | (`BorderLeft, `BorderLeft(borderLeft)) => borderLeft - | (`BorderRight, `BorderRight(borderRight)) => borderRight - | (`BorderVertical, `BorderVertical(borderVertical)) => borderVertical - | (`BorderHorizontal, `BorderHorizontal(borderHorizontal)) => borderHorizontal - | (`Opacity, `Opacity(opacity)) => opacity - | (`BoxShadow, `BoxShadow(boxShadow)) => boxShadow - | (`Transform, `Transform(transform)) => transform - | (`FontFamily, `FontFamily(fontFamily)) => fontFamily - | (`FontSize, `FontSize(fontSize)) => fontSize - | (`Cursor, `Cursor(cursor)) => cursor - | (`Color, `Color(color)) => color - | (`BackgroundColor, `BackgroundColor(backgroundColor)) => backgroundColor - | (`Width, `Width(width)) => width - | (`Height, `Height(height)) => height - | (`Bottom, `Bottom(bottom)) => bottom - | (`Left, `Left(left)) => left - | (`Top, `Top(top)) => top - | (`Right, `Right(right)) => right - | _ => default - }, - default, - styles, - ); +/* + Helper function to narrow down a list of all possible style props to + one specific to a type of component + */ +let rec extractViewStyles = (styles: list(allProps)): list(viewStyleProps) => + switch (styles) { + | [] => [] + | [#viewStyleProps as v, ...list] => [v, ...extractViewStyles(list)] + | [_, ...list] => extractViewStyles(list) + }; /* Apply style takes all style props and maps each to the correct style and is used to build up the style record, which is eventually used to apply styling to elements. */ -let applyStyle = (style, styleRule: [< props | fontProps]) => +let applyStyle = (style, styleRule: [< coreStyleProps | fontProps]) => switch (styleRule) { | `AlignItems(alignItems) => {...style, alignItems} | `JustifyContent(justifyContent) => {...style, justifyContent} diff --git a/src/UI_Components/Input.re b/src/UI_Components/Input.re index 8dc87490a..adfc1d5b8 100644 --- a/src/UI_Components/Input.re +++ b/src/UI_Components/Input.re @@ -138,7 +138,7 @@ let make = computed styles */ - let viewStyles = + let allStyles = Style.( merge( ~source=[ @@ -153,9 +153,8 @@ let make = ) ); - /* - TODO: convert this to a getter utility function - */ + let viewStyles = Style.extractViewStyles(allStyles); + let inputHeight = List.fold_left( (default, s) =>