draft-components 1.12.0 → 2.0.0

package/esm/components/nav-list/nav-list-item.js

@@ -1,18 +0,0 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-import { Badge } from '../badge/badge.js';
-
-function NavListItem({ className, icon, badge, children, renderAs, ...props }) {
-    className = classNames(className, 'dc-nav-link');
-    children = (jsxs(Fragment, { children: [icon != null && jsxs("div", { className: "dc-nav-link__icon", children: [icon, " "] }), jsx("div", { className: "dc-nav-link__text", children: children }), badge != null && jsxs(Fragment, { children: ["\u00A0", jsx(Badge, { className: "dc-nav-link__badge", children: badge })] })] }));
-    let content;
-    if (typeof renderAs === 'function') {
-        content = renderAs({ className, children });
-    }
-    else {
-        content = jsx("a", { ...props, className: className, children: children });
-    }
-    return jsx("li", { className: "dc-nav-list__item", children: content });
-}
-
-export { NavListItem };

package/esm/components/nav-list/nav-list-title.js

@@ -1,8 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-
-function NavListTitle({ className, children, ...props }) {
-    return (jsx("li", { ...props, className: classNames('dc-nav-list__title', className), children: children }));
-}
-
-export { NavListTitle };

package/esm/components/nav-list/nav-list.js

@@ -1,8 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-
-function NavList({ className, children, ...props }) {
-    return (jsx("nav", { ...props, className: classNames('dc-nav-list', className), children: jsx("ul", { className: "dc-nav-list__items", children: children }) }));
-}
-
-export { NavList };

package/esm/components/password-input/icons.js

@@ -1,10 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-function EyeIcon(props) {
-    return (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 24, height: 24, fill: "none", strokeWidth: 1.5, stroke: "currentColor", ...props, children: [jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z" }), jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" })] }));
-}
-function EyeSlashIcon(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 24, height: 24, fill: "none", strokeWidth: 1.5, stroke: "currentColor", ...props, children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3.98 8.223A10.477 10.477 0 001.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.45 10.45 0 0112 4.5c4.756 0 8.773 3.162 10.065 7.498a10.523 10.523 0 01-4.293 5.774M6.228 6.228L3 3m3.228 3.228l3.65 3.65m7.894 7.894L21 21m-3.228-3.228l-3.65-3.65m0 0a3 3 0 10-4.243-4.243m4.242 4.242L9.88 9.88" }) }));
-}
-
-export { EyeIcon, EyeSlashIcon };

package/esm/components/password-input/password-input.js

@@ -1,28 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useState } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-import { TextInput } from '../text-input/text-input.js';
-import { Tooltip } from '../tooltip/tooltip.js';
-import { EyeIcon, EyeSlashIcon } from './icons.js';
-
-const PasswordInput = forwardRef(function PasswordInput({ isDefaultVisible = false, showPasswordTitle = 'Show password', hidePasswordTitle = 'Hide password', className, ...props }, ref) {
-    const [visible, setVisible] = useState(isDefaultVisible);
-    let type;
-    let content;
-    let Icon;
-    if (visible) {
-        type = 'text';
-        content = hidePasswordTitle;
-        Icon = EyeIcon;
-    }
-    else {
-        type = 'password';
-        content = showPasswordTitle;
-        Icon = EyeSlashIcon;
-    }
-    const handleButtonClick = () => setVisible(!visible);
-    const renderRightAddOn = ({ className }) => (jsx("div", { className: classNames('dc-password-input__right-addon', className), children: jsx(Tooltip, { content: content, children: jsx("button", { className: "dc-password-input__btn", type: "button", onClick: handleButtonClick, children: jsx(Icon, { className: "dc-password-input__icon", "aria-hidden": true }) }) }) }));
-    return (jsx(TextInput, { ...props, className: classNames('dc-password-input', className), ref: ref, type: type, rightAddOn: renderRightAddOn }));
-});
-
-export { PasswordInput };

