@broxus/react-uikit 0.1.0 → 0.1.1

package/dist/esm/components/Button/Button.js

@@ -1,30 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
-import { Link } from '../Link';
-/* eslint-disable react/prop-types */
-export const Button = React.forwardRef((props, ref) => {
-    const config = useConfig();
-    const { children, ghost, htmlType = 'button', prefixCls = `${config.prefixCls}-button`, shape, size, type, ...restProps } = props;
-    const buttonRef = ref || React.useRef(null);
-    const onClick = event => {
-        if (restProps.disabled) {
-            event.preventDefault();
-            return;
-        }
-        restProps.onClick?.(event);
-    };
-    const className = classNames(prefixCls, {
-        [`${prefixCls}-${type}`]: type !== undefined,
-        [`${prefixCls}-ghost`]: ghost !== undefined,
-        [`${prefixCls}-${size}`]: size !== undefined,
-        [`${prefixCls}-${shape}`]: shape !== undefined && ['circle', 'round'].includes(shape),
-    }, restProps.className);
-    if (restProps.href !== undefined) {
-        return (React.createElement(Link, { ref: buttonRef, href: restProps.href, ...restProps, className: className, onClick: onClick }, children));
-    }
-    return (React.createElement("button", { ref: buttonRef, type: htmlType, ...restProps, className: className, onClick: onClick }, children));
-});
-if (process.env.NODE_ENV !== 'production') {
-    Button.displayName = 'Button';
-}

package/dist/esm/components/Button/Group.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {
-    prefixCls?: string;
-}
-export declare function Group(props: ButtonGroupProps): JSX.Element;
-export declare namespace Group {
-    var displayName: string;
-}

package/dist/esm/components/Button/Group.js

@@ -1,11 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
-export function Group(props) {
-    const config = useConfig();
-    const { className, prefixCls = `${config.prefixCls}-button-group`, ...restProps } = props;
-    return (React.createElement("div", { className: classNames(prefixCls, className), ...restProps }));
-}
-if (process.env.NODE_ENV !== 'production') {
-    Group.displayName = 'Button.Group';
-}

package/dist/esm/components/Button/index.d.ts

@@ -1,9 +0,0 @@
-import * as React from 'react';
-import { Group } from './Group';
-import type { ButtonProps } from './Button';
-import './index.scss';
-export type { ButtonProps };
-export interface CompoundedButton extends React.ForwardRefExoticComponent<ButtonProps> {
-    Group: typeof Group;
-}
-export declare const Button: CompoundedButton;

package/dist/esm/components/Button/index.js

@@ -1,5 +0,0 @@
-import { Button as InternalButton } from './Button';
-import { Group } from './Group';
-import './index.scss';
-export const Button = InternalButton;
-Button.Group = Group;

package/dist/esm/components/Card/Badge.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export interface CardBadgeProps extends React.HTMLAttributes<HTMLElement> {
-    prefixCls?: string;
-}
-export declare function Badge(props: CardBadgeProps): JSX.Element;
-export declare namespace Badge {
-    var displayName: string;
-}

package/dist/esm/components/Card/Badge.js

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
-import { Label } from '../Label';
-export function Badge(props) {
-    const config = useConfig();
-    const { className, prefixCls = `${config.prefixCls}-card-badge`, ...restProps } = props;
-    return (React.createElement(Label, { className: classNames(prefixCls, className), ...restProps }));
-}
-if (process.env.NODE_ENV !== 'production') {
-    Badge.displayName = 'Card.Badge';
-}

package/dist/esm/components/Card/Body.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export interface CardBodyProps extends React.HTMLAttributes<HTMLElement> {
-    prefixCls?: string;
-}
-export declare function Body(props: CardBodyProps): JSX.Element;
-export declare namespace Body {
-    var displayName: string;
-}

package/dist/esm/components/Card/Body.js

@@ -1,11 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
-export function Body(props) {
-    const config = useConfig();
-    const { className, prefixCls = `${config.prefixCls}-card-body`, ...restProps } = props;
-    return (React.createElement("div", { className: classNames(prefixCls, className), ...restProps }));
-}
-if (process.env.NODE_ENV !== 'production') {
-    Body.displayName = 'Card.Body';
-}

package/dist/esm/components/Card/Card.d.ts

