@cube-dev/ui-kit 0.9.6 → 0.9.7

package/dist/es/components/overlays/Tooltip/TooltipProvider.js

@@ -1,23 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { TooltipTrigger } from './TooltipTrigger';
-import { Tooltip } from './Tooltip';
-import { useEffect, useState } from 'react';
-function TooltipProvider(props) {
-    const [rendered, setRendered] = useState(false);
-    const { title, children, tooltipStyles, width, ...otherProps } = props;
-    useEffect(() => {
-        setRendered(true);
-    });
-    return rendered ? (_jsxs(TooltipTrigger, { ...otherProps, children: [children, _jsx(Tooltip, { styles: tooltipStyles, ...(width ? { width } : null), children: title }, void 0)] }, void 0)) : (_jsx(_Fragment, { children: "children" }, void 0));
-}
-let _TooltipProvider = TooltipProvider;
-export { _TooltipProvider as TooltipProvider };
-
-        

package/dist/es/components/overlays/Tooltip/TooltipTrigger.js

@@ -1,69 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FocusableProvider } from '@react-aria/focus';
-import { Children, useRef } from 'react';
-import { TooltipContext } from './context';
-import { useOverlayPosition } from '@react-aria/overlays';
-import { useTooltipTrigger } from '@react-aria/tooltip';
-import { useTooltipTriggerState } from '@react-stately/tooltip';
-import { OverlayWrapper } from '../OverlayWrapper';
-import { ActiveZone } from '../../content/ActiveZone/ActiveZone';
-import { Block } from '../../Block';
-const DEFAULT_OFFSET = 8; // Offset needed to reach 4px/5px (med/large) distance between tooltip and trigger button
-const DEFAULT_CROSS_OFFSET = 0;
-function TooltipTrigger(props) {
-    let { children, activeWrap, crossOffset = DEFAULT_CROSS_OFFSET, isDisabled, isMaterial, offset = DEFAULT_OFFSET, trigger: triggerAction, } = props;
-    let [trigger, tooltip] = Children.toArray(children);
-    let state = useTooltipTriggerState({
-        delay: 750,
-        ...props,
-    });
-    let tooltipTriggerRef = useRef(null);
-    let overlayRef = useRef(null);
-    let { triggerProps, tooltipProps } = useTooltipTrigger({
-        isDisabled,
-        trigger: triggerAction,
-    }, state, tooltipTriggerRef);
-    let { overlayProps, arrowProps, placement } = useOverlayPosition({
-        placement: props.placement || 'top',
-        targetRef: tooltipTriggerRef,
-        overlayRef,
-        offset,
-        crossOffset,
-        isOpen: state.isOpen,
-    });
-    if (!activeWrap && typeof trigger === 'string') {
-        console.warn('CubeUIKit: Tooltips are only supported on elements that are both focusable and hoverable. To solve this issue you can: 1) Use active element as a trigger (`Button`, `Link`, etc); 2) Use `activeWrap` attribute to automatically wrap the content; 3) Use `ActiveZone` component to manually wrap the content.');
-        return _jsx(Block, { children: trigger }, void 0);
-    }
-    function onClick(e) {
-        var _a;
-        (_a = e === null || e === void 0 ? void 0 : e.currentTarget) === null || _a === void 0 ? void 0 : _a.parentNode.click();
-    }
-    return (_jsxs(FocusableProvider, { ...triggerProps, ref: tooltipTriggerRef, children: [activeWrap ? (_jsx(ActiveZone, { onClick: onClick, children: trigger }, void 0)) : (trigger), _jsx(TooltipContext.Provider, { value: {
-                    state,
-                    placement,
-                    ref: overlayRef,
-                    overlayProps,
-                    arrowProps,
-                    minOffset: 'var(--gap)',
-                    minScale: '1',
-                    isMaterial,
-                    ...tooltipProps,
-                }, children: _jsx(OverlayWrapper, { isOpen: state.isOpen, placement: props.placement || 'top', children: tooltip }, void 0) }, void 0)] }, void 0));
-}
-/**
- * TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing
- * the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip
- * relative to the trigger.
- */
-let _TooltipTrigger = TooltipTrigger;
-export { _TooltipTrigger as TooltipTrigger };
-
-        

