@rio-cloud/rio-uikit 2.5.1 → 3.0.0-beta.1

package/components/actionBarItem/ActionBarItemPopoverContent.js

@@ -1,16 +1,17 @@
+import e from "../../utils/classNames.js";
+import { omit as t } from "es-toolkit/compat";
 import { jsx as n } from "react/jsx-runtime";
-import { omit as m } from "es-toolkit/compat";
-import a from "../../utils/classNames.js";
-const i = ({
-  className: t,
-  children: o,
-  ...e
-}) => {
-  const r = a("ActionBarItemPopoverContent", t), s = m(e, ["title", "useOffscreen"]);
-  return /* @__PURE__ */ n("div", { ...s, className: r, children: o });
+//#region src/components/actionBarItem/ActionBarItemPopoverContent.tsx
+var r = ({ className: r, children: i, ...a }) => {
+	let o = e("ActionBarItemPopoverContent", r);
+	return /* @__PURE__ */ n("div", {
+		...t(a, ["title", "useOffscreen"]),
+		className: o,
+		children: i
+	});
 };
-i.displayName = "ActionBarItemPopoverContent";
-export {
-  i as default
-};
-//# sourceMappingURL=ActionBarItemPopoverContent.js.map
+r.displayName = "ActionBarItemPopoverContent";
+//#endregion
+export { r as default };
+
+//# sourceMappingURL=ActionBarItemPopoverContent.js.map

package/components/actionBarItem/ActionBarItemPopoverContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionBarItemPopoverContent.js","sources":["../../../src/components/actionBarItem/ActionBarItemPopoverContent.tsx"],"sourcesContent":["import type { HTMLAttributes, PropsWithChildren, ReactNode } from 'react';\nimport { omit } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\n\nexport type ActionBarItemPopoverProps = Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'useOffscreen'> & {\n    /**\n     * The popover title.\n     */\n    title?: string | ReactNode;\n\n    /**\n     * Define whether the popover content shall be rendered behind the scene.\n     *\n     * This allows to preload content or to avoid unmounting the content component.\n     */\n    useOffscreen?: boolean;\n\n    /**\n     * Additional class names that are added to the popover content.\n     */\n    className?: string;\n};\n\nconst ActionBarItemPopoverContent = ({\n    className,\n    children,\n    ...remainingProps\n}: PropsWithChildren<ActionBarItemPopoverProps>) => {\n    const classes = classNames('ActionBarItemPopoverContent', className);\n    const filterProps = omit(remainingProps, ['title', 'useOffscreen']) as HTMLAttributes<HTMLDivElement>;\n\n    return (\n        <div {...filterProps} className={classes}>\n            {children}\n        </div>\n    );\n};\n\n// The displayName is used in ActionBarItem for checking the component \"isActionBarItemPopover\"\nActionBarItemPopoverContent.displayName = 'ActionBarItemPopoverContent';\n\nexport default ActionBarItemPopoverContent;\n"],"names":["ActionBarItemPopoverContent","className","children","remainingProps","classes","classNames","filterProps","omit"],"mappings":";;;AAwBA,MAAMA,IAA8B,CAAC;AAAA,EACjC,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACP,MAAoD;AAChD,QAAMC,IAAUC,EAAW,+BAA+BJ,CAAS,GAC7DK,IAAcC,EAAKJ,GAAgB,CAAC,SAAS,cAAc,CAAC;AAElE,2BACK,OAAA,EAAK,GAAGG,GAAa,WAAWF,GAC5B,UAAAF,GACL;AAER;AAGAF,EAA4B,cAAc;"}
+{"version":3,"file":"ActionBarItemPopoverContent.js","names":[],"sources":["../../../src/components/actionBarItem/ActionBarItemPopoverContent.tsx"],"sourcesContent":["import type { HTMLAttributes, PropsWithChildren, ReactNode } from 'react';\nimport { omit } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\n\nexport type ActionBarItemPopoverProps = Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'useOffscreen'> & {\n    /**\n     * The popover title.\n     */\n    title?: string | ReactNode;\n\n    /**\n     * Define whether the popover content shall be rendered behind the scene.\n     *\n     * This allows to preload content or to avoid unmounting the content component.\n     */\n    useOffscreen?: boolean;\n\n    /**\n     * Additional class names that are added to the popover content.\n     */\n    className?: string;\n};\n\nconst ActionBarItemPopoverContent = ({\n    className,\n    children,\n    ...remainingProps\n}: PropsWithChildren<ActionBarItemPopoverProps>) => {\n    const classes = classNames('ActionBarItemPopoverContent', className);\n    const filterProps = omit(remainingProps, ['title', 'useOffscreen']) as HTMLAttributes<HTMLDivElement>;\n\n    return (\n        <div {...filterProps} className={classes}>\n            {children}\n        </div>\n    );\n};\n\n// The displayName is used in ActionBarItem for checking the component \"isActionBarItemPopover\"\nActionBarItemPopoverContent.displayName = 'ActionBarItemPopoverContent';\n\nexport default ActionBarItemPopoverContent;\n"],"mappings":";;;;AAwBA,IAAM,KAA+B,EACjC,cACA,aACA,GAAG,QAC6C;CAChD,IAAM,IAAU,EAAW,+BAA+B,CAAS;CAGnE,OACI,kBAAC,OAAD;EAAK,GAHW,EAAK,GAAgB,CAAC,SAAS,cAAc,CAGpD;EAAa,WAAW;EAC5B;CACA,CAAA;AAEb;AAGA,EAA4B,cAAc"}

package/components/actionBarItem/ActionBarOverlay.d.ts

@@ -1,19 +1,11 @@
-import { default as React } from 'react';
-import { PLACEMENT_MAP } from '../popover/Popover';
-import { ObjectValues } from '../../utils/ObjectValues';
+import { PropsWithChildren } from 'react';
+import { PopoverProps } from '../popover/Popover';
 export type ActionBarOverlayWidth = 100 | 150 | 200 | 250 | 300 | 350 | 400 | 450 | 500;
-export type ActionBarOverlayProps = {
-    id: string;
-    title?: string | React.ReactNode;
+export type ActionBarOverlayProps = Omit<PopoverProps, 'children' | 'placement'> & {
     preRender?: boolean;
     show?: boolean;
     width?: ActionBarOverlayWidth;
-    onClick?: () => void;
-    style?: object;
-    placement?: ObjectValues<typeof PLACEMENT_MAP>;
-    className?: string;
 };
-declare const ActionBarOverlay: React.ForwardRefExoticComponent<ActionBarOverlayProps & {
-    children?: React.ReactNode | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
+type Props = PropsWithChildren<ActionBarOverlayProps>;
+declare const ActionBarOverlay: import('react').ForwardRefExoticComponent<Omit<Props, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export default ActionBarOverlay;

package/components/actionBarItem/ActionBarOverlay.js

@@ -1,40 +1,34 @@
-import { jsxs as E, jsx as r } from "react/jsx-runtime";
-import { forwardRef as h } from "react";
-import { noop as j } from "es-toolkit/compat";
 import e from "../../utils/classNames.js";
-import s, { PLACEMENT_MAP as u } from "../popover/Popover.js";
-const x = u.BOTTOM, y = 250, I = h((n, a) => {
-  const {
-    children: c,
-    show: l,
-    preRender: i,
-    id: m,
-    title: t,
-    onClick: p = j,
-    width: d = y,
-    style: f = {},
-    className: o,
-    placement: T = x,
-    ...A
-  } = n, C = { ...f, width: d }, N = i && !l ? e(o, "position-offscreen") : o, P = e("ActionBarItemPopover text-color-dark", o), v = e("ActionBarItemPopover", o);
-  return /* @__PURE__ */ E(
-    s,
-    {
-      ref: a,
-      id: m,
-      onClick: p,
-      placement: T,
-      ...A,
-      style: C,
-      className: N,
-      children: [
-        t && /* @__PURE__ */ r(s.Title, { className: P, children: t }),
-        /* @__PURE__ */ r(s.Content, { className: v, children: c })
-      ]
-    }
-  );
+import t from "../popover/Popover.js";
+import { forwardRef as n } from "react";
+import { noop as r } from "es-toolkit/compat";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/components/actionBarItem/ActionBarOverlay.tsx
+var o = 250, s = n((n, s) => {
+	let { children: c, show: l, preRender: u, id: d, title: f, onClick: p = r, width: m = o, style: h = {}, className: g, ..._ } = n, v = {
+		"--anchor-offset-block": "5px",
+		"--action-bar-overlay-width": `${m}px`,
+		"--overlay-arrow-offset-inline": "calc((var(--action-bar-overlay-width) - var(--overlay-anchor-width, 0px)) / 2)",
+		...h,
+		width: m
+	}, y = e("ActionBarOverlay", g, u && !l && "position-offscreen"), b = e("ActionBarItemPopover text-color-dark", g), x = e("ActionBarItemPopover", g);
+	return /* @__PURE__ */ a(t, {
+		ref: s,
+		id: d,
+		onClick: p,
+		..._,
+		style: v,
+		className: y,
+		children: [f && /* @__PURE__ */ i(t.Title, {
+			className: b,
+			children: f
+		}), /* @__PURE__ */ i(t.Content, {
+			className: x,
+			children: c
+		})]
+	});
 });
-export {
-  I as default
-};
-//# sourceMappingURL=ActionBarOverlay.js.map
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=ActionBarOverlay.js.map

package/components/actionBarItem/ActionBarOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionBarOverlay.js","sources":["../../../src/components/actionBarItem/ActionBarOverlay.tsx"],"sourcesContent":["import React, { forwardRef, type PropsWithChildren, type ForwardedRef } from 'react';\nimport { noop } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\nimport Popover, { PLACEMENT_MAP } from '../popover/Popover';\nimport type { ObjectValues } from '../../utils/ObjectValues';\n\nconst DEFAULT_PLACEMENT = PLACEMENT_MAP.BOTTOM;\nconst DEFAULT_WIDTH = 250;\n\nexport type ActionBarOverlayWidth = 100 | 150 | 200 | 250 | 300 | 350 | 400 | 450 | 500;\n\nexport type ActionBarOverlayProps = {\n    id: string;\n    title?: string | React.ReactNode;\n    preRender?: boolean;\n    show?: boolean;\n    width?: ActionBarOverlayWidth;\n    onClick?: () => void;\n    style?: object;\n    placement?: ObjectValues<typeof PLACEMENT_MAP>;\n    className?: string;\n};\n\ntype Ref = ForwardedRef<HTMLDivElement>;\ntype Props = PropsWithChildren<ActionBarOverlayProps>;\n\nconst ActionBarOverlay = forwardRef((props: Props, ref: Ref) => {\n    const {\n        children,\n        show,\n        preRender,\n        id,\n        title,\n        onClick = noop,\n        width = DEFAULT_WIDTH,\n        style = {},\n        className,\n        placement = DEFAULT_PLACEMENT,\n        ...remainingProps\n    } = props;\n\n    const adjustedStyles = { ...style, width };\n    const adjustedClassName = preRender && !show ? classNames(className, 'position-offscreen') : className;\n\n    const popoverTitleClasses = classNames('ActionBarItemPopover text-color-dark', className);\n    const popoverContentClasses = classNames('ActionBarItemPopover', className);\n\n    return (\n        <Popover\n            ref={ref}\n            id={id}\n            onClick={onClick}\n            placement={placement}\n            {...remainingProps}\n            style={adjustedStyles}\n            className={adjustedClassName}\n        >\n            {title && <Popover.Title className={popoverTitleClasses}>{title}</Popover.Title>}\n            <Popover.Content className={popoverContentClasses}>{children}</Popover.Content>\n        </Popover>\n    );\n});\n\nexport default ActionBarOverlay;\n"],"names":["DEFAULT_PLACEMENT","PLACEMENT_MAP","DEFAULT_WIDTH","ActionBarOverlay","forwardRef","props","ref","children","show","preRender","id","title","onClick","noop","width","style","className","placement","remainingProps","adjustedStyles","adjustedClassName","classNames","popoverTitleClasses","popoverContentClasses","jsxs","Popover"],"mappings":";;;;;AAOA,MAAMA,IAAoBC,EAAc,QAClCC,IAAgB,KAmBhBC,IAAmBC,EAAW,CAACC,GAAcC,MAAa;AAC5D,QAAM;AAAA,IACF,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,WAAAC;AAAA,IACA,IAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC,IAAUC;AAAA,IACV,OAAAC,IAAQZ;AAAA,IACR,OAAAa,IAAQ,CAAA;AAAA,IACR,WAAAC;AAAA,IACA,WAAAC,IAAYjB;AAAA,IACZ,GAAGkB;AAAA,EAAA,IACHb,GAEEc,IAAiB,EAAE,GAAGJ,GAAO,OAAAD,EAAA,GAC7BM,IAAoBX,KAAa,CAACD,IAAOa,EAAWL,GAAW,oBAAoB,IAAIA,GAEvFM,IAAsBD,EAAW,wCAAwCL,CAAS,GAClFO,IAAwBF,EAAW,wBAAwBL,CAAS;AAE1E,SACI,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,KAAAnB;AAAA,MACA,IAAAI;AAAA,MACA,SAAAE;AAAA,MACA,WAAAK;AAAA,MACC,GAAGC;AAAA,MACJ,OAAOC;AAAA,MACP,WAAWC;AAAA,MAEV,UAAA;AAAA,QAAAT,uBAAUc,EAAQ,OAAR,EAAc,WAAWH,GAAsB,UAAAX,GAAM;AAAA,0BAC/Dc,EAAQ,SAAR,EAAgB,WAAWF,GAAwB,UAAAhB,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGzE,CAAC;"}
+{"version":3,"file":"ActionBarOverlay.js","names":[],"sources":["../../../src/components/actionBarItem/ActionBarOverlay.tsx"],"sourcesContent":["import { forwardRef, type PropsWithChildren, type ForwardedRef, type CSSProperties } from 'react';\nimport { noop } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\nimport Popover, { type PopoverProps } from '../popover/Popover';\n\nconst DEFAULT_WIDTH = 250;\n\nexport type ActionBarOverlayWidth = 100 | 150 | 200 | 250 | 300 | 350 | 400 | 450 | 500;\n\nexport type ActionBarOverlayProps = Omit<PopoverProps, 'children' | 'placement'> & {\n    preRender?: boolean;\n    show?: boolean;\n    width?: ActionBarOverlayWidth;\n};\n\ntype Ref = ForwardedRef<HTMLDivElement>;\ntype Props = PropsWithChildren<ActionBarOverlayProps>;\n\nconst ActionBarOverlay = forwardRef((props: Props, ref: Ref) => {\n    const {\n        children,\n        show,\n        preRender,\n        id,\n        title,\n        onClick = noop,\n        width = DEFAULT_WIDTH,\n        style = {},\n        className,\n        ...remainingProps\n    } = props;\n\n    const adjustedStyles = {\n        '--anchor-offset-block': '5px',\n        '--action-bar-overlay-width': `${width}px`,\n        '--overlay-arrow-offset-inline':\n            'calc((var(--action-bar-overlay-width) - var(--overlay-anchor-width, 0px)) / 2)',\n        ...style,\n        width,\n    } as CSSProperties;\n\n    const adjustedClassName = classNames('ActionBarOverlay', className, preRender && !show && 'position-offscreen');\n\n    const popoverTitleClasses = classNames('ActionBarItemPopover text-color-dark', className);\n    const popoverContentClasses = classNames('ActionBarItemPopover', className);\n\n    return (\n        <Popover\n            ref={ref}\n            id={id}\n            onClick={onClick}\n            {...remainingProps}\n            style={adjustedStyles}\n            className={adjustedClassName}\n        >\n            {title && <Popover.Title className={popoverTitleClasses}>{title}</Popover.Title>}\n            <Popover.Content className={popoverContentClasses}>{children}</Popover.Content>\n        </Popover>\n    );\n});\n\nexport default ActionBarOverlay;\n"],"mappings":";;;;;;AAMA,IAAM,IAAgB,KAahB,IAAmB,GAAY,GAAc,MAAa;CAC5D,IAAM,EACF,aACA,SACA,cACA,OACA,UACA,aAAU,GACV,WAAQ,GACR,WAAQ,CAAC,GACT,cACA,GAAG,MACH,GAEE,IAAiB;EACnB,yBAAyB;EACzB,8BAA8B,GAAG,EAAM;EACvC,iCACI;EACJ,GAAG;EACH;CACJ,GAEM,IAAoB,EAAW,oBAAoB,GAAW,KAAa,CAAC,KAAQ,oBAAoB,GAExG,IAAsB,EAAW,wCAAwC,CAAS,GAClF,IAAwB,EAAW,wBAAwB,CAAS;CAE1E,OACI,kBAAC,GAAD;EACS;EACD;EACK;EACT,GAAI;EACJ,OAAO;EACP,WAAW;YANf,CAQK,KAAS,kBAAC,EAAQ,OAAT;GAAe,WAAW;aAAsB;EAAqB,CAAA,GAC/E,kBAAC,EAAQ,SAAT;GAAiB,WAAW;GAAwB;EAA0B,CAAA,CACzE;;AAEjB,CAAC"}

package/components/activity/Activity.js

@@ -1,44 +1,41 @@
-import { jsxs as I, jsx as t } from "react/jsx-runtime";
-import { forwardRef as y } from "react";
-import N from "../../utils/classNames.js";
-const s = {
-  AVAILABLE: "available",
-  DRIVING: "driving",
-  RESTING: "resting",
-  WORKING: "working"
-}, v = {
-  [s.AVAILABLE]: "rioglyph-status-available",
-  [s.WORKING]: "rioglyph-status-working",
-  [s.DRIVING]: "rioglyph-status-driving",
-  [s.RESTING]: "rioglyph-status-resting"
-}, d = { SIZE_SM: "sm", SIZE_LG: "lg", SIZE_XL: "xl" }, c = y((e, o) => {
-  const {
-    activity: i,
-    duration: a,
-    isOutdated: l = !1,
-    bsSize: r,
-    onClick: p = () => {
-    },
-    className: n = "",
-    ...g
-  } = e;
-  if (!i)
-    return null;
-  const m = N(
-    "activity",
-    `activity-${i}`,
-    l && "opacity-50",
-    r && `activity-${r}`,
-    n && n
-  );
-  return /* @__PURE__ */ I("div", { ref: o, ...g, className: m, onClick: p, children: [
-    /* @__PURE__ */ t("span", { className: "activity-icon", children: /* @__PURE__ */ t("span", { className: `rioglyph ${v[i]}` }) }),
-    a && /* @__PURE__ */ t("span", { className: "activity-text", children: a })
-  ] });
+import e from "../../utils/classNames.js";
+import { forwardRef as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/activity/Activity.tsx
+var i = {
+	AVAILABLE: "available",
+	DRIVING: "driving",
+	RESTING: "resting",
+	WORKING: "working"
+}, a = {
+	[i.AVAILABLE]: "icon-status-available",
+	[i.WORKING]: "icon-status-working",
+	[i.DRIVING]: "icon-status-driving",
+	[i.RESTING]: "icon-status-resting"
+}, o = {
+	SIZE_SM: "sm",
+	SIZE_LG: "lg",
+	SIZE_XL: "xl"
+}, s = t((t, i) => {
+	let { activity: o, duration: s, isOutdated: c = !1, bsSize: l, onClick: u = () => {}, className: d = "", ...f } = t;
+	if (!o) return null;
+	let p = e("activity", `activity-${o}`, c && "opacity-50", l && `activity-${l}`, d && d);
+	return /* @__PURE__ */ r("div", {
+		ref: i,
+		...f,
+		className: p,
+		onClick: u,
+		children: [/* @__PURE__ */ n("span", {
+			className: "activity-icon",
+			children: /* @__PURE__ */ n("span", { className: `uikit-icon ${a[o]}` })
+		}), s && /* @__PURE__ */ n("span", {
+			className: "activity-text",
+			children: s
+		})]
+	});
 });
-Object.assign(c, s);
-Object.assign(c, d);
-export {
-  c as default
-};
-//# sourceMappingURL=Activity.js.map
+Object.assign(s, i), Object.assign(s, o);
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=Activity.js.map

package/components/activity/Activity.js.map

@@ -1 +1 @@
-{"version":3,"file":"Activity.js","sources":["../../../src/components/activity/Activity.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, type ReactNode } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport type { ObjectValues } from '../../utils/ObjectValues';\nimport type { RefComponent } from '../../utils/RefComponent';\n\nconst STATUS_MAP = {\n    AVAILABLE: 'available',\n    DRIVING: 'driving',\n    RESTING: 'resting',\n    WORKING: 'working',\n} as const;\n\nexport type ActivityStatus = ObjectValues<typeof STATUS_MAP>;\n\nconst icons: Record<ActivityStatus, string> = {\n    [STATUS_MAP.AVAILABLE]: 'rioglyph-status-available',\n    [STATUS_MAP.WORKING]: 'rioglyph-status-working',\n    [STATUS_MAP.DRIVING]: 'rioglyph-status-driving',\n    [STATUS_MAP.RESTING]: 'rioglyph-status-resting',\n};\n\nconst SIZE_MAP = { SIZE_SM: 'sm', SIZE_LG: 'lg', SIZE_XL: 'xl' } as const;\n\nexport type ActivitySize = ObjectValues<typeof SIZE_MAP>;\n\nexport type ActivityProps = {\n    /**\n     * Defines the type of activity.\n     *\n     * Possible values are `Activity.AVAILABLE`, `Activity.DRIVING`, `Activity.RESTING` or `Activity.WORKING`.\n     */\n    activity: ActivityStatus;\n\n    /**\n     * Define how large the component should be rendered.\n     *\n     * Possible values are `Activity.SIZE_SM`, `Activity.SIZE_LG` or `Activity.SIZE_XL`.\n     */\n    bsSize?: ActivitySize;\n\n    /**\n     * The actual duration value to be shown.\n     */\n    duration?: string | ReactNode;\n\n    /**\n     * Indicates whether the activity is outdated.\n     *\n     * @default false\n     */\n    isOutdated?: boolean;\n\n    /**\n     * Callback function for when the component is clicked.\n     */\n    onClick?: VoidFunction;\n\n    /**\n     * Additional classes for the wrapper element.\n     */\n    className?: string;\n};\n\ntype ActivityType = RefComponent<ActivityProps> & typeof STATUS_MAP & typeof SIZE_MAP;\n\nconst Activity = forwardRef((props: ActivityProps, ref: ForwardedRef<HTMLDivElement>) => {\n    const {\n        activity,\n        duration,\n        isOutdated = false,\n        bsSize,\n        onClick = () => {},\n        className = '',\n        ...remainingProps\n    } = props;\n\n    if (!activity) {\n        return null;\n    }\n\n    const wrapperClassNames = classNames(\n        'activity',\n        `activity-${activity}`,\n        isOutdated && 'opacity-50',\n        bsSize && `activity-${bsSize}`,\n        className && className\n    );\n\n    return (\n        <div ref={ref} {...remainingProps} className={wrapperClassNames} onClick={onClick}>\n            <span className='activity-icon'>\n                <span className={`rioglyph ${icons[activity]}`} />\n            </span>\n            {duration && <span className='activity-text'>{duration}</span>}\n        </div>\n    );\n}) as ActivityType;\n\n// statics\nObject.assign(Activity, STATUS_MAP);\nObject.assign(Activity, SIZE_MAP);\n\nexport default Activity;\n"],"names":["STATUS_MAP","icons","SIZE_MAP","Activity","forwardRef","props","ref","activity","duration","isOutdated","bsSize","onClick","className","remainingProps","wrapperClassNames","classNames","jsx"],"mappings":";;;AAMA,MAAMA,IAAa;AAAA,EACf,WAAW;AAAA,EACX,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AACb,GAIMC,IAAwC;AAAA,EAC1C,CAACD,EAAW,SAAS,GAAG;AAAA,EACxB,CAACA,EAAW,OAAO,GAAG;AAAA,EACtB,CAACA,EAAW,OAAO,GAAG;AAAA,EACtB,CAACA,EAAW,OAAO,GAAG;AAC1B,GAEME,IAAW,EAAE,SAAS,MAAM,SAAS,MAAM,SAAS,KAAA,GA4CpDC,IAAWC,EAAW,CAACC,GAAsBC,MAAsC;AACrF,QAAM;AAAA,IACF,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,QAAAC;AAAA,IACA,SAAAC,IAAU,MAAM;AAAA,IAAC;AAAA,IACjB,WAAAC,IAAY;AAAA,IACZ,GAAGC;AAAA,EAAA,IACHR;AAEJ,MAAI,CAACE;AACD,WAAO;AAGX,QAAMO,IAAoBC;AAAA,IACtB;AAAA,IACA,YAAYR,CAAQ;AAAA,IACpBE,KAAc;AAAA,IACdC,KAAU,YAAYA,CAAM;AAAA,IAC5BE,KAAaA;AAAA,EAAA;AAGjB,2BACK,OAAA,EAAI,KAAAN,GAAW,GAAGO,GAAgB,WAAWC,GAAmB,SAAAH,GAC7D,UAAA;AAAA,IAAA,gBAAAK,EAAC,QAAA,EAAK,WAAU,iBACZ,UAAA,gBAAAA,EAAC,QAAA,EAAK,WAAW,YAAYf,EAAMM,CAAQ,CAAC,GAAA,CAAI,GACpD;AAAA,IACCC,KAAY,gBAAAQ,EAAC,QAAA,EAAK,WAAU,iBAAiB,UAAAR,EAAA,CAAS;AAAA,EAAA,GAC3D;AAER,CAAC;AAGD,OAAO,OAAOL,GAAUH,CAAU;AAClC,OAAO,OAAOG,GAAUD,CAAQ;"}
+{"version":3,"file":"Activity.js","names":[],"sources":["../../../src/components/activity/Activity.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, type ReactNode } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport type { ObjectValues } from '../../utils/ObjectValues';\nimport type { RefComponent } from '../../utils/RefComponent';\n\nconst STATUS_MAP = {\n    AVAILABLE: 'available',\n    DRIVING: 'driving',\n    RESTING: 'resting',\n    WORKING: 'working',\n} as const;\n\nexport type ActivityStatus = ObjectValues<typeof STATUS_MAP>;\n\nconst icons: Record<ActivityStatus, string> = {\n    [STATUS_MAP.AVAILABLE]: 'icon-status-available',\n    [STATUS_MAP.WORKING]: 'icon-status-working',\n    [STATUS_MAP.DRIVING]: 'icon-status-driving',\n    [STATUS_MAP.RESTING]: 'icon-status-resting',\n};\n\nconst SIZE_MAP = { SIZE_SM: 'sm', SIZE_LG: 'lg', SIZE_XL: 'xl' } as const;\n\nexport type ActivitySize = ObjectValues<typeof SIZE_MAP>;\n\nexport type ActivityProps = {\n    /**\n     * Defines the type of activity.\n     *\n     * Possible values are `Activity.AVAILABLE`, `Activity.DRIVING`, `Activity.RESTING` or `Activity.WORKING`.\n     */\n    activity: ActivityStatus;\n\n    /**\n     * Define how large the component should be rendered.\n     *\n     * Possible values are `Activity.SIZE_SM`, `Activity.SIZE_LG` or `Activity.SIZE_XL`.\n     */\n    bsSize?: ActivitySize;\n\n    /**\n     * The actual duration value to be shown.\n     */\n    duration?: string | ReactNode;\n\n    /**\n     * Indicates whether the activity is outdated.\n     *\n     * @default false\n     */\n    isOutdated?: boolean;\n\n    /**\n     * Callback function for when the component is clicked.\n     */\n    onClick?: VoidFunction;\n\n    /**\n     * Additional classes for the wrapper element.\n     */\n    className?: string;\n};\n\ntype ActivityType = RefComponent<ActivityProps> & typeof STATUS_MAP & typeof SIZE_MAP;\n\nconst Activity = forwardRef((props: ActivityProps, ref: ForwardedRef<HTMLDivElement>) => {\n    const {\n        activity,\n        duration,\n        isOutdated = false,\n        bsSize,\n        onClick = () => {},\n        className = '',\n        ...remainingProps\n    } = props;\n\n    if (!activity) {\n        return null;\n    }\n\n    const wrapperClassNames = classNames(\n        'activity',\n        `activity-${activity}`,\n        isOutdated && 'opacity-50',\n        bsSize && `activity-${bsSize}`,\n        className && className\n    );\n\n    return (\n        <div ref={ref} {...remainingProps} className={wrapperClassNames} onClick={onClick}>\n            <span className='activity-icon'>\n                <span className={`uikit-icon ${icons[activity]}`} />\n            </span>\n            {duration && <span className='activity-text'>{duration}</span>}\n        </div>\n    );\n}) as ActivityType;\n\n// statics\nObject.assign(Activity, STATUS_MAP);\nObject.assign(Activity, SIZE_MAP);\n\nexport default Activity;\n"],"mappings":";;;;AAMA,IAAM,IAAa;CACf,WAAW;CACX,SAAS;CACT,SAAS;CACT,SAAS;AACb,GAIM,IAAwC;EACzC,EAAW,YAAY;EACvB,EAAW,UAAU;EACrB,EAAW,UAAU;EACrB,EAAW,UAAU;AAC1B,GAEM,IAAW;CAAE,SAAS;CAAM,SAAS;CAAM,SAAS;AAAK,GA4CzD,IAAW,GAAY,GAAsB,MAAsC;CACrF,IAAM,EACF,aACA,aACA,gBAAa,IACb,WACA,mBAAgB,CAAC,GACjB,eAAY,IACZ,GAAG,MACH;CAEJ,IAAI,CAAC,GACD,OAAO;CAGX,IAAM,IAAoB,EACtB,YACA,YAAY,KACZ,KAAc,cACd,KAAU,YAAY,KACtB,KAAa,CACjB;CAEA,OACI,kBAAC,OAAD;EAAU;EAAK,GAAI;EAAgB,WAAW;EAA4B;YAA1E,CACI,kBAAC,QAAD;GAAM,WAAU;aACZ,kBAAC,QAAD,EAAM,WAAW,cAAc,EAAM,KAAc,CAAA;EACjD,CAAA,GACL,KAAY,kBAAC,QAAD;GAAM,WAAU;aAAiB;EAAe,CAAA,CAC5D;;AAEb,CAAC;AAGD,OAAO,OAAO,GAAU,CAAU,GAClC,OAAO,OAAO,GAAU,CAAQ"}

package/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.d.ts

@@ -3,7 +3,7 @@ type AnalyticsAnalysisBannerProps = {
     /**
      * Ref forwarded to the draggable banner root element.
      */
-    bannerRef: RefObject<HTMLDivElement>;
+    bannerRef: RefObject<HTMLDivElement | null>;
     /**
      * Inline style applied to the draggable banner container.
      */

package/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.js

@@ -1,123 +1,80 @@
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-import t from "../filepicker/FilePicker.js";
-import r from "../button/Button.js";
-import v from "../../utils/classNames.js";
-const w = (c) => {
-  const {
-    bannerRef: d,
-    bannerStyle: p,
-    analyticsDateRangeLabel: o,
-    loadedCsvName: i,
-    showOverlayDetails: n,
-    showOverlayLabelText: s,
-    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,
-            {
-              displayMode: t.DISPLAY_MODE_DROPZONE,
-              onPick: g,
-              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(), 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();
-                  }
-                }
-              )
-            ] })
-          ] })
-        ] })
-      ] })
-    }
-  );
+import e from "../../utils/classNames.js";
+import t from "../button/Button.js";
+import n from "../filepicker/FilePicker.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.tsx
+var a = (a) => {
+	let { bannerRef: o, bannerStyle: s, analyticsDateRangeLabel: c, loadedCsvName: l, showOverlayDetails: u, showOverlayLabelText: d, isDragging: f, onCsvPick: p, onToggleOverlayDetails: m, onToggleOverlayLabelText: h, onClearCsv: g, onDragHandleDown: _ } = a;
+	return /* @__PURE__ */ r("div", {
+		ref: o,
+		className: "position-fixed rounded padding-x-10 padding-y-10 text-color-white bg-secondary shadow-focused pointer-events-all z-index-max",
+		style: s,
+		children: /* @__PURE__ */ i("div", {
+			className: "display-flex align-items-center gap-10",
+			children: [/* @__PURE__ */ r("span", {
+				role: "button",
+				tabIndex: 0,
+				"aria-label": "Drag analytics overlay banner",
+				className: e("uikit-icon icon-drag-n-drop text-size-20 margin-top-2", f ? "cursor-grabbing" : "cursor-grab"),
+				onPointerDown: _
+			}), /* @__PURE__ */ i("div", { children: [!l && /* @__PURE__ */ r(n, {
+				displayMode: n.DISPLAY_MODE_DROPZONE,
+				onPick: p,
+				accept: {
+					"text/csv": [".csv"],
+					"application/vnd.ms-excel": [".csv"]
+				},
+				children: ({ isDragActive: e }) => /* @__PURE__ */ r("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: e ? "Drop analytics CSV here ..." : "Drop analytics CSV here, or click to select"
+				})
+			}), l && /* @__PURE__ */ i("div", {
+				className: "display-flex align-items-center justify-content-center gap-15",
+				children: [/* @__PURE__ */ i("div", {
+					className: "line-height-14 display-flex flex-column gap-2",
+					children: [c && /* @__PURE__ */ r("div", {
+						className: "text-bold",
+						children: c
+					}), /* @__PURE__ */ r("div", { children: l })]
+				}), /* @__PURE__ */ i("div", {
+					className: "display-flex gap-5",
+					children: [
+						/* @__PURE__ */ r(t, {
+							bsSize: "xs",
+							bsStyle: "muted-filled",
+							iconOnly: !0,
+							onClick: (e) => {
+								e.preventDefault(), e.stopPropagation(), m();
+							},
+							"aria-label": u ? "Hide analytics overlay details" : "Show analytics overlay details",
+							children: /* @__PURE__ */ r("span", { className: `uikit-icon ${u ? "icon-eye-open" : "icon-eye-closed"}` })
+						}),
+						/* @__PURE__ */ r(t, {
+							bsSize: "xs",
+							bsStyle: "muted-filled",
+							iconOnly: !0,
+							onClick: (e) => {
+								e.preventDefault(), e.stopPropagation(), h();
+							},
+							"aria-label": d ? "Hide analytics label text" : "Show analytics label text",
+							children: /* @__PURE__ */ r("span", { className: `uikit-icon rotate-90 ${d ? "icon-arrows-collapse" : "icon-arrows-expand"}` })
+						}),
+						/* @__PURE__ */ r(t, {
+							bsSize: "xs",
+							bsStyle: "muted-filled",
+							iconName: "icon-trash",
+							iconOnly: !0,
+							onClick: (e) => {
+								e.preventDefault(), e.stopPropagation(), g();
+							}
+						})
+					]
+				})]
+			})] })]
+		})
+	});
 };