@@ -1,15 +0,0 @@
-import * as React from 'react';
-import type { PolymorphicComponentProps } from '../Component';
-import type { ColorMode } from '../ConfrigProvider';
-export interface CardOwnProps extends React.HTMLAttributes<HTMLElement> {
-    asBody?: boolean;
-    color?: 'default' | 'primary' | 'secondary' | 'tertiary';
-    colorMode?: ColorMode;
-    hoverable?: boolean;
-    prefixCls?: string;
-    size?: 'small' | 'large';
-}
-export declare type CardProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, CardOwnProps>;
-declare const defaultElement = "div";
-export declare function Card<E extends React.ElementType = typeof defaultElement>(props: CardProps<E>): JSX.Element;
-export {};

package/dist/esm/components/Card/Card.js

@@ -1,19 +0,0 @@
-import * as React from 'react';
-import { capitalizeFirstLetter } from '@broxus/js-utils';
-import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
-const defaultElement = 'div';
-export function Card(props) {
-    const config = useConfig();
-    const { asBody, className, color, colorMode = color !== 'default' && color !== undefined
-        ? config[`card${capitalizeFirstLetter(color)}ColorMode`]
-        : undefined, hoverable, prefixCls = `${config.prefixCls}-card`, size, ...restProps } = props;
-    return (React.createElement(Component, { className: classNames(prefixCls, {
-            [`${prefixCls}-${color}`]: color !== undefined,
-            [`${prefixCls}-${size}`]: size !== undefined,
-            [`${prefixCls}-body`]: asBody,
-            [`${prefixCls}-hover`]: hoverable,
-            [`${config.prefixCls}-${colorMode}`]: colorMode !== undefined,
-        }, className), component: defaultElement, ...restProps }));
-}

package/dist/esm/components/Card/Footer.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { PolymorphicComponentProps } from '../Component';
-export declare type CardFooterOwnProps = {
-    prefixCls?: string;
-};
-export declare type CardFooterProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, CardFooterOwnProps>;
-declare const defaultElement = "footer";
-export declare function Footer<E extends React.ElementType = typeof defaultElement>(props: CardFooterProps<E>): JSX.Element;
-export declare namespace Footer {
-    var displayName: string;
-}
-export {};

package/dist/esm/components/Card/Footer.js

@@ -1,13 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
-const defaultElement = 'footer';
-export function Footer(props) {
-    const config = useConfig();
-    const { className, prefixCls = `${config.prefixCls}-card-footer`, ...restProps } = props;
-    return (React.createElement(Component, { className: classNames(prefixCls, className), component: defaultElement, ...restProps }));
-}
-if (process.env.NODE_ENV !== 'production') {
-    Footer.displayName = 'Card.Footer';
-}

package/dist/esm/components/Card/Header.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { PolymorphicComponentProps } from '../Component';
-export declare type CardHeaderOwnProps = {
-    prefixCls?: string;
-};
-export declare type CardHeaderProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, CardHeaderOwnProps>;
-declare const defaultElement = "header";
-export declare function Header<E extends React.ElementType = typeof defaultElement>(props: CardHeaderProps<E>): JSX.Element;
-export declare namespace Header {
-    var displayName: string;
-}
-export {};

package/dist/esm/components/Card/Header.js

@@ -1,13 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
-const defaultElement = 'header';
-export function Header(props) {
-    const config = useConfig();
-    const { className, prefixCls = `${config.prefixCls}-card-header`, ...restProps } = props;
-    return (React.createElement(Component, { className: classNames(prefixCls, className), component: defaultElement, ...restProps }));
-}
-if (process.env.NODE_ENV !== 'production') {
-    Header.displayName = 'Card.Header';
-}

package/dist/esm/components/Card/Media.d.ts

@@ -1,9 +0,0 @@
-import * as React from 'react';
-export interface CardMediaProps extends React.HTMLAttributes<HTMLDivElement> {
-    position: 'left' | 'top' | 'right' | 'bottom';
-    prefixCls?: string;
-}
-export declare function Media(props: CardMediaProps): JSX.Element;
-export declare namespace Media {
-    var displayName: string;
-}

package/dist/esm/components/Card/Media.js

