@rio-cloud/rio-uikit 1.13.1 → 2.0.0-beta.1

package/lib/es/components/charts/LineChart.d.ts

@@ -1,32 +0,0 @@
-import React from 'react';
-import { LineChart as RechartsLineChart, type XAxisProps, type YAxisProps, type BrushProps } from 'recharts';
-import { type ChartTooltipProps } from './ChartTooltip';
-import { type LegendProps } from './Legend';
-import { type LineProps } from './Line';
-import { type ReferenceLineProps } from './ReferenceLine';
-import type { GridProps } from './ChartGrid';
-import type { ResponsiveContainerProps } from './ResponsiveContainer';
-type RechartsLineChartProps = React.ComponentProps<typeof RechartsLineChart>;
-export type LineChartProps<T extends object> = Omit<RechartsLineChartProps, 'data'> & {
-    width?: number;
-    height?: number;
-    data: T[];
-    dataUnit?: string;
-    dataKey?: string | number | ((obj: T) => any);
-    lines: React.ReactElement<LineProps>[];
-    referenceLines?: React.ReactElement<ReferenceLineProps>[];
-    xAxisOptions?: XAxisProps;
-    yAxisOptions?: YAxisProps;
-    additionalAxes?: React.ReactElement<XAxisProps | YAxisProps>[];
-    gridOptions?: GridProps;
-    containerOptions?: ResponsiveContainerProps;
-    showXAxis?: boolean;
-    showYAxis?: boolean;
-    showGrid?: boolean;
-    legend?: React.ReactElement<LegendProps> | boolean;
-    tooltip?: React.ReactElement<ChartTooltipProps> | boolean;
-    brush?: boolean;
-    brushOptions?: BrushProps;
-};
-declare const LineChart: <T extends object>(props: LineChartProps<T>) => import("react/jsx-runtime").JSX.Element;
-export default LineChart;

package/lib/es/components/charts/LineChart.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const react_1 = require("react");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const recharts_1 = require("recharts");
-const isObject_1 = tslib_1.__importDefault(require("lodash/fp/isObject"));
-const chartHelper_1 = require("./chartHelper");
-const ChartTooltip_1 = tslib_1.__importDefault(require("./ChartTooltip"));
-const Legend_1 = require("./Legend");
-const XAxis_1 = require("./XAxis");
-const Line_1 = require("./Line");
-const ReferenceLine_1 = require("./ReferenceLine");
-const LineChart = (props) => {
-    const { width, height, data = [], dataUnit = '', dataKey = 'value', lines = [], referenceLines = [], xAxisOptions, yAxisOptions, gridOptions, containerOptions, showXAxis = true, showYAxis = false, additionalAxes = [], showGrid = false, legend, brush = false, tooltip = true, brushOptions = {}, ...remainingProps } = props;
-    const tooltipProps = (0, isObject_1.default)(tooltip) ? tooltip.props : {};
-    const legendProps = (0, isObject_1.default)(legend) ? { ...(0, Legend_1.getLegendDefaultProps)(), ...legend.props } : {};
-    return ((0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { ...containerOptions, children: (0, jsx_runtime_1.jsxs)(recharts_1.LineChart, { width: width, height: height, data: data, margin: { top: 15, right: 15, left: 15, bottom: 15 }, ...remainingProps, children: [showGrid && (0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: '3 3', ...(0, chartHelper_1.mapGridOptions)(gridOptions) }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { hide: !showXAxis, dataKey: dataKey, ...xAxisOptions }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, { hide: !showYAxis, unit: dataUnit, ...yAxisOptions }), additionalAxes.map(XAxis_1.renderAxis), tooltip && (0, jsx_runtime_1.jsx)(ChartTooltip_1.default, { ...tooltipProps }), legend && (0, jsx_runtime_1.jsx)(recharts_1.Legend, { ...legendProps }), lines.map(line => {
-                    const linePropsWithDefault = { ...(0, Line_1.getLineDefaultProps)(), ...line.props };
-                    const { strokeColor, ...remainingLineProps } = linePropsWithDefault;
-                    return ((0, react_1.createElement)(recharts_1.Line, { ...remainingLineProps, key: line.key, stroke: (0, chartHelper_1.getColor)(strokeColor) }));
-                }), referenceLines.map(ReferenceLine_1.renderReferenceLine), brush && (0, jsx_runtime_1.jsx)(recharts_1.Brush, { ...brushOptions, stroke: (0, chartHelper_1.getColor)('gray') })] }) }));
-};
-exports.default = LineChart;