-export {
-  w as AnalyticsAnalysisBanner
-};
-//# sourceMappingURL=AnalyticsAnalysisBanner.js.map
+//#endregion
+export { a 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 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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"}
+{"version":3,"file":"AnalyticsAnalysisBanner.js","names":[],"sources":["../../../src/components/analyticsAnalysisOverlay/AnalyticsAnalysisBanner.tsx"],"sourcesContent":["import type { CSSProperties, PointerEvent as ReactPointerEvent, Ref, 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 | null>;\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 as Ref<HTMLDivElement>}\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                        'uikit-icon icon-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={`uikit-icon ${\n                                            showOverlayDetails ? 'icon-eye-open' : 'icon-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={`uikit-icon rotate-90 ${\n                                            showOverlayLabelText ? 'icon-arrows-collapse' : 'icon-arrows-expand'\n                                        }`}\n                                    />\n                                </Button>\n                                <Button\n                                    bsSize='xs'\n                                    bsStyle='muted-filled'\n                                    iconName='icon-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"],"mappings":";;;;;AAoEA,IAAa,KAA2B,MAAwC;CAC5E,IAAM,EACF,cACA,gBACA,4BACA,kBACA,uBACA,yBACA,eACA,cACA,2BACA,6BACA,eACA,wBACA;CAEJ,OACI,kBAAC,OAAD;EACI,KAAK;EACL,WAAU;EACV,OAAO;YAEP,kBAAC,OAAD;GAAK,WAAU;aAAf,CACI,kBAAC,QAAD;IACI,MAAK;IACL,UAAU;IACV,cAAW;IACX,WAAW,EACP,yDACA,IAAa,oBAAoB,aACrC;IACA,eAAe;GAClB,CAAA,GAED,kBAAC,OAAD,EAAA,UAAA,CACK,CAAC,KACE,kBAAC,GAAD;IACI,aAAa,EAAW;IACxB,QAAQ;IACR,QAAQ;KACJ,YAAY,CAAC,MAAM;KACnB,4BAA4B,CAAC,MAAM;IACvC;eAEE,EAAE,sBACA,kBAAC,OAAD;KACI,WACI;eAIH,IACK,gCACA;IACL,CAAA;GAED,CAAA,GAGf,KACG,kBAAC,OAAD;IAAK,WAAU;cAAf,CACI,kBAAC,OAAD;KAAK,WAAU;eAAf,CACK,KAA2B,kBAAC,OAAD;MAAK,WAAU;gBAAa;KAA6B,CAAA,GACrF,kBAAC,OAAD,EAAA,UAAM,EAAmB,CAAA,CACxB;QACL,kBAAC,OAAD;KAAK,WAAU;eAAf;MACI,kBAAC,GAAD;OACI,QAAO;OACP,SAAQ;OACR,UAAA;OACA,UAAS,MAAS;QAGd,AAFA,EAAM,eAAe,GACrB,EAAM,gBAAgB,GACtB,EAAuB;OAC3B;OACA,cACI,IACM,mCACA;iBAGV,kBAAC,QAAD,EACI,WAAW,cACP,IAAqB,kBAAkB,oBAE9C,CAAA;MACG,CAAA;MACR,kBAAC,GAAD;OACI,QAAO;OACP,SAAQ;OACR,UAAA;OACA,UAAS,MAAS;QAGd,AAFA,EAAM,eAAe,GACrB,EAAM,gBAAgB,GACtB,EAAyB;OAC7B;OACA,cACI,IAAuB,8BAA8B;iBAGzD,kBAAC,QAAD,EACI,WAAW,wBACP,IAAuB,yBAAyB,uBAEvD,CAAA;MACG,CAAA;MACR,kBAAC,GAAD;OACI,QAAO;OACP,SAAQ;OACR,UAAS;OACT,UAAA;OACA,UAAS,MAAS;QAGd,AAFA,EAAM,eAAe,GACrB,EAAM,gBAAgB,GACtB,EAAW;OACf;MACH,CAAA;KACA;MACJ;KAER,EAAA,CAAA,CACJ;;CACJ,CAAA;AAEb"}