@@ -1,13 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
-export function Media(props) {
-    const config = useConfig();
-    const { className, position, prefixCls = `${config.prefixCls}-card-media`, ...restProps } = props;
-    return (React.createElement("div", { className: classNames({
-            [`${prefixCls}-${position}`]: position !== undefined,
-        }, className), ...restProps }));
-}
-if (process.env.NODE_ENV !== 'production') {
-    Media.displayName = 'Card.Media';
-}

package/dist/esm/components/Card/Title.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { PolymorphicComponentProps } from '../Component';
-export declare type CardTitleOwnProps = {
-    prefixCls?: string;
-};
-export declare type CardTitleProps<E extends React.ElementType> = PolymorphicComponentProps<E, CardTitleOwnProps>;
-declare const defaultElement = "h1";
-export declare function Title<E extends React.ElementType = typeof defaultElement>(props: CardTitleProps<E>): JSX.Element;
-export declare namespace Title {
-    var displayName: string;
-}
-export {};

package/dist/esm/components/Card/Title.js

@@ -1,13 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
-const defaultElement = 'h1';
-export function Title(props) {
-    const config = useConfig();
-    const { className, prefixCls = `${config.prefixCls}-card-title`, ...restProps } = props;
-    return (React.createElement(Component, { className: classNames(prefixCls, className), component: defaultElement, ...restProps }));
-}
-if (process.env.NODE_ENV !== 'production') {
-    Title.displayName = 'Card.Title';
-}

package/dist/esm/components/Card/index.d.ts

@@ -1,19 +0,0 @@
-import * as React from 'react';
-import { Badge } from './Badge';
-import { Body } from './Body';
-import { Footer } from './Footer';
-import { Header } from './Header';
-import { Media } from './Media';
-import { Title } from './Title';
-import type { CardProps } from './Card';
-import './index.scss';
-export type { CardProps };
-export interface CompoundedCard extends React.FunctionComponent<CardProps> {
-    Badge: typeof Badge;
-    Body: typeof Body;
-    Footer: typeof Footer;
-    Header: typeof Header;
-    Media: typeof Media;
-    Title: typeof Title;
-}
-export declare const Card: CompoundedCard;

package/dist/esm/components/Card/index.js

@@ -1,15 +0,0 @@
-import { Badge } from './Badge';
-import { Body } from './Body';
-import { Card as InternalCard } from './Card';
-import { Footer } from './Footer';
-import { Header } from './Header';
-import { Media } from './Media';
-import { Title } from './Title';
-import './index.scss';
-export const Card = InternalCard;
-Card.Badge = Badge;
-Card.Body = Body;
-Card.Footer = Footer;
-Card.Header = Header;
-Card.Media = Media;
-Card.Title = Title;

package/dist/esm/components/Close/index.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import type { IconProps } from '../Icon';
-export declare type CloseProps<E extends React.ElementType = React.ElementType> = Omit<IconProps<E>, 'icon'> & {
-    prefixCls?: string;
-};
-declare const defaultElement = "button";
-export declare function Close<E extends React.ElementType = typeof defaultElement>(props: CloseProps<E>): JSX.Element;
-export {};

package/dist/esm/components/Close/index.js

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
-import { Icon } from '../Icon';
-const defaultElement = 'button';
-export function Close(props) {
-    const config = useConfig();
-    const { className, prefixCls = `${config.prefixCls}-close`, ...restProps } = props;
-    return (React.createElement(Icon, { "aria-hidden": "false", className: classNames(prefixCls, className), component: defaultElement, tabIndex: -1, ...restProps, icon: "close" }));
-}

package/dist/esm/components/Component/Component.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export declare type ComponentOwnProps<E extends React.ElementType = React.ElementType> = {
-    component?: E;
-};
-export declare type ComponentProps<E extends React.ElementType> = ComponentOwnProps<E> & Omit<React.ComponentProps<E>, keyof ComponentOwnProps>;
-declare const defaultElement = "div";
-export declare const Component: <E extends React.ElementType = typeof defaultElement>(props: ComponentProps<E>) => React.ReactElement | null;
-export {};

package/dist/esm/components/Component/Component.js

@@ -1,3 +0,0 @@
-import * as React from 'react';
-const defaultElement = 'div';
-export const Component = React.forwardRef(({ component: El = defaultElement, ...props }, ref) => React.createElement(El, { ref: ref, ...props }));

