@synerise/ds-broadcast-bar 1.1.15 → 1.1.16

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.1.16](https://github.com/Synerise/synerise-design/compare/@synerise/ds-broadcast-bar@1.1.15...@synerise/ds-broadcast-bar@1.1.16) (2026-03-24)
+
+**Note:** Version bump only for package @synerise/ds-broadcast-bar
+
 ## [1.1.15](https://github.com/Synerise/synerise-design/compare/@synerise/ds-broadcast-bar@1.1.14...@synerise/ds-broadcast-bar@1.1.15) (2026-03-20)
 
 **Note:** Version bump only for package @synerise/ds-broadcast-bar

package/dist/BroadcastBar.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import { type BroadcastBarProps } from './BroadcastBar.types';
+import { default as React } from 'react';
+import { BroadcastBarProps } from './BroadcastBar.types';
 declare const BroadcastBar: ({ customIcon, type, description, button, withClose, onCloseClick, }: BroadcastBarProps) => React.JSX.Element;
 export default BroadcastBar;

package/dist/BroadcastBar.js

@@ -1,18 +1,20 @@
-import React, { useMemo } from 'react';
-import Icon, { CloseM } from '@synerise/ds-icon';
-import * as S from './BroadcastBar.styles';
-import { DEFAULT_ICON, ICONS } from './constants';
-var BroadcastBar = function BroadcastBar(_ref) {
-  var customIcon = _ref.customIcon,
-    type = _ref.type,
-    description = _ref.description,
-    button = _ref.button,
-    withClose = _ref.withClose,
-    onCloseClick = _ref.onCloseClick;
-  var renderMessage = useMemo(function () {
-    return /*#__PURE__*/React.createElement(S.AlertContent, null, description && /*#__PURE__*/React.createElement(S.AlertDescription, null, description));
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import Icon, { CloseM } from "@synerise/ds-icon";
+import { AlertContent, AlertDescription, Container, WrapperBroadcastBar, AllContent, IconWrapper, ButtonWrapper, ButtonCloseWrapper, IconCloseWrapper } from "./BroadcastBar.styles.js";
+import { ICONS, DEFAULT_ICON } from "./constants.js";
+const BroadcastBar = ({
+  customIcon,
+  type,
+  description,
+  button,
+  withClose,
+  onCloseClick
+}) => {
+  const renderMessage = useMemo(() => {
+    return /* @__PURE__ */ jsx(AlertContent, { children: description && /* @__PURE__ */ jsx(AlertDescription, { children: description }) });
   }, [description]);
-  var renderIcon = useMemo(function () {
+  const renderIcon = useMemo(() => {
     if (customIcon) {
       return customIcon;
     }
@@ -21,26 +23,15 @@ var BroadcastBar = function BroadcastBar(_ref) {
     }
     return DEFAULT_ICON;
   }, [customIcon, type]);
-  return /*#__PURE__*/React.createElement(S.Container, {
-    close: withClose,
-    type: type
-  }, /*#__PURE__*/React.createElement(S.WrapperBroadcastBar, {
-    close: withClose,
-    type: type
-  }, /*#__PURE__*/React.createElement(S.AllContent, {
-    close: withClose,
-    type: type
-  }, /*#__PURE__*/React.createElement(S.IconWrapper, {
-    type: type
-  }, /*#__PURE__*/React.createElement(Icon, {
-    component: renderIcon
-  })), renderMessage, /*#__PURE__*/React.createElement(S.ButtonWrapper, {
-    type: type
-  }, button)), withClose && /*#__PURE__*/React.createElement(S.ButtonCloseWrapper, null, /*#__PURE__*/React.createElement(S.IconCloseWrapper, {
-    onClick: onCloseClick,
-    type: type
-  }, /*#__PURE__*/React.createElement(Icon, {
-    component: /*#__PURE__*/React.createElement(CloseM, null)
-  })))));
+  return /* @__PURE__ */ jsx(Container, { close: withClose, type, children: /* @__PURE__ */ jsxs(WrapperBroadcastBar, { close: withClose, type, children: [
+    /* @__PURE__ */ jsxs(AllContent, { close: withClose, type, children: [
+      /* @__PURE__ */ jsx(IconWrapper, { type, children: /* @__PURE__ */ jsx(Icon, { component: renderIcon }) }),
+      renderMessage,
+      /* @__PURE__ */ jsx(ButtonWrapper, { type, children: button })
+    ] }),
+    withClose && /* @__PURE__ */ jsx(ButtonCloseWrapper, { children: /* @__PURE__ */ jsx(IconCloseWrapper, { onClick: onCloseClick, type, children: /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(CloseM, {}) }) }) })
+  ] }) });
+};
+export {
+  BroadcastBar as default
 };
-export default BroadcastBar;

package/dist/BroadcastBar.styles.d.ts

@@ -1,29 +1,29 @@
-import { type ReactNode } from 'react';
-import { type BroadcastBarType } from './BroadcastBar.types';
-export declare const AlertContent: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const AllContent: import("styled-components").StyledComponent<"div", any, {
+import { ReactNode } from 'react';
+import { BroadcastBarType } from './BroadcastBar.types';
+export declare const AlertContent: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const AllContent: import('styled-components').StyledComponent<"div", any, {
     type?: BroadcastBarType;
     close?: boolean | ReactNode;
 }, never>;
-export declare const IconWrapper: import("styled-components").StyledComponent<"div", any, {
+export declare const IconWrapper: import('styled-components').StyledComponent<"div", any, {
     type?: BroadcastBarType;
 }, never>;
-export declare const IconCloseWrapper: import("styled-components").StyledComponent<"div", any, {
+export declare const IconCloseWrapper: import('styled-components').StyledComponent<"div", any, {
     type?: BroadcastBarType;
 }, never>;
-export declare const ButtonWrapper: import("styled-components").StyledComponent<"div", any, {
+export declare const ButtonWrapper: import('styled-components').StyledComponent<"div", any, {
     type?: BroadcastBarType;
 }, never>;
-export declare const ButtonCloseWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Wrapper: import("styled-components").StyledComponent<"div", any, {
+export declare const ButtonCloseWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const Wrapper: import('styled-components').StyledComponent<"div", any, {
     type?: BroadcastBarType;
 }, never>;
-export declare const Container: import("styled-components").StyledComponent<"div", any, {
+export declare const Container: import('styled-components').StyledComponent<"div", any, {
     type?: BroadcastBarType;
     close?: boolean;
 }, never>;
-export declare const WrapperBroadcastBar: import("styled-components").StyledComponent<"div", any, {
+export declare const WrapperBroadcastBar: import('styled-components').StyledComponent<"div", any, {
     type?: BroadcastBarType;
     close?: boolean;
 }, never>;
-export declare const AlertDescription: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const AlertDescription: import('styled-components').StyledComponent<"span", any, {}, never>;

package/dist/BroadcastBar.styles.js

@@ -1,74 +1,68 @@
-import styled, { css } from 'styled-components';
-var getColorBackground = function getColorBackground(props) {
-  if (props.type === 'warning') {
-    return props.theme.palette['yellow-600'];
+import styled, { css } from "styled-components";
+const getColorBackground = (props) => {
+  if (props.type === "warning") {
+    return props.theme.palette["yellow-600"];
   }
-  if (props.type === 'negative') {
-    return props.theme.palette['red-600'];
+  if (props.type === "negative") {
+    return props.theme.palette["red-600"];
   }
-  return props.theme.palette["green-600"];
+  return props.theme.palette[`green-600`];
 };
-var getColorIcon = function getColorIcon(props) {
-  if (props.type === 'warning') {
-    return props.theme.palette['grey-800'];
+const getColorIcon = (props) => {
+  if (props.type === "warning") {
+    return props.theme.palette["grey-800"];
   }
   return props.theme.palette.white;
 };
-export var AlertContent = styled.div.withConfig({
+const AlertContent = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__AlertContent",
   componentId: "sc-1wlkvzq-0"
 })(["display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 0;color:inherit;"]);
-export var AllContent = styled.div.withConfig({
+const AllContent = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__AllContent",
   componentId: "sc-1wlkvzq-1"
-})(["display:flex;", ";color:", ";"], function (props) {
-  return props.close && css(["position:absolute;left:50%;transform:translateX(-50%);"]);
-}, function (props) {
-  return getColorIcon(props);
-});
-export var IconWrapper = styled.div.withConfig({
+})(["display:flex;", ";color:", ";"], (props) => props.close && css(["position:absolute;left:50%;transform:translateX(-50%);"]), (props) => getColorIcon(props));
+const IconWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__IconWrapper",
   componentId: "sc-1wlkvzq-2"
-})(["margin:8px 12px;color:", ";"], function (props) {
-  return getColorIcon(props);
-});
-export var IconCloseWrapper = styled.div.withConfig({
+})(["margin:8px 12px;color:", ";"], (props) => getColorIcon(props));
+const IconCloseWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__IconCloseWrapper",
   componentId: "sc-1wlkvzq-3"
-})(["margin:3px 5px 2px;cursor:pointer;color:", ";"], function (props) {
-  return getColorIcon(props);
-});
-export var ButtonWrapper = styled.div.withConfig({
+})(["margin:3px 5px 2px;cursor:pointer;color:", ";"], (props) => getColorIcon(props));
+const ButtonWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__ButtonWrapper",
   componentId: "sc-1wlkvzq-4"
 })(["margin:6px 8px;border-radius:3px;display:flex;background-color:rgba(255,255,255,0.2);"]);
-export var ButtonCloseWrapper = styled.div.withConfig({
+const ButtonCloseWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__ButtonCloseWrapper",
   componentId: "sc-1wlkvzq-5"
 })(["margin:6px 8px;display:flex;"]);
-export var Wrapper = styled.div.withConfig({
+const Wrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__Wrapper",
   componentId: "sc-1wlkvzq-6"
-})(["margin-top:10px;color:", ";"], function (props) {
-  return getColorIcon(props);
-});
-export var Container = styled.div.withConfig({
+})(["margin-top:10px;color:", ";"], (props) => getColorIcon(props));
+const Container = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__Container",
   componentId: "sc-1wlkvzq-7"
-})(["width:100%;display:flex;justify-content:", ";position:relative;background-color:", ";"], function (props) {
-  return props.close ? 'space-between' : 'center';
-}, function (props) {
-  return getColorBackground(props);
-});
-export var WrapperBroadcastBar = styled.div.withConfig({
+})(["width:100%;display:flex;justify-content:", ";position:relative;background-color:", ";"], (props) => props.close ? "space-between" : "center", (props) => getColorBackground(props));
+const WrapperBroadcastBar = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BroadcastBarstyles__WrapperBroadcastBar",
   componentId: "sc-1wlkvzq-8"
-})(["font-size:13px;", ";color:", ";"], function (props) {
-  return props.close && css(["margin-left:auto;"]);
-}, function (props) {
-  return getColorIcon(props);
-});
-export var AlertDescription = styled.span.withConfig({
+})(["font-size:13px;", ";color:", ";"], (props) => props.close && css(["margin-left:auto;"]), (props) => getColorIcon(props));
+const AlertDescription = /* @__PURE__ */ styled.span.withConfig({
   displayName: "BroadcastBarstyles__AlertDescription",
   componentId: "sc-1wlkvzq-9"
-})(["display:flex;max-width:800px;white-space:normal;font-size:13px;line-height:1.39;font-weight:500;color:inherit;"]);
+})(["display:flex;max-width:800px;white-space:normal;font-size:13px;line-height:1.39;font-weight:500;color:inherit;"]);
+export {
+  AlertContent,
+  AlertDescription,
+  AllContent,
+  ButtonCloseWrapper,
+  ButtonWrapper,
+  Container,
+  IconCloseWrapper,
+  IconWrapper,
+  Wrapper,
+  WrapperBroadcastBar
+};

package/dist/BroadcastBar.types.d.ts

@@ -1,4 +1,4 @@
-import { type ReactNode } from 'react';
+import { ReactNode } from 'react';
 export type BroadcastBarType = 'success' | 'warning' | 'negative';
 export type BroadcastBarProps = {
     type: BroadcastBarType;

package/dist/BroadcastBar.types.js

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

package/dist/constants.d.ts

@@ -1,4 +1,4 @@
-import React, { type ReactNode } from 'react';
-import { type BroadcastBarType } from './BroadcastBar.types';
+import { default as React, ReactNode } from 'react';
+import { BroadcastBarType } from './BroadcastBar.types';
 export declare const ICONS: Record<BroadcastBarType, ReactNode>;
 export declare const DEFAULT_ICON: React.JSX.Element;

package/dist/constants.js

@@ -1,8 +1,12 @@
-import React from 'react';
-import { Check3M, ErrorFillM, WarningFillM } from '@synerise/ds-icon';
-export var ICONS = {
-  success: /*#__PURE__*/React.createElement(Check3M, null),
-  warning: /*#__PURE__*/React.createElement(WarningFillM, null),
-  negative: /*#__PURE__*/React.createElement(ErrorFillM, null)
+import { jsx } from "react/jsx-runtime";
+import { WarningFillM, ErrorFillM, Check3M } from "@synerise/ds-icon";
+const ICONS = {
+  success: /* @__PURE__ */ jsx(Check3M, {}),
+  warning: /* @__PURE__ */ jsx(WarningFillM, {}),
+  negative: /* @__PURE__ */ jsx(ErrorFillM, {})
+};
+const DEFAULT_ICON = /* @__PURE__ */ jsx(WarningFillM, {});
+export {
+  DEFAULT_ICON,
+  ICONS
 };
-export var DEFAULT_ICON = /*#__PURE__*/React.createElement(WarningFillM, null);

package/dist/index.js

@@ -1 +1,4 @@
-export { default } from './BroadcastBar';
+import { default as default2 } from "./BroadcastBar.js";
+export {
+  default2 as default
+};

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-broadcast-bar",
-  "version": "1.1.15",
+  "version": "1.1.16",
   "description": "BroadcastBar 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",
@@ -34,7 +34,7 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-icon": "^1.15.0"
+    "@synerise/ds-icon": "^1.15.1"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
@@ -42,5 +42,5 @@
     "styled-components": "^5.3.3",
     "vitest": "4"
   },
-  "gitHead": "8efc031fa688c0b87c7b3915bae93546bb63bcac"
+  "gitHead": "e4ecca8944fc9b41c1b9d59c8bcad5e5e2013225"
 }