package/lib/es/components/charts/PieChart.d.ts

@@ -1,30 +0,0 @@
-import React from 'react';
-import { PieChart as RechartsPieChart, type PieProps as RechartPieProps } from 'recharts';
-import { type DataType } from './chartHelper';
-import { type LegendProps } from './Legend';
-import { type ChartTooltipProps } from './ChartTooltip';
-import type { ResponsiveContainerProps } from './ResponsiveContainer';
-export type PieChartDataType = DataType;
-export type PieProps = Omit<Partial<RechartPieProps>, 'ref'> & {};
-type RechartsPieChartProps = React.ComponentProps<typeof RechartsPieChart>;
-export type PieChartProps<T extends DataType> = Omit<RechartsPieChartProps, 'data'> & {
-    width?: number | string;
-    height?: number | string;
-    innerRadius?: number | string;
-    outerRadius?: number | string;
-    data: T[];
-    dataKey?: string | number | ((obj: T) => any);
-    dataUnit?: string;
-    nameKey?: string;
-    color?: string | ((obj: T) => any);
-    filled?: boolean;
-    labels?: boolean;
-    innerLabels?: boolean;
-    paddingAngle?: number;
-    legend?: React.ReactElement<LegendProps> | boolean;
-    tooltip?: React.ReactElement<ChartTooltipProps> | boolean;
-    pieOptions?: PieProps;
-    containerOptions?: ResponsiveContainerProps;
-};
-declare const PieChart: <T extends DataType>(props: PieChartProps<T>) => import("react/jsx-runtime").JSX.Element;
-export default PieChart;

package/lib/es/components/charts/PieChart.js

@@ -1,33 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const recharts_1 = require("recharts");
-const isFunction_1 = tslib_1.__importDefault(require("lodash/fp/isFunction"));
-const isObject_1 = tslib_1.__importDefault(require("lodash/fp/isObject"));
-const chartHelper_1 = require("./chartHelper");
-const Legend_1 = require("./Legend");
-const ChartTooltip_1 = tslib_1.__importStar(require("./ChartTooltip"));
-const RADIAN = Math.PI / 180;
-const renderCustomInnerLabel = (dataUnit) => ({ cx, cy, midAngle, innerRadius, outerRadius, value }) => {
-    const radius = innerRadius + (outerRadius - innerRadius) * 0.5;
-    const x = cx + radius * Math.cos(-midAngle * RADIAN);
-    const y = cy + radius * Math.sin(-midAngle * RADIAN);
-    return ((0, jsx_runtime_1.jsx)("text", { x: x, y: y, fill: 'white', textAnchor: x > cx ? 'start' : 'end', dominantBaseline: 'central', children: `${value} ${dataUnit}` }));
-};
-const PieChart = (props) => {
-    const { width, height, innerRadius, outerRadius, data = [], dataKey = 'value', dataUnit = '', nameKey = 'name', color, filled = false, labels = true, innerLabels = false, paddingAngle = 3, legend = (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), tooltip = true, pieOptions, containerOptions, ...remainingProps } = props;
-    // biome-ignore lint/suspicious/noExplicitAny: unknown type
-    const renderLabels = (entry) => `${(0, isFunction_1.default)(dataKey) ? dataKey(entry) : entry[dataKey]} ${dataUnit}`;
-    const pieLabel = labels && (innerLabels ? renderCustomInnerLabel(dataUnit) : renderLabels);
-    const tooltipProps = (0, isObject_1.default)(tooltip) ? tooltip.props : {};
-    const legendProps = (0, isObject_1.default)(legend) ? { ...(0, Legend_1.getLegendDefaultProps)(), ...legend.props } : {};
-    return ((0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { ...containerOptions, children: (0, jsx_runtime_1.jsxs)(recharts_1.PieChart, { width: width, height: height, ...remainingProps, children: [legend && ((0, jsx_runtime_1.jsx)(recharts_1.Legend, { formatter: (value, entry) => ((0, jsx_runtime_1.jsx)("span", { className: 'text-color-darker', children: value })), ...legendProps })), (0, jsx_runtime_1.jsx)(recharts_1.Pie, { data: data, isAnimationActive: true, nameKey: nameKey, dataKey: dataKey, label: pieLabel, 
-                    // cx={Math.max(outerRadius, width / 3)}
-                    // cy={height / 2}
-                    innerRadius: filled ? 0 : innerRadius, outerRadius: outerRadius, paddingAngle: filled ? 0 : paddingAngle, labelLine: !innerLabels, ...pieOptions, children: data.map((entry, index) => {
-                        const cellColor = (0, chartHelper_1.getColor)(entry.color) || (0, chartHelper_1.getFromDefaultColors)(index);
-                        return ((0, jsx_runtime_1.jsx)(recharts_1.Cell, { fill: (0, isFunction_1.default)(color) ? (0, chartHelper_1.getColor)(color(entry)) : cellColor }, `cell-${index}`));
-                    }) }), tooltip && (0, jsx_runtime_1.jsx)(ChartTooltip_1.default, { formatter: (0, ChartTooltip_1.defaultFormatter)(dataUnit), ...tooltipProps })] }) }));
-};
-exports.default = PieChart;