package/dist/esm/components/Component/index.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-import type { ComponentProps } from './Component';
-export { Component } from './Component';
-export declare type PolymorphicComponentProps<E extends React.ElementType, P> = ComponentProps<E> & P;
-export declare type PolymorphicComponent<P, D extends React.ElementType = 'div'> = <E extends React.ElementType = D>(props: PolymorphicComponentProps<E, P>) => React.ReactElement | null;

package/dist/esm/components/Component/index.js

@@ -1 +0,0 @@
-export { Component } from './Component';

package/dist/esm/components/ConfrigProvider/index.d.ts

@@ -1,25 +0,0 @@
-import * as React from 'react';
-import type { BreakpointsConfig } from '../../types';
-export declare type ColorMode = 'light' | 'dark';
-export declare type ConfigContextConsumerProps = {
-    breakpoints?: Exclude<BreakpointsConfig<number>, 'default'>;
-    cardPrimaryColorMode?: ColorMode;
-    cardSecondaryColorMode?: ColorMode;
-    cardTertiaryColorMode?: ColorMode;
-    direction?: string;
-    inverseGlobalColorMode?: ColorMode;
-    prefixCls: string;
-    sectionPrimaryColorMode?: ColorMode;
-    sectionSecondaryColorMode?: ColorMode;
-    sectionTertiaryColorMode?: ColorMode;
-    tilePrimaryColorMode?: ColorMode;
-    tileSecondaryColorMode?: ColorMode;
-    tileTertiaryColorMode?: ColorMode;
-    [k: string]: any;
-};
-export interface ConfigContextProviderProps extends ConfigContextConsumerProps {
-    children: React.ReactNode | React.ReactNode[];
-}
-export declare const ConfigContext: React.Context<ConfigContextConsumerProps>;
-export declare function useConfig(): ConfigContextConsumerProps;
-export declare function ConfigContextProvider(props: Partial<ConfigContextProviderProps>): JSX.Element;

package/dist/esm/components/ConfrigProvider/index.js

@@ -1,33 +0,0 @@
-import * as React from 'react';
-export const ConfigContext = React.createContext({
-    breakpoints: {
-        l: 960,
-        m: 768,
-        s: 480,
-        xl: 1200,
-        xs: 320,
-    },
-    // cardPrimaryColorMode: 'light',
-    // cardSecondaryColorMode: 'light',
-    // cardTertiaryColorMode: 'light',
-    // inverseGlobalColorMode: 'light',
-    prefixCls: 'uk',
-    // sectionPrimaryColorMode: 'light',
-    // sectionSecondaryColorMode: 'light',
-    // sectionTertiaryColorMode: 'light',
-    // tilePrimaryColorMode: 'light',
-    // tileSecondaryColorMode: 'light',
-    // tileTertiaryColorMode: 'light',
-});
-export function useConfig() {
-    return React.useContext(ConfigContext);
-}
-export function ConfigContextProvider(props) {
-    const { children, ...restProps } = props;
-    const context = React.useMemo(() => ({
-        ...useConfig(),
-        direction: document.dir,
-        ...restProps,
-    }), [restProps]);
-    return (React.createElement(ConfigContext.Provider, { value: context }, children));
-}

package/dist/esm/components/Container/index.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { PolymorphicComponentProps } from '../Component';
-import './index.scss';
-export interface ContainerOwnProps {
-    expandLeft?: boolean;
-    expandRight?: boolean;
-    size?: 'xsmall' | 'small' | 'large' | 'xlarge' | 'expand';
-}
-export declare type ContainerProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, ContainerOwnProps>;
-declare const defaultElement = "div";
-export declare function Container<E extends React.ElementType = typeof defaultElement>(props: ContainerProps<E>): JSX.Element;
-export {};

package/dist/esm/components/Container/index.js

@@ -1,13 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { Component } from '../Component';
-import './index.scss';
-const defaultElement = 'div';
-export function Container(props) {
-    const { className, expandLeft, expandRight, size, ...restProps } = props;
-    return (React.createElement(Component, { className: classNames('uk-container', {
-            [`uk-container-${size}`]: size !== undefined,
-            'uk-container-expand-left': expandLeft,
-            'uk-container-expand-right': expandRight,
-        }, className), component: defaultElement, ...restProps }));
-}

