Skip to content

Commit

Permalink
Palette types (#69)
Browse files Browse the repository at this point in the history 
* relax palette types

* relax palette type

* remove dup styleContext
  • Loading branch information
@kant01ne
kant01ne committed Nov 23, 2020
1 parent 8203cb9 commit 1740ce5
Show file tree
Hide file tree
Showing 14 changed files with 46 additions and 88 deletions.
3 changes: 2 additions & 1 deletion lib/build/recipe/emailpassword/components/styles/styleContext.d.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,11 @@ declare type NormalisedStyle = {
palette: NormalisedPalette;
[x: string]: CSSObject;
};
export declare function StyleProvider({ children, styleFromInit, getDefaultStyles }: {
export declare function StyleProvider({ children, styleFromInit, getDefaultStyles, defaultPalette }: {
children: JSX.Element;
styleFromInit?: Styles;
getDefaultStyles: (palette: NormalisedPalette) => NormalisedDefaultStyles;
defaultPalette: NormalisedPalette;
}): JSX.Element;
export declare const StyleConsumer: React.ExoticComponent<React.ConsumerProps<NormalisedStyle>>;
export {};
15 changes: 6 additions & 9 deletions lib/build/recipe/emailpassword/components/styles/styleContext.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,6 @@ var _react = _interopRequireDefault(require("react"));

var _emailPassword = _interopRequireDefault(require("../../emailPassword"));

var _constants = require("../themes/default/constants");

var _styles = require("../themes/default/styles/styles");

function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
Expand Down Expand Up @@ -70,11 +66,12 @@ var StyleContext = /*#__PURE__*/ _react["default"].createContext({
function StyleProvider(_ref) {
var children = _ref.children,
styleFromInit = _ref.styleFromInit,
getDefaultStyles = _ref.getDefaultStyles;
getDefaultStyles = _ref.getDefaultStyles,
defaultPalette = _ref.defaultPalette;

var rawPalette = _emailPassword["default"].getInstanceOrThrow().getConfig().palette;

var palette = getMergedPalette(rawPalette);
var palette = getMergedPalette(defaultPalette, rawPalette);

var styles = _objectSpread(
{
Expand Down Expand Up @@ -107,10 +104,10 @@ var StyleConsumer = StyleContext.Consumer;

exports.StyleConsumer = StyleConsumer;

function getMergedPalette(rawPalette) {
var palette = _styles.defaultPalette;
function getMergedPalette(defaultPalette, rawPalette) {
var palette = defaultPalette;

for (var key in _constants.PALETTE_COLORS_OPTIONS_ARRAY) {
for (var key in palette.colors) {
if (rawPalette[key] !== undefined) {
palette.colors[key] = rawPalette[key];
}
Expand Down
1 change: 1 addition & 0 deletions ...uild/recipe/emailpassword/components/themes/default/resetPasswordUsingToken/enterEmail.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -311,6 +311,7 @@ var EnterEmailTheme = /*#__PURE__*/ (function(_PureComponent) {
return (0, _core.jsx)(
_styleContext.StyleProvider,
{
defaultPalette: _styles.defaultPalette,
styleFromInit: styleFromInit,
getDefaultStyles: _styles.getDefaultStyles
},
Expand Down
1 change: 1 addition & 0 deletions ...cipe/emailpassword/components/themes/default/resetPasswordUsingToken/submitNewPassword.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -304,6 +304,7 @@ var SubmitNewPasswordTheme = /*#__PURE__*/ (function(_PureComponent) {
return (0, _core.jsx)(
_styleContext.StyleProvider,
{
defaultPalette: _styles.defaultPalette,
styleFromInit: styleFromInit,
getDefaultStyles: _styles.getDefaultStyles
},
Expand Down
1 change: 1 addition & 0 deletions lib/build/recipe/emailpassword/components/themes/default/signInAndUp/SignIn.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -278,6 +278,7 @@ var SignInTheme = /*#__PURE__*/ (function(_PureComponent) {
return (0, _core.jsx)(
_styleContext.StyleProvider,
{
defaultPalette: _styles.defaultPalette,
styleFromInit: styleFromInit,
getDefaultStyles: _styles.getDefaultStyles
},
Expand Down
1 change: 1 addition & 0 deletions lib/build/recipe/emailpassword/components/themes/default/signInAndUp/SignUp.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -290,6 +290,7 @@ var SignUpTheme = /*#__PURE__*/ (function(_PureComponent) {
return (0, _core.jsx)(
_styleContext.StyleProvider,
{
defaultPalette: _styles.defaultPalette,
styleFromInit: styleFromInit,
getDefaultStyles: _styles.getDefaultStyles
},
Expand Down
21 changes: 2 additions & 19 deletions lib/build/recipe/emailpassword/components/themes/default/types.d.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,26 +11,9 @@ export declare enum paletteColorOptions {
TEXTLINK = "textLink"
}
export declare type NormalisedPalette = {
colors: Record<paletteColorOptions, string>;
colors: Record<string, string>;
fonts: {
size: string[];
};
};
export declare enum defaultStylesOptions {
CONTAINER = "container",
ROW = "row",
GENERALERROR = "generalError",
INPUTWRAPPER = "inputWrapper",
INPUT = "input",
INPUTERROR = "inputError",
INPUTADORNMENT = "inputAdornment",
INPUTERRORMESSAGE = "inputErrorMessage",
BUTTON = "button",
LABEL = "label",
FORMROW = "formRow",
PRIMARYTEXT = "primaryText",
SECONDARYTEXT = "secondaryText",
LINK = "link",
DIVIDER = "divider"
}
export declare type NormalisedDefaultStyles = Record<defaultStylesOptions, CSSObject>;
export declare type NormalisedDefaultStyles = Record<string, CSSObject>;
23 changes: 1 addition & 22 deletions lib/build/recipe/emailpassword/components/themes/default/types.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.defaultStylesOptions = exports.paletteColorOptions = void 0;
exports.paletteColorOptions = void 0;

/* Copyright (c) 2020, VRAI Labs and/or its affiliates. All rights reserved.
*
Expand Down Expand Up @@ -33,24 +33,3 @@ exports.paletteColorOptions = paletteColorOptions;
paletteColorOptions["TEXTPRIMARY"] = "textPrimary";
paletteColorOptions["TEXTLINK"] = "textLink";
})(paletteColorOptions || (exports.paletteColorOptions = paletteColorOptions = {}));

var defaultStylesOptions;
exports.defaultStylesOptions = defaultStylesOptions;

(function(defaultStylesOptions) {
defaultStylesOptions["CONTAINER"] = "container";
defaultStylesOptions["ROW"] = "row";
defaultStylesOptions["GENERALERROR"] = "generalError";
defaultStylesOptions["INPUTWRAPPER"] = "inputWrapper";
defaultStylesOptions["INPUT"] = "input";
defaultStylesOptions["INPUTERROR"] = "inputError";
defaultStylesOptions["INPUTADORNMENT"] = "inputAdornment";
defaultStylesOptions["INPUTERRORMESSAGE"] = "inputErrorMessage";
defaultStylesOptions["BUTTON"] = "button";
defaultStylesOptions["LABEL"] = "label";
defaultStylesOptions["FORMROW"] = "formRow";
defaultStylesOptions["PRIMARYTEXT"] = "primaryText";
defaultStylesOptions["SECONDARYTEXT"] = "secondaryText";
defaultStylesOptions["LINK"] = "link";
defaultStylesOptions["DIVIDER"] = "divider";
})(defaultStylesOptions || (exports.defaultStylesOptions = defaultStylesOptions = {}));
18 changes: 9 additions & 9 deletions lib/ts/recipe/emailpassword/components/styles/styleContext.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,9 +17,7 @@ import React from "react";
import { Styles } from "../../../../types";
import EmailPassword from "../../emailPassword";
import { PaletteUserInput } from "../../types";
import { PALETTE_COLORS_OPTIONS_ARRAY } from "../themes/default/constants";
import { defaultPalette } from "../themes/default/styles/styles";
import { NormalisedPalette, paletteColorOptions, NormalisedDefaultStyles } from "../themes/default/types";
import { NormalisedPalette, NormalisedDefaultStyles } from "../themes/default/types";

type NormalisedStyle = {
palette: NormalisedPalette;
Expand All @@ -28,7 +26,7 @@ type NormalisedStyle = {

const StyleContext = React.createContext<NormalisedStyle>({
palette: {
colors: {} as Record<paletteColorOptions, string>,
colors: {} as Record<string, string>,
fonts: {
size: []
}
Expand All @@ -38,14 +36,16 @@ const StyleContext = React.createContext<NormalisedStyle>({
export function StyleProvider({
children,
styleFromInit,
getDefaultStyles
getDefaultStyles,
defaultPalette
}: {
children: JSX.Element;
styleFromInit?: Styles;
getDefaultStyles: (palette: NormalisedPalette) => NormalisedDefaultStyles;
defaultPalette: NormalisedPalette;
}): JSX.Element {
const rawPalette = EmailPassword.getInstanceOrThrow().getConfig().palette;
const palette = getMergedPalette(rawPalette);
const palette = getMergedPalette(defaultPalette, rawPalette);

const styles: NormalisedStyle = {
palette,
Expand All @@ -71,11 +71,11 @@ export const StyleConsumer = StyleContext.Consumer;
/*
* Helpers
*/
function getMergedPalette(rawPalette: PaletteUserInput): NormalisedPalette {
function getMergedPalette(defaultPalette: NormalisedPalette, rawPalette: PaletteUserInput): NormalisedPalette {
const palette = defaultPalette;
for (const key in PALETTE_COLORS_OPTIONS_ARRAY) {
for (const key in palette.colors) {
if (rawPalette[key] !== undefined) {
palette.colors[key as paletteColorOptions] = rawPalette[key];
palette.colors[key] = rawPalette[key];
}
}
return palette;
Expand Down
7 changes: 5 additions & 2 deletions lib/ts/recipe/emailpassword/components/themes/default/resetPasswordUsingToken/enterEmail.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ import FormBase from "../../../library/FormBase";
import { Styles } from "../../../../../../types";
import { StyleConsumer, StyleProvider } from "../../../styles/styleContext";
import { NormalisedPalette } from "../types";
import { getDefaultStyles } from "../styles/styles";
import { defaultPalette, getDefaultStyles } from "../styles/styles";

/*
* Styles.
Expand Down Expand Up @@ -106,7 +106,10 @@ export default class EnterEmailTheme extends PureComponent<EnterEmailThemeProps,
const styleFromInit = this.props.styleFromInit !== undefined ? this.props.styleFromInit : {};

return (
<StyleProvider styleFromInit={styleFromInit} getDefaultStyles={getDefaultStyles}>
<StyleProvider
defaultPalette={defaultPalette}
styleFromInit={styleFromInit}
getDefaultStyles={getDefaultStyles}>
<StyleConsumer>
{styles => {
const componentStyles = getStyles(styles.palette);
Expand Down
7 changes: 5 additions & 2 deletions ...ipe/emailpassword/components/themes/default/resetPasswordUsingToken/submitNewPassword.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ import { FormRow, Button } from "../../../library";
import FormBase from "../../../library/FormBase";
import { StyleProvider, StyleConsumer } from "../../../styles/styleContext";
import { NormalisedPalette } from "../types";
import { getDefaultStyles } from "../styles/styles";
import { getDefaultStyles, defaultPalette } from "../styles/styles";

/*
* Styles.
Expand Down Expand Up @@ -109,7 +109,10 @@ export default class SubmitNewPasswordTheme extends PureComponent<
const { formFields, hasNewPassword } = this.state;

return (
<StyleProvider styleFromInit={styleFromInit} getDefaultStyles={getDefaultStyles}>
<StyleProvider
defaultPalette={defaultPalette}
styleFromInit={styleFromInit}
getDefaultStyles={getDefaultStyles}>
<StyleConsumer>
{styles => {
const componentStyles = getStyles(styles.palette);
Expand Down
7 changes: 5 additions & 2 deletions lib/ts/recipe/emailpassword/components/themes/default/signInAndUp/SignIn.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ import FormBase from "../../../library/FormBase";
import { Styles } from "../../../../../../types";
import { StyleConsumer, StyleProvider } from "../../../styles/styleContext";
import { NormalisedPalette } from "../types";
import { getDefaultStyles } from "../styles/styles";
import { defaultPalette, getDefaultStyles } from "../styles/styles";

/*
* Styles.
Expand Down Expand Up @@ -88,7 +88,10 @@ export default class SignInTheme extends PureComponent<SignInThemeProps, { formF
const { formFields } = this.state;

return (
<StyleProvider styleFromInit={styleFromInit} getDefaultStyles={getDefaultStyles}>
<StyleProvider
defaultPalette={defaultPalette}
styleFromInit={styleFromInit}
getDefaultStyles={getDefaultStyles}>
<StyleConsumer>
{styles => {
const componentStyle = getStyles(styles.palette as NormalisedPalette);
Expand Down
7 changes: 5 additions & 2 deletions lib/ts/recipe/emailpassword/components/themes/default/signInAndUp/SignUp.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ import FormBase from "../../../library/FormBase";
import { StyleConsumer, StyleProvider } from "../../../styles/styleContext";
import SignUpFooter from "./SignUpFooter";
import { NormalisedPalette } from "../types";
import { getDefaultStyles } from "../styles/styles";
import { defaultPalette, getDefaultStyles } from "../styles/styles";

/*
* Styles.
Expand Down Expand Up @@ -92,7 +92,10 @@ export default class SignUpTheme extends PureComponent<SignUpThemeProps, { formF
const { privacyPolicyLink, termsOfServiceLink, styleFromInit, signInClicked, onSuccess, callAPI } = this.props;
const { formFields } = this.state;
return (
<StyleProvider styleFromInit={styleFromInit} getDefaultStyles={getDefaultStyles}>
<StyleProvider
defaultPalette={defaultPalette}
styleFromInit={styleFromInit}
getDefaultStyles={getDefaultStyles}>
<StyleConsumer>
{styles => {
const componentStyles = getStyles(styles.palette as NormalisedPalette);
Expand Down
22 changes: 2 additions & 20 deletions lib/ts/recipe/emailpassword/components/themes/default/types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,28 +28,10 @@ export enum paletteColorOptions {
}

export type NormalisedPalette = {
colors: Record<paletteColorOptions, string>;
colors: Record<string, string>;
fonts: {
size: string[];
};
};

export enum defaultStylesOptions {
CONTAINER = "container",
ROW = "row",
GENERALERROR = "generalError",
INPUTWRAPPER = "inputWrapper",
INPUT = "input",
INPUTERROR = "inputError",
INPUTADORNMENT = "inputAdornment",
INPUTERRORMESSAGE = "inputErrorMessage",
BUTTON = "button",
LABEL = "label",
FORMROW = "formRow",
PRIMARYTEXT = "primaryText",
SECONDARYTEXT = "secondaryText",
LINK = "link",
DIVIDER = "divider"
}

export type NormalisedDefaultStyles = Record<defaultStylesOptions, CSSObject>;
export type NormalisedDefaultStyles = Record<string, CSSObject>;

0 comments on commit 1740ce5

Please sign in to comment.