@synerise/ds-alert 1.1.44 → 1.1.46

package/dist/Toast/Toast.styles.js

@@ -1,173 +1,139 @@
-import 'animate.css';
-import styled, { keyframes } from 'styled-components';
-import { UnorderedList } from '@synerise/ds-unordered-list/dist/Unordered-list.styles';
-import { hexToRgba } from '@synerise/ds-utils';
-var getWidth = function getWidth(hasClose, hasExpander) {
+import "animate.css";
+import styled, { keyframes } from "styled-components";
+import { UnorderedList } from "@synerise/ds-unordered-list/dist/Unordered-list.styles";
+import { hexToRgba } from "@synerise/ds-utils";
+const getWidth = (hasClose, hasExpander) => {
   if (hasClose && hasExpander) {
-    return '72px';
+    return "72px";
   }
   if (hasClose || hasExpander) {
-    return '48px';
+    return "48px";
   }
-  return '24px';
+  return "24px";
 };
-var getColorIcon = function getColorIcon(props) {
+const getColorIcon = (props) => {
   switch (props.colorIcon) {
-    case 'white':
+    case "white":
       return props.theme.palette.white;
-    case 'grey':
-      return props.theme.palette['grey-600'];
-    case 'black':
-      return props.theme.palette['grey-800'];
+    case "grey":
+      return props.theme.palette["grey-600"];
+    case "black":
+      return props.theme.palette["grey-800"];
     default:
-      return props.theme.palette['blue-600'];
+      return props.theme.palette["blue-600"];
   }
 };
-var getColorText = function getColorText(props) {
+const getColorText = (props) => {
   switch (props.color) {
-    case 'red':
+    case "red":
       return props.theme.palette.white;
-    case 'green':
+    case "green":
       return props.theme.palette.white;
-    case 'yellow':
-      return props.theme.palette['grey-800'];
+    case "yellow":
+      return props.theme.palette["grey-800"];
     default:
-      return props.theme.palette['grey-600'];
+      return props.theme.palette["grey-600"];
   }
 };
-var getColorBackground = function getColorBackground(props) {
+const getColorBackground = (props) => {
   switch (props.color) {
-    case 'grey':
+    case "grey":
       return props.theme.palette.white;
-    case 'blue':
-      return props.theme.palette['blue-050'];
-    case 'red':
-      return props.theme.palette['red-500'];
+    case "blue":
+      return props.theme.palette["blue-050"];
+    case "red":
+      return props.theme.palette["red-500"];
     default:
-      return props.theme.palette[props.color + "-600"];
+      return props.theme.palette[`${props.color}-600`];
   }
 };
-var openingAnimation = function openingAnimation() {
-  return keyframes(["0%{height:0%;opacity:0;}100%{height:100%;opacity:1;}"]);
-};
-export var closingAnimation = function closingAnimation() {
-  return keyframes(["0%{height:100%;opacity:1;}100%{height:0%;opacity:0;}"]);
-};
-export var AlertContent = styled.div.withConfig({
+const openingAnimation = () => keyframes(["0%{height:0%;opacity:0;}100%{height:100%;opacity:1;}"]);
+const closingAnimation = () => keyframes(["0%{height:100%;opacity:1;}100%{height:0%;opacity:0;}"]);
+const AlertContent = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__AlertContent",
   componentId: "sc-q5tn0-0"
-})(["display:flex;flex-direction:column;align-items:flex-start;justify-content:center;margin-right:24px;", " ", "{margin-bottom:8px;}"], function (props) {
-  return props.hasBottomMargin && 'margin-bottom:16px;';
-}, UnorderedList);
-export var AllContent = styled.div.withConfig({
+})(["display:flex;flex-direction:column;align-items:flex-start;justify-content:center;margin-right:24px;", " ", "{margin-bottom:8px;}"], (props) => props.hasBottomMargin && "margin-bottom:16px;", UnorderedList);
+const AllContent = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__AllContent",
   componentId: "sc-q5tn0-1"
 })(["display:flex;color:inherit;"]);
-export var IconWrapper = styled.div.withConfig({
+const IconWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__IconWrapper",
   componentId: "sc-q5tn0-2"
-})(["margin:12px;display:flex;svg{color:", ";fill:", ";}"], function (props) {
-  return props.customColorIcon ? props.theme.palette[props.customColorIcon + "-600"] : getColorIcon(props);
-}, function (props) {
-  return props.customColorIcon ? props.theme.palette[props.customColorIcon + "-600"] : getColorIcon(props);
-});
-export var IconCloseWrapper = styled.div.withConfig({
+})(["margin:12px;display:flex;svg{color:", ";fill:", ";}"], (props) => props.customColorIcon ? props.theme.palette[`${props.customColorIcon}-600`] : getColorIcon(props), (props) => props.customColorIcon ? props.theme.palette[`${props.customColorIcon}-600`] : getColorIcon(props));
+const IconCloseWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__IconCloseWrapper",
   componentId: "sc-q5tn0-3"
-})(["cursor:pointer;svg{fill:", ";}"], function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-});
-export var IconExpanderWrapper = styled.div.withConfig({
+})(["cursor:pointer;svg{fill:", ";}"], (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props));
+const IconExpanderWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__IconExpanderWrapper",
   componentId: "sc-q5tn0-4"
