@rio-cloud/rio-uikit 2.3.0-beta.1 → 2.3.0-beta.3

package/DayPicker.js

@@ -1,5 +1,9 @@
-import { default as o } from "./components/datepicker/DayPicker.js";
+import { default as a } from "./components/datepicker/DayPicker.js";
+import { default as t } from "./components/datepicker/DayPickerCalendar.js";
+import { supportedDayPickerLocales as p } from "./components/datepicker/dayPickerUtils.js";
 export {
-  o as default
+  t as DayPickerCalendar,
+  a as default,
+  p as supportedDayPickerLocales
 };
 //# sourceMappingURL=DayPicker.js.map

package/DayPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DayPicker.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"DayPicker.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/DayPickerCalendar.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/datepicker/DayPickerCalendar';
+export * from './components/datepicker/DayPickerCalendar';

package/DayPickerCalendar.js

@@ -0,0 +1,5 @@
+import { default as o } from "./components/datepicker/DayPickerCalendar.js";
+export {
+  o as default
+};
+//# sourceMappingURL=DayPickerCalendar.js.map

package/DayPickerCalendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DayPickerCalendar.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/DayPickerPrototype.d.ts

@@ -0,0 +1,2 @@
+export { default } from './components/datepicker/DayPickerPrototype';
+export * from './components/datepicker/DayPickerPrototype';

package/DayPickerPrototype.js

@@ -0,0 +1,5 @@
+import { default as o } from "./components/datepicker/DayPickerPrototype.js";
+export {
+  o as default
+};
+//# sourceMappingURL=DayPickerPrototype.js.map

package/DayPickerPrototype.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DayPickerPrototype.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/Marker.js

@@ -1,8 +1,12 @@
-import { default as r, getOrCreateIcon as a, isDomMakerNeeded as t, isHMapIcon as d } from "./components/map/components/features/basics/Marker.js";
+import { clearMarkerIconCache as a, default as t, getMarkerDebugStats as c, getOrCreateIcon as o, isDomMakerNeeded as s, isHMapIcon as M, resetMarkerDebugStats as k, setMarkerIconCacheEnabled as n } from "./components/map/components/features/basics/Marker.js";
 export {
-  r as default,
-  a as getOrCreateIcon,
-  t as isDomMakerNeeded,
-  d as isHMapIcon
+  a as clearMarkerIconCache,
+  t as default,
+  c as getMarkerDebugStats,
+  o as getOrCreateIcon,
+  s as isDomMakerNeeded,
+  M as isHMapIcon,
+  k as resetMarkerDebugStats,
+  n as setMarkerIconCacheEnabled
 };
 //# sourceMappingURL=Marker.js.map

package/TableNext.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Table';
+export * from './Table';

package/TableNext.js

@@ -0,0 +1,23 @@
+import { TableBatchDropdown as a, TableBody as l, TableColumn as b, TableColumnFilter as T, TableColumnsDropdown as r, TableExpandedContentRow as d, TableExpandedRow as n, TableExpanderButton as t, TableFooter as p, TableGroupFooterRow as u, TableGroupRow as w, TableHeader as R, TableHeaderColumn as m, TableHeaderRow as x, TableRow as C, TableSpacerRow as f, default as c } from "./components/table/Table.js";
+import { default as B } from "./components/table/selection/useTableSelection.js";
+export {
+  a as TableBatchDropdown,
+  l as TableBody,
+  b as TableColumn,
+  T as TableColumnFilter,
+  r as TableColumnsDropdown,
+  d as TableExpandedContentRow,
+  n as TableExpandedRow,
+  t as TableExpanderButton,
+  p as TableFooter,
+  u as TableGroupFooterRow,
+  w as TableGroupRow,
+  R as TableHeader,
+  m as TableHeaderColumn,
+  x as TableHeaderRow,
+  C as TableRow,
+  f as TableSpacerRow,
+  c as default,
+  B as useTableSelection
+};
+//# sourceMappingURL=TableNext.js.map

package/TableNext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableNext.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/TableToolbar.js

@@ -1,6 +1,7 @@
-import { TableToolbarColumn as a, default as e } from "./components/table/TableToolbar.js";
+import { default as e } from "./components/table/TableToolbar.js";
+import { default as r } from "./components/table/TableToolbarColumn.js";
 export {
-  a as TableToolbarColumn,
+  r as TableToolbarColumn,
   e as default
 };
 //# sourceMappingURL=TableToolbar.js.map