package/lib/es/components/charts/RadialBarChart.d.ts

@@ -1,38 +0,0 @@
-import React from 'react';
-import { RadialBarChart as RechartsRadialBarChart, type RadialBarProps as RechartsRadialBarProps } from 'recharts';
-import { type DataType } from './chartHelper';
-import { type LegendProps } from './Legend';
-import { type ChartTooltipProps } from './ChartTooltip';
-import type { ResponsiveContainerProps } from './ResponsiveContainer';
-export type RadialBarChartDataType = DataType;
-export type RadialBarProps = Omit<RechartsRadialBarProps, 'ref'> & {};
-export type TextOptions = Record<string, unknown> & {
-    text?: string;
-    size?: string;
-    weight?: string;
-    color?: string;
-};
-type RechartsRadialBarChartProps = React.ComponentProps<typeof RechartsRadialBarChart>;
-export type RadialBarChartProps<T extends DataType> = Omit<RechartsRadialBarChartProps, 'data'> & {
-    width?: number;
-    height?: number;
-    data: T[];
-    dataKey?: string | number | ((obj: T) => any);
-    startAngle?: number;
-    endAngle?: number;
-    outerRadius?: number | string;
-    innerRadius?: number | string;
-    cx?: number | string;
-    cy?: number | string;
-    textOptions?: TextOptions;
-    radialBarOptions?: RadialBarProps;
-    containerOptions?: ResponsiveContainerProps;
-    showBarLabel?: boolean;
-    cornerRadius?: number;
-    background?: boolean;
-    range?: number[];
-    legend?: React.ReactElement<LegendProps> | boolean;
-    tooltip?: React.ReactElement<ChartTooltipProps> | boolean;
-};
-declare const RadialBarChart: <T extends DataType>(props: RadialBarChartProps<T>) => import("react/jsx-runtime").JSX.Element;
-export default RadialBarChart;