package/dist/esm/components/Control/Checkbox/Checkbox.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-import type { CheckboxProps } from './types';
-export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;

package/dist/esm/components/Control/Checkbox/Checkbox.js

@@ -1,70 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import RcCheckbox from 'rc-checkbox';
-import { useConfig } from '../../ConfrigProvider';
-import { useCheckboxGroup } from './Context';
-export const Checkbox = React.forwardRef((props, ref) => {
-    const config = useConfig();
-    const checkboxGroup = useCheckboxGroup();
-    const { block, children, className, direction = config.direction, prefixCls = config.prefixCls, size, skipGroup, style, onMouseEnter, onMouseLeave, ...restProps } = props;
-    const prevValue = React.useRef(restProps.value);
-    const [internalChecked, setInternalChecked,] = React.useState(restProps.checked || restProps.defaultChecked);
-    const onChange = (event) => {
-        setInternalChecked(!internalChecked);
-        restProps.onChange?.(event);
-    };
-    React.useEffect(() => {
-        checkboxGroup?.registerValue(restProps.value);
-    }, []);
-    React.useEffect(() => {
-        if (skipGroup) {
-            return;
-        }
-        if (restProps.value !== prevValue.current) {
-            checkboxGroup?.cancelValue(prevValue.current);
-            checkboxGroup?.registerValue(restProps.value);
-        }
-        // eslint-disable-next-line consistent-return
-        return () => checkboxGroup?.cancelValue(restProps.value);
-    }, [restProps.value]);
-    React.useEffect(() => {
-        setInternalChecked(restProps.checked || restProps.defaultChecked);
-    }, [restProps.checked, restProps.defaultChecked]);
-    const checkboxProps = React.useMemo(() => ({
-        ...restProps,
-        checked: internalChecked,
-        onChange,
-    }), [restProps, internalChecked]);
-    if (checkboxGroup && !skipGroup) {
-        checkboxProps.onChange = (...args) => {
-            onChange(...args);
-            checkboxGroup.toggleOption?.({
-                label: children,
-                value: restProps.value,
-            });
-        };
-        checkboxProps.checked = checkboxGroup.value?.indexOf(restProps.value) > -1;
-        checkboxProps.disabled = restProps.disabled || checkboxGroup.disabled;
-        checkboxProps.name = checkboxGroup.name;
-    }
-    const rootPrefixCls = React.useMemo(() => `${prefixCls}-checkbox`, [prefixCls]);
-    const controlPrefixCls = React.useMemo(() => `${prefixCls}-control`, [prefixCls]);
-    const wrapperClasses = React.useMemo(() => classNames({
-        [controlPrefixCls]: block,
-        [`${controlPrefixCls}-checkbox`]: block,
-        [`${controlPrefixCls}-${size}`]: block && size,
-        [`${rootPrefixCls}-wrapper`]: true,
-        [`${rootPrefixCls}-rtl`]: direction === 'rtl',
-        [`${prefixCls}-checked`]: internalChecked,
-        [`${prefixCls}-disabled`]: checkboxProps.disabled,
-    }, className), [checkboxProps, block, size, direction]);
-    const checkboxClasses = React.useMemo(() => classNames({
-        [`${rootPrefixCls}-indeterminate`]: checkboxProps.indeterminate,
-    }), [checkboxProps.indeterminate, rootPrefixCls]);
-    return (React.createElement("label", { className: wrapperClasses, style: style, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave },
-        React.createElement(RcCheckbox, { ...checkboxProps, prefixCls: rootPrefixCls, className: checkboxClasses, 
-            // @ts-ignore
-            ref: ref }),
-        children !== undefined && (React.createElement("span", { className: `${rootPrefixCls}-label` }, children))));
-});
-Checkbox.displayName = 'Checkbox';

package/dist/esm/components/Control/Checkbox/Context.d.ts

@@ -1,4 +0,0 @@
-import * as React from 'react';
-import type { CheckboxGroupConsumerProps } from './types';
-export declare const Context: React.Context<CheckboxGroupConsumerProps | null>;
-export declare function useCheckboxGroup(): CheckboxGroupConsumerProps | null;

