@useblu/ocean-react 1.57.0 → 1.58.0

package/Alert/Alert.d.ts

@@ -3,11 +3,17 @@ export declare type AlertProps = {
     type?: 'success' | 'warning' | 'error' | 'default';
     title?: string;
     icon?: React.ReactElement;
+    size?: 'short' | 'long';
+    button?: string;
+    buttonAction?: () => void;
 } & React.ComponentPropsWithoutRef<'div'>;
 declare const Alert: React.ForwardRefExoticComponent<{
     type?: "success" | "warning" | "error" | "default" | undefined;
     title?: string | undefined;
     icon?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
+    size?: "short" | "long" | undefined;
+    button?: string | undefined;
+    buttonAction?: (() => void) | undefined;
 } & Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
 export default Alert;
 //# sourceMappingURL=Alert.d.ts.map

package/Alert/Alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../src/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,oBAAY,UAAU,GAAG;IAKvB,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IAInD,KAAK,CAAC,EAAE,MAAM,CAAC;IAIf,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;CAC3B,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAE1C,QAAA,MAAM,KAAK;;;;kLA4BV,CAAC;AAIF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../src/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,oBAAY,UAAU,GAAG;IAKvB,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IAInD,KAAK,CAAC,EAAE,MAAM,CAAC;IAIf,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAI1B,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAIxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAIhB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAE1C,QAAA,MAAM,KAAK;;;;;;0BAHY,IAAI;kLAqF1B,CAAC;AAIF,eAAe,KAAK,CAAC"}

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.58.0](https://github.com/ocean-ds/ocean-web/compare/v1.57.1...v1.58.0) (2024-05-15)
+
+### Features
+
+- alert button ([#1099](https://github.com/ocean-ds/ocean-web/issues/1099)) ([425e015](https://github.com/ocean-ds/ocean-web/commit/425e01503db7be486b9dbb0d43c631a891aca799))
+
 # [1.57.0](https://github.com/ocean-ds/ocean-web/compare/v1.56.0...v1.57.0) (2024-04-18)
 
 ### Features

package/index.es.js

@@ -1,4 +1,4 @@
-import e, { Children, useState, useCallback, useEffect, forwardRef, useContext, useMemo, useRef, useLayoutEffect, createContext as createContext$1 } from 'react';
+import e, { forwardRef, Children, useState, useCallback, useEffect, useContext, useMemo, useRef, useLayoutEffect, createContext as createContext$1 } from 'react';
 import require$$1 from 'react-dom';
 
 /*! *****************************************************************************
@@ -321,17 +321,6 @@ var AlertIcon = e.memo(function (_a) {
 });
 AlertIcon.displayName = 'AlertIcon';
 
-var Alert = e.forwardRef(function (_a, ref) {
-    var children = _a.children, _b = _a.type, type = _b === void 0 ? 'default' : _b, title = _a.title, className = _a.className, icon = _a.icon, rest = __rest$1(_a, ["children", "type", "title", "className", "icon"]);
-    var alertIcon = e.createElement(AlertIcon, { type: type, icon: icon });
-    return (e.createElement("div", __assign$1({ ref: ref, role: "alert", className: classNames('ods-alert', "ods-alert--".concat(type), title && 'ods-alert--has-header', className) }, rest),
-        title ? (e.createElement("div", { className: "ods-alert__header" },
-            alertIcon,
-            e.createElement("div", { className: "ods-alert__title" }, title))) : (alertIcon),
-        e.createElement("div", { className: "ods-alert__content" }, children)));
-});
-Alert.displayName = 'Alert';
-
 var IconSm = function () { return (e.createElement("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
     e.createElement("circle", { opacity: "0.4", cx: "8", cy: "8", r: "6", stroke: "#B8C3FF", strokeWidth: "4" }),
     e.createElement("path", { d: "M8 2C8.78793 2 9.56815 2.15519 10.2961 2.45672C11.0241 2.75825 11.6855 3.20021 12.2426 3.75736C12.7998 4.31451 13.2417 4.97595 13.5433 5.7039C13.8448 6.43185 14 7.21207 14 8", stroke: "#0025E0", strokeWidth: "4", strokeLinecap: "round", strokeLinejoin: "round" }))); };
@@ -364,6 +353,50 @@ function ButtonBase(_a, ref) {
 }
 var Button$1 = e.forwardRef(ButtonBase);
 
+var mapIconsByType = {
+    linkChevron: ee,
+    externalLink: Qe
+};
+var LinkIcons = e.memo(function (_a) {
+    var icon = _a.icon;
+    if (icon) {
+        var IconElement = mapIconsByType[icon];
+        return (e.createElement(IconElement, { size: 16, className: "ods-link__icon", "aria-hidden": true, focusable: false, "data-testid": "link-icon" }));
+    }
+    return e.createElement(e.Fragment, null);
+});
+LinkIcons.displayName = 'LinkIcons';
+
+var Link = forwardRef(function (_a, ref) {
+    var children = _a.children, className = _a.className, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b, _c = _a.size, size = _c === void 0 ? 'md' : _c, icon = _a.icon, rest = __rest$1(_a, ["children", "className", "variant", "size", "icon"]);
+    return (e.createElement("a", __assign$1({ ref: ref, className: classNames('ods-link', "ods-link--".concat(size), "ods-link--".concat(variant), icon ? 'ods-link--with-icon' : '', className) }, rest),
+        e.createElement("span", { className: "ods-link__content" }, children),
+        e.createElement(LinkIcons, { icon: icon })));
+});
+Link.displayName = 'Link';
+
+var Alert = e.forwardRef(function (_a, ref) {
+    var children = _a.children, _b = _a.type, type = _b === void 0 ? 'default' : _b, title = _a.title, className = _a.className, icon = _a.icon, _c = _a.size, size = _c === void 0 ? 'long' : _c, button = _a.button, buttonAction = _a.buttonAction, rest = __rest$1(_a, ["children", "type", "title", "className", "icon", "size", "button", "buttonAction"]);
+    var alertIcon = e.createElement(AlertIcon, { type: type, icon: icon });
+    var longSize = size === 'long' && !button;
+    var marginHeader = longSize && children && title;
+    return (e.createElement("div", __assign$1({ ref: ref, role: "alert", className: classNames('ods-alert', "ods-alert--".concat(type), longSize && 'ods-alert--long', className) }, rest), longSize ? (e.createElement(e.Fragment, null,
+        e.createElement("div", { className: classNames('ods-alert__header', marginHeader && 'ods-alert__header--margin') },
+            alertIcon,
+            title ? (e.createElement("div", { className: "ods-alert__title" }, title)) : (e.createElement("div", { className: "alert__content" }, children))),
+        title && e.createElement("div", { className: "alert__content" }, children))) : (e.createElement(e.Fragment, null,
+        e.createElement("div", { className: classNames('ods-alert__header', marginHeader && 'ods-alert__header--margin') },
+            alertIcon,
+            e.createElement("div", { className: "ods-alert__text" },
+                title && e.createElement("div", { className: "ods-alert__title" }, title),
+                e.createElement("div", { className: "alert__content" }, children)),
+            button && (e.createElement("div", { className: "ods-alert__button" },
+                e.createElement(Button$1, { size: "sm", onClick: buttonAction }, button)))),
+        button && (e.createElement("div", { className: "ods-alert__button--mobile" },
+            e.createElement(Link, { size: "sm", onClick: buttonAction, icon: "externalLink" }, button)))))));
+});
+Alert.displayName = 'Alert';
+
 var lib$1 = {};
 
 var slider = {};
@@ -5058,28 +5091,6 @@ var Radio = e.forwardRef(function (_a, ref) {
 });
 Radio.displayName = 'Radio';
 
-var mapIconsByType = {
-    linkChevron: ee,
-    externalLink: Qe
-};
-var LinkIcons = e.memo(function (_a) {
-    var icon = _a.icon;
-    if (icon) {
-        var IconElement = mapIconsByType[icon];
-        return (e.createElement(IconElement, { size: 16, className: "ods-link__icon", "aria-hidden": true, focusable: false, "data-testid": "link-icon" }));
-    }
-    return e.createElement(e.Fragment, null);
-});
-LinkIcons.displayName = 'LinkIcons';
-
-var Link = forwardRef(function (_a, ref) {
-    var children = _a.children, className = _a.className, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b, _c = _a.size, size = _c === void 0 ? 'md' : _c, icon = _a.icon, rest = __rest$1(_a, ["children", "className", "variant", "size", "icon"]);
-    return (e.createElement("a", __assign$1({ ref: ref, className: classNames('ods-link', "ods-link--".concat(size), "ods-link--".concat(variant), icon ? 'ods-link--with-icon' : '', className) }, rest),
-        e.createElement("span", { className: "ods-link__content" }, children),
-        e.createElement(LinkIcons, { icon: icon })));
-});
-Link.displayName = 'Link';
-
 var TextArea = e.forwardRef(function (_a, ref) {
     var className = _a.className, label = _a.label, placeholder = _a.placeholder, helperText = _a.helperText, error = _a.error, id = _a.id, disabled = _a.disabled, onChange = _a.onChange, value = _a.value, defaultValue = _a.defaultValue, rest = __rest$1(_a, ["className", "label", "placeholder", "helperText", "error", "id", "disabled", "onChange", "value", "defaultValue"]);
     var _b = useInputFilled({