@rio-cloud/rio-uikit 2.1.0 → 2.2.1

package/components/menuItems/MenuItem.js

@@ -1,7 +1,7 @@
 import { jsx as n } from "react/jsx-runtime";
 import M from "react";
-import b from "classnames";
 import { noop as r } from "es-toolkit/function";
+import b from "../../utils/classNames.js";
 import x from "../dropdown/DropdownSubmenu.js";
 import E from "../selects/DropdownHeader.js";
 const k = (l) => {

package/components/menuItems/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.js","sources":["../../../src/components/menuItems/MenuItem.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/function';\n\nimport DropdownSubmenu from '../dropdown/DropdownSubmenu';\nimport DropdownHeader from '../selects/DropdownHeader';\n\nexport type MenuItemProps = {\n    /**\n     * __Internal prop__ - The item index.\n     */\n    index?: number;\n\n    /**\n     * The menu item element which will be shown in the dropdown menu.\n     */\n    value?: string | React.ReactNode;\n\n    /**\n     * Sets the item as active/selected.\n     */\n    active?: boolean;\n\n    /**\n     * Setting \"disabled\" to true will disable the respective item.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Will add a divider line between the items inside the dropdown.\n     *\n     * @default false\n     */\n    divider?: boolean;\n\n    /**\n     * Will treat the given value as a menu header.\n     *\n     * @default false\n     */\n    header?: boolean;\n\n    /**\n     * Callback function triggered when an item is selected.\n     *\n     * @param value\n     * @param event\n     * @returns\n     */\n    onSelect?: (value: number | undefined, event: React.MouseEvent<HTMLLIElement>) => void;\n\n    /**\n     * __Internal prop__ - Callback function triggered when the item is selected.\n     */\n    closeMenu?: VoidFunction;\n\n    /**\n     * __Internal prop__ - Callback function triggered when the item is hovered and not disabled.\n     * @param event\n     * @returns\n     */\n    onMouseEnter?: (event: React.MouseEvent<HTMLLIElement>) => void;\n};\n\nconst MenuItem = (props: MenuItemProps) => {\n    const {\n        index,\n        value,\n        divider = false,\n        disabled = false,\n        active = false,\n        header = false,\n        onSelect = noop,\n        closeMenu = noop,\n        onMouseEnter = noop,\n    } = props;\n\n    if (React.isValidElement(value) && value.type === DropdownSubmenu) {\n        return value;\n    }\n\n    const role = divider ? 'separator' : 'presentation';\n\n    const classes = classNames(divider && 'divider pointer-events-none', disabled && 'disabled', active && 'active');\n\n    const handleSelectItem = (event: React.MouseEvent<HTMLLIElement>) => {\n        if (!disabled) {\n            onSelect(index, event);\n\n            if (closeMenu) {\n                closeMenu();\n            }\n        }\n    };\n\n    const handleItemMouseEnter = (event: React.MouseEvent<HTMLLIElement>) => {\n        if (!disabled) {\n            onMouseEnter(event);\n        }\n    };\n\n    if (header) {\n        return <DropdownHeader label={value} center={false} />;\n    }\n\n    return (\n        <li\n            role={role}\n            className={classes}\n            onClick={handleSelectItem}\n            onMouseEnter={handleItemMouseEnter}\n            data-item-index={index}\n        >\n            <a role='menuitem'>{value}</a>\n        </li>\n    );\n};\n\nexport default MenuItem;\n"],"names":["MenuItem","props","index","value","divider","disabled","active","header","onSelect","noop","closeMenu","onMouseEnter","React","DropdownSubmenu","role","classes","classNames","handleSelectItem","event","handleItemMouseEnter","jsx","DropdownHeader"],"mappings":";;;;;;AAkEA,MAAMA,IAAW,CAACC,MAAyB;AACvC,QAAM;AAAA,IACF,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,UAAAC,IAAW;AAAA,IACX,QAAAC,IAAS;AAAA,IACT,QAAAC,IAAS;AAAA,IACT,UAAAC,IAAWC;AAAA,IACX,WAAAC,IAAYD;AAAA,IACZ,cAAAE,IAAeF;AAAA,EAAA,IACfR;AAEJ,MAAIW,EAAM,eAAeT,CAAK,KAAKA,EAAM,SAASU;AAC9C,WAAOV;AAGX,QAAMW,IAAOV,IAAU,cAAc,gBAE/BW,IAAUC,EAAWZ,KAAW,+BAA+BC,KAAY,YAAYC,KAAU,QAAQ,GAEzGW,IAAmB,CAACC,MAA2C;AACjE,IAAKb,MACDG,EAASN,GAAOgB,CAAK,GAEjBR,KACAA,EAAA;AAAA,EAGZ,GAEMS,IAAuB,CAACD,MAA2C;AACrE,IAAKb,KACDM,EAAaO,CAAK;AAAA,EAE1B;AAEA,SAAIX,IACO,gBAAAa,EAACC,GAAA,EAAe,OAAOlB,GAAO,QAAQ,IAAO,IAIpD,gBAAAiB;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,MAAAN;AAAA,MACA,WAAWC;AAAA,MACX,SAASE;AAAA,MACT,cAAcE;AAAA,MACd,mBAAiBjB;AAAA,MAEjB,UAAA,gBAAAkB,EAAC,KAAA,EAAE,MAAK,YAAY,UAAAjB,EAAA,CAAM;AAAA,IAAA;AAAA,EAAA;AAGtC;"}
+{"version":3,"file":"MenuItem.js","sources":["../../../src/components/menuItems/MenuItem.tsx"],"sourcesContent":["import React from 'react';\nimport { noop } from 'es-toolkit/function';\n\nimport classNames from '../../utils/classNames';\nimport DropdownSubmenu from '../dropdown/DropdownSubmenu';\nimport DropdownHeader from '../selects/DropdownHeader';\n\nexport type MenuItemProps = {\n    /**\n     * __Internal prop__ - The item index.\n     */\n    index?: number;\n\n    /**\n     * The menu item element which will be shown in the dropdown menu.\n     */\n    value?: string | React.ReactNode;\n\n    /**\n     * Sets the item as active/selected.\n     */\n    active?: boolean;\n\n    /**\n     * Setting \"disabled\" to true will disable the respective item.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Will add a divider line between the items inside the dropdown.\n     *\n     * @default false\n     */\n    divider?: boolean;\n\n    /**\n     * Will treat the given value as a menu header.\n     *\n     * @default false\n     */\n    header?: boolean;\n\n    /**\n     * Callback function triggered when an item is selected.\n     *\n     * @param value\n     * @param event\n     * @returns\n     */\n    onSelect?: (value: number | undefined, event: React.MouseEvent<HTMLLIElement>) => void;\n\n    /**\n     * __Internal prop__ - Callback function triggered when the item is selected.\n     */\n    closeMenu?: VoidFunction;\n\n    /**\n     * __Internal prop__ - Callback function triggered when the item is hovered and not disabled.\n     * @param event\n     * @returns\n     */\n    onMouseEnter?: (event: React.MouseEvent<HTMLLIElement>) => void;\n};\n\nconst MenuItem = (props: MenuItemProps) => {\n    const {\n        index,\n        value,\n        divider = false,\n        disabled = false,\n        active = false,\n        header = false,\n        onSelect = noop,\n        closeMenu = noop,\n        onMouseEnter = noop,\n    } = props;\n\n    if (React.isValidElement(value) && value.type === DropdownSubmenu) {\n        return value;\n    }\n\n    const role = divider ? 'separator' : 'presentation';\n\n    const classes = classNames(divider && 'divider pointer-events-none', disabled && 'disabled', active && 'active');\n\n    const handleSelectItem = (event: React.MouseEvent<HTMLLIElement>) => {\n        if (!disabled) {\n            onSelect(index, event);\n\n            if (closeMenu) {\n                closeMenu();\n            }\n        }\n    };\n\n    const handleItemMouseEnter = (event: React.MouseEvent<HTMLLIElement>) => {\n        if (!disabled) {\n            onMouseEnter(event);\n        }\n    };\n\n    if (header) {\n        return <DropdownHeader label={value} center={false} />;\n    }\n\n    return (\n        <li\n            role={role}\n            className={classes}\n            onClick={handleSelectItem}\n            onMouseEnter={handleItemMouseEnter}\n            data-item-index={index}\n        >\n            <a role='menuitem'>{value}</a>\n        </li>\n    );\n};\n\nexport default MenuItem;\n"],"names":["MenuItem","props","index","value","divider","disabled","active","header","onSelect","noop","closeMenu","onMouseEnter","React","DropdownSubmenu","role","classes","classNames","handleSelectItem","event","handleItemMouseEnter","jsx","DropdownHeader"],"mappings":";;;;;;AAkEA,MAAMA,IAAW,CAACC,MAAyB;AACvC,QAAM;AAAA,IACF,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,UAAAC,IAAW;AAAA,IACX,QAAAC,IAAS;AAAA,IACT,QAAAC,IAAS;AAAA,IACT,UAAAC,IAAWC;AAAA,IACX,WAAAC,IAAYD;AAAA,IACZ,cAAAE,IAAeF;AAAA,EAAA,IACfR;AAEJ,MAAIW,EAAM,eAAeT,CAAK,KAAKA,EAAM,SAASU;AAC9C,WAAOV;AAGX,QAAMW,IAAOV,IAAU,cAAc,gBAE/BW,IAAUC,EAAWZ,KAAW,+BAA+BC,KAAY,YAAYC,KAAU,QAAQ,GAEzGW,IAAmB,CAACC,MAA2C;AACjE,IAAKb,MACDG,EAASN,GAAOgB,CAAK,GAEjBR,KACAA,EAAA;AAAA,EAGZ,GAEMS,IAAuB,CAACD,MAA2C;AACrE,IAAKb,KACDM,EAAaO,CAAK;AAAA,EAE1B;AAEA,SAAIX,IACO,gBAAAa,EAACC,GAAA,EAAe,OAAOlB,GAAO,QAAQ,IAAO,IAIpD,gBAAAiB;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,MAAAN;AAAA,MACA,WAAWC;AAAA,MACX,SAASE;AAAA,MACT,cAAcE;AAAA,MACd,mBAAiBjB;AAAA,MAEjB,UAAA,gBAAAkB,EAAC,KAAA,EAAE,MAAK,YAAY,UAAAjB,EAAA,CAAM;AAAA,IAAA;AAAA,EAAA;AAGtC;"}

package/components/menuItems/MenuItemList.js

@@ -1,6 +1,6 @@
 import { jsx as l } from "react/jsx-runtime";
 import { forwardRef as a } from "react";
-import i from "classnames";
+import i from "../../utils/classNames.js";
 const d = a((r, o) => {
   const { pullRight: s, className: e, children: m, ...n } = r, t = i("dropdown-menu", s && "pull-right", e);
   return /* @__PURE__ */ l("ul", { ...n, className: t, ref: o, role: "menu", children: m });

package/components/menuItems/MenuItemList.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItemList.js","sources":["../../../src/components/menuItems/MenuItemList.tsx"],"sourcesContent":["import { forwardRef, type PropsWithChildren, type HTMLProps } from 'react';\nimport classNames from 'classnames';\n\ntype MenuItemListProps = {\n    pullRight?: boolean;\n    className?: string;\n} & HTMLProps<HTMLUListElement>;\n\nconst MenuItemList = forwardRef<HTMLUListElement, PropsWithChildren<MenuItemListProps>>((props, ref) => {\n    const { pullRight, className, children, ...remainingProps } = props;\n\n    const dropdownMenuClasses = classNames('dropdown-menu', pullRight && 'pull-right', className);\n\n    return (\n        <ul {...remainingProps} className={dropdownMenuClasses} ref={ref} role='menu'>\n            {children}\n        </ul>\n    );\n});\n\nexport default MenuItemList;\n"],"names":["MenuItemList","forwardRef","props","ref","pullRight","className","children","remainingProps","dropdownMenuClasses","classNames","jsx"],"mappings":";;;AAQA,MAAMA,IAAeC,EAAmE,CAACC,GAAOC,MAAQ;AACpG,QAAM,EAAE,WAAAC,GAAW,WAAAC,GAAW,UAAAC,GAAU,GAAGC,MAAmBL,GAExDM,IAAsBC,EAAW,iBAAiBL,KAAa,cAAcC,CAAS;AAE5F,SACI,gBAAAK,EAAC,QAAI,GAAGH,GAAgB,WAAWC,GAAqB,KAAAL,GAAU,MAAK,QAClE,UAAAG,EAAA,CACL;AAER,CAAC;"}
+{"version":3,"file":"MenuItemList.js","sources":["../../../src/components/menuItems/MenuItemList.tsx"],"sourcesContent":["import { forwardRef, type PropsWithChildren, type HTMLProps } from 'react';\n\nimport classNames from '../../utils/classNames';\n\ntype MenuItemListProps = {\n    pullRight?: boolean;\n    className?: string;\n} & HTMLProps<HTMLUListElement>;\n\nconst MenuItemList = forwardRef<HTMLUListElement, PropsWithChildren<MenuItemListProps>>((props, ref) => {\n    const { pullRight, className, children, ...remainingProps } = props;\n\n    const dropdownMenuClasses = classNames('dropdown-menu', pullRight && 'pull-right', className);\n\n    return (\n        <ul {...remainingProps} className={dropdownMenuClasses} ref={ref} role='menu'>\n            {children}\n        </ul>\n    );\n});\n\nexport default MenuItemList;\n"],"names":["MenuItemList","forwardRef","props","ref","pullRight","className","children","remainingProps","dropdownMenuClasses","classNames","jsx"],"mappings":";;;AASA,MAAMA,IAAeC,EAAmE,CAACC,GAAOC,MAAQ;AACpG,QAAM,EAAE,WAAAC,GAAW,WAAAC,GAAW,UAAAC,GAAU,GAAGC,MAAmBL,GAExDM,IAAsBC,EAAW,iBAAiBL,KAAa,cAAcC,CAAS;AAE5F,SACI,gBAAAK,EAAC,QAAI,GAAGH,GAAgB,WAAWC,GAAqB,KAAAL,GAAU,MAAK,QAClE,UAAAG,EAAA,CACL;AAER,CAAC;"}

package/components/navigation/AppNavigationBar.js

@@ -1,7 +1,7 @@
 import { jsx as e, jsxs as t } from "react/jsx-runtime";
 import { forwardRef as x } from "react";
-import h from "classnames";
-import { noop as N } from "es-toolkit/function";
+import { noop as h } from "es-toolkit/function";
+import N from "../../utils/classNames.js";
 import f from "../button/Button.js";
 const B = x((s, o) => {
   const {
@@ -12,9 +12,9 @@ const B = x((s, o) => {
     titleSize: r = "md",
     subtitle: a,
     border: d = !1,
-    onNavigateBack: m = N,
+    onNavigateBack: m = h,
     ...p
-  } = s, g = h(
+  } = s, g = N(
     "AppNavigationBar",
     "width-100pct height-45 user-select-none padding-x-10",
     "display-grid grid-stack align-items-center",

package/components/navigation/AppNavigationBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppNavigationBar.js","sources":["../../../src/components/navigation/AppNavigationBar.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, type MouseEvent, type ReactNode } from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/function';\n\nimport Button from '../button/Button';\n\nexport type AppNavigationBarProps = {\n    /**\n     * The title for the content that is shown.\n     */\n    title?: string | ReactNode;\n\n    /**\n     * Defines the size of the title. Possible values are 'md' and 'lg'.\n     *\n     * @default 'md'\n     */\n    titleSize?: 'md' | 'lg';\n\n    /**\n     * Adds a subtitle below the title.\n     */\n    subtitle?: string | ReactNode;\n\n    /**\n     * Right side area for additional options of buttons like filter etc. that is relevant for the shown content..\n     */\n    right?: ReactNode;\n\n    backButtonText?: string | ReactNode;\n\n    /**\n     * Add a light bottom border to the wrapper element.\n     *\n     * @default false\n     */\n    border?: boolean;\n\n    /**\n     * Callback function for when the back navigation button is clicked.\n     */\n    onNavigateBack?: (event: MouseEvent<HTMLSpanElement>) => void;\n\n    /**\n     * Additional classes for the wrapper element.\n     */\n    className?: string;\n};\n\nexport const AppNavigationBar = forwardRef((props: AppNavigationBarProps, ref: ForwardedRef<HTMLDivElement>) => {\n    const {\n        className,\n        title,\n        right = <span />,\n        backButtonText = '',\n        titleSize = 'md',\n        subtitle,\n        border = false,\n        onNavigateBack = noop,\n        ...remainingProps\n    } = props;\n\n    const navigationClasses = classNames(\n        'AppNavigationBar',\n        'width-100pct height-45 user-select-none padding-x-10',\n        'display-grid grid-stack align-items-center',\n        titleSize === 'md' && 'text-size-14',\n        titleSize === 'lg' && 'text-size-16',\n        border && 'border border-bottom-only border-color-lighter',\n        className\n    );\n\n    return (\n        <div ref={ref} {...remainingProps} className={navigationClasses}>\n            <div className='grid-stack-item display-flex align-items-center justify-content-between'>\n                <Button\n                    bsStyle='muted'\n                    className='text-color-darkest'\n                    iconOnly={!backButtonText}\n                    iconName='rioglyph-arrow-left'\n                    onClick={onNavigateBack}\n                >\n                    {backButtonText}\n                </Button>\n                <div className='btn-toolbar gap-2'>{right}</div>\n            </div>\n            <div className='grid-stack-item text-center text-medium text-color-darker margin-x-25 padding-x-5 ellipsis-1'>\n                <div className='ellipsis-1'>{title}</div>\n                {subtitle && <div className='text-size-12 line-height-12 text-normal margin-top--2'>{subtitle}</div>}\n            </div>\n        </div>\n    );\n});\n\nexport default AppNavigationBar;\n"],"names":["AppNavigationBar","forwardRef","props","ref","className","title","right","backButtonText","titleSize","subtitle","border","onNavigateBack","noop","remainingProps","navigationClasses","classNames","jsxs","jsx","Button"],"mappings":";;;;;AAiDO,MAAMA,IAAmBC,EAAW,CAACC,GAA8BC,MAAsC;AAC5G,QAAM;AAAA,IACF,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,sBAAS,QAAA,EAAK;AAAA,IACd,gBAAAC,IAAiB;AAAA,IACjB,WAAAC,IAAY;AAAA,IACZ,UAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,gBAAAC,IAAiBC;AAAA,IACjB,GAAGC;AAAA,EAAA,IACHX,GAEEY,IAAoBC;AAAA,IACtB;AAAA,IACA;AAAA,IACA;AAAA,IACAP,MAAc,QAAQ;AAAA,IACtBA,MAAc,QAAQ;AAAA,IACtBE,KAAU;AAAA,IACVN;AAAA,EAAA;AAGJ,2BACK,OAAA,EAAI,KAAAD,GAAW,GAAGU,GAAgB,WAAWC,GAC1C,UAAA;AAAA,IAAA,gBAAAE,EAAC,OAAA,EAAI,WAAU,2EACX,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACG,SAAQ;AAAA,UACR,WAAU;AAAA,UACV,UAAU,CAACX;AAAA,UACX,UAAS;AAAA,UACT,SAASI;AAAA,UAER,UAAAJ;AAAA,QAAA;AAAA,MAAA;AAAA,MAEL,gBAAAU,EAAC,OAAA,EAAI,WAAU,qBAAqB,UAAAX,EAAA,CAAM;AAAA,IAAA,GAC9C;AAAA,IACA,gBAAAU,EAAC,OAAA,EAAI,WAAU,gGACX,UAAA;AAAA,MAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,cAAc,UAAAZ,GAAM;AAAA,MAClCI,KAAY,gBAAAQ,EAAC,OAAA,EAAI,WAAU,yDAAyD,UAAAR,EAAA,CAAS;AAAA,IAAA,EAAA,CAClG;AAAA,EAAA,GACJ;AAER,CAAC;"}
+{"version":3,"file":"AppNavigationBar.js","sources":["../../../src/components/navigation/AppNavigationBar.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, type MouseEvent, type ReactNode } from 'react';\nimport { noop } from 'es-toolkit/function';\n\nimport classNames from '../../utils/classNames';\nimport Button from '../button/Button';\n\nexport type AppNavigationBarProps = {\n    /**\n     * The title for the content that is shown.\n     */\n    title?: string | ReactNode;\n\n    /**\n     * Defines the size of the title. Possible values are 'md' and 'lg'.\n     *\n     * @default 'md'\n     */\n    titleSize?: 'md' | 'lg';\n\n    /**\n     * Adds a subtitle below the title.\n     */\n    subtitle?: string | ReactNode;\n\n    /**\n     * Right side area for additional options of buttons like filter etc. that is relevant for the shown content..\n     */\n    right?: ReactNode;\n\n    backButtonText?: string | ReactNode;\n\n    /**\n     * Add a light bottom border to the wrapper element.\n     *\n     * @default false\n     */\n    border?: boolean;\n\n    /**\n     * Callback function for when the back navigation button is clicked.\n     */\n    onNavigateBack?: (event: MouseEvent<HTMLSpanElement>) => void;\n\n    /**\n     * Additional classes for the wrapper element.\n     */\n    className?: string;\n};\n\nexport const AppNavigationBar = forwardRef((props: AppNavigationBarProps, ref: ForwardedRef<HTMLDivElement>) => {\n    const {\n        className,\n        title,\n        right = <span />,\n        backButtonText = '',\n        titleSize = 'md',\n        subtitle,\n        border = false,\n        onNavigateBack = noop,\n        ...remainingProps\n    } = props;\n\n    const navigationClasses = classNames(\n        'AppNavigationBar',\n        'width-100pct height-45 user-select-none padding-x-10',\n        'display-grid grid-stack align-items-center',\n        titleSize === 'md' && 'text-size-14',\n        titleSize === 'lg' && 'text-size-16',\n        border && 'border border-bottom-only border-color-lighter',\n        className\n    );\n\n    return (\n        <div ref={ref} {...remainingProps} className={navigationClasses}>\n            <div className='grid-stack-item display-flex align-items-center justify-content-between'>\n                <Button\n                    bsStyle='muted'\n                    className='text-color-darkest'\n                    iconOnly={!backButtonText}\n                    iconName='rioglyph-arrow-left'\n                    onClick={onNavigateBack}\n                >\n                    {backButtonText}\n                </Button>\n                <div className='btn-toolbar gap-2'>{right}</div>\n            </div>\n            <div className='grid-stack-item text-center text-medium text-color-darker margin-x-25 padding-x-5 ellipsis-1'>\n                <div className='ellipsis-1'>{title}</div>\n                {subtitle && <div className='text-size-12 line-height-12 text-normal margin-top--2'>{subtitle}</div>}\n            </div>\n        </div>\n    );\n});\n\nexport default AppNavigationBar;\n"],"names":["AppNavigationBar","forwardRef","props","ref","className","title","right","backButtonText","titleSize","subtitle","border","onNavigateBack","noop","remainingProps","navigationClasses","classNames","jsxs","jsx","Button"],"mappings":";;;;;AAiDO,MAAMA,IAAmBC,EAAW,CAACC,GAA8BC,MAAsC;AAC5G,QAAM;AAAA,IACF,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,sBAAS,QAAA,EAAK;AAAA,IACd,gBAAAC,IAAiB;AAAA,IACjB,WAAAC,IAAY;AAAA,IACZ,UAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,gBAAAC,IAAiBC;AAAA,IACjB,GAAGC;AAAA,EAAA,IACHX,GAEEY,IAAoBC;AAAA,IACtB;AAAA,IACA;AAAA,IACA;AAAA,IACAP,MAAc,QAAQ;AAAA,IACtBA,MAAc,QAAQ;AAAA,IACtBE,KAAU;AAAA,IACVN;AAAA,EAAA;AAGJ,2BACK,OAAA,EAAI,KAAAD,GAAW,GAAGU,GAAgB,WAAWC,GAC1C,UAAA;AAAA,IAAA,gBAAAE,EAAC,OAAA,EAAI,WAAU,2EACX,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACG,SAAQ;AAAA,UACR,WAAU;AAAA,UACV,UAAU,CAACX;AAAA,UACX,UAAS;AAAA,UACT,SAASI;AAAA,UAER,UAAAJ;AAAA,QAAA;AAAA,MAAA;AAAA,MAEL,gBAAAU,EAAC,OAAA,EAAI,WAAU,qBAAqB,UAAAX,EAAA,CAAM;AAAA,IAAA,GAC9C;AAAA,IACA,gBAAAU,EAAC,OAAA,EAAI,WAAU,gGACX,UAAA;AAAA,MAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,cAAc,UAAAZ,GAAM;AAAA,MAClCI,KAAY,gBAAAQ,EAAC,OAAA,EAAI,WAAU,yDAAyD,UAAAR,EAAA,CAAS;AAAA,IAAA,EAAA,CAClG;AAAA,EAAA,GACJ;AAER,CAAC;"}

package/components/noData/NoData.js

@@ -1,5 +1,5 @@
 import { jsxs as p, jsx as e } from "react/jsx-runtime";
-import c from "classnames";
+import c from "../../utils/classNames.js";
 import m from "../tooltip/SimpleTooltip.js";
 import { PLACEMENT as N } from "../../values/Placement.js";
 const g = (a) => {

package/components/noData/NoData.js.map

@@ -1 +1 @@
-{"version":3,"file":"NoData.js","sources":["../../../src/components/noData/NoData.tsx"],"sourcesContent":["import type React from 'react';\nimport classNames from 'classnames';\n\nimport SimpleTooltip from '../tooltip/SimpleTooltip';\nimport type { TooltipWidth } from '../tooltip/Tooltip';\nimport { PLACEMENT } from '../../values/Placement';\nimport type { ObjectValues } from '../../utils/ObjectValues';\n\nexport type NoDataProps = {\n    /**\n     * The actual translated \"No data\" text.\n     */\n    text: string | React.ReactNode;\n\n    /**\n     * Additional explanation shown inside a tooltip.\n     */\n    tooltip?: string | React.ReactNode;\n\n    /**\n     * Sets the direction the Tooltip is positioned towards.\n     *\n     * Possible values are:\n     * `auto-start`, `auto`, `auto-end`,\n     * `top-start`, `top`, `top-end`,\n     * `bottom-start`, `bottom`, `bottom-end`,\n     * `right-start`, `right`, `right-end`,\n     * `left-start`, `left`, `left-end`\n     */\n    tooltipPlacement?: ObjectValues<typeof PLACEMENT>;\n\n    /**\n     * The width of the tooltip.\n     *\n     * Possible values are:\n     * `auto`, `100`, `150`, `200`, `250`, `300`, `350`, `400`, `450`, `500`\n     */\n    tooltipWidth?: TooltipWidth;\n\n    /**\n     * Additional class names to be added to the wrapping element.\n     */\n    className?: string;\n};\n\nconst NoData = (props: NoDataProps) => {\n    const {\n        text,\n        className = '',\n        tooltip,\n        tooltipPlacement = PLACEMENT.BOTTOM,\n        tooltipWidth = 'auto',\n        ...remainingProps\n    } = props;\n\n    const noDataClasses = classNames('NoData', className);\n\n    if (tooltip) {\n        return (\n            <span {...remainingProps} className={noDataClasses}>\n                <span className='pointer-events-none user-select-none'>{text}</span>\n                <SimpleTooltip content={tooltip} placement={tooltipPlacement} width={tooltipWidth}>\n                    <span className='rioglyph rioglyph-info-sign margin-left-5' />\n                </SimpleTooltip>\n            </span>\n        );\n    }\n\n    return (\n        <span {...remainingProps} className={noDataClasses}>\n            <span className='pointer-events-none user-select-none'>{text}</span>\n        </span>\n    );\n};\n\nexport default NoData;\n"],"names":["NoData","props","text","className","tooltip","tooltipPlacement","PLACEMENT","tooltipWidth","remainingProps","noDataClasses","classNames","jsxs","jsx","SimpleTooltip"],"mappings":";;;;AA6CA,MAAMA,IAAS,CAACC,MAAuB;AACnC,QAAM;AAAA,IACF,MAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,SAAAC;AAAA,IACA,kBAAAC,IAAmBC,EAAU;AAAA,IAC7B,cAAAC,IAAe;AAAA,IACf,GAAGC;AAAA,EAAA,IACHP,GAEEQ,IAAgBC,EAAW,UAAUP,CAAS;AAEpD,SAAIC,IAEI,gBAAAO,EAAC,QAAA,EAAM,GAAGH,GAAgB,WAAWC,GACjC,UAAA;AAAA,IAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,wCAAwC,UAAAV,GAAK;AAAA,IAC7D,gBAAAU,EAACC,GAAA,EAAc,SAAST,GAAS,WAAWC,GAAkB,OAAOE,GACjE,UAAA,gBAAAK,EAAC,QAAA,EAAK,WAAU,4CAAA,CAA4C,EAAA,CAChE;AAAA,EAAA,GACJ,IAKJ,gBAAAA,EAAC,QAAA,EAAM,GAAGJ,GAAgB,WAAWC,GACjC,UAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,wCAAwC,UAAAV,EAAA,CAAK,GACjE;AAER;"}
+{"version":3,"file":"NoData.js","sources":["../../../src/components/noData/NoData.tsx"],"sourcesContent":["import type React from 'react';\n\nimport classNames from '../../utils/classNames';\nimport SimpleTooltip from '../tooltip/SimpleTooltip';\nimport type { TooltipWidth } from '../tooltip/Tooltip';\nimport { PLACEMENT } from '../../values/Placement';\nimport type { ObjectValues } from '../../utils/ObjectValues';\n\nexport type NoDataProps = {\n    /**\n     * The actual translated \"No data\" text.\n     */\n    text: string | React.ReactNode;\n\n    /**\n     * Additional explanation shown inside a tooltip.\n     */\n    tooltip?: string | React.ReactNode;\n\n    /**\n     * Sets the direction the Tooltip is positioned towards.\n     *\n     * Possible values are:\n     * `auto-start`, `auto`, `auto-end`,\n     * `top-start`, `top`, `top-end`,\n     * `bottom-start`, `bottom`, `bottom-end`,\n     * `right-start`, `right`, `right-end`,\n     * `left-start`, `left`, `left-end`\n     */\n    tooltipPlacement?: ObjectValues<typeof PLACEMENT>;\n\n    /**\n     * The width of the tooltip.\n     *\n     * Possible values are:\n     * `auto`, `100`, `150`, `200`, `250`, `300`, `350`, `400`, `450`, `500`\n     */\n    tooltipWidth?: TooltipWidth;\n\n    /**\n     * Additional class names to be added to the wrapping element.\n     */\n    className?: string;\n};\n\nconst NoData = (props: NoDataProps) => {\n    const {\n        text,\n        className = '',\n        tooltip,\n        tooltipPlacement = PLACEMENT.BOTTOM,\n        tooltipWidth = 'auto',\n        ...remainingProps\n    } = props;\n\n    const noDataClasses = classNames('NoData', className);\n\n    if (tooltip) {\n        return (\n            <span {...remainingProps} className={noDataClasses}>\n                <span className='pointer-events-none user-select-none'>{text}</span>\n                <SimpleTooltip content={tooltip} placement={tooltipPlacement} width={tooltipWidth}>\n                    <span className='rioglyph rioglyph-info-sign margin-left-5' />\n                </SimpleTooltip>\n            </span>\n        );\n    }\n\n    return (\n        <span {...remainingProps} className={noDataClasses}>\n            <span className='pointer-events-none user-select-none'>{text}</span>\n        </span>\n    );\n};\n\nexport default NoData;\n"],"names":["NoData","props","text","className","tooltip","tooltipPlacement","PLACEMENT","tooltipWidth","remainingProps","noDataClasses","classNames","jsxs","jsx","SimpleTooltip"],"mappings":";;;;AA6CA,MAAMA,IAAS,CAACC,MAAuB;AACnC,QAAM;AAAA,IACF,MAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,SAAAC;AAAA,IACA,kBAAAC,IAAmBC,EAAU;AAAA,IAC7B,cAAAC,IAAe;AAAA,IACf,GAAGC;AAAA,EAAA,IACHP,GAEEQ,IAAgBC,EAAW,UAAUP,CAAS;AAEpD,SAAIC,IAEI,gBAAAO,EAAC,QAAA,EAAM,GAAGH,GAAgB,WAAWC,GACjC,UAAA;AAAA,IAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,wCAAwC,UAAAV,GAAK;AAAA,IAC7D,gBAAAU,EAACC,GAAA,EAAc,SAAST,GAAS,WAAWC,GAAkB,OAAOE,GACjE,UAAA,gBAAAK,EAAC,QAAA,EAAK,WAAU,4CAAA,CAA4C,EAAA,CAChE;AAAA,EAAA,GACJ,IAKJ,gBAAAA,EAAC,QAAA,EAAM,GAAGJ,GAAgB,WAAWC,GACjC,UAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,wCAAwC,UAAAV,EAAA,CAAK,GACjE;AAER;"}

package/components/numberControl/NumberControl.js

@@ -1,7 +1,7 @@
 import { jsx as t, jsxs as q } from "react/jsx-runtime";
 import { forwardRef as J, useRef as Q, useState as g, useEffect as I } from "react";
-import Y from "classnames";
-import { noop as Z } from "es-toolkit/function";
+import { noop as Y } from "es-toolkit/function";
+import Z from "../../utils/classNames.js";
 import $, { DEFAULT_MIN as ee, DEFAULT_MAX as ne, DEFAULT_STEP as te, convertNonIntegerToDefault as V, DEFAULT_VALUE as L } from "../numberInput/NumberInput.js";
 const oe = 700, re = 50, se = 3, de = J((E, A) => {
   const {
@@ -11,7 +11,7 @@ const oe = 700, re = 50, se = 3, de = J((E, A) => {
     step: a = te,
     value: o,
     onChange: u,
-    onKeyDown: _ = Z,
+    onKeyDown: _ = Y,
     disabled: r,
     bsSize: C,
     className: F,
@@ -62,7 +62,7 @@ const oe = 700, re = 50, se = 3, de = J((E, A) => {
     n.current !== null && clearTimeout(n.current), h(!1), T(!1);
   }, G = (e) => {
     e !== void 0 && !(f && d) && l(Number(e)), u?.(e);
-  }, W = Y("NumberControl", F);
+  }, W = Z("NumberControl", F);
   return /* @__PURE__ */ t("div", { ...j, className: W, children: /* @__PURE__ */ t(
     $,
     {

package/components/numberControl/NumberControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberControl.js","sources":["../../../src/components/numberControl/NumberControl.tsx"],"sourcesContent":["import { useState, useRef, useEffect, forwardRef, type ForwardedRef } from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/function';\n\nimport NumberInput, {\n    DEFAULT_STEP,\n    DEFAULT_MIN,\n    DEFAULT_MAX,\n    DEFAULT_VALUE,\n    convertNonIntegerToDefault,\n    type NumberInputProps,\n} from '../numberInput/NumberInput';\n\nconst INITIAL_TICK = 700;\nconst TICK_TIME = 50;\n\nconst DEFAULT_DIGIT_PRECISION = 3;\n\nexport type NumberControlProps = NumberInputProps;\n\nconst NumberControl = forwardRef((props: NumberControlProps, ref: ForwardedRef<HTMLInputElement>) => {\n    const {\n        id,\n        min = DEFAULT_MIN,\n        max = DEFAULT_MAX,\n        step = DEFAULT_STEP,\n        value,\n        onChange,\n        onKeyDown = noop,\n        disabled,\n        bsSize,\n        className,\n        unit,\n        inputAddon,\n        errorMessage,\n        warningMessage,\n        messageWhiteSpace,\n        digitPrecision = DEFAULT_DIGIT_PRECISION,\n        placeholder,\n        noDefault,\n        ...remainingProps\n    } = props;\n\n    const timeout = useRef<NodeJS.Timeout | null>(null);\n\n    const [isHoldingDownInc, setIsHoldingDownInc] = useState(false);\n    const [isHoldingDownDec, setIsHoldingDownDec] = useState(false);\n    const [internalValue, setInternalValue] = useState(value);\n\n    const initialTimeout = (callbackFn: VoidFunction) => {\n        if (timeout.current !== null) {\n            clearTimeout(timeout.current);\n        }\n        timeout.current = setTimeout(() => {\n            callbackFn();\n        }, INITIAL_TICK);\n    };\n\n    const recursiveTimeout = (callbackFn: VoidFunction) => {\n        timeout.current = setTimeout(() => {\n            callbackFn();\n        }, TICK_TIME);\n    };\n\n    // Update internal state if external value has changed\n    useEffect(() => {\n        if (internalValue !== value) {\n            setInternalValue(value);\n        }\n    }, [value]);\n\n    // Notify external component if internal value has changed\n    useEffect(() => {\n        if (internalValue !== value && onChange) {\n            onChange(internalValue);\n        }\n    }, [internalValue]);\n\n    useEffect(() => {\n        // Call increment function for a loop when button is holding down\n        if (isHoldingDownInc && !disabled) {\n            initialTimeout(incrementRecursively);\n        }\n\n        // Call decrement function for a loop when button is holding down\n        if (isHoldingDownDec && !disabled) {\n            initialTimeout(decrementRecursively);\n        }\n    }, [isHoldingDownInc, isHoldingDownDec]);\n\n    const incrementInternalValue = () => {\n        setInternalValue(val => {\n            const currentValue = convertNonIntegerToDefault(val, DEFAULT_VALUE);\n            const newValue = Number((currentValue + step).toFixed(digitPrecision));\n            const newValueLimited = newValue <= max ? newValue : val;\n            return newValueLimited;\n        });\n    };\n\n    const decrementInternalValue = () => {\n        setInternalValue(val => {\n            const currentValue = convertNonIntegerToDefault(val, DEFAULT_VALUE);\n            const newValue = Number((currentValue - step).toFixed(digitPrecision));\n            const newValueLimited = newValue >= min ? newValue : val;\n            return newValueLimited;\n        });\n    };\n\n    const incrementRecursively = () => {\n        incrementInternalValue();\n        recursiveTimeout(incrementRecursively);\n    };\n\n    const decrementRecursively = () => {\n        decrementInternalValue();\n        recursiveTimeout(decrementRecursively);\n    };\n\n    const handleMouseDownOnIncrement = () => {\n        if (disabled) {\n            return;\n        }\n        setIsHoldingDownInc(true);\n\n        // increment for first click\n        incrementInternalValue();\n    };\n\n    const handleMouseDownOnDecrement = () => {\n        if (disabled) {\n            return;\n        }\n        setIsHoldingDownDec(true);\n\n        // decrement for first click\n        decrementInternalValue();\n    };\n\n    const handleStopHolding = () => {\n        if (timeout.current !== null) {\n            clearTimeout(timeout.current);\n        }\n        setIsHoldingDownInc(false);\n        setIsHoldingDownDec(false);\n    };\n\n    const handleUpdatedNumberInputValue = (newValue: number | undefined) => {\n        // Set the internal value when the value of the actual input has changed,\n        // for instance the user has typed in a number manually and to\n        // use this number as base to increase or decrease from.\n        // Ignore empty value in case the user has removed it\n        if (newValue !== undefined && !(isHoldingDownDec && isHoldingDownInc)) {\n            setInternalValue(Number(newValue));\n        }\n        onChange?.(newValue);\n    };\n\n    const classes = classNames('NumberControl', className);\n\n    const controls = (\n        <div className='display-flex padding-left-10' onMouseOut={handleStopHolding} onBlur={handleStopHolding}>\n            <div\n                onMouseDown={handleMouseDownOnDecrement}\n                onMouseUp={handleStopHolding}\n                role='button'\n                aria-label='decrement-button'\n                className='decrementButton display-flex align-items-center text-color-gray hover-text-color-dark cursor-pointer'\n            >\n                <div className='rioglyph rioglyph-minus scale-90' />\n            </div>\n            <div\n                onMouseDown={handleMouseDownOnIncrement}\n                onMouseUp={handleStopHolding}\n                role='button'\n                aria-label='increment-button'\n                className='incrementButton display-flex align-items-center text-color-gray hover-text-color-dark cursor-pointer margin-left-5'\n            >\n                <div className='rioglyph rioglyph-plus scale-90' />\n            </div>\n        </div>\n    );\n\n    return (\n        <div {...remainingProps} className={classes}>\n            <NumberInput\n                id={id}\n                ref={ref}\n                min={min}\n                max={max}\n                value={internalValue}\n                step={step}\n                bsSize={bsSize}\n                disabled={disabled}\n                inputAddon={inputAddon}\n                errorMessage={errorMessage}\n                warningMessage={warningMessage}\n                messageWhiteSpace={messageWhiteSpace}\n                controls={controls}\n                unit={unit}\n                onChange={handleUpdatedNumberInputValue}\n                onKeyDown={onKeyDown}\n                digitPrecision={digitPrecision}\n                placeholder={placeholder}\n                noDefault={noDefault}\n            />\n        </div>\n    );\n});\n\nexport default NumberControl;\n"],"names":["INITIAL_TICK","TICK_TIME","DEFAULT_DIGIT_PRECISION","NumberControl","forwardRef","props","ref","id","min","DEFAULT_MIN","max","DEFAULT_MAX","step","DEFAULT_STEP","value","onChange","onKeyDown","noop","disabled","bsSize","className","unit","inputAddon","errorMessage","warningMessage","messageWhiteSpace","digitPrecision","placeholder","noDefault","remainingProps","timeout","useRef","isHoldingDownInc","setIsHoldingDownInc","useState","isHoldingDownDec","setIsHoldingDownDec","internalValue","setInternalValue","initialTimeout","callbackFn","recursiveTimeout","useEffect","incrementRecursively","decrementRecursively","incrementInternalValue","val","currentValue","convertNonIntegerToDefault","DEFAULT_VALUE","newValue","decrementInternalValue","handleMouseDownOnIncrement","handleMouseDownOnDecrement","handleStopHolding","handleUpdatedNumberInputValue","classes","classNames","jsx","NumberInput"],"mappings":"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"}
+{"version":3,"file":"NumberControl.js","sources":["../../../src/components/numberControl/NumberControl.tsx"],"sourcesContent":["import { useState, useRef, useEffect, forwardRef, type ForwardedRef } from 'react';\nimport { noop } from 'es-toolkit/function';\n\nimport classNames from '../../utils/classNames';\nimport NumberInput, {\n    DEFAULT_STEP,\n    DEFAULT_MIN,\n    DEFAULT_MAX,\n    DEFAULT_VALUE,\n    convertNonIntegerToDefault,\n    type NumberInputProps,\n} from '../numberInput/NumberInput';\n\nconst INITIAL_TICK = 700;\nconst TICK_TIME = 50;\n\nconst DEFAULT_DIGIT_PRECISION = 3;\n\nexport type NumberControlProps = NumberInputProps;\n\nconst NumberControl = forwardRef((props: NumberControlProps, ref: ForwardedRef<HTMLInputElement>) => {\n    const {\n        id,\n        min = DEFAULT_MIN,\n        max = DEFAULT_MAX,\n        step = DEFAULT_STEP,\n        value,\n        onChange,\n        onKeyDown = noop,\n        disabled,\n        bsSize,\n        className,\n        unit,\n        inputAddon,\n        errorMessage,\n        warningMessage,\n        messageWhiteSpace,\n        digitPrecision = DEFAULT_DIGIT_PRECISION,\n        placeholder,\n        noDefault,\n        ...remainingProps\n    } = props;\n\n    const timeout = useRef<NodeJS.Timeout | null>(null);\n\n    const [isHoldingDownInc, setIsHoldingDownInc] = useState(false);\n    const [isHoldingDownDec, setIsHoldingDownDec] = useState(false);\n    const [internalValue, setInternalValue] = useState(value);\n\n    const initialTimeout = (callbackFn: VoidFunction) => {\n        if (timeout.current !== null) {\n            clearTimeout(timeout.current);\n        }\n        timeout.current = setTimeout(() => {\n            callbackFn();\n        }, INITIAL_TICK);\n    };\n\n    const recursiveTimeout = (callbackFn: VoidFunction) => {\n        timeout.current = setTimeout(() => {\n            callbackFn();\n        }, TICK_TIME);\n    };\n\n    // Update internal state if external value has changed\n    useEffect(() => {\n        if (internalValue !== value) {\n            setInternalValue(value);\n        }\n    }, [value]);\n\n    // Notify external component if internal value has changed\n    useEffect(() => {\n        if (internalValue !== value && onChange) {\n            onChange(internalValue);\n        }\n    }, [internalValue]);\n\n    useEffect(() => {\n        // Call increment function for a loop when button is holding down\n        if (isHoldingDownInc && !disabled) {\n            initialTimeout(incrementRecursively);\n        }\n\n        // Call decrement function for a loop when button is holding down\n        if (isHoldingDownDec && !disabled) {\n            initialTimeout(decrementRecursively);\n        }\n    }, [isHoldingDownInc, isHoldingDownDec]);\n\n    const incrementInternalValue = () => {\n        setInternalValue(val => {\n            const currentValue = convertNonIntegerToDefault(val, DEFAULT_VALUE);\n            const newValue = Number((currentValue + step).toFixed(digitPrecision));\n            const newValueLimited = newValue <= max ? newValue : val;\n            return newValueLimited;\n        });\n    };\n\n    const decrementInternalValue = () => {\n        setInternalValue(val => {\n            const currentValue = convertNonIntegerToDefault(val, DEFAULT_VALUE);\n            const newValue = Number((currentValue - step).toFixed(digitPrecision));\n            const newValueLimited = newValue >= min ? newValue : val;\n            return newValueLimited;\n        });\n    };\n\n    const incrementRecursively = () => {\n        incrementInternalValue();\n        recursiveTimeout(incrementRecursively);\n    };\n\n    const decrementRecursively = () => {\n        decrementInternalValue();\n        recursiveTimeout(decrementRecursively);\n    };\n\n    const handleMouseDownOnIncrement = () => {\n        if (disabled) {\n            return;\n        }\n        setIsHoldingDownInc(true);\n\n        // increment for first click\n        incrementInternalValue();\n    };\n\n    const handleMouseDownOnDecrement = () => {\n        if (disabled) {\n            return;\n        }\n        setIsHoldingDownDec(true);\n\n        // decrement for first click\n        decrementInternalValue();\n    };\n\n    const handleStopHolding = () => {\n        if (timeout.current !== null) {\n            clearTimeout(timeout.current);\n        }\n        setIsHoldingDownInc(false);\n        setIsHoldingDownDec(false);\n    };\n\n    const handleUpdatedNumberInputValue = (newValue: number | undefined) => {\n        // Set the internal value when the value of the actual input has changed,\n        // for instance the user has typed in a number manually and to\n        // use this number as base to increase or decrease from.\n        // Ignore empty value in case the user has removed it\n        if (newValue !== undefined && !(isHoldingDownDec && isHoldingDownInc)) {\n            setInternalValue(Number(newValue));\n        }\n        onChange?.(newValue);\n    };\n\n    const classes = classNames('NumberControl', className);\n\n    const controls = (\n        <div className='display-flex padding-left-10' onMouseOut={handleStopHolding} onBlur={handleStopHolding}>\n            <div\n                onMouseDown={handleMouseDownOnDecrement}\n                onMouseUp={handleStopHolding}\n                role='button'\n                aria-label='decrement-button'\n                className='decrementButton display-flex align-items-center text-color-gray hover-text-color-dark cursor-pointer'\n            >\n                <div className='rioglyph rioglyph-minus scale-90' />\n            </div>\n            <div\n                onMouseDown={handleMouseDownOnIncrement}\n                onMouseUp={handleStopHolding}\n                role='button'\n                aria-label='increment-button'\n                className='incrementButton display-flex align-items-center text-color-gray hover-text-color-dark cursor-pointer margin-left-5'\n            >\n                <div className='rioglyph rioglyph-plus scale-90' />\n            </div>\n        </div>\n    );\n\n    return (\n        <div {...remainingProps} className={classes}>\n            <NumberInput\n                id={id}\n                ref={ref}\n                min={min}\n                max={max}\n                value={internalValue}\n                step={step}\n                bsSize={bsSize}\n                disabled={disabled}\n                inputAddon={inputAddon}\n                errorMessage={errorMessage}\n                warningMessage={warningMessage}\n                messageWhiteSpace={messageWhiteSpace}\n                controls={controls}\n                unit={unit}\n                onChange={handleUpdatedNumberInputValue}\n                onKeyDown={onKeyDown}\n                digitPrecision={digitPrecision}\n                placeholder={placeholder}\n                noDefault={noDefault}\n            />\n        </div>\n    );\n});\n\nexport default NumberControl;\n"],"names":["INITIAL_TICK","TICK_TIME","DEFAULT_DIGIT_PRECISION","NumberControl","forwardRef","props","ref","id","min","DEFAULT_MIN","max","DEFAULT_MAX","step","DEFAULT_STEP","value","onChange","onKeyDown","noop","disabled","bsSize","className","unit","inputAddon","errorMessage","warningMessage","messageWhiteSpace","digitPrecision","placeholder","noDefault","remainingProps","timeout","useRef","isHoldingDownInc","setIsHoldingDownInc","useState","isHoldingDownDec","setIsHoldingDownDec","internalValue","setInternalValue","initialTimeout","callbackFn","recursiveTimeout","useEffect","incrementRecursively","decrementRecursively","incrementInternalValue","val","currentValue","convertNonIntegerToDefault","DEFAULT_VALUE","newValue","decrementInternalValue","handleMouseDownOnIncrement","handleMouseDownOnDecrement","handleStopHolding","handleUpdatedNumberInputValue","classes","classNames","jsx","NumberInput"],"mappings":"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"}

package/components/numberInput/NumberInput.js

@@ -1,7 +1,7 @@
 import { jsx as l, jsxs as N, Fragment as J } from "react/jsx-runtime";
 import { forwardRef as Q, useRef as Y, useState as Z } from "react";
-import _ from "classnames";
 import { noop as ee } from "es-toolkit/function";
+import _ from "../../utils/classNames.js";
 import re from "../../hooks/useAfterMount.js";
 const ne = 3, C = 0, se = 1, te = 0, oe = Number.MAX_VALUE, ae = [
   "0",

package/components/numberInput/NumberInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInput.js","sources":["../../../src/components/numberInput/NumberInput.tsx"],"sourcesContent":["import React, { useState, useRef, forwardRef, type ForwardedRef } from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/function';\n\nimport useAfterMount from '../../hooks/useAfterMount';\n\nconst DEFAULT_DIGIT_PRECISION = 3;\nexport const DEFAULT_VALUE = 0;\nexport const DEFAULT_STEP = 1;\nexport const DEFAULT_MIN = 0;\nexport const DEFAULT_MAX = Number.MAX_VALUE;\n\nconst validKeys = [\n    '0',\n    '1',\n    '2',\n    '3',\n    '4',\n    '5',\n    '6',\n    '7',\n    '8',\n    '9',\n    '.',\n    ',',\n    '-',\n    'Backspace',\n    'Tab',\n    'ArrowLeft',\n    'ArrowRight',\n    'ArrowDown',\n    'ArrowUp',\n];\n\n// Note: even if limits are set and input type is number, many browsers allow to enter invalid data\n// like entering characters or values outside the boundaries, hence we have to check the input here\n// See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number\n\nconst getValueFromProps = (\n    val: number | undefined,\n    min: number,\n    max: number,\n    placeholder: string | undefined,\n    noDefault: boolean\n) => {\n    // Show placeholder or nothing if given instead of 0 if requested for\n    if (val === undefined && (placeholder || noDefault)) {\n        return '';\n    }\n    return clampNumber(Number(val), min, max) || DEFAULT_VALUE;\n};\n\nconst clampNumber = (value: number, min: number, max: number) => {\n    if (value < min) {\n        return min;\n    }\n    if (value > max) {\n        return max;\n    }\n    return value;\n};\n\nexport const convertNonIntegerToDefault = (value: number | undefined, fallback: number) => {\n    return typeof value === 'number' && Number.isFinite(value) ? value : fallback;\n};\n\nconst isMultipleKeyInput = (\n    key: string,\n    event: React.KeyboardEvent<HTMLInputElement>,\n    previousKeyRef: React.MutableRefObject<string>\n) => {\n    return event.key === key && previousKeyRef.current.includes(key);\n};\n\nconst isInvalidAfter = (\n    key: string,\n    possiblePreviousKeys: string[],\n    event: React.KeyboardEvent<HTMLInputElement>,\n    previousKeyRef: React.MutableRefObject<string>\n) => {\n    return event.key === key && possiblePreviousKeys.includes(previousKeyRef.current);\n};\n\nexport type NumberInputProps = Omit<React.HTMLProps<HTMLInputElement>, 'onChange' | 'controls'> & {\n    /**\n     * A native input id attribute.\n     *\n     * Passed through as HTML attribute to the input element.\n     */\n    id?: string;\n\n    /**\n     * The minimum value of the input.\n     *\n     * @default 0\n     */\n    min?: number;\n\n    /**\n     * The maximum value of the input.\n     *\n     * @default Number.MAX_VALUE\n     */\n    max?: number;\n\n    /**\n     * The initial value of the input.\n     *\n     * Used to control the component from the outside.\n     *\n     * @default 0\n     */\n    value?: number;\n\n    /**\n     * Lets you omit the default value of \"0\" when the vale is not defined.\n     *\n     * The input will be empty in this case.\n     *\n     * @default false\n     */\n    noDefault?: boolean;\n\n    /**\n     * The size of increment or decrement (only works with number type).\n     *\n     * @default 1\n     */\n    step?: number;\n\n    /**\n     * Enables or disabled the input.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Callback function triggered when the input value changes.\n     *\n     * When the value is removed by the user, the input is kept empty, but it triggers the callback without any value\n     * since the user has finished his input.\n     *\n     * @param value The new value of the input.\n     */\n    onChange?: (value?: number) => void;\n\n    /**\n     * Callback function that gets triggered after filtering out invalid keystrokes.\n     *\n     * @param event The keyboard event.\n     */\n    onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n    /**\n     * Defines the size of the input to be rendered.\n     *\n     * @default 'md'\n     */\n    bsSize?: 'sm' | 'md' | 'lg';\n\n    /**\n     * A unit for this value.\n     *\n     * This will be shown in a dedicated input addon.\n     */\n    unit?: string | React.ReactNode;\n\n    /**\n     * A rioglyph icon tio be shown in front of the input.\n     */\n    inputAddon?: string;\n\n    /**\n     * Input error message.\n     */\n    errorMessage?: string | React.ReactNode;\n\n    /**\n     * Input warning message.\n     */\n    warningMessage?: string | React.ReactNode;\n\n    /**\n     * Feedback message width.\n     *\n     * @default 'normal'\n     */\n    messageWhiteSpace?: 'normal' | 'nowrap' | 'pre-line';\n\n    /**\n     * This prop is used by the NumberControl component to pass on the +/- spinner controls.\n     *\n     * @internal\n     */\n    controls?: React.ReactNode;\n\n    /**\n     * The input placeholder if no value is given.\n     */\n    placeholder?: string;\n\n    /**\n     * Number of digits after the comma the value should be fixed to.\n     *\n     * @default 3\n     */\n    digitPrecision?: number;\n\n    /**\n     * Additional classes to be set on the component.\n     */\n    className?: string;\n};\n\nconst NumberInput = forwardRef((props: NumberInputProps, ref: ForwardedRef<HTMLInputElement>) => {\n    const {\n        id,\n        min: propMin,\n        max: propMax,\n        value: propValue,\n        step = DEFAULT_STEP,\n        disabled = false,\n        noDefault = false,\n        onChange,\n        onKeyDown = noop,\n        bsSize = 'md',\n        unit,\n        inputAddon,\n        errorMessage,\n        warningMessage,\n        messageWhiteSpace = 'normal',\n        controls,\n        placeholder,\n        digitPrecision = DEFAULT_DIGIT_PRECISION,\n        className = '',\n        ...remainingProps\n    } = props;\n\n    const previousKeyRef = useRef<string>('');\n\n    const min = convertNonIntegerToDefault(propMin, DEFAULT_MIN);\n    const max = convertNonIntegerToDefault(propMax, DEFAULT_MAX);\n\n    const value = getValueFromProps(propValue, min, max, placeholder, noDefault);\n\n    // Define local state and define initial values\n    const [state, setState] = useState({\n        value,\n        enteredValue: value,\n        isValid: true,\n    });\n\n    // Update internal value whenever the value prop from outside changes\n    useAfterMount(() => {\n        setState({\n            value: getValueFromProps(propValue, min, max, placeholder, noDefault),\n            enteredValue: value,\n            isValid: true,\n        });\n    }, [propValue, min, max, placeholder, noDefault, value]);\n\n    const applyValue = (newValue: string | number) => {\n        if (newValue === '-' || newValue === '') {\n            setState({\n                value: newValue,\n                enteredValue: newValue,\n                isValid: true,\n            });\n            return;\n        }\n\n        const enteredValue = Number(newValue);\n        const isValid = !Number.isNaN(enteredValue) && enteredValue >= min && enteredValue <= max;\n        const newValidValue = clampNumber(enteredValue, min, max);\n\n        setState({\n            value: newValidValue,\n            enteredValue,\n            isValid,\n        });\n\n        // Only call back the caller for valid values\n        isValid && onChange && onChange(newValidValue);\n    };\n\n    const handleOnChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        applyValue(event.target.value);\n    };\n\n    // Prevent entering exponent to avoid side effects\n    // See https://bugzilla.mozilla.org/show_bug.cgi?id=1398528\n    // Also preventing letter inputs or multiple consecutive characters\n    // that is possible by Firefox and Safari\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        // Allow for key combination like \"ctrl + a\"\n        if (event.ctrlKey || event.altKey || event.metaKey) {\n            return;\n        }\n\n        // Check for multiple dots, commas or dashes (consecutive)\n        if (\n            isMultipleKeyInput('.', event, previousKeyRef) ||\n            isMultipleKeyInput(',', event, previousKeyRef) ||\n            isMultipleKeyInput('-', event, previousKeyRef) ||\n            isInvalidAfter(',', ['.', '-'], event, previousKeyRef) ||\n            isInvalidAfter('.', [',', '-'], event, previousKeyRef) ||\n            isInvalidAfter('-', ['.', ','], event, previousKeyRef) ||\n            event.key === 'Process' ||\n            event.key === 'Dead'\n        ) {\n            event.preventDefault();\n        }\n\n        // Filter out everything that is not a number\n        if (!validKeys.includes(event.key)) {\n            event.preventDefault();\n        }\n\n        previousKeyRef.current = event.key;\n\n        onKeyDown(event);\n    };\n\n    const handleBlur = () => {\n        // When the value is removed, keep the input empty but trigger the outside callback\n        // since the user has finished his input\n        const lastEnteredValue = state.enteredValue;\n        if (lastEnteredValue === '') {\n            onChange?.();\n            return;\n        }\n\n        // If there is no value defined and a placeholder is given or the default is not wanted,\n        // keep the input empty\n        if (!state.value && (noDefault || placeholder)) {\n            return;\n        }\n\n        // Otherwise, validate the input, round it according to digitPrecision,\n        // and clamp the value if the entered value exceeds the limitations\n        const convertedEnteredValue = convertNonIntegerToDefault(Number(lastEnteredValue), DEFAULT_VALUE);\n        const validNumber = clampNumber(Number(convertedEnteredValue.toFixed(digitPrecision)), min, max);\n        applyValue(validNumber);\n    };\n\n    const handleWheel = (event: React.WheelEvent<HTMLInputElement>) => {\n        const target = event.target;\n        if (target instanceof HTMLInputElement) {\n            target.blur();\n        }\n    };\n\n    const inputGroupClassNames = classNames(\n        'input-group',\n        bsSize === 'sm' && 'input-group-sm',\n        bsSize === 'lg' && 'input-group-lg'\n    );\n\n    const inputClassNames = classNames(\n        'form-control',\n        'no-controls',\n        bsSize === 'sm' && 'input-sm',\n        bsSize === 'lg' && 'input-lg',\n        className\n    );\n\n    const hasFeedback = errorMessage || warningMessage;\n\n    const input = (\n        <input\n            {...remainingProps}\n            id={id}\n            type='number'\n            step={step}\n            min={min}\n            max={max}\n            value={state.isValid ? state.value : state.enteredValue}\n            className={inputClassNames}\n            disabled={disabled}\n            onBlur={handleBlur}\n            // onChange={state.value ? handleOnChange : undefined}\n            onChange={handleOnChange}\n            onKeyDown={handleKeyDown}\n            ref={ref}\n            aria-label='number-input'\n            placeholder={placeholder}\n            onWheel={handleWheel}\n        />\n    );\n\n    return (\n        <div className={inputGroupClassNames}>\n            {inputAddon && (\n                <div className='input-group-addon'>\n                    <span className={inputAddon} />\n                </div>\n            )}\n            <div className='form-control-feedback-wrapper'>\n                {input}\n                {hasFeedback && (\n                    <>\n                        {errorMessage && <span className='form-control-feedback rioglyph rioglyph-error-sign' />}\n                        {warningMessage && <span className='form-control-feedback rioglyph rioglyph-warning-sign' />}\n                        <span className={`help-block white-space-${messageWhiteSpace}`}>\n                            <span>{errorMessage || warningMessage}</span>\n                        </span>\n                    </>\n                )}\n            </div>\n            {(unit || controls) && (\n                <div className={`input-group-addon ${disabled ? 'disabled pointer-events-none' : ''}`}>\n                    {unit && unit}\n                    {controls && controls}\n                </div>\n            )}\n        </div>\n    );\n});\n\nexport default NumberInput;\n"],"names":["DEFAULT_DIGIT_PRECISION","DEFAULT_VALUE","DEFAULT_STEP","DEFAULT_MIN","DEFAULT_MAX","validKeys","getValueFromProps","val","min","max","placeholder","noDefault","clampNumber","value","convertNonIntegerToDefault","fallback","isMultipleKeyInput","key","event","previousKeyRef","isInvalidAfter","possiblePreviousKeys","NumberInput","forwardRef","props","ref","id","propMin","propMax","propValue","step","disabled","onChange","onKeyDown","noop","bsSize","unit","inputAddon","errorMessage","warningMessage","messageWhiteSpace","controls","digitPrecision","className","remainingProps","useRef","state","setState","useState","useAfterMount","applyValue","newValue","enteredValue","isValid","newValidValue","handleOnChange","handleKeyDown","handleBlur","lastEnteredValue","convertedEnteredValue","validNumber","handleWheel","target","inputGroupClassNames","classNames","inputClassNames","hasFeedback","input","jsx","jsxs","Fragment"],"mappings":"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"}
+{"version":3,"file":"NumberInput.js","sources":["../../../src/components/numberInput/NumberInput.tsx"],"sourcesContent":["import React, { useState, useRef, forwardRef, type ForwardedRef } from 'react';\nimport { noop } from 'es-toolkit/function';\n\nimport classNames from '../../utils/classNames';\nimport useAfterMount from '../../hooks/useAfterMount';\n\nconst DEFAULT_DIGIT_PRECISION = 3;\nexport const DEFAULT_VALUE = 0;\nexport const DEFAULT_STEP = 1;\nexport const DEFAULT_MIN = 0;\nexport const DEFAULT_MAX = Number.MAX_VALUE;\n\nconst validKeys = [\n    '0',\n    '1',\n    '2',\n    '3',\n    '4',\n    '5',\n    '6',\n    '7',\n    '8',\n    '9',\n    '.',\n    ',',\n    '-',\n    'Backspace',\n    'Tab',\n    'ArrowLeft',\n    'ArrowRight',\n    'ArrowDown',\n    'ArrowUp',\n];\n\n// Note: even if limits are set and input type is number, many browsers allow to enter invalid data\n// like entering characters or values outside the boundaries, hence we have to check the input here\n// See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number\n\nconst getValueFromProps = (\n    val: number | undefined,\n    min: number,\n    max: number,\n    placeholder: string | undefined,\n    noDefault: boolean\n) => {\n    // Show placeholder or nothing if given instead of 0 if requested for\n    if (val === undefined && (placeholder || noDefault)) {\n        return '';\n    }\n    return clampNumber(Number(val), min, max) || DEFAULT_VALUE;\n};\n\nconst clampNumber = (value: number, min: number, max: number) => {\n    if (value < min) {\n        return min;\n    }\n    if (value > max) {\n        return max;\n    }\n    return value;\n};\n\nexport const convertNonIntegerToDefault = (value: number | undefined, fallback: number) => {\n    return typeof value === 'number' && Number.isFinite(value) ? value : fallback;\n};\n\nconst isMultipleKeyInput = (\n    key: string,\n    event: React.KeyboardEvent<HTMLInputElement>,\n    previousKeyRef: React.MutableRefObject<string>\n) => {\n    return event.key === key && previousKeyRef.current.includes(key);\n};\n\nconst isInvalidAfter = (\n    key: string,\n    possiblePreviousKeys: string[],\n    event: React.KeyboardEvent<HTMLInputElement>,\n    previousKeyRef: React.MutableRefObject<string>\n) => {\n    return event.key === key && possiblePreviousKeys.includes(previousKeyRef.current);\n};\n\nexport type NumberInputProps = Omit<React.HTMLProps<HTMLInputElement>, 'onChange' | 'controls'> & {\n    /**\n     * A native input id attribute.\n     *\n     * Passed through as HTML attribute to the input element.\n     */\n    id?: string;\n\n    /**\n     * The minimum value of the input.\n     *\n     * @default 0\n     */\n    min?: number;\n\n    /**\n     * The maximum value of the input.\n     *\n     * @default Number.MAX_VALUE\n     */\n    max?: number;\n\n    /**\n     * The initial value of the input.\n     *\n     * Used to control the component from the outside.\n     *\n     * @default 0\n     */\n    value?: number;\n\n    /**\n     * Lets you omit the default value of \"0\" when the vale is not defined.\n     *\n     * The input will be empty in this case.\n     *\n     * @default false\n     */\n    noDefault?: boolean;\n\n    /**\n     * The size of increment or decrement (only works with number type).\n     *\n     * @default 1\n     */\n    step?: number;\n\n    /**\n     * Enables or disabled the input.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Callback function triggered when the input value changes.\n     *\n     * When the value is removed by the user, the input is kept empty, but it triggers the callback without any value\n     * since the user has finished his input.\n     *\n     * @param value The new value of the input.\n     */\n    onChange?: (value?: number) => void;\n\n    /**\n     * Callback function that gets triggered after filtering out invalid keystrokes.\n     *\n     * @param event The keyboard event.\n     */\n    onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n    /**\n     * Defines the size of the input to be rendered.\n     *\n     * @default 'md'\n     */\n    bsSize?: 'sm' | 'md' | 'lg';\n\n    /**\n     * A unit for this value.\n     *\n     * This will be shown in a dedicated input addon.\n     */\n    unit?: string | React.ReactNode;\n\n    /**\n     * A rioglyph icon tio be shown in front of the input.\n     */\n    inputAddon?: string;\n\n    /**\n     * Input error message.\n     */\n    errorMessage?: string | React.ReactNode;\n\n    /**\n     * Input warning message.\n     */\n    warningMessage?: string | React.ReactNode;\n\n    /**\n     * Feedback message width.\n     *\n     * @default 'normal'\n     */\n    messageWhiteSpace?: 'normal' | 'nowrap' | 'pre-line';\n\n    /**\n     * This prop is used by the NumberControl component to pass on the +/- spinner controls.\n     *\n     * @internal\n     */\n    controls?: React.ReactNode;\n\n    /**\n     * The input placeholder if no value is given.\n     */\n    placeholder?: string;\n\n    /**\n     * Number of digits after the comma the value should be fixed to.\n     *\n     * @default 3\n     */\n    digitPrecision?: number;\n\n    /**\n     * Additional classes to be set on the component.\n     */\n    className?: string;\n};\n\nconst NumberInput = forwardRef((props: NumberInputProps, ref: ForwardedRef<HTMLInputElement>) => {\n    const {\n        id,\n        min: propMin,\n        max: propMax,\n        value: propValue,\n        step = DEFAULT_STEP,\n        disabled = false,\n        noDefault = false,\n        onChange,\n        onKeyDown = noop,\n        bsSize = 'md',\n        unit,\n        inputAddon,\n        errorMessage,\n        warningMessage,\n        messageWhiteSpace = 'normal',\n        controls,\n        placeholder,\n        digitPrecision = DEFAULT_DIGIT_PRECISION,\n        className = '',\n        ...remainingProps\n    } = props;\n\n    const previousKeyRef = useRef<string>('');\n\n    const min = convertNonIntegerToDefault(propMin, DEFAULT_MIN);\n    const max = convertNonIntegerToDefault(propMax, DEFAULT_MAX);\n\n    const value = getValueFromProps(propValue, min, max, placeholder, noDefault);\n\n    // Define local state and define initial values\n    const [state, setState] = useState({\n        value,\n        enteredValue: value,\n        isValid: true,\n    });\n\n    // Update internal value whenever the value prop from outside changes\n    useAfterMount(() => {\n        setState({\n            value: getValueFromProps(propValue, min, max, placeholder, noDefault),\n            enteredValue: value,\n            isValid: true,\n        });\n    }, [propValue, min, max, placeholder, noDefault, value]);\n\n    const applyValue = (newValue: string | number) => {\n        if (newValue === '-' || newValue === '') {\n            setState({\n                value: newValue,\n                enteredValue: newValue,\n                isValid: true,\n            });\n            return;\n        }\n\n        const enteredValue = Number(newValue);\n        const isValid = !Number.isNaN(enteredValue) && enteredValue >= min && enteredValue <= max;\n        const newValidValue = clampNumber(enteredValue, min, max);\n\n        setState({\n            value: newValidValue,\n            enteredValue,\n            isValid,\n        });\n\n        // Only call back the caller for valid values\n        isValid && onChange && onChange(newValidValue);\n    };\n\n    const handleOnChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        applyValue(event.target.value);\n    };\n\n    // Prevent entering exponent to avoid side effects\n    // See https://bugzilla.mozilla.org/show_bug.cgi?id=1398528\n    // Also preventing letter inputs or multiple consecutive characters\n    // that is possible by Firefox and Safari\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        // Allow for key combination like \"ctrl + a\"\n        if (event.ctrlKey || event.altKey || event.metaKey) {\n            return;\n        }\n\n        // Check for multiple dots, commas or dashes (consecutive)\n        if (\n            isMultipleKeyInput('.', event, previousKeyRef) ||\n            isMultipleKeyInput(',', event, previousKeyRef) ||\n            isMultipleKeyInput('-', event, previousKeyRef) ||\n            isInvalidAfter(',', ['.', '-'], event, previousKeyRef) ||\n            isInvalidAfter('.', [',', '-'], event, previousKeyRef) ||\n            isInvalidAfter('-', ['.', ','], event, previousKeyRef) ||\n            event.key === 'Process' ||\n            event.key === 'Dead'\n        ) {\n            event.preventDefault();\n        }\n\n        // Filter out everything that is not a number\n        if (!validKeys.includes(event.key)) {\n            event.preventDefault();\n        }\n\n        previousKeyRef.current = event.key;\n\n        onKeyDown(event);\n    };\n\n    const handleBlur = () => {\n        // When the value is removed, keep the input empty but trigger the outside callback\n        // since the user has finished his input\n        const lastEnteredValue = state.enteredValue;\n        if (lastEnteredValue === '') {\n            onChange?.();\n            return;\n        }\n\n        // If there is no value defined and a placeholder is given or the default is not wanted,\n        // keep the input empty\n        if (!state.value && (noDefault || placeholder)) {\n            return;\n        }\n\n        // Otherwise, validate the input, round it according to digitPrecision,\n        // and clamp the value if the entered value exceeds the limitations\n        const convertedEnteredValue = convertNonIntegerToDefault(Number(lastEnteredValue), DEFAULT_VALUE);\n        const validNumber = clampNumber(Number(convertedEnteredValue.toFixed(digitPrecision)), min, max);\n        applyValue(validNumber);\n    };\n\n    const handleWheel = (event: React.WheelEvent<HTMLInputElement>) => {\n        const target = event.target;\n        if (target instanceof HTMLInputElement) {\n            target.blur();\n        }\n    };\n\n    const inputGroupClassNames = classNames(\n        'input-group',\n        bsSize === 'sm' && 'input-group-sm',\n        bsSize === 'lg' && 'input-group-lg'\n    );\n\n    const inputClassNames = classNames(\n        'form-control',\n        'no-controls',\n        bsSize === 'sm' && 'input-sm',\n        bsSize === 'lg' && 'input-lg',\n        className\n    );\n\n    const hasFeedback = errorMessage || warningMessage;\n\n    const input = (\n        <input\n            {...remainingProps}\n            id={id}\n            type='number'\n            step={step}\n            min={min}\n            max={max}\n            value={state.isValid ? state.value : state.enteredValue}\n            className={inputClassNames}\n            disabled={disabled}\n            onBlur={handleBlur}\n            // onChange={state.value ? handleOnChange : undefined}\n            onChange={handleOnChange}\n            onKeyDown={handleKeyDown}\n            ref={ref}\n            aria-label='number-input'\n            placeholder={placeholder}\n            onWheel={handleWheel}\n        />\n    );\n\n    return (\n        <div className={inputGroupClassNames}>\n            {inputAddon && (\n                <div className='input-group-addon'>\n                    <span className={inputAddon} />\n                </div>\n            )}\n            <div className='form-control-feedback-wrapper'>\n                {input}\n                {hasFeedback && (\n                    <>\n                        {errorMessage && <span className='form-control-feedback rioglyph rioglyph-error-sign' />}\n                        {warningMessage && <span className='form-control-feedback rioglyph rioglyph-warning-sign' />}\n                        <span className={`help-block white-space-${messageWhiteSpace}`}>\n                            <span>{errorMessage || warningMessage}</span>\n                        </span>\n                    </>\n                )}\n            </div>\n            {(unit || controls) && (\n                <div className={`input-group-addon ${disabled ? 'disabled pointer-events-none' : ''}`}>\n                    {unit && unit}\n                    {controls && controls}\n                </div>\n            )}\n        </div>\n    );\n});\n\nexport default NumberInput;\n"],"names":["DEFAULT_DIGIT_PRECISION","DEFAULT_VALUE","DEFAULT_STEP","DEFAULT_MIN","DEFAULT_MAX","validKeys","getValueFromProps","val","min","max","placeholder","noDefault","clampNumber","value","convertNonIntegerToDefault","fallback","isMultipleKeyInput","key","event","previousKeyRef","isInvalidAfter","possiblePreviousKeys","NumberInput","forwardRef","props","ref","id","propMin","propMax","propValue","step","disabled","onChange","onKeyDown","noop","bsSize","unit","inputAddon","errorMessage","warningMessage","messageWhiteSpace","controls","digitPrecision","className","remainingProps","useRef","state","setState","useState","useAfterMount","applyValue","newValue","enteredValue","isValid","newValidValue","handleOnChange","handleKeyDown","handleBlur","lastEnteredValue","convertedEnteredValue","validNumber","handleWheel","target","inputGroupClassNames","classNames","inputClassNames","hasFeedback","input","jsx","jsxs","Fragment"],"mappings":"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"}

package/components/onboarding/OnboardingTip.js

@@ -1,6 +1,6 @@
 import { jsx as e, jsxs as p, Fragment as L } from "react/jsx-runtime";
-import G from "classnames";
-import { noop as h } from "es-toolkit/compat";
+import { noop as G } from "es-toolkit/compat";
+import h from "../../utils/classNames.js";
 import x from "../overlay/OverlayTrigger.js";
 import E from "../tooltip/Tooltip.js";
 import { TEXT_ALIGNMENT as t } from "../../values/TextAlignment.js";
@@ -12,7 +12,7 @@ const T = (O) => {
     placement: m = o.BOTTOM,
     title: l,
     content: i,
-    onHide: s = h,
+    onHide: s = G,
     children: a,
     textAlignment: N = t.LEFT,
     useInDialog: _ = !1,
@@ -21,7 +21,7 @@ const T = (O) => {
     width: f,
     preventOverflow: g = !0,
     popperConfig: R
-  } = O, d = G(_ && "z-index-max", n && n), I = /* @__PURE__ */ e(
+  } = O, d = h(_ && "z-index-max", n && n), I = /* @__PURE__ */ e(
     E,
     {
       className: d,

package/components/onboarding/OnboardingTip.js.map

@@ -1 +1 @@
-{"version":3,"file":"OnboardingTip.js","sources":["../../../src/components/onboarding/OnboardingTip.tsx"],"sourcesContent":["import type { PropsWithChildren, ReactNode } from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/compat';\nimport type { Options } from '@popperjs/core';\n\nimport OverlayTrigger from '../overlay/OverlayTrigger';\nimport Tooltip, { type TooltipWidth } from '../tooltip/Tooltip';\nimport { TEXT_ALIGNMENT, type TextAlignment } from '../../values/TextAlignment';\nimport { PLACEMENT, type Placement } from '../../values/Placement';\n\nexport type OnboardingButton = {\n    text: string | React.ReactNode;\n    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    iconName?: string;\n};\n\ntype PopperConfig = Partial<Options>;\n\nexport type OnboardingTipProps = {\n    /**\n     * The ID of the DOM element.\n     */\n    id?: string;\n\n    /**\n     * Indicates whether the onboarding tip is shown.\n     *\n     * @default false\n     */\n    show: boolean;\n\n    /**\n     * Defines whether to show a close icon.\n     *\n     * @default true\n     */\n    showCloseIcon?: boolean;\n\n    /**\n     * Define how the text should be aligned.\n     *\n     * Possible values are:\n     *\n     * - `left`\n     * - `center`\n     * - `right`\n     *\n     * @default 'left'\n     */\n    textAlignment?: TextAlignment;\n\n    /**\n     * The tooltip's width.\n     *\n     * Possible values are:\n     *\n     * - `auto`\n     * - `100`\n     * - `150`\n     * - `200`\n     * - `250`\n     * - `300`\n     * - `350`\n     * - `400`\n     * - `450`\n     * - `500`\n     */\n    width?: TooltipWidth;\n\n    /**\n     * Callback function for when the component shall be hidden.\n     *\n     * @default () => {}\n     */\n    onHide: VoidFunction;\n\n    /**\n     * Changes the z-index.\n     *\n     * @default false\n     */\n    useInDialog?: boolean;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n\n    /**\n     * The title of the onboarding tip.\n     */\n    title?: string | ReactNode;\n\n    /**\n     * The content of the onboarding tip.\n     */\n    content?: string | ReactNode;\n\n    /**\n     * Prevents onboarding tips from being cut off horizontally at screen borders.\n     *\n     * @default true\n     */\n    preventOverflow?: boolean;\n\n    /**\n     * A Popper.js config object passed to the underlying popper instance.\n     */\n    popperConfig?: PopperConfig;\n\n    /**\n     * Define how the component should be placed.\n     *\n     * Possible values are:\n     *\n     * - `auto-start`\n     * - `auto`\n     * - `auto-end`\n     * - `top-start`\n     * - `top`\n     * - `top-end`\n     * - `right-start`\n     * - `right`\n     * - `right-end`\n     * - `bottom-start`\n     * - `bottom`\n     * - `bottom-end`\n     * - `left-start`\n     * - `left`\n     * - `left-end`\n     *\n     * @default 'bottom'\n     */\n    placement?: Placement;\n};\n\nconst OnboardingTip = (props: PropsWithChildren<OnboardingTipProps>) => {\n    const {\n        id,\n        show = false,\n        placement = PLACEMENT.BOTTOM,\n        title,\n        content,\n        onHide = noop,\n        children,\n        textAlignment = TEXT_ALIGNMENT.LEFT,\n        useInDialog = false,\n        showCloseIcon = true,\n        className = '',\n        width,\n        preventOverflow = true,\n        popperConfig,\n    } = props;\n\n    const tooltipWrapperClasses = classNames(useInDialog && 'z-index-max', className && className);\n\n    const overlay = (\n        <Tooltip\n            className={tooltipWrapperClasses}\n            tooltipStyle={Tooltip.STYLE_ONBOARDING}\n            id={id}\n            onClick={onHide}\n            width={width}\n            textAlignment={textAlignment}\n            allowOnTouch\n        >\n            <div className='display-flex'>\n                <div className='display-flex flex-column flex-1-1'>\n                    {title && <div className='tooltip-title'>{title}</div>}\n                    {content && <div className='tooltip-content'>{content}</div>}\n                </div>\n                {showCloseIcon && <span className='tooltip-close rioglyph rioglyph-remove' />}\n            </div>\n        </Tooltip>\n    );\n\n    const actualPopperConfig: PopperConfig = popperConfig || {\n        strategy: 'fixed',\n        modifiers: [\n            {\n                name: 'preventOverflow',\n                // Popper.js default is false but we enable it by default\n                options: { altAxis: preventOverflow },\n            },\n            // Use an arrow modifier, the arrow ref will be injected in OverlayTrigger with the right props\n            { name: 'arrow', options: {} },\n        ],\n    };\n\n    const trigger = (\n        <OverlayTrigger\n            placement={placement}\n            trigger='click'\n            overlay={overlay}\n            onToggle={onHide}\n            show={show}\n            rootClose={false}\n            popperConfig={actualPopperConfig}\n        >\n            {children}\n        </OverlayTrigger>\n    );\n\n    // biome-ignore lint/complexity/noUselessFragments: fragment required\n    return show ? trigger : <>{children}</>;\n};\n\nOnboardingTip.AUTO_START = PLACEMENT.AUTO_START;\nOnboardingTip.AUTO = PLACEMENT.AUTO;\nOnboardingTip.AUTO_END = PLACEMENT.AUTO_END;\nOnboardingTip.TOP_START = PLACEMENT.TOP_START;\nOnboardingTip.TOP = PLACEMENT.TOP;\nOnboardingTip.TOP_END = PLACEMENT.TOP_END;\nOnboardingTip.BOTTOM_START = PLACEMENT.BOTTOM_START;\nOnboardingTip.BOTTOM = PLACEMENT.BOTTOM;\nOnboardingTip.BOTTOM_END = PLACEMENT.BOTTOM_END;\nOnboardingTip.RIGHT_START = PLACEMENT.RIGHT_START;\nOnboardingTip.RIGHT = PLACEMENT.RIGHT;\nOnboardingTip.RIGHT_END = PLACEMENT.RIGHT_END;\nOnboardingTip.LEFT_START = PLACEMENT.LEFT_START;\nOnboardingTip.LEFT = PLACEMENT.LEFT;\nOnboardingTip.LEFT_END = PLACEMENT.LEFT_END;\n\nOnboardingTip.TEXT_ALIGNMENT_LEFT = TEXT_ALIGNMENT.LEFT;\nOnboardingTip.TEXT_ALIGNMENT_CENTER = TEXT_ALIGNMENT.CENTER;\nOnboardingTip.TEXT_ALIGNMENT_RIGHT = TEXT_ALIGNMENT.RIGHT;\n\nexport default OnboardingTip;\n"],"names":["OnboardingTip","props","id","show","placement","PLACEMENT","title","content","onHide","noop","children","textAlignment","TEXT_ALIGNMENT","useInDialog","showCloseIcon","className","width","preventOverflow","popperConfig","tooltipWrapperClasses","classNames","overlay","jsx","Tooltip","jsxs","OverlayTrigger","Fragment"],"mappings":";;;;;;;AAwIA,MAAMA,IAAgB,CAACC,MAAiD;AACpE,QAAM;AAAA,IACF,IAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,WAAAC,IAAYC,EAAU;AAAA,IACtB,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,QAAAC,IAASC;AAAA,IACT,UAAAC;AAAA,IACA,eAAAC,IAAgBC,EAAe;AAAA,IAC/B,aAAAC,IAAc;AAAA,IACd,eAAAC,IAAgB;AAAA,IAChB,WAAAC,IAAY;AAAA,IACZ,OAAAC;AAAA,IACA,iBAAAC,IAAkB;AAAA,IAClB,cAAAC;AAAA,EAAA,IACAjB,GAEEkB,IAAwBC,EAAWP,KAAe,eAAeE,KAAaA,CAAS,GAEvFM,IACF,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,WAAWJ;AAAA,MACX,cAAcI,EAAQ;AAAA,MACtB,IAAArB;AAAA,MACA,SAASM;AAAA,MACT,OAAAQ;AAAA,MACA,eAAAL;AAAA,MACA,cAAY;AAAA,MAEZ,UAAA,gBAAAa,EAAC,OAAA,EAAI,WAAU,gBACX,UAAA;AAAA,QAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,qCACV,UAAA;AAAA,UAAAlB,KAAS,gBAAAgB,EAAC,OAAA,EAAI,WAAU,iBAAiB,UAAAhB,GAAM;AAAA,UAC/CC,KAAW,gBAAAe,EAAC,OAAA,EAAI,WAAU,mBAAmB,UAAAf,EAAA,CAAQ;AAAA,QAAA,GAC1D;AAAA,QACCO,KAAiB,gBAAAQ,EAAC,QAAA,EAAK,WAAU,yCAAA,CAAyC;AAAA,MAAA,EAAA,CAC/E;AAAA,IAAA;AAAA,EAAA;AAgCR,SAAOnB,IAdH,gBAAAmB;AAAA,IAACG;AAAA,IAAA;AAAA,MACG,WAAArB;AAAA,MACA,SAAQ;AAAA,MACR,SAAAiB;AAAA,MACA,UAAUb;AAAA,MACV,MAAAL;AAAA,MACA,WAAW;AAAA,MACX,cArBiCe,KAAgB;AAAA,QACrD,UAAU;AAAA,QACV,WAAW;AAAA,UACP;AAAA,YACI,MAAM;AAAA;AAAA,YAEN,SAAS,EAAE,SAASD,EAAA;AAAA,UAAgB;AAAA;AAAA,UAGxC,EAAE,MAAM,SAAS,SAAS,CAAA,EAAC;AAAA,QAAE;AAAA,MACjC;AAAA,MAaK,UAAAP;AAAA,IAAA;AAAA,EAAA,IAKe,gBAAAY,EAAAI,GAAA,EAAG,UAAAhB,EAAA,CAAS;AACxC;AAEAV,EAAc,aAAaK,EAAU;AACrCL,EAAc,OAAOK,EAAU;AAC/BL,EAAc,WAAWK,EAAU;AACnCL,EAAc,YAAYK,EAAU;AACpCL,EAAc,MAAMK,EAAU;AAC9BL,EAAc,UAAUK,EAAU;AAClCL,EAAc,eAAeK,EAAU;AACvCL,EAAc,SAASK,EAAU;AACjCL,EAAc,aAAaK,EAAU;AACrCL,EAAc,cAAcK,EAAU;AACtCL,EAAc,QAAQK,EAAU;AAChCL,EAAc,YAAYK,EAAU;AACpCL,EAAc,aAAaK,EAAU;AACrCL,EAAc,OAAOK,EAAU;AAC/BL,EAAc,WAAWK,EAAU;AAEnCL,EAAc,sBAAsBY,EAAe;AACnDZ,EAAc,wBAAwBY,EAAe;AACrDZ,EAAc,uBAAuBY,EAAe;"}
+{"version":3,"file":"OnboardingTip.js","sources":["../../../src/components/onboarding/OnboardingTip.tsx"],"sourcesContent":["import type { PropsWithChildren, ReactNode } from 'react';\nimport { noop } from 'es-toolkit/compat';\nimport type { Options } from '@popperjs/core';\n\nimport classNames from '../../utils/classNames';\nimport OverlayTrigger from '../overlay/OverlayTrigger';\nimport Tooltip, { type TooltipWidth } from '../tooltip/Tooltip';\nimport { TEXT_ALIGNMENT, type TextAlignment } from '../../values/TextAlignment';\nimport { PLACEMENT, type Placement } from '../../values/Placement';\n\nexport type OnboardingButton = {\n    text: string | React.ReactNode;\n    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    iconName?: string;\n};\n\ntype PopperConfig = Partial<Options>;\n\nexport type OnboardingTipProps = {\n    /**\n     * The ID of the DOM element.\n     */\n    id?: string;\n\n    /**\n     * Indicates whether the onboarding tip is shown.\n     *\n     * @default false\n     */\n    show: boolean;\n\n    /**\n     * Defines whether to show a close icon.\n     *\n     * @default true\n     */\n    showCloseIcon?: boolean;\n\n    /**\n     * Define how the text should be aligned.\n     *\n     * Possible values are:\n     *\n     * - `left`\n     * - `center`\n     * - `right`\n     *\n     * @default 'left'\n     */\n    textAlignment?: TextAlignment;\n\n    /**\n     * The tooltip's width.\n     *\n     * Possible values are:\n     *\n     * - `auto`\n     * - `100`\n     * - `150`\n     * - `200`\n     * - `250`\n     * - `300`\n     * - `350`\n     * - `400`\n     * - `450`\n     * - `500`\n     */\n    width?: TooltipWidth;\n\n    /**\n     * Callback function for when the component shall be hidden.\n     *\n     * @default () => {}\n     */\n    onHide: VoidFunction;\n\n    /**\n     * Changes the z-index.\n     *\n     * @default false\n     */\n    useInDialog?: boolean;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n\n    /**\n     * The title of the onboarding tip.\n     */\n    title?: string | ReactNode;\n\n    /**\n     * The content of the onboarding tip.\n     */\n    content?: string | ReactNode;\n\n    /**\n     * Prevents onboarding tips from being cut off horizontally at screen borders.\n     *\n     * @default true\n     */\n    preventOverflow?: boolean;\n\n    /**\n     * A Popper.js config object passed to the underlying popper instance.\n     */\n    popperConfig?: PopperConfig;\n\n    /**\n     * Define how the component should be placed.\n     *\n     * Possible values are:\n     *\n     * - `auto-start`\n     * - `auto`\n     * - `auto-end`\n     * - `top-start`\n     * - `top`\n     * - `top-end`\n     * - `right-start`\n     * - `right`\n     * - `right-end`\n     * - `bottom-start`\n     * - `bottom`\n     * - `bottom-end`\n     * - `left-start`\n     * - `left`\n     * - `left-end`\n     *\n     * @default 'bottom'\n     */\n    placement?: Placement;\n};\n\nconst OnboardingTip = (props: PropsWithChildren<OnboardingTipProps>) => {\n    const {\n        id,\n        show = false,\n        placement = PLACEMENT.BOTTOM,\n        title,\n        content,\n        onHide = noop,\n        children,\n        textAlignment = TEXT_ALIGNMENT.LEFT,\n        useInDialog = false,\n        showCloseIcon = true,\n        className = '',\n        width,\n        preventOverflow = true,\n        popperConfig,\n    } = props;\n\n    const tooltipWrapperClasses = classNames(useInDialog && 'z-index-max', className && className);\n\n    const overlay = (\n        <Tooltip\n            className={tooltipWrapperClasses}\n            tooltipStyle={Tooltip.STYLE_ONBOARDING}\n            id={id}\n            onClick={onHide}\n            width={width}\n            textAlignment={textAlignment}\n            allowOnTouch\n        >\n            <div className='display-flex'>\n                <div className='display-flex flex-column flex-1-1'>\n                    {title && <div className='tooltip-title'>{title}</div>}\n                    {content && <div className='tooltip-content'>{content}</div>}\n                </div>\n                {showCloseIcon && <span className='tooltip-close rioglyph rioglyph-remove' />}\n            </div>\n        </Tooltip>\n    );\n\n    const actualPopperConfig: PopperConfig = popperConfig || {\n        strategy: 'fixed',\n        modifiers: [\n            {\n                name: 'preventOverflow',\n                // Popper.js default is false but we enable it by default\n                options: { altAxis: preventOverflow },\n            },\n            // Use an arrow modifier, the arrow ref will be injected in OverlayTrigger with the right props\n            { name: 'arrow', options: {} },\n        ],\n    };\n\n    const trigger = (\n        <OverlayTrigger\n            placement={placement}\n            trigger='click'\n            overlay={overlay}\n            onToggle={onHide}\n            show={show}\n            rootClose={false}\n            popperConfig={actualPopperConfig}\n        >\n            {children}\n        </OverlayTrigger>\n    );\n\n    // biome-ignore lint/complexity/noUselessFragments: fragment required\n    return show ? trigger : <>{children}</>;\n};\n\nOnboardingTip.AUTO_START = PLACEMENT.AUTO_START;\nOnboardingTip.AUTO = PLACEMENT.AUTO;\nOnboardingTip.AUTO_END = PLACEMENT.AUTO_END;\nOnboardingTip.TOP_START = PLACEMENT.TOP_START;\nOnboardingTip.TOP = PLACEMENT.TOP;\nOnboardingTip.TOP_END = PLACEMENT.TOP_END;\nOnboardingTip.BOTTOM_START = PLACEMENT.BOTTOM_START;\nOnboardingTip.BOTTOM = PLACEMENT.BOTTOM;\nOnboardingTip.BOTTOM_END = PLACEMENT.BOTTOM_END;\nOnboardingTip.RIGHT_START = PLACEMENT.RIGHT_START;\nOnboardingTip.RIGHT = PLACEMENT.RIGHT;\nOnboardingTip.RIGHT_END = PLACEMENT.RIGHT_END;\nOnboardingTip.LEFT_START = PLACEMENT.LEFT_START;\nOnboardingTip.LEFT = PLACEMENT.LEFT;\nOnboardingTip.LEFT_END = PLACEMENT.LEFT_END;\n\nOnboardingTip.TEXT_ALIGNMENT_LEFT = TEXT_ALIGNMENT.LEFT;\nOnboardingTip.TEXT_ALIGNMENT_CENTER = TEXT_ALIGNMENT.CENTER;\nOnboardingTip.TEXT_ALIGNMENT_RIGHT = TEXT_ALIGNMENT.RIGHT;\n\nexport default OnboardingTip;\n"],"names":["OnboardingTip","props","id","show","placement","PLACEMENT","title","content","onHide","noop","children","textAlignment","TEXT_ALIGNMENT","useInDialog","showCloseIcon","className","width","preventOverflow","popperConfig","tooltipWrapperClasses","classNames","overlay","jsx","Tooltip","jsxs","OverlayTrigger","Fragment"],"mappings":";;;;;;;AAwIA,MAAMA,IAAgB,CAACC,MAAiD;AACpE,QAAM;AAAA,IACF,IAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,WAAAC,IAAYC,EAAU;AAAA,IACtB,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,QAAAC,IAASC;AAAA,IACT,UAAAC;AAAA,IACA,eAAAC,IAAgBC,EAAe;AAAA,IAC/B,aAAAC,IAAc;AAAA,IACd,eAAAC,IAAgB;AAAA,IAChB,WAAAC,IAAY;AAAA,IACZ,OAAAC;AAAA,IACA,iBAAAC,IAAkB;AAAA,IAClB,cAAAC;AAAA,EAAA,IACAjB,GAEEkB,IAAwBC,EAAWP,KAAe,eAAeE,KAAaA,CAAS,GAEvFM,IACF,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,WAAWJ;AAAA,MACX,cAAcI,EAAQ;AAAA,MACtB,IAAArB;AAAA,MACA,SAASM;AAAA,MACT,OAAAQ;AAAA,MACA,eAAAL;AAAA,MACA,cAAY;AAAA,MAEZ,UAAA,gBAAAa,EAAC,OAAA,EAAI,WAAU,gBACX,UAAA;AAAA,QAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,qCACV,UAAA;AAAA,UAAAlB,KAAS,gBAAAgB,EAAC,OAAA,EAAI,WAAU,iBAAiB,UAAAhB,GAAM;AAAA,UAC/CC,KAAW,gBAAAe,EAAC,OAAA,EAAI,WAAU,mBAAmB,UAAAf,EAAA,CAAQ;AAAA,QAAA,GAC1D;AAAA,QACCO,KAAiB,gBAAAQ,EAAC,QAAA,EAAK,WAAU,yCAAA,CAAyC;AAAA,MAAA,EAAA,CAC/E;AAAA,IAAA;AAAA,EAAA;AAgCR,SAAOnB,IAdH,gBAAAmB;AAAA,IAACG;AAAA,IAAA;AAAA,MACG,WAAArB;AAAA,MACA,SAAQ;AAAA,MACR,SAAAiB;AAAA,MACA,UAAUb;AAAA,MACV,MAAAL;AAAA,MACA,WAAW;AAAA,MACX,cArBiCe,KAAgB;AAAA,QACrD,UAAU;AAAA,QACV,WAAW;AAAA,UACP;AAAA,YACI,MAAM;AAAA;AAAA,YAEN,SAAS,EAAE,SAASD,EAAA;AAAA,UAAgB;AAAA;AAAA,UAGxC,EAAE,MAAM,SAAS,SAAS,CAAA,EAAC;AAAA,QAAE;AAAA,MACjC;AAAA,MAaK,UAAAP;AAAA,IAAA;AAAA,EAAA,IAKe,gBAAAY,EAAAI,GAAA,EAAG,UAAAhB,EAAA,CAAS;AACxC;AAEAV,EAAc,aAAaK,EAAU;AACrCL,EAAc,OAAOK,EAAU;AAC/BL,EAAc,WAAWK,EAAU;AACnCL,EAAc,YAAYK,EAAU;AACpCL,EAAc,MAAMK,EAAU;AAC9BL,EAAc,UAAUK,EAAU;AAClCL,EAAc,eAAeK,EAAU;AACvCL,EAAc,SAASK,EAAU;AACjCL,EAAc,aAAaK,EAAU;AACrCL,EAAc,cAAcK,EAAU;AACtCL,EAAc,QAAQK,EAAU;AAChCL,EAAc,YAAYK,EAAU;AACpCL,EAAc,aAAaK,EAAU;AACrCL,EAAc,OAAOK,EAAU;AAC/BL,EAAc,WAAWK,EAAU;AAEnCL,EAAc,sBAAsBY,EAAe;AACnDZ,EAAc,wBAAwBY,EAAe;AACrDZ,EAAc,uBAAuBY,EAAe;"}

package/components/page/Page.js

@@ -1,5 +1,5 @@
 import { jsx as n } from "react/jsx-runtime";
-import p from "classnames";
+import p from "../../utils/classNames.js";
 const f = (o) => {
   const { className: e, width: r, orientation: s = "portrait", shadow: i = !0, border: d = !1, children: c } = o, h = p(
     "Page",

package/components/page/Page.js.map

@@ -1 +1 @@
-{"version":3,"file":"Page.js","sources":["../../../src/components/page/Page.tsx"],"sourcesContent":["import type React from 'react';\nimport type { PropsWithChildren } from 'react';\nimport classNames from 'classnames';\n\nexport type PageProps = {\n    /**\n     * Defines the width in pixel of the page. In landscape mode, the width is set as height.\n     * The component uses internally the aspect-ratio of a standard DIN A4 page.\n     * Please make sure the element does not get stretched when using flexbox.\n     */\n    width: number;\n\n    /**\n     * Defines the layout of the page\n     *\n     * @default 'portrait'\n     */\n    orientation?: 'portrait' | 'landscape';\n\n    /**\n     * Defines to use a pre-defined shadow style. May be disabled on white background.\n     *\n     * @default true\n     */\n    shadow?: boolean;\n\n    /**\n     * Defines to use a pre-defined border style. This may be used to render\n     * the page on a white background of as part of another element like a panel.\n     */\n    border?: boolean;\n\n    /**\n     * Additional classes to be set on the wrapper element\n     */\n    className?: string;\n};\n\nconst Page = (props: PropsWithChildren<PageProps>) => {\n    const { className, width, orientation = 'portrait', shadow = true, border = false, children } = props;\n\n    const wrapperClassNames = classNames(\n        'Page',\n        orientation,\n        shadow && 'shadow-hard',\n        border && 'border border-width-2',\n        className\n    );\n\n    const isPortrait = orientation === 'portrait';\n\n    const style: React.CSSProperties = {};\n\n    if (width && isPortrait) {\n        style.width = `${width}px`;\n    }\n\n    if (width && !isPortrait) {\n        style.height = `${width}px`;\n    }\n\n    return (\n        <div className={wrapperClassNames} style={style}>\n            {children}\n        </div>\n    );\n};\n\nexport default Page;\n"],"names":["Page","props","className","width","orientation","shadow","border","children","wrapperClassNames","classNames","isPortrait","style","jsx"],"mappings":";;AAsCA,MAAMA,IAAO,CAACC,MAAwC;AAClD,QAAM,EAAE,WAAAC,GAAW,OAAAC,GAAO,aAAAC,IAAc,YAAY,QAAAC,IAAS,IAAM,QAAAC,IAAS,IAAO,UAAAC,EAAA,IAAaN,GAE1FO,IAAoBC;AAAA,IACtB;AAAA,IACAL;AAAA,IACAC,KAAU;AAAA,IACVC,KAAU;AAAA,IACVJ;AAAA,EAAA,GAGEQ,IAAaN,MAAgB,YAE7BO,IAA6B,CAAA;AAEnC,SAAIR,KAASO,MACTC,EAAM,QAAQ,GAAGR,CAAK,OAGtBA,KAAS,CAACO,MACVC,EAAM,SAAS,GAAGR,CAAK,OAIvB,gBAAAS,EAAC,OAAA,EAAI,WAAWJ,GAAmB,OAAAG,GAC9B,UAAAJ,GACL;AAER;"}
+{"version":3,"file":"Page.js","sources":["../../../src/components/page/Page.tsx"],"sourcesContent":["import type React from 'react';\nimport type { PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type PageProps = {\n    /**\n     * Defines the width in pixel of the page. In landscape mode, the width is set as height.\n     * The component uses internally the aspect-ratio of a standard DIN A4 page.\n     * Please make sure the element does not get stretched when using flexbox.\n     */\n    width: number;\n\n    /**\n     * Defines the layout of the page\n     *\n     * @default 'portrait'\n     */\n    orientation?: 'portrait' | 'landscape';\n\n    /**\n     * Defines to use a pre-defined shadow style. May be disabled on white background.\n     *\n     * @default true\n     */\n    shadow?: boolean;\n\n    /**\n     * Defines to use a pre-defined border style. This may be used to render\n     * the page on a white background of as part of another element like a panel.\n     */\n    border?: boolean;\n\n    /**\n     * Additional classes to be set on the wrapper element\n     */\n    className?: string;\n};\n\nconst Page = (props: PropsWithChildren<PageProps>) => {\n    const { className, width, orientation = 'portrait', shadow = true, border = false, children } = props;\n\n    const wrapperClassNames = classNames(\n        'Page',\n        orientation,\n        shadow && 'shadow-hard',\n        border && 'border border-width-2',\n        className\n    );\n\n    const isPortrait = orientation === 'portrait';\n\n    const style: React.CSSProperties = {};\n\n    if (width && isPortrait) {\n        style.width = `${width}px`;\n    }\n\n    if (width && !isPortrait) {\n        style.height = `${width}px`;\n    }\n\n    return (\n        <div className={wrapperClassNames} style={style}>\n            {children}\n        </div>\n    );\n};\n\nexport default Page;\n"],"names":["Page","props","className","width","orientation","shadow","border","children","wrapperClassNames","classNames","isPortrait","style","jsx"],"mappings":";;AAuCA,MAAMA,IAAO,CAACC,MAAwC;AAClD,QAAM,EAAE,WAAAC,GAAW,OAAAC,GAAO,aAAAC,IAAc,YAAY,QAAAC,IAAS,IAAM,QAAAC,IAAS,IAAO,UAAAC,EAAA,IAAaN,GAE1FO,IAAoBC;AAAA,IACtB;AAAA,IACAL;AAAA,IACAC,KAAU;AAAA,IACVC,KAAU;AAAA,IACVJ;AAAA,EAAA,GAGEQ,IAAaN,MAAgB,YAE7BO,IAA6B,CAAA;AAEnC,SAAIR,KAASO,MACTC,EAAM,QAAQ,GAAGR,CAAK,OAGtBA,KAAS,CAACO,MACVC,EAAM,SAAS,GAAGR,CAAK,OAIvB,gBAAAS,EAAC,OAAA,EAAI,WAAWJ,GAAmB,OAAAG,GAC9B,UAAAJ,GACL;AAER;"}

package/components/pager/Pager.js

@@ -1,6 +1,6 @@
 import { jsxs as r, jsx as s } from "react/jsx-runtime";
 import { useState as I } from "react";
-import e from "classnames";
+import e from "../../utils/classNames.js";
 const i = {
   VARIANT_FULL: "full",
   VARIANT_COMPACT: "compact"

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';\nimport classNames from 'classnames';\n\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","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;"}

package/components/radiobutton/RadioButton.d.ts

@@ -1,5 +1,5 @@
 import { ChangeEventHandler, MouseEventHandler, PropsWithChildren, ReactNode, Ref, HTMLProps } from 'react';
-export type RadioButtonProps = Omit<HTMLProps<HTMLLabelElement>, 'label' | 'onClick'> & {
+export type RadioButtonProps = Omit<HTMLProps<HTMLLabelElement>, 'label' | 'onClick' | 'onChange'> & {
     /**
      * Define any rioglyph icon like "rioglyph-truck".
      */

package/components/radiobutton/RadioButton.js

@@ -1,7 +1,7 @@
 import { jsxs as N, jsx as n } from "react/jsx-runtime";
 import { useRef as O } from "react";
-import g from "classnames";
-import { noop as x } from "es-toolkit/compat";
+import { noop as g } from "es-toolkit/compat";
+import x from "../../utils/classNames.js";
 const S = (s) => {
   const { icon: o, iconSize: e, iconLabelPosition: a, text: i } = s, l = {
     width: `${e}px`,
@@ -19,8 +19,8 @@ const S = (s) => {
     iconLabelPosition: e = "vertical",
     iconSize: a = 16,
     label: i,
-    onClick: l = x,
-    onChange: m = x,
+    onClick: l = g,
+    onChange: m = g,
     checked: c,
     defaultChecked: I,
     disabled: u = !1,
@@ -53,7 +53,7 @@ const S = (s) => {
         b.checked = !b.checked;
       }
     }
-  }, C = i || r, B = g("radio", L && "radio-inline", h), E = g(y && "icon-right", h);
+  }, C = i || r, B = x("radio", L && "radio-inline", h), E = x(y && "icon-right", h);
   return /* @__PURE__ */ N(
     "label",
     {

package/components/radiobutton/RadioButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButton.js","sources":["../../../src/components/radiobutton/RadioButton.tsx"],"sourcesContent":["import {\n    type ChangeEventHandler,\n    type KeyboardEvent,\n    type MouseEventHandler,\n    type PropsWithChildren,\n    type ReactNode,\n    type Ref,\n    useRef,\n    type HTMLProps,\n} from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/compat';\n\ntype RadioButtonIconProps = {\n    icon: string;\n    iconSize: number;\n    iconLabelPosition: 'vertical' | 'horizontal';\n    text: string | ReactNode;\n};\n\nconst RadioButtonIcon = (props: RadioButtonIconProps) => {\n    const { icon, iconSize, iconLabelPosition, text } = props;\n\n    const iconStyles = {\n        width: `${iconSize}px`,\n        height: `${iconSize}px`,\n        fontSize: `${iconSize}px`,\n        lineHeight: `${iconSize}px`,\n    };\n\n    return (\n        <span className={`radio-icon label-${iconLabelPosition}`}>\n            <span className={`rioglyph ${icon}`} style={iconStyles} />\n            <span className='radio-label'>{text}</span>\n        </span>\n    );\n};\n\nexport type RadioButtonProps = Omit<HTMLProps<HTMLLabelElement>, 'label' | 'onClick'> & {\n    /**\n     * Define any rioglyph icon like \"rioglyph-truck\".\n     */\n    icon?: string;\n\n    /**\n     * The label position.\n     *\n     * Possible values are: `'horizontal'` or `'vertical'`.\n     *\n     * @default 'vertical'\n     */\n    iconLabelPosition?: 'vertical' | 'horizontal';\n\n    /**\n     * The icon Size in px.\n     *\n     * @default 16\n     */\n    iconSize?: number;\n\n    /**\n     * Defines the label text.\n     */\n    label?: string | ReactNode;\n\n    /**\n     * Callback function that is invoked when the radio button is clicked.\n     *\n     * @default () => {}\n     */\n    onClick?: MouseEventHandler<{ value: string | string[] | number }>;\n\n    /**\n     * Callback function that is invoked when the radio button is toggled and the state should change (for controlled\n     * usage).\n     *\n     * @default () => {}\n     */\n    onChange?: ChangeEventHandler;\n\n    /**\n     * Defines whether the radio is checked (for controlled usage).\n     */\n    checked?: boolean;\n\n    /**\n     * Defines whether the radio is initially checked (state can be changed on click).\n     */\n    defaultChecked?: boolean;\n\n    /**\n     * Defines whether the checkbox is disabled.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Additional classes to be set on the input element.\n     */\n    className?: string;\n\n    /**\n     * Defines whether the radio button is applying an inline style.\n     *\n     * Use this in combination with other radio buttons.\n     *\n     * @default false\n     */\n    inline?: boolean;\n\n    /**\n     * Displays the icon on the right side of the text.\n     *\n     * @default false\n     */\n    right?: boolean;\n\n    /**\n     * Allows for rendering a completely different layout with or without a radio tick.\n     *\n     * @default false\n     */\n    custom?: boolean;\n\n    /**\n     * Name to be given to the input element.\n     */\n    name?: string;\n\n    /**\n     * The value attribute is a string containing the radio button's value but __it is never shown to the user__.\n     *\n     * It serves a special purpose for inputs of type radio: when a form is submitted, only radio buttons which are\n     * currently checked are submitted, and the reported value is the value of the value attribute.\n     *\n     * If the value is not otherwise specified, it is the string on by default.\n     *\n     * This is useful when using native `FormData` when submitting a form to get the selected radio button value.\n     */\n    value?: string;\n\n    /**\n     * Number of the index used for keyboard support.\n     *\n     * An index of 0 means that the element should be focusable in sequential keyboard navigation, but its order is\n     * defined by the document's source order. To disable the focus set the value to -1.\n     *\n     * A positive value means the element should be focusable in sequential keyboard navigation,\n     * with its order defined by the value of the number.\n     *\n     * @default 0\n     */\n    tabIndex?: number;\n\n    /**\n     * Ref which is added to the input element.\n     */\n    inputRef?: Ref<HTMLInputElement>;\n};\n\nconst RadioButton = (props: PropsWithChildren<RadioButtonProps>) => {\n    const {\n        icon = '',\n        iconLabelPosition = 'vertical',\n        iconSize = 16,\n        label,\n        onClick = noop,\n        onChange = noop,\n        checked,\n        defaultChecked,\n        disabled = false,\n        className,\n        inline = false,\n        right = false,\n        custom = false,\n        name,\n        value,\n        tabIndex = 0,\n        inputRef,\n        children,\n        ...remainingProps\n    } = props;\n\n    const isControlled = checked !== null && checked !== undefined;\n\n    const labelRef = useRef<HTMLLabelElement>(null);\n\n    const handleToggleKeyDown = (event: KeyboardEvent<HTMLLabelElement>) => {\n        switch (event.key) {\n            case ' ': // toggle on space\n            case 'Enter': // open on enter\n                toggle(event);\n                break;\n\n            default:\n                break;\n        }\n    };\n\n    const toggle = (event: KeyboardEvent<HTMLLabelElement>) => {\n        event.preventDefault();\n\n        if (disabled) {\n            return;\n        }\n\n        // Controlled case - uses \"onChange()\" instead of \"onClick()\" callback\n        if (isControlled) {\n            onChange(event);\n            return;\n        }\n\n        // Uncontrolled case - set the input checked or unchecked\n        if (labelRef.current) {\n            const checkbox = labelRef.current.firstChild as HTMLInputElement;\n            checkbox.checked = !checkbox.checked;\n        }\n    };\n\n    const text = label || children;\n\n    const labelClassnames = classNames('radio', inline && 'radio-inline', className);\n    const inputClassnames = classNames(right && 'icon-right', className);\n\n    const renderCustomIcon = !!icon;\n    const renderCustomContent = custom && children;\n    const renderDefault = !icon && !custom;\n\n    return (\n        <label\n            {...remainingProps}\n            className={labelClassnames}\n            tabIndex={tabIndex}\n            onKeyDown={handleToggleKeyDown}\n            ref={labelRef}\n        >\n            <input\n                type='radio'\n                defaultChecked={defaultChecked}\n                checked={checked}\n                disabled={disabled}\n                className={inputClassnames}\n                ref={inputRef}\n                onClick={onClick}\n                // Only wire onChange for controlled usage; uncontrolled relies on native state + onClick.\n                onChange={isControlled ? onChange : undefined}\n                name={name}\n                value={value}\n            />\n            {renderCustomIcon && (\n                <RadioButtonIcon icon={icon} iconSize={iconSize} iconLabelPosition={iconLabelPosition} text={text} />\n            )}\n            {renderDefault && (\n                <span className='radio-text'>\n                    <span>{text}</span>\n                </span>\n            )}\n            {renderCustomContent && children}\n        </label>\n    );\n};\n\nRadioButton.ICON_LABEL_VERTICAL = 'vertical';\nRadioButton.ICON_LABEL_HORIZONTAL = 'horizontal';\n\nexport default RadioButton;\n"],"names":["RadioButtonIcon","props","icon","iconSize","iconLabelPosition","text","iconStyles","jsxs","jsx","RadioButton","label","onClick","noop","onChange","checked","defaultChecked","disabled","className","inline","right","custom","name","value","tabIndex","inputRef","children","remainingProps","isControlled","labelRef","useRef","handleToggleKeyDown","event","toggle","checkbox","labelClassnames","classNames","inputClassnames"],"mappings":"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"}
+{"version":3,"file":"RadioButton.js","sources":["../../../src/components/radiobutton/RadioButton.tsx"],"sourcesContent":["import {\n    type ChangeEvent,\n    type ChangeEventHandler,\n    type KeyboardEvent,\n    type MouseEventHandler,\n    type PropsWithChildren,\n    type ReactNode,\n    type Ref,\n    useRef,\n    type HTMLProps,\n} from 'react';\nimport { noop } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\n\ntype RadioButtonIconProps = {\n    icon: string;\n    iconSize: number;\n    iconLabelPosition: 'vertical' | 'horizontal';\n    text: string | ReactNode;\n};\n\nconst RadioButtonIcon = (props: RadioButtonIconProps) => {\n    const { icon, iconSize, iconLabelPosition, text } = props;\n\n    const iconStyles = {\n        width: `${iconSize}px`,\n        height: `${iconSize}px`,\n        fontSize: `${iconSize}px`,\n        lineHeight: `${iconSize}px`,\n    };\n\n    return (\n        <span className={`radio-icon label-${iconLabelPosition}`}>\n            <span className={`rioglyph ${icon}`} style={iconStyles} />\n            <span className='radio-label'>{text}</span>\n        </span>\n    );\n};\n\nexport type RadioButtonProps = Omit<HTMLProps<HTMLLabelElement>, 'label' | 'onClick' | 'onChange'> & {\n    /**\n     * Define any rioglyph icon like \"rioglyph-truck\".\n     */\n    icon?: string;\n\n    /**\n     * The label position.\n     *\n     * Possible values are: `'horizontal'` or `'vertical'`.\n     *\n     * @default 'vertical'\n     */\n    iconLabelPosition?: 'vertical' | 'horizontal';\n\n    /**\n     * The icon Size in px.\n     *\n     * @default 16\n     */\n    iconSize?: number;\n\n    /**\n     * Defines the label text.\n     */\n    label?: string | ReactNode;\n\n    /**\n     * Callback function that is invoked when the radio button is clicked.\n     *\n     * @default () => {}\n     */\n    onClick?: MouseEventHandler<{ value: string | string[] | number }>;\n\n    /**\n     * Callback function that is invoked when the radio button is toggled and the state should change (for controlled\n     * usage).\n     *\n     * @default () => {}\n     */\n    onChange?: ChangeEventHandler;\n\n    /**\n     * Defines whether the radio is checked (for controlled usage).\n     */\n    checked?: boolean;\n\n    /**\n     * Defines whether the radio is initially checked (state can be changed on click).\n     */\n    defaultChecked?: boolean;\n\n    /**\n     * Defines whether the checkbox is disabled.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Additional classes to be set on the input element.\n     */\n    className?: string;\n\n    /**\n     * Defines whether the radio button is applying an inline style.\n     *\n     * Use this in combination with other radio buttons.\n     *\n     * @default false\n     */\n    inline?: boolean;\n\n    /**\n     * Displays the icon on the right side of the text.\n     *\n     * @default false\n     */\n    right?: boolean;\n\n    /**\n     * Allows for rendering a completely different layout with or without a radio tick.\n     *\n     * @default false\n     */\n    custom?: boolean;\n\n    /**\n     * Name to be given to the input element.\n     */\n    name?: string;\n\n    /**\n     * The value attribute is a string containing the radio button's value but __it is never shown to the user__.\n     *\n     * It serves a special purpose for inputs of type radio: when a form is submitted, only radio buttons which are\n     * currently checked are submitted, and the reported value is the value of the value attribute.\n     *\n     * If the value is not otherwise specified, it is the string on by default.\n     *\n     * This is useful when using native `FormData` when submitting a form to get the selected radio button value.\n     */\n    value?: string;\n\n    /**\n     * Number of the index used for keyboard support.\n     *\n     * An index of 0 means that the element should be focusable in sequential keyboard navigation, but its order is\n     * defined by the document's source order. To disable the focus set the value to -1.\n     *\n     * A positive value means the element should be focusable in sequential keyboard navigation,\n     * with its order defined by the value of the number.\n     *\n     * @default 0\n     */\n    tabIndex?: number;\n\n    /**\n     * Ref which is added to the input element.\n     */\n    inputRef?: Ref<HTMLInputElement>;\n};\n\nconst RadioButton = (props: PropsWithChildren<RadioButtonProps>) => {\n    const {\n        icon = '',\n        iconLabelPosition = 'vertical',\n        iconSize = 16,\n        label,\n        onClick = noop,\n        onChange = noop,\n        checked,\n        defaultChecked,\n        disabled = false,\n        className,\n        inline = false,\n        right = false,\n        custom = false,\n        name,\n        value,\n        tabIndex = 0,\n        inputRef,\n        children,\n        ...remainingProps\n    } = props;\n\n    const isControlled = checked !== null && checked !== undefined;\n\n    const labelRef = useRef<HTMLLabelElement>(null);\n\n    const handleToggleKeyDown = (event: KeyboardEvent<HTMLLabelElement>) => {\n        switch (event.key) {\n            case ' ': // toggle on space\n            case 'Enter': // open on enter\n                toggle(event);\n                break;\n\n            default:\n                break;\n        }\n    };\n\n    const toggle = (event: KeyboardEvent<HTMLLabelElement>) => {\n        event.preventDefault();\n\n        if (disabled) {\n            return;\n        }\n\n        // Controlled case - uses \"onChange()\" instead of \"onClick()\" callback\n        if (isControlled) {\n            onChange(event as unknown as ChangeEvent<HTMLInputElement>);\n            return;\n        }\n\n        // Uncontrolled case - set the input checked or unchecked\n        if (labelRef.current) {\n            const checkbox = labelRef.current.firstChild as HTMLInputElement;\n            checkbox.checked = !checkbox.checked;\n        }\n    };\n\n    const text = label || children;\n\n    const labelClassnames = classNames('radio', inline && 'radio-inline', className);\n    const inputClassnames = classNames(right && 'icon-right', className);\n\n    const renderCustomIcon = !!icon;\n    const renderCustomContent = custom && children;\n    const renderDefault = !icon && !custom;\n\n    return (\n        <label\n            {...remainingProps}\n            className={labelClassnames}\n            tabIndex={tabIndex}\n            onKeyDown={handleToggleKeyDown}\n            ref={labelRef}\n        >\n            <input\n                type='radio'\n                defaultChecked={defaultChecked}\n                checked={checked}\n                disabled={disabled}\n                className={inputClassnames}\n                ref={inputRef}\n                onClick={onClick}\n                // Only wire onChange for controlled usage; uncontrolled relies on native state + onClick.\n                onChange={isControlled ? onChange : undefined}\n                name={name}\n                value={value}\n            />\n            {renderCustomIcon && (\n                <RadioButtonIcon icon={icon} iconSize={iconSize} iconLabelPosition={iconLabelPosition} text={text} />\n            )}\n            {renderDefault && (\n                <span className='radio-text'>\n                    <span>{text}</span>\n                </span>\n            )}\n            {renderCustomContent && children}\n        </label>\n    );\n};\n\nRadioButton.ICON_LABEL_VERTICAL = 'vertical';\nRadioButton.ICON_LABEL_HORIZONTAL = 'horizontal';\n\nexport default RadioButton;\n"],"names":["RadioButtonIcon","props","icon","iconSize","iconLabelPosition","text","iconStyles","jsxs","jsx","RadioButton","label","onClick","noop","onChange","checked","defaultChecked","disabled","className","inline","right","custom","name","value","tabIndex","inputRef","children","remainingProps","isControlled","labelRef","useRef","handleToggleKeyDown","event","toggle","checkbox","labelClassnames","classNames","inputClassnames"],"mappings":"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"}