-})(["cursor:pointer;svg{fill:", ";transition:transform 0.1s linear;transform:rotateZ(", ");}"], function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-}, function (props) {
-  return props.expanded ? '180deg' : '0deg';
-});
-export var ButtonWrapper = styled.div.withConfig({
+})(["cursor:pointer;svg{fill:", ";transition:transform 0.1s linear;transform:rotateZ(", ");}"], (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props), (props) => props.expanded ? "180deg" : "0deg");
+const ButtonWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__ButtonWrapper",
   componentId: "sc-q5tn0-5"
 })(["position:absolute;right:12px;top:12px;display:flex;"]);
-export var FirstButtonWrapper = styled.div.withConfig({
+const FirstButtonWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__FirstButtonWrapper",
   componentId: "sc-q5tn0-6"
 })(["margin-right:8px;"]);
-export var NumberWrapper = styled.div.withConfig({
+const NumberWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__NumberWrapper",
   componentId: "sc-q5tn0-7"
-})(["margin-left:4px;color:inherit;opacity:0.6;cursor:pointer;&:hover{background-image:linear-gradient( to right,", " 20%,rgba(255,255,255,0) 10% );background-color:transparent;background-position:bottom left;background-size:5px 1px;background-repeat:repeat-x;opacity:1;color:", ";}"], function (props) {
-  return props.theme.palette['grey-400'];
-}, function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-});
-export var ListWrapper = styled.div.withConfig({
+})(["margin-left:4px;color:inherit;opacity:0.6;cursor:pointer;&:hover{background-image:linear-gradient( to right,", " 20%,rgba(255,255,255,0) 10% );background-color:transparent;background-position:bottom left;background-size:5px 1px;background-repeat:repeat-x;opacity:1;color:", ";}"], (props) => props.theme.palette["grey-400"], (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props));
+const ListWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__ListWrapper",
   componentId: "sc-q5tn0-8"
-})(["display:flex;visibility:", ";height:", ";margin-top:", ";"], function (props) {
-  return props.visible ? 'visible' : 'hidden';
-}, function (props) {
-  return props.visible ? 'auto' : '0';
-}, function (props) {
-  return !props.description && props.visible ? '10px' : '0';
-});
-export var IconOrderWrapper = styled.div.withConfig({
+})(["display:flex;visibility:", ";height:", ";margin-top:", ";"], (props) => props.visible ? "visible" : "hidden", (props) => props.visible ? "auto" : "0", (props) => !props.description && props.visible ? "10px" : "0");
+const IconOrderWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__IconOrderWrapper",
   componentId: "sc-q5tn0-9"
-})(["visibility:hidden;margin:-4px 0;svg{fill:", ";}&:hover{svg{fill:", ";cursor:pointer;}}"], function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-}, function (props) {
-  return props.theme.palette['blue-600'];
-});
-export var OrderWrapper = styled.div.withConfig({
+})(["visibility:hidden;margin:-4px 0;svg{fill:", ";}&:hover{svg{fill:", ";cursor:pointer;}}"], (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props), (props) => props.theme.palette["blue-600"]);
+const OrderWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__OrderWrapper",
   componentId: "sc-q5tn0-10"
-})(["display:flex;color:", ";&:hover{", "{visibility:visible;}", "{background-image:linear-gradient( to right,", " 20%,rgba(255,255,255,0) 10% );background-color:transparent;background-position:bottom left;background-size:5px 1px;background-repeat:repeat-x;opacity:1;color:", ";}}"], function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-}, IconOrderWrapper, NumberWrapper, function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-}, function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-});
-export var Wrapper = styled.div.withConfig({
+})(["display:flex;color:", ";&:hover{", "{visibility:visible;}", "{background-image:linear-gradient( to right,", " 20%,rgba(255,255,255,0) 10% );background-color:transparent;background-position:bottom left;background-size:5px 1px;background-repeat:repeat-x;opacity:1;color:", ";}}"], (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props), IconOrderWrapper, NumberWrapper, (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props), (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props));
+const Wrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__Wrapper",
   componentId: "sc-q5tn0-11"
