@heliux-org/design-system-core 0.0.49 → 0.0.50

package/dist/mocked_classnames_esm/core/src/components/new/utils/color/ColorValue.d.ts

@@ -0,0 +1,180 @@
+/**
+ * A color defined by Red, Green, and Blue
+ */
+export type RgbColor = {
+    /** 0-255 */
+    r: number;
+    /** 0-255 */
+    g: number;
+    /** 0-255 */
+    b: number;
+    /** 0-1 */
+    a?: number;
+};
+/**
+ * A color defined by Hue, Saturation, and Lightness.
+ */
+export type HslColor = {
+    /** 0-360 */
+    h: number;
+    /** 0-100 */
+    s: number;
+    /** 0-100 */
+    l: number;
+    /** 0-1 */
+    a?: number;
+};
+/**
+ * A color defined by Hue, Saturation, and Value
+ */
+export type HsvColor = {
+    /** 0-360 */
+    h: number;
+    /** 0-100 */
+    s: number;
+    /** 0-100 */
+    v: number;
+    /** 0-1 */
+    a?: number;
+};
+/**
+ * All supported color specifications.
+ */
+export type ColorType = string | RgbColor | HslColor | HsvColor;
+/**
+ * isRgbValue type guard.
+ */
+export declare const isRgbColor: (value: ColorType) => value is RgbColor;
+/**
+ * isHslValue type guard.
+ */
+export declare const isHslColor: (value: ColorType) => value is HslColor;
+/**
+ * isHsvValue type guard.
+ */
+export declare const isHsvColor: (value: ColorType) => value is HsvColor;
+/**
+ * An immutable integer representation of a color.
+ *
+ * Colors are stored as 4 components: Red, Blue, Green, and Transparency (0=fully opaque). Each is an 8-bit integer between 0-255.
+ * ColorValue uses `0xTTBBGGRR` (red in the low byte. 0==fully opaque in high byte) internally, but it also provides methods
+ * to return colors in popular web formats.
+ *
+ * The `create` method accepts any ColorType format.
+ *
+ * @public
+ */
+export declare class ColorValue {
+    private readonly _tbgr;
+    /** hue value provided by user */
+    private readonly _hue?;
+    private constructor();
+    /**
+     * Create a new ColorValue.
+     * @param val value to use.
+     *
+     * If a string, must be in one of the following forms:
+     * *"rgb(255,0,0)"*
+     * *"rgba(255,0,0,.2)"*
+     * *"rgb(100%,0%,0%)"*
+     * *"hsl(120,50%,50%)"*
+     * *"#rrggbb"*
+     */
+    static create(val?: ColorType): ColorValue;
+    /**
+     * Convert this ColorValue to an unsigned 32 bit integer representing the 0xTTBBGGRR value
+     */
+    toTbgr(): number;
+    /**
+     * Create a ColorValue from its 0xTTBBGGRR representation.
+     */
+    static fromTbgr(tbgr: number): ColorValue;
+    /**
+     * Create a ColorValue from Red, Green, Blue, Transparency values. All inputs should be integers between 0-255.
+     */
+    private static fromRgbt;
+    /**
+     * Compute the 0xTTBBGGRR value corresponding to the specified Red, Green, Blue, Transparency components.
+     *  All inputs should be integers between 0-255.
+     */
+    private static computeTbgrFromComponents;
+    /**
+     * Create a ColorValue from a string representation. The following representations are supported:
+     * *"rgb(255,0,0)"*
+     * *"rgba(255,0,0,.2)"*
+     * *"rgb(100%,0%,0%)"*
+     * *"hsl(120,50%,50%)"*
+     * *"#rrggbb"*
+     * NOTE: If defaultColorIfNotParsed is not defined and string is invalid then error is thrown.
+     * This allows component builders to know if they received bad input from user.
+     */
+    static fromString(val: string, defaultColorIfNotParsed?: ColorValue): ColorValue;
+    /** Create a ColorValue from hue, saturation, lightness values.  */
+    private static fromHSL;
+    /** Create a ColorValue from an RgbColor */
+    private static fromRGB;
+    /**
+     * Create a ColorValue from an HsvColor
+     */
+    private static fromHSV;
+    /**
+     * Compute the 0xTTBBGGRR value corresponding to a string representation of a color. The following representations are supported:
+     * *"rgb(255,0,0)"*
+     * *"rgba(255,0,0,.2)"*
+     * *"rgb(100%,0%,0%)"*
+     * *"hsl(120,50%,50%)"*
+     * *"#rrggbb"*
+     */
+    private static computeTbgrFromString;
+    /**
+     * Get the r,g,b,t values encoded in an 0xTTBBGGRR value. Values will be integers between 0-255.
+     */
+    private static getColors;
+    /**
+     * Get the RGB value of the 0xTTBBGGRR color as a number in 0xRRGGBB or 0xRRGGBBAA format
+     */
+    private getRgb;
+    /**
+     * Get the alpha value for this ColorDef. Will be between 0-255
+     */
+    getAlpha(): number;
+    /**
+     * Extract the alpha value from a 0xTTBBGGRR color.
+     */
+    private static getAlpha;
+    /**
+     * Convert this ColorValue to a string in the form "#rrggbb" or "#rrggbbaa" where values are hex digits of the respective colors
+     */
+    toHexString(includeAlpha?: boolean): string;
+    /**
+     * Compute the 0xTTBBGGRR color corresponding to the specified hue, saturation, lightness values.
+     */
+    private static computeTbgrFromHSL;
+    /**
+     * Return HslColor from this ColorValue
+     */
+    toHslColor(): HslColor;
+    /** Create an HslColor from this ColorValue */
+    private static toHsl;
+    /**
+     * Create an RgbColor from this ColorValue
+     */
+    toRgbColor(): RgbColor;
+    /**
+     * Return HsvColor from this ColorValue
+     */
+    toHsvColor(): HsvColor;
+    /**
+     * Create an HsvColor from this ColorValue
+     */
+    private static toHsv;
+    /** True if the value of this ColorValue is the same as another ColorValue. */
+    equals(other: ColorValue): boolean;
+    static getFormattedColorNumber(value: number, precision?: number): string;
+    /** Convert the 0xTTBBGGRR color to a string of the form "rgba(r,g,b,a)" where the color components are specified in decimal and the alpha component is a fraction. */
+    toRgbString(includeAlpha?: boolean): string;
+    /** Convert this ColorValue to a string in the form "hsl(h,s,l) or hsla(h,s,l,a)" - i.e hsl(120,50%,50%). */
+    toHslString(includeAlpha?: boolean): string;
+    /** Convert this ColorValue to a string in the form "hsv(h,s,v) or hsva(h,s,v,a)" - i.e hsv(120,50%,50%). */
+    toHsvString(includeAlpha?: boolean): string;
+}

