@hortiview/shared-components 2.26.1 → 2.26.3

package/CHANGELOG.md

@@ -1,19 +1,16 @@
-## [2.26.1](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.26.0...v2.26.1) (2026-05-22)
-
-### Bug Fixes
-
-* add permission provider to broken stories ([6677f7f](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/6677f7fb9cfc4b5e256ea16fce429b95348f55d0))
-* add workaround for element bug on textKey = 'value' and multiSelect = true ([4926a72](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/4926a726b75b422f6f7bd8cacf71b86565d32b14))
-* fix search functionality on multi select component ([5a01163](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/5a011636eeef5c5296d2959a1307425256fed706))
+## [2.26.3](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.26.2...v2.26.3) (2026-05-26)
 
 ### Code Refactoring
 
-* improve title and label of FormSelect story ([29d6f78](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/29d6f780eefce628d459af1d7773b79a0af553dd))
+* rename data-testid attributes in TopBarBanner ([7288027](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/728802796388639b5bd2c8bf3c36b0a914c04626))
+* rename ErrorBanner to TopBarBanner + add icon property ([a1ea6cb](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/a1ea6cb98ce6f84172835eeb79c8829bd354d2f5))
+* simplify border properties in standaloneBorder class ([b8fab48](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/b8fab48e5f02412c4769d13d68f5bab136e844d6))
 
-### Styles
+## [2.26.2](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.26.1...v2.26.2) (2026-05-26)
 