package/lib/es/components/charts/RadialBarChart.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const recharts_1 = require("recharts");
-const isFunction_1 = tslib_1.__importDefault(require("lodash/fp/isFunction"));
-const isObject_1 = tslib_1.__importDefault(require("lodash/fp/isObject"));
-const chartHelper_1 = require("./chartHelper");
-const Legend_1 = require("./Legend");
-const ChartTooltip_1 = tslib_1.__importDefault(require("./ChartTooltip"));
-const RadialBarChart = (props) => {
-    const { width, height, data = [], dataKey = 'value', startAngle = 180, endAngle = 0, innerRadius = '30%', outerRadius = '100%', legend = (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), textOptions, radialBarOptions, containerOptions, showBarLabel = false, cornerRadius = 30, background = true, range, tooltip = false, ...remainingProps } = props;
-    const { text, size = '500%', weight = 'normal', color = 'gray-darkest', ...remainingTextOptions } = textOptions || {};
-    const textStyle = {
-        fontSize: size,
-        fontWeight: weight,
-        fill: color && (0, chartHelper_1.getColor)(color),
-    };
-    const tooltipProps = (0, isObject_1.default)(tooltip) ? tooltip.props : {};
-    const legendProps = (0, isObject_1.default)(legend) ? { ...(0, Legend_1.getLegendDefaultProps)(), ...legend.props } : {};
-    return ((0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { ...containerOptions, children: (0, jsx_runtime_1.jsxs)(recharts_1.RadialBarChart, { width: width, height: height, data: data, innerRadius: innerRadius, outerRadius: outerRadius, startAngle: startAngle, endAngle: endAngle, ...remainingProps, children: [(0, jsx_runtime_1.jsx)(recharts_1.RadialBar, { label: showBarLabel && { fill: '#666', position: 'insideStart' }, background: background, dataKey: dataKey, cornerRadius: cornerRadius, ...radialBarOptions, children: data.map((entry, index) => {
-                        const cellColor = (0, chartHelper_1.getColor)(entry.color) || (0, chartHelper_1.getFromDefaultColors)(index);
-                        return ((0, jsx_runtime_1.jsx)(recharts_1.Cell, { fill: (0, isFunction_1.default)(color) ? color(entry, index) : cellColor }, `cell-${index}`));
-                    }) }), range && (0, jsx_runtime_1.jsx)(recharts_1.PolarAngleAxis, { type: 'number', domain: range, angleAxisId: 0, tick: false }), textOptions && ((0, jsx_runtime_1.jsx)("text", { x: width ? width / 2 : '50%', y: height ? height / 2 : '50%', textAnchor: 'middle', dominantBaseline: 'middle', className: 'radialbarchart-text', style: textStyle, ...remainingTextOptions, children: text })), legend && ((0, jsx_runtime_1.jsx)(recharts_1.Legend, { formatter: (value, entry) => ((0, jsx_runtime_1.jsx)("span", { className: 'text-color-darker', children: value })), ...legendProps })), tooltip && (0, jsx_runtime_1.jsx)(ChartTooltip_1.default, { cursor: { fill: chartHelper_1.CURSOR_BACKGROUND_COLOR }, ...tooltipProps })] }) }));
-};
-exports.default = RadialBarChart;

package/lib/es/components/charts/ReferenceLine.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-import { type ReferenceLineProps as RechartsReferenceLineProps } from 'recharts';
-export type ReferenceLineProps = Omit<RechartsReferenceLineProps, 'ref'> & {
-    stroke?: string;
-};
-export declare const getReferenceLineDefaultProps: () => {
-    stroke: string;
-};
-export declare const renderReferenceLine: (element: React.ReactElement<ReferenceLineProps>) => import("react/jsx-runtime").JSX.Element;
-declare const ReferenceLine: (props: ReferenceLineProps) => null;
-export default ReferenceLine;

package/lib/es/components/charts/ReferenceLine.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderReferenceLine = exports.getReferenceLineDefaultProps = void 0;
-const react_1 = require("react");
-const recharts_1 = require("recharts");
-const chartHelper_1 = require("./chartHelper");
-const getReferenceLineDefaultProps = () => ({
-    stroke: 'color-coldplay-fountain',
-});
-exports.getReferenceLineDefaultProps = getReferenceLineDefaultProps;
-const renderReferenceLine = (element) => {
-    const referenceLinePropsWithDefault = { ...(0, exports.getReferenceLineDefaultProps)(), ...element.props };
-    const { stroke, ...remainingReferenceLineProps } = referenceLinePropsWithDefault;
-    return (0, react_1.createElement)(recharts_1.ReferenceLine, { ...remainingReferenceLineProps, key: element.key, stroke: (0, chartHelper_1.getColor)(stroke) });
-};
-exports.renderReferenceLine = renderReferenceLine;
-// This is only used for passing this as prop to the UIKIT charts wrapper.
-// Recharts component need to be direct children of the chart itself and cannot be wrapped again
-const ReferenceLine = (props) => null;
-exports.default = ReferenceLine;

package/lib/es/components/charts/ResponsiveContainer.d.ts

@@ -1,2 +0,0 @@
-import type { ResponsiveContainerProps as RechartResponsiveContainerProps } from 'recharts';
-export type ResponsiveContainerProps = Omit<Partial<RechartResponsiveContainerProps>, 'ref'> & {};