package/esm/components/radio/radio.js

@@ -1,26 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const Radio = forwardRef(function Radio({ icon = 'dot', style, className, onChange, onToggle, ...props }, ref) {
-    let iconElement;
-    switch (icon) {
-        case 'check':
-            iconElement = jsx(CheckIcon, { className: "dc-radio__icon", "data-testid": "radio-check-icon" });
-            break;
-        default:
-            iconElement = jsx(DotIcon, { className: "dc-radio__icon", "data-testid": "radio-dot-icon" });
-    }
-    return (jsxs("label", { style: style, className: classNames('dc-radio', className), children: [jsx("input", { ...props, ref: ref, type: "radio", className: "dc-radio__input", onChange: (event) => {
-                    onChange?.(event);
-                    onToggle?.(event.target.checked);
-                } }), jsx("span", { className: "dc-radio__check", "data-testid": "radio-check", "aria-hidden": true, children: iconElement })] }));
-});
-function CheckIcon(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", width: 20, height: 20, ...props, children: jsx("path", { d: "M5 10.4444L9 14L15 6", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }) }));
-}
-function DotIcon(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", width: 20, height: 20, ...props, children: jsx("circle", { cx: 10, cy: 10, r: 4, fill: "currentColor" }) }));
-}
-
-export { Radio };

package/esm/components/segmented-control/segmented-control-button.js

@@ -1,13 +0,0 @@
-import { jsxs } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-
-function SegmentedControlButton({ className, checked, icon, children, value, onChangeValue, }) {
-    function handleClick() {
-        if (!checked) {
-            onChangeValue(value);
-        }
-    }
-    return (jsxs("li", { className: classNames(className, 'dc-segmented__button'), role: "radio", "data-value": value, "aria-checked": checked, tabIndex: checked ? 0 : -1, onClick: handleClick, children: [icon, children] }));
-}
-
-export { SegmentedControlButton };

package/esm/components/segmented-control/segmented-control.js

@@ -1,46 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { useRef } from 'react';
-import { KeyboardKeys } from '../../lib/keyboard-keys.js';
-import { assertIfNullable } from '../../lib/helpers.js';
-import { classNames, focusElement } from '../../lib/react-helpers.js';
-import { SegmentedControlButton } from './segmented-control-button.js';
-
-function SegmentedControl({ size = 'md', disabled = false, className, value, options, onChangeValue, ...props }) {
-    const ref = useRef(null);
-    function handleKeyDown(event) {
-        const prevIndex = options.findIndex((option) => option.value === value);
-        const containerEl = ref.current;
-        assertIfNullable(containerEl, 'ref.current is null or undefined');
-        let index = prevIndex;
-        if (event.key === KeyboardKeys.ArrowRight ||
-            event.key === KeyboardKeys.ArrowDown) {
-            index += 1;
-        }
-        else if (event.key === KeyboardKeys.ArrowLeft ||
-            event.key === KeyboardKeys.ArrowUp) {
-            index -= 1;
-        }
-        if (index < 0) {
-            index = options.length - 1;
-        }
-        else if (index >= options.length) {
-            index = 0;
-        }
-        if (index !== prevIndex) {
-            event.stopPropagation();
-            event.preventDefault();
-            const option = options[index];
-            assertIfNullable(option, `Unable to get option at index ${index}`);
-            onChangeValue(option.value);
-            const radioEl = containerEl.children[index];
-            assertIfNullable(radioEl, `Unable to get radio at index ${index}`);
-            focusElement(radioEl);
-        }
-    }
-    return (jsx("ul", { ...props, ref: ref, role: "radiogroup", className: classNames(className, 'dc-segmented', {
-            [`dc-segmented_${size}`]: size,
-            'dc-segmented_disabled': disabled,
-        }), onKeyDown: handleKeyDown, children: options.map((option) => (jsx(SegmentedControlButton, { icon: option.icon, value: option.value, checked: value === option.value, onChangeValue: onChangeValue, children: option.label }, option.value))) }));
-}
-
-export { SegmentedControl };

