/* @flow */
/** @jsx node */
import {
node,
type ElementNode,
type ComponentNode,
} from "@krakenjs/jsx-pragmatic/src";
import {
getLogoCDNUrl,
getLogoColors,
SVGLogo,
type SVGLogoProps,
} from "../../lib";
import { LOGO_COLOR, LOGO } from "../../constants";
import type { LogoColors, LogoColorMap } from "../../types";
export const GIROPAY_LOGO_COLORS: LogoColorMap = {
[LOGO_COLOR.DEFAULT]: {
primary: "#FFFFFF",
secondary: "#003A7D",
tertiary: "#ED1C24",
quaternary: "#FFFFFF",
quinary: "#FFFFFF",
},
[LOGO_COLOR.WHITE]: {
primary: "#000000",
secondary: "#FFFFFF",
tertiary: "#FFFFFF",
quaternary: "#000000",
quinary: "#FFFFFF",
},
[LOGO_COLOR.BLACK]: {
primary: "#FFFFFF",
secondary: "#003A7D",
tertiary: "#ED1C24",
quaternary: "#FFFFFF",
quinary: "#003A7D",
},
};
export const getGiropaySVG = ({
primary,
secondary,
tertiary,
quaternary,
quinary,
}: LogoColors): ElementNode => {
return (
);
};
export function GiropayLogoExternalImage({
logoColor = LOGO_COLOR.BLACK,
...props
}: {
logoColor?: $Values,
}): ComponentNode {
const cdnUrl = getLogoCDNUrl(LOGO.GIROPAY, GIROPAY_LOGO_COLORS, logoColor);
return (
);
}
export function GiropayLogoInlineSVG({
logoColor = LOGO_COLOR.BLACK,
...props
}: {
logoColor?: $Values,
}): ComponentNode {
const svg = getGiropaySVG(
getLogoColors(LOGO.GIROPAY, GIROPAY_LOGO_COLORS, logoColor)
);
return (
{
return svg;
}}
/>
);
}
export const GiropayLogo = GiropayLogoInlineSVG;