@useblu/ocean-react 1.67.0 → 1.69.0

package/index.js

@@ -48117,7 +48117,7 @@ var Shortcut = function (_a) {
 };
 
 var CardListItem = e.forwardRef(function (_a, ref) {
-    var title = _a.title, description = _a.description, caption = _a.caption, leadingIcon = _a.leadingIcon, actionIcon = _a.actionIcon, _b = _a.size, size = _b === void 0 ? 'medium' : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.fullWidth, fullWidth = _d === void 0 ? false : _d, onClick = _a.onClick, loading = _a.loading, rest = __rest$2(_a, ["title", "description", "caption", "leadingIcon", "actionIcon", "size", "disabled", "fullWidth", "onClick", "loading"]);
+    var title = _a.title, description = _a.description, caption = _a.caption, leadingIcon = _a.leadingIcon, actionIcon = _a.actionIcon, _b = _a.size, size = _b === void 0 ? 'medium' : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.fullWidth, fullWidth = _d === void 0 ? false : _d, onClick = _a.onClick, loading = _a.loading, tag = _a.tag, rest = __rest$2(_a, ["title", "description", "caption", "leadingIcon", "actionIcon", "size", "disabled", "fullWidth", "onClick", "loading", "tag"]);
     return loading ? (e__default["default"].createElement("div", __assign$2({ ref: ref }, rest, { "data-testid": "card-list-item", className: classNames('ods-card-list-item', "ods-card-list-item--size-".concat(size), { 'ods-card-list-item--full-width': fullWidth }, {
             'ods-card-list-item--loading': loading
         }) }),
@@ -48134,7 +48134,9 @@ var CardListItem = e.forwardRef(function (_a, ref) {
             e__default["default"].createElement("div", { className: "ods-card-list-item__content__title" }, title),
             description && (e__default["default"].createElement("div", { className: "ods-card-list-item__content__description" }, description)),
             caption && size === 'medium' && (e__default["default"].createElement("div", { className: "ods-card-list-item__content__caption" }, caption))),
-        actionIcon && (e__default["default"].createElement("div", { className: "ods-card-list-item__action" }, actionIcon))));
+        e__default["default"].createElement("div", { className: "ods-card-list-item__wrapper" },
+            tag && (e__default["default"].createElement(Tag, { variant: "highlight", type: "important" }, tag)),
+            actionIcon && (e__default["default"].createElement("div", { className: "ods-card-list-item__action" }, actionIcon)))));
 });
 CardListItem.displayName = 'CardListItem';
 
@@ -48257,6 +48259,61 @@ var Chips = function (_a) {
 };
 Chips.displayName = 'Chips';
 
+function useWebNotification(_a) {
+    var setIsOpen = _a.setIsOpen, action = _a.action;
+    var closeWebNotification = e.useCallback(function () {
+        setIsOpen(false);
+    }, [setIsOpen]);
+    var dispatchAction = e.useCallback(function () {
+        if (action)
+            action();
+    }, [action]);
+    return {
+        closeWebNotification: closeWebNotification,
+        dispatchAction: dispatchAction
+    };
+}
+
+var WebNotification = e__default["default"].forwardRef(function (_a, ref) {
+    var _b = _a.type, type = _b === void 0 ? 'info' : _b, description = _a.description, isOpen = _a.isOpen, setIsOpen = _a.setIsOpen, action = _a.action, actionLabel = _a.actionLabel, _c = _a.position, position = _c === void 0 ? 'bottom-right' : _c, className = _a.className, title = _a.title;
+    var _d = useWebNotification({
+        type: type,
+        isOpen: isOpen,
+        setIsOpen: setIsOpen,
+        action: action
+    }), closeWebNotification = _d.closeWebNotification, dispatchAction = _d.dispatchAction;
+    var _e = e.useState(0), notificationIndex = _e[0], setNotificationIndex = _e[1];
+    var notificationRef = e.useRef(null);
+    e.useEffect(function () {
+        if (isOpen) {
+            var allOpenedNotifications = Array.from(document.querySelectorAll('.ods-web-notification')).reverse();
+            var notificationPosition = allOpenedNotifications.findIndex(function (el) { return el === notificationRef.current; }) + 1;
+            setNotificationIndex(notificationPosition);
+        }
+    }, [isOpen]);
+    return (e__default["default"].createElement(e__default["default"].Fragment, null, isOpen && (e__default["default"].createElement("div", { className: classNames('ods-web-notification', "position-".concat(notificationIndex), "ods-web-notification__".concat(position, "-").concat(action ? 'action' : 'default'), className), ref: function (el) {
+            notificationRef.current = el;
+            if (ref) {
+                if (typeof ref === 'function') {
+                    ref(el);
+                }
+                else {
+                    ref.current = el;
+                }
+            }
+        }, "data-testid": "web-notification-test" },
+        e__default["default"].createElement("div", { className: "ods-web-notification__content" },
+            e__default["default"].createElement("div", { className: "ods-web-notification__wrapper" },
+                e__default["default"].createElement("div", { className: "ods-web-notification__body" },
+                    e__default["default"].createElement(Typography, { variant: "description", inverse: true }, title),
+                    e__default["default"].createElement(Typography, { variant: "caption" }, description)),
+                action && (e__default["default"].createElement(e__default["default"].Fragment, null,
+                    e__default["default"].createElement(Link, { onClick: dispatchAction, className: "ods-web-notification__action-text-".concat(type), size: "sm" }, actionLabel !== null && actionLabel !== void 0 ? actionLabel : 'action')))),
+            e__default["default"].createElement("div", { className: "ods-web-notification__close-button" },
+                e__default["default"].createElement(Wa, { size: 16, onClick: closeWebNotification })))))));
+});
+WebNotification.displayName = 'WebNotification';
+
 exports.Accordion = Accordion;
 exports.Alert = Alert;
 exports.Badge = Badge;
@@ -48300,4 +48357,5 @@ exports.TopBar = TopBar;
 exports.TransactionListItem = TransactionListItem;
 exports.Typography = Typography;
 exports.UnorderedListItem = UnorderedListItem;
+exports.WebNotification = WebNotification;
 //# sourceMappingURL=index.js.map