@useblu/ocean-react 1.74.0 → 1.76.0

package/index.js

@@ -442,6 +442,47 @@ var Alert = e__default["default"].forwardRef(function (_a, ref) {
 });
 Alert.displayName = 'Alert';
 
+var Badge = e__default["default"].forwardRef(function (_a, ref) {
+    var children = _a.children, _b = _a.variation, variation = _b === void 0 ? 'small' : _b, className = _a.className, count = _a.count, color = _a.color, rest = __rest$2(_a, ["children", "variation", "className", "count", "color"]);
+    var countToShow = count && count > 99 ? "99+" : count;
+    return (e__default["default"].createElement("div", __assign$2({ ref: ref, role: "tag", className: classNames('ods-badge', "ods-badge--".concat(variation), "ods-badge--".concat(color), className, {
+            'ods-badge--overflow': count && count > 9
+        }) }, rest),
+        variation !== 'tiny' && typeof count !== 'undefined' && (e__default["default"].createElement("div", { className: "ods-badge__content ods-badge__count" }, countToShow)),
+        variation !== 'tiny' && typeof count === 'undefined' && children && (e__default["default"].createElement("div", { className: "ods-badge__content ods-badge__text" }, children)),
+        variation === 'tiny' && e__default["default"].createElement("div", { className: "ods-badge__content" })));
+});
+Badge.displayName = 'Badge';
+
+var Header = function (_a) {
+    var title = _a.title, subtitle = _a.subtitle, count = _a.count;
+    return (e__default["default"].createElement("div", { className: "ods-card-group__header" },
+        e__default["default"].createElement("div", { className: "ods-card-group__header--content" },
+            e__default["default"].createElement("p", { className: "ods-typography ods-typography__heading4" }, title),
+            subtitle && (e__default["default"].createElement("p", { className: "ods-typography ods-typography__description" }, subtitle))),
+        count !== undefined && (e__default["default"].createElement(Badge, { variation: "medium", color: count === 0 ? 'neutral' : 'alert', count: count }))));
+};
+
+var ActionButton = function (_a) {
+    var actionLabel = _a.actionLabel, actionClick = _a.actionClick;
+    return (e__default["default"].createElement(e__default["default"].Fragment, null,
+        e__default["default"].createElement("hr", { className: "ods-divider" }),
+        e__default["default"].createElement("button", { onClick: actionClick, type: "button", className: "ods-card-group__action", "aria-label": actionLabel },
+            e__default["default"].createElement("span", { className: "ods-card-group__action--label" }, actionLabel),
+            e__default["default"].createElement(re, { size: 20 }))));
+};
+
+var CardGroup = e.forwardRef(function (_a, ref) {
+    var title = _a.title, subtitle = _a.subtitle, actionLabel = _a.actionLabel, actionClick = _a.actionClick, count = _a.count, children = _a.children, _b = _a.variant, variant = _b === void 0 ? 'minimal' : _b, rest = __rest$2(_a, ["title", "subtitle", "actionLabel", "actionClick", "count", "children", "variant"]);
+    return (e__default["default"].createElement("div", __assign$2({ ref: ref }, rest, { "data-testid": "card-group", className: classNames('ods-card-group', "ods-card-group--".concat(variant)) }),
+        (title || subtitle) && (e__default["default"].createElement(Header, { title: title, subtitle: subtitle, count: count })),
+        children && variant !== 'header' && (e__default["default"].createElement(e__default["default"].Fragment, null,
+            (title || subtitle) && e__default["default"].createElement("hr", { className: "ods-divider" }),
+            e__default["default"].createElement("div", null, children))),
+        actionLabel && variant !== 'header' && (e__default["default"].createElement(ActionButton, { actionLabel: actionLabel, actionClick: actionClick }))));
+});
+CardGroup.displayName = 'CardGroup';
+
 var lib$3 = {};
 
 var slider = {};
@@ -27372,18 +27413,6 @@ var Steps = function (_a) {
     return (e__default["default"].createElement("svg", { height: "20", width: 30 * (steps - 1) + 22, viewBox: "0 0 ".concat(30 * (steps - 1) + 22, " 20"), fill: "none", xmlns: "http://www.w3.org/2000/svg", "data-testid": "step-".concat(currentStep) }, Array.from(Array(steps).keys()).map(function (step) { return (e__default["default"].createElement("g", { key: step }, getCurrentStep(step + 1))); })));
 };
 
-var Badge = e__default["default"].forwardRef(function (_a, ref) {
-    var children = _a.children, _b = _a.variation, variation = _b === void 0 ? 'small' : _b, className = _a.className, count = _a.count, color = _a.color, rest = __rest$2(_a, ["children", "variation", "className", "count", "color"]);
-    var countToShow = count && count > 99 ? "99+" : count;
-    return (e__default["default"].createElement("div", __assign$2({ ref: ref, role: "tag", className: classNames('ods-badge', "ods-badge--".concat(variation), "ods-badge--".concat(color), className, {
-            'ods-badge--overflow': count && count > 9
-        }) }, rest),
-        variation !== 'tiny' && typeof count !== 'undefined' && (e__default["default"].createElement("div", { className: "ods-badge__content ods-badge__count" }, countToShow)),
-        variation !== 'tiny' && typeof count === 'undefined' && children && (e__default["default"].createElement("div", { className: "ods-badge__content ods-badge__text" }, children)),
-        variation === 'tiny' && e__default["default"].createElement("div", { className: "ods-badge__content" })));
-});
-Badge.displayName = 'Badge';
-
 var CrossSellCard = e__default["default"].forwardRef(function (_a, ref) {
     var title = _a.title, className = _a.className, description = _a.description, imageSrc = _a.imageSrc, ctaText = _a.ctaText, ctaAction = _a.ctaAction, customIcon = _a.customIcon, rest = __rest$2(_a, ["title", "className", "description", "imageSrc", "ctaText", "ctaAction", "customIcon"]);
     return (e__default["default"].createElement("div", __assign$2({ ref: ref }, rest, { className: classNames('ods-cross-sell-card', className) }),
@@ -48390,6 +48419,7 @@ exports.Alert = Alert;
 exports.Badge = Badge;
 exports.Breadcrumb = Breadcrumb;
 exports.Button = Button$1;
+exports.CardGroup = CardGroup;
 exports.CardListItem = CardListItem;
 exports.Carousel = Carousel;
 exports.Chart = DoughnutChart;