-})(["color:", ";"], function (props) {
-  return props.theme.palette['grey-050'];
-});
-export var AnimationContainer = styled.div.withConfig({
+})(["color:", ";"], (props) => props.theme.palette["grey-050"]);
+const AnimationContainer = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__AnimationContainer",
   componentId: "sc-q5tn0-12"
-})(["animation:", " 0.5s ease-in-out 0s 1;"], function (props) {
-  return props.show ? openingAnimation() : closingAnimation();
-});
-export var Container = styled.div.withConfig({
+})(["animation:", " 0.5s ease-in-out 0s 1;"], (props) => props.show ? openingAnimation() : closingAnimation());
+const Container = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__Container",
   componentId: "sc-q5tn0-13"
-})(["display:flex;flex-direction:row;max-width:500px;align-items:flex-start;justify-content:center;background-color:", ";border-radius:4px;box-shadow:", ";"], function (props) {
-  return props.customColor ? props.theme.palette[props.customColor + "-600"] : getColorBackground(props);
-}, function (props) {
-  return props.color ? "0px 16px 32px 5px " + hexToRgba(props.theme.palette['grey-900'], 0.2) : 'none';
-});
-export var WrapperSectionMessage = styled.div.withConfig({
+})(["display:flex;flex-direction:row;max-width:500px;align-items:flex-start;justify-content:center;background-color:", ";border-radius:4px;box-shadow:", ";"], (props) => props.customColor ? props.theme.palette[`${props.customColor}-600`] : getColorBackground(props), (props) => props.color ? `0px 16px 32px 5px ${hexToRgba(props.theme.palette["grey-900"], 0.2)}` : "none");
+const WrapperSectionMessage = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__WrapperSectionMessage",
   componentId: "sc-q5tn0-14"
 })(["position:relative;font-size:13px;min-width:0;color:inherit;"]);
-export var AlertMessage = styled.div.withConfig({
+const AlertMessage = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__AlertMessage",
   componentId: "sc-q5tn0-15"
-})(["font-size:14px;line-height:20px;padding-top:14px;", ";font-weight:500;overflow:hidden;overflow-wrap:break-word;text-overflow:ellipsis;padding-right:", ";color:", ";"], function (props) {
-  return props.noToastContent && 'padding-bottom: 14px;';
-}, function (props) {
-  return getWidth(props.hasClose, props.hasExpander);
-}, function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-});
-export var AlertDescription = styled.div.withConfig({
+})(["font-size:14px;line-height:20px;padding-top:14px;", ";font-weight:500;overflow:hidden;overflow-wrap:break-word;text-overflow:ellipsis;padding-right:", ";color:", ";"], (props) => props.noToastContent && "padding-bottom: 14px;", (props) => getWidth(props.hasClose, props.hasExpander), (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props));
+const AlertDescription = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Toaststyles__AlertDescription",
   componentId: "sc-q5tn0-16"
-})(["font-size:13px;line-height:1.39;font-weight:normal;overflow:hidden;overflow-wrap:anywhere;text-overflow:ellipsis;padding-bottom:", ";margin-top:2px;color:", ";"], function (props) {
-  return props.button || props.expandedContent ? '16px' : '0';
-}, function (props) {
-  return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
-});
+})(["font-size:13px;line-height:1.39;font-weight:normal;overflow:hidden;overflow-wrap:anywhere;text-overflow:ellipsis;padding-bottom:", ";margin-top:2px;color:", ";"], (props) => props.button || props.expandedContent ? "16px" : "0", (props) => props.customColorText ? props.theme.palette[`${props.customColorText}-600`] : getColorText(props));
+export {
+  AlertContent,
+  AlertDescription,
+  AlertMessage,
+  AllContent,
+  AnimationContainer,
+  ButtonWrapper,
+  Container,
+  FirstButtonWrapper,
+  IconCloseWrapper,
+  IconExpanderWrapper,
+  IconOrderWrapper,
+  IconWrapper,
+  ListWrapper,
+  NumberWrapper,
+  OrderWrapper,
+  Wrapper,
+  WrapperSectionMessage,
+  closingAnimation
+};

package/dist/Toast/Toast.types.d.ts