package/lib/es/components/charts/ResponsiveContainer.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/lib/es/components/charts/XAxis.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { type XAxisProps as XAxisPropsProps } from 'recharts';
-import { type YAxisProps } from './YAxis';
-export type XAxisProps = Partial<XAxisPropsProps> & {};
-export declare const renderAxis: (axis: React.ReactElement<XAxisProps | YAxisProps>, index: number) => import("react/jsx-runtime").JSX.Element | null;
-declare const XAxis: React.FC<XAxisProps>;
-export default XAxis;

package/lib/es/components/charts/XAxis.js

@@ -1,23 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderAxis = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = tslib_1.__importDefault(require("react"));
-const recharts_1 = require("recharts");
-const YAxis_1 = tslib_1.__importDefault(require("./YAxis"));
-const renderAxis = (axis, index) => {
-    const key = `additional-axis-${index}`;
-    if (react_1.default.isValidElement(axis)) {
-        if (axis.type === XAxis) {
-            return (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { ...axis.props }, key);
-        }
-        if (axis.type === YAxis_1.default) {
-            return (0, jsx_runtime_1.jsx)(recharts_1.YAxis, { ...axis.props }, key);
-        }
-    }
-    return null;
-};
-exports.renderAxis = renderAxis;
-const XAxis = props => null;
-exports.default = XAxis;

package/lib/es/components/charts/YAxis.d.ts

@@ -1,4 +0,0 @@
-import type { YAxisProps as YAxisPropsProps } from 'recharts';
-export type YAxisProps = Omit<YAxisPropsProps, 'ref'> & {};
-declare const YAxis: React.FC<YAxisProps>;
-export default YAxis;

package/lib/es/components/charts/YAxis.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const YAxis = props => null;
-exports.default = YAxis;

package/lib/es/components/charts/chartHelper.d.ts

@@ -1,10 +0,0 @@
-export type DataType = Record<string, unknown> & {
-    color?: string;
-};
-export declare const CURSOR_BACKGROUND_COLOR = "#a7afbb24";
-export declare const defaultChartColors: string[];
-export declare const getFromDefaultColors: (index: number) => string;
-export declare const getColor: (colorKey?: string) => string | undefined;
-export declare const mapGridOptions: <T extends {
-    stroke?: string;
-}>(gridOptions?: T) => T | undefined;

package/lib/es/components/charts/chartHelper.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.mapGridOptions = exports.getColor = exports.getFromDefaultColors = exports.defaultChartColors = exports.CURSOR_BACKGROUND_COLOR = void 0;
-const tslib_1 = require("tslib");
-const colors_json_1 = tslib_1.__importDefault(require("../../styles/variables/colors/colors.json"));
-const colors = colors_json_1.default;
-exports.CURSOR_BACKGROUND_COLOR = '#a7afbb24';
-const brightColors = ['color-warmup-corn', 'color-coldplay-khaki'];
-exports.defaultChartColors = Object.keys(colors)
-    .reverse()
-    .filter(key => !brightColors.includes(key))
-    .map(key => colors[key]);
-const getFromDefaultColors = (index) => exports.defaultChartColors[index];
-exports.getFromDefaultColors = getFromDefaultColors;
-const getColor = (colorKey) => (colorKey ? colors[colorKey] : undefined);
-exports.getColor = getColor;
-const mapGridOptions = (gridOptions) => {
-    if (!gridOptions) {
-        return;
-    }
-    const mappedGridOptions = { ...gridOptions };
-    const { stroke } = mappedGridOptions;
-    mappedGridOptions.stroke = stroke && !stroke.startsWith('#') ? (0, exports.getColor)(stroke) : stroke;
-    return mappedGridOptions;
-};
-exports.mapGridOptions = mapGridOptions;

package/lib/es/components/checkbox/Checkbox.d.ts