package/TableToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableToolbar.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TableToolbar.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.d.ts

@@ -1,18 +1,53 @@
 import { CSSProperties, PointerEvent as ReactPointerEvent, RefObject } from 'react';
 type AnalyticsAnalysisBannerProps = {
-    host: HTMLDivElement | null;
+    /**
+     * Ref forwarded to the draggable banner root element.
+     */
     bannerRef: RefObject<HTMLDivElement>;
+    /**
+     * Inline style applied to the draggable banner container.
+     */
     bannerStyle: CSSProperties;
+    /**
+     * Optional analytics date range label shown above the uploaded file name.
+     */
     analyticsDateRangeLabel: string | null;
+    /**
+     * Name of the currently loaded analytics CSV file.
+     */
     loadedCsvName: string | null;
+    /**
+     * Controls whether overlay detail labels remain visible on tracked elements.
+     */
     showOverlayDetails: boolean;
+    /**
+     * Controls whether the banner shows overlay label text next to the icon.
+     */
     showOverlayLabelText: boolean;
+    /**
+     * Indicates whether the banner is currently being dragged.
+     */
     isDragging: boolean;
+    /**
+     * Called when CSV files are selected or dropped onto the file picker.
+     */
     onCsvPick: (files: File[]) => void;
+    /**
+     * Toggles the visibility of analytics overlay details.
+     */
     onToggleOverlayDetails: () => void;
+    /**
+     * Toggles the visibility of analytics overlay label text.
+     */
     onToggleOverlayLabelText: () => void;
+    /**
+     * Clears the currently loaded analytics CSV data.
+     */
     onClearCsv: () => void;
-    onDragHandlePointerDown: (event: ReactPointerEvent<HTMLElement>) => void;
+    /**
+     * Pointer down handler for the banner drag handle.
+     */
+    onDragHandleDown: (event: ReactPointerEvent<HTMLElement>) => void;
 };
-export declare const AnalyticsAnalysisBanner: (props: AnalyticsAnalysisBannerProps) => import('react').ReactPortal | null;
+export declare const AnalyticsAnalysisBanner: (props: AnalyticsAnalysisBannerProps) => import("react/jsx-runtime").JSX.Element;
 export type { AnalyticsAnalysisBannerProps };

package/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.js

@@ -1,128 +1,123 @@
 import { jsx as e, jsxs as l } from "react/jsx-runtime";
-import { createPortal as u } from "react-dom";
-import c from "../filepicker/FilePicker.js";
+import t from "../filepicker/FilePicker.js";
 import r from "../button/Button.js";
