@mmb-digital/ds-lilly 0.0.1-alpha.360 → 0.0.1-alpha.361

package/dist/ds-lilly.js

@@ -96010,7 +96010,7 @@ var CollapseHeader = function (_a) {
 
 var Card = function (_a) {
     var _b;
-    var backgroundColor = _a.backgroundColor, borderColor = _a.borderColor, children = _a.children, _c = _a.hasCustomTrigger, hasCustomTrigger = _c === void 0 ? false : _c, collapseHeader = _a.header, iconBackgroundColor = _a.iconBackgroundColor, iconName = _a.iconName, isCollapsible = _a.isCollapsible, isIconAlignTop = _a.isIconAlignTop, isInteractive = _a.isInteractive, _d = _a.isOpen, isOpen = _d === void 0 ? false : _d, isSelected = _a.isSelected, onClick = _a.onClick, onToggle = _a.onToggle, shadowSize = _a.shadowSize, size = _a.size, testId = _a.testId, theme = _a.theme, _e = _a.withoutRole, withoutRole = _e === void 0 ? false : _e;
+    var allowEventPropagation = _a.allowEventPropagation, backgroundColor = _a.backgroundColor, borderColor = _a.borderColor, children = _a.children, _c = _a.hasCustomTrigger, hasCustomTrigger = _c === void 0 ? false : _c, collapseHeader = _a.header, iconBackgroundColor = _a.iconBackgroundColor, iconName = _a.iconName, isCollapsible = _a.isCollapsible, isIconAlignTop = _a.isIconAlignTop, isInteractive = _a.isInteractive, _d = _a.isOpen, isOpen = _d === void 0 ? false : _d, isSelected = _a.isSelected, onClick = _a.onClick, onToggle = _a.onToggle, shadowSize = _a.shadowSize, size = _a.size, testId = _a.testId, theme = _a.theme, _e = _a.withoutRole, withoutRole = _e === void 0 ? false : _e;
     var identification = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["useMemo"])(function () { return "card_" + cuid_default()(); }, []);
     var _f = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["useState"])(isOpen), isOpened = _f[0], setIsOpened = _f[1];
     var cardRef = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["useRef"])(null);
@@ -96024,7 +96024,9 @@ var Card = function (_a) {
     var handleOnClick = function (event) {
         if (isInteractive && onClick) {
             onClick(event);
-            event.stopPropagation();
+            if (!allowEventPropagation) {
+                event.stopPropagation();
+            }
         }
     };
     var handleOnToggle = function (event) {
@@ -110518,9 +110520,13 @@ var Header_content = {
     }
 };
 var MobilePanelHeader = function (_a) {
-    var children = _a.children, closeAria = _a.closeAria, hasClose = _a.hasClose, image = _a.image, _b = _a.testId, testId = _b === void 0 ? 'MobilePanelHeader' : _b, title = _a.title, _c = _a.titleSize, titleSize = _c === void 0 ? 'h1' : _c, titleVisual = _a.titleVisual;
+    var allowEventPropagation = _a.allowEventPropagation, children = _a.children, closeAria = _a.closeAria, hasClose = _a.hasClose, image = _a.image, _b = _a.testId, testId = _b === void 0 ? 'MobilePanelHeader' : _b, title = _a.title, _c = _a.titleSize, titleSize = _c === void 0 ? 'h1' : _c, titleVisual = _a.titleVisual;
     var close = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["useContext"])(contexts_MobilePanelContext).close;
-    var handleHeaderClick = function (event) { return event.stopPropagation(); };
+    var handleHeaderClick = function (event) {
+        if (!allowEventPropagation) {
+            event.stopPropagation();
+        }
+    };
     return (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(motion.div, { className: "l-mobilePanel__header", "data-testid": testId, variants: Header_content, onClick: handleHeaderClick },
         hasClose && closeAria && (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Button, { isSmall: true, testId: "MobilePanelCloseButton", theme: "l-mobilePanel__close", type: "transparent", onClick: close },
             external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("span", { className: "u-vHide" }, closeAria),

package/dist/types/src/components/Components/Card/Card.d.ts

@@ -2,6 +2,8 @@ import { KeyboardEvent, ReactNode, SyntheticEvent } from 'react';
 import { IconBackgroundType, IconNameType } from '../../../types';
 import { ComponentPropsType } from '../../../utils';
 export interface CardPropsType extends ComponentPropsType {
+    /** Allow click event propagation */
+    allowEventPropagation?: boolean;
     /** Changes background color of card. */
     backgroundColor?: BackgroundColorType;
     /** Changes border color of card. */
@@ -39,6 +41,6 @@ export interface CardPropsType extends ComponentPropsType {
 }
 export declare type ShadowSizeType = 'small' | 'medium' | 'large' | 'no';
 declare type BackgroundColorType = 'cloud' | 'grey' | 'gold' | 'primaryDark' | 'transparent';
-export declare const Card: ({ backgroundColor, borderColor, children, hasCustomTrigger, header: collapseHeader, iconBackgroundColor, iconName, isCollapsible, isIconAlignTop, isInteractive, isOpen, isSelected, onClick, onToggle, shadowSize, size, testId, theme, withoutRole }: CardPropsType) => JSX.Element;
+export declare const Card: ({ allowEventPropagation, backgroundColor, borderColor, children, hasCustomTrigger, header: collapseHeader, iconBackgroundColor, iconName, isCollapsible, isIconAlignTop, isInteractive, isOpen, isSelected, onClick, onToggle, shadowSize, size, testId, theme, withoutRole }: CardPropsType) => JSX.Element;
 export {};
 //# sourceMappingURL=Card.d.ts.map

package/dist/types/src/components/Layout/MobilePanel/_elements_/Header.d.ts

@@ -1,6 +1,8 @@
 import { ReactNode } from 'react';
 import { ComponentPropsType, TitleSize } from '../../../../';
 export interface MobilePanelHeaderPropsType extends ComponentPropsType {
+    /** Allow click event propagation */
+    allowEventPropagation?: boolean;
     /** Children to be rendered in the main container. */
     children: ReactNode | ReactNode[];
     /** Image for header. */
@@ -16,5 +18,5 @@ export interface MobilePanelHeaderPropsType extends ComponentPropsType {
     /** Title visual size. Use this for matching title visual with desired design. */
     titleVisual?: TitleSize;
 }
-export declare const MobilePanelHeader: ({ children, closeAria, hasClose, image, testId, title, titleSize, titleVisual }: MobilePanelHeaderPropsType) => JSX.Element;
+export declare const MobilePanelHeader: ({ allowEventPropagation, children, closeAria, hasClose, image, testId, title, titleSize, titleVisual }: MobilePanelHeaderPropsType) => JSX.Element;
 //# sourceMappingURL=Header.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mmb-digital/ds-lilly",
-  "version": "0.0.1-alpha.360",
+  "version": "0.0.1-alpha.361",
   "description": "MMB LILLY design system",
   "license": "UNLICENSED",
   "sideEffects": false,