package/dist/esm/components/Control/Checkbox/Context.js

@@ -1,5 +0,0 @@
-import * as React from 'react';
-export const Context = React.createContext(null);
-export function useCheckboxGroup() {
-    return React.useContext(Context);
-}

package/dist/esm/components/Control/Checkbox/Group.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-import type { CheckboxGroupProps } from './types';
-export declare const Group: React.ForwardRefExoticComponent<CheckboxGroupProps & React.RefAttributes<HTMLDivElement>>;

package/dist/esm/components/Control/Checkbox/Group.js

@@ -1,71 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-import { Checkbox } from './Checkbox';
-import { Context } from './Context';
-export const Group = React.forwardRef((props, ref) => {
-    const { block, children, className, defaultValue, direction, options = [], size, stack, style, onChange, ...restProps } = props;
-    const [value, setValue] = React.useState(restProps.value || defaultValue || []);
-    const [registeredValues, setRegisteredValues] = React.useState([]);
-    const getOptions = React.useCallback(() => options?.map((option) => {
-        if (typeof option === 'string') {
-            return {
-                label: option,
-                value: option,
-            };
-        }
-        return option;
-    }), [options]);
-    const cancelValue = React.useCallback((val) => {
-        setRegisteredValues(prevValues => prevValues.filter(v => v !== val));
-    }, [registeredValues]);
-    const registerValue = React.useCallback((val) => {
-        setRegisteredValues(prevValues => [...prevValues, val]);
-    }, [registeredValues]);
-    const toggleOption = (option) => {
-        const optionIndex = value.indexOf(option.value);
-        const newValue = [...value];
-        if (optionIndex === -1) {
-            newValue.push(option.value);
-        }
-        else {
-            newValue.splice(optionIndex, 1);
-        }
-        if (!('value' in restProps)) {
-            setValue(newValue);
-        }
-        const opts = getOptions();
-        onChange?.(newValue.filter(val => registeredValues.indexOf(val) !== -1)
-            .sort((a, b) => {
-            const indexA = opts.findIndex(opt => opt.value === a);
-            const indexB = opts.findIndex(opt => opt.value === b);
-            return indexA - indexB;
-        }));
-    };
-    React.useEffect(() => {
-        if ('value' in restProps) {
-            setValue(restProps.value || []);
-        }
-    }, [restProps.value]);
-    const checkboxGroupClasses = React.useMemo(() => classNames('uk-checkbox-group', {
-        'uk-checkbox-group-rtl': direction === 'rtl',
-        'uk-checkbox-group-stack': stack,
-    }, className), [direction, stack]);
-    const context = React.useMemo(() => ({
-        cancelValue,
-        disabled: restProps.disabled,
-        name: restProps.name,
-        registerValue,
-        toggleOption,
-        value,
-    }), [
-        cancelValue,
-        restProps.disabled,
-        restProps.name,
-        registerValue,
-        toggleOption,
-        value,
-    ]);
-    return (React.createElement("div", { className: checkboxGroupClasses, style: style, ...restProps, ref: ref },
-        React.createElement(Context.Provider, { value: context }, options?.length > 0 ? getOptions().map(option => (React.createElement(Checkbox, { key: option.value.toString(), block: block, checked: value.indexOf(option.value) > -1, direction: direction, disabled: 'disabled' in option ? option.disabled : restProps.disabled, size: size, value: option.value, className: "uk-checkbox-group-item", style: option.style, onChange: option.onChange }, option.label))) : children)));
-});
-Group.displayName = 'Checkbox.Group';

package/dist/esm/components/Control/Checkbox/index.d.ts

@@ -1,9 +0,0 @@
-import * as React from 'react';
-import { Group } from './Group';
-import type { CheckboxProps } from './types';
-import './index.scss';
-export * from './types';
-export interface CompoundedCheckbox extends React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>> {
-    Group: typeof Group;
-}
-export declare const Checkbox: CompoundedCheckbox;

package/dist/esm/components/Control/Checkbox/index.js

@@ -1,6 +0,0 @@
-import { Checkbox as InternalCheckbox } from './Checkbox';
-import { Group } from './Group';
-import './index.scss';
-export * from './types';
-export const Checkbox = InternalCheckbox;
-Checkbox.Group = Group;