@hortiview/shared-components 2.22.0 → 2.23.1

package/dist/components/FormComponents/FormDatePicker/FormDatePickerService.d.ts

@@ -0,0 +1,40 @@
+/**
+ * Converts a local date-only value into the persisted UTC representation.
+ *
+ * Reads the local year/month/day from the provided Date and returns a new Date at
+ * 00:00:00.000 UTC for that same calendar day.
+ *
+ * Example:
+ * - User selects "2025-03-15" in their local timezone
+ * - Stored value becomes 2025-03-15T00:00:00.000Z
+ *
+ * This helper is intended for date-only values, not datetime values.
+ */
+export declare const convertToUtcFromLocalDate: (date: Date | number) => Date;
+/**
+ * Converts the persisted UTC date-only value into a local Date for display in the picker.
+ *
+ * Reads the UTC year/month/day from the stored value and creates a new local Date with the
+ * same visible calendar date.
+ *
+ * Example:
+ * - Stored value is 2025-03-15T00:00:00.000Z
+ * - Picker receives a local Date representing "2025-03-15"
+ *
+ * This helper is intended for date-only values, not datetime values.
+ */
+export declare const convertToLocalDateFromUtc: (date: Date | number) => Date;
+/**
+ * Returns the corresponding date in a newly selected month or year.
+ *
+ * Rules:
+ * - Preserve the original day-of-month when possible.
+ * - If the target month does not contain that day, clamp to the last valid day
+ *   of the target month.
+ *
+ * Examples:
+ * - 2025-01-15 -> February => 2025-02-15
+ * - 2025-01-31 -> February => 2025-02-28
+ * - 2025-02-28 -> March => 2025-03-28
+ */
+export declare const getSameDayInNextOrPreviousMonth: (currentUtcDate: Date, newMonthOrYearUtcDate: Date) => Date;

package/dist/components/FormComponents/FormDatePicker/FormDatePickerService.js

@@ -0,0 +1,9 @@
+const g = (t) => t instanceof Date ? new Date(Date.UTC(t.getFullYear(), t.getMonth(), t.getDate())) : new Date(Date.UTC(t)), c = (t) => t instanceof Date ? new Date(t.getUTCFullYear(), t.getUTCMonth(), t.getUTCDate()) : new Date(t), T = (t, e) => {
+  const o = t.getUTCDate(), n = e.getUTCFullYear(), a = e.getUTCMonth(), r = new Date(Date.UTC(n, a + 1, 0)).getUTCDate(), D = Math.min(o, r);
+  return new Date(Date.UTC(n, a, D));
+};
+export {
+  c as convertToLocalDateFromUtc,
+  g as convertToUtcFromLocalDate,
+  T as getSameDayInNextOrPreviousMonth
+};

package/dist/components/Modal/Modal.js

@@ -1,13 +1,13 @@
-import { jsx as g, jsxs as Rt, Fragment as wt } from "react/jsx-runtime";
-import { G as X } from "../../index.es-Z0aF-7Cn.js";
+import { jsx as g, Fragment as Rt, jsxs as wt } from "react/jsx-runtime";
+import { G as U } from "../../index.es-Z0aF-7Cn.js";
 import { I as $t } from "../../index.es-CkB4776y.js";
-import { _ as Qt, a as Xt, c as U, P as l } from "../../index-Df2FYN-K.js";
+import { _ as Qt, a as Xt, c as G, P as s } from "../../index-Df2FYN-K.js";
 import { _ as kt } from "../../slicedToArray-DC6VAZtW.js";
-import m, { forwardRef as Zt, useRef as Mt, useImperativeHandle as te, useState as Pt, useEffect as E, useCallback as Z, useMemo as nt, Fragment as ee } from "react";
+import m, { forwardRef as Zt, useRef as Mt, useImperativeHandle as te, useState as Pt, useEffect as v, useCallback as Z, useMemo as nt, Fragment as ee } from "react";
 import { w as Ht, r as ne, c as D, a as oe } from "../../index.es-C6I3L4U4.js";
 import { b as Ut, c as xt, d as ie } from "../../tslib.es6-BDCynO9F.js";
 import { M as ae, a as re } from "../../component-By6nyiBU.js";
-import { M as se, c as le, m as ce } from "../../component-DYpB_4EP.js";
+import { M as le, c as se, m as ce } from "../../component-DYpB_4EP.js";
 import { A as de } from "../../animationframe-CqXArbwZ.js";
 import { P as ue } from "../../index.es-DgncYOqO.js";
 import { b as me } from "../../index.es-DUrjyxNI.js";