-const S = (d) => {
+import v from "../../utils/classNames.js";
+const w = (c) => {
   const {
-    host: n,
-    bannerRef: p,
-    bannerStyle: y,
+    bannerRef: d,
+    bannerStyle: p,
     analyticsDateRangeLabel: o,
     loadedCsvName: i,
-    showOverlayDetails: t,
+    showOverlayDetails: n,
     showOverlayLabelText: s,
-    isDragging: g,
-    onCsvPick: h,
-    onToggleOverlayDetails: m,
-    onToggleOverlayLabelText: x,
-    onClearCsv: b,
-    onDragHandlePointerDown: v
-  } = d;
-  return n ? u(
-    /* @__PURE__ */ e(
-      "div",
-      {
-        ref: p,
-        className: "position-fixed rounded padding-x-10 padding-y-10 text-color-white bg-secondary shadow-focused pointer-events-all z-index-max",
-        style: y,
-        children: /* @__PURE__ */ l("div", { className: "display-flex align-items-center gap-10", children: [
-          /* @__PURE__ */ e(
-            "span",
+    isDragging: y,
+    onCsvPick: g,
+    onToggleOverlayDetails: h,
+    onToggleOverlayLabelText: m,
+    onClearCsv: x,
+    onDragHandleDown: b
+  } = c;
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      ref: d,
+      className: "position-fixed rounded padding-x-10 padding-y-10 text-color-white bg-secondary shadow-focused pointer-events-all z-index-max",
+      style: p,
+      children: /* @__PURE__ */ l("div", { className: "display-flex align-items-center gap-10", children: [
+        /* @__PURE__ */ e(
+          "span",
+          {
+            role: "button",
+            tabIndex: 0,
+            "aria-label": "Drag analytics overlay banner",
+            className: v(
+              "rioglyph rioglyph-drag-n-drop text-size-20 margin-top-2",
+              y ? "cursor-grabbing" : "cursor-grab"
+            ),
+            onPointerDown: b
+          }
+        ),
+        /* @__PURE__ */ l("div", { children: [
+          !i && /* @__PURE__ */ e(
+            t,
             {
-              role: "button",
-              tabIndex: 0,
-              "aria-label": "Drag analytics overlay banner",
-              className: "rioglyph rioglyph-drag-n-drop text-size-20 margin-top-2",
-              style: {
-                cursor: g ? "grabbing" : "grab",
-                touchAction: "none"
+              displayMode: t.DISPLAY_MODE_DROPZONE,
+              onPick: g,
+              accept: {
+                "text/csv": [".csv"],
+                "application/vnd.ms-excel": [".csv"]
               },
-              onPointerDown: v
+              children: ({ isDragActive: a }) => /* @__PURE__ */ e(
+                "div",
+                {
+                  className: "rounded border border-style-dashed border-color-white bg-transparent text-center text-color-white padding-y-10 padding-x-15 cursor-pointer",
+                  children: a ? "Drop analytics CSV here ..." : "Drop analytics CSV here, or click to select"
+                }
+              )
             }
           ),
-          /* @__PURE__ */ l("div", { children: [
-            !i && /* @__PURE__ */ e(
-              c,
-              {
-                displayMode: c.DISPLAY_MODE_DROPZONE,
-                onPick: h,
-                accept: {
-                  "text/csv": [".csv"],
-                  "application/vnd.ms-excel": [".csv"]
-                },
-                children: ({ isDragActive: a }) => /* @__PURE__ */ e(
-                  "div",
-                  {
-                    className: "rounded border border-style-dashed border-color-white bg-transparent text-center text-color-white padding-y-10 padding-x-15 cursor-pointer",
-                    children: a ? "Drop analytics CSV here ..." : "Drop analytics CSV here, or click to select"
-                  }
-                )
-              }
-            ),
-            i && /* @__PURE__ */ l("div", { className: "display-flex align-items-center justify-content-center gap-15", children: [
-              /* @__PURE__ */ l("div", { className: "line-height-14 display-flex flex-column gap-2", children: [
-                o && /* @__PURE__ */ e("div", { className: "text-bold", children: o }),
-                /* @__PURE__ */ e("div", { children: i })
-              ] }),
-              /* @__PURE__ */ l("div", { className: "display-flex gap-5", children: [
-                /* @__PURE__ */ e(
-                  r,
-                  {
-                    bsSize: "xs",
-                    bsStyle: "muted-filled",
-                    iconOnly: !0,
-                    onClick: (a) => {
-                      a.preventDefault(), a.stopPropagation(), m();
-                    },
-                    "aria-label": t ? "Hide analytics overlay details" : "Show analytics overlay details",
-                    children: /* @__PURE__ */ e(
-                      "span",
-                      {
-                        className: `rioglyph ${t ? "rioglyph-eye-open" : "rioglyph-eye-closed"}`
-                      }
-                    )
-                  }
-                ),
-                /* @__PURE__ */ e(
-                  r,
-                  {
-                    bsSize: "xs",
-                    bsStyle: "muted-filled",
-                    iconOnly: !0,
-                    onClick: (a) => {
-                      a.preventDefault(), a.stopPropagation(), x();
-                    },
-                    "aria-label": s ? "Hide analytics label text" : "Show analytics label text",
-                    children: /* @__PURE__ */ e(
-                      "span",
-                      {
-                        className: `rioglyph rotate-90 ${s ? "rioglyph-arrows-collapse" : "rioglyph-arrows-expand"}`
-                      }
-                    )
-                  }
-                ),
-                /* @__PURE__ */ e(
-                  r,
-                  {
-                    bsSize: "xs",
-                    bsStyle: "muted-filled",
-                    iconName: "rioglyph-trash",
-                    iconOnly: !0,
-                    onClick: (a) => {
-                      a.preventDefault(), a.stopPropagation(), b();
+          i && /* @__PURE__ */ l("div", { className: "display-flex align-items-center justify-content-center gap-15", children: [
+            /* @__PURE__ */ l("div", { className: "line-height-14 display-flex flex-column gap-2", children: [
+              o && /* @__PURE__ */ e("div", { className: "text-bold", children: o }),
+              /* @__PURE__ */ e("div", { children: i })
+            ] }),
+            /* @__PURE__ */ l("div", { className: "display-flex gap-5", children: [
+              /* @__PURE__ */ e(
+                r,
+                {
+                  bsSize: "xs",
+                  bsStyle: "muted-filled",
+                  iconOnly: !0,
+                  onClick: (a) => {
+                    a.preventDefault(), a.stopPropagation(), h();
+                  },
+                  "aria-label": n ? "Hide analytics overlay details" : "Show analytics overlay details",
+                  children: /* @__PURE__ */ e(
+                    "span",
+                    {
+                      className: `rioglyph ${n ? "rioglyph-eye-open" : "rioglyph-eye-closed"}`
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ e(
+                r,
+                {
+                  bsSize: "xs",
+                  bsStyle: "muted-filled",
+                  iconOnly: !0,
+                  onClick: (a) => {
+                    a.preventDefault(), a.stopPropagation(), m();
+                  },
+                  "aria-label": s ? "Hide analytics label text" : "Show analytics label text",
+                  children: /* @__PURE__ */ e(
+                    "span",
+                    {
+                      className: `rioglyph rotate-90 ${s ? "rioglyph-arrows-collapse" : "rioglyph-arrows-expand"}`
                     }
+                  )
+                }
+              ),
+              /* @__PURE__ */ e(
+                r,
+                {
+                  bsSize: "xs",
+                  bsStyle: "muted-filled",
+                  iconName: "rioglyph-trash",
+                  iconOnly: !0,
+                  onClick: (a) => {
+                    a.preventDefault(), a.stopPropagation(), x();
                   }
-                )
-              ] })
+                }
+              )
             ] })
           ] })
         ] })
-      }
-    ),
-    n
-  ) : null;
+      ] })
+    }
+  );
 };
 export {
-  S as AnalyticsAnalysisBanner
+  w as AnalyticsAnalysisBanner
 };
 //# sourceMappingURL=AnalyticsAnalysisBanner.js.map

package/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnalyticsAnalysisBanner.js","sources":["../../../src/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.tsx"],"sourcesContent":["import { createPortal } from 'react-dom';\nimport type { CSSProperties, PointerEvent as ReactPointerEvent, RefObject } from 'react';\n\nimport FilePicker from '../filepicker/FilePicker';\nimport Button from '../button/Button';\n\ntype AnalyticsAnalysisBannerProps = {\n    host: HTMLDivElement | null;\n    bannerRef: RefObject<HTMLDivElement>;\n    bannerStyle: CSSProperties;\n    analyticsDateRangeLabel: string | null;\n    loadedCsvName: string | null;\n    showOverlayDetails: boolean;\n    showOverlayLabelText: boolean;\n    isDragging: boolean;\n    onCsvPick: (files: File[]) => void;\n    onToggleOverlayDetails: () => void;\n    onToggleOverlayLabelText: () => void;\n    onClearCsv: () => void;\n    onDragHandlePointerDown: (event: ReactPointerEvent<HTMLElement>) => void;\n};\n\nexport const AnalyticsAnalysisBanner = (props: AnalyticsAnalysisBannerProps) => {\n    const {\n        host,\n        bannerRef,\n        bannerStyle,\n        analyticsDateRangeLabel,\n        loadedCsvName,\n        showOverlayDetails,\n        showOverlayLabelText,\n        isDragging,\n        onCsvPick,\n        onToggleOverlayDetails,\n        onToggleOverlayLabelText,\n        onClearCsv,\n        onDragHandlePointerDown,\n    } = props;\n\n    if (!host) {\n        return null;\n    }\n\n    return createPortal(\n        <div\n            ref={bannerRef}\n            className='position-fixed rounded padding-x-10 padding-y-10 text-color-white bg-secondary shadow-focused pointer-events-all z-index-max'\n            style={bannerStyle}\n        >\n            <div className='display-flex align-items-center gap-10'>\n                <span\n                    role='button'\n                    tabIndex={0}\n                    aria-label='Drag analytics overlay banner'\n                    className='rioglyph rioglyph-drag-n-drop text-size-20 margin-top-2'\n                    style={{\n                        cursor: isDragging ? 'grabbing' : 'grab',\n                        touchAction: 'none',\n                    }}\n                    onPointerDown={onDragHandlePointerDown}\n                />\n\n                <div>\n                    {!loadedCsvName && (\n                        <FilePicker\n                            displayMode={FilePicker.DISPLAY_MODE_DROPZONE}\n                            onPick={onCsvPick}\n                            accept={{\n                                'text/csv': ['.csv'],\n                                'application/vnd.ms-excel': ['.csv'],\n                            }}\n                        >\n                            {({ isDragActive }) => (\n                                <div\n                                    className={\n                                        'rounded border border-style-dashed border-color-white bg-transparent ' +\n                                        'text-center text-color-white padding-y-10 padding-x-15 cursor-pointer'\n                                    }\n                                >\n                                    {isDragActive\n                                        ? 'Drop analytics CSV here ...'\n                                        : 'Drop analytics CSV here, or click to select'}\n                                </div>\n                            )}\n                        </FilePicker>\n                    )}\n\n                    {loadedCsvName && (\n                        <div className='display-flex align-items-center justify-content-center gap-15'>\n                            <div className='line-height-14 display-flex flex-column gap-2'>\n                                {analyticsDateRangeLabel && <div className='text-bold'>{analyticsDateRangeLabel}</div>}\n                                <div>{loadedCsvName}</div>\n                            </div>\n                            <div className='display-flex gap-5'>\n                                <Button\n                                    bsSize='xs'\n                                    bsStyle='muted-filled'\n                                    iconOnly\n                                    onClick={event => {\n                                        event.preventDefault();\n                                        event.stopPropagation();\n                                        onToggleOverlayDetails();\n                                    }}\n                                    aria-label={\n                                        showOverlayDetails\n                                            ? 'Hide analytics overlay details'\n                                            : 'Show analytics overlay details'\n                                    }\n                                >\n                                    <span\n                                        className={`rioglyph ${\n                                            showOverlayDetails ? 'rioglyph-eye-open' : 'rioglyph-eye-closed'\n                                        }`}\n                                    />\n                                </Button>\n                                <Button\n                                    bsSize='xs'\n                                    bsStyle='muted-filled'\n                                    iconOnly\n                                    onClick={event => {\n                                        event.preventDefault();\n                                        event.stopPropagation();\n                                        onToggleOverlayLabelText();\n                                    }}\n                                    aria-label={\n                                        showOverlayLabelText ? 'Hide analytics label text' : 'Show analytics label text'\n                                    }\n                                >\n                                    <span\n                                        className={`rioglyph rotate-90 ${\n                                            showOverlayLabelText ? 'rioglyph-arrows-collapse' : 'rioglyph-arrows-expand'\n                                        }`}\n                                    />\n                                </Button>\n                                <Button\n                                    bsSize='xs'\n                                    bsStyle='muted-filled'\n                                    iconName='rioglyph-trash'\n                                    iconOnly\n                                    onClick={event => {\n                                        event.preventDefault();\n                                        event.stopPropagation();\n                                        onClearCsv();\n                                    }}\n                                />\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </div>\n        </div>,\n        host\n    );\n};\n\nexport type { AnalyticsAnalysisBannerProps };\n"],"names":["AnalyticsAnalysisBanner","props","host","bannerRef","bannerStyle","analyticsDateRangeLabel","loadedCsvName","showOverlayDetails","showOverlayLabelText","isDragging","onCsvPick","onToggleOverlayDetails","onToggleOverlayLabelText","onClearCsv","onDragHandlePointerDown","createPortal","jsx","jsxs","FilePicker","isDragActive","Button","event"],"mappings":"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"}
+{"version":3,"file":"AnalyticsAnalysisBanner.js","sources":["../../../src/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.tsx"],"sourcesContent":["import type { CSSProperties, PointerEvent as ReactPointerEvent, RefObject } from 'react';\n\nimport FilePicker from '../filepicker/FilePicker';\nimport Button from '../button/Button';\nimport classNames from '../../classNames';\n\ntype AnalyticsAnalysisBannerProps = {\n    /**\n     * Ref forwarded to the draggable banner root element.\n     */\n    bannerRef: RefObject<HTMLDivElement>;\n\n    /**\n     * Inline style applied to the draggable banner container.\n     */\n    bannerStyle: CSSProperties;\n\n    /**\n     * Optional analytics date range label shown above the uploaded file name.\n     */\n    analyticsDateRangeLabel: string | null;\n\n    /**\n     * Name of the currently loaded analytics CSV file.\n     */\n    loadedCsvName: string | null;\n\n    /**\n     * Controls whether overlay detail labels remain visible on tracked elements.\n     */\n    showOverlayDetails: boolean;\n\n    /**\n     * Controls whether the banner shows overlay label text next to the icon.\n     */\n    showOverlayLabelText: boolean;\n\n    /**\n     * Indicates whether the banner is currently being dragged.\n     */\n    isDragging: boolean;\n\n    /**\n     * Called when CSV files are selected or dropped onto the file picker.\n     */\n    onCsvPick: (files: File[]) => void;\n\n    /**\n     * Toggles the visibility of analytics overlay details.\n     */\n    onToggleOverlayDetails: () => void;\n\n    /**\n     * Toggles the visibility of analytics overlay label text.\n     */\n    onToggleOverlayLabelText: () => void;\n\n    /**\n     * Clears the currently loaded analytics CSV data.\n     */\n    onClearCsv: () => void;\n\n    /**\n     * Pointer down handler for the banner drag handle.\n     */\n    onDragHandleDown: (event: ReactPointerEvent<HTMLElement>) => void;\n};\n\nexport const AnalyticsAnalysisBanner = (props: AnalyticsAnalysisBannerProps) => {\n    const {\n        bannerRef,\n        bannerStyle,\n        analyticsDateRangeLabel,\n        loadedCsvName,\n        showOverlayDetails,\n        showOverlayLabelText,\n        isDragging,\n        onCsvPick,\n        onToggleOverlayDetails,\n        onToggleOverlayLabelText,\n        onClearCsv,\n        onDragHandleDown,\n    } = props;\n\n    return (\n        <div\n            ref={bannerRef}\n            className='position-fixed rounded padding-x-10 padding-y-10 text-color-white bg-secondary shadow-focused pointer-events-all z-index-max'\n            style={bannerStyle}\n        >\n            <div className='display-flex align-items-center gap-10'>\n                <span\n                    role='button'\n                    tabIndex={0}\n                    aria-label='Drag analytics overlay banner'\n                    className={classNames(\n                        'rioglyph rioglyph-drag-n-drop text-size-20 margin-top-2',\n                        isDragging ? 'cursor-grabbing' : 'cursor-grab'\n                    )}\n                    onPointerDown={onDragHandleDown}\n                />\n\n                <div>\n                    {!loadedCsvName && (\n                        <FilePicker\n                            displayMode={FilePicker.DISPLAY_MODE_DROPZONE}\n                            onPick={onCsvPick}\n                            accept={{\n                                'text/csv': ['.csv'],\n                                'application/vnd.ms-excel': ['.csv'],\n                            }}\n                        >\n                            {({ isDragActive }) => (\n                                <div\n                                    className={\n                                        'rounded border border-style-dashed border-color-white bg-transparent ' +\n                                        'text-center text-color-white padding-y-10 padding-x-15 cursor-pointer'\n                                    }\n                                >\n                                    {isDragActive\n                                        ? 'Drop analytics CSV here ...'\n                                        : 'Drop analytics CSV here, or click to select'}\n                                </div>\n                            )}\n                        </FilePicker>\n                    )}\n\n                    {loadedCsvName && (\n                        <div className='display-flex align-items-center justify-content-center gap-15'>\n                            <div className='line-height-14 display-flex flex-column gap-2'>\n                                {analyticsDateRangeLabel && <div className='text-bold'>{analyticsDateRangeLabel}</div>}\n                                <div>{loadedCsvName}</div>\n                            </div>\n                            <div className='display-flex gap-5'>\n                                <Button\n                                    bsSize='xs'\n                                    bsStyle='muted-filled'\n                                    iconOnly\n                                    onClick={event => {\n                                        event.preventDefault();\n                                        event.stopPropagation();\n                                        onToggleOverlayDetails();\n                                    }}\n                                    aria-label={\n                                        showOverlayDetails\n                                            ? 'Hide analytics overlay details'\n                                            : 'Show analytics overlay details'\n                                    }\n                                >\n                                    <span\n                                        className={`rioglyph ${\n                                            showOverlayDetails ? 'rioglyph-eye-open' : 'rioglyph-eye-closed'\n                                        }`}\n                                    />\n                                </Button>\n                                <Button\n                                    bsSize='xs'\n                                    bsStyle='muted-filled'\n                                    iconOnly\n                                    onClick={event => {\n                                        event.preventDefault();\n                                        event.stopPropagation();\n                                        onToggleOverlayLabelText();\n                                    }}\n                                    aria-label={\n                                        showOverlayLabelText ? 'Hide analytics label text' : 'Show analytics label text'\n                                    }\n                                >\n                                    <span\n                                        className={`rioglyph rotate-90 ${\n                                            showOverlayLabelText ? 'rioglyph-arrows-collapse' : 'rioglyph-arrows-expand'\n                                        }`}\n                                    />\n                                </Button>\n                                <Button\n                                    bsSize='xs'\n                                    bsStyle='muted-filled'\n                                    iconName='rioglyph-trash'\n                                    iconOnly\n                                    onClick={event => {\n                                        event.preventDefault();\n                                        event.stopPropagation();\n                                        onClearCsv();\n                                    }}\n                                />\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport type { AnalyticsAnalysisBannerProps };\n"],"names":["AnalyticsAnalysisBanner","props","bannerRef","bannerStyle","analyticsDateRangeLabel","loadedCsvName","showOverlayDetails","showOverlayLabelText","isDragging","onCsvPick","onToggleOverlayDetails","onToggleOverlayLabelText","onClearCsv","onDragHandleDown","jsx","jsxs","classNames","FilePicker","isDragActive","Button","event"],"mappings":"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"}

package/components/analyticsAnalysisOverlay/AnalyticsAnalysisOverlay.d.ts

@@ -1,9 +1,28 @@
+type AnalysisBannerPosition = {
+    /**
+     * Initial top offset in pixels relative to the viewport.
+     */
+    top: number;
+    /**
+     * Initial left offset in pixels relative to the viewport.
+     */
+    left: number;
+};
 type AnalyticsAnalysisOverlayProps = {
+    /**
+     * Opacity of the fullscreen analytics overlay backdrop.
+     * Values are clamped to the range `0` to `1`.
+     *
+     * @default 0.5
+     */
     overlayBackgroundOpacity?: number;
-    bannerStartCoordinates?: {
-        top: number;
-        left: number;
-    };
+    /**
+     * Optional initial viewport coordinates for the draggable analytics banner.
+     * When omitted, the banner starts at `top: 70px`, `left: 50%` with `translateX(-50%)`.
+     *
+     * @default undefined
+     */
+    bannerStartCoordinates?: AnalysisBannerPosition;
 };
-export declare const AnalyticsAnalysisOverlay: (props: AnalyticsAnalysisOverlayProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AnalyticsAnalysisOverlay: (props: AnalyticsAnalysisOverlayProps) => import('react').ReactNode;
 export {};

package/components/analyticsAnalysisOverlay/AnalyticsAnalysisOverlay.js

@@ -1,73 +1,77 @@
-import { jsx as $ } from "react/jsx-runtime";
-import { useState as t, useCallback as g } from "react";
-import H from "../notification/Notification.js";
-import P from "../../hooks/useDraggableElement.js";
-import { hasRequiredAnalyticsHeaderRow as q, buildAnalyticsAnalysisData as I } from "../../utils/analytics/analyticsAnalysisUtils.js";
-import V from "../../utils/analytics/useAnalyticsOverlayDom.js";
+import { jsx as P } from "react/jsx-runtime";
+import { useState as t, useCallback as v } from "react";
+import $ from "../notification/Notification.js";
+import H from "../../hooks/useDraggableElement.js";
+import { hasRequiredAnalyticsHeaderRow as q, buildAnalyticsAnalysisData as V } from "../../utils/analytics/analyticsAnalysisUtils.js";
+import _ from "../../utils/analytics/useAnalyticsOverlayDom.js";
 import { AnalyticsAnalysisBanner as j } from "./AnalyticsAnalysisBanner.js";
-const Q = (v) => {
-  const { overlayBackgroundOpacity: b = 0.5, bannerStartCoordinates: p } = v, h = Math.min(1, Math.max(0, b)), o = p?.top, r = p?.left, A = typeof o == "number" && Number.isFinite(o) && typeof r == "number" && Number.isFinite(r), [C, e] = t(() => /* @__PURE__ */ new Map()), [D, n] = t(null), [w, s] = t(null), [O, l] = t(null), [u, x] = t(!0), [m, L] = t(!0), { draggableRef: T, isDragging: k, position: i, onDragHandlePointerDown: R } = P(), S = V({
-    analyticsLookup: C,
-    overlayBackgroundOpacity: h,
-    showOverlayDetails: u,
-    showOverlayLabelText: m,
-    analyticsTotalUsers: w
-  }), M = g(async (a) => {
-    const d = a.filter((F) => F.name.toLowerCase().endsWith(".csv"));
-    if (d.length === 0) {
-      e(/* @__PURE__ */ new Map()), n(null), s(null), l(null);
+const z = {
+  top: "70px",
+  left: "50%",
+  transform: "translateX(-50%)"
+}, Z = (b) => {
+  const { overlayBackgroundOpacity: A = 0.5, bannerStartCoordinates: y } = b, C = Math.min(1, Math.max(0, A)), r = y?.top, i = y?.left, u = typeof r == "number" && Number.isFinite(r) && typeof i == "number" && Number.isFinite(i), [D, n] = t(() => /* @__PURE__ */ new Map()), [O, s] = t(null), [h, l] = t(null), [w, o] = t(null), [m, L] = t(!0), [d, T] = t(!0), x = u ? { top: r, left: i } : void 0, { draggableRef: k, isDragging: N, position: e, onDragHandleDown: R, renderElement: S } = H({
+    initialPosition: x
+  }), B = _({
+    analyticsLookup: D,
+    overlayBackgroundOpacity: C,
+    showOverlayDetails: m,
+    showOverlayLabelText: d,
+    analyticsTotalUsers: h
+  }), M = v(async (a) => {
+    const f = a.filter((I) => I.name.toLowerCase().endsWith(".csv"));
+    if (f.length === 0) {
+      n(/* @__PURE__ */ new Map()), s(null), l(null), o(null);
       return;
     }
-    const c = d[0], f = await c.text();
-    if (!q(f)) {
-      H.error(
+    const c = f[0], g = await c.text();
+    if (!q(g)) {
+      $.error(
         'A Google Analytics CSV report based on the "UIKIT AnalyticsAnalysisOverlay Template" is required.',
         {
           title: "Unsupported CSV"
         }
-      ), e(/* @__PURE__ */ new Map()), n(null), s(null), l(null);
+      ), n(/* @__PURE__ */ new Map()), s(null), l(null), o(null);
       return;
     }
-    const U = [
+    const E = [
       {
         reportName: c.name,
-        csvRaw: f
+        csvRaw: g
       }
-    ], y = I(U);
-    e(y.analyticsLookup), n(y.analyticsDateRangeLabel), s(y.analyticsTotalUsers), l(c.name);
-  }, []), N = g(() => {
-    e(/* @__PURE__ */ new Map()), n(null), s(null), l(null);
-  }, []), B = i.hasDragged ? {
-    top: `${i.top}px`,
-    left: `${i.left}px`
-  } : A ? {
-    top: `${o}px`,
-    left: `${r}px`
-  } : {
-    top: "70px",
-    left: "50%",
-    transform: "translateX(-50%)"
-  };
-  return /* @__PURE__ */ $(
-    j,
-    {
-      host: S,
-      bannerRef: T,
-      bannerStyle: B,
-      analyticsDateRangeLabel: D,
-      loadedCsvName: O,
-      showOverlayDetails: u,
-      showOverlayLabelText: m,
-      isDragging: k,
-      onCsvPick: M,
-      onToggleOverlayDetails: () => x((a) => !a),
-      onToggleOverlayLabelText: () => L((a) => !a),
-      onClearCsv: N,
-      onDragHandlePointerDown: R
-    }
+    ], p = V(E);
+    n(p.analyticsLookup), s(p.analyticsDateRangeLabel), l(p.analyticsTotalUsers), o(c.name);
+  }, []), U = v(() => {
+    n(/* @__PURE__ */ new Map()), s(null), l(null), o(null);
+  }, []), F = e.hasDragged ? {
+    top: `${e.top}px`,
+    left: `${e.left}px`
+  } : u ? {
+    top: `${e.top}px`,
+    left: `${e.left}px`
+  } : z;
+  return S(
+    /* @__PURE__ */ P(
+      j,
+      {
+        bannerRef: k,
+        bannerStyle: F,
+        analyticsDateRangeLabel: O,
+        loadedCsvName: w,
+        showOverlayDetails: m,
+        showOverlayLabelText: d,
+        isDragging: N,
+        onCsvPick: M,
+        onToggleOverlayDetails: () => L((a) => !a),
+        onToggleOverlayLabelText: () => T((a) => !a),
+        onClearCsv: U,
+        onDragHandleDown: R
+      }
+    ),
+    B
   );
 };
 export {
-  Q as AnalyticsAnalysisOverlay
+  Z as AnalyticsAnalysisOverlay
 };
 //# sourceMappingURL=AnalyticsAnalysisOverlay.js.map