@contentful/f36-card 4.0.1-beta.2694 → 4.0.1-beta.2696

package/dist/module.js

@@ -1,6 +1,5 @@
-import {jsx as $5DxI1$jsx, jsxs as $5DxI1$jsxs} from "react/jsx-runtime";
 import {cx as $5DxI1$cx, css as $5DxI1$css} from "emotion";
-import {useState as $5DxI1$useState, useCallback as $5DxI1$useCallback, forwardRef as $5DxI1$forwardRef} from "react";
+import $5DxI1$react, {useState as $5DxI1$useState, useCallback as $5DxI1$useCallback, forwardRef as $5DxI1$forwardRef} from "react";
 import {Flex as $5DxI1$Flex, Box as $5DxI1$Box, getEntityStatusStyles as $5DxI1$getEntityStatusStyles} from "@contentful/f36-core";
 import {EntityStatusBadge as $5DxI1$EntityStatusBadge} from "@contentful/f36-badge";
 import {Asset as $5DxI1$Asset} from "@contentful/f36-asset";
@@ -24,8 +23,6 @@ import $5DxI1$truncate from "truncate";
 
 
 
-
-
 const $1ad5c96ea77a4f37$export$e5c3362273de1eca = ()=>{
     return {
         contentBody: /*#__PURE__*/ $5DxI1$css({
@@ -98,8 +95,6 @@ const $1ad5c96ea77a4f37$export$e5c3362273de1eca = ()=>{
 
 
 
-
-
 const $904f5258fdc66658$export$6468e6b9c1bc1de = ()=>{
     return {
         root: /*#__PURE__*/ $5DxI1$css({
@@ -113,25 +108,15 @@ const $904f5258fdc66658$export$6468e6b9c1bc1de = ()=>{
 
 const $e78479b00962523c$export$9b6a647253f61c5f = ({ buttonProps: buttonProps , children: children  })=>{
     const styles = $904f5258fdc66658$export$6468e6b9c1bc1de();
-    return(/*#__PURE__*/ $5DxI1$jsxs($5DxI1$Menu, {
-        children: [
-            /*#__PURE__*/ $5DxI1$jsx($5DxI1$Menu.Trigger, {
-                children: /*#__PURE__*/ $5DxI1$jsx($5DxI1$IconButton, {
-                    "aria-label": "Actions",
-                    icon: /*#__PURE__*/ $5DxI1$jsx($5DxI1$MoreHorizontalIcon, {
-                    }),
-                    ...buttonProps,
-                    className: $5DxI1$cx(styles.root, buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.className),
-                    size: "small",
-                    variant: "transparent",
-                    testId: "cf-ui-card-actions"
-                })
-            }),
-            /*#__PURE__*/ $5DxI1$jsx($5DxI1$Menu.List, {
-                children: children
-            })
-        ]
-    }));
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Menu, null, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Menu.Trigger, null, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$IconButton, {
+        "aria-label": "Actions",
+        icon: /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$MoreHorizontalIcon, null),
+        ...buttonProps,
+        className: $5DxI1$cx(styles.root, buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.className),
+        size: "small",
+        variant: "transparent",
+        testId: "cf-ui-card-actions"
+    })), /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Menu.List, null, children)));
 };
 
 
@@ -172,37 +157,25 @@ const $39a65aff00a76eb6$export$783e10c0b439f264 = (e)=>{
 function $39a65aff00a76eb6$export$606643aa598b5a97(props) {
     const { icon: icon , type: type , actions: actions , actionsButtonProps: actionsButtonProps , badge: badge  } = props;
     const styles = $39a65aff00a76eb6$var$getHeaderStyles();
-    return(/*#__PURE__*/ $5DxI1$jsxs($5DxI1$Flex, {
-        className: $5DxI1$cx(styles.header, actions && styles.headerWithActions),
-        children: [
-            /*#__PURE__*/ $5DxI1$jsx($5DxI1$Flex, {
-                flexGrow: 1,
-                children: type && /*#__PURE__*/ $5DxI1$jsx($5DxI1$Text, {
-                    fontColor: "gray600",
-                    children: type
-                })
-            }),
-            icon && /*#__PURE__*/ $5DxI1$jsx($5DxI1$Flex, {
-                alignItems: "center",
-                marginLeft: "spacingXs",
-                children: icon
-            }),
-            badge && /*#__PURE__*/ $5DxI1$jsx($5DxI1$Flex, {
-                alignItems: "center",
-                marginLeft: "spacingXs",
-                children: badge
-            }),
-            actions && actions.length > 0 && /*#__PURE__*/ $5DxI1$jsx($5DxI1$Flex // don't propagate click event, so onClick handler on the card is not triggered
-            , {
-                onClick: $39a65aff00a76eb6$export$783e10c0b439f264,
-                alignItems: "center",
-                children: /*#__PURE__*/ $5DxI1$jsx($e78479b00962523c$export$9b6a647253f61c5f, {
-                    buttonProps: actionsButtonProps,
-                    children: actions
-                })
-            })
-        ]
-    }));
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+        className: $5DxI1$cx(styles.header, actions && styles.headerWithActions)
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+        flexGrow: 1
+    }, type && /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Text, {
+        fontColor: "gray600"
+    }, type)), icon && /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+        alignItems: "center",
+        marginLeft: "spacingXs"
+    }, icon), badge && /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+        alignItems: "center",
+        marginLeft: "spacingXs"
+    }, badge), actions && actions.length > 0 && /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex // don't propagate click event, so onClick handler on the card is not triggered
+    , {
+        onClick: $39a65aff00a76eb6$export$783e10c0b439f264,
+        alignItems: "center"
+    }, /*#__PURE__*/ $5DxI1$react.createElement($e78479b00962523c$export$9b6a647253f61c5f, {
+        buttonProps: actionsButtonProps
+    }, actions))));
 }
 
 
