@manamerge/mana-atomic-ui 1.0.255 → 1.0.257

package/dist/index.d.ts

@@ -12,9 +12,9 @@ interface ButtonTypes {
 }
 declare const Button: React.FC<ButtonTypes>;
 
-interface TextTypes {
+interface TextTypes extends React.HTMLAttributes<HTMLElement> {
     variant?: "primary-light" | "primary-regular" | "primary-medium" | "primary-bold" | "primary-heavy" | "secondary-regular" | "secondary-italic";
-    children?: string;
+    children?: ReactNode;
     htmlFor?: string;
     margin?: string;
     lineHeight?: string;
@@ -111,8 +111,8 @@ interface HeaderTypes {
     buttonLeftIcon?: FunctionComponent<SVGProps<SVGSVGElement>>;
     buttonRightIcon?: FunctionComponent<SVGProps<SVGSVGElement>>;
     textBanner?: string;
-    headingTitle?: string;
-    textTitle?: string[];
+    headingTitle?: React.ReactNode[];
+    textTitle?: React.ReactNode[];
     buttonLeftText?: string;
     buttonLeftClick?: React.MouseEventHandler<HTMLElement>;
     buttonRightText?: string;

package/dist/index.js

@@ -325,7 +325,7 @@ const Link = (_a) => {
     return (jsx(StyledLink$2, Object.assign({ className: classNames("Link-" + variant), variant: "Link-" + variant, "aria-label": alt || "", as: Component }, componentProps, props, { children: children })));
 };
 
-const GradientContainer = styled.div `
+const GradientContainer = styled.span `
     ${({ theme, variant }) => {
     var _a;
     const gradientStyles = ((_a = theme === null || theme === void 0 ? void 0 : theme.gradient) === null || _a === void 0 ? void 0 : _a[variant]) || {};
@@ -690,9 +690,15 @@ const AtomIconLeft = styled(Icon).attrs(({ theme, moleculeVariant }) => {
     });
 }) ``;
 const AtomIconRight = styled(Icon).attrs(({ theme, moleculeVariant }) => {
-    var _a, _b, _c;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
     return ({
-        variant: (_c = (_b = (_a = theme === null || theme === void 0 ? void 0 : theme.header) === null || _a === void 0 ? void 0 : _a[moleculeVariant]) === null || _b === void 0 ? void 0 : _b.atomIconRight) === null || _c === void 0 ? void 0 : _c.variant
+        variant: (_c = (_b = (_a = theme === null || theme === void 0 ? void 0 : theme.header) === null || _a === void 0 ? void 0 : _a[moleculeVariant]) === null || _b === void 0 ? void 0 : _b.atomIconRight) === null || _c === void 0 ? void 0 : _c.variant,
+        stroke: (_f = (_e = (_d = theme === null || theme === void 0 ? void 0 : theme.header) === null || _d === void 0 ? void 0 : _d[moleculeVariant]) === null || _e === void 0 ? void 0 : _e.atomIconRight) === null || _f === void 0 ? void 0 : _f.stroke,
+        fill: (_j = (_h = (_g = theme === null || theme === void 0 ? void 0 : theme.header) === null || _g === void 0 ? void 0 : _g[moleculeVariant]) === null || _h === void 0 ? void 0 : _h.atomIconRight) === null || _j === void 0 ? void 0 : _j.fill,
+        color: (_m = (_l = (_k = theme === null || theme === void 0 ? void 0 : theme.header) === null || _k === void 0 ? void 0 : _k[moleculeVariant]) === null || _l === void 0 ? void 0 : _l.atomIconRight) === null || _m === void 0 ? void 0 : _m.color,
+        hoverFill: (_r = (_q = (_p = (_o = theme === null || theme === void 0 ? void 0 : theme.header) === null || _o === void 0 ? void 0 : _o[moleculeVariant]) === null || _p === void 0 ? void 0 : _p.atomIconRight) === null || _q === void 0 ? void 0 : _q.hover) === null || _r === void 0 ? void 0 : _r.fill,
+        hoverStroke: (_v = (_u = (_t = (_s = theme === null || theme === void 0 ? void 0 : theme.header) === null || _s === void 0 ? void 0 : _s[moleculeVariant]) === null || _t === void 0 ? void 0 : _t.atomIconRight) === null || _u === void 0 ? void 0 : _u.hover) === null || _v === void 0 ? void 0 : _v.stroke,
+        hoverColor: (_z = (_y = (_x = (_w = theme === null || theme === void 0 ? void 0 : theme.header) === null || _w === void 0 ? void 0 : _w[moleculeVariant]) === null || _x === void 0 ? void 0 : _x.atomIconRight) === null || _y === void 0 ? void 0 : _y.hover) === null || _z === void 0 ? void 0 : _z.color
     });
 }) ``;
 const WrapperTextTitle = styled.div `
@@ -711,8 +717,7 @@ const WrapperTextTitle = styled.div `
 const Header = (_a) => {
     var { moleculeVariant = "primary", iconTop, iconDot, buttonLeftIcon, buttonRightIcon, textBanner, headingTitle, textTitle, buttonLeftText, buttonLeftClick, buttonRightText, buttonRightClick, imageURLBackground, withOverlay } = _a, props = __rest(_a, ["moleculeVariant", "iconTop", "iconDot", "buttonLeftIcon", "buttonRightIcon", "textBanner", "headingTitle", "textTitle", "buttonLeftText", "buttonLeftClick", "buttonRightText", "buttonRightClick", "imageURLBackground", "withOverlay"]);
     const compVariant = `Header-${moleculeVariant}`;
-    return (jsx(WrapperBackground, Object.assign({ className: classNames(compVariant), moleculeVariant: compVariant, imageURLBackground: imageURLBackground, withOverlay: withOverlay }, props, { children: jsxs(WrapperHeader, Object.assign({ moleculeVariant: compVariant }, { children: [jsxs("div", { children: [iconTop && (jsx(AtomIconTop, { moleculeVariant: compVariant, svg: iconTop })), textBanner && (jsxs(WrapperLineTop, Object.assign({ moleculeVariant: compVariant }, { children: [iconDot && (jsx(AtomIconDot, { moleculeVariant: compVariant, svg: iconDot })), jsx(AtomTextBanner, Object.assign({ moleculeVariant: compVariant }, { children: textBanner }))] })))] }), headingTitle && (jsx(AtomHeading$3, Object.assign({ moleculeVariant: compVariant }, { children: headingTitle }))), jsx(WrapperTextTitle, Object.assign({ moleculeVariant: compVariant }, { children: textTitle &&
-                        (textTitle === null || textTitle === void 0 ? void 0 : textTitle.map((text, i) => (jsx(AtomTextTitle, Object.assign({ moleculeVariant: compVariant }, { children: text }), i)))) })), jsxs(WrapperLineBottom, { children: [(buttonLeftIcon || buttonLeftText) && (jsxs(AtomButtonLeft, Object.assign({ moleculeVariant: compVariant, onClick: buttonLeftClick }, { children: [buttonLeftIcon && (jsx(AtomIconLeft, { moleculeVariant: compVariant, svg: buttonLeftIcon })), buttonLeftText] }))), (buttonRightIcon || buttonRightText) && (jsxs(AtomButtonRight, Object.assign({ moleculeVariant: compVariant, onClick: buttonRightClick }, { children: [buttonRightText, buttonRightIcon && (jsx(AtomIconRight, { moleculeVariant: compVariant, svg: buttonRightIcon }))] })))] })] })) })));
+    return (jsx(WrapperBackground, Object.assign({ className: classNames(compVariant), moleculeVariant: compVariant, imageURLBackground: imageURLBackground, withOverlay: withOverlay }, props, { children: jsxs(WrapperHeader, Object.assign({ moleculeVariant: compVariant }, { children: [jsxs("div", { children: [iconTop && (jsx(AtomIconTop, { moleculeVariant: compVariant, svg: iconTop })), textBanner && (jsxs(WrapperLineTop, Object.assign({ moleculeVariant: compVariant }, { children: [iconDot && (jsx(AtomIconDot, { moleculeVariant: compVariant, svg: iconDot })), jsx(AtomTextBanner, Object.assign({ moleculeVariant: compVariant }, { children: textBanner }))] })))] }), headingTitle && (jsx(AtomHeading$3, Object.assign({ moleculeVariant: compVariant }, { children: headingTitle }))), jsx(WrapperTextTitle, Object.assign({ moleculeVariant: compVariant }, { children: textTitle && (jsx(AtomTextTitle, Object.assign({ moleculeVariant: compVariant }, { children: textTitle }))) })), jsxs(WrapperLineBottom, { children: [(buttonLeftIcon || buttonLeftText) && (jsxs(AtomButtonLeft, Object.assign({ moleculeVariant: compVariant, onClick: buttonLeftClick }, { children: [buttonLeftIcon && (jsx(AtomIconLeft, { moleculeVariant: compVariant, svg: buttonLeftIcon })), buttonLeftText] }))), (buttonRightIcon || buttonRightText) && (jsxs(AtomButtonRight, Object.assign({ moleculeVariant: compVariant, onClick: buttonRightClick }, { children: [buttonRightText, buttonRightIcon && (jsx(AtomIconRight, { moleculeVariant: compVariant, svg: buttonRightIcon }))] })))] })] })) })));
 };
 
 const NavBar = styled.nav `