package/esm/components/select/select.js

@@ -1,37 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-import { Spinner } from '../spinner/spinner.js';
-
-const Select = forwardRef(function Select({ hasError, isBlock, size = 'md', style, className, loading, disabled, multiple, htmlSize, children, onChange, onChangeValue, ...props }, ref) {
-    const onValueChanged = (event) => {
-        if (typeof onChange === 'function') {
-            onChange(event);
-        }
-        if (typeof onChangeValue === 'function') {
-            if (multiple === true) {
-                const values = Array.from(event.target.options)
-                    .filter((option) => option.selected)
-                    .map((option) => option.value);
-                onChangeValue(values);
-            }
-            else {
-                onChangeValue(event.target.value);
-            }
-        }
-    };
-    let addOn = (jsx("svg", { className: "dc-select__arrow", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 24, height: 24, fill: "none", stroke: "currentColor", strokeWidth: 1.5, "aria-hidden": true, children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M8.25 15L12 18.75 15.75 15m-7.5-6L12 5.25 15.75 9" }) }));
-    if (loading) {
-        addOn = (jsx(Spinner, { className: "dc-select__spinner", color: "currentColor", size: 16 }));
-    }
-    return (jsxs("div", { style: style, className: classNames(className, 'dc-select__container', {
-            [`dc-select__container_${size}`]: size !== undefined,
-            'dc-select__container_multiple': multiple,
-            'dc-select__container_loading': loading,
-            'dc-select__container_disabled': disabled,
-            'dc-select__container_has_error': hasError,
-            'dc-select__container_block': isBlock,
-        }), children: [jsx("select", { ...props, ref: ref, className: "dc-select", size: htmlSize, multiple: multiple, disabled: disabled || loading, onChange: onValueChanged, children: children }), jsx("span", { className: "dc-select__add-on", "aria-hidden": true, children: addOn })] }));
-});
-
-export { Select };

package/esm/components/selection-control/selection-control.js

@@ -1,16 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useId, cloneElement } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-import { Label } from '../label/label.js';
-import { Caption } from '../caption/caption.js';
-
-function SelectionControl({ label, labelFor, caption, className, children, ...props }) {
-    const defaultId = useId();
-    const controlId = labelFor || defaultId;
-    const shouldRenderCaption = Boolean(caption);
-    return (jsxs("div", { ...props, className: classNames('dc-selection-control', className), children: [jsx("div", { className: "dc-selection-control__input", children: typeof children === 'function'
-                    ? children({ id: controlId })
-                    : cloneElement(children, { id: children.props.id || controlId }) }), jsx(Label, { className: "dc-selection-control__label", htmlFor: controlId, children: label }), shouldRenderCaption && (jsx(Caption, { className: "dc-selection-control__caption", children: caption }))] }));
-}
-
-export { SelectionControl };

package/esm/components/slide-over/slide-over-body.js

@@ -1,8 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-
-function SlideOverBody({ className, ...props }) {
-    return (jsx("div", { className: classNames('dc-slide-over-body', className), ...props }));
-}
-
-export { SlideOverBody };

package/esm/components/slide-over/slide-over-header.js

@@ -1,19 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-import '../button/button.js';
-import { IconButton } from '../button/icon-button.js';
-import { useSlideOverContext } from './slide-over-context.js';
-
-function SlideOverHeader({ className, htmlTitle, title, children, description, closeButtonAccessibleName, onClickCloseButton, ...props }) {
-    const { titleId, descriptionId, closePanel } = useSlideOverContext();
-    const onCloseButtonClicked = (ev) => {
-        closePanel('close-button');
-        onClickCloseButton?.(ev);
-    };
-    return (jsxs("div", { className: classNames('dc-slide-over-header', className), title: htmlTitle, ...props, children: [jsxs("div", { className: "dc-slide-over-header__title", children: [jsx("h2", { id: titleId, children: title }), jsx(IconButton, { icon: jsx(XMarkIcon, {}), "aria-label": closeButtonAccessibleName, variant: "tinted", size: "xs", onClick: onCloseButtonClicked })] }), description ? (jsx("div", { id: descriptionId, className: "dc-slide-over-header__description", children: description })) : null, children ? (jsx("div", { className: "dc-slide-over-header__content", children: children })) : null] }));
-}
-function XMarkIcon(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 20, height: 20, fill: "none", stroke: "currentColor", strokeWidth: 1.5, ...props, children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) }));
-}
-
-export { SlideOverHeader };