@@ -23,10 +23,10 @@ function _e(o) {
 function Ce(o) {
   return o ? o.scrollTop === 0 : !1;
 }
-function Ee(o) {
+function ve(o) {
   return o ? Math.ceil(o.scrollHeight - o.scrollTop) === o.clientHeight : !1;
 }
-function ve(o) {
+function Ee(o) {
   var e = /* @__PURE__ */ new Set();
   return [].forEach.call(o, function(t) {
     return e.add(t.offsetTop);
@@ -75,7 +75,7 @@ var tt = "mdc-dom-focus-sentinel", Se = (
     }, o;
   })()
 );
-var s = {
+var l = {
   CLOSING: "mdc-dialog--closing",
   OPEN: "mdc-dialog--open",
   OPENING: "mdc-dialog--opening",
@@ -132,10 +132,10 @@ var s = {
   DIALOG_ANIMATION_CLOSE_TIME_MS: 75,
   DIALOG_ANIMATION_OPEN_TIME_MS: 150
 };
-var G;
+var K;
 (function(o) {
   o.POLL_SCROLL_POS = "poll_scroll_position", o.POLL_LAYOUT_CHANGE = "poll_layout_change";
-})(G || (G = {}));
+})(K || (K = {}));
 var Gt = (
   /** @class */
   (function(o) {
@@ -152,7 +152,7 @@ var Gt = (
     }
     return Object.defineProperty(e, "cssClasses", {
       get: function() {
-        return s;
+        return l;
       },
       enumerable: !1,
       configurable: !0
@@ -232,30 +232,30 @@ var Gt = (
       enumerable: !1,
       configurable: !0
     }), e.prototype.init = function() {
-      this.adapter.hasClass(s.STACKED) && this.setAutoStackButtons(!1), this.isFullscreen = this.adapter.hasClass(s.FULLSCREEN);
+      this.adapter.hasClass(l.STACKED) && this.setAutoStackButtons(!1), this.isFullscreen = this.adapter.hasClass(l.FULLSCREEN);
     }, e.prototype.destroy = function() {
       this.dialogOpen && this.close(A.DESTROY_ACTION), this.animationTimer && (clearTimeout(this.animationTimer), this.handleAnimationTimerEnd()), this.isFullscreen && this.adapter.deregisterContentEventHandler("scroll", this.contentScrollHandler), this.animFrame.cancelAll(), this.adapter.deregisterWindowEventHandler("resize", this.windowResizeHandler), this.adapter.deregisterWindowEventHandler("orientationchange", this.windowOrientationChangeHandler);
     }, e.prototype.open = function(t) {
       var n = this;
-      this.dialogOpen = !0, this.adapter.notifyOpening(), this.adapter.addClass(s.OPENING), this.isFullscreen && this.adapter.registerContentEventHandler("scroll", this.contentScrollHandler), t && t.isAboveFullscreenDialog && this.adapter.addClass(s.SCRIM_HIDDEN), this.adapter.registerWindowEventHandler("resize", this.windowResizeHandler), this.adapter.registerWindowEventHandler("orientationchange", this.windowOrientationChangeHandler), this.runNextAnimationFrame(function() {
-        n.adapter.addClass(s.OPEN), n.adapter.addBodyClass(s.SCROLL_LOCK), n.layout(), n.animationTimer = setTimeout(function() {
+      this.dialogOpen = !0, this.adapter.notifyOpening(), this.adapter.addClass(l.OPENING), this.isFullscreen && this.adapter.registerContentEventHandler("scroll", this.contentScrollHandler), t && t.isAboveFullscreenDialog && this.adapter.addClass(l.SCRIM_HIDDEN), this.adapter.registerWindowEventHandler("resize", this.windowResizeHandler), this.adapter.registerWindowEventHandler("orientationchange", this.windowOrientationChangeHandler), this.runNextAnimationFrame(function() {
+        n.adapter.addClass(l.OPEN), n.adapter.addBodyClass(l.SCROLL_LOCK), n.layout(), n.animationTimer = setTimeout(function() {
           n.handleAnimationTimerEnd(), n.adapter.trapFocus(n.adapter.getInitialFocusEl()), n.adapter.notifyOpened();
         }, et.DIALOG_ANIMATION_OPEN_TIME_MS);
       });
     }, e.prototype.close = function(t) {
       var n = this;
-      t === void 0 && (t = ""), this.dialogOpen && (this.dialogOpen = !1, this.adapter.notifyClosing(t), this.adapter.addClass(s.CLOSING), this.adapter.removeClass(s.OPEN), this.adapter.removeBodyClass(s.SCROLL_LOCK), this.isFullscreen && this.adapter.deregisterContentEventHandler("scroll", this.contentScrollHandler), this.adapter.deregisterWindowEventHandler("resize", this.windowResizeHandler), this.adapter.deregisterWindowEventHandler("orientationchange", this.windowOrientationChangeHandler), cancelAnimationFrame(this.animationFrame), this.animationFrame = 0, clearTimeout(this.animationTimer), this.animationTimer = setTimeout(function() {
+      t === void 0 && (t = ""), this.dialogOpen && (this.dialogOpen = !1, this.adapter.notifyClosing(t), this.adapter.addClass(l.CLOSING), this.adapter.removeClass(l.OPEN), this.adapter.removeBodyClass(l.SCROLL_LOCK), this.isFullscreen && this.adapter.deregisterContentEventHandler("scroll", this.contentScrollHandler), this.adapter.deregisterWindowEventHandler("resize", this.windowResizeHandler), this.adapter.deregisterWindowEventHandler("orientationchange", this.windowOrientationChangeHandler), cancelAnimationFrame(this.animationFrame), this.animationFrame = 0, clearTimeout(this.animationTimer), this.animationTimer = setTimeout(function() {
         n.adapter.releaseFocus(), n.handleAnimationTimerEnd(), n.adapter.notifyClosed(t);
       }, et.DIALOG_ANIMATION_CLOSE_TIME_MS));
     }, e.prototype.showSurfaceScrim = function() {
       var t = this;
-      this.adapter.addClass(s.SURFACE_SCRIM_SHOWING), this.runNextAnimationFrame(function() {
-        t.adapter.addClass(s.SURFACE_SCRIM_SHOWN);
+      this.adapter.addClass(l.SURFACE_SCRIM_SHOWING), this.runNextAnimationFrame(function() {
+        t.adapter.addClass(l.SURFACE_SCRIM_SHOWN);
       });
     }, e.prototype.hideSurfaceScrim = function() {
-      this.adapter.removeClass(s.SURFACE_SCRIM_SHOWN), this.adapter.addClass(s.SURFACE_SCRIM_HIDING);
+      this.adapter.removeClass(l.SURFACE_SCRIM_SHOWN), this.adapter.addClass(l.SURFACE_SCRIM_HIDING);
     }, e.prototype.handleSurfaceScrimTransitionEnd = function() {
-      this.adapter.removeClass(s.SURFACE_SCRIM_HIDING), this.adapter.removeClass(s.SURFACE_SCRIM_SHOWING);
+      this.adapter.removeClass(l.SURFACE_SCRIM_HIDING), this.adapter.removeClass(l.SURFACE_SCRIM_SHOWING);
     }, e.prototype.isOpen = function() {
       return this.dialogOpen;
     }, e.prototype.getEscapeKeyAction = function() {
@@ -276,7 +276,7 @@ var Gt = (
       this.suppressDefaultPressSelector = t;
     }, e.prototype.layout = function() {
       var t = this;
-      this.animFrame.request(G.POLL_LAYOUT_CHANGE, function() {
+      this.animFrame.request(K.POLL_LAYOUT_CHANGE, function() {
         t.layoutInternal();
       });
     }, e.prototype.handleClick = function(t) {
@@ -301,28 +301,28 @@ var Gt = (
       n && this.escapeKeyAction !== "" && this.close(this.escapeKeyAction);
     }, e.prototype.handleScrollEvent = function() {
       var t = this;
-      this.animFrame.request(G.POLL_SCROLL_POS, function() {
+      this.animFrame.request(K.POLL_SCROLL_POS, function() {
         t.toggleScrollDividerHeader(), t.toggleScrollDividerFooter();
       });
     }, e.prototype.layoutInternal = function() {
       this.autoStackButtons && this.detectStackedButtons(), this.toggleScrollableClasses();
     }, e.prototype.handleAnimationTimerEnd = function() {
-      this.animationTimer = 0, this.adapter.removeClass(s.OPENING), this.adapter.removeClass(s.CLOSING);
+      this.animationTimer = 0, this.adapter.removeClass(l.OPENING), this.adapter.removeClass(l.CLOSING);
     }, e.prototype.runNextAnimationFrame = function(t) {
       var n = this;
       cancelAnimationFrame(this.animationFrame), this.animationFrame = requestAnimationFrame(function() {
         n.animationFrame = 0, clearTimeout(n.animationTimer), n.animationTimer = setTimeout(t, 0);
       });
     }, e.prototype.detectStackedButtons = function() {
-      this.adapter.removeClass(s.STACKED);
+      this.adapter.removeClass(l.STACKED);
       var t = this.adapter.areButtonsStacked();
-      t && this.adapter.addClass(s.STACKED), t !== this.areButtonsStacked && (this.adapter.reverseButtons(), this.areButtonsStacked = t);
+      t && this.adapter.addClass(l.STACKED), t !== this.areButtonsStacked && (this.adapter.reverseButtons(), this.areButtonsStacked = t);
     }, e.prototype.toggleScrollableClasses = function() {
-      this.adapter.removeClass(s.SCROLLABLE), this.adapter.isContentScrollable() && (this.adapter.addClass(s.SCROLLABLE), this.isFullscreen && (this.toggleScrollDividerHeader(), this.toggleScrollDividerFooter()));
+      this.adapter.removeClass(l.SCROLLABLE), this.adapter.isContentScrollable() && (this.adapter.addClass(l.SCROLLABLE), this.isFullscreen && (this.toggleScrollDividerHeader(), this.toggleScrollDividerFooter()));
     }, e.prototype.toggleScrollDividerHeader = function() {
-      this.adapter.isScrollableContentAtTop() ? this.adapter.hasClass(s.SCROLL_DIVIDER_HEADER) && this.adapter.removeClass(s.SCROLL_DIVIDER_HEADER) : this.adapter.addClass(s.SCROLL_DIVIDER_HEADER);
+      this.adapter.isScrollableContentAtTop() ? this.adapter.hasClass(l.SCROLL_DIVIDER_HEADER) && this.adapter.removeClass(l.SCROLL_DIVIDER_HEADER) : this.adapter.addClass(l.SCROLL_DIVIDER_HEADER);
     }, e.prototype.toggleScrollDividerFooter = function() {
-      this.adapter.isScrollableContentAtBottom() ? this.adapter.hasClass(s.SCROLL_DIVIDER_FOOTER) && this.adapter.removeClass(s.SCROLL_DIVIDER_FOOTER) : this.adapter.addClass(s.SCROLL_DIVIDER_FOOTER);
+      this.adapter.isScrollableContentAtBottom() ? this.adapter.hasClass(l.SCROLL_DIVIDER_FOOTER) && this.adapter.removeClass(l.SCROLL_DIVIDER_FOOTER) : this.adapter.addClass(l.SCROLL_DIVIDER_FOOTER);
     }, e;
   })(ae)
 );
@@ -380,7 +380,7 @@ var f = Gt.strings, ye = (
       try {
         for (var u = ie(this.buttons), h = u.next(); !h.done; h = u.next()) {
           var O = h.value;
-          this.buttonRipples.push(new se(O));
+          this.buttonRipples.push(new le(O));
         }
       } catch (_) {
         n = { error: _ };
@@ -417,7 +417,7 @@ var f = Gt.strings, ye = (
           return t.root.classList.add(i);
         },
         areButtonsStacked: function() {
-          return ve(t.buttons);
+          return Ee(t.buttons);
         },
         clickDefaultButton: function() {
           t.defaultButton && t.defaultButton.click();
@@ -428,7 +428,7 @@ var f = Gt.strings, ye = (
         getActionFromEvent: function(i) {
           if (!i.target)
             return "";
-          var a = le(i.target, "[" + f.ACTION_ATTRIBUTE + "]");
+          var a = se(i.target, "[" + f.ACTION_ATTRIBUTE + "]");
           return a && a.getAttribute(f.ACTION_ATTRIBUTE);
         },
         getInitialFocusEl: function() {
@@ -479,7 +479,7 @@ var f = Gt.strings, ye = (
           return Ce(t.content);
         },
         isScrollableContentAtBottom: function() {
-          return Ee(t.content);
+          return ve(t.content);
         },
         registerWindowEventHandler: function(i, a) {
           window.addEventListener(i, a);
@@ -499,163 +499,163 @@ var f = Gt.strings, ye = (
    *
    * Defaults to **null**.
    */
-  actionButton: l.node,
+  actionButton: s.node,
   /**
    * Button for any navigating to the previous page in a Directional modal.
    *
    * Defaults to **null**.
    */
-  backButton: l.node,
+  backButton: s.node,
   /**
    * The custom modal label badge to be rendered.
    *
    * Defaults to **undefined**.
    */
-  badge: l.node,
+  badge: s.node,
   /**
    * Accepts any valid markup. Optionally, `content` may be used instead. If `content` and `children` are both set, `content` will take priority.
    *
    * Defaults to **null**.
    */
-  children: l.node,
+  children: s.node,
   /**
    * Primary content of the dialog. Accepts any valid markup. Optionally, `children` may be used instead. If content and `children` are both set, content will take priority.
    *
    * Defaults to **null**.
    */
-  content: l.node,
+  content: s.node,
   /**
    * Button that is the default action, triggered by pressing the Enter key.
    *
    * Defaults to **'primary'**.
    */
-  defaultButton: l.oneOf(["close", "primary", "action", "footerSupplemental"]),
+  defaultButton: s.oneOf(["close", "primary", "action", "footerSupplemental"]),
   /**
    * Button to cancel or close the modal.
    *
    * Defaults to **null**.
    */
-  dismissiveButton: l.node,
+  dismissiveButton: s.node,
   /**
    * Button to be displayed in left corner of the modal footer. Should be a text button.
    *
    * Defaults to **null**.
    */
-  footerSupplemental: l.node,
+  footerSupplemental: s.node,
   /**
    * Content to be displayed in right corner of the modal header. Should be a text button or a group of up to 3 icon buttons.
    *
    * Defaults to **null**.
    */
-  headerActions: l.node,
+  headerActions: s.node,
   /**
    * If true, the close icon in the upper left corner will not be rendered.
    *
    * Defaults to **false**.
    */
-  hideCloseIcon: l.bool,
+  hideCloseIcon: s.bool,
   /**
    * A slot for StepperIndicator.
    *
    * Defaults to **null**.
    */
-  indicator: l.node,
+  indicator: s.node,
   /**
    * Button to initially focus on after the dialog has opened. If left null, the initial focus will be on the first focusable element in the modal. As an alternative you can add the prop `data-mdc-dialog-initial-focus='true'` to any element within the modal to make that element the initial focus. If it is a directional modal, the initial focus will be on the nextButton.
    *
    * Defaults to **null**.
    */
-  initialFocus: l.oneOf(["null", "primary", "action", "footerSupplemental"]),
+  initialFocus: s.oneOf(["null", "primary", "action", "footerSupplemental"]),
   /**
    * If true, the buttons in the footer will be full width and stacked on mobile.
    *
    * Defaults to **false**.
    */
-  mobileStackedButtons: l.bool,
+  mobileStackedButtons: s.bool,
   /**
    * String to determine the size of the modal.
    *
    * Defaults to **'max'**.
    */
-  modalSize: l.oneOf(["fullscreen", "max", "xlarge", "large", "medium", "small", "dialog"]),
+  modalSize: s.oneOf(["fullscreen", "max", "xlarge", "large", "medium", "small", "dialog"]),
   /**
    * Button for navigating to the next page in a Directional modal or closing on the last page.
    *
    * Defaults to **null**.
    */
-  nextButton: l.node,
+  nextButton: s.node,
   /**
    * Set to true if the modal will not have any actions. Should be used sparingly and the modal should be closed programmatically. For example, can be used to stop the user from interacting or navigating away while a payment is processing.
    *
    * Defaults to **null**.
    */
-  noActions: l.bool,
+  noActions: s.bool,
   /**
    * Fired when the Dialog begins its closing animation. Where event.detail.action is the action which closed the dialog (close or accept).
    *
    * Defaults to **null**.
    */
-  onClose: l.func,
+  onClose: s.func,
   /**
    * Fired when the Dialog finishes its closing animation. Where event.detail.action is the action which closed the dialog (close or accept).
    *
    * Defaults to **null**.
    */
-  onClosed: l.func,
+  onClosed: s.func,
   /**
    * Fired when the Dialog begins its opening animation.
    *
    * Defaults to **null**.
    */
-  onOpen: l.func,
+  onOpen: s.func,
   /**
    * Fired when the Dialog finishes its opening animation.
    *
    * Defaults to **null**.
    */
-  onOpened: l.func,
+  onOpened: s.func,
   /**
    * If true, the Modal will be visible on screen.
    *
    * Defaults to **false**.
    */
-  open: l.bool,
+  open: s.bool,
   /**
    * Prevents the user from closing the dialog by hitting escape or clicking the scrim. Use caution when using this as the modal should always have a way for the user to close it.
    *
    * Defaults to **false**.
    */
-  preventClose: l.bool,
+  preventClose: s.bool,
   /**
    * Prevents the default behavior which adds an event listener for the Enter key to the Primary button. Any onEnter/submission behavior will need to be added by the developer (including closing the Modal).
    *
    * Defaults to **false**.
    */
-  preventPrimaryAccept: l.bool,
+  preventPrimaryAccept: s.bool,
   /**
    * Button for the primary action of the modal.
    *
    * Defaults to **null**.
    */
-  primaryButton: l.node,
+  primaryButton: s.node,
   /**
    * DOM selector to provide a target to return focus. Accepts any valid _query_ (see mdn docs for Element.querySelector). If omitted focus will return to the last focused element upon closing.
    *
    * Defaults to **null**.
    */
-  returnFocusSelector: l.string,
+  returnFocusSelector: s.string,
   /**
    * If true, wrapping will be disabled and a scrollable area will be created.
    *
    * Defaults to **false**.
    */
-  scrollable: l.bool,
+  scrollable: s.bool,
   /**
    * String for the modal title.
    *
    * Defaults to **null**.
    */
-  title: l.string
+  title: s.string
 }, Ae = {
   actionButton: null,
   backButton: null,
@@ -685,58 +685,58 @@ var f = Gt.strings, ye = (
   scrollable: !1,
   title: null
 }, Te = ["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"], r = Ae, ot = /* @__PURE__ */ Zt(function(o, e) {
-  var t = o.actionButton, n = t === void 0 ? r.actionButton : t, i = o.actionIcons, a = i === void 0 ? r.actionIcons : i, u = o.badge, h = u === void 0 ? r.badge : u, O = o.backButton, _ = O === void 0 ? r.backButton : O, S = o.children, F = S === void 0 ? r.children : S, T = o.className, K = T === void 0 ? r.className : T, v = o.content, L = v === void 0 ? r.content : v, 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, st = o.headerActions, lt = st === void 0 ? r.headerActions : st, ct = o.hideCloseIcon, W = ct === void 0 ? r.hideCloseIcon : ct, dt = o.indicator, Kt = dt === void 0 ? r.indicator : dt, ut = o.initialFocus, I = ut === void 0 ? r.initialFocus : ut, mt = o.mobileStackedButtons, V = 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, z = gt === void 0 ? r.onClose : gt, _t = o.onClosed, j = _t === void 0 ? r.onClosed : _t, Ct = o.onOpen, k = Ct === void 0 ? r.onOpen : Ct, Et = o.onOpened, M = Et === void 0 ? r.onOpened : Et, vt = o.open, St = vt === void 0 ? r.open : vt, yt = o.preventClose, q = yt === void 0 ? r.preventClose : yt, Ot = o.preventPrimaryAccept, At = Ot === void 0 ? r.preventPrimaryAccept : Ot, Tt = o.primaryButton, d = Tt === void 0 ? r.primaryButton : Tt, bt = o.returnFocusSelector, Y = bt === void 0 ? r.returnFocusSelector : bt, It = o.scrollable, Nt = It === void 0 ? r.scrollable : It, Bt = o.title, Dt = Bt === void 0 ? r.title : Bt, Wt = Qt(o, Te), P = Mt(), c = Mt();
+  var t = o.actionButton, n = t === void 0 ? r.actionButton : t, i = o.actionIcons, a = i === void 0 ? r.actionIcons : i, u = o.badge, h = u === void 0 ? r.badge : u, 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, dt = o.indicator, Kt = dt === void 0 ? r.indicator : dt, ut = o.initialFocus, I = ut === void 0 ? r.initialFocus : ut, 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, Tt = o.primaryButton, d = Tt === void 0 ? r.primaryButton : Tt, bt = o.returnFocusSelector, J = bt === void 0 ? r.returnFocusSelector : bt, It = o.scrollable, Nt = It === void 0 ? r.scrollable : It, Bt = o.title, Dt = Bt === void 0 ? r.title : Bt, Wt = Qt(o, Te), P = Mt(), c = Mt();
   te(e, function() {
     return P.current;
   }, []);
-  var Vt = Pt(), Ft = kt(Vt, 2), J = Ft[0], zt = Ft[1], jt = Pt(function() {
+  var Vt = Pt(), Ft = kt(Vt, 2), Q = Ft[0], zt = Ft[1], jt = Pt(function() {
     return N || _;
-  }), Lt = kt(jt, 2), Q = Lt[0], qt = Lt[1];
-  E(function() {
+  }), Lt = kt(jt, 2), X = Lt[0], qt = Lt[1];
+  v(function() {
     qt(N || _);
   }, [N, _]);
   var H = Z(function() {
     Ht() && zt(window.innerWidth <= 600);
   }, []);
-  E(function() {
+  v(function() {
     return Ht() ? (H(), window.addEventListener("resize", H), function() {
       window.removeEventListener("resize", H);
     }) : function() {
     };
-  }, [H]), E(function() {
+  }, [H]), v(function() {
     return c.current = ye.attachTo(P.current), function() {
       c.current.destroy();
     };
-  }, [c, P]), E(function() {
-    c.current.foundation.setAutoStackButtons(V);
-  }, [V]), E(function() {
+  }, [c, P]), v(function() {
+    c.current.foundation.setAutoStackButtons(z);
+  }, [z]), v(function() {
     B && (c.current.foundation.adapter.trapFocus = function() {
     });
-  }, [B]), E(function() {
-    c.current.scrimClickAction = q ? "" : "close", c.current.escapeKeyAction = q ? "" : "close";
-  }, [q]);
+  }, [B]), v(function() {
+    c.current.scrimClickAction = Y ? "" : "close", c.current.escapeKeyAction = Y ? "" : "close";
+  }, [Y]);
   var x = Z(function(p) {
-    z && z(p);
-  }, [z]), $ = Z(function(p) {
-    Y && ne(Y), j && j(p);
-  }, [Y, j]);
-  E(function() {
+    j && j(p);
+  }, [j]), $ = Z(function(p) {
+    J && ne(J), q && q(p);
+  }, [J, q]);
+  v(function() {
     return c.current.unlisten("MDCDialog: opening", k), c.current.listen("MDCDialog: opening", k), function() {
       c.current.unlisten("MDCDialog: opening", k);
     };
-  }, [c, k]), E(function() {
+  }, [c, k]), v(function() {
     return c.current.unlisten("MDCDialog:opened", M), c.current.listen("MDCDialog:opened", M), function() {
       c.current.unlisten("MDCDialog:opened", M);
     };
-  }, [c, M]), E(function() {
+  }, [c, M]), v(function() {
     return c.current.unlisten("MDCDialog:closing", x), c.current.listen("MDCDialog:closing", x), function() {
       c.current.unlisten("MDCDialog:closing", x);
     };
-  }, [c, x]), E(function() {
+  }, [c, x]), v(function() {
     return c.current.unlisten("MDCDialog:closed", $), c.current.listen("MDCDialog:closed", $), function() {
       c.current.unlisten("MDCDialog:closed", $);
     };
-  }, [c, $]), E(function() {
+  }, [c, $]), v(function() {
     St ? c.current.open() : c.current.close();
   }, [c, St]);
   var Yt = nt(function() {
@@ -761,21 +761,21 @@ var f = Gt.strings, ye = (
   }, [At, b, I, d?.props.elevation, d?.props.variant]);
   return /* @__PURE__ */ m.createElement("aside", Xt({
     ref: P,
-    className: U("lmnt", "lmnt-modal", "mdc-dialog", Nt && "lmnt-modal--scrollable mdc-dialog--scrollable", K),
+    className: G("lmnt", "lmnt-modal", "mdc-dialog", Nt && "lmnt-modal--scrollable mdc-dialog--scrollable", W),
     role: "alertdialog"
   }, Wt), /* @__PURE__ */ m.createElement("div", {
-    className: U("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" || J) && "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", B && "lmnt-modal-no-actions")
   }, /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-modal__surface mdc-dialog__surface"
   }, /* @__PURE__ */ m.createElement("header", {
-    className: U("lmnt-modal__title", "mdc-dialog__title", (C === "dialog" || W) && "lmnt-modal_title-hide-close-icon", a && "lmnt-modal_title-actionsIcons", Nt && "lmnt-modal__title-scrollable", (W || C === "dialog" || B) && "lmnt-modal--no-close-icon")
-  }, !W && C !== "dialog" && !B && /* @__PURE__ */ m.createElement($t, {
+    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($t, {
     className: "mdc-icon-button material-icons mdc-dialog__close",
     "data-mdc-dialog-action": "close",
     icon: "clear"
-  }), Dt && /* @__PURE__ */ m.createElement("div", null, Dt), lt && /* @__PURE__ */ m.createElement("div", {
+  }), Dt && /* @__PURE__ */ m.createElement("div", null, Dt), st && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__title-actions"
-  }, lt), h && /* @__PURE__ */ m.createElement("div", {
+  }, st), h && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-badge--modal",
     style: {
       marginLeft: "0"
@@ -783,19 +783,19 @@ var f = Gt.strings, ye = (
   }, h)), (L || F) && /* @__PURE__ */ m.createElement("section", {
     className: "lmnt-modal__content mdc-dialog__content"
   }, L || F), Kt, (n || _ || R || N || d || w) && /* @__PURE__ */ m.createElement("footer", {
-    className: U("lmnt-modal__actions", "mdc-dialog__actions", J && "lmnt-dialog__actions__mobile", w && "lmnt-modal__actions--supplemental-btn", J && V && "lmnt-modal_actions-mobile-stacked")
-  }, !Q && w && /* @__PURE__ */ m.createElement("div", {
+    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 b === "footerSupplemental" && (p["data-mdc-dialog-button-default"] = !0), I === "footerSupplemental" && (p["data-mdc-dialog-initial-focus"] = !0), p;
-  })), !Q && (n || R || d) && /* @__PURE__ */ m.createElement("div", {
+  })), !X && (n || R || d) && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-dialog__actions__right-align lmnt-modal_actions_button"
   }, R && D(R, {
     variant: "text",
     className: "lmnt-modal__button mdc-dialog__button",
     "data-mdc-dialog-action": "close"
-  }), n && !d && D(n, Yt), d && D(d, Jt)), Q && /* @__PURE__ */ m.createElement("div", {
+  }), n && !d && D(n, Yt), d && D(d, Jt)), X && /* @__PURE__ */ m.createElement("div", {
     className: "lmnt-modal_actions_button lmnt-dialog__actions__directional"
   }, /* @__PURE__ */ m.createElement("div", null, oe(_, "lmnt-modal__button")), /* @__PURE__ */ m.createElement("div", null, D(N, {
     className: "lmnt-modal__button",
@@ -806,7 +806,7 @@ var f = Gt.strings, ye = (
 });
 ot.displayName = "Modal";
 ot.propTypes = Oe;
-const be = "_modal_1yn30_1", Ie = "_gap_1yn30_14", Ne = "_title_1yn30_18", Be = "_titleWithoutCloseIcon_1yn30_31", De = "_closeButton_1yn30_35", Fe = "_errorBanner_1yn30_47", y = {
+const be = "_modal_lk11w_1", Ie = "_gap_lk11w_14", Ne = "_title_lk11w_19", Be = "_titleWithoutCloseIcon_lk11w_32", De = "_closeButton_lk11w_36", Fe = "_errorBanner_lk11w_48", y = {
   modal: be,
   gap: Ie,
   title: Ne,
@@ -827,11 +827,11 @@ const be = "_modal_1yn30_1", Ie = "_gap_1yn30_14", Ne = "_title_1yn30_18", Be =
   errorBannerProps: { hasError: S, ...F } = { hasError: !1 },
   ...T
 }) => {
-  const K = nt(() => {
-    const v = {
+  const W = nt(() => {
+    const E = {
       id: "base",
-      action: /* @__PURE__ */ Rt(
-        X,
+      action: /* @__PURE__ */ wt(
+        U,
         {
           primaryAlign: "center",
           secondaryAlign: "center",
@@ -846,7 +846,7 @@ const be = "_modal_1yn30_1", Ie = "_gap_1yn30_14", Ne = "_title_1yn30_18", Be =
                 className: y.closeButton
               }
             ),
-            u ? /* @__PURE__ */ g(ue, { customPadding: "0.25rem 0 0 0.75rem", children: /* @__PURE__ */ g(pe, { icon: u }) }) : /* @__PURE__ */ g(wt, {}),
+            u ? /* @__PURE__ */ g(ue, { customPadding: "0.25rem 0 0 0.75rem", children: /* @__PURE__ */ g(pe, { icon: u }) }) : /* @__PURE__ */ g(Rt, {}),
             /* @__PURE__ */ g(
               me,
               {
@@ -860,13 +860,13 @@ const be = "_modal_1yn30_1", Ie = "_gap_1yn30_14", Ne = "_title_1yn30_18", Be =
         "base-group"
       )
     };
-    if (!t) return [v];
-    if (!Array.isArray(t)) return [v, { id: "action", action: t }];
+    if (!t) return [E];
+    if (!Array.isArray(t)) return [E, { id: "action", action: t }];
     const L = {
       id: "action-group",
-      action: /* @__PURE__ */ g(X, { className: y.gap, children: t }, "action-group")
+      action: /* @__PURE__ */ g(U, { className: y.gap, children: t }, "action-group")
     };
-    return [v, L];
+    return [E, L];
   }, [t, i, a, u, o, e]);
   return /* @__PURE__ */ g(
     ot,
@@ -876,12 +876,12 @@ const be = "_modal_1yn30_1", Ie = "_gap_1yn30_14", Ne = "_title_1yn30_18", Be =
       className: `${y.modal} ${y.title} ${T.className ?? ""}`,
       hideCloseIcon: !0,
       actionButton: n,
-      headerActions: /* @__PURE__ */ g(X, { primaryAlign: "space-between", secondaryAlign: "center", children: K.map((v) => /* @__PURE__ */ g(ee, { children: v.action }, v.id)) }, "header-group"),
+      headerActions: /* @__PURE__ */ wt(U, { fullWidth: !0, gap: "none", direction: "vertical", children: [
+        /* @__PURE__ */ g(U, { fullWidth: !0, primaryAlign: "space-between", secondaryAlign: "center", children: W.map((E) => /* @__PURE__ */ g(ee, { children: E.action }, E.id)) }),
+        S && /* @__PURE__ */ g("div", { className: y.errorBanner, children: /* @__PURE__ */ g(fe, { ...F, isOpen: S }) })
+      ] }, "header-group"),
       preventClose: !0,
-      children: h ? /* @__PURE__ */ Rt(wt, { children: [
-        S && /* @__PURE__ */ g("div", { className: y.errorBanner, children: /* @__PURE__ */ g(fe, { ...F, isOpen: S }) }),
-        _
-      ] }) : /* @__PURE__ */ g(he, { ...O })
+      children: h ? /* @__PURE__ */ g(Rt, { children: _ }) : /* @__PURE__ */ g(he, { ...O })
     }
   );
 };

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.22.0",
+  "version": "2.23.1",
   "type": "module",
   "repository": "https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared",
   "author": "Falk Menge <falk.menge.ext@bayer.com>",