package/dist/es/components/overlays/Tooltip/context.js

@@ -1,11 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-import React from 'react';
-export const TooltipContext = React.createContext({});
-
-        

package/dist/es/components/pickers/ComboBox/ComboBox.js

@@ -1,168 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CheckOutlined, LoadingOutlined, WarningOutlined, } from '@ant-design/icons';
-import { mergeProps } from '@react-aria/utils';
-import { cloneElement, forwardRef, useState } from 'react';
-import { useComboBoxState } from '@react-stately/combobox';
-import { useComboBox } from '@react-aria/combobox';
-import { useButton } from '@react-aria/button';
-import { useFormProps } from '../../forms/Form';
-import { useHover } from '@react-aria/interactions';
-import { useProviderProps } from '../../../provider';
-import { useFilter } from '@react-aria/i18n';
-import { Base } from '../../Base';
-import { extractStyles } from '../../../utils/styles';
-import { BLOCK_STYLES, OUTER_STYLES } from '../../../styles/list';
-import { useFocus } from '../../../utils/interactions';
-import { useContextStyles } from '../../../providers/StylesProvider';
-import { modAttrs, useCombinedRefs } from '../../../utils/react';
-import { FieldWrapper } from '../../forms/FieldWrapper';
-import { ListBoxPopup } from '../Select/Select';
-import { Prefix } from '../../layout/Prefix';
-import { Suffix } from '../../layout/Suffix';
-import { Space } from '../../layout/Space';
-import { Item } from '@react-stately/collections';
-import { DEFAULT_INPUT_STYLES } from '../../forms/TextInput/TextInputBase';
-import { useOverlayPosition } from '@react-aria/overlays';
-import { OverlayWrapper } from '../../overlays/OverlayWrapper';
-const CaretDownIcon = () => (_jsx("svg", { "aria-hidden": "true", width: "14", height: "14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M11.49 4.102H2.51c-.269 0-.42.284-.253.478l4.49 5.206a.342.342 0 00.506 0l4.49-5.206c.167-.194.016-.478-.253-.478z", fill: "currentColor" }, void 0) }, void 0));
-const COMBOBOX_STYLES = {
-    position: 'relative',
-    display: 'grid',
-};
-const INPUT_STYLES = {
-    ...DEFAULT_INPUT_STYLES,
-    width: '100%',
-};
-const TRIGGER_STYLES = {
-    display: 'grid',
-    placeItems: 'center',
-    placeContent: 'center',
-    placeSelf: 'stretch',
-    radius: 'right',
-    padding: '0 1x',
-    color: 'inherit',
-    border: 0,
-    fill: {
-        '': '#purple.0',
-        hovered: '#dark.04',
-        pressed: '#dark.08',
-        disabled: '#clear',
-    },
-    cursor: 'pointer',
-};
-function ComboBox(props, ref) {
-    var _a;
-    props = useProviderProps(props);
-    props = useFormProps(props);
-    let { qa, label, labelPosition = 'top', labelStyles, isRequired, necessityIndicator, validationState, prefix, isDisabled, multiLine, autoFocus, inputRef, triggerRef, popoverRef, listBoxRef, isLoading, loadingIndicator, overlayOffset = 8, inputStyles, optionStyles, triggerStyles, suffix, listBoxStyles, overlayStyles, hideTrigger, message, description, size, autoComplete = 'off', direction = 'bottom', shouldFlip = true, requiredMark = true, menuTrigger = 'input', loadingState, filter, styles, ...otherProps } = props;
-    let isAsync = loadingState != null;
-    let { contains } = useFilter({ sensitivity: 'base' });
-    let [suffixWidth, setSuffixWidth] = useState(0);
-    let [prefixWidth, setPrefixWidth] = useState(0);
-    let state = useComboBoxState({
-        ...props,
-        defaultFilter: filter || contains,
-        allowsEmptyCollection: isAsync,
-    });
-    const outerStyles = extractStyles(otherProps, OUTER_STYLES, {
-        ...COMBOBOX_STYLES,
-        ...useContextStyles('ComboBox_Wrapper', props),
-        ...styles,
-    });
-    inputStyles = extractStyles(otherProps, BLOCK_STYLES, {
-        ...INPUT_STYLES,
-        ...useContextStyles('ComboBox', props),
-        ...inputStyles,
-    });
-    triggerStyles = {
-        ...TRIGGER_STYLES,
-        ...useContextStyles('ComboBox_Trigger', props),
-        ...triggerStyles,
-    };
-    ref = useCombinedRefs(ref);
-    inputRef = useCombinedRefs(inputRef);
-    triggerRef = useCombinedRefs(triggerRef);
-    popoverRef = useCombinedRefs(popoverRef);
-    listBoxRef = useCombinedRefs(listBoxRef);
-    let { labelProps, inputProps, listBoxProps, buttonProps: triggerProps, } = useComboBox({
-        ...props,
-        inputRef,
-        buttonRef: triggerRef,
-        listBoxRef,
-        popoverRef,
-        menuTrigger,
-    }, state);
-    let { overlayProps, placement } = useOverlayPosition({
-        targetRef: triggerRef,
-        overlayRef: popoverRef,
-        scrollRef: listBoxRef,
-        placement: `${direction} end`,
-        shouldFlip: shouldFlip,
-        isOpen: state.isOpen,
-        onClose: state.close,
-        offset: overlayOffset,
-    });
-    if (prefix) {
-        inputStyles.paddingLeft = `${prefixWidth}px`;
-    }
-    inputStyles.paddingRight = `${suffixWidth}px`;
-    let { isFocused, focusProps } = useFocus({ isDisabled });
-    let { hoverProps, isHovered } = useHover({ isDisabled });
-    // Get props for the button based on the trigger props from useComboBox
-    let { buttonProps, isPressed: isTriggerPressed } = useButton(triggerProps, triggerRef);
-    let { hoverProps: triggerHoverProps, isHovered: isTriggerHovered } = useHover({ isDisabled });
-    let { focusProps: triggerFocusProps, isFocused: isTriggerFocused } = useFocus({ isDisabled }, true);
-    let isInvalid = validationState === 'invalid';
-    let validationIcon = isInvalid ? (_jsx(WarningOutlined, { style: { color: 'var(--danger-color)' } }, void 0)) : (_jsx(CheckOutlined, { style: { color: 'var(--success-color)' } }, void 0));
-    let validation = cloneElement(validationIcon);
-    let comboBoxWidth = (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth;
-    let comboBoxField = (_jsxs(Base, { ref: ref, qa: "ComboBoxWrapper", ...modAttrs({
-            invalid: isInvalid,
-            valid: validationState === 'valid',
-            disabled: isDisabled,
-            hovered: isHovered,
-            focused: isFocused,
-        }), styles: outerStyles, style: {
-            zIndex: isFocused ? 1 : 'initial',
-        }, "data-size": size, children: [_jsx(Base, { qa: qa || 'ComboBox', as: "input", ...mergeProps(inputProps, hoverProps, focusProps), ref: inputRef, autoComplete: autoComplete, styles: inputStyles, ...modAttrs({
-                    invalid: isInvalid,
-                    valid: validationState === 'valid',
-                    disabled: isDisabled,
-                    hovered: isHovered,
-                    focused: isFocused,
-                }), "data-size": size }, void 0), prefix ? (_jsx(Prefix, { onWidthChange: setPrefixWidth, padding: "0 1x 0 1.5x", opacity: isDisabled ? '@disabled-opacity' : false, placeItems: "center", outerGap: 0, children: prefix }, void 0)) : null, _jsxs(Suffix, { onWidthChange: setSuffixWidth, opacity: isDisabled ? '@disabled-opacity' : false, children: [validationState || isLoading ? (_jsxs(Space, { gap: false, padding: "0 1x", children: [validationState && !isLoading ? validation : null, isLoading && _jsx(LoadingOutlined, {}, void 0)] }, void 0)) : null, suffix, !hideTrigger ? (_jsx(Base, { as: "button", ...mergeProps(buttonProps, triggerFocusProps, triggerHoverProps), ...modAttrs({
-                            pressed: isTriggerPressed,
-                            focused: isTriggerFocused,
-                            hovered: isTriggerHovered,
-                            disabled: isDisabled,
-                        }), "data-size": size, isDisabled: isDisabled, ref: triggerRef, styles: triggerStyles, children: _jsx(CaretDownIcon, {}, void 0) }, void 0)) : null] }, void 0), _jsx(OverlayWrapper, { isOpen: state.isOpen && !isDisabled, children: _jsx(ListBoxPopup, { ...listBoxProps, listBoxRef: listBoxRef, popoverRef: popoverRef, overlayProps: overlayProps, shouldUseVirtualFocus: true, placement: placement, state: state, listBoxStyles: listBoxStyles, overlayStyles: overlayStyles, optionStyles: optionStyles, minWidth: comboBoxWidth }, void 0) }, void 0)] }, void 0));
-    return (_jsx(FieldWrapper, { ...{
-            labelPosition,
-            label,
-            styles,
-            isRequired,
-            labelStyles,
-            necessityIndicator,
-            labelProps,
-            isDisabled,
-            validationState,
-            message,
-            description,
-            requiredMark,
-            Component: comboBoxField,
-            ref: ref,
-        } }, void 0));
-}
-const _ComboBox = forwardRef(ComboBox);
-const __ComboBox = Object.assign(_ComboBox, { Item });
-__ComboBox.cubeInputType = 'ComboBox';
-export { __ComboBox as ComboBox };
-
-        

package/dist/es/components/pickers/Select/Select.js

@@ -1,254 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-import { createElement as _createElement } from "react";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CheckOutlined, LoadingOutlined, WarningOutlined, } from '@ant-design/icons';
-import { mergeProps } from '../../../utils/react';
-import { cloneElement, forwardRef, useRef, useState, } from 'react';
-import { useSelectState } from '@react-stately/select';
-import { HiddenSelect, useSelect } from '@react-aria/select';
-import { useListBox, useOption } from '@react-aria/listbox';
-import { useButton } from '@react-aria/button';
-import { FocusScope } from '@react-aria/focus';
-import { DismissButton, useOverlay, useOverlayPosition, } from '@react-aria/overlays';
-import { useFormProps } from '../../forms/Form/Form';
-import { useFocus as useAriaFocus, useHover } from '@react-aria/interactions';
-import { useProviderProps } from '../../../provider';
-import { Base } from '../../Base';
-import { extractStyles } from '../../../utils/styles';
-import { BLOCK_STYLES, OUTER_STYLES } from '../../../styles/list';
-import { useFocus } from '../../../utils/interactions';
-import { useContextStyles } from '../../../providers/StylesProvider';
-import { useCombinedRefs } from '../../../utils/react';
-import { FieldWrapper } from '../../forms/FieldWrapper';
-import { Item } from '@react-stately/collections';
-import { OverlayWrapper } from '../../overlays/OverlayWrapper';
-import { getOverlayTransitionCSS } from '../../../utils/transitions';
-const CaretDownIcon = () => (_jsx("svg", { "aria-hidden": "true", width: "14", height: "14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M11.49 4.102H2.51c-.269 0-.42.284-.253.478l4.49 5.206a.342.342 0 00.506 0l4.49-5.206c.167-.194.016-.478-.253-.478z", fill: "currentColor" }, void 0) }, void 0));
-const SELECT_STYLES = {
-    display: 'grid',
-    position: 'relative',
-};
-const INPUT_STYLES = {
-    display: 'grid',
-    flow: 'column',
-    gridColumns: {
-        '': '1fr auto',
-        'with-prefix': 'auto 1fr auto',
-    },
-    placeItems: 'center stretch',
-    placeContent: 'center stretch',
-    gap: '1x',
-    padding: {
-        '': '(1.25x - 1bw) 1x (1.25x - 1bw) (1.5x - 1bw)',
-        '[data-size="small"]': '(.75x - 1px) 1x (.75x - 1px)  (1.5x - 1px)',
-    },
-    border: {
-        '': true,
-        invalid: '#danger-text.50',
-        valid: '#success-text.50',
-        focused: true,
-    },
-    radius: true,
-    reset: 'input',
-    preset: 'default',
-    outline: {
-        '': '#purple-03.0',
-        focused: '#purple-03',
-    },
-    color: {
-        '': '#dark.85',
-        invalid: '#danger-text',
-        focused: '#dark.85',
-        disabled: '#dark.30',
-    },
-    fill: {
-        '': '#purple.0',
-        hovered: '#dark.04',
-        pressed: '#dark.08',
-        disabled: '#dark.04',
-    },
-    fontWeight: 400,
-    textAlign: 'left',
-    cursor: 'pointer',
-    transition: 'theme',
-};
-const OVERLAY_STYLES = {
-    position: 'absolute',
-};
-const LISTBOX_STYLES = {
-    display: 'flex',
-    gap: '.5x',
-    flow: 'column',
-    margin: '0',
-    padding: '.5x',
-    listStyle: 'none',
-    radius: true,
-    fill: '#white',
-    shadow: '0px 4px 16px #shadow',
-    height: 'initial 30x',
-    overflow: 'hidden auto',
-    styledScrollbar: true,
-};
-const OPTION_STYLES = {
-    display: 'block',
-    padding: '(1x - 1px) (1.5x - 1px)',
-    cursor: 'pointer',
-    radius: true,
-    fill: {
-        '': '#white',
-        focused: '#dark.04',
-        selected: '#purple',
-        'focused & selected': '#purple-text',
-        disabled: '#dark.04',
-    },
-    color: {
-        '': '#dark.85',
-        selected: '#white',
-        disabled: '#dark.30',
-    },
-    preset: 't3m',
-};
-function Select(props, ref) {
-    var _a;
-    props = useProviderProps(props);
-    props = useFormProps(props);
-    let { qa, label, labelPosition = 'top', labelStyles, isRequired, necessityIndicator, validationState, prefix, isDisabled, autoFocus, inputProps, triggerRef, popoverRef, listBoxRef, isLoading, loadingIndicator, overlayOffset = 8, inputStyles, optionStyles, suffix, listBoxStyles, overlayStyles, message, description, direction = 'bottom', shouldFlip = true, requiredMark = true, placeholder, tooltip, size, styles, ...otherProps } = props;
-    let state = useSelectState(props);
-    const outerStyles = extractStyles(otherProps, OUTER_STYLES, {
-        ...SELECT_STYLES,
-        ...useContextStyles('Select_Wrapper', otherProps),
-        ...styles,
-    });
-    inputStyles = extractStyles(otherProps, BLOCK_STYLES, {
-        ...INPUT_STYLES,
-        ...useContextStyles('Select', otherProps),
-        ...inputStyles,
-    });
-    if (styles) {
-    }
-    ref = useCombinedRefs(ref);
-    triggerRef = useCombinedRefs(triggerRef);
-    popoverRef = useCombinedRefs(popoverRef);
-    listBoxRef = useCombinedRefs(listBoxRef);
-    let { labelProps, triggerProps, valueProps, menuProps } = useSelect(props, state, triggerRef);
-    let { overlayProps, placement } = useOverlayPosition({
-        targetRef: triggerRef,
-        overlayRef: popoverRef,
-        scrollRef: listBoxRef,
-        // @ts-ignore
-        placement: `${direction} end`,
-        shouldFlip: shouldFlip,
-        isOpen: state.isOpen,
-        onClose: state.close,
-        offset: overlayOffset,
-    });
-    let { isFocused, focusProps } = useFocus({ isDisabled }, true);
-    let { hoverProps, isHovered } = useHover({ isDisabled });
-    // Get props for the button based on the trigger props from useSelect
-    let { buttonProps } = useButton(triggerProps, triggerRef);
-    let isInvalid = validationState === 'invalid';
-    let validationIcon = isInvalid ? (_jsx(WarningOutlined, { style: { color: 'var(--danger-color)' } }, void 0)) : (_jsx(CheckOutlined, { style: { color: 'var(--success-color)' } }, void 0));
-    let validation = cloneElement(validationIcon);
-    let triggerWidth = (_a = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth;
-    let selectField = (_jsxs(Base, { qa: "SelectWrapper", mods: {
-            invalid: isInvalid,
-            valid: validationState === 'valid',
-            disabled: isDisabled,
-            hovered: isHovered,
-            focused: isFocused,
-        }, styles: outerStyles, "data-size": size, children: [_jsx(HiddenSelect, { state: state, triggerRef: triggerRef, label: props.label, name: props.name }, void 0), _jsxs(Base, { qa: qa || 'Select', as: "button", ...mergeProps(buttonProps, hoverProps, focusProps), ref: triggerRef, styles: inputStyles, "data-size": size, mods: {
-                    invalid: isInvalid,
-                    valid: validationState === 'valid',
-                    disabled: isDisabled,
-                    hovered: isHovered,
-                    focused: isFocused,
-                    'with-prefix': !!prefix,
-                }, children: [prefix, _jsx("span", { ...valueProps, children: state.selectedItem ? state.selectedItem.rendered : placeholder }, void 0), (validationState || isLoading || suffix) && (_jsxs("div", { children: [validationState && !isLoading ? validation : null, isLoading && _jsx(LoadingOutlined, {}, void 0), suffix] }, void 0)), _jsx(CaretDownIcon, {}, void 0)] }, void 0), _jsx(OverlayWrapper, { isOpen: state.isOpen && !isDisabled, children: _jsx(ListBoxPopup, { ...menuProps, popoverRef: popoverRef, listBoxRef: listBoxRef, overlayProps: overlayProps, placement: placement, state: state, listBoxStyles: listBoxStyles, overlayStyles: overlayStyles, optionStyles: optionStyles, minWidth: triggerWidth }, void 0) }, void 0)] }, void 0));
-    return (_jsx(FieldWrapper, { ...{
-            labelPosition,
-            label,
-            styles,
-            isRequired,
-            labelStyles,
-            necessityIndicator,
-            labelProps,
-            isDisabled,
-            validationState,
-            message,
-            description,
-            requiredMark,
-            tooltip,
-            Component: selectField,
-            ref: ref,
-        } }, void 0));
-}
-export function ListBoxPopup({ state, popoverRef, listBoxRef, listBoxStyles, overlayStyles, optionStyles, overlayProps: parentOverlayProps, shouldUseVirtualFocus = false, placement, minWidth, ...otherProps }) {
-    // Get props for the listbox
-    let { listBoxProps } = useListBox({
-        autoFocus: state.focusStrategy || true,
-        shouldUseVirtualFocus,
-        ...otherProps,
-    }, state, listBoxRef);
-    listBoxStyles = {
-        ...LISTBOX_STYLES,
-        ...useContextStyles('ListBoxPopup'),
-        ...listBoxStyles,
-    };
-    // Handle events that should cause the popup to close,
-    // e.g. blur, clicking outside, or pressing the escape key.
-    let { overlayProps } = useOverlay({
-        onClose: () => state.close(),
-        shouldCloseOnBlur: true,
-        isOpen: state.isOpen,
-        isDismissable: true,
-    }, popoverRef);
-    // Wrap in <FocusScope> so that focus is restored back to the
-    // trigger when the popup is closed. In addition, add hidden
-    // <DismissButton> components at the start and end of the list
-    // to allow screen reader users to dismiss the popup easily.
-    return (_jsx(Base, { styles: {
-            minWidth: minWidth ? `${minWidth}px` : 'initial',
-            ...OVERLAY_STYLES,
-            overlayStyles,
-        }, ...parentOverlayProps, ...overlayProps, css: getOverlayTransitionCSS({ placement }), "data-position": placement, ref: popoverRef, children: _jsxs(FocusScope, { restoreFocus: true, children: [_jsx(DismissButton, { onDismiss: () => state.close() }, void 0), _jsx(Base, { as: "ul", styles: listBoxStyles, ...mergeProps(listBoxProps, otherProps), ref: listBoxRef, children: Array.from(state.collection).map((item) => (_jsx(Option, { item: item, state: state, styles: optionStyles, shouldUseVirtualFocus: shouldUseVirtualFocus }, item.key))) }, void 0), _jsx(DismissButton, { onDismiss: () => state.close() }, void 0)] }, void 0) }, void 0));
-}
-function Option({ item, state, styles, shouldUseVirtualFocus }) {
-    let ref = useRef(null);
-    let isDisabled = state.disabledKeys.has(item.key);
-    let isSelected = state.selectionManager.isSelected(item.key);
-    let isVirtualFocused = state.selectionManager.focusedKey === item.key;
-    styles = {
-        ...OPTION_STYLES,
-        ...useContextStyles('Option'),
-        ...styles,
-    };
-    let { optionProps } = useOption({
-        key: item.key,
-        isDisabled,
-        isSelected,
-        shouldSelectOnPressUp: true,
-        shouldFocusOnHover: true,
-        shouldUseVirtualFocus,
-    }, state, ref);
-    // Handle focus events so we can apply highlighted
-    // style to the focused option
-    let [isFocused, setFocused] = useState(false);
-    let { focusProps } = useAriaFocus({ onFocusChange: setFocused });
-    return (_createElement(Base, { as: "li", ...mergeProps(optionProps, focusProps), ref: ref, mods: {
-            selected: isSelected,
-            focused: shouldUseVirtualFocus ? isVirtualFocused : isFocused,
-            disabled: isDisabled,
-        }, "data-theme": isSelected ? 'special' : undefined, styles: styles, key: item.key }, item.rendered));
-}
-const _Select = forwardRef(Select);
-_Select.cubeInputType = 'Select';
-const __Select = Object.assign(_Select, { Item });
-export { __Select as Select };
-
-        

package/dist/es/components/portal/Portal.js

@@ -1,41 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import ReactDOM from 'react-dom';
-import { usePortal } from './usePortal';
-/**
- * This component renders its children outside the current DOM hierarchy.
- *
- * React [doesn't support](https://github.com/facebook/react/issues/13097) portal API in SSR, so, if you want to
- * render a Portal in SSR, use prop `disabled`.
- *
- * By default, Portal's children render under the `<Root />` component.
- *
- * ***Important***: Since React doesn't support portals on SSR, `<Portal />` children renders in the next tick.
- * If you need to make some computations, use the `onMount` callback
- *
- * @see https://reactjs.org/docs/portals.html
- *
- * @example ```jsx
- *  <div>
- *    Portal will be rendered outside me!
- *
- *    <Portal>
- *      <div>some content will be showed outside of parent container</div>
- *    </Portal>
- *  </div>
- * ```
- */
-export function Portal(props) {
-    const { children, mountRoot, isDisabled } = usePortal(props);
-    if (isDisabled)
-        return _jsx(_Fragment, { children: children }, void 0);
-    return mountRoot ? ReactDOM.createPortal(children, mountRoot) : null;
-}
-
-        

package/dist/es/components/portal/PortalProvider.js

@@ -1,24 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-import { createContext, useContext } from 'react';
-const PortalContext = createContext(null);
-/**
- * @private
- * @internal Don't even try to use it
- */
-export function usePortalContext() {
-    const root = useContext(PortalContext);
-    return { root };
-}
-/**
- * @private
- * @internal Don't even try to use it
- */
-export const PortalProvider = PortalContext.Provider;
-
-        

package/dist/es/components/portal/index.js

@@ -1,11 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-export { PortalProvider } from './PortalProvider';
-export * from './Portal';
-
-        

package/dist/es/components/portal/storybook/templates/basic.js

@@ -1,13 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { Portal } from '../../Portal';
-import { Divider } from '../../../content/Divider';
-export const Basic = (args) => (_jsxs(_Fragment, { children: ["By default, Portal content should be there ", ' -> ', _jsxs(Portal, { ...args, children: ["Portal's content.", !args.isDisabled && ' But, if you disable me, I\'ll be near the arrow'] }, void 0), _jsx(Divider, {}, void 0)] }, void 0));
-
-        

package/dist/es/components/portal/storybook/templates/index.js

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-export * from './basic';
-
-        

package/dist/es/components/portal/types.js

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-export {};
-
-