@@ -1,5 +1,5 @@
-import { type AlertProps } from 'antd/lib/alert';
-import { type ReactElement, type ReactNode } from 'react';
+import { AlertProps } from 'antd/lib/alert';
+import { ReactElement, ReactNode } from 'react';
 export type ToastType = 'success' | 'warning' | 'negative' | 'informative' | 'neutral';
 export type CustomColorType = 'blue' | 'grey' | 'red' | 'green' | 'yellow' | 'pink' | 'mars' | 'orange' | 'fern' | 'cyan' | 'purple' | 'violet';
 export type ColorType = 'grey' | 'red' | 'green' | 'yellow' | 'blue';

package/dist/Toast/Toast.types.js

@@ -1 +1 @@
-export {};
+

package/dist/index.js

@@ -1,20 +1,25 @@
-import * as MainAlertStyles from './Alert.styles';
-import * as ToastStyles from './Toast/Toast.styles';
-export { default } from './Alert';
-export var AlertStyles = {
-  Alert: MainAlertStyles,
-  Toast: ToastStyles
+import * as Alert_styles from "./Alert.styles.js";
+import { AlertMessage } from "./Alert.styles.js";
+import * as Toast_Toast_styles from "./Toast/Toast.styles.js";
+import { default as default2 } from "./Alert.js";
+import { default as default3 } from "@synerise/ds-section-message";
+import { default as default4 } from "./Toast/Toast.js";
+import { default as default5 } from "@synerise/ds-broadcast-bar";
+import { default as default6 } from "@synerise/ds-inline-alert";
+import { default as default7 } from "./InlineAlert/InlineAlert.js";
+import { default as default8 } from "./AlertInfo/AlertInfo.js";
+const AlertStyles = {
+  Alert: Alert_styles,
+  Toast: Toast_Toast_styles
+};
+export {
+  default8 as AlertInfo,
+  AlertMessage,
+  AlertStyles,
+  default5 as BroadcastBar,
+  default6 as IconAlert,
+  default7 as InlineAlert,
+  default3 as SectionMessage,
+  default4 as Toast,
+  default2 as default
 };
-
-/** @deprecated use `@synerise/ds-section-message` instead */
-export { default as SectionMessage } from './SectionMessage/SectionMessage';
-export { default as Toast } from './Toast/Toast';
-/** @deprecated - use Broadcast-Bar instead */
-export { default as BroadcastBar } from './BroadcastBar/BroadcastBar';
-
-/** @deprecated use `@synerise/ds-inline-alert` instead */
-export { default as IconAlert } from './IconAlert/IconAlert';
-export { default as InlineAlert } from './InlineAlert/InlineAlert';
-export { default as AlertInfo } from './AlertInfo/AlertInfo';
-// @deprecated use AlertStyles.Alert instead
-export { AlertMessage } from './Alert.styles';

package/dist/modules.d.js

@@ -1 +1 @@
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-alert",
-  "version": "1.1.44",
+  "version": "1.1.46",
   "description": "Alert UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -16,10 +16,10 @@
     "access": "public"
   },
   "scripts": {
-    "build": "pnpm run build:js && pnpm run build:css && pnpm run defs",
+    "build": "vite build",
     "build:css": "node ../../../scripts/style/less.js",
     "build:js": "babel --delete-dir-on-start --root-mode upward src --out-dir dist --extensions '.js,.ts,.tsx'",
-    "build:watch": "pnpm run build:js -- --watch",
+    "build:watch": "vite build --watch",
     "defs": "tsc --declaration --outDir dist/ --emitDeclarationOnly",
     "pack:ci": "pnpm pack --pack-destination ../../storybook/storybook-static/static",
     "prepublish": "pnpm run build",
@@ -35,13 +35,13 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-broadcast-bar": "^1.1.15",
-    "@synerise/ds-button": "^1.5.17",
-    "@synerise/ds-icon": "^1.15.0",
-    "@synerise/ds-inline-alert": "^1.1.14",
-    "@synerise/ds-section-message": "^1.0.25",
-    "@synerise/ds-unordered-list": "^1.1.39",
-    "@synerise/ds-utils": "^1.7.0",
+    "@synerise/ds-broadcast-bar": "^1.1.17",
+    "@synerise/ds-button": "^1.5.19",
+    "@synerise/ds-icon": "^1.15.2",
+    "@synerise/ds-inline-alert": "^1.1.16",
+    "@synerise/ds-section-message": "^1.0.27",
+    "@synerise/ds-unordered-list": "^1.1.41",
+    "@synerise/ds-utils": "^1.7.1",
     "animate.css": "^4.1.1"
   },
   "peerDependencies": {
@@ -50,5 +50,5 @@
     "react": ">=16.9.0 <= 18.3.1",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "8efc031fa688c0b87c7b3915bae93546bb63bcac"
+  "gitHead": "c2384982c3533a31eb5e5e0408f8dcecb2b0f399"
 }