@spteck/react-controls-v2 2.3.2 → 2.3.4

package/dist/{index-DA12LU30.js → index-CETgsuge.js}

@@ -11304,6 +11304,7 @@ const SelectView = ({
   defaultKey,
   label,
   options: baseOptions = [],
+  minWidth,
   styles: styles2
 }) => {
   const [options, setOptions] = useState(() => {
@@ -11328,7 +11329,7 @@ const SelectView = ({
   }, [options, onChange]);
   return /* @__PURE__ */ jsxs$1(StackV2, { gap: "s", children: [
     label && /* @__PURE__ */ jsx$2(Label, { children: label }),
-    /* @__PURE__ */ jsx$2(ButtonMenu, { options, onSelected: handleSelect, styles: styles2 ?? {} })
+    /* @__PURE__ */ jsx$2(ButtonMenu, { options, onSelected: handleSelect, styles: minWidth ? { minWidth } : styles2 ?? {} })
   ] });
 };
 const useSelectTimeStyles = () => {
@@ -12170,7 +12171,7 @@ const DataGridV2 = React.forwardRef((props, ref) => {
     []
   );
   return /* @__PURE__ */ jsxs$1("div", { style: hostStyle, className: scrollbarClassName, children: [
-    isLoadingData && /* @__PURE__ */ jsx$2("div", { style: { display: "flex", gap: 8, alignItems: "center", padding: 8 }, children: React.isValidElement(isLoadingDataMessage) ? isLoadingDataMessage : /* @__PURE__ */ jsxs$1(Spinner, { size: "extra-tiny", children: [
+    isLoadingData && /* @__PURE__ */ jsx$2(StackV2, { alignItems: "center", justifyContent: "center", height: `${virtualizedHeight}px`, children: React.isValidElement(isLoadingDataMessage) ? isLoadingDataMessage : /* @__PURE__ */ jsxs$1(Spinner, { size: "extra-tiny", children: [
       " ",
       isLoadingDataMessage ?? "Loading data...",
       " "
@@ -12322,6 +12323,70 @@ const RenderDrawer = (props) => {
     }
   );
 };
+const RenderHeader = (props) => {
+  const { onDismiss, title, description, icon: icon2, showCloseButton = true } = props;
+  return /* @__PURE__ */ jsxs$1(StackV2, { direction: "vertical", width: "100%", children: [
+    /* @__PURE__ */ jsxs$1(StackV2, { direction: "horizontal", padding: "s", gap: "l", justifyContent: "space-between", children: [
+      /* @__PURE__ */ jsxs$1(StackV2, { direction: "horizontal", alignItems: "center", width: "100%", children: [
+        React.isValidElement(icon2) ? icon2 : /* @__PURE__ */ jsx$2(Icon, { icon: icon2 }),
+        /* @__PURE__ */ jsxs$1(
+          StackV2,
+          {
+            direction: "vertical",
+            justifyContent: "flex-start",
+            alignItems: "flex-start",
+            paddingLeft: "s",
+            paddingRight: "l",
+            width: "100%",
+            children: [
+              React.isValidElement(title) ? title : /* @__PURE__ */ jsx$2(
+                Subtitle1,
+                {
+                  style: {
+                    display: "-webkit-box",
+                    WebkitLineClamp: 1,
+                    WebkitBoxOrient: "vertical",
+                    textAlign: "start",
+                    textOverflow: "ellipsis",
+                    wordBreak: "break-word"
+                  },
+                  children: title
+                }
+              ),
+              React.isValidElement(description) ? description : /* @__PURE__ */ jsx$2(
+                Caption1,
+                {
+                  style: {
+                    display: "-webkit-box",
+                    WebkitLineClamp: 4,
+                    WebkitBoxOrient: "vertical",
+                    textAlign: "start",
+                    textOverflow: "ellipsis",
+                    wordBreak: "break-word"
+                  },
+                  children: description
+                }
+              )
+            ]
+          }
+        )
+      ] }),
+      showCloseButton && /* @__PURE__ */ jsx$2(
+        Button,
+        {
+          appearance: "subtle",
+          onClick: (ev) => {
+            ev.stopPropagation();
+            ev.preventDefault();
+            onDismiss(false);
+          },
+          icon: /* @__PURE__ */ jsx$2(Dismiss24Regular, {})
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx$2(Divider, { style: { marginTop: 6 } })
+  ] });
+};
 const useRenderHeaderStyles = () => {
   return {
     closeButton: css$1({
@@ -12401,36 +12466,6 @@ const useRenderHeaderStyles = () => {
     })
   };
 };
-const RenderHeader = (props) => {
-  const { onDismiss, title, description, icon: icon2, showCloseButton = true } = props;
-  const styles2 = useRenderHeaderStyles();
-  return /* @__PURE__ */ jsx$2(Fragment, { children: /* @__PURE__ */ jsxs$1("div", { id: "RenderHedaermain", className: styles2.renderHeaderContent, children: [
-    /* @__PURE__ */ jsxs$1("div", { className: styles2.renderHeaderHeader, children: [
-      /* @__PURE__ */ jsx$2(
-        Button,
-        {
-          style: { display: showCloseButton ? "block" : "none" },
-          appearance: "subtle",
-          className: styles2.closeButton,
-          onClick: (ev) => {
-            ev.stopPropagation();
-            ev.preventDefault();
-            onDismiss(false);
-          },
-          icon: /* @__PURE__ */ jsx$2(Dismiss24Regular, {})
-        }
-      ),
-      /* @__PURE__ */ jsxs$1("div", { className: styles2.renderHeaderTitleContainer, children: [
-        React.isValidElement(icon2) ? icon2 : /* @__PURE__ */ jsx$2(Icon, { icon: icon2 }),
-        /* @__PURE__ */ jsxs$1("div", { className: styles2.dialogTitleAndDescriptionContainer, children: [
-          React.isValidElement(title) ? title : /* @__PURE__ */ jsx$2(Subtitle1, { className: styles2.renderHeaderTitle, children: title }),
-          React.isValidElement(description) ? description : /* @__PURE__ */ jsx$2(Caption1, { className: styles2.renderHeaderDescription, children: description })
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx$2("div", { className: styles2.divider })
-  ] }) });
-};
 const ShareDialog = ({ isOpen, options, onClose }) => {
   const { log: log3 } = useLogging();
   const [dialogUrl, setDialogUrl] = useState(void 0);
@@ -13514,7 +13549,7 @@ function _Map(props, ref) {
     const mapLib = props.mapLib;
     let isMounted = true;
     let maplibre;
-    Promise.resolve(mapLib || import("./maplibre-gl-0cvSldGe.js").then((n2) => n2.m)).then((module2) => {
+    Promise.resolve(mapLib || import("./maplibre-gl-C5G61B1R.js").then((n2) => n2.m)).then((module2) => {
       if (!isMounted) {
         return;
       }
@@ -50809,12 +50844,12 @@ var registerDefaultLayoutLoaders = /* @__PURE__ */ __name(() => {
   registerLayoutLoaders([
     {
       name: "dagre",
-      loader: /* @__PURE__ */ __name(async () => await import("./dagre-6UL2VRFP-m--0YRvK.js"), "loader")
+      loader: /* @__PURE__ */ __name(async () => await import("./dagre-6UL2VRFP-Da6he8wj.js"), "loader")
     },
     ...[
       {
         name: "cose-bilkent",
-        loader: /* @__PURE__ */ __name(async () => await import("./cose-bilkent-S5V4N54A-9pkFbvgi.js"), "loader")
+        loader: /* @__PURE__ */ __name(async () => await import("./cose-bilkent-S5V4N54A-DIW6cHaA.js"), "loader")
       }
     ]
   ]);
@@ -51224,7 +51259,7 @@ var detector = /* @__PURE__ */ __name((txt) => {
   return /^\s*C4Context|C4Container|C4Component|C4Dynamic|C4Deployment/.test(txt);
 }, "detector");
 var loader = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./c4Diagram-YG6GDRKO-DR7HVzsX.js");
+  const { diagram: diagram2 } = await import("./c4Diagram-YG6GDRKO-DRgrmnvW.js");
   return { id, diagram: diagram2 };
 }, "loader");
 var plugin = {
@@ -51242,7 +51277,7 @@ var detector2 = /* @__PURE__ */ __name((txt, config2) => {
   return /^\s*graph/.test(txt);
 }, "detector");
 var loader2 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./flowDiagram-NV44I4VS-C2EzUtAD.js");
+  const { diagram: diagram2 } = await import("./flowDiagram-NV44I4VS-DaUzAL5R.js");
   return { id: id2, diagram: diagram2 };
 }, "loader");
 var plugin2 = {
@@ -51266,7 +51301,7 @@ var detector3 = /* @__PURE__ */ __name((txt, config2) => {
   return /^\s*flowchart/.test(txt);
 }, "detector");
 var loader3 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./flowDiagram-NV44I4VS-C2EzUtAD.js");
+  const { diagram: diagram2 } = await import("./flowDiagram-NV44I4VS-DaUzAL5R.js");
   return { id: id3, diagram: diagram2 };
 }, "loader");
 var plugin3 = {
@@ -51280,7 +51315,7 @@ var detector4 = /* @__PURE__ */ __name((txt) => {
   return /^\s*erDiagram/.test(txt);
 }, "detector");
 var loader4 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./erDiagram-Q2GNP2WA-eJvs0oKG.js");
+  const { diagram: diagram2 } = await import("./erDiagram-Q2GNP2WA-D8Sg8nlt.js");
   return { id: id4, diagram: diagram2 };
 }, "loader");
 var plugin4 = {
@@ -51294,7 +51329,7 @@ var detector5 = /* @__PURE__ */ __name((txt) => {
   return /^\s*gitGraph/.test(txt);
 }, "detector");
 var loader5 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./gitGraphDiagram-V2S2FVAM-DfqsY2SX.js");
+  const { diagram: diagram2 } = await import("./gitGraphDiagram-V2S2FVAM-CQEoGpjf.js");
   return { id: id5, diagram: diagram2 };
 }, "loader");
 var plugin5 = {
@@ -51308,7 +51343,7 @@ var detector6 = /* @__PURE__ */ __name((txt) => {
   return /^\s*gantt/.test(txt);
 }, "detector");
 var loader6 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./ganttDiagram-JELNMOA3-P58sdJza.js");
+  const { diagram: diagram2 } = await import("./ganttDiagram-JELNMOA3-DcOeBpn4.js");
   return { id: id6, diagram: diagram2 };
 }, "loader");
 var plugin6 = {
@@ -51322,7 +51357,7 @@ var detector7 = /* @__PURE__ */ __name((txt) => {
   return /^\s*info/.test(txt);
 }, "detector");
 var loader7 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./infoDiagram-HS3SLOUP-Cl2XyVWg.js");
+  const { diagram: diagram2 } = await import("./infoDiagram-HS3SLOUP-KCAsmgJE.js");
   return { id: id7, diagram: diagram2 };
 }, "loader");
 var info = {
@@ -51335,7 +51370,7 @@ var detector8 = /* @__PURE__ */ __name((txt) => {
   return /^\s*pie/.test(txt);
 }, "detector");
 var loader8 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./pieDiagram-ADFJNKIX-B2BrCqvZ.js");
+  const { diagram: diagram2 } = await import("./pieDiagram-ADFJNKIX-DAohat6Q.js");
   return { id: id8, diagram: diagram2 };
 }, "loader");
 var pie = {
@@ -51348,7 +51383,7 @@ var detector9 = /* @__PURE__ */ __name((txt) => {
   return /^\s*quadrantChart/.test(txt);
 }, "detector");
 var loader9 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./quadrantDiagram-AYHSOK5B-ogZJFMK-.js");
+  const { diagram: diagram2 } = await import("./quadrantDiagram-AYHSOK5B-XSGfAUKZ.js");
   return { id: id9, diagram: diagram2 };
 }, "loader");
 var plugin7 = {
@@ -51362,7 +51397,7 @@ var detector10 = /* @__PURE__ */ __name((txt) => {
   return /^\s*xychart(-beta)?/.test(txt);
 }, "detector");
 var loader10 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./xychartDiagram-PRI3JC2R-DGqRjNYl.js");
+  const { diagram: diagram2 } = await import("./xychartDiagram-PRI3JC2R-CUckmD0J.js");
   return { id: id10, diagram: diagram2 };
 }, "loader");
 var plugin8 = {
@@ -51376,7 +51411,7 @@ var detector11 = /* @__PURE__ */ __name((txt) => {
   return /^\s*requirement(Diagram)?/.test(txt);
 }, "detector");
 var loader11 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./requirementDiagram-UZGBJVZJ-8JU4oole.js");
+  const { diagram: diagram2 } = await import("./requirementDiagram-UZGBJVZJ-C7q8gWYu.js");
   return { id: id11, diagram: diagram2 };
 }, "loader");
 var plugin9 = {
@@ -51390,7 +51425,7 @@ var detector12 = /* @__PURE__ */ __name((txt) => {
   return /^\s*sequenceDiagram/.test(txt);
 }, "detector");
 var loader12 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./sequenceDiagram-WL72ISMW-OHkQEU2A.js");
+  const { diagram: diagram2 } = await import("./sequenceDiagram-WL72ISMW-Bqn6BXj6.js");
   return { id: id12, diagram: diagram2 };
 }, "loader");
 var plugin10 = {
@@ -51408,7 +51443,7 @@ var detector13 = /* @__PURE__ */ __name((txt, config2) => {
   return /^\s*classDiagram/.test(txt);
 }, "detector");
 var loader13 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./classDiagram-2ON5EDUG-D-GPLgqe.js");
+  const { diagram: diagram2 } = await import("./classDiagram-2ON5EDUG-CyLcEoBr.js");
   return { id: id13, diagram: diagram2 };
 }, "loader");
 var plugin11 = {
@@ -51426,7 +51461,7 @@ var detector14 = /* @__PURE__ */ __name((txt, config2) => {
   return /^\s*classDiagram-v2/.test(txt);
 }, "detector");
 var loader14 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./classDiagram-v2-WZHVMYZB-D-GPLgqe.js");
+  const { diagram: diagram2 } = await import("./classDiagram-v2-WZHVMYZB-CyLcEoBr.js");
   return { id: id14, diagram: diagram2 };
 }, "loader");
 var plugin12 = {
@@ -51444,7 +51479,7 @@ var detector15 = /* @__PURE__ */ __name((txt, config2) => {
   return /^\s*stateDiagram/.test(txt);
 }, "detector");
 var loader15 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./stateDiagram-FKZM4ZOC-D2BpasUv.js");
+  const { diagram: diagram2 } = await import("./stateDiagram-FKZM4ZOC-fHNw0sVL.js");
   return { id: id15, diagram: diagram2 };
 }, "loader");
 var plugin13 = {
@@ -51465,7 +51500,7 @@ var detector16 = /* @__PURE__ */ __name((txt, config2) => {
   return false;
 }, "detector");
 var loader16 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./stateDiagram-v2-4FDKWEC3-DFtkNO2o.js");
+  const { diagram: diagram2 } = await import("./stateDiagram-v2-4FDKWEC3-DWs2uxMI.js");
   return { id: id16, diagram: diagram2 };
 }, "loader");
 var plugin14 = {
@@ -51479,7 +51514,7 @@ var detector17 = /* @__PURE__ */ __name((txt) => {
   return /^\s*journey/.test(txt);
 }, "detector");
 var loader17 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./journeyDiagram-XKPGCS4Q-IcmQHEEF.js");
+  const { diagram: diagram2 } = await import("./journeyDiagram-XKPGCS4Q-CGzALTqL.js");
   return { id: id17, diagram: diagram2 };
 }, "loader");
 var plugin15 = {
@@ -51547,7 +51582,7 @@ var detector18 = /* @__PURE__ */ __name((txt, config2 = {}) => {
   return false;
 }, "detector");
 var loader18 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./flowDiagram-NV44I4VS-C2EzUtAD.js");
+  const { diagram: diagram2 } = await import("./flowDiagram-NV44I4VS-DaUzAL5R.js");
   return { id: id18, diagram: diagram2 };
 }, "loader");
 var plugin16 = {
@@ -51561,7 +51596,7 @@ var detector19 = /* @__PURE__ */ __name((txt) => {
   return /^\s*timeline/.test(txt);
 }, "detector");
 var loader19 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./timeline-definition-IT6M3QCI-3zejr2tI.js");
+  const { diagram: diagram2 } = await import("./timeline-definition-IT6M3QCI-BF_dzRS8.js");
   return { id: id19, diagram: diagram2 };
 }, "loader");
 var plugin17 = {
@@ -51575,7 +51610,7 @@ var detector20 = /* @__PURE__ */ __name((txt) => {
   return /^\s*mindmap/.test(txt);
 }, "detector");
 var loader20 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./mindmap-definition-VGOIOE7T-D4GTeD4Z.js");
+  const { diagram: diagram2 } = await import("./mindmap-definition-VGOIOE7T-2iOF0f72.js");
   return { id: id20, diagram: diagram2 };
 }, "loader");
 var plugin18 = {
@@ -51589,7 +51624,7 @@ var detector21 = /* @__PURE__ */ __name((txt) => {
   return /^\s*kanban/.test(txt);
 }, "detector");
 var loader21 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./kanban-definition-3W4ZIXB7-B4sGmttl.js");
+  const { diagram: diagram2 } = await import("./kanban-definition-3W4ZIXB7-Dq8e_cfm.js");
   return { id: id21, diagram: diagram2 };
 }, "loader");
 var plugin19 = {
@@ -51603,7 +51638,7 @@ var detector22 = /* @__PURE__ */ __name((txt) => {
   return /^\s*sankey(-beta)?/.test(txt);
 }, "detector");
 var loader22 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./sankeyDiagram-TZEHDZUN-BpODVO08.js");
+  const { diagram: diagram2 } = await import("./sankeyDiagram-TZEHDZUN-RTI570KO.js");
   return { id: id22, diagram: diagram2 };
 }, "loader");
 var plugin20 = {
@@ -51617,7 +51652,7 @@ var detector23 = /* @__PURE__ */ __name((txt) => {
   return /^\s*packet(-beta)?/.test(txt);
 }, "detector");
 var loader23 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./diagram-S2PKOQOG-DnKY-URt.js");
+  const { diagram: diagram2 } = await import("./diagram-S2PKOQOG-CBQCwTZP.js");
   return { id: id23, diagram: diagram2 };
 }, "loader");
 var packet = {
@@ -51630,7 +51665,7 @@ var detector24 = /* @__PURE__ */ __name((txt) => {
   return /^\s*radar-beta/.test(txt);
 }, "detector");
 var loader24 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./diagram-QEK2KX5R--L8OdbhL.js");
+  const { diagram: diagram2 } = await import("./diagram-QEK2KX5R-E6GNHCcV.js");
   return { id: id24, diagram: diagram2 };
 }, "loader");
 var radar = {
@@ -51643,7 +51678,7 @@ var detector25 = /* @__PURE__ */ __name((txt) => {
   return /^\s*block(-beta)?/.test(txt);
 }, "detector");
 var loader25 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./blockDiagram-VD42YOAC-F1ipHfpp.js");
+  const { diagram: diagram2 } = await import("./blockDiagram-VD42YOAC-DZIigsqO.js");
   return { id: id25, diagram: diagram2 };
 }, "loader");
 var plugin21 = {
@@ -51657,7 +51692,7 @@ var detector26 = /* @__PURE__ */ __name((txt) => {
   return /^\s*architecture/.test(txt);
 }, "detector");
 var loader26 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./architectureDiagram-VXUJARFQ-C29B_61g.js");
+  const { diagram: diagram2 } = await import("./architectureDiagram-VXUJARFQ-CKGxF11K.js");
   return { id: id26, diagram: diagram2 };
 }, "loader");
 var architecture = {
@@ -51671,7 +51706,7 @@ var detector27 = /* @__PURE__ */ __name((txt) => {
   return /^\s*treemap/.test(txt);
 }, "detector");
 var loader27 = /* @__PURE__ */ __name(async () => {
-  const { diagram: diagram2 } = await import("./diagram-PSM6KHXK-RuWvU0LU.js");
+  const { diagram: diagram2 } = await import("./diagram-PSM6KHXK-h1PoviE6.js");
   return { id: id27, diagram: diagram2 };
 }, "loader");
 var treemap = {
@@ -55546,4 +55581,4 @@ export {
   getEdgeId as y,
   clear$2 as z
 };
-//# sourceMappingURL=index-DA12LU30.js.map
+//# sourceMappingURL=index-CETgsuge.js.map