package/esm/components/slider/slider-tick-marks.js

@@ -1,15 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-
-function SliderTickMarks({ tickMarksCount, renderTickMarkLabel, }) {
-    if (tickMarksCount < 1) {
-        return null;
-    }
-    const tickMarks = [];
-    for (let index = 0; index < tickMarksCount; index += 1) {
-        const label = renderTickMarkLabel?.(index);
-        tickMarks.push((jsx("div", { className: "dc-slider-tick-mark", "data-testid": "tick-mark", children: Boolean(label) && (jsx("span", { className: "dc-slider-tick-mark__label", children: label })) }, index)));
-    }
-    return jsx("div", { className: "dc-slider__tick-marks", children: tickMarks });
-}
-
-export { SliderTickMarks };

package/esm/components/spinner/spinner.js

@@ -1,9 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const Spinner = forwardRef(function Spinner({ size = 24, width = size, height = size, className = '', ...props }, ref) {
-    return jsx("svg", { ...props, ref: ref, className: classNames('dc-spinner', className), xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 50 50", width: width, height: height, children: jsx("circle", { cx: 25, cy: 25, r: 20, fill: "none", stroke: "currentColor", strokeWidth: 5 }) });
-});
-
-export { Spinner };

package/esm/components/switch/switch.js

@@ -1,15 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const Switch = forwardRef(function Switch({ showCheckIcon = true, style, className, onChange, onToggle, ...props }, ref) {
-    return (jsxs("label", { style: style, className: classNames('dc-switch', className), children: [jsx("input", { ...props, ref: ref, className: "dc-switch__input", type: "checkbox", onChange: (event) => {
-                    onChange?.(event);
-                    onToggle?.(event.target.checked);
-                } }), jsx("span", { "data-testid": "switch-track", className: "dc-switch__track", "aria-hidden": true, children: jsx("span", { className: "dc-switch__thumb", children: showCheckIcon && (jsx(CheckIcon, { className: "dc-switch__icon", "data-testid": "switch-check-icon" })) }) })] }));
-});
-function CheckIcon(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", width: 20, height: 20, ...props, children: jsx("path", { d: "M6 10.353L9 13L13.5 7", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }) }));
-}
-
-export { Switch };

package/esm/components/table/icons.js

@@ -1,13 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-
-function ArrowsUpDown(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 24, height: 24, strokeWidth: 1.5, stroke: "currentColor", ...props, children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3 7.5L7.5 3m0 0L12 7.5M7.5 3v13.5m13.5 0L16.5 21m0 0L12 16.5m4.5 4.5V7.5" }) }));
-}
-function ArrowSmallDown(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 24, height: 24, strokeWidth: 1.5, stroke: "currentColor", ...props, children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 4.5v15m0 0l6.75-6.75M12 19.5l-6.75-6.75" }) }));
-}
-function ArrowSmallUp(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 24, height: 24, strokeWidth: 1.5, stroke: "currentColor", ...props, children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 19.5v-15m0 0l-6.75 6.75M12 4.5l6.75 6.75" }) }));
-}
-
-export { ArrowSmallDown, ArrowSmallUp, ArrowsUpDown };

package/esm/components/table/table-body.js

@@ -1,9 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const TableBody = forwardRef(function TableBody({ className, children, ...props }, ref) {
-    return (jsx("tbody", { ...props, ref: ref, className: classNames(className, 'dc-table-body'), children: children }));
-});
-
-export { TableBody };

package/esm/components/table/table-cell.js

@@ -1,9 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const TableCell = forwardRef(function TableCell({ className, children, ...props }, ref) {
-    return (jsx("td", { ...props, ref: ref, className: classNames('dc-table-cell', className), children: children }));
-});
-
-export { TableCell };

package/esm/components/table/table-head-cell.js

@@ -1,28 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-import { ArrowsUpDown, ArrowSmallUp, ArrowSmallDown } from './icons.js';
-
-const iconMapping = {
-    none: ArrowsUpDown,
-    ascending: ArrowSmallUp,
-    descending: ArrowSmallDown,
-};
-const stateMapping = {
-    none: 'ascending',
-    ascending: 'descending',
-    descending: 'none',
-};
-const TableHeadCell = forwardRef(function TableHeaderCell({ isSortable = false, sort = 'none', className, children, onChangeSort, ...props }, ref) {
-    if (isSortable) {
-        const Icon = iconMapping[sort];
-        children = (jsxs("button", { className: "dc-table-cell__sort-btn", type: "button", onClick: () => onChangeSort?.(stateMapping[sort]), children: [children, " ", jsx(Icon, { className: "dc-table-cell__sort-icon", "aria-hidden": true, strokeWidth: 2 })] }));
-    }
-    return (jsx("th", { ...props, className: classNames(className, {
-            'dc-table-cell': true,
-            'dc-table-cell_head': true,
-            'dc-table-cell_sortable': isSortable,
-        }), ref: ref, "aria-sort": isSortable ? sort : props['aria-sort'], children: children }));
-});
-
-export { TableHeadCell };

package/esm/components/table/table-head.js

@@ -1,12 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const TableHead = forwardRef(function TableHead({ className, isTinted = false, ...props }, ref) {
-    return (jsx("thead", { ...props, ref: ref, className: classNames(className, {
-            'dc-table-head': true,
-            'dc-table-head_tinted': isTinted,
-        }) }));
-});
-
-export { TableHead };

package/esm/components/table/table-row.js

@@ -1,12 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const TableRow = forwardRef(function TableRow({ isSelected, className, ...props }, ref) {
-    return (jsx("tr", { ...props, ref: ref, className: classNames(className, {
-            'dc-table-row': true,
-            'dc-table-row_selected': isSelected,
-        }) }));
-});
-
-export { TableRow };

package/esm/components/tabs/tab-panel.js

@@ -1,14 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-import { useTabsContext } from './tabs-context.js';
-
-function TabPanel({ tab, id, className, children, 'aria-labelledby': ariaLabelledBy, ...props }) {
-    const { selectedTab, getTabProps } = useTabsContext();
-    if (selectedTab !== tab) {
-        return null;
-    }
-    const tabProps = getTabProps(tab);
-    return (jsx("div", { ...props, className: classNames('dc-tab-panel', className), role: "tabpanel", id: id || tabProps.ariaControls, "aria-labelledby": ariaLabelledBy || tabProps.id, children: children }));
-}
-
-export { TabPanel };

package/esm/components/tabs/tab.js

@@ -1,17 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-import { useTabsContext } from './tabs-context.js';
-import { Badge } from '../badge/badge.js';
-
-function Tab({ id, name, icon, counter, className, children, onClick, 'aria-controls': ariaControls, ...props }) {
-    const { getTabProps, selectedTab, setSelectedTab, tabListHasFocus, } = useTabsContext();
-    const tabProps = getTabProps(name);
-    const selected = name === selectedTab;
-    function handleClick(event) {
-        setSelectedTab(name);
-        onClick?.(event);
-    }
-    return (jsx("button", { ...props, className: classNames('dc-tab', className), type: "button", role: "tab", name: name, id: id || tabProps.id, "aria-controls": ariaControls || tabProps.ariaControls, "aria-selected": selected, tabIndex: selected && !tabListHasFocus ? 0 : -1, onClick: handleClick, children: jsxs("span", { className: "dc-tab__layout", children: [icon != null && (jsx("span", { className: "dc-tab__icon", children: icon })), children != null && (jsxs("span", { className: "dc-tab__label", children: [children, " "] })), counter != null && counter !== 0 && (jsx(Badge, { className: "dc-tab__counter", children: counter }))] }) }));
-}
-
-export { Tab };

package/esm/components/tabs/tabs.js

@@ -1,9 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-import { TabsContextProvider } from './tabs-context.js';
-
-function Tabs({ className, children, selectedTab, onSelectTab, ...props }) {
-    return (jsx(TabsContextProvider, { selectedTab: selectedTab, setSelectedTab: onSelectTab, children: jsx("div", { ...props, className: classNames('dc-tabs', className), children: children }) }));
-}
-
-export { Tabs };

package/esm/components/tag/tag.js

@@ -1,14 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const Tag = forwardRef(function Tag({ isRounded = false, variant = 'tinted', fill = 'gray', size = 'md', className, children, ...props }, ref) {
-    return (jsx("strong", { ...props, ref: ref, className: classNames(className, 'dc-tag', {
-            [`dc-tag_${variant}`]: variant,
-            [`dc-tag_${fill}`]: fill,
-            [`dc-tag_${size}`]: size,
-            'dc-tag_rounded': isRounded,
-        }), children: children }));
-});
-
-export { Tag };

package/esm/components/text-input/text-input.js

@@ -1,40 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const TextInput = forwardRef(function TextInput({ hasError = false, isBlock = false, type = 'text', size = 'md', leftAddOn, rightAddOn, style, className, disabled, width, htmlSize, onChange, onChangeValue, ...props }, ref) {
-    if (leftAddOn) {
-        const className = 'dc-text-input__left-addon';
-        if (typeof leftAddOn === 'function') {
-            leftAddOn = leftAddOn({ className });
-        }
-        else {
-            leftAddOn = jsx("div", { className: className, children: leftAddOn });
-        }
-    }
-    if (rightAddOn) {
-        const className = 'dc-text-input__right-addon';
-        if (typeof rightAddOn === 'function') {
-            rightAddOn = rightAddOn({ className });
-        }
-        else {
-            rightAddOn = jsx("div", { className: className, children: rightAddOn });
-        }
-    }
-    return (jsxs("div", { style: style, className: classNames(className, 'dc-text-input__container', {
-            [`dc-text-input__container_${size}`]: size,
-            'dc-text-input__container_block': isBlock,
-            'dc-text-input__container_disabled': disabled,
-            'dc-text-input__container_invalid': hasError,
-            'dc-text-input__container_left-addon': leftAddOn,
-            'dc-text-input__container_right-addon': rightAddOn,
-        }), children: [leftAddOn, jsx("input", { ...props, className: classNames({
-                    'dc-text-input': true,
-                    [`dc-text-input_width_${width}`]: width,
-                }), ref: ref, type: type, size: htmlSize, disabled: disabled, onChange: (event) => {
-                    onChange?.(event);
-                    onChangeValue?.(event.target.value);
-                } }), rightAddOn] }));
-});
-
-export { TextInput };

package/esm/components/textarea/textarea.js

@@ -1,38 +0,0 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { forwardRef, useState } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-import { Caption } from '../caption/caption.js';
-
-const getCharactersCountMessage = ({ maxCharacters, characterCount, }) => {
-    const charsRemaining = maxCharacters - characterCount;
-    const characters = (jsx("span", { style: { fontVariant: 'tabular-nums' }, children: charsRemaining === 1
-            ? `${charsRemaining} character`
-            : `${charsRemaining} characters` }));
-    return jsxs(Fragment, { children: ["You have ", characters, " remaining"] });
-};
-const Textarea = forwardRef(function Textarea({ disabled = false, hasError = false, isBlock = false, showCharacterCount = false, size = 'md', rows = 3, width, style, className, maxLength, onChange, onChangeValue, renderCharacterCount = getCharactersCountMessage, ...props }, ref) {
-    const shouldRenderCharacterCount = (showCharacterCount &&
-        maxLength != null && maxLength > 0);
-    const [characterCount, setCharacterCount] = useState(() => {
-        const value = props.value || props.defaultValue;
-        return typeof value === 'string' ? value.length : 0;
-    });
-    return (jsxs("div", { style: style, className: classNames(className, 'dc-textarea__container', {
-            [`dc-textarea__container_size_${size}`]: size !== undefined,
-            'dc-textarea__container_disabled': disabled,
-            'dc-textarea__container_has_error': hasError,
-            'dc-textarea__container_block': isBlock,
-        }), children: [jsx("textarea", { ...props, ref: ref, className: classNames('dc-textarea', {
-                    [`dc-textarea_width_${width}`]: width !== undefined,
-                }), rows: rows, maxLength: maxLength, disabled: disabled, onChange: (event) => {
-                    const value = event.target.value;
-                    onChange?.(event);
-                    onChangeValue?.(value);
-                    setCharacterCount(value.length);
-                } }), shouldRenderCharacterCount && (jsx(Caption, { "data-testid": "textarea-character-count", className: "dc-textarea__character-count", children: renderCharacterCount({
-                    characterCount,
-                    maxCharacters: maxLength,
-                }) }))] }));
-});
-
-export { Textarea };

package/esm/components/toast/toast-button.js

@@ -1,9 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { classNames } from '../../lib/react-helpers.js';
-
-const ToastButton = forwardRef(function ToastButton({ className, ...props }, ref) {
-    return (jsx("button", { ...props, ref: ref, className: classNames(className, 'dc-toast__btn') }));
-});
-
-export { ToastButton };

package/esm/components/toast/toast.js

@@ -1,9 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { classNames } from '../../lib/react-helpers.js';
-import { XMarkIcon } from './x-mark-icon.js';
-
-function Toast({ icon, message, actions, closeButtonAriaLabel = 'close', onClickCloseButton, children, className, ...props }) {
-    return (jsxs("section", { ...props, className: classNames('dc-toast', className), children: [jsx("button", { className: "dc-toast__close-btn", "aria-label": closeButtonAriaLabel, onClick: onClickCloseButton, children: jsx(XMarkIcon, { width: 16, height: 16 }) }), jsxs("div", { className: "dc-toast__body", children: [icon && jsx("div", { className: "dc-toast__icon", children: icon }), jsxs("div", { className: "dc-toast__content", children: [jsx("h1", { className: "dc-toast__title", children: children }), message && jsx("div", { className: "dc-toast__message", children: message })] })] }), actions && jsx("div", { className: "dc-toast__actions", children: actions })] }));
-}
-
-export { Toast };

package/esm/components/toast/x-mark-icon.js

@@ -1,7 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-
-function XMarkIcon(props) {
-    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 24, height: 24, fill: "none", strokeWidth: 1.5, stroke: "currentColor", ...props, children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) }));
-}
-
-export { XMarkIcon };

package/esm/hooks/index.js

@@ -1,4 +0,0 @@
-export { useDisableBodyScroll } from './use-disable-body-scroll.js';
-export { useEscKeyDown } from './use-esc-key-down.js';
-export { useFocusTrap } from './use-focus-trap.js';
-export { useMountTransition } from './use-mount-transition.js';