-* improve positioning of search cursor in multi select ([d71bff9](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/d71bff9f3abda3a3a3466bb16850b67f3aa11bfc))
-* improve stories by adding width ([de089f8](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/de089f84d720f6bd47b1b22900259f007d6b1a1e))
+### Code Refactoring
+
+* adjust BlockView size props, minor styling achanges ([c2dca99](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/c2dca9979c41025c00a14330094aea081cc44c23)), closes [#20844](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/issues/20844)
 
 ## [2.26.1](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.26.0...v2.26.1) (2026-05-22)
 

package/dist/assets/BlockView.css

@@ -1 +1 @@
-._grid_gfk3g_1{display:flex;padding-bottom:0;flex-direction:column;justify-content:center;align-items:center;gap:1rem;align-self:stretch}._blockLayout_gfk3g_11{padding:.5rem;gap:.5rem;display:flex;flex-direction:column;border-radius:.5rem;background:var(--lmnt-theme-secondary-100);width:15rem;height:15rem}._blockRow_gfk3g_22{display:flex;flex-direction:row;gap:.5rem;height:100%;align-self:stretch}._block_gfk3g_11{flex:auto;border-radius:.25rem;background:var(--lmnt-theme-secondary);align-items:center;display:flex;justify-content:center;position:relative}._block_gfk3g_11._active_gfk3g_41{background:var(--lmnt-theme-primary);margin:-2px}._block_gfk3g_11._error_gfk3g_46{border:2px solid var(--lmnt-theme-danger);background:var(--lmnt-theme-danger-50);margin:-2px}._block_gfk3g_11._empty_gfk3g_52{background:var(--lmnt-theme-secondary-200);cursor:default}._activeBlock_gfk3g_57{background:var(--lmnt-theme-primary)}._block_gfk3g_11._clickable_gfk3g_61{cursor:pointer}._blockText_gfk3g_65{display:flex;justify-content:center;position:absolute;width:1vw;height:1vh;align-items:center;color:var(--lmnt-theme-on-primary)}._emptyLayout_gfk3g_75{display:flex;justify-content:center;align-items:center;background:var(--lmnt-theme-surface-variant);border-radius:.5rem}
+._grid_otqrz_1{display:flex;padding-bottom:0;flex-direction:column;justify-content:center;align-items:center;gap:1rem;align-self:stretch;height:100%}._blockLayout_otqrz_13{padding:.5rem;gap:.5rem;display:flex;flex-direction:column;border-radius:.5rem;background:var(--lmnt-theme-secondary-100)}._absoluteSize_otqrz_22{height:15rem;width:15rem}._relativeSize_otqrz_27{height:70%;width:50%;max-height:50vh;max-width:50vw;min-height:10rem;min-width:10rem}._relativeSize_otqrz_27._mobile_otqrz_38{height:70%;width:60%;max-height:50vh;max-width:75vw}._blockRow_otqrz_46{display:flex;flex-direction:row;gap:.5rem;height:100%;align-self:stretch}._block_otqrz_13{flex:auto;justify-content:center;border-radius:.25rem;background:var(--lmnt-theme-secondary);align-items:center;display:flex;position:relative;-webkit-tap-highlight-color:transparent;transition:background .2s ease-in-out,box-shadow .2s ease-in-out,transform .2s ease-in-out}._block_otqrz_13._clickable_otqrz_70{cursor:pointer}._block_otqrz_13._empty_otqrz_74{background:var(--lmnt-theme-secondary-200);cursor:default}._block_otqrz_13._active_otqrz_79{background:var(--lmnt-theme-primary)}._block_otqrz_13._error_otqrz_83{box-shadow:inset 0 0 0 3px var(--lmnt-theme-danger)}._block_otqrz_13._hoverEffects_otqrz_87._active_otqrz_79:hover{background:var(--lmnt-theme-primary-600)}._block_otqrz_13._hoverEffects_otqrz_87._clickable_otqrz_70:hover:not(._active_otqrz_79){background:var(--lmnt-theme-secondary-500)}._block_otqrz_13._hoverEffects_otqrz_87._clickable_otqrz_70:hover{transform:scale(1.02)}._blockText_otqrz_99{display:flex;justify-content:center;position:absolute;width:1vw;height:1vh;align-items:center;color:var(--lmnt-theme-on-primary)}._emptyLayout_otqrz_109{display:flex;justify-content:center;align-items:center;background:var(--lmnt-theme-surface-variant);border-radius:.5rem}

package/dist/assets/TopBarBanner.css

@@ -0,0 +1 @@
+._bannerPadding_1ijh0_1{width:100%;box-sizing:border-box;background-color:var(--lmnt-theme-secondary-50)}._bottomBorder_1ijh0_7{border-top:1px solid var(--lmnt-theme-secondary-100);border-bottom:1px solid var(--lmnt-theme-secondary-100)}._standaloneBorder_1ijh0_12{border:1px solid var(--lmnt-theme-secondary-100);border-radius:.5rem}

package/dist/components/BlockView/BlockView.d.ts

@@ -47,9 +47,15 @@ type BlockViewProps<T extends Block & {
      */
     clickable?: boolean;
     /**
-     * the size of the block in rem (default is 15x15)
+     * Set the size for the block view
+     * @remarks
+     * - 'absolute' - For containers without fixed dimensions (size depending on content) </br>Uses: { height: '15rem', width: '15rem' }
+     * - 'relative' - For containers with fixed size constraints (like modals with fixed dimensions) </br>Uses: { height: '70%', width: '50%' }
+     * - IMPORTANT: For 'relative' the parent container of the BlockView needs to have a fixed height and width. Otherwise you'll run into css issues
+     *
+     * @default 'absolute'
      */
-    size?: number;
+    size?: 'absolute' | 'relative';
     /**
      * the title of the block view, shown when `hideText` is false
      */

package/dist/components/BlockView/BlockView.js

@@ -1,95 +1,98 @@
-import { jsxs as f, jsx as o, Fragment as v } from "react/jsx-runtime";
-import { c as D, b as S, a as F } from "../../index.es-EXzC8zuP.js";
-import { c as M } from "../../index-_-9ybP20.js";
-import { useState as V, useEffect as q, useMemo as G } from "react";
+import { jsxs as z, jsx as o, Fragment as q } from "react/jsx-runtime";
+import { c as A, b as F, a as M } from "../../index.es-EXzC8zuP.js";
+import { c as h } from "../../index-_-9ybP20.js";
+import { useState as V, useEffect as $, useMemo as G } from "react";
 import { getBlockNumberByDto as H } from "../../services/BlockService.js";
-import '../../assets/BlockView.css';const I = "_grid_gfk3g_1", J = "_blockLayout_gfk3g_11", K = "_blockRow_gfk3g_22", O = "_block_gfk3g_11", P = "_active_gfk3g_41", Q = "_error_gfk3g_46", U = "_empty_gfk3g_52", W = "_activeBlock_gfk3g_57", X = "_clickable_gfk3g_61", Y = "_blockText_gfk3g_65", Z = "_emptyLayout_gfk3g_75", t = {
-  grid: I,
-  blockLayout: J,
-  blockRow: K,
-  block: O,
-  active: P,
-  error: Q,
-  empty: U,
-  activeBlock: W,
+import { useBreakpoints as I } from "../../hooks/useBreakpoints.js";
+import '../../assets/BlockView.css';const J = "_grid_otqrz_1", K = "_blockLayout_otqrz_13", O = "_absoluteSize_otqrz_22", P = "_relativeSize_otqrz_27", Q = "_mobile_otqrz_38", U = "_blockRow_otqrz_46", W = "_block_otqrz_13", X = "_clickable_otqrz_70", Y = "_empty_otqrz_74", Z = "_active_otqrz_79", j = "_error_otqrz_83", tt = "_hoverEffects_otqrz_87", ot = "_blockText_otqrz_99", et = "_emptyLayout_otqrz_109", t = {
+  grid: J,
+  blockLayout: K,
+  absoluteSize: O,
+  relativeSize: P,
+  mobile: Q,
+  blockRow: U,
+  block: W,
   clickable: X,
-  blockText: Y,
-  emptyLayout: Z
-}, rt = ({
+  empty: Y,
+  active: Z,
+  error: j,
+  hoverEffects: tt,
+  blockText: ot,
+  emptyLayout: et
+}, bt = ({
   rows: e,
-  columns: c,
-  hideText: h = !1,
-  hideBlockCountText: w = !1,
-  errorBlocks: N = [],
+  columns: r,
+  hideText: w = !1,
+  hideBlockCountText: N = !1,
+  errorBlocks: g = [],
   showNumbers: x = !0,
-  clickable: b = !0,
-  size: _ = 15,
-  onClick: u = null,
-  currentBlock: a,
-  activeBlocks: g,
+  clickable: d = !1,
+  size: k = "absolute",
+  onClick: p = null,
+  currentBlock: s,
+  activeBlocks: v,
   blocks: m,
-  blockViewTitle: L,
-  blockLabel: T,
-  emptyViewTitle: B
+  blockViewTitle: S,
+  blockLabel: E,
+  emptyViewTitle: L
 }) => {
-  const [C, y] = V(0);
-  q(() => {
-    if (!a) return;
-    const l = H(a, c);
-    y(l);
-  }, [a, c]);
-  const E = G(() => e * c, [e, c]), R = (l) => {
-    u && u(l, a ?? void 0);
-  }, $ = ({ row: l, column: r }) => m.length === 0 ? !0 : m.some((d) => d.position?.row === l && d.position?.column === r), p = !e && !c;
-  return /* @__PURE__ */ f("div", { "data-testid": "block-view-container", className: t.grid, children: [
-    !h && /* @__PURE__ */ o(D, { level: 1, bold: !0, className: t.black, children: L }),
+  const [T, y] = V(0), { isDesktop: f } = I();
+  $(() => {
+    if (!s) return;
+    const c = H(s, r);
+    y(c);
+  }, [s, r]);
+  const C = G(() => e * r, [e, r]), R = (c) => {
+    p && p(c, s ?? void 0);
+  }, B = ({ row: c, column: i }) => m.length === 0 ? !0 : m.some((u) => u.position?.row === c && u.position?.column === i), _ = !e && !r;
+  return /* @__PURE__ */ z("div", { "data-testid": "block-view-container", className: t.grid, children: [
+    !w && /* @__PURE__ */ o(A, { level: 1, bold: !0, className: t.black, children: S }),
     /* @__PURE__ */ o(
       "div",
       {
         "data-testid": "block-view-layout",
-        className: p ? t.emptyLayout : t.blockLayout,
-        style: { width: `${_}rem`, height: `${_}rem` },
-        children: p ? /* @__PURE__ */ o(j, { emptyViewTitle: B }) : /* @__PURE__ */ o(v, { children: Array.from({ length: e }).map((l, r) => /* @__PURE__ */ o("div", { "data-testid": "block-view-row", className: t.blockRow, children: Array.from({ length: c }).map((d, s) => {
-          const i = c * r + s + 1, n = $({ row: r + 1, column: s + 1 }), A = M(
+        className: h(
+          _ && t.emptyLayout,
+          !_ && t.blockLayout,
+          k === "absolute" && t.absoluteSize,
+          k === "relative" && t.relativeSize,
+          !f && t.mobile
+        ),
+        children: _ ? /* @__PURE__ */ o(rt, { emptyViewTitle: L }) : /* @__PURE__ */ o(q, { children: Array.from({ length: e }).map((c, i) => /* @__PURE__ */ o("div", { "data-testid": "block-view-row", className: t.blockRow, children: Array.from({ length: r }).map((u, a) => {
+          const l = r * i + a + 1, n = B({ row: i + 1, column: a + 1 }), D = h(
             t.block,
-            b && n && t.clickable,
-            C === i && t.active,
+            f && t.hoverEffects,
+            d && n && t.clickable,
+            T === l && t.active,
             !n && t.empty,
-            N.includes(i) && t.error,
-            g && m.some(
-              (k) => k.id && g.includes(k.id) && k.position?.row === r + 1 && k.position?.column === s + 1
-            ) && t.activeBlock
+            g.includes(l) && t.error,
+            v && m.some(
+              (b) => b.id && v.includes(b.id) && b.position?.row === i + 1 && b.position?.column === a + 1
+            ) && t.active
           );
           return /* @__PURE__ */ o(
             "div",
             {
               "data-testid": "block-view-block",
-              className: A,
-              id: `block${i}`,
-              onClick: b && n ? () => {
-                y(i), R({ row: r + 1, column: s + 1 });
+              className: D,
+              id: `block${l}`,
+              onClick: d && n ? () => {
+                y(l), R({ row: i + 1, column: a + 1 });
               } : void 0,
-              children: x && n && /* @__PURE__ */ o(
-                "div",
-                {
-                  "data-testid": "block-view-block-number",
-                  className: t.blockText,
-                  children: i
-                }
-              )
+              children: x && n && /* @__PURE__ */ o("div", { "data-testid": "block-view-block-number", className: t.blockText, children: l })
             },
-            i
+            l
           );
-        }) }, r)) })
+        }) }, i)) })
       }
     ),
-    !w && /* @__PURE__ */ f(S, { themeColor: "primary", level: 6, children: [
-      E,
+    !N && /* @__PURE__ */ z(F, { themeColor: "primary", level: 6, children: [
+      C,
       " ",
-      T
+      E
     ] })
   ] });
-}, j = ({ emptyViewTitle: e }) => e ? /* @__PURE__ */ o(F, { bold: !0, children: e }) : /* @__PURE__ */ o(v, {});
+}, rt = ({ emptyViewTitle: e }) => e ? /* @__PURE__ */ o(M, { bold: !0, children: e }) : /* @__PURE__ */ o(q, {});
 export {
-  rt as BlockView
+  bt as BlockView
 };

package/dist/components/Modal/Modal.d.ts

@@ -1,7 +1,7 @@
 import { ModalProps as ElementModalProps } from '@element-public/react-modal';
 import { AvailableCustomIcons } from '../../enums/AvailableCustomIcons';
-import { ErrorBannerProps } from '../ErrorBanner/ErrorBanner';
 import { OfflineViewProps } from '../OfflineView/OfflineView';
+import { TopBarBannerProps } from '../TopBarBanner/TopBarBanner';
 
 type ModalProps = Omit<ElementModalProps, 'primaryButton'> & React.HTMLProps<HTMLElement> & React.DOMAttributes<HTMLElement> & {
     closeIcon?: keyof typeof AvailableCustomIcons | string;
@@ -9,7 +9,7 @@ type ModalProps = Omit<ElementModalProps, 'primaryButton'> & React.HTMLProps<HTM
     isOnline?: boolean;
     offlineViewProps?: Partial<OfflineViewProps>;
 } & {
-    errorBannerProps?: Pick<ErrorBannerProps, 'title' | 'description' | 'primaryActionLabel' | 'onPrimaryAction' | 'secondaryActionLabel' | 'onSecondaryAction'> & {
+    errorBannerProps?: Pick<TopBarBannerProps, 'title' | 'description' | 'primaryActionLabel' | 'onPrimaryAction' | 'secondaryActionLabel' | 'onSecondaryAction'> & {
         hasError: boolean;
     };
 };

package/dist/components/Modal/Modal.js

@@ -11,9 +11,9 @@ import { M as ce, c as ue, m as de } from "../../component-DYpB_4EP.js";
 import { A as me } from "../../animationframe-CqXArbwZ.js";
 import { P as fe } from "../../index.es-C8AExypY.js";
 import { b as pe } from "../../index.es-EXzC8zuP.js";
-import { ErrorBanner as he } from "../ErrorBanner/ErrorBanner.js";
-import { Iconify as ge } from "../Iconify/Iconify.js";
-import { OfflineView as _e } from "../OfflineView/OfflineView.js";
+import { Iconify as he } from "../Iconify/Iconify.js";
+import { OfflineView as ge } from "../OfflineView/OfflineView.js";
+import { TopBarBanner as _e } from "../TopBarBanner/TopBarBanner.js";
 import '../../assets/Modal.css';function Ce(o, e, t) {
   return e(o, { initialFocusEl: t });
 }
@@ -493,7 +493,7 @@ var f = Kt.strings, Ae = (
       return this.root.querySelector("[" + f.INITIAL_FOCUS_ATTRIBUTE + "]");
     }, e;
   })(se)
-), be = {
+), Te = {
   /**
    * An action button that will not automatically trigger a dismiss or accept. It is meant to be used only in certain circumstances where more control of the modal is required such as validating forms. If primaryButton is sent with actionButton, actionButton will be ignored.
    *
@@ -662,7 +662,7 @@ var f = Kt.strings, Ae = (
    * Defaults to **null**.
    */
   title: l.string
-}, Te = {
+}, be = {
   actionButton: null,
   backButton: null,
   badge: void 0,
@@ -691,17 +691,17 @@ var f = Kt.strings, Ae = (
   returnFocusSelector: null,
   scrollable: !1,
   title: null
-}, Ie = ["actionButton", "actionIcons", "badge", "backButton", "children", "className", "content", "defaultButton", "dismissiveButton", "footerSupplemental", "headerActions", "hideCloseIcon", "indicator", "initialFocus", "mobileStackedButtons", "modalSize", "nextButton", "noActions", "onClose", "onClosed", "onOpen", "onOpened", "open", "preventClose", "preventPrimaryAccept", "primaryButton", "returnFocusSelector", "scrollable", "title", "iconSource"], r = Te, ot = /* @__PURE__ */ ee(function(o, e) {
-  var t = o.actionButton, n = t === void 0 ? r.actionButton : t, i = o.actionIcons, a = i === void 0 ? r.actionIcons : i, d = o.badge, h = d === void 0 ? r.badge : d, O = o.backButton, _ = O === void 0 ? r.backButton : O, S = o.children, F = S === void 0 ? r.children : S, b = o.className, W = b === void 0 ? r.className : b, E = o.content, L = E === void 0 ? r.content : E, it = o.defaultButton, T = it === void 0 ? r.defaultButton : it, at = o.dismissiveButton, R = at === void 0 ? r.dismissiveButton : at, rt = o.footerSupplemental, w = rt === void 0 ? r.footerSupplemental : rt, lt = o.headerActions, st = lt === void 0 ? r.headerActions : lt, ct = o.hideCloseIcon, V = ct === void 0 ? r.hideCloseIcon : ct, ut = o.indicator, Wt = ut === void 0 ? r.indicator : ut, dt = o.initialFocus, I = dt === void 0 ? r.initialFocus : dt, mt = o.mobileStackedButtons, z = mt === void 0 ? r.mobileStackedButtons : mt, ft = o.modalSize, C = ft === void 0 ? r.modalSize : ft, pt = o.nextButton, N = pt === void 0 ? r.nextButton : pt, ht = o.noActions, B = ht === void 0 ? r.noActions : ht, gt = o.onClose, j = gt === void 0 ? r.onClose : gt, _t = o.onClosed, q = _t === void 0 ? r.onClosed : _t, Ct = o.onOpen, k = Ct === void 0 ? r.onOpen : Ct, vt = o.onOpened, M = vt === void 0 ? r.onOpened : vt, Et = o.open, St = Et === void 0 ? r.open : Et, yt = o.preventClose, Y = yt === void 0 ? r.preventClose : yt, Ot = o.preventPrimaryAccept, At = Ot === void 0 ? r.preventPrimaryAccept : Ot, bt = o.primaryButton, u = bt === void 0 ? r.primaryButton : bt, Tt = o.returnFocusSelector, J = Tt === void 0 ? r.returnFocusSelector : Tt, It = o.scrollable, Nt = It === void 0 ? r.scrollable : It, Bt = o.title, Dt = Bt === void 0 ? r.title : Bt, Ft = o.iconSource, Vt = Ft === void 0 ? r.iconSource : Ft, zt = Zt(o, Ie), P = Pt(), c = Pt();
+}, Ie = ["actionButton", "actionIcons", "badge", "backButton", "children", "className", "content", "defaultButton", "dismissiveButton", "footerSupplemental", "headerActions", "hideCloseIcon", "indicator", "initialFocus", "mobileStackedButtons", "modalSize", "nextButton", "noActions", "onClose", "onClosed", "onOpen", "onOpened", "open", "preventClose", "preventPrimaryAccept", "primaryButton", "returnFocusSelector", "scrollable", "title", "iconSource"], r = be, ot = /* @__PURE__ */ ee(function(o, e) {
+  var t = o.actionButton, n = t === void 0 ? r.actionButton : t, i = o.actionIcons, a = i === void 0 ? r.actionIcons : i, d = o.badge, h = d === void 0 ? r.badge : d, O = o.backButton, _ = O === void 0 ? r.backButton : O, S = o.children, F = S === void 0 ? r.children : S, T = o.className, W = T === void 0 ? r.className : T, E = o.content, L = E === void 0 ? r.content : E, it = o.defaultButton, b = it === void 0 ? r.defaultButton : it, at = o.dismissiveButton, R = at === void 0 ? r.dismissiveButton : at, rt = o.footerSupplemental, w = rt === void 0 ? r.footerSupplemental : rt, lt = o.headerActions, st = lt === void 0 ? r.headerActions : lt, ct = o.hideCloseIcon, V = ct === void 0 ? r.hideCloseIcon : ct, ut = o.indicator, Wt = ut === void 0 ? r.indicator : ut, dt = o.initialFocus, I = dt === void 0 ? r.initialFocus : dt, mt = o.mobileStackedButtons, z = mt === void 0 ? r.mobileStackedButtons : mt, ft = o.modalSize, C = ft === void 0 ? r.modalSize : ft, pt = o.nextButton, B = pt === void 0 ? r.nextButton : pt, ht = o.noActions, N = ht === void 0 ? r.noActions : ht, gt = o.onClose, j = gt === void 0 ? r.onClose : gt, _t = o.onClosed, q = _t === void 0 ? r.onClosed : _t, Ct = o.onOpen, k = Ct === void 0 ? r.onOpen : Ct, vt = o.onOpened, M = vt === void 0 ? r.onOpened : vt, Et = o.open, St = Et === void 0 ? r.open : Et, yt = o.preventClose, Y = yt === void 0 ? r.preventClose : yt, Ot = o.preventPrimaryAccept, At = Ot === void 0 ? r.preventPrimaryAccept : Ot, Tt = o.primaryButton, u = Tt === void 0 ? r.primaryButton : Tt, bt = o.returnFocusSelector, J = bt === void 0 ? r.returnFocusSelector : bt, It = o.scrollable, Bt = It === void 0 ? r.scrollable : It, Nt = o.title, Dt = Nt === void 0 ? r.title : Nt, Ft = o.iconSource, Vt = Ft === void 0 ? r.iconSource : Ft, zt = Zt(o, Ie), P = Pt(), c = Pt();
   ne(e, function() {
     return P.current;
   }, []);
   var jt = Ht(), Lt = Mt(jt, 2), Q = Lt[0], qt = Lt[1], Yt = Ht(function() {
-    return N || _;
+    return B || _;
   }), Rt = Mt(Yt, 2), X = Rt[0], Jt = Rt[1];
   v(function() {
-    Jt(N || _);
-  }, [N, _]);
+    Jt(B || _);
+  }, [B, _]);
   var H = Z(function() {
     xt() && qt(window.innerWidth <= 600);
   }, []);
@@ -717,9 +717,9 @@ var f = Kt.strings, Ae = (
   }, [c, P]), v(function() {
     c.current.foundation.setAutoStackButtons(z);
   }, [z]), v(function() {
-    B && (c.current.foundation.adapter.trapFocus = function() {
+    N && (c.current.foundation.adapter.trapFocus = function() {
     });
-  }, [B]), v(function() {
+  }, [N]), v(function() {
     c.current.scrimClickAction = Y ? "" : "close", c.current.escapeKeyAction = Y ? "" : "close";
   }, [Y]);
   var x = Z(function(p) {
@@ -753,9 +753,9 @@ var f = Kt.strings, Ae = (
         elevation: n?.props.elevation !== "default" ? n?.props.elevation : "flat",
         variant: n?.props.variant || "filled"
       };
-      return T === "action" && (p["data-mdc-dialog-button-default"] = !0), I === "action" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+      return b === "action" && (p["data-mdc-dialog-button-default"] = !0), I === "action" && (p["data-mdc-dialog-initial-focus"] = !0), p;
     };
-  }, [n?.props.elevation, n?.props.variant, T, I]), Xt = nt(function() {
+  }, [n?.props.elevation, n?.props.variant, b, I]), Xt = nt(function() {
     return function() {
       var p = {
         className: "lmnt-modal__button mdc-dialog__button",
@@ -763,20 +763,20 @@ var f = Kt.strings, Ae = (
         elevation: u?.props.elevation !== "default" ? u?.props.elevation : "flat",
         variant: u?.props.variant || "filled"
       };
-      return T === "primary" && (p["data-mdc-dialog-button-default"] = !0), I === "primary" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+      return b === "primary" && (p["data-mdc-dialog-button-default"] = !0), I === "primary" && (p["data-mdc-dialog-initial-focus"] = !0), p;
     };
-  }, [At, T, I, u?.props.elevation, u?.props.variant]);
+  }, [At, b, I, u?.props.elevation, u?.props.variant]);
   return /* @__PURE__ */ m.createElement("aside", te({
     ref: P,
-    className: G("lmnt", "lmnt-modal", "mdc-dialog", Nt && "lmnt-modal--scrollable mdc-dialog--scrollable", W),
+    className: G("lmnt", "lmnt-modal", "mdc-dialog", Bt && "lmnt-modal--scrollable mdc-dialog--scrollable", W),
     role: "alertdialog"
   }, zt), /* @__PURE__ */ m.createElement("div", {
-    className: G("lmnt-modal__container", "mdc-dialog__container", C === "fullscreen" && "mdc-dialog--fullscreen", C === "max" && "lmnt-modal__max", C === "xlarge" && "lmnt-modal__xl", C === "large" && "lmnt-modal__lg", C === "medium" && "lmnt-modal__md", C === "small" && "lmnt-modal__sm", (C === "mobile" || Q) && "lmnt-modal__mobile", C === "dialog" && "lmnt-modal__dialog", B && "lmnt-modal-no-actions")
+    className: G("lmnt-modal__container", "mdc-dialog__container", C === "fullscreen" && "mdc-dialog--fullscreen", C === "max" && "lmnt-modal__max", C === "xlarge" && "lmnt-modal__xl", C === "large" && "lmnt-modal__lg", C === "medium" && "lmnt-modal__md", C === "small" && "lmnt-modal__sm", (C === "mobile" || Q) && "lmnt-modal__mobile", C === "dialog" && "lmnt-modal__dialog", N && "lmnt-modal-no-actions")
   }, /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-modal__surface mdc-dialog__surface"
   }, /* @__PURE__ */ m.createElement("header", {
-    className: G("lmnt-modal__title", "mdc-dialog__title", (C === "dialog" || V) && "lmnt-modal_title-hide-close-icon", a && "lmnt-modal_title-actionsIcons", Nt && "lmnt-modal__title-scrollable", (V || C === "dialog" || B) && "lmnt-modal--no-close-icon")
-  }, !V && C !== "dialog" && !B && /* @__PURE__ */ m.createElement(Ut, {
+    className: G("lmnt-modal__title", "mdc-dialog__title", (C === "dialog" || V) && "lmnt-modal_title-hide-close-icon", a && "lmnt-modal_title-actionsIcons", Bt && "lmnt-modal__title-scrollable", (V || C === "dialog" || N) && "lmnt-modal--no-close-icon")
+  }, !V && C !== "dialog" && !N && /* @__PURE__ */ m.createElement(Ut, {
     className: "mdc-icon-button material-icons mdc-dialog__close",
     "data-mdc-dialog-action": "close",
     icon: "clear",
@@ -790,13 +790,13 @@ var f = Kt.strings, Ae = (
     }
   }, h)), (L || F) && /* @__PURE__ */ m.createElement("section", {
     className: "lmnt-modal__content mdc-dialog__content"
-  }, L || F), Wt, (n || _ || R || N || u || w) && /* @__PURE__ */ m.createElement("footer", {
+  }, L || F), Wt, (n || _ || R || B || u || w) && /* @__PURE__ */ m.createElement("footer", {
     className: G("lmnt-modal__actions", "mdc-dialog__actions", Q && "lmnt-dialog__actions__mobile", w && "lmnt-modal__actions--supplemental-btn", Q && z && "lmnt-modal_actions-mobile-stacked")
   }, !X && w && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__actions__supplemental"
   }, D(w, function() {
     var p = {};
-    return T === "footerSupplemental" && (p["data-mdc-dialog-button-default"] = !0), I === "footerSupplemental" && (p["data-mdc-dialog-initial-focus"] = !0), p;
+    return b === "footerSupplemental" && (p["data-mdc-dialog-button-default"] = !0), I === "footerSupplemental" && (p["data-mdc-dialog-initial-focus"] = !0), p;
   })), !X && (n || R || u) && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__actions__right-align lmnt-modal_actions_button"
   }, R && D(R, {
@@ -805,7 +805,7 @@ var f = Kt.strings, Ae = (
     "data-mdc-dialog-action": "close"
   }), n && !u && D(n, Qt), u && D(u, Xt)), X && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-modal_actions_button lmnt-dialog__actions__directional"
-  }, /* @__PURE__ */ m.createElement("div", null, ae(_, "lmnt-modal__button")), /* @__PURE__ */ m.createElement("div", null, D(N, {
+  }, /* @__PURE__ */ m.createElement("div", null, ae(_, "lmnt-modal__button")), /* @__PURE__ */ m.createElement("div", null, D(B, {
     className: "lmnt-modal__button",
     "data-mdc-dialog-initial-focus": !0
   })))))), /* @__PURE__ */ m.createElement("div", {
@@ -813,10 +813,10 @@ var f = Kt.strings, Ae = (
   }));
 });
 ot.displayName = "Modal";
-ot.propTypes = be;
-const Ne = "_modal_1l955_1", Be = "_gap_1l955_18", De = "_title_1l955_23", Fe = "_titleWithoutCloseIcon_1l955_36", Le = "_closeButton_1l955_40", Re = "_errorBanner_1l955_52", y = {
-  modal: Ne,
-  gap: Be,
+ot.propTypes = Te;
+const Be = "_modal_1l955_1", Ne = "_gap_1l955_18", De = "_title_1l955_23", Fe = "_titleWithoutCloseIcon_1l955_36", Le = "_closeButton_1l955_40", Re = "_errorBanner_1l955_52", y = {
+  modal: Be,
+  gap: Ne,
   title: De,
   titleWithoutCloseIcon: Fe,
   closeButton: Le,
@@ -833,7 +833,7 @@ const Ne = "_modal_1l955_1", Be = "_gap_1l955_18", De = "_title_1l955_23", Fe =
   offlineViewProps: O,
   children: _,
   errorBannerProps: { hasError: S, ...F } = { hasError: !1 },
-  ...b
+  ...T
 }) => {
   const W = nt(() => {
     const E = {
@@ -854,7 +854,7 @@ const Ne = "_modal_1l955_1", Be = "_gap_1l955_18", De = "_title_1l955_23", Fe =
                 className: y.closeButton
               }
             ),
-            d ? /* @__PURE__ */ g(fe, { customPadding: "0.25rem 0 0 0.75rem", children: /* @__PURE__ */ g(ge, { icon: d }) }) : /* @__PURE__ */ g(wt, {}),
+            d ? /* @__PURE__ */ g(fe, { customPadding: "0.25rem 0 0 0.75rem", children: /* @__PURE__ */ g(he, { icon: d }) }) : /* @__PURE__ */ g(wt, {}),
             /* @__PURE__ */ g(
               pe,
               {
@@ -879,17 +879,17 @@ const Ne = "_modal_1l955_1", Be = "_gap_1l955_18", De = "_title_1l955_23", Fe =
   return /* @__PURE__ */ g(
     ot,
     {
-      ...b,
+      ...T,
       "data-testid": "modal",
-      className: `${y.modal} ${y.title} ${b.className ?? ""}`,
+      className: `${y.modal} ${y.title} ${T.className ?? ""}`,
       hideCloseIcon: !0,
       actionButton: n,
       headerActions: /* @__PURE__ */ kt(U, { fullWidth: !0, gap: "none", direction: "vertical", children: [
         /* @__PURE__ */ g(U, { fullWidth: !0, primaryAlign: "space-between", secondaryAlign: "center", children: W.map((E) => /* @__PURE__ */ g(oe, { children: E.action }, E.id)) }),
-        S && /* @__PURE__ */ g("div", { className: y.errorBanner, children: /* @__PURE__ */ g(he, { ...F, isOpen: S }) })
+        S && /* @__PURE__ */ g("div", { className: y.errorBanner, children: /* @__PURE__ */ g(_e, { ...F, isOpen: S }) })
       ] }, "header-group"),
       preventClose: !0,
-      children: h ? /* @__PURE__ */ g(wt, { children: _ }) : /* @__PURE__ */ g(_e, { ...O })
+      children: h ? /* @__PURE__ */ g(wt, { children: _ }) : /* @__PURE__ */ g(ge, { ...O })
     }
   );
 };

package/dist/components/{ErrorBanner/ErrorBanner.d.ts → TopBarBanner/TopBarBanner.d.ts}

@@ -1,4 +1,4 @@
-export type ErrorBannerProps = {
+export type TopBarBannerProps = {
     title?: string;
     description?: string;
     isOpen?: boolean;
@@ -7,9 +7,10 @@ export type ErrorBannerProps = {
     secondaryActionLabel?: string;
     onSecondaryAction?: () => void;
     isStandalone?: boolean;
+    icon?: string;
 };
 /**
- * Error banner component to display error messages with optional actions.
+ * Top bar banner component to display error messages with optional actions.
  * Designed to be used below a header or as a standalone banner in a modal.
  *
  * @param {string} title - Title text displayed in the banner
@@ -20,6 +21,6 @@ export type ErrorBannerProps = {
  * @param {string} secondaryActionLabel - Label for the secondary action button. If not provided, button will not be rendered.
  * @param {() => void} onSecondaryAction - Handler for the secondary action button
  * @param {boolean} isStandalone - When true, renders the banner with a rounded border instead of a bottom border
- * @returns {JSX.Element|null} The rendered ErrorBanner component or null if not visible
+ * @returns {JSX.Element|null} The rendered TopBarBanner component or null if not visible
  */
-export declare const ErrorBanner: ({ title, description, isOpen, isStandalone, ...props }: ErrorBannerProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const TopBarBanner: ({ title, description, isOpen, isStandalone, icon, ...props }: TopBarBannerProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/TopBarBanner/TopBarBanner.js

@@ -0,0 +1,78 @@
+import { jsx as r, jsxs as t } from "react/jsx-runtime";
+import { B as c } from "../../index.es-B1cewJEy.js";
+import { G as o } from "../../index.es-BE1XL1dD.js";
+import { P as u } from "../../index.es-C8AExypY.js";
+import { T as b, a as h } from "../../index.es-EXzC8zuP.js";
+import { c as B } from "../../index-_-9ybP20.js";
+import { useContainerWidth as g } from "../../hooks/useContainerWidth.js";
+import { Iconify as y } from "../Iconify/Iconify.js";
+import '../../assets/TopBarBanner.css';const _ = "_bannerPadding_1ijh0_1", P = "_bottomBorder_1ijh0_7", v = "_standaloneBorder_1ijh0_12", s = {
+  bannerPadding: _,
+  bottomBorder: P,
+  standaloneBorder: v
+}, N = ({
+  title: n,
+  description: a,
+  isOpen: e,
+  isStandalone: i,
+  icon: d,
+  ...m
+}) => {
+  const { ref: p, isWide: l } = g(), f = B(
+    s.bannerPadding,
+    i ? s.standaloneBorder : s.bottomBorder
+  );
+  return e ? /* @__PURE__ */ r(u, { customPadding: "0.5rem 1rem", className: f, "data-testid": "top-bar-banner", children: /* @__PURE__ */ t(
+    o,
+    {
+      ref: p,
+      fullWidth: !0,
+      direction: l ? "horizontal" : "vertical",
+      secondaryAlign: "center",
+      children: [
+        /* @__PURE__ */ t(o, { fullWidth: !0, primaryAlign: "space-between", secondaryAlign: l ? "center" : "start", children: [
+          /* @__PURE__ */ r(
+            y,
+            {
+              icon: d ?? "sentiment-very-dissatisfied",
+              iconSize: "large",
+              variant: "color-primary"
+            }
+          ),
+          /* @__PURE__ */ t(o, { direction: "vertical", fullWidth: !0, gap: "none", children: [
+            /* @__PURE__ */ r(b, { bold: !0, level: 2, themeColor: "primary", children: n }),
+            /* @__PURE__ */ r(h, { children: a })
+          ] })
+        ] }),
+        /* @__PURE__ */ r(C, { ...m, isWide: l })
+      ]
+    }
+  ) }) : null;
+}, C = ({
+  primaryActionLabel: n,
+  onPrimaryAction: a,
+  secondaryActionLabel: e,
+  onSecondaryAction: i,
+  isWide: d
+}) => /* @__PURE__ */ t(o, { fullWidth: !d, primaryAlign: "end", secondaryAlign: "center", children: [
+  n && /* @__PURE__ */ r(
+    c,
+    {
+      label: n,
+      onClick: a,
+      "data-testid": "top-bar-banner-primary-action"
+    }
+  ),
+  e && /* @__PURE__ */ r(
+    c,
+    {
+      label: e,
+      variant: "outlined",
+      onClick: i,
+      "data-testid": "top-bar-banner-secondary-action"
+    }
+  )
+] });
+export {
+  N as TopBarBanner
+};

package/dist/main.d.ts

@@ -11,10 +11,9 @@ export { DeleteModal } from './components/DeleteModal/DeleteModal';
 export { DetailContentWrapper } from './components/DetailContentWrapper/DetailContentWrapper';
 export { Disclaimer } from './components/Disclaimer/Disclaimer';
 export { EmptyView } from './components/EmptyView/EmptyView';
-export { ErrorBanner } from './components/ErrorBanner/ErrorBanner';
 export { Filter } from './components/Filter/Filter';
-export { FormattedNumberDisplay } from './components/FormattedNumberDisplay/FormattedNumberDisplay';
 export { FloatingActionButton } from './components/FloatingActionButton/FloatingActionButton';
+export { FormattedNumberDisplay } from './components/FormattedNumberDisplay/FormattedNumberDisplay';
 export { GenericTable } from './components/GenericTable/GenericTable';
 export { HashTabView } from './components/HashTabView/HashTabView';
 export { HeaderFilter } from './components/HeaderFilter/HeaderFilter';
@@ -33,6 +32,7 @@ export { SearchBar } from './components/SearchBar/SearchBar';
 export { Select } from './components/Select/Select';
 export { StepperHeader } from './components/Stepper/components/StepperHeader';
 export { Stepper } from './components/Stepper/Stepper';
+export { TopBarBanner } from './components/TopBarBanner/TopBarBanner';
 export { VerticalDivider } from './components/VerticalDivider/VerticalDivider';
 export { FormCheckBox } from './components/FormComponents/FormCheckBox/FormCheckBox';
 export { FormDatePicker } from './components/FormComponents/FormDatePicker/FormDatePicker';

package/dist/main.js

@@ -5,36 +5,36 @@ import { BasicHeading as i } from "./components/BasicHeading/BasicHeading.js";
 import { BlockView as n } from "./components/BlockView/BlockView.js";
 import { ButtonCard as A } from "./components/ButtonCard/ButtonCard.js";
 import { ChipCard as d } from "./components/ChipCard/ChipCard.js";
-import { ConfirmationModal as E } from "./components/ConfirmationModal/ConfirmationModal.js";
+import { ConfirmationModal as c } from "./components/ConfirmationModal/ConfirmationModal.js";
 import { ContextMenu as F } from "./components/ContextMenu/ContextMenu.js";
-import { DeleteModal as _ } from "./components/DeleteModal/DeleteModal.js";
-import { DetailContentWrapper as T } from "./components/DetailContentWrapper/DetailContentWrapper.js";
+import { DeleteModal as T } from "./components/DeleteModal/DeleteModal.js";
+import { DetailContentWrapper as I } from "./components/DetailContentWrapper/DetailContentWrapper.js";
 import { Disclaimer as G } from "./components/Disclaimer/Disclaimer.js";
 import { EmptyView as C } from "./components/EmptyView/EmptyView.js";
-import { ErrorBanner as M } from "./components/ErrorBanner/ErrorBanner.js";
-import { Filter as g } from "./components/Filter/Filter.js";
+import { Filter as M } from "./components/Filter/Filter.js";
+import { FloatingActionButton as g } from "./components/FloatingActionButton/FloatingActionButton.js";
 import { FormattedNumberDisplay as w } from "./components/FormattedNumberDisplay/FormattedNumberDisplay.js";
-import { FloatingActionButton as O } from "./components/FloatingActionButton/FloatingActionButton.js";
-import { GenericTable as V } from "./components/GenericTable/GenericTable.js";
-import { HashTabView as H } from "./components/HashTabView/HashTabView.js";
-import { HeaderFilter as k } from "./components/HeaderFilter/HeaderFilter.js";
-import { Iconify as y } from "./components/Iconify/Iconify.js";
-import { InfoCard as Y } from "./components/InfoCard/InfoCard.js";
-import { InfoGroup as z } from "./components/InfoGroup/InfoGroup.js";
-import { ListArea as j } from "./components/ListArea/ListArea.js";
-import { LoadingSpinner as J } from "./components/LoadingSpinner/Default/LoadingSpinner.js";
-import { Modal as Z } from "./components/Modal/Modal.js";
-import { ModulePadding as rr } from "./components/ModulePadding/ModulePadding.js";
-import { OfflineView as er } from "./components/OfflineView/OfflineView.js";
-import { OnboardingBanner as mr } from "./components/OnboardingBanner/OnboardingBanner.js";
-import { OverflowTooltip as fr } from "./components/OverflowTooltip/OverflowTooltip.js";
-import { ScrollbarX as ir, ScrollbarY as ar } from "./components/Scrollbar/Scrollbar.js";
-import { SearchBar as lr } from "./components/SearchBar/SearchBar.js";
-import { Select as sr } from "./components/Select/Select.js";
-import { StepperHeader as Sr } from "./components/Stepper/components/StepperHeader.js";
-import { Stepper as cr } from "./components/Stepper/Stepper.js";
+import { GenericTable as O } from "./components/GenericTable/GenericTable.js";
+import { HashTabView as V } from "./components/HashTabView/HashTabView.js";
+import { HeaderFilter as H } from "./components/HeaderFilter/HeaderFilter.js";
+import { Iconify as k } from "./components/Iconify/Iconify.js";
+import { InfoCard as y } from "./components/InfoCard/InfoCard.js";
+import { InfoGroup as Y } from "./components/InfoGroup/InfoGroup.js";
+import { ListArea as z } from "./components/ListArea/ListArea.js";
+import { LoadingSpinner as j } from "./components/LoadingSpinner/Default/LoadingSpinner.js";
+import { Modal as J } from "./components/Modal/Modal.js";
+import { ModulePadding as Z } from "./components/ModulePadding/ModulePadding.js";
+import { OfflineView as rr } from "./components/OfflineView/OfflineView.js";
+import { OnboardingBanner as er } from "./components/OnboardingBanner/OnboardingBanner.js";
+import { OverflowTooltip as mr } from "./components/OverflowTooltip/OverflowTooltip.js";
+import { ScrollbarX as fr, ScrollbarY as xr } from "./components/Scrollbar/Scrollbar.js";
+import { SearchBar as ar } from "./components/SearchBar/SearchBar.js";
+import { Select as lr } from "./components/Select/Select.js";
+import { StepperHeader as sr } from "./components/Stepper/components/StepperHeader.js";
+import { Stepper as Sr } from "./components/Stepper/Stepper.js";
+import { TopBarBanner as Er } from "./components/TopBarBanner/TopBarBanner.js";
 import { VerticalDivider as Lr } from "./components/VerticalDivider/VerticalDivider.js";
-import { FormCheckBox as Ir } from "./components/FormComponents/FormCheckBox/FormCheckBox.js";
+import { FormCheckBox as _r } from "./components/FormComponents/FormCheckBox/FormCheckBox.js";
 import { FormDatePicker as Br } from "./components/FormComponents/FormDatePicker/FormDatePicker.js";
 import { FormNumber as ur } from "./components/FormComponents/FormNumber/FormNumber.js";
 import { FormRadio as Dr } from "./components/FormComponents/FormRadio/FormRadio.js";
@@ -52,9 +52,9 @@ import { StepperStyle as Zr } from "./components/Stepper/stepperStyles.js";
 import { DATE_FORMAT as ro, DATE_TIME_FORMAT as oo, TIME_FORMAT as eo } from "./types/Time.js";
 import { AVAILABLE_COUNTRY_KEYS as mo, AVAILABLE_LOCALES as po, ENGLISH_LANGUAGE_ID as fo, GERMAN_LANGUAGE_ID as xo, LANGUAGE_CODES_MAPPER as io, LANGUAGE_ID_MAPPER as ao, SPANISH_LANGUAGE_ID as no, TURKISH_LANGUAGE_ID as lo } from "./types/Languages.js";
 import { Allowed as so } from "./components/Allowed/Allowed.js";
-import { AllowedButton as Eo } from "./components/AllowedButton/AllowedButton.js";
+import { AllowedButton as co } from "./components/AllowedButton/AllowedButton.js";
 import { AllowedIconButton as Fo } from "./components/AllowedIconButton/AllowedIconButton.js";
-import { getPermissionsFromModulePermissionToken as _o, useIsAllowed as Io } from "./components/PermissionChecks/PermissionService.js";
+import { getPermissionsFromModulePermissionToken as To, useIsAllowed as _o } from "./components/PermissionChecks/PermissionService.js";
 import { SharedComponentsPermissionProvider as Bo } from "./components/SharedComponentsPermissionProvider/SharedComponentsPermissionProvider.js";
 import { createPermissionWrapper as uo, renderWithPermissions as Co } from "./test-utils.js";
 import { HVMainPermissions as Mo } from "./types/Permission.js";
@@ -63,7 +63,7 @@ export {
   po as AVAILABLE_LOCALES,
   e as AlertBanner,
   so as Allowed,
-  Eo as AllowedButton,
+  co as AllowedButton,
   Fo as AllowedIconButton,
   Ur as AvailableCustomIcons,
   f as BaseView,
@@ -71,19 +71,18 @@ export {
   n as BlockView,
   A as ButtonCard,
   d as ChipCard,
-  E as ConfirmationModal,
+  c as ConfirmationModal,
   F as ContextMenu,
   ro as DATE_FORMAT,
   oo as DATE_TIME_FORMAT,
-  _ as DeleteModal,
-  T as DetailContentWrapper,
+  T as DeleteModal,
+  I as DetailContentWrapper,
   G as Disclaimer,
   fo as ENGLISH_LANGUAGE_ID,
   C as EmptyView,
-  M as ErrorBanner,
-  g as Filter,
-  O as FloatingActionButton,
-  Ir as FormCheckBox,
+  M as Filter,
+  g as FloatingActionButton,
+  _r as FormCheckBox,
   Br as FormDatePicker,
   ur as FormNumber,
   Dr as FormRadio,
@@ -93,45 +92,46 @@ export {
   Rr as FormToggle,
   w as FormattedNumberDisplay,
   xo as GERMAN_LANGUAGE_ID,
-  V as GenericTable,
+  O as GenericTable,
   Mo as HVMainPermissions,
-  H as HashTabView,
-  k as HeaderFilter,
-  y as Iconify,
-  Y as InfoCard,
-  z as InfoGroup,
+  V as HashTabView,
+  H as HeaderFilter,
+  k as Iconify,
+  y as InfoCard,
+  Y as InfoGroup,
   io as LANGUAGE_CODES_MAPPER,
   ao as LANGUAGE_ID_MAPPER,
   m as LinkBanner,
-  j as ListArea,
-  J as LoadingSpinner,
-  Z as Modal,
-  rr as ModulePadding,
-  er as OfflineView,
-  mr as OnboardingBanner,
-  fr as OverflowTooltip,
+  z as ListArea,
+  j as LoadingSpinner,
+  J as Modal,
+  Z as ModulePadding,
+  rr as OfflineView,
+  er as OnboardingBanner,
+  mr as OverflowTooltip,
   no as SPANISH_LANGUAGE_ID,
   hr as SafeForm,
-  ir as ScrollbarX,
-  ar as ScrollbarY,
-  lr as SearchBar,
-  sr as Select,
+  fr as ScrollbarX,
+  xr as ScrollbarY,
+  ar as SearchBar,
+  lr as Select,
   Bo as SharedComponentsPermissionProvider,
-  cr as Stepper,
-  Sr as StepperHeader,
+  Sr as Stepper,
+  sr as StepperHeader,
   Zr as StepperStyle,
   eo as TIME_FORMAT,
   lo as TURKISH_LANGUAGE_ID,
   vr as ThemeColor,
+  Er as TopBarBanner,
   Lr as VerticalDivider,
   Xr as capitalizeFirstLetters,
   uo as createPermissionWrapper,
   jr as getFormattedDateTime,
   qr as getNumberAsLocaleString,
-  _o as getPermissionsFromModulePermissionToken,
+  To as getPermissionsFromModulePermissionToken,
   Co as renderWithPermissions,
   Jr as trimLeadingAndTrailingSpaces,
   Wr as useBreakpoints,
   Kr as useContainerWidth,
-  Io as useIsAllowed
+  _o as useIsAllowed
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hortiview/shared-components",
   "description": "This is a shared component library. It should used in the HortiView platform and its modules.",
-  "version": "2.26.1",
+  "version": "2.26.3",
   "type": "module",
   "repository": "https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared",
   "author": "Falk Menge <falk.menge.ext@bayer.com>",

package/dist/assets/ErrorBanner.css

@@ -1 +0,0 @@
-._bannerPadding_1ka2b_1{width:100%;box-sizing:border-box;background-color:var(--lmnt-theme-secondary-50)}._bottomBorder_1ka2b_7{border-top:1px solid var(--lmnt-theme-secondary-100);border-bottom:1px solid var(--lmnt-theme-secondary-100)}._standaloneBorder_1ka2b_12{border-color:var(--lmnt-theme-secondary-100);border-width:1px;border-style:solid;border-radius:.5rem}

package/dist/components/ErrorBanner/ErrorBanner.js

@@ -1,70 +0,0 @@
-import { jsx as r, jsxs as o } from "react/jsx-runtime";
-import { B as c } from "../../index.es-B1cewJEy.js";
-import { G as t } from "../../index.es-BE1XL1dD.js";
-import { P as f } from "../../index.es-C8AExypY.js";
-import { T as u, a as b } from "../../index.es-EXzC8zuP.js";
-import { c as h } from "../../index-_-9ybP20.js";
-import { useContainerWidth as B } from "../../hooks/useContainerWidth.js";
-import { Iconify as g } from "../Iconify/Iconify.js";
-import '../../assets/ErrorBanner.css';const y = "_bannerPadding_1ka2b_1", _ = "_bottomBorder_1ka2b_7", P = "_standaloneBorder_1ka2b_12", s = {
-  bannerPadding: y,
-  bottomBorder: _,
-  standaloneBorder: P
-}, E = ({
-  title: n,
-  description: a,
-  isOpen: e,
-  isStandalone: i,
-  ...d
-}) => {
-  const { ref: m, isWide: l } = B(), p = h(
-    s.bannerPadding,
-    i ? s.standaloneBorder : s.bottomBorder
-  );
-  return e ? /* @__PURE__ */ r(f, { customPadding: "0.5rem 1rem", className: p, "data-testid": "error-banner", children: /* @__PURE__ */ o(
-    t,
-    {
-      ref: m,
-      fullWidth: !0,
-      direction: l ? "horizontal" : "vertical",
-      secondaryAlign: "center",
-      children: [
-        /* @__PURE__ */ o(t, { fullWidth: !0, primaryAlign: "space-between", secondaryAlign: l ? "center" : "start", children: [
-          /* @__PURE__ */ r(g, { icon: "sentiment-very-dissatisfied", iconSize: "large", variant: "color-primary" }),
-          /* @__PURE__ */ o(t, { direction: "vertical", fullWidth: !0, gap: "none", children: [
-            /* @__PURE__ */ r(u, { bold: !0, level: 2, themeColor: "primary", children: n }),
-            /* @__PURE__ */ r(b, { children: a })
-          ] })
-        ] }),
-        /* @__PURE__ */ r(v, { ...d, isWide: l })
-      ]
-    }
-  ) }) : null;
-}, v = ({
-  primaryActionLabel: n,
-  onPrimaryAction: a,
-  secondaryActionLabel: e,
-  onSecondaryAction: i,
-  isWide: d
-}) => /* @__PURE__ */ o(t, { fullWidth: !d, primaryAlign: "end", secondaryAlign: "center", children: [
-  n && /* @__PURE__ */ r(
-    c,
-    {
-      label: n,
-      onClick: a,
-      "data-testid": "error-banner-primary-action"
-    }
-  ),
-  e && /* @__PURE__ */ r(
-    c,
-    {
-      label: e,
-      variant: "outlined",
-      onClick: i,
-      "data-testid": "error-banner-secondary-action"
-    }
-  )
-] });
-export {
-  E as ErrorBanner
-};