@@ -1,136 +0,0 @@
-import React, { type ReactNode, type PropsWithChildren } from 'react';
-declare const ICON_LABEL_VERTICAL = "vertical";
-declare const ICON_LABEL_HORIZONTAL = "horizontal";
-export type CheckboxProps = {
-    /**
-     * Passed through as HTML attribute to the underlying input.
-     * Set an `id` or a `name` otherwise.
-     */
-    id?: string;
-    /**
-     * Passed through as HTML attribute to the underlying input
-     */
-    name?: string;
-    /**
-     * Define some text or component as a label.
-     */
-    label?: string | ReactNode;
-    /**
-     * Define a custom icon for the checkbox by naming a rioglyph icon like `rioglyph-truck`.
-     */
-    icon?: string;
-    /**
-     * The icon size in pixel.
-     */
-    iconSize?: number;
-    /**
-     * The label position for a custom icon checkbox. Using this on a regular checkbox has no effect.
-     *
-     * Possible values are: `horizontal` or `vertical`.
-     */
-    iconLabelPosition?: typeof ICON_LABEL_VERTICAL | typeof ICON_LABEL_HORIZONTAL;
-    /**
-     * Callback function that is invoked when the checkbox is checked or unchecked.
-     * @param event
-     * @returns
-     */
-    onClick?: (event: React.MouseEvent<HTMLInputElement>) => void;
-    /**
-     * Callback function that is invoked when the checkbox value changes.
-     * This will also be invoked by a keyboard event.
-     * @param event
-     * @returns
-     */
-    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    /**
-     * Defines whether the checkbox is checked or not (state cannot be changed).
-     */
-    checked?: boolean;
-    /**
-     * Defines whether the checkbox is initially checked or not (state can be changed on click).
-     */
-    defaultChecked?: boolean;
-    /**
-     * Defines whether the checkbox is disabled or not.
-     * @default false
-     */
-    disabled?: boolean;
-    /**
-     * Allows for rendering a completely different layout with or without a checkbox tick.
-     * Note, when using the `custom` option, make sure to wrap the children with the class name
-     * `checkbox-text-wrapper`. For using the checkbox tick, use an element with class name
-     * `checkbox-text`.
-     *
-     * @example
-     *
-     * ```tsx
-     * <div className='checkbox-text-wrapper display-flex justify-content-between'>
-     *     <div className='margin-right-15'>
-     *         <div className='text-medium text-size-16 text-color-darker'>Option 1</div>
-     *         <div className='text-color-dark'>This option is a first option</div>
-     *     </div>
-     *     <div className='checkbox-text' />
-     * </div>
-     * ```
-     */
-    custom?: boolean;
-    /**
-     * Defines whether the checkbox is required or not.
-     *
-     * @default false
-     */
-    required?: boolean;
-    /**
-     * Defines if the checkbox is in an indeterminate state in regard to other checkboxes that may be in different
-     * selection state.
-     *
-     * @default false
-     */
-    indeterminate?: boolean;
-    /**
-     * Defines whether the checkbox is applying an inline style. Use this in combination
-     * with other checkboxes.
-     *
-     * @default false
-     */
-    inline?: boolean;
-    /**
-     * Defines whether the checkbox is on the right side.
-     *
-     * @default false
-     */
-    right?: boolean;
-    /**
-     * Use "error" to change color of the checkbox.
-     *
-     * @default false
-     */
-    error?: boolean;
-    /**
-     * Defines the size of the checkbox. Omitting this prop renders the Checkbox in normal size.
-     *
-     * Possible values are:
-     * `large`
-     */
-    size?: 'large';
-    /**
-     * A React ref assigned to the input itself.
-     */
-    inputRef?: React.RefObject<HTMLInputElement>;
-    /**
-     * Number of the index used for keyboard support.
-     *
-     * @default 0
-     */
-    tabIndex?: number;
-    /**
-     * Additional classes to be set on the input field.
-     */
-    className?: string;
-};
-declare const Checkbox: {
-    (props: PropsWithChildren<CheckboxProps>): import("react/jsx-runtime").JSX.Element;
-    ICON_LABEL_VERTICAL: "vertical";
-    ICON_LABEL_HORIZONTAL: "horizontal";
-};
-export default Checkbox;

package/lib/es/components/checkbox/Checkbox.js