package/dist/mocked_classnames_esm/core/src/components/new/utils/color/index.d.ts

@@ -0,0 +1 @@
+export * from "./ColorValue";

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/AutoclearingHiddenLiveRegion.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Visually-hidden polite live region that automatically clears itself after 5 seconds.
+ *
+ * Should only be used for small updates and user-initiated actions (e.g. when _updating_ the selection),
+ * otherwise it could cause too many announcements every time an instance of this component is mounted.
+ *
+ * @private
+ */
+export declare const AutoclearingHiddenLiveRegion: ({ text }: {
+    text?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/Box.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Polymorphic component that renders a div element by default.
+ * Intended to be used as a base for other components.
+ * @private
+ */
+export declare const Box: import("..").PolymorphicForwardRefComponent<"div", {}>;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/ButtonBase.d.ts

@@ -0,0 +1,14 @@
+import type { PolymorphicForwardRefComponent } from "../props";
+export declare const ButtonBase: PolymorphicForwardRefComponent<"button", ButtonBaseProps>;
+type ButtonBaseProps = {
+    /**
+     * Custom `disabled` prop that keeps the button focusable, prevents
+     * clicks, applied disabled styling, and adds `aria-disabled`.
+     */
+    disabled?: boolean;
+    /**
+     * Built-in html `disabled` attribute
+     */
+    htmlDisabled?: boolean;
+};
+export {};

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/FocusTrap.d.ts

@@ -0,0 +1,11 @@
+export type FocusTrapProps = {
+    /**
+     * A single child element to trap focus in.
+     */
+    children: JSX.Element;
+};
+/**
+ * Trap focus within child container.
+ * Used for modals and dialogs.
+ */
+export declare const FocusTrap: (props: FocusTrapProps) => import("react/jsx-runtime").JSX.Element;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/InputContainer.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+import type { PolymorphicForwardRefComponent } from "../props";
+export type InputContainerProps = {
+    label?: React.ReactNode;
+    disabled?: boolean;
+    required?: boolean;
+    status?: "positive" | "warning" | "negative";
+    message?: React.ReactNode;
+    icon?: JSX.Element;
+    isLabelInline?: boolean;
+    statusMessage?: React.ReactNode;
+    inputId?: string;
+    labelId?: string;
+};
+/**
+ * Input container to wrap inputs with label, and add optional message and icon.
+ * @private
+ */
+export declare const InputContainer: PolymorphicForwardRefComponent<"div", InputContainerProps>;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/InputFlexContainer.d.ts

@@ -0,0 +1,30 @@
+import React from "react";
+import type { PolymorphicForwardRefComponent } from "../props";
+import type { IconButtonProps } from "../../Buttons/IconButton";
+export type InputFlexContainerProps = {
+    isDisabled?: boolean;
+    status?: "positive" | "warning" | "negative";
+    size?: "small" | "large";
+};
+/**
+ * Utility component for input container with display flex abilities.
+ * @private
+ */
+export declare const InputFlexContainer: PolymorphicForwardRefComponent<"div", InputFlexContainerProps>;
+/**
+ * Button inside InputFlexContainer that collapses the padding between the button and the input/textarea.
+ * @private
+ */
+export declare const InputFlexContainerButton: PolymorphicForwardRefComponent<"button", Omit<IconButtonProps, "styleType"> & {
+    /**
+     * Style of the button.
+     * Use 'borderless' to hide outline.
+     * @default 'borderless'
+     */
+    styleType?: IconButtonProps["styleType"];
+}>;
+/**
+ * Icon inside InputFlexContainer that collapses the padding between the icon and the input/textarea.
+ * @private
+ */
+export declare const InputFlexContainerIcon: React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/InputWithIcon.d.ts

@@ -0,0 +1,2 @@
+/** @private */
+export declare const InputWithIcon: import("..").PolymorphicForwardRefComponent<"div", {}>;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/LineClamp.d.ts

@@ -0,0 +1,5 @@
+import type { PolymorphicForwardRefComponent } from "../props";
+/** @private */
+export declare const LineClamp: PolymorphicForwardRefComponent<"div", {
+    lines?: number;
+}>;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/MiddleTextTruncation.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import type { CommonProps } from '../props.js';
+export type MiddleTextTruncationProps = {
+    /**
+     * Text to truncate.
+     */
+    text: string;
+    /**
+     * Number of characters to leave at the end.
+     * @default 6
+     */
+    endCharsCount?: number;
+    /**
+     * Custom renderer for the truncated text.
+     */
+    textRenderer?: (truncatedText: string, originalText: string) => React.ReactNode;
+} & CommonProps;
+/**
+ * Truncates text with the ellipsis in the middle,
+ * leaving defined number of chars at the end.
+ * @example
+ * <MiddleTextTruncation text='ThisIsMyVeryLongFileName.dgn' />
+ * @example
+ * <MiddleTextTruncation text='ThisIsMyVeryLongFileName.dgn' endCharsCount={10} />
+ * @example
+ * <MiddleTextTruncation
+ *   text='ThisIsMyVeryLongFileName.dgn'
+ *   textRenderer={React.useCallback(
+ *     (truncatedText) => <b>{truncatedText}</b>,
+ *     []
+ *   )}
+ * />
+ */
+export declare const MiddleTextTruncation: (props: MiddleTextTruncationProps) => import("react/jsx-runtime").JSX.Element;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/Portal.d.ts

@@ -0,0 +1,31 @@
+import * as React from "react";
+export type PortalProps = {
+    /**
+     * Where should the element be portaled to?
+     *
+     * If true, it will portal into nearest ThemeContext.portalContainer.
+     *
+     * If false, it will not be portaled.
+     *
+     * Otherwise, it will portal to the element passed to `to`.
+     *
+     * If `to`/`to()` === `null`/`undefined`, the default behavior will be used (i.e. as if `portal` is not passed).
+     *
+     * @default true
+     */
+    portal?: boolean | {
+        to: HTMLElement | null | undefined | (() => HTMLElement | null | undefined);
+    };
+};
+/**
+ * Helper component that portals children according to the following conditions:
+ *   - renders null on server
+ *   - if `portal` is set to true, renders into nearest ThemeContext.portalContainer
+ *   - if `portal` is set to false, renders as-is without portal
+ *   - otherwise renders into `portal.to` (can be an element or a function)
+ *     - If `to`/`to()` === `null`/`undefined`, the default behavior will be used (i.e. as if `portal` is not passed).
+ *     - E.g. `portal={{ to: () => document.querySelector('.may-not-exist') }}`.
+ *
+ * @private
+ */
+export declare const Portal: React.FC<PortalProps>;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/Resizer.d.ts

@@ -0,0 +1,37 @@
+import * as React from "react";
+export type ResizerProps = {
+    /**
+     * Ref of the element that is being resized.
+     */
+    elementRef: React.RefObject<HTMLElement>;
+    /**
+     * Ref of the container element in order to avoid resizing past container boundaries.
+     * If not passed, viewport will be used.
+     */
+    containerRef?: React.RefObject<HTMLElement>;
+    /**
+     * Callback that is being called on resize start.
+     * Useful to set state, style, or other properties when resizing is started.
+     */
+    onResizeStart?: () => void;
+    /**
+     * Callback that is being called on resize end.
+     * Useful to preserve state if element is being closed.
+     */
+    onResizeEnd?: (style: React.CSSProperties) => void;
+};
+/**
+ * Component that allows to resize parent element.
+ * Parent must have `position: relative`.
+ *
+ * Ideally should be used within a shadow root.
+ * @private
+ * @example
+ * const ref = React.useRef<HTMLDivElement>(null);
+ * return (
+ *   <div ref={ref} style={{ position: 'relative' }}>
+ *     <Resizer elementRef={ref} />
+ *   </div>
+ * );
+ */
+export declare const Resizer: (props: ResizerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/ShadowRoot.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+/**
+ * Wrapper around `<template>` element that attaches shadow root to its parent
+ * and moves its children into the shadow root.
+ *
+ * @private
+ */
+export declare const ShadowRoot: ({ children, css, }: {
+    children: React.ReactNode;
+    css?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/VirtualScroll.d.ts

@@ -0,0 +1,75 @@
+import * as React from 'react';
+export type VirtualScrollProps = {
+    /**
+     * Length of the items to virtualize.
+     */
+    itemsLength: number;
+    /**
+     * Single item render function, which gives index of the item (0 based) in the data array
+     * and expects to get the JSX of that element to render.
+     * Recommended to memoize the reference of the function.
+     */
+    itemRenderer: (index: number) => JSX.Element;
+    /**
+     * Number of items to be rendered at the start and the end.
+     * Not recommended to go lower than the visible items in viewport.
+     * @default 10
+     */
+    bufferSize?: number;
+    /**
+     * Index of the first element on initial render.
+     */
+    scrollToIndex?: number;
+} & React.ComponentPropsWithRef<'div'>;
+/**
+ * `VirtualScroll` component is used to render a huge amount of items in the DOM. It renders only the ones which are visible
+ * and the amount provided through `bufferSize` prop at the start and the end. Can be used inside other components like `Table`.
+ *
+ * It has two wrapper elements, so DOM will be changed. One is used for setting full expected height in the scrollable container
+ * and other is for transformation (translateY) to show the correct part of the list.
+ *
+ * Currently it works only with the direct vertically scrollable parent element. It does not work with body scroll.
+ * It supports only static (same) height rows virtualization. Expect some issues, if list consists of different height elements.
+ * @example
+ * const itemRenderer = React.useCallback(() => (
+ *  <div key={index}>
+ *    This is my item #{index}
+ *  </div>
+ * ), [])
+ * <VirtualScroll
+ *  itemsLength={1000}
+ *  itemRenderer={itemRenderer}
+ * />
+ * @private
+ */
+export declare const VirtualScroll: React.ForwardRefExoticComponent<Omit<VirtualScrollProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * `useVirtualization` is used for efficiently rendering only the visible rows from a large list.
+ * It returns `outerProps` and `innerProps`, which need to be applied on 2 container elements and `visibleChildren` which is a list of virtualized items.
+ * @example
+ * const itemRenderer = React.useCallback((index: number) => (
+ *  <li key={index}>
+ *    This is my item #{index}
+ *  </li>
+ * ), [])
+ *
+ * const { outerProps, innerProps, visibleChildren } = useVirtualization({itemsLength: 1000, itemRenderer: itemRenderer});
+ * return (
+ *  <div {...outerProps}>
+ *   <ul {...innerProps}>
+ *    {visibleChildren}
+ *   </ul>
+ *  </div>
+ * );
+ * @private
+ */
+export declare const useVirtualization: (props: VirtualScrollProps) => {
+    outerProps: React.HTMLAttributes<HTMLElement>;
+    innerProps: {
+        readonly style: {
+            readonly willChange: "transform";
+        };
+        readonly ref: (instance: HTMLElement) => void;
+    };
+    visibleChildren: JSX.Element[];
+};

package/dist/mocked_classnames_esm/core/src/components/new/utils/components/WithCSSTransition.d.ts

@@ -0,0 +1,6 @@
+import * as React from "react";
+import { CSSTransition } from "react-transition-group";
+export declare const WithCSSTransition: (props: Partial<React.ComponentPropsWithoutRef<typeof CSSTransition>> & {
+    children: JSX.Element;
+    dimension?: "height" | "width";
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/mocked_classnames_esm/core/src/components/new/utils/functions/colors.d.ts

@@ -0,0 +1,20 @@
+export declare const SoftBackgrounds: {
+    readonly skyblue: "var(--iui-color-background-skyblue)";
+    readonly celery: "var(--iui-color-background-celery)";
+    readonly froly: "var(--iui-color-background-froly)";
+    readonly steelblue: "var(--iui-color-background-steelblue)";
+    readonly sunglow: "var(--iui-color-background-sunglow)";
+    readonly seabuckthorn: "var(--iui-color-background-seabuckthorn)";
+    readonly montecarlo: "var(--iui-color-background-montecarlo)";
+    readonly poloblue: "var(--iui-color-background-poloblue)";
+    readonly bouquet: "var(--iui-color-background-bouquet)";
+    readonly ash: "var(--iui-color-background-ash)";
+    readonly oak: "var(--iui-color-background-oak)";
+};
+/** Returns true if a string value is one of the SoftBackgrounds keys */
+export declare const isSoftBackground: (value: string) => value is "skyblue" | "celery" | "froly" | "steelblue" | "sunglow" | "seabuckthorn" | "montecarlo" | "poloblue" | "bouquet" | "ash" | "oak";
+/**
+ * Generate color from user name or email.
+ * Recommended to use for `backgroundColor` in `Avatar` component.
+ */
+export declare const getUserColor: (emailOrName: string) => "var(--iui-color-background-skyblue)" | "var(--iui-color-background-celery)" | "var(--iui-color-background-froly)" | "var(--iui-color-background-steelblue)" | "var(--iui-color-background-sunglow)" | "var(--iui-color-background-seabuckthorn)" | "var(--iui-color-background-montecarlo)" | "var(--iui-color-background-poloblue)" | "var(--iui-color-background-bouquet)" | "var(--iui-color-background-ash)" | "var(--iui-color-background-oak)";

package/dist/mocked_classnames_esm/core/src/components/new/utils/functions/date.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Return true if the first date is earlier than the second date
+ */
+export declare const isBefore: (beforeDate: Date | undefined, afterDate: Date | undefined) => boolean;

package/dist/mocked_classnames_esm/core/src/components/new/utils/functions/dev.d.ts

@@ -0,0 +1,11 @@
+declare const isUnitTest: boolean;
+declare let isDev: boolean;
+/**
+ * Logs message one time only in dev environments.
+ *
+ * @example
+ * const logWarningInDev = createWarningLogger();
+ * logWarningInDev("please don't use this")
+ */
+declare const createWarningLogger: () => (message: string) => void;
+export { isUnitTest, isDev, createWarningLogger };

package/dist/mocked_classnames_esm/core/src/components/new/utils/functions/dom.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+/**
+ * Get document if it is defined.
+ * Used to support SSR/SSG applications.
+ */
+export declare const getDocument: () => Document;
+/**
+ * Get window if it is defined.
+ * Used to support SSR/SSG applications.
+ */
+export declare const getWindow: () => Window & typeof globalThis;
+/**
+ * Merges multiple event handlers into one, while making sure that
+ * `defaultPrevented` is respected for each callback.
+ */
+export declare const mergeEventHandlers: <E extends import("react").SyntheticEvent<Element, Event>>(...callbacks: ((event: E) => void)[]) => (event: E) => void;
+/**
+ * Returns translate values as an array of a given element.
+ * @param element HTML element you want to get translate value of
+ * @returns Translate values in pixels in an array `[translateX, translateY]`
+ */
+export declare const getTranslateValuesFromElement: (element: HTMLElement | null | undefined) => number[];
+export declare const getTranslateValues: (transformValue: string) => number[];

package/dist/mocked_classnames_esm/core/src/components/new/utils/functions/focusable.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Return array of tabbable elements in the container.
+ */
+export declare const getTabbableElements: (container: HTMLElement | undefined | null) => Element[];
+/**
+ * Return array of focusable elements in the container.
+ */
+export declare const getFocusableElements: (container: HTMLElement | undefined | null) => Element[];

package/dist/mocked_classnames_esm/core/src/components/new/utils/functions/import.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Wrapper around native CSS module scripts (import attributes) for dynamic imports.
+ * In unsupported browsers, it gracefully degrades to import assertions, and then `fetch`.
+ *
+ * Returns a constructable CSSStyleSheet object that can be adopted.
+ *
+ * @see https://web.dev/articles/css-module-scripts
+ * @see https://github.com/tc39/proposal-import-attributes
+ */
+export declare const importCss: (url: string) => Promise<{
+    default: CSSStyleSheet;
+}>;

package/dist/mocked_classnames_esm/core/src/components/new/utils/functions/index.d.ts

@@ -0,0 +1,10 @@
+export * from "./date";
+export * from "./dom";
+export * from "./colors";
+export * from "./numbers";
+export * from "./focusable";
+export * from "./supports";
+export * from "./polymorphic";
+export * from "./import";
+export * from "./react";
+export * from "./dev";

package/dist/mocked_classnames_esm/core/src/components/new/utils/functions/numbers.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Return input value bounded by specified range.
+ */
+export declare const getBoundedValue: (val: number, min: number, max: number) => number;
+/**
+ * Returns a random value of a given length containing `A-Za-z0-9_-` symbols.
+ */
+export declare const getRandomValue: (length?: number) => string;
+/**
+ * Rounds a pixel value based on the device's pixel ratio. This ensures that values can be
+ * placed evenly on the device’s pixel grid, avoiding any blurring.
+ *
+ * @see https://floating-ui.com/docs/misc#subpixel-and-accelerated-positioning
+ */
+export declare const roundByDPR: (value: number) => number;