@@ -212,7 +185,7 @@ function $5d4f8cd04931ee40$var$_BaseCard({ actions: actions , actionsButtonProps
     const [isHovered, setIsHovered] = $5DxI1$useState(isHoveredProp !== null && isHoveredProp !== void 0 ? isHoveredProp : false);
     const isInteractive = Boolean(onClick || href || withDragHandle);
     const hasHeader = Boolean(header);
-    const defaultHeader = type || icon || badge || actions ? /*#__PURE__*/ $5DxI1$jsx($39a65aff00a76eb6$export$606643aa598b5a97, {
+    const defaultHeader = type || icon || badge || actions ? /*#__PURE__*/ $5DxI1$react.createElement($39a65aff00a76eb6$export$606643aa598b5a97, {
         type: type,
         icon: icon,
         badge: badge,
@@ -249,26 +222,22 @@ function $5d4f8cd04931ee40$var$_BaseCard({ actions: actions , actionsButtonProps
     }, [
         onKeyDown
     ]);
-    if (isLoading) return(/*#__PURE__*/ $5DxI1$jsxs($5DxI1$SkeletonContainer, {
+    if (isLoading) return(/*#__PURE__*/ $5DxI1$react.createElement($5DxI1$SkeletonContainer, {
         className: styles.skeleton,
-        svgHeight: "5.6rem",
-        children: [
-            /*#__PURE__*/ $5DxI1$jsx($5DxI1$SkeletonDisplayText, {
-                numberOfLines: 1
-            }),
-            /*#__PURE__*/ $5DxI1$jsx($5DxI1$SkeletonBodyText, {
-                numberOfLines: 1,
-                offsetTop: 35
-            })
-        ]
-    }));
-    const drag = /*#__PURE__*/ $5DxI1$jsx($5DxI1$DragHandle, {
+        svgHeight: "5.6rem"
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$SkeletonDisplayText, {
+        numberOfLines: 1
+    }), /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$SkeletonBodyText, {
+        numberOfLines: 1,
+        offsetTop: 35
+    })));
+    const drag = /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$DragHandle, {
         className: styles.dragHandle,
         isActive: isDragging,
         label: "Reorder entry",
         onClick: $39a65aff00a76eb6$export$783e10c0b439f264
     });
-    return(/*#__PURE__*/ $5DxI1$jsxs($5DxI1$Box, {
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Box, {
         "aria-label": title || ariaLabel,
         "aria-pressed": otherProps.as === 'button' ? isSelected ? 'true' : 'false' : undefined,
         as: $5d4f8cd04931ee40$export$eed7d00d62e881b8,
@@ -290,26 +259,17 @@ function $5d4f8cd04931ee40$var$_BaseCard({ actions: actions , actionsButtonProps
         target: target,
         ...otherProps,
         ref: forwardedRef,
-        testId: testId,
-        children: [
-            withDragHandle ? dragHandleRender ? dragHandleRender({
-                drag: drag,
-                isDragging: isDragging
-            }) : drag : null,
-            /*#__PURE__*/ $5DxI1$jsxs("div", {
-                className: styles.wrapper,
-                "data-card-part": "wrapper",
-                children: [
-                    header !== null && header !== void 0 ? header : defaultHeader,
-                    /*#__PURE__*/ $5DxI1$jsx("div", {
-                        className: styles.contentBody,
-                        "data-card-part": "content",
-                        children: children
-                    })
-                ]
-            })
-        ]
-    }));
+        testId: testId
+    }, withDragHandle ? dragHandleRender ? dragHandleRender({
+        drag: drag,
+        isDragging: isDragging
+    }) : drag : null, /*#__PURE__*/ $5DxI1$react.createElement("div", {
+        className: styles.wrapper,
+        "data-card-part": "wrapper"
+    }, header !== null && header !== void 0 ? header : defaultHeader, /*#__PURE__*/ $5DxI1$react.createElement("div", {
+        className: styles.contentBody,
+        "data-card-part": "content"
+    }, children))));
 }
 const $5d4f8cd04931ee40$export$ffd8d1a491a618f2 = /*#__PURE__*/ $5DxI1$forwardRef($5d4f8cd04931ee40$var$_BaseCard);
 
@@ -346,24 +306,23 @@ const $47cd70cbeaaca08f$export$37a6ca57378bcb83 = ()=>{
 
 const $8085040fa20e1a82$export$eff93e4e59ccc3b8 = ({ actions: actions , className: className , icon: icon = null , isSelected: isSelected , size: size = 'default' , src: src , status: status , title: title , type: type , withDragHandle: withDragHandle = false , isLoading: isLoading , testId: testId = 'cf-ui-asset-card' , ...otherProps })=>{
     const styles = $47cd70cbeaaca08f$export$37a6ca57378bcb83();
-    const badge = status ? /*#__PURE__*/ $5DxI1$jsx($5DxI1$EntityStatusBadge, {
+    const badge = status ? /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$EntityStatusBadge, {
         entityStatus: status
     }) : null;
-    const header = icon || badge || actions ? /*#__PURE__*/ $5DxI1$jsx($39a65aff00a76eb6$export$606643aa598b5a97, {
+    const header = icon || badge || actions ? /*#__PURE__*/ $5DxI1$react.createElement($39a65aff00a76eb6$export$606643aa598b5a97, {
         icon: icon,
         badge: badge,
         actions: actions
     }) : null;
-    if (isLoading) return(/*#__PURE__*/ $5DxI1$jsx($5DxI1$SkeletonContainer, {
+    if (isLoading) return(/*#__PURE__*/ $5DxI1$react.createElement($5DxI1$SkeletonContainer, {
         className: styles.skeleton,
         svgWidth: size === 'default' ? '18rem' : '11rem',
-        svgHeight: size === 'default' ? '18.75rem' : '12rem',
-        children: /*#__PURE__*/ $5DxI1$jsx($5DxI1$SkeletonImage, {
-            width: "100%",
-            height: "18.75rem"
-        })
-    }));
-    return(/*#__PURE__*/ $5DxI1$jsx($5d4f8cd04931ee40$export$ffd8d1a491a618f2, {
+        svgHeight: size === 'default' ? '18.75rem' : '12rem'
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$SkeletonImage, {
+        width: "100%",
+        height: "18.75rem"
+    })));
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5d4f8cd04931ee40$export$ffd8d1a491a618f2, {
         ...otherProps,
         badge: badge,
         className: $5DxI1$cx(styles.root({
@@ -373,20 +332,18 @@ const $8085040fa20e1a82$export$eff93e4e59ccc3b8 = ({ actions: actions , classNam
         isSelected: isSelected,
         title: title,
         withDragHandle: withDragHandle,
-        testId: testId,
-        children: /*#__PURE__*/ $5DxI1$jsx($5DxI1$Flex, {
-            alignItems: "center",
-            fullHeight: true,
-            justifyContent: "center",
-            children: /*#__PURE__*/ $5DxI1$jsx($5DxI1$Asset, {
-                className: styles.asset,
-                src: src,
-                status: status,
-                title: title,
-                type: type
-            })
-        })
-    }));
+        testId: testId
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+        alignItems: "center",
+        fullHeight: true,
+        justifyContent: "center"
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Asset, {
+        className: styles.asset,
+        src: src,
+        status: status,
+        title: title,
+        type: type
+    }))));
 };
 
 
@@ -398,7 +355,6 @@ const $8085040fa20e1a82$export$eff93e4e59ccc3b8 = ({ actions: actions , classNam
 
 
 
-
 const $ef4cd22839ed0c4f$var$getCardPaddingValue = (padding)=>{
     switch(padding){
         case 'large':
@@ -427,37 +383,25 @@ function $5c85d26261f47e13$var$_Card({ actions: actions , badge: badge , icon: i
         padding: padding
     });
     const hasHeader = Boolean(title || icon || badge || actions);
-    return(/*#__PURE__*/ $5DxI1$jsx($5d4f8cd04931ee40$export$ffd8d1a491a618f2, {
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5d4f8cd04931ee40$export$ffd8d1a491a618f2, {
         className: $5DxI1$cx(styles.root, className),
         ...otherProps,
         testId: testId,
-        header: hasHeader && /*#__PURE__*/ $5DxI1$jsxs($5DxI1$Flex, {
+        header: hasHeader && /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
             alignItems: "center",
-            className: $5DxI1$cx(styles.header),
-            children: [
-                title && /*#__PURE__*/ $5DxI1$jsx($5DxI1$Flex, {
-                    as: "header",
-                    flexGrow: 1,
-                    children: /*#__PURE__*/ $5DxI1$jsx($5DxI1$Heading, {
-                        marginBottom: "none",
-                        children: title
-                    })
-                }),
-                icon && /*#__PURE__*/ $5DxI1$jsx($5DxI1$Flex, {
-                    alignItems: "center",
-                    marginLeft: "spacingXs",
-                    children: icon
-                }),
-                badge && /*#__PURE__*/ $5DxI1$jsx($5DxI1$Flex, {
-                    alignItems: "center",
-                    marginLeft: "spacingXs",
-                    children: badge
-                }),
-                actions && /*#__PURE__*/ $5DxI1$jsx($e78479b00962523c$export$9b6a647253f61c5f, {
-                    children: actions
-                })
-            ]
-        }),
+            className: $5DxI1$cx(styles.header)
+        }, title && /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+            as: "header",
+            flexGrow: 1
+        }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Heading, {
+            marginBottom: "none"
+        }, title)), icon && /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+            alignItems: "center",
+            marginLeft: "spacingXs"
+        }, icon), badge && /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+            alignItems: "center",
+            marginLeft: "spacingXs"
+        }, badge), actions && /*#__PURE__*/ $5DxI1$react.createElement($e78479b00962523c$export$9b6a647253f61c5f, null, actions)),
         ref: forwardedRef
     }));
 }
@@ -473,7 +417,6 @@ const $5c85d26261f47e13$export$60332b2344f7fe41 = /*#__PURE__*/ $5DxI1$forwardRe
 
 
 
-
 const $9af5014d4484efe0$export$25b6e8fb8b7b795b = ()=>{
     return {
         actionsButton: /*#__PURE__*/ $5DxI1$css({
@@ -534,30 +477,28 @@ function $37db58711d7d1bd4$var$EntryCardTitle({ title: title  }) {
     if (!title) return null;
     const truncatedTitle = $5DxI1$truncate(title, 255, {
     });
-    return(/*#__PURE__*/ $5DxI1$jsx($5DxI1$Subheading, {
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Subheading, {
         title: title.length > 255 ? title : '',
         testId: "title",
         as: "h1",
-        marginBottom: "none",
-        children: truncatedTitle
-    }));
+        marginBottom: "none"
+    }, truncatedTitle));
 }
 function $37db58711d7d1bd4$var$EntryCardDescription({ description: description , size: size  }) {
     if (!description || size === 'small') return null;
     const truncatedDescription = $5DxI1$truncate(description, 95, {
     });
-    return(/*#__PURE__*/ $5DxI1$jsx($5DxI1$Paragraph, {
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Paragraph, {
         marginBottom: "none",
-        isTruncated: true,
-        children: truncatedDescription
-    }));
+        isTruncated: true
+    }, truncatedDescription));
 }
 function $37db58711d7d1bd4$var$_EntryCard({ actions: actions , children: children , className: className , src: src , status: status , thumbnailElement: thumbnailElement , description: description , withDragHandle: withDragHandle = false , title: title , size: size , testId: testId = 'cf-ui-entry-card' , contentType: contentType , ...otherProps }, forwardedRef) {
     const styles = $9af5014d4484efe0$export$25b6e8fb8b7b795b();
-    const badge = status ? /*#__PURE__*/ $5DxI1$jsx($5DxI1$EntityStatusBadge, {
+    const badge = status ? /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$EntityStatusBadge, {
         entityStatus: status
     }) : null;
-    return(/*#__PURE__*/ $5DxI1$jsx($5d4f8cd04931ee40$export$ffd8d1a491a618f2, {
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5d4f8cd04931ee40$export$ffd8d1a491a618f2, {
         as: $37db58711d7d1bd4$var$ENTRY_CARD_DEFAULT_TAG,
         ...otherProps,
         actions: actions,
@@ -566,34 +507,23 @@ function $37db58711d7d1bd4$var$_EntryCard({ actions: actions , children: childre
         withDragHandle: withDragHandle,
         ref: forwardedRef,
         type: contentType,
-        testId: testId,
-        children: /*#__PURE__*/ $5DxI1$jsxs($5DxI1$Flex, {
-            alignItems: "center",
-            className: styles.content(size),
-            flexDirection: "row",
-            children: [
-                /*#__PURE__*/ $5DxI1$jsxs($5DxI1$Flex, {
-                    flexDirection: "column",
-                    flexGrow: 1,
-                    gap: "spacingS",
-                    children: [
-                        /*#__PURE__*/ $5DxI1$jsx($37db58711d7d1bd4$var$EntryCardTitle, {
-                            title: title
-                        }),
-                        /*#__PURE__*/ $5DxI1$jsx($37db58711d7d1bd4$var$EntryCardDescription, {
-                            size: size,
-                            description: description
-                        }),
-                        children
-                    ]
-                }),
-                thumbnailElement && size !== 'small' && /*#__PURE__*/ $5DxI1$jsx("figure", {
-                    className: styles.thumbnail(size),
-                    children: thumbnailElement
-                })
-            ]
-        })
-    }));
+        testId: testId
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+        alignItems: "center",
+        className: styles.content(size),
+        flexDirection: "row"
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Flex, {
+        flexDirection: "column",
+        flexGrow: 1,
+        gap: "spacingS"
+    }, /*#__PURE__*/ $5DxI1$react.createElement($37db58711d7d1bd4$var$EntryCardTitle, {
+        title: title
+    }), /*#__PURE__*/ $5DxI1$react.createElement($37db58711d7d1bd4$var$EntryCardDescription, {
+        size: size,
+        description: description
+    }), children), thumbnailElement && size !== 'small' && /*#__PURE__*/ $5DxI1$react.createElement("figure", {
+        className: styles.thumbnail(size)
+    }, thumbnailElement))));
 }
 const $37db58711d7d1bd4$export$326973e3eb2dbf = /*#__PURE__*/ $5DxI1$forwardRef($37db58711d7d1bd4$var$_EntryCard);
 
@@ -605,7 +535,6 @@ const $37db58711d7d1bd4$export$326973e3eb2dbf = /*#__PURE__*/ $5DxI1$forwardRef(
 
 
 
-
 const $36eff0059fe803cd$export$ccfc6dbdba6183be = ()=>{
     return {
         actions: /*#__PURE__*/ $5DxI1$css({
@@ -659,31 +588,26 @@ const $36eff0059fe803cd$export$ccfc6dbdba6183be = ()=>{
 
 const $e2b3923606cf2d6e$export$94c16395f9ec3265 = ({ actions: actions , className: className , status: status , title: title , isLoading: isLoading , testId: testId = 'cf-ui-inline-entry-card' , ...otherProps })=>{
     const styles = $36eff0059fe803cd$export$ccfc6dbdba6183be();
-    const header = /*#__PURE__*/ $5DxI1$jsx($e78479b00962523c$export$9b6a647253f61c5f, {
+    const header = /*#__PURE__*/ $5DxI1$react.createElement($e78479b00962523c$export$9b6a647253f61c5f, {
         buttonProps: {
             className: styles.actions
-        },
-        children: actions
-    });
-    if (isLoading) return(/*#__PURE__*/ $5DxI1$jsx($5DxI1$SkeletonContainer, {
+        }
+    }, actions);
+    if (isLoading) return(/*#__PURE__*/ $5DxI1$react.createElement($5DxI1$SkeletonContainer, {
         className: styles.skeleton,
         svgHeight: "1.25rem",
-        svgWidth: "6rem",
-        children: /*#__PURE__*/ $5DxI1$jsx($5DxI1$SkeletonBodyText, {
-            numberOfLines: 1
-        })
-    }));
-    return(/*#__PURE__*/ $5DxI1$jsx($5d4f8cd04931ee40$export$ffd8d1a491a618f2, {
+        svgWidth: "6rem"
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$SkeletonBodyText, {
+        numberOfLines: 1
+    })));
+    return(/*#__PURE__*/ $5DxI1$react.createElement($5d4f8cd04931ee40$export$ffd8d1a491a618f2, {
         ...otherProps,
         className: $5DxI1$cx(styles.root({
             status: status
         }), className),
         header: header,
-        testId: testId,
-        children: /*#__PURE__*/ $5DxI1$jsx($5DxI1$Text, {
-            children: title
-        })
-    }));
+        testId: testId
+    }, /*#__PURE__*/ $5DxI1$react.createElement($5DxI1$Text, null, title)));
 };