@@ -1,58 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
-const CheckboxIcon_1 = require("./CheckboxIcon");
-const DEFAULT_ICON_SIZE = 16;
-const ICON_LABEL_VERTICAL = 'vertical';
-const ICON_LABEL_HORIZONTAL = 'horizontal';
-const Checkbox = (props) => {
-    const { checked, children, className, custom = false, defaultChecked, disabled = false, error = false, icon = '', iconLabelPosition = ICON_LABEL_VERTICAL, iconSize = DEFAULT_ICON_SIZE, id = props.name, indeterminate = false, inline = false, inputRef, label, name, onChange = noop_1.default, onClick = noop_1.default, required = false, right, size, tabIndex = 0, ...remainingProps } = props;
-    const labelRef = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
-        const input = labelRef.current?.firstChild;
-        if (input) {
-            input.indeterminate = indeterminate;
-        }
-    }, [indeterminate, labelRef.current]);
-    const handleToggleKeyDown = (event) => {
-        switch (event.key) {
-            case ' ':
-                // toggle on space
-                toggle(event);
-                break;
-            case 'Enter':
-                // open on enter
-                toggle(event);
-                break;
-            default:
-                break;
-        }
-    };
-    const toggle = (event) => {
-        event.preventDefault();
-        if (disabled) {
-            return;
-        }
-        const input = labelRef.current?.firstChild;
-        if (input.indeterminate) {
-            input.indeterminate = false;
-        }
-        input.checked = !input.checked;
-        onClick(event);
-        onChange(event);
-    };
-    const text = label || children;
-    const labelClassnames = (0, classnames_1.default)('checkbox', inline && 'checkbox-inline', size === 'large' && 'checkbox-large', right && 'checkbox-right', className);
-    const inputClassnames = (0, classnames_1.default)(error && 'error', size === 'large' && 'large', indeterminate && 'indeterminate', className);
-    const renderCustomIcon = !!icon;
-    const renderCustomContent = custom && children;
-    const renderDefault = !icon && !custom;
-    return ((0, jsx_runtime_1.jsxs)("label", { ...remainingProps, className: labelClassnames, tabIndex: tabIndex, htmlFor: id, onKeyDown: handleToggleKeyDown, ref: labelRef, children: [(0, jsx_runtime_1.jsx)("input", { id: id, name: name, type: 'checkbox', checked: checked, required: required, defaultChecked: defaultChecked, disabled: disabled, className: inputClassnames, onClick: onClick, onChange: onChange, ref: inputRef }), renderCustomIcon && ((0, jsx_runtime_1.jsx)(CheckboxIcon_1.CheckboxIcon, { icon: icon, iconSize: iconSize, iconLabelPosition: iconLabelPosition, text: text })), renderDefault && (0, jsx_runtime_1.jsx)("span", { className: 'checkbox-text', children: text && (0, jsx_runtime_1.jsx)("span", { children: text }) }), renderCustomContent && children] }));
-};
-Checkbox.ICON_LABEL_VERTICAL = ICON_LABEL_VERTICAL;
-Checkbox.ICON_LABEL_HORIZONTAL = ICON_LABEL_HORIZONTAL;
-exports.default = Checkbox;

package/lib/es/components/checkbox/CheckboxIcon.d.ts

@@ -1,9 +0,0 @@
-import type { ReactNode } from 'react';
-type CheckboxIconProps = {
-    icon: string;
-    iconSize: number;
-    iconLabelPosition: 'vertical' | 'horizontal';
-    text?: string | ReactNode;
-};
-export declare const CheckboxIcon: (props: CheckboxIconProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/lib/es/components/checkbox/CheckboxIcon.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckboxIcon = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const CheckboxIcon = (props) => {
-    const { icon, iconSize, iconLabelPosition, text } = props;
-    const iconStyles = {
-        width: `${iconSize}px`,
-        height: `${iconSize}px`,
-        fontSize: `${iconSize}px`,
-        lineHeight: `${iconSize}px`,
-    };
-    return ((0, jsx_runtime_1.jsxs)("span", { className: `checkbox-icon label-${iconLabelPosition}`, children: [(0, jsx_runtime_1.jsx)("span", { className: `rioglyph ${icon}`, style: iconStyles }), (0, jsx_runtime_1.jsx)("span", { className: 'checkbox-label', children: text })] }));
-};
-exports.CheckboxIcon = CheckboxIcon;