@meduza/ui-kit-2 0.1.41 → 0.1.42

package/dist/Image/Image.types.d.ts

@@ -19,6 +19,7 @@ export interface ImageProps {
         desktop: boolean;
     };
     ratio?: number;
+    styleContext?: string[] | string;
 }
 export interface PictureProps {
     source?: string[];

package/dist/ui-kit-2.cjs.development.js

@@ -289,6 +289,15 @@ var Switcher = function Switcher(_ref) {
   }, children));
 };
 
+var makeStyleContext = function makeStyleContext(classNames, styleContext, styles) {
+  var context = Array.isArray(styleContext) ? styleContext.filter(function (ctx) {
+    return styles[ctx];
+  }).map(function (ctx) {
+    return [[styles[ctx]], true];
+  }) : [[styles[styleContext], !!styleContext && !!styles[styleContext]]];
+  return classNames.concat(context);
+};
+
 var BlockContext = /*#__PURE__*/React__default.createContext({
   lightBox: null
 });
@@ -431,7 +440,7 @@ var RenderPicture = function RenderPicture(_ref) {
   }));
 };
 
-var styles$4 = {"root":"Image-module_root__1vsA_","isLoaded":"Image-module_isLoaded__3XhU5","wrapper":"Image-module_wrapper__3fLjs","fullscreen":"Image-module_fullscreen__29apx"};
+var styles$4 = {"root":"Image-module_root__1vsA_","isLoaded":"Image-module_isLoaded__3XhU5","wrapper":"Image-module_wrapper__3fLjs","fullscreen":"Image-module_fullscreen__29apx","dark":"Image-module_dark__3o0nU"};
 
 var Image = function Image(_ref) {
   var alt = _ref.alt,
@@ -442,7 +451,8 @@ var Image = function Image(_ref) {
       source = _ref.source,
       lazy = _ref.lazy,
       fullscreen = _ref.fullscreen,
-      ratio = _ref.ratio;
+      ratio = _ref.ratio,
+      styleContext = _ref.styleContext;
 
   var _useContext = React.useContext(BlockContext),
       lightBox = _useContext.lightBox;
@@ -479,8 +489,14 @@ var Image = function Image(_ref) {
   /* fallback w325 url until w6 was released */
 
   var fallbackSource = source && source[0] || optimized.w325 && optimized.w325['1x'] || optimized.original;
+  var classNames = [[styles$4.root, true], [styles$4.isLoaded, isLoaded], [styles$4.fullscreen, fullscreen && fullscreen.desktop]];
+
+  if (styleContext) {
+    classNames = makeStyleContext(classNames, styleContext, styles$4);
+  }
+
   return React__default.createElement("div", {
-    className: makeClassName([[styles$4.root, true], [styles$4.isLoaded, isLoaded], [styles$4.fullscreen, fullscreen && fullscreen.desktop]]),
+    className: makeClassName(classNames),
     style: blockStyles,
     "data-testid": "image"
   }, React__default.createElement("div", {
@@ -800,15 +816,6 @@ var DotsOnImage = function DotsOnImage(_ref) {
   })))));
 };
 
-var makeStyleContext = function makeStyleContext(classNames, styleContext, styles) {
-  var context = Array.isArray(styleContext) ? styleContext.filter(function (ctx) {
-    return styles[ctx];
-  }).map(function (ctx) {
-    return [[styles[ctx]], true];
-  }) : [[styles[styleContext], !!styleContext && !!styles[styleContext]]];
-  return classNames.concat(context);
-};
-
 var styles$8 = {"root":"Tag-module_root__3IqWC","small":"Tag-module_small__2IAb7","large":"Tag-module_large__22z_o","dark":"Tag-module_dark__sgnt1","light":"Tag-module_light__1zUhp","gold":"Tag-module_gold__2ksA7","gray":"Tag-module_gray__mGAO_","inherit":"Tag-module_inherit__2QB5U","is1to1":"Tag-module_is1to1__3EDbC","is1to2":"Tag-module_is1to2__3xbC6","isInSuperBlock":"Tag-module_isInSuperBlock__38JE0","is1to3":"Tag-module_is1to3__3j5K-","is1to4":"Tag-module_is1to4__2vq4r","slide":"Tag-module_slide__2nMDw","game":"Tag-module_game__3j5yG","richRelated":"Tag-module_richRelated__2vbQQ","card":"Tag-module_card__1EAeF","live":"Tag-module_live__rwXuR","episode":"Tag-module_episode__3o6gg","podcast":"Tag-module_podcast__VPoll","rich":"Tag-module_rich__2URd9","isInDynamicBlock":"Tag-module_isInDynamicBlock__1YM9I","mobile":"Tag-module_mobile__QQxuv","desktop":"Tag-module_desktop__1Bjsy"};
 
 var Tag = function Tag(_ref) {
@@ -1282,7 +1289,8 @@ var EmbedBlock = function EmbedBlock(_ref) {
             height: block.data.height,
             alt: block.data.caption,
             display: block.data.display,
-            lazy: block.data.lazy
+            lazy: block.data.lazy,
+            styleContext: styleContext
           }));
         }