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

package/components/pager/Pager.js

@@ -1,96 +1,53 @@
-import { jsxs as r, jsx as s } from "react/jsx-runtime";
-import { useState as I } from "react";
 import e from "../../utils/classNames.js";
-const i = {
-  VARIANT_FULL: "full",
-  VARIANT_COMPACT: "compact"
-}, o = (A) => {
-  const {
-    title: n,
-    label: C,
-    alignRight: t = !1,
-    variant: N = i.VARIANT_FULL,
-    disabled: l = !1,
-    onClick: c,
-    className: d,
-    ...g
-  } = A, [a, h] = I(!1), p = () => !l && h(!0), m = () => h(!1), v = N === o.VARIANT_COMPACT, x = e(
-    "Pager",
-    "bg-white",
-    "border",
-    "display-flex justify-space-between align-items-center",
-    a && "border-color-highlight",
-    t && "flex-row-reverse",
-    l && "pointer-events-none",
-    "cursor-pointer user-select-none"
-  ), f = e(
-    "rioglyph",
-    l ? "text-color-light" : "text-color-darker",
-    a && "text-color-highlight"
-  ), u = e(
-    l ? "text-color-light" : "text-color-darker",
-    a && "text-color-highlight"
-  );
-  if (v) {
-    const w = e(
-      x,
-      "rounded-circle",
-      "padding-y-5 padding-x-15",
-      "width-auto",
-      d
-    ), V = e(
-      f,
-      t ? "rioglyph-chevron-left margin-right-5" : "rioglyph-chevron-right margin-left-5",
-      "text-size-10"
-    );
-    return /* @__PURE__ */ r(
-      "div",
-      {
-        ...g,
-        className: w,
-        onMouseEnter: p,
-        onMouseLeave: m,
-        onClick: c,
-        children: [
-          /* @__PURE__ */ s("div", { className: `display-flex flex-1-1 flex-column ${t ? "align-items-end" : ""}`, children: /* @__PURE__ */ s("div", { className: u, children: n }) }),
-          /* @__PURE__ */ s("span", { className: V })
-        ]
-      }
-    );
-  }
-  const y = e(
-    x,
-    "rounded",
-    "padding-y-15 padding-x-20",
-    "width-100pct",
-    d
-  ), T = e(
-    f,
-    t ? "rioglyph-arrow-left margin-right-10" : "rioglyph-arrow-right margin-left-10",
-    "text-size-200pct"
-  ), L = e(u, t && "text-right", "text-size-16 text-medium");
-  return /* @__PURE__ */ r(
-    "div",
-    {
-      ...g,
-      className: y,
-      onMouseEnter: p,
-      onMouseLeave: m,
-      onClick: c,
-      children: [
-        /* @__PURE__ */ r("div", { className: `display-flex flex-1-1 flex-column ${t ? "align-items-end" : ""}`, children: [
-          /* @__PURE__ */ s("div", { className: "text-color-gray line-height-16", children: C }),
-          /* @__PURE__ */ s("div", { className: L, children: n })
-        ] }),
-        /* @__PURE__ */ s("div", { className: "text-size-12 display-grid place-items-center", children: /* @__PURE__ */ s("span", { className: T }) })
-      ]
-    }
-  );
+import { useState as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/pager/Pager.tsx
+var i = {
+	VARIANT_FULL: "full",
+	VARIANT_COMPACT: "compact"
+}, a = (o) => {
+	let { title: s, label: c, alignRight: l = !1, variant: u = i.VARIANT_FULL, disabled: d = !1, onClick: f, className: p, ...m } = o, [h, g] = t(!1), _ = () => !d && g(!0), v = () => g(!1), y = u === a.VARIANT_COMPACT, b = e("Pager", "bg-white", "border", "display-flex justify-space-between align-items-center", h && "border-color-highlight", l && "flex-row-reverse", d && "pointer-events-none", "cursor-pointer user-select-none"), x = e("uikit-icon", d ? "text-color-light" : "text-color-darker", h && "text-color-highlight"), S = e(d ? "text-color-light" : "text-color-darker", h && "text-color-highlight");
+	if (y) {
+		let t = e(b, "rounded-circle", "padding-y-5 padding-x-15", "width-auto", p), i = e(x, l ? "icon-chevron-left margin-right-5" : "icon-chevron-right margin-left-5", "text-size-10");
+		return /* @__PURE__ */ r("div", {
+			...m,
+			className: t,
+			onMouseEnter: _,
+			onMouseLeave: v,
+			onClick: f,
+			children: [/* @__PURE__ */ n("div", {
+				className: `display-flex flex-1-1 flex-column ${l ? "align-items-end" : ""}`,
+				children: /* @__PURE__ */ n("div", {
+					className: S,
+					children: s
+				})
+			}), /* @__PURE__ */ n("span", { className: i })]
+		});
+	}
+	let C = e(b, "rounded", "padding-y-15 padding-x-20", "width-100pct", p), w = e(x, l ? "icon-arrow-left margin-right-10" : "icon-arrow-right margin-left-10", "text-size-200pct"), T = e(S, l && "text-right", "text-size-16 text-medium");
+	return /* @__PURE__ */ r("div", {
+		...m,
+		className: C,
+		onMouseEnter: _,
+		onMouseLeave: v,
+		onClick: f,
+		children: [/* @__PURE__ */ r("div", {
+			className: `display-flex flex-1-1 flex-column ${l ? "align-items-end" : ""}`,
+			children: [/* @__PURE__ */ n("div", {
+				className: "text-color-gray line-height-16",
+				children: c
+			}), /* @__PURE__ */ n("div", {
+				className: T,
+				children: s
+			})]
+		}), /* @__PURE__ */ n("div", {
+			className: "text-size-12 display-grid place-items-center",
+			children: /* @__PURE__ */ n("span", { className: w })
+		})]
+	});
 };
-o.VARIANT_FULL = i.VARIANT_FULL;
-o.VARIANT_COMPACT = i.VARIANT_COMPACT;
-export {
-  i as PagerVariant,
-  o as default
-};
-//# sourceMappingURL=Pager.js.map
+a.VARIANT_FULL = i.VARIANT_FULL, a.VARIANT_COMPACT = i.VARIANT_COMPACT;
+//#endregion
+export { i as PagerVariant, a as default };
+
+//# sourceMappingURL=Pager.js.map

package/components/pager/Pager.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pager.js","sources":["../../../src/components/pager/Pager.tsx"],"sourcesContent":["import type React from 'react';\nimport { useState } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport type { ObjectValues } from '../../utils/ObjectValues';\n\nexport const PagerVariant = {\n    VARIANT_FULL: 'full',\n    VARIANT_COMPACT: 'compact',\n} as const;\n\nexport type PagerProps = {\n    /**\n     * The title or name of the section next/previous section.\n     */\n    title: string | React.ReactNode;\n\n    /**\n     * The optional label for the full variant.\n     */\n    label?: string | React.ReactNode;\n\n    /**\n     * Set right alignment for \"previous\" pager content to be aligned\n     * to the right side of the pager and the arrow on the left side.\n     *\n     * @default false\n     */\n    alignRight?: boolean;\n\n    /**\n     * Define how large the component should be rendered.\n     *\n     * Possible values are:\n     * `Pager.VARIANT_FULL`, `Pager.VARIANT_COMPACT` or\n     * `full`, `compact`.\n     *\n     * @default `full`\n     */\n    variant?: ObjectValues<typeof PagerVariant>;\n\n    /**\n     * Sets the pager disabled.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Callback function for when the component is clicked.\n     *\n     * @param event\n     * @returns\n     */\n    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n\n    /**\n     * Additional classes for the wrapper element.\n     */\n    className?: string;\n};\n\nconst Pager = (props: PagerProps) => {\n    const {\n        title,\n        label,\n        alignRight = false,\n        variant = PagerVariant.VARIANT_FULL,\n        disabled = false,\n        onClick,\n        className,\n        ...remainingProps\n    } = props;\n\n    const [isHover, setIsHover] = useState(false);\n\n    const handleEnter = () => !disabled && setIsHover(true);\n    const handleLeave = () => setIsHover(false);\n\n    const isCompactVariant = variant === Pager.VARIANT_COMPACT;\n\n    const wrapperClassesBase = classNames(\n        'Pager',\n        'bg-white',\n        'border',\n        'display-flex justify-space-between align-items-center',\n        isHover && 'border-color-highlight',\n        alignRight && 'flex-row-reverse',\n        disabled && 'pointer-events-none',\n        'cursor-pointer user-select-none'\n    );\n\n    const iconClassesBase = classNames(\n        'rioglyph',\n        disabled ? 'text-color-light' : 'text-color-darker',\n        isHover && 'text-color-highlight'\n    );\n\n    const titleClassesBase = classNames(\n        disabled ? 'text-color-light' : 'text-color-darker',\n        isHover && 'text-color-highlight'\n    );\n\n    // The compact version has a slightly different markup and different classes for the\n    // individual parts, hence we extend the base classes\n    if (isCompactVariant) {\n        const wrapperClassesCompact = classNames(\n            wrapperClassesBase,\n            'rounded-circle',\n            'padding-y-5 padding-x-15',\n            'width-auto',\n            className\n        );\n\n        const iconClassesCompact = classNames(\n            iconClassesBase,\n            alignRight ? 'rioglyph-chevron-left margin-right-5' : 'rioglyph-chevron-right margin-left-5',\n            'text-size-10'\n        );\n\n        return (\n            <div\n                {...remainingProps}\n                className={wrapperClassesCompact}\n                onMouseEnter={handleEnter}\n                onMouseLeave={handleLeave}\n                onClick={onClick}\n            >\n                <div className={`display-flex flex-1-1 flex-column ${alignRight ? 'align-items-end' : ''}`}>\n                    <div className={titleClassesBase}>{title}</div>\n                </div>\n                <span className={iconClassesCompact} />\n            </div>\n        );\n    }\n\n    const wrapperClassesFull = classNames(\n        wrapperClassesBase,\n        'rounded',\n        'padding-y-15 padding-x-20',\n        'width-100pct',\n        className\n    );\n\n    const iconClassesFull = classNames(\n        iconClassesBase,\n        alignRight ? 'rioglyph-arrow-left margin-right-10' : 'rioglyph-arrow-right margin-left-10',\n        'text-size-200pct'\n    );\n\n    const titleClassesFull = classNames(titleClassesBase, alignRight && 'text-right', 'text-size-16 text-medium');\n\n    return (\n        <div\n            {...remainingProps}\n            className={wrapperClassesFull}\n            onMouseEnter={handleEnter}\n            onMouseLeave={handleLeave}\n            onClick={onClick}\n        >\n            <div className={`display-flex flex-1-1 flex-column ${alignRight ? 'align-items-end' : ''}`}>\n                <div className='text-color-gray line-height-16'>{label}</div>\n                <div className={titleClassesFull}>{title}</div>\n            </div>\n            <div className='text-size-12 display-grid place-items-center'>\n                <span className={iconClassesFull} />\n            </div>\n        </div>\n    );\n};\n\nPager.VARIANT_FULL = PagerVariant.VARIANT_FULL;\nPager.VARIANT_COMPACT = PagerVariant.VARIANT_COMPACT;\n\nexport default Pager;\n"],"names":["PagerVariant","Pager","props","title","label","alignRight","variant","disabled","onClick","className","remainingProps","isHover","setIsHover","useState","handleEnter","handleLeave","isCompactVariant","wrapperClassesBase","classNames","iconClassesBase","titleClassesBase","wrapperClassesCompact","iconClassesCompact","jsxs","jsx","wrapperClassesFull","iconClassesFull","titleClassesFull"],"mappings":";;;AAMO,MAAMA,IAAe;AAAA,EACxB,cAAc;AAAA,EACd,iBAAiB;AACrB,GAqDMC,IAAQ,CAACC,MAAsB;AACjC,QAAM;AAAA,IACF,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,SAAAC,IAAUN,EAAa;AAAA,IACvB,UAAAO,IAAW;AAAA,IACX,SAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHR,GAEE,CAACS,GAASC,CAAU,IAAIC,EAAS,EAAK,GAEtCC,IAAc,MAAM,CAACP,KAAYK,EAAW,EAAI,GAChDG,IAAc,MAAMH,EAAW,EAAK,GAEpCI,IAAmBV,MAAYL,EAAM,iBAErCgB,IAAqBC;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACAP,KAAW;AAAA,IACXN,KAAc;AAAA,IACdE,KAAY;AAAA,IACZ;AAAA,EAAA,GAGEY,IAAkBD;AAAA,IACpB;AAAA,IACAX,IAAW,qBAAqB;AAAA,IAChCI,KAAW;AAAA,EAAA,GAGTS,IAAmBF;AAAA,IACrBX,IAAW,qBAAqB;AAAA,IAChCI,KAAW;AAAA,EAAA;AAKf,MAAIK,GAAkB;AAClB,UAAMK,IAAwBH;AAAA,MAC1BD;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACAR;AAAA,IAAA,GAGEa,IAAqBJ;AAAA,MACvBC;AAAA,MACAd,IAAa,yCAAyC;AAAA,MACtD;AAAA,IAAA;AAGJ,WACI,gBAAAkB;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAGb;AAAA,QACJ,WAAWW;AAAA,QACX,cAAcP;AAAA,QACd,cAAcC;AAAA,QACd,SAAAP;AAAA,QAEA,UAAA;AAAA,UAAA,gBAAAgB,EAAC,OAAA,EAAI,WAAW,qCAAqCnB,IAAa,oBAAoB,EAAE,IACpF,UAAA,gBAAAmB,EAAC,OAAA,EAAI,WAAWJ,GAAmB,UAAAjB,EAAA,CAAM,GAC7C;AAAA,UACA,gBAAAqB,EAAC,QAAA,EAAK,WAAWF,EAAA,CAAoB;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjD;AAEA,QAAMG,IAAqBP;AAAA,IACvBD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACAR;AAAA,EAAA,GAGEiB,IAAkBR;AAAA,IACpBC;AAAA,IACAd,IAAa,wCAAwC;AAAA,IACrD;AAAA,EAAA,GAGEsB,IAAmBT,EAAWE,GAAkBf,KAAc,cAAc,0BAA0B;AAE5G,SACI,gBAAAkB;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAGb;AAAA,MACJ,WAAWe;AAAA,MACX,cAAcX;AAAA,MACd,cAAcC;AAAA,MACd,SAAAP;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAe,EAAC,SAAI,WAAW,qCAAqClB,IAAa,oBAAoB,EAAE,IACpF,UAAA;AAAA,UAAA,gBAAAmB,EAAC,OAAA,EAAI,WAAU,kCAAkC,UAAApB,GAAM;AAAA,UACvD,gBAAAoB,EAAC,OAAA,EAAI,WAAWG,GAAmB,UAAAxB,EAAA,CAAM;AAAA,QAAA,GAC7C;AAAA,QACA,gBAAAqB,EAAC,SAAI,WAAU,gDACX,4BAAC,QAAA,EAAK,WAAWE,GAAiB,EAAA,CACtC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGZ;AAEAzB,EAAM,eAAeD,EAAa;AAClCC,EAAM,kBAAkBD,EAAa;"}
+{"version":3,"file":"Pager.js","names":[],"sources":["../../../src/components/pager/Pager.tsx"],"sourcesContent":["import type React from 'react';\nimport { useState } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport type { ObjectValues } from '../../utils/ObjectValues';\n\nexport const PagerVariant = {\n    VARIANT_FULL: 'full',\n    VARIANT_COMPACT: 'compact',\n} as const;\n\nexport type PagerProps = {\n    /**\n     * The title or name of the section next/previous section.\n     */\n    title: string | React.ReactNode;\n\n    /**\n     * The optional label for the full variant.\n     */\n    label?: string | React.ReactNode;\n\n    /**\n     * Set right alignment for \"previous\" pager content to be aligned\n     * to the right side of the pager and the arrow on the left side.\n     *\n     * @default false\n     */\n    alignRight?: boolean;\n\n    /**\n     * Define how large the component should be rendered.\n     *\n     * Possible values are:\n     * `Pager.VARIANT_FULL`, `Pager.VARIANT_COMPACT` or\n     * `full`, `compact`.\n     *\n     * @default `full`\n     */\n    variant?: ObjectValues<typeof PagerVariant>;\n\n    /**\n     * Sets the pager disabled.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Callback function for when the component is clicked.\n     *\n     * @param event\n     * @returns\n     */\n    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n\n    /**\n     * Additional classes for the wrapper element.\n     */\n    className?: string;\n};\n\nconst Pager = (props: PagerProps) => {\n    const {\n        title,\n        label,\n        alignRight = false,\n        variant = PagerVariant.VARIANT_FULL,\n        disabled = false,\n        onClick,\n        className,\n        ...remainingProps\n    } = props;\n\n    const [isHover, setIsHover] = useState(false);\n\n    const handleEnter = () => !disabled && setIsHover(true);\n    const handleLeave = () => setIsHover(false);\n\n    const isCompactVariant = variant === Pager.VARIANT_COMPACT;\n\n    const wrapperClassesBase = classNames(\n        'Pager',\n        'bg-white',\n        'border',\n        'display-flex justify-space-between align-items-center',\n        isHover && 'border-color-highlight',\n        alignRight && 'flex-row-reverse',\n        disabled && 'pointer-events-none',\n        'cursor-pointer user-select-none'\n    );\n\n    const iconClassesBase = classNames(\n        'uikit-icon',\n        disabled ? 'text-color-light' : 'text-color-darker',\n        isHover && 'text-color-highlight'\n    );\n\n    const titleClassesBase = classNames(\n        disabled ? 'text-color-light' : 'text-color-darker',\n        isHover && 'text-color-highlight'\n    );\n\n    // The compact version has a slightly different markup and different classes for the\n    // individual parts, hence we extend the base classes\n    if (isCompactVariant) {\n        const wrapperClassesCompact = classNames(\n            wrapperClassesBase,\n            'rounded-circle',\n            'padding-y-5 padding-x-15',\n            'width-auto',\n            className\n        );\n\n        const iconClassesCompact = classNames(\n            iconClassesBase,\n            alignRight ? 'icon-chevron-left margin-right-5' : 'icon-chevron-right margin-left-5',\n            'text-size-10'\n        );\n\n        return (\n            <div\n                {...remainingProps}\n                className={wrapperClassesCompact}\n                onMouseEnter={handleEnter}\n                onMouseLeave={handleLeave}\n                onClick={onClick}\n            >\n                <div className={`display-flex flex-1-1 flex-column ${alignRight ? 'align-items-end' : ''}`}>\n                    <div className={titleClassesBase}>{title}</div>\n                </div>\n                <span className={iconClassesCompact} />\n            </div>\n        );\n    }\n\n    const wrapperClassesFull = classNames(\n        wrapperClassesBase,\n        'rounded',\n        'padding-y-15 padding-x-20',\n        'width-100pct',\n        className\n    );\n\n    const iconClassesFull = classNames(\n        iconClassesBase,\n        alignRight ? 'icon-arrow-left margin-right-10' : 'icon-arrow-right margin-left-10',\n        'text-size-200pct'\n    );\n\n    const titleClassesFull = classNames(titleClassesBase, alignRight && 'text-right', 'text-size-16 text-medium');\n\n    return (\n        <div\n            {...remainingProps}\n            className={wrapperClassesFull}\n            onMouseEnter={handleEnter}\n            onMouseLeave={handleLeave}\n            onClick={onClick}\n        >\n            <div className={`display-flex flex-1-1 flex-column ${alignRight ? 'align-items-end' : ''}`}>\n                <div className='text-color-gray line-height-16'>{label}</div>\n                <div className={titleClassesFull}>{title}</div>\n            </div>\n            <div className='text-size-12 display-grid place-items-center'>\n                <span className={iconClassesFull} />\n            </div>\n        </div>\n    );\n};\n\nPager.VARIANT_FULL = PagerVariant.VARIANT_FULL;\nPager.VARIANT_COMPACT = PagerVariant.VARIANT_COMPACT;\n\nexport default Pager;\n"],"mappings":";;;;AAMA,IAAa,IAAe;CACxB,cAAc;CACd,iBAAiB;AACrB,GAqDM,KAAS,MAAsB;CACjC,IAAM,EACF,UACA,UACA,gBAAa,IACb,aAAU,EAAa,cACvB,cAAW,IACX,YACA,cACA,GAAG,MACH,GAEE,CAAC,GAAS,KAAc,EAAS,EAAK,GAEtC,UAAoB,CAAC,KAAY,EAAW,EAAI,GAChD,UAAoB,EAAW,EAAK,GAEpC,IAAmB,MAAY,EAAM,iBAErC,IAAqB,EACvB,SACA,YACA,UACA,yDACA,KAAW,0BACX,KAAc,oBACd,KAAY,uBACZ,iCACJ,GAEM,IAAkB,EACpB,cACA,IAAW,qBAAqB,qBAChC,KAAW,sBACf,GAEM,IAAmB,EACrB,IAAW,qBAAqB,qBAChC,KAAW,sBACf;CAIA,IAAI,GAAkB;EAClB,IAAM,IAAwB,EAC1B,GACA,kBACA,4BACA,cACA,CACJ,GAEM,IAAqB,EACvB,GACA,IAAa,qCAAqC,oCAClD,cACJ;EAEA,OACI,kBAAC,OAAD;GACI,GAAI;GACJ,WAAW;GACX,cAAc;GACd,cAAc;GACL;aALb,CAOI,kBAAC,OAAD;IAAK,WAAW,qCAAqC,IAAa,oBAAoB;cAClF,kBAAC,OAAD;KAAK,WAAW;eAAmB;IAAW,CAAA;GAC7C,CAAA,GACL,kBAAC,QAAD,EAAM,WAAW,EAAqB,CAAA,CACrC;;CAEb;CAEA,IAAM,IAAqB,EACvB,GACA,WACA,6BACA,gBACA,CACJ,GAEM,IAAkB,EACpB,GACA,IAAa,oCAAoC,mCACjD,kBACJ,GAEM,IAAmB,EAAW,GAAkB,KAAc,cAAc,0BAA0B;CAE5G,OACI,kBAAC,OAAD;EACI,GAAI;EACJ,WAAW;EACX,cAAc;EACd,cAAc;EACL;YALb,CAOI,kBAAC,OAAD;GAAK,WAAW,qCAAqC,IAAa,oBAAoB;aAAtF,CACI,kBAAC,OAAD;IAAK,WAAU;cAAkC;GAAW,CAAA,GAC5D,kBAAC,OAAD;IAAK,WAAW;cAAmB;GAAW,CAAA,CAC7C;MACL,kBAAC,OAAD;GAAK,WAAU;aACX,kBAAC,QAAD,EAAM,WAAW,EAAkB,CAAA;EAClC,CAAA,CACJ;;AAEb;AAEA,EAAM,eAAe,EAAa,cAClC,EAAM,kBAAkB,EAAa"}

package/components/popover/Popover.d.ts

@@ -1,11 +1,11 @@
 import { ForwardRefExoticComponent, RefAttributes, PropsWithChildren, ReactNode, ComponentProps } from 'react';
 export declare const PLACEMENT_MAP: {
-    readonly AUTO: "auto";
     readonly TOP: "top";
     readonly RIGHT: "right";
     readonly BOTTOM: "bottom";
     readonly LEFT: "left";
 };
+export type PopoverPlacement = (typeof PLACEMENT_MAP)[keyof typeof PLACEMENT_MAP];
 export type PopoverProps = Omit<ComponentProps<'div'>, 'title'> & {
     /**
      * HTML ID attribute, necessary for accessibility.
@@ -14,21 +14,28 @@ export type PopoverProps = Omit<ComponentProps<'div'>, 'title'> & {
     /**
      * Sets the direction the Popover is positioned towards.
      *
-     * This is generally provided by the OverlayTrigger component positioning the Popover.
-     *
      * Possible values are:
      *
-     * - `auto`
      * - `top`
      * - `right`
      * - `bottom`
      * - `left`
      */
-    placement?: 'auto' | 'top' | 'right' | 'bottom' | 'left';
+    placement?: PopoverPlacement;
     /**
      * Additional props assigned to the arrow element. Internally used.
      */
     arrowProps?: Record<string, unknown>;
+    /**
+     * Defines whether the Popover renders an arrow.
+     *
+     * Set this to `false` as an escape hatch when the arrow does not fit the surrounding layout.
+     * When disabled, the Popover also sets `--overlay-arrow-size` to `0px` so OverlayTrigger no longer reserves arrow
+     * spacing.
+     *
+     * @default true
+     */
+    showArrow?: boolean;
     /**
      * Any element to be rendered as the title of the Popover.
      *

package/components/popover/Popover.js

@@ -1,44 +1,51 @@
-import { jsxs as O, jsx as s } from "react/jsx-runtime";
-import h, { forwardRef as u, useState as E, useEffect as M, isValidElement as A } from "react";
-import { PLACEMENT as t } from "../../values/Placement.js";
-const w = {
-  AUTO: t.AUTO,
-  TOP: t.TOP,
-  RIGHT: t.RIGHT,
-  BOTTOM: t.BOTTOM,
-  LEFT: t.LEFT
-}, a = ({ className: e = "", children: o }) => /* @__PURE__ */ s("div", { className: `popover-header popover-title ${e}`, children: o }), n = ({ className: e = "", children: o }) => /* @__PURE__ */ s("div", { className: `popover-content popover-body ${e}`, children: o }), x = (e) => A(e) && (e.type === a || e.type === n), c = u((e, o) => {
-  const {
-    placement: l = "bottom",
-    arrowProps: p,
-    title: i,
-    titleClassName: m = "",
-    contentClassName: T = "",
-    children: r,
-    className: d = "",
-    ...v
-  } = e, N = !!i, P = h.Children.toArray(r).some(x), [f, C] = E(!1);
-  return M(() => C(!0), []), /* @__PURE__ */ O(
-    "div",
-    {
-      ...v,
-      role: "tooltip",
-      "x-placement": l,
-      ref: o,
-      className: `popover fade ${f ? "show" : ""} ${d}`,
-      children: [
-        /* @__PURE__ */ s("div", { className: "arrow", ...p }),
-        N && /* @__PURE__ */ s(a, { className: m, children: i }),
-        P ? r : /* @__PURE__ */ s(n, { className: T, children: r })
-      ]
-    }
-  );
+import { PLACEMENT as e } from "../../values/Placement.js";
+import t, { forwardRef as n, isValidElement as r, useEffect as i, useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/popover/Popover.tsx
+var c = {
+	TOP: e.TOP,
+	RIGHT: e.RIGHT,
+	BOTTOM: e.BOTTOM,
+	LEFT: e.LEFT
+}, l = ({ className: e = "", children: t }) => /* @__PURE__ */ o("div", {
+	className: `popover-header popover-title ${e}`,
+	children: t
+}), u = ({ className: e = "", children: t }) => /* @__PURE__ */ o("div", {
+	className: `popover-content popover-body ${e}`,
+	children: t
+}), d = (e) => r(e) && (e.type === l || e.type === u), f = n((e, n) => {
+	let { placement: r = "bottom", arrowProps: c, showArrow: f = !0, title: p, titleClassName: m = "", contentClassName: h = "", children: g, className: _ = "", style: v, ...y } = e, b = !!p, x = t.Children.toArray(g).some(d), [S, C] = a(!1);
+	i(() => C(!0), []);
+	let w = { popover: "manual" }, T = {
+		...v,
+		...f ? {} : { "--overlay-arrow-size": "0px" }
+	};
+	return /* @__PURE__ */ s("div", {
+		"data-overlay-arrow-placement": r,
+		...y,
+		...w,
+		role: "tooltip",
+		ref: n,
+		className: `popover fade ${S ? "show" : ""} ${_}`,
+		style: T,
+		children: [
+			f && /* @__PURE__ */ o("div", {
+				className: "arrow",
+				...c
+			}),
+			b && /* @__PURE__ */ o(l, {
+				className: m,
+				children: p
+			}),
+			x ? g : /* @__PURE__ */ o(u, {
+				className: h,
+				children: g
+			})
+		]
+	});
 });
-c.Title = a;
-c.Content = n;
-Object.assign(c, w);
-export {
-  w as PLACEMENT_MAP,
-  c as default
-};
-//# sourceMappingURL=Popover.js.map
+f.Title = l, f.Content = u, Object.assign(f, c);
+//#endregion
+export { c as PLACEMENT_MAP, f as default };
+
+//# sourceMappingURL=Popover.js.map

package/components/popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../src/components/popover/Popover.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    type ForwardRefExoticComponent,\n    type RefAttributes,\n    type PropsWithChildren,\n    type ReactNode,\n    type ComponentProps,\n    isValidElement,\n    useState,\n    useEffect,\n} from 'react';\n\nimport { PLACEMENT } from '../../values/Placement';\n\nexport const PLACEMENT_MAP = {\n    AUTO: PLACEMENT.AUTO,\n    TOP: PLACEMENT.TOP,\n    RIGHT: PLACEMENT.RIGHT,\n    BOTTOM: PLACEMENT.BOTTOM,\n    LEFT: PLACEMENT.LEFT,\n} as const;\n\nexport type PopoverProps = Omit<ComponentProps<'div'>, 'title'> & {\n    /**\n     * HTML ID attribute, necessary for accessibility.\n     */\n    id: string;\n\n    /**\n     * Sets the direction the Popover is positioned towards.\n     *\n     * This is generally provided by the OverlayTrigger component positioning the Popover.\n     *\n     * Possible values are:\n     *\n     * - `auto`\n     * - `top`\n     * - `right`\n     * - `bottom`\n     * - `left`\n     */\n    placement?: 'auto' | 'top' | 'right' | 'bottom' | 'left';\n\n    /**\n     * Additional props assigned to the arrow element. Internally used.\n     */\n    arrowProps?: Record<string, unknown>;\n\n    /**\n     * Any element to be rendered as the title of the Popover.\n     *\n     * It creates a `Popover.Title` inside the `Popover` passing the title directly into it.\n     */\n    title?: string | ReactNode;\n\n    /**\n     * Additional classes to be set on the `Popover.Title` element.\n     */\n    titleClassName?: string;\n\n    /**\n     * Additional classes to be set on the `Popover.Content` element.\n     */\n    contentClassName?: string;\n\n    /**\n     * Additional class names for the wrapper element.\n     */\n    className?: string;\n};\n\nconst PopoverTitle = ({ className = '', children }: PropsWithChildren<{ className?: string }>) => (\n    <div className={`popover-header popover-title ${className}`}>{children}</div>\n);\n\nconst PopoverContent = ({ className = '', children }: PropsWithChildren<{ className?: string }>) => (\n    <div className={`popover-content popover-body ${className}`}>{children}</div>\n);\n\nconst isPopoverTitleOrContent = (element: ReactNode): boolean =>\n    isValidElement(element) && (element.type === PopoverTitle || element.type === PopoverContent);\n\ntype PopoverType = ForwardRefExoticComponent<PropsWithChildren<PopoverProps> & RefAttributes<HTMLDivElement>> & {\n    Title: typeof PopoverTitle;\n    Content: typeof PopoverContent;\n};\n\nconst Popover = forwardRef<HTMLDivElement, PropsWithChildren<PopoverProps>>((props, ref) => {\n    const {\n        placement = 'bottom',\n        arrowProps,\n        title,\n        titleClassName = '',\n        contentClassName = '',\n        children,\n        className = '',\n        ...remainingProps\n    } = props;\n\n    const hasTitle = !!title;\n    const hasCustomContent = React.Children.toArray(children).some(isPopoverTitleOrContent);\n\n    // Mount the component but don't show it yet via CSS.\n    // After it is mounted, we set the visibility class to use CSS animation\n    const [isMounted, setIsMounted] = useState(false);\n    useEffect(() => setIsMounted(true), []);\n\n    return (\n        <div\n            {...remainingProps}\n            role='tooltip'\n            // x-placement is used by the css to define how to position the arrow.\n            // eslint-disable-next-line react/no-unknown-property\n            x-placement={placement}\n            ref={ref}\n            className={`popover fade ${isMounted ? 'show' : ''} ${className}`}\n        >\n            <div className='arrow' {...arrowProps} />\n            {hasTitle && <PopoverTitle className={titleClassName}>{title}</PopoverTitle>}\n            {hasCustomContent ? children : <PopoverContent className={contentClassName}>{children}</PopoverContent>}\n        </div>\n    );\n}) as PopoverType;\n\nPopover.Title = PopoverTitle;\nPopover.Content = PopoverContent;\n\nObject.assign(Popover, PLACEMENT_MAP);\n\nexport default Popover;\n"],"names":["PLACEMENT_MAP","PLACEMENT","PopoverTitle","className","children","jsx","PopoverContent","isPopoverTitleOrContent","element","isValidElement","Popover","forwardRef","props","ref","placement","arrowProps","title","titleClassName","contentClassName","remainingProps","hasTitle","hasCustomContent","React","isMounted","setIsMounted","useState","useEffect","jsxs"],"mappings":";;;AAcO,MAAMA,IAAgB;AAAA,EACzB,MAAMC,EAAU;AAAA,EAChB,KAAKA,EAAU;AAAA,EACf,OAAOA,EAAU;AAAA,EACjB,QAAQA,EAAU;AAAA,EAClB,MAAMA,EAAU;AACpB,GAmDMC,IAAe,CAAC,EAAE,WAAAC,IAAY,IAAI,UAAAC,EAAA,MACpC,gBAAAC,EAAC,OAAA,EAAI,WAAW,gCAAgCF,CAAS,IAAK,UAAAC,EAAA,CAAS,GAGrEE,IAAiB,CAAC,EAAE,WAAAH,IAAY,IAAI,UAAAC,EAAA,MACtC,gBAAAC,EAAC,OAAA,EAAI,WAAW,gCAAgCF,CAAS,IAAK,UAAAC,EAAA,CAAS,GAGrEG,IAA0B,CAACC,MAC7BC,EAAeD,CAAO,MAAMA,EAAQ,SAASN,KAAgBM,EAAQ,SAASF,IAO5EI,IAAUC,EAA4D,CAACC,GAAOC,MAAQ;AACxF,QAAM;AAAA,IACF,WAAAC,IAAY;AAAA,IACZ,YAAAC;AAAA,IACA,OAAAC;AAAA,IACA,gBAAAC,IAAiB;AAAA,IACjB,kBAAAC,IAAmB;AAAA,IACnB,UAAAd;AAAA,IACA,WAAAD,IAAY;AAAA,IACZ,GAAGgB;AAAA,EAAA,IACHP,GAEEQ,IAAW,CAAC,CAACJ,GACbK,IAAmBC,EAAM,SAAS,QAAQlB,CAAQ,EAAE,KAAKG,CAAuB,GAIhF,CAACgB,GAAWC,CAAY,IAAIC,EAAS,EAAK;AAChD,SAAAC,EAAU,MAAMF,EAAa,EAAI,GAAG,CAAA,CAAE,GAGlC,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAGR;AAAA,MACJ,MAAK;AAAA,MAGL,eAAaL;AAAA,MACb,KAAAD;AAAA,MACA,WAAW,gBAAgBU,IAAY,SAAS,EAAE,IAAIpB,CAAS;AAAA,MAE/D,UAAA;AAAA,QAAA,gBAAAE,EAAC,OAAA,EAAI,WAAU,SAAS,GAAGU,EAAA,CAAY;AAAA,QACtCK,KAAY,gBAAAf,EAACH,GAAA,EAAa,WAAWe,GAAiB,UAAAD,GAAM;AAAA,QAC5DK,IAAmBjB,IAAW,gBAAAC,EAACC,GAAA,EAAe,WAAWY,GAAmB,UAAAd,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlG,CAAC;AAEDM,EAAQ,QAAQR;AAChBQ,EAAQ,UAAUJ;AAElB,OAAO,OAAOI,GAASV,CAAa;"}
+{"version":3,"file":"Popover.js","names":[],"sources":["../../../src/components/popover/Popover.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    type ForwardRefExoticComponent,\n    type RefAttributes,\n    type PropsWithChildren,\n    type ReactNode,\n    type ComponentProps,\n    isValidElement,\n    useState,\n    useEffect,\n} from 'react';\n\nimport { PLACEMENT } from '../../values/Placement';\n\nexport const PLACEMENT_MAP = {\n    TOP: PLACEMENT.TOP,\n    RIGHT: PLACEMENT.RIGHT,\n    BOTTOM: PLACEMENT.BOTTOM,\n    LEFT: PLACEMENT.LEFT,\n} as const;\n\nexport type PopoverPlacement = (typeof PLACEMENT_MAP)[keyof typeof PLACEMENT_MAP];\n\nexport type PopoverProps = Omit<ComponentProps<'div'>, 'title'> & {\n    /**\n     * HTML ID attribute, necessary for accessibility.\n     */\n    id: string;\n\n    /**\n     * Sets the direction the Popover is positioned towards.\n     *\n     * Possible values are:\n     *\n     * - `top`\n     * - `right`\n     * - `bottom`\n     * - `left`\n     */\n    placement?: PopoverPlacement;\n\n    /**\n     * Additional props assigned to the arrow element. Internally used.\n     */\n    arrowProps?: Record<string, unknown>;\n\n    /**\n     * Defines whether the Popover renders an arrow.\n     *\n     * Set this to `false` as an escape hatch when the arrow does not fit the surrounding layout.\n     * When disabled, the Popover also sets `--overlay-arrow-size` to `0px` so OverlayTrigger no longer reserves arrow\n     * spacing.\n     *\n     * @default true\n     */\n    showArrow?: boolean;\n\n    /**\n     * Any element to be rendered as the title of the Popover.\n     *\n     * It creates a `Popover.Title` inside the `Popover` passing the title directly into it.\n     */\n    title?: string | ReactNode;\n\n    /**\n     * Additional classes to be set on the `Popover.Title` element.\n     */\n    titleClassName?: string;\n\n    /**\n     * Additional classes to be set on the `Popover.Content` element.\n     */\n    contentClassName?: string;\n\n    /**\n     * Additional class names for the wrapper element.\n     */\n    className?: string;\n};\n\nconst PopoverTitle = ({ className = '', children }: PropsWithChildren<{ className?: string }>) => (\n    <div className={`popover-header popover-title ${className}`}>{children}</div>\n);\n\nconst PopoverContent = ({ className = '', children }: PropsWithChildren<{ className?: string }>) => (\n    <div className={`popover-content popover-body ${className}`}>{children}</div>\n);\n\nconst isPopoverTitleOrContent = (element: ReactNode): boolean =>\n    isValidElement(element) && (element.type === PopoverTitle || element.type === PopoverContent);\n\ntype PopoverType = ForwardRefExoticComponent<PropsWithChildren<PopoverProps> & RefAttributes<HTMLDivElement>> & {\n    Title: typeof PopoverTitle;\n    Content: typeof PopoverContent;\n};\n\nconst Popover = forwardRef<HTMLDivElement, PropsWithChildren<PopoverProps>>((props, ref) => {\n    const {\n        placement = 'bottom',\n        arrowProps,\n        showArrow = true,\n        title,\n        titleClassName = '',\n        contentClassName = '',\n        children,\n        className = '',\n        style,\n        ...remainingProps\n    } = props;\n\n    const hasTitle = !!title;\n    const hasCustomContent = React.Children.toArray(children).some(isPopoverTitleOrContent);\n\n    // Mount the component but don't show it yet via CSS.\n    // After it is mounted, we set the visibility class to use CSS animation\n    const [isMounted, setIsMounted] = useState(false);\n    useEffect(() => setIsMounted(true), []);\n\n    const nativePopoverProps = { popover: 'manual' } as React.HTMLAttributes<HTMLDivElement>;\n    const popoverStyle = {\n        ...style,\n        ...(showArrow ? {} : { '--overlay-arrow-size': '0px' }),\n    } as React.CSSProperties;\n\n    return (\n        <div\n            data-overlay-arrow-placement={placement}\n            {...remainingProps}\n            {...nativePopoverProps}\n            role='tooltip'\n            ref={ref}\n            className={`popover fade ${isMounted ? 'show' : ''} ${className}`}\n            style={popoverStyle}\n        >\n            {showArrow && <div className='arrow' {...arrowProps} />}\n            {hasTitle && <PopoverTitle className={titleClassName}>{title}</PopoverTitle>}\n            {hasCustomContent ? children : <PopoverContent className={contentClassName}>{children}</PopoverContent>}\n        </div>\n    );\n}) as PopoverType;\n\nPopover.Title = PopoverTitle;\nPopover.Content = PopoverContent;\n\nObject.assign(Popover, PLACEMENT_MAP);\n\nexport default Popover;\n"],"mappings":";;;;AAcA,IAAa,IAAgB;CACzB,KAAK,EAAU;CACf,OAAO,EAAU;CACjB,QAAQ,EAAU;CAClB,MAAM,EAAU;AACpB,GA6DM,KAAgB,EAAE,eAAY,IAAI,kBACpC,kBAAC,OAAD;CAAK,WAAW,gCAAgC;CAAc;AAAc,CAAA,GAG1E,KAAkB,EAAE,eAAY,IAAI,kBACtC,kBAAC,OAAD;CAAK,WAAW,gCAAgC;CAAc;AAAc,CAAA,GAG1E,KAA2B,MAC7B,EAAe,CAAO,MAAM,EAAQ,SAAS,KAAgB,EAAQ,SAAS,IAO5E,IAAU,GAA6D,GAAO,MAAQ;CACxF,IAAM,EACF,eAAY,UACZ,eACA,eAAY,IACZ,UACA,oBAAiB,IACjB,sBAAmB,IACnB,aACA,eAAY,IACZ,UACA,GAAG,MACH,GAEE,IAAW,CAAC,CAAC,GACb,IAAmB,EAAM,SAAS,QAAQ,CAAQ,CAAC,CAAC,KAAK,CAAuB,GAIhF,CAAC,GAAW,KAAgB,EAAS,EAAK;CAChD,QAAgB,EAAa,EAAI,GAAG,CAAC,CAAC;CAEtC,IAAM,IAAqB,EAAE,SAAS,SAAS,GACzC,IAAe;EACjB,GAAG;EACH,GAAI,IAAY,CAAC,IAAI,EAAE,wBAAwB,MAAM;CACzD;CAEA,OACI,kBAAC,OAAD;EACI,gCAA8B;EAC9B,GAAI;EACJ,GAAI;EACJ,MAAK;EACA;EACL,WAAW,gBAAgB,IAAY,SAAS,GAAG,GAAG;EACtD,OAAO;YAPX;GASK,KAAa,kBAAC,OAAD;IAAK,WAAU;IAAQ,GAAI;GAAa,CAAA;GACrD,KAAY,kBAAC,GAAD;IAAc,WAAW;cAAiB;GAAoB,CAAA;GAC1E,IAAmB,IAAW,kBAAC,GAAD;IAAgB,WAAW;IAAmB;GAAyB,CAAA;EACrG;;AAEb,CAAC;AAED,EAAQ,QAAQ,GAChB,EAAQ,UAAU,GAElB,OAAO,OAAO,GAAS,CAAa"}

package/components/position/Position.js

@@ -1,12 +1,16 @@
-import { jsx as c } from "react/jsx-runtime";
-const a = (o, t, s) => {
-  const e = o >= 0 ? t : s, n = Math.abs(o), r = Math.floor(n), i = (n - r) * 60;
-  return `${e}${r}° ${i.toFixed(3)}′`;
-}, d = (o) => {
-  const { latitude: t, longitude: s, address: e } = o;
-  return /* @__PURE__ */ c("span", { className: "vehiclePositionInfo", children: e || `${a(t, "N", "S")} ${a(s, "E", "W")}` });
+import { jsx as e } from "react/jsx-runtime";
+//#region src/components/position/Position.tsx
+var t = (e, t, n) => {
+	let r = e >= 0 ? t : n, i = Math.abs(e), a = Math.floor(i);
+	return `${r}${a}\u00b0 ${((i - a) * 60).toFixed(3)}\u2032`;
+}, n = (n) => {
+	let { latitude: r, longitude: i, address: a } = n;
+	return /* @__PURE__ */ e("span", {
+		className: "vehiclePositionInfo",
+		children: a || `${t(r, "N", "S")} ${t(i, "E", "W")}`
+	});
 };
-export {
-  d as default
-};
-//# sourceMappingURL=Position.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=Position.js.map

package/components/position/Position.js.map

@@ -1 +1 @@
-{"version":3,"file":"Position.js","sources":["../../../src/components/position/Position.tsx"],"sourcesContent":["const format = (degrees: number, positivePrefix: string, negativePrefix: string) => {\n    const prefix = degrees >= 0 ? positivePrefix : negativePrefix;\n    const absDegrees = Math.abs(degrees);\n    const flooredDegrees = Math.floor(absDegrees);\n    const minutes = (absDegrees - flooredDegrees) * 60;\n    return `${prefix}${flooredDegrees}\\u00b0 ${minutes.toFixed(3)}\\u2032`;\n};\n\nexport type PositionProps = {\n    /**\n     * The latitude to display.\n     */\n    latitude: number;\n\n    /**\n     * The longitude to display.\n     */\n    longitude: number;\n\n    /**\n     * Can be used to override the default output.\n     */\n    address?: string;\n};\n\nconst Position = (props: PositionProps) => {\n    const { latitude, longitude, address } = props;\n\n    return (\n        <span className='vehiclePositionInfo'>\n            {address || `${format(latitude, 'N', 'S')} ${format(longitude, 'E', 'W')}`}\n        </span>\n    );\n};\n\nexport default Position;\n"],"names":["format","degrees","positivePrefix","negativePrefix","prefix","absDegrees","flooredDegrees","minutes","Position","props","latitude","longitude","address"],"mappings":";AAAA,MAAMA,IAAS,CAACC,GAAiBC,GAAwBC,MAA2B;AAChF,QAAMC,IAASH,KAAW,IAAIC,IAAiBC,GACzCE,IAAa,KAAK,IAAIJ,CAAO,GAC7BK,IAAiB,KAAK,MAAMD,CAAU,GACtCE,KAAWF,IAAaC,KAAkB;AAChD,SAAO,GAAGF,CAAM,GAAGE,CAAc,KAAUC,EAAQ,QAAQ,CAAC,CAAC;AACjE,GAmBMC,IAAW,CAACC,MAAyB;AACvC,QAAM,EAAE,UAAAC,GAAU,WAAAC,GAAW,SAAAC,EAAA,IAAYH;AAEzC,2BACK,QAAA,EAAK,WAAU,uBACX,UAAAG,KAAW,GAAGZ,EAAOU,GAAU,KAAK,GAAG,CAAC,IAAIV,EAAOW,GAAW,KAAK,GAAG,CAAC,IAC5E;AAER;"}
+{"version":3,"file":"Position.js","names":[],"sources":["../../../src/components/position/Position.tsx"],"sourcesContent":["const format = (degrees: number, positivePrefix: string, negativePrefix: string) => {\n    const prefix = degrees >= 0 ? positivePrefix : negativePrefix;\n    const absDegrees = Math.abs(degrees);\n    const flooredDegrees = Math.floor(absDegrees);\n    const minutes = (absDegrees - flooredDegrees) * 60;\n    return `${prefix}${flooredDegrees}\\u00b0 ${minutes.toFixed(3)}\\u2032`;\n};\n\nexport type PositionProps = {\n    /**\n     * The latitude to display.\n     */\n    latitude: number;\n\n    /**\n     * The longitude to display.\n     */\n    longitude: number;\n\n    /**\n     * Can be used to override the default output.\n     */\n    address?: string;\n};\n\nconst Position = (props: PositionProps) => {\n    const { latitude, longitude, address } = props;\n\n    return (\n        <span className='vehiclePositionInfo'>\n            {address || `${format(latitude, 'N', 'S')} ${format(longitude, 'E', 'W')}`}\n        </span>\n    );\n};\n\nexport default Position;\n"],"mappings":";;AAAA,IAAM,KAAU,GAAiB,GAAwB,MAA2B;CAChF,IAAM,IAAS,KAAW,IAAI,IAAiB,GACzC,IAAa,KAAK,IAAI,CAAO,GAC7B,IAAiB,KAAK,MAAM,CAAU;CAE5C,OAAO,GAAG,IAAS,EAAe,WADjB,IAAa,KAAkB,GAAA,CACG,QAAQ,CAAC,EAAE;AAClE,GAmBM,KAAY,MAAyB;CACvC,IAAM,EAAE,aAAU,cAAW,eAAY;CAEzC,OACI,kBAAC,QAAD;EAAM,WAAU;YACX,KAAW,GAAG,EAAO,GAAU,KAAK,GAAG,EAAE,GAAG,EAAO,GAAW,KAAK,GAAG;CACrE,CAAA;AAEd"}

package/components/preloader/ImagePreloader.js

@@ -1,31 +1,34 @@
-import { useState as f, useRef as D, useCallback as E, useMemo as S, useEffect as T } from "react";
-import { noop as A } from "es-toolkit/compat";
-const F = (s, t) => (r, o) => {
-  const e = new Image();
-  return o && (e.crossOrigin = "anonymous"), e.onload = s, e.onerror = t, e.src = r, e;
-}, l = (s) => {
-  const { src: t, isAnonymous: r = !1, onLoaded: o = A, onFailed: e = A, children: m } = s, [L, c] = f("PENDING"), [I, N] = f(null), u = D(null), a = D(!1), i = E(() => {
-    const n = u.current;
-    a.current || !n || (c("LOADED"), o(n));
-  }, [o]), d = E(() => {
-    const n = u.current;
-    a.current || !n || (c("FAILED"), e(n));
-  }, [e]), g = S(
-    () => F(i, d),
-    [i, d]
-  );
-  return T(() => {
-    a.current = !1, c("PENDING");
-    const n = g(t, r);
-    return u.current = n, N(n), () => {
-      a.current = !0;
-    };
-  }, [t, r, g]), m && I ? m({ status: L, image: I }) : null;
+import { useCallback as e, useEffect as t, useMemo as n, useRef as r, useState as i } from "react";
+import { noop as a } from "es-toolkit/compat";
+//#region src/components/preloader/ImagePreloader.tsx
+var o = (e, t) => (n, r) => {
+	let i = new Image();
+	return r && (i.crossOrigin = "anonymous"), i.onload = e, i.onerror = t, i.src = n, i;
+}, s = (s) => {
+	let { src: c, isAnonymous: l = !1, onLoaded: u = a, onFailed: d = a, children: f } = s, [p, m] = i("PENDING"), [h, g] = i(null), _ = r(null), v = r(!1), y = e(() => {
+		let e = _.current;
+		v.current || !e || (m("LOADED"), u(e));
+	}, [u]), b = e(() => {
+		let e = _.current;
+		v.current || !e || (m("FAILED"), d(e));
+	}, [d]), x = n(() => o(y, b), [y, b]);
+	return t(() => {
+		v.current = !1, m("PENDING");
+		let e = x(c, l);
+		return _.current = e, g(e), () => {
+			v.current = !0;
+		};
+	}, [
+		c,
+		l,
+		x
+	]), f && h ? f({
+		status: p,
+		image: h
+	}) : null;
 };
-l.STATUS_PENDING = "PENDING";
-l.STATUS_LOADED = "LOADED";
-l.STATUS_FAILED = "FAILED";
-export {
-  l as default
-};
-//# sourceMappingURL=ImagePreloader.js.map
+s.STATUS_PENDING = "PENDING", s.STATUS_LOADED = "LOADED", s.STATUS_FAILED = "FAILED";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=ImagePreloader.js.map

package/components/preloader/ImagePreloader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImagePreloader.js","sources":["../../../src/components/preloader/ImagePreloader.tsx"],"sourcesContent":["import { type JSX, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { noop } from 'es-toolkit/compat';\n\nconst loadImage =\n    (onLoad: (event: Event) => void, onError: (event: Event | string) => void) =>\n    (src: string, isAnonymous: boolean) => {\n        const image = new Image();\n\n        if (isAnonymous) {\n            image.crossOrigin = 'anonymous';\n        }\n\n        // attach listeners\n        image.onload = onLoad;\n        image.onerror = onError;\n\n        // preload the actual image\n        image.src = src;\n\n        return image;\n    };\n\ntype ImagePreloaderStatus = 'PENDING' | 'FAILED' | 'LOADED';\n\nexport type ImagePreloaderChild = (props: {\n    status: ImagePreloaderStatus;\n    image: HTMLImageElement;\n}) => JSX.Element | null;\n\nexport type ImagePreloaderProps = {\n    /**\n     * The URL of the image to load.\n     */\n    src: string;\n\n    /**\n     * Invoked when the image is loaded.\n     *\n     * @param image The native Image object.\n     */\n    onLoaded?: (image: HTMLImageElement) => void;\n\n    /**\n     * Invoked when the image failed to load.\n     *\n     * @param image The native Image object.\n     */\n    onFailed?: (image: HTMLImageElement) => void;\n\n    /**\n     * Whether to set the \"crossOrigin\" to \"anonymous\".\n     *\n     * @default false\n     */\n    isAnonymous?: boolean;\n\n    /**\n     * A render function can be used to access both the current state and the image element.\n     *\n     * Using this, you can decide how to render the different states and/or the loaded image.\n     *\n     * The function will receive props containing the `status` and `image` properties.\n     *\n     * `status` will be one of `PENDING`, `FAILED` or `LOADED`. `image` is the Image element.\n     */\n    children?: ImagePreloaderChild;\n};\n\nconst ImagePreloader = (props: ImagePreloaderProps) => {\n    const { src, isAnonymous = false, onLoaded = noop, onFailed = noop, children } = props;\n\n    const [status, setStatus] = useState<ImagePreloaderStatus>('PENDING');\n    const [image, setImage] = useState<HTMLImageElement | null>(null);\n    const imageRef = useRef<HTMLImageElement | null>(null);\n\n    const willUnmount = useRef(false);\n\n    const handleImageLoaded = useCallback(() => {\n        const currentImage = imageRef.current;\n\n        if (willUnmount.current || !currentImage) {\n            return;\n        }\n        setStatus('LOADED');\n        onLoaded(currentImage);\n    }, [onLoaded]);\n\n    const handleImageFailed = useCallback(() => {\n        const currentImage = imageRef.current;\n\n        if (willUnmount.current || !currentImage) {\n            return;\n        }\n        setStatus('FAILED');\n        onFailed(currentImage);\n    }, [onFailed]);\n\n    const loadImageWithCallbacks = useMemo(\n        () => loadImage(handleImageLoaded, handleImageFailed),\n        [handleImageLoaded, handleImageFailed]\n    );\n\n    useEffect(() => {\n        willUnmount.current = false;\n        setStatus('PENDING');\n\n        const nextImage = loadImageWithCallbacks(src, isAnonymous);\n        imageRef.current = nextImage;\n        setImage(nextImage);\n\n        return () => {\n            willUnmount.current = true;\n        };\n    }, [src, isAnonymous, loadImageWithCallbacks]);\n\n    return children && image ? children({ status, image }) : null;\n};\n\nImagePreloader.STATUS_PENDING = 'PENDING';\nImagePreloader.STATUS_LOADED = 'LOADED';\nImagePreloader.STATUS_FAILED = 'FAILED';\n\nexport default ImagePreloader;\n"],"names":["loadImage","onLoad","onError","src","isAnonymous","image","ImagePreloader","props","onLoaded","noop","onFailed","children","status","setStatus","useState","setImage","imageRef","useRef","willUnmount","handleImageLoaded","useCallback","currentImage","handleImageFailed","loadImageWithCallbacks","useMemo","useEffect","nextImage"],"mappings":";;AAGA,MAAMA,IACF,CAACC,GAAgCC,MACjC,CAACC,GAAaC,MAAyB;AACnC,QAAMC,IAAQ,IAAI,MAAA;AAElB,SAAID,MACAC,EAAM,cAAc,cAIxBA,EAAM,SAASJ,GACfI,EAAM,UAAUH,GAGhBG,EAAM,MAAMF,GAELE;AACX,GAgDEC,IAAiB,CAACC,MAA+B;AACnD,QAAM,EAAE,KAAAJ,GAAK,aAAAC,IAAc,IAAO,UAAAI,IAAWC,GAAM,UAAAC,IAAWD,GAAM,UAAAE,EAAA,IAAaJ,GAE3E,CAACK,GAAQC,CAAS,IAAIC,EAA+B,SAAS,GAC9D,CAACT,GAAOU,CAAQ,IAAID,EAAkC,IAAI,GAC1DE,IAAWC,EAAgC,IAAI,GAE/CC,IAAcD,EAAO,EAAK,GAE1BE,IAAoBC,EAAY,MAAM;AACxC,UAAMC,IAAeL,EAAS;AAE9B,IAAIE,EAAY,WAAW,CAACG,MAG5BR,EAAU,QAAQ,GAClBL,EAASa,CAAY;AAAA,EACzB,GAAG,CAACb,CAAQ,CAAC,GAEPc,IAAoBF,EAAY,MAAM;AACxC,UAAMC,IAAeL,EAAS;AAE9B,IAAIE,EAAY,WAAW,CAACG,MAG5BR,EAAU,QAAQ,GAClBH,EAASW,CAAY;AAAA,EACzB,GAAG,CAACX,CAAQ,CAAC,GAEPa,IAAyBC;AAAA,IAC3B,MAAMxB,EAAUmB,GAAmBG,CAAiB;AAAA,IACpD,CAACH,GAAmBG,CAAiB;AAAA,EAAA;AAGzC,SAAAG,EAAU,MAAM;AACZ,IAAAP,EAAY,UAAU,IACtBL,EAAU,SAAS;AAEnB,UAAMa,IAAYH,EAAuBpB,GAAKC,CAAW;AACzD,WAAAY,EAAS,UAAUU,GACnBX,EAASW,CAAS,GAEX,MAAM;AACT,MAAAR,EAAY,UAAU;AAAA,IAC1B;AAAA,EACJ,GAAG,CAACf,GAAKC,GAAamB,CAAsB,CAAC,GAEtCZ,KAAYN,IAAQM,EAAS,EAAE,QAAAC,GAAQ,OAAAP,EAAA,CAAO,IAAI;AAC7D;AAEAC,EAAe,iBAAiB;AAChCA,EAAe,gBAAgB;AAC/BA,EAAe,gBAAgB;"}
+{"version":3,"file":"ImagePreloader.js","names":[],"sources":["../../../src/components/preloader/ImagePreloader.tsx"],"sourcesContent":["import { type JSX, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { noop } from 'es-toolkit/compat';\n\nconst loadImage =\n    (onLoad: (event: Event) => void, onError: (event: Event | string) => void) =>\n    (src: string, isAnonymous: boolean) => {\n        const image = new Image();\n\n        if (isAnonymous) {\n            image.crossOrigin = 'anonymous';\n        }\n\n        // attach listeners\n        image.onload = onLoad;\n        image.onerror = onError;\n\n        // preload the actual image\n        image.src = src;\n\n        return image;\n    };\n\ntype ImagePreloaderStatus = 'PENDING' | 'FAILED' | 'LOADED';\n\nexport type ImagePreloaderChild = (props: {\n    status: ImagePreloaderStatus;\n    image: HTMLImageElement;\n}) => JSX.Element | null;\n\nexport type ImagePreloaderProps = {\n    /**\n     * The URL of the image to load.\n     */\n    src: string;\n\n    /**\n     * Invoked when the image is loaded.\n     *\n     * @param image The native Image object.\n     */\n    onLoaded?: (image: HTMLImageElement) => void;\n\n    /**\n     * Invoked when the image failed to load.\n     *\n     * @param image The native Image object.\n     */\n    onFailed?: (image: HTMLImageElement) => void;\n\n    /**\n     * Whether to set the \"crossOrigin\" to \"anonymous\".\n     *\n     * @default false\n     */\n    isAnonymous?: boolean;\n\n    /**\n     * A render function can be used to access both the current state and the image element.\n     *\n     * Using this, you can decide how to render the different states and/or the loaded image.\n     *\n     * The function will receive props containing the `status` and `image` properties.\n     *\n     * `status` will be one of `PENDING`, `FAILED` or `LOADED`. `image` is the Image element.\n     */\n    children?: ImagePreloaderChild;\n};\n\nconst ImagePreloader = (props: ImagePreloaderProps) => {\n    const { src, isAnonymous = false, onLoaded = noop, onFailed = noop, children } = props;\n\n    const [status, setStatus] = useState<ImagePreloaderStatus>('PENDING');\n    const [image, setImage] = useState<HTMLImageElement | null>(null);\n    const imageRef = useRef<HTMLImageElement | null>(null);\n\n    const willUnmount = useRef(false);\n\n    const handleImageLoaded = useCallback(() => {\n        const currentImage = imageRef.current;\n\n        if (willUnmount.current || !currentImage) {\n            return;\n        }\n        setStatus('LOADED');\n        onLoaded(currentImage);\n    }, [onLoaded]);\n\n    const handleImageFailed = useCallback(() => {\n        const currentImage = imageRef.current;\n\n        if (willUnmount.current || !currentImage) {\n            return;\n        }\n        setStatus('FAILED');\n        onFailed(currentImage);\n    }, [onFailed]);\n\n    const loadImageWithCallbacks = useMemo(\n        () => loadImage(handleImageLoaded, handleImageFailed),\n        [handleImageLoaded, handleImageFailed]\n    );\n\n    useEffect(() => {\n        willUnmount.current = false;\n        setStatus('PENDING');\n\n        const nextImage = loadImageWithCallbacks(src, isAnonymous);\n        imageRef.current = nextImage;\n        setImage(nextImage);\n\n        return () => {\n            willUnmount.current = true;\n        };\n    }, [src, isAnonymous, loadImageWithCallbacks]);\n\n    return children && image ? children({ status, image }) : null;\n};\n\nImagePreloader.STATUS_PENDING = 'PENDING';\nImagePreloader.STATUS_LOADED = 'LOADED';\nImagePreloader.STATUS_FAILED = 'FAILED';\n\nexport default ImagePreloader;\n"],"mappings":";;;AAGA,IAAM,KACD,GAAgC,OAChC,GAAa,MAAyB;CACnC,IAAM,IAAQ,IAAI,MAAM;CAaxB,OAXI,MACA,EAAM,cAAc,cAIxB,EAAM,SAAS,GACf,EAAM,UAAU,GAGhB,EAAM,MAAM,GAEL;AACX,GAgDE,KAAkB,MAA+B;CACnD,IAAM,EAAE,QAAK,iBAAc,IAAO,cAAW,GAAM,cAAW,GAAM,gBAAa,GAE3E,CAAC,GAAQ,KAAa,EAA+B,SAAS,GAC9D,CAAC,GAAO,KAAY,EAAkC,IAAI,GAC1D,IAAW,EAAgC,IAAI,GAE/C,IAAc,EAAO,EAAK,GAE1B,IAAoB,QAAkB;EACxC,IAAM,IAAe,EAAS;EAE1B,EAAY,WAAW,CAAC,MAG5B,EAAU,QAAQ,GAClB,EAAS,CAAY;CACzB,GAAG,CAAC,CAAQ,CAAC,GAEP,IAAoB,QAAkB;EACxC,IAAM,IAAe,EAAS;EAE1B,EAAY,WAAW,CAAC,MAG5B,EAAU,QAAQ,GAClB,EAAS,CAAY;CACzB,GAAG,CAAC,CAAQ,CAAC,GAEP,IAAyB,QACrB,EAAU,GAAmB,CAAiB,GACpD,CAAC,GAAmB,CAAiB,CACzC;CAeA,OAbA,QAAgB;EAEZ,AADA,EAAY,UAAU,IACtB,EAAU,SAAS;EAEnB,IAAM,IAAY,EAAuB,GAAK,CAAW;EAIzD,OAHA,EAAS,UAAU,GACnB,EAAS,CAAS,SAEL;GACT,EAAY,UAAU;EAC1B;CACJ,GAAG;EAAC;EAAK;EAAa;CAAsB,CAAC,GAEtC,KAAY,IAAQ,EAAS;EAAE;EAAQ;CAAM,CAAC,IAAI;AAC7D;AAEA,EAAe,iBAAiB,WAChC,EAAe,gBAAgB,UAC/B,EAAe,gBAAgB"}

package/components/radiobutton/RadioButton.d.ts

@@ -1,9 +1,16 @@
 import { ChangeEventHandler, MouseEventHandler, PropsWithChildren, ReactNode, Ref, HTMLProps } from 'react';
+import { IconType } from '../icon/Icon';
 export type RadioButtonProps = Omit<HTMLProps<HTMLLabelElement>, 'label' | 'onClick' | 'onChange'> & {
     /**
-     * Define any rioglyph icon like "rioglyph-truck".
+     * Define any uikit-icon icon like "icon-truck".
      */
-    icon?: string;
+    iconName?: IconType;
+    /**
+     * Legacy alias for `iconName`.
+     *
+     * @deprecated Use `iconName` instead.
+     */
+    icon?: IconType;
     /**
      * The label position.
      *