@digdir/designsystemet-react 1.1.2 → 1.1.4

package/dist/esm/components/Search/SearchInput.js

@@ -1,20 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { Input } from '../Input/Input.js';
-
-/**
- * SearchInput component, used to display a search input within the Search component.
- *
- * @example
- * <Search>
- *   <Search.Input aria-label='Søk' />
- * </Search>
- */
-const SearchInput = forwardRef(function SearchInput({ ...rest }, ref) {
-    return (jsx(Input, { ref: ref, type: 'search', 
-        /* We need an empty placeholder for the clear button to be able to show/hide */
-        placeholder: '', ...rest }));
-});
-
-export { SearchInput };

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

@@ -1,32 +0,0 @@
-'use client';
-import { Search as Search$1 } from './Search.js';
-import { SearchButton } from './SearchButton.js';
-import { SearchClear } from './SearchClear.js';
-import { SearchInput } from './SearchInput.js';
-
-/**
- * Search component, use to display different variations of a search input
- *
- * @example with button
- * <Search>
- *   <Search.Input aria-label='Søk' />
- *   <Search.Clear />
- *   <Search.Button />
- * </Search>
- *
- * @example with icon
- * <Search>
- *   <Search.Input aria-label='Søk' />
- *   <Search.Clear />
- * </Search>
- */
-const Search = Object.assign(Search$1, {
-    Clear: SearchClear,
-    Button: SearchButton,
-    Input: SearchInput,
-});
-Search.Clear.displayName = 'Search.Clear';
-Search.Button.displayName = 'Search.Button';
-Search.Input.displayName = 'Search.Input';
-
-export { Search, SearchButton, SearchClear, SearchInput };

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

@@ -1,22 +0,0 @@
-'use client';
-import { Select as Select$1 } from './Select.js';
-import { SelectOptgroup } from './SelectOptgroup.js';
-import { SelectOption } from './SelectOption.js';
-
-/**
- * Select component, used to display a native select.
- *
- * @example
- * <Select>
- *   <Select.Option value='1'>Option 1</Select.Option>
- *   <Select.Option value='2'>Option 2</Select.Option>
- * </Select>
- */
-const Select = Object.assign(Select$1, {
-    Option: SelectOption,
-    Optgroup: SelectOptgroup,
-});
-Select.Option.displayName = 'Select.Option';
-Select.Optgroup.displayName = 'Select.Optgroup';
-
-export { Select, SelectOptgroup, SelectOption };

package/dist/esm/components/Skeleton/Skeleton.js

@@ -1,25 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { Slot } from '@radix-ui/react-slot';
-import cl from 'clsx/lite';
-import { forwardRef } from 'react';
-import { useSynchronizedAnimation } from '../../utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js';
-import { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs.js';
-
-/**
- * Skeleton is used to represent a draft of page while the content loads.
- *
- * @example
- * <Skeleton variant="circle" />
- * <Skeleton variant="text" />
- * <Skeleton variant="rectangle" />
- */
-const Skeleton = forwardRef(function Skeleton({ asChild, className, height, style, variant = 'rectangle', width, ...rest }, ref) {
-    const Component = asChild ? Slot : 'span';
-    const isText = variant === 'text';
-    const animationRef = useSynchronizedAnimation('ds-skeleton-opacity-fade');
-    const mergedRefs = useMergeRefs([animationRef, ref]);
-    return (jsx(Component, { "aria-hidden": 'true', className: cl('ds-skeleton', className), "data-text": isText ? '-'.repeat(Number(width) || 1) : undefined, "data-variant": variant, ref: mergedRefs, style: isText ? style : { width, height, ...style }, ...rest }));
-});
-
-export { Skeleton };

package/dist/esm/components/SkipLink/SkipLink.js

@@ -1,17 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import cl from 'clsx/lite';
-import { forwardRef } from 'react';
-
-/**
- * SkipLink component, used to display a skip link within the page.
- * Place it at the top of the page to allow users to skip to the main content.
- *
- * @example
- * <SkipLink href='#main-content'>Skip to main content</SkipLink>
- */
-const SkipLink = forwardRef(function SkipLink({ children, className, ...rest }, ref) {
-    return (jsx("a", { className: cl('ds-skiplink', className), ...rest, ref: ref, children: children }));
-});
-
-export { SkipLink };

package/dist/esm/components/Spinner/Spinner.js

@@ -1,21 +0,0 @@
-'use client';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import cl from 'clsx/lite';
-import { forwardRef } from 'react';
-import { useSynchronizedAnimation } from '../../utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js';
-import { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs.js';
-
-/**
- * Spinner component used for indicating busy or indeterminate loading.
- *
- * @example
- * <Spinner aria-label='Loading users...' />
- */
-const Spinner = forwardRef(function Spinner({ 'aria-label': ariaLabel, className, ...rest }, ref) {
-    const svgRef = useSynchronizedAnimation('ds-spinner-rotate-animation');
-    const strokeRef = useSynchronizedAnimation('ds-spinner-stroke-animation');
-    const mergedRefs = useMergeRefs([svgRef, ref]);
-    return (jsxs("svg", { "aria-label": ariaLabel, className: cl('ds-spinner', className), ref: mergedRefs, role: 'img', viewBox: '0 0 50 50', ...rest, children: [jsx("circle", { className: cl('ds-spinner__background'), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5' }), jsx("circle", { className: cl(`ds-spinner__circle`), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5', ref: strokeRef })] }));
-});
-
-export { Spinner };

package/dist/esm/components/Suggestion/Suggestion.js

@@ -1,84 +0,0 @@
-'use client';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { forwardRef, createContext, useRef, useId, useState, useEffect, useCallback } from 'react';
-import '@u-elements/u-combobox';
-import cl from 'clsx/lite';
-import { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs.js';
-
-const SuggestionContext = createContext({
-    handleFilter: () => undefined,
-});
-const text = (el) => el.textContent?.trim() || '';
-const sanitizeItems = (values = []) => typeof values === 'string'
-    ? [{ label: values, value: values }]
-    : values.map((value) => typeof value === 'string'
-        ? { label: value, value }
-        : {
-            label: value.label || value.value || '',
-            value: value.value || '',
-        });
-const nextItems = (data, prev, multiple) => {
-    const item = { label: text(data), value: data.value };
-    if (!multiple)
-        return data.isConnected ? [] : [item];
-    return data.isConnected
-        ? sanitizeItems(prev).filter(({ value }) => value !== item.value)
-        : [...sanitizeItems(prev), item];
-};
-const defaultFilter = ({ label, input }) => label.toLowerCase().includes(input.value.trim().toLowerCase());
-const Suggestion = forwardRef(function Suggestion({ children, className, creatable = false, defaultValue, filter = true, multiple = false, name, onValueChange, value, ...rest }, ref) {
-    const uComboboxRef = useRef(null);
-    const generatedSelectId = useId();
-    const selectId = rest.id ? `${rest.id}-select` : generatedSelectId;
-    const isContolled = value !== undefined;
-    const mergedRefs = useMergeRefs([ref, uComboboxRef]);
-    const [isEmpty, setIsEmpty] = useState(false);
-    const [selectedItems, setSelectedItems] = useState(sanitizeItems(defaultValue || value));
-    // Update if controlled values
-    const prevControlled = useRef(value);
-    if (value !== prevControlled.current) {
-        prevControlled.current = value;
-        setSelectedItems(sanitizeItems(prevControlled.current));
-    }
-    /**
-     * Listerners and handling of adding/removing
-     */
-    useEffect(() => {
-        const combobox = uComboboxRef.current;
-        const beforeChange = (event) => {
-            event.preventDefault();
-            const multiple = combobox?.multiple;
-            const data = event.detail;
-            if (isContolled)
-                onValueChange?.(nextItems(data, prevControlled.current, multiple));
-            else
-                setSelectedItems((prevItems) => nextItems(data, prevItems, multiple));
-        };
-        combobox?.addEventListener('beforechange', beforeChange);
-        return () => combobox?.removeEventListener('beforechange', beforeChange);
-    }, [isContolled, setSelectedItems]);
-    const handleFilter = useCallback(() => {
-        const { control: input, options = [] } = uComboboxRef?.current || {};
-        const filterFn = filter === true ? defaultFilter : filter;
-        let disabled = 0;
-        let index = 0;
-        for (const option of options)
-            if (!option.hasAttribute('data-empty')) {
-                if (filterFn && input)
-                    option.disabled =
-                        !filterFn({
-                            index,
-                            input,
-                            label: option.label,
-                            optionElement: option,
-                            text: option.text,
-                            value: option.value,
-                        }) && Boolean(++disabled);
-                index++; // Increment index for each <option>
-            }
-        setIsEmpty(index === disabled);
-    }, [filter]);
-    return (jsx(SuggestionContext.Provider, { value: { isEmpty, selectedItems, handleFilter }, children: jsxs("u-combobox", { "data-multiple": multiple || undefined, "data-creatable": creatable || undefined, class: cl('ds-suggestion', className), ref: mergedRefs, ...rest, children: [children, !!name && (jsx("select", { name: name, multiple: true, hidden: true, id: selectId }))] }) }));
-});
-
-export { Suggestion, SuggestionContext };

package/dist/esm/components/Suggestion/SuggestionChips.js

@@ -1,13 +0,0 @@
-'use client';
-import { jsx, Fragment } from 'react/jsx-runtime';
-import { useContext } from 'react';
-import { Chip } from '../Chip/index.js';
-import { SuggestionContext } from './Suggestion.js';
-
-const SuggestionChips = ({ render = ({ label }) => label, }) => {
-    const { selectedItems = [] } = useContext(SuggestionContext);
-    return (jsx(Fragment, { children: selectedItems.map((item) => (jsx(Chip.Removable, { value: item.value, asChild: true, children: jsx("data", { children: render(item) }) }, item.value))) }));
-};
-SuggestionChips.displayName = 'SuggestionChips';
-
-export { SuggestionChips };

package/dist/esm/components/Suggestion/SuggestionClear.js

@@ -1,22 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { Button } from '../Button/Button.js';
-
-/**
- * Component that provides a clear button for the Suggestion input.
- *
- * Place as a descendant of `Suggestion`
- *
- * @example
- * <Suggestion>
- *   <Suggestion.Input />
- *   <Suggestion.Clear />
- *   <Suggestion.List />
- * </Suggestion>
- */
-const SuggestionClear = forwardRef(function SuggestionClear({ 'aria-label': label = 'Tøm', onClick, ...rest }, ref) {
-    return (jsx(Button, { "aria-label": label, asChild: true, icon: true, hidden: true, ref: ref, variant: 'tertiary', ...rest, children: jsx("del", {}) }));
-});
-
-export { SuggestionClear };

package/dist/esm/components/Suggestion/SuggestionEmpty.js

@@ -1,21 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext } from 'react';
-import { SuggestionContext } from './Suggestion.js';
-
-/**
- * Component that provides an empty Suggestion list.
- *
- * Place as a descendant of `Suggestion.List`
- *
- * @example
- * <Suggestion.List>
- *   <Suggestion.Empty>Tomt</Suggestion.Empty>
- * </Suggestion.List>
- */
-const SuggestionEmpty = forwardRef(function SuggestionEmpty(rest, ref) {
-    const { isEmpty } = useContext(SuggestionContext);
-    return isEmpty ? jsx("u-option", { "data-empty": true, value: '', ref: ref, ...rest }) : null;
-});
-
-export { SuggestionEmpty };

package/dist/esm/components/Suggestion/SuggestionInput.js

@@ -1,32 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext, useEffect } from 'react';
-import { SuggestionContext } from './Suggestion.js';
-import { Input } from '../Input/Input.js';
-
-/**
- * Component that provides an input field for the Suggestion list.
- *
- * Place as a descendant of `Suggestion`
- *
- * @example
- * <Suggestion>
- *   <Suggestion.Input />
- *   <Suggestion.List />
- * </Suggestion>
- */
-const SuggestionInput = forwardRef(function SuggestionList({ value, onInput, onChange, ...rest }, ref) {
-    const { handleFilter } = useContext(SuggestionContext);
-    useEffect(handleFilter, [value]); // Filter if controlled value
-    if (onChange)
-        console.warn('SuggestionInput: Avoid using onChange, as Suggestion controls the Input. Use onValueChange on Suggest instead, or onInput if fetching API results');
-    if (value)
-        console.warn('SuggestionInput: Avoid using value, as Suggestion controls the Input. Use value on Suggest instead.');
-    return (jsx(Input, { placeholder: '' // We need an empty placeholder for the clear button to be able to show/hide
-        , ref: ref, onInput: (event) => {
-            onInput?.(event); // Should run first
-            handleFilter?.(); // Filter if uncontrolled value
-        }, ...rest }));
-});
-
-export { SuggestionInput };

package/dist/esm/components/Suggestion/SuggestionList.js

@@ -1,24 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext, useEffect } from 'react';
-import '@u-elements/u-datalist';
-import { SuggestionContext } from './Suggestion.js';
-
-/**
- * Component that provides a Suggestion list.
- *
- * Place as a descendant of `Suggestion`
- *
- * @example
- * <Suggestion>
- *   <Suggestion.Input />
- *   <Suggestion.List />
- * </Suggestion>
- */
-const SuggestionList = forwardRef(function SuggestionList({ singular = '%d forslag', plural = '%d forslag', className, id, ...rest }, ref) {
-    const { handleFilter } = useContext(SuggestionContext);
-    useEffect(handleFilter); // Must run on every render
-    return (jsx("u-datalist", { "data-nofilter": true, "data-sr-singular": singular, "data-sr-plural": plural, class: className, ref: ref, ...rest }));
-});
-
-export { SuggestionList };

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

@@ -1,40 +0,0 @@
-'use client';
-import { Suggestion } from './Suggestion.js';
-import { SuggestionChips } from './SuggestionChips.js';
-import { SuggestionClear } from './SuggestionClear.js';
-import { SuggestionEmpty } from './SuggestionEmpty.js';
-import { SuggestionInput } from './SuggestionInput.js';
-import { SuggestionList } from './SuggestionList.js';
-import { SuggestionOption } from './SuggestionOption.js';
-
-/**
- * A component that provides a suggestion list for an input field.
- *
- * @example
- * <Suggestion>
- *   <Suggestion.Input />
- *   <Suggestion.Clear />
- *   <Suggestion.List>
- *     <Suggestion.Empty>Tomt</Suggestion.Empty>
- *     <Suggestion.Option value='Option 1'>Option 1</Suggestion.Option>
- *     <Suggestion.Option value='Option 2'>Option 2</Suggestion.Option>
- *   </Suggestion.List>
- * </Suggestion>
- */
-const EXPERIMENTAL_Suggestion = Object.assign(Suggestion, {
-    Chips: SuggestionChips,
-    List: SuggestionList,
-    Input: SuggestionInput,
-    Empty: SuggestionEmpty,
-    Option: SuggestionOption,
-    Clear: SuggestionClear,
-});
-EXPERIMENTAL_Suggestion.displayName = 'EXPERIMENTAL_Suggestion';
-EXPERIMENTAL_Suggestion.Chips.displayName = 'EXPERIMENTAL_Suggestion.Chips';
-EXPERIMENTAL_Suggestion.List.displayName = 'EXPERIMENTAL_Suggestion.List';
-EXPERIMENTAL_Suggestion.Input.displayName = 'EXPERIMENTAL_Suggestion.Input';
-EXPERIMENTAL_Suggestion.Empty.displayName = 'EXPERIMENTAL_Suggestion.Empty';
-EXPERIMENTAL_Suggestion.Option.displayName = 'EXPERIMENTAL_Suggestion.Option';
-EXPERIMENTAL_Suggestion.Clear.displayName = 'EXPERIMENTAL_Suggestion.Clear';
-
-export { EXPERIMENTAL_Suggestion, SuggestionChips as EXPERIMENTAL_SuggestionChips, SuggestionClear as EXPERIMENTAL_SuggestionClear, SuggestionEmpty as EXPERIMENTAL_SuggestionEmpty, SuggestionInput as EXPERIMENTAL_SuggestionInput, SuggestionList as EXPERIMENTAL_SuggestionList, SuggestionOption as EXPERIMENTAL_SuggestionOption };

package/dist/esm/components/Switch/Switch.js

@@ -1,18 +0,0 @@
-'use client';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { Field } from '../Field/index.js';
-import { Input } from '../Input/Input.js';
-import { Label } from '../Label/Label.js';
-
-/**
- * Switch used to toggle options.
- *
- * @example
- * <Switch label="I agree" value="agree" />
- */
-const Switch = forwardRef(function Switch({ 'data-size': size, children, className, description, label, position, style, ...rest }, ref) {
-    return (jsxs(Field, { className: className, "data-position": position, "data-size": size, style: style, children: [jsx(Input, { type: 'checkbox', role: 'switch', ref: ref, ...rest }), !!label && jsx(Label, { weight: 'regular', children: label }), !!description && jsx("div", { "data-field": 'description', children: description })] }));
-});
-
-export { Switch };

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

@@ -1,51 +0,0 @@
-'use client';
-import { Table as Table$1 } from './Table.js';
-import { TableBody } from './TableBody.js';
-import { TableCell } from './TableCell.js';
-import { TableFoot } from './TableFoot.js';
-import { TableHead } from './TableHead.js';
-import { TableHeaderCell } from './TableHeaderCell.js';
-import { TableRow } from './TableRow.js';
-
-/**
- * Table component, used to display tabular data. Renders a native HTML table element.
- *
- * @example
- * <Table>
- *   <Table.Head>
- *     <Table.Row>
- *       <Table.HeaderCell>Name</Table.HeaderCell>
- *       <Table.HeaderCell>Age</Table.HeaderCell>
- *     </Table.Row>
- *   </Table.Head>
- *   <Table.Body>
- *     <Table.Row>
- *       <Table.Cell>John</Table.Cell>
- *       <Table.Cell>25</Table.Cell>
- *     </Table.Row>
- *   </Table.Body>
- *   <Table.Foot>
- *     <Table.Row>
- *       <Table.Cell>Total</Table.Cell>
- *       <Table.Cell>2</Table.Cell>
- *     </Table.Row>
- *   </Table.Foot>
- * </Table>
- */
-const Table = Object.assign(Table$1, {
-    Head: TableHead,
-    Body: TableBody,
-    Row: TableRow,
-    Cell: TableCell,
-    HeaderCell: TableHeaderCell,
-    Foot: TableFoot,
-});
-Table.displayName = 'Table';
-Table.Head.displayName = 'Table.Head';
-Table.Body.displayName = 'Table.Body';
-Table.Row.displayName = 'Table.Row';
-Table.Cell.displayName = 'Table.Cell';
-Table.HeaderCell.displayName = 'Table.HeaderCell';
-Table.Foot.displayName = 'Table.Foot';
-
-export { Table, TableBody, TableCell, TableFoot, TableHead, TableHeaderCell, TableRow };

package/dist/esm/components/Tabs/TabsList.js

@@ -1,21 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext } from 'react';
-import { Context } from './Tabs.js';
-import { RovingFocusRoot } from '../../utilities/RovingFocus/RovingFocusRoot.js';
-
-/**
- * The container for all `Tab` components.
- *
- * @example
- * <Tabs.List>
- *  <Tabs.Tab value='1'>Tab 1</Tabs.Tab>
- *  <Tabs.Tab value='2'>Tab 2</Tabs.Tab>
- * </Tabs.List>
- */
-const TabsList = forwardRef(function TabsList({ children, ...rest }, ref) {
-    const { value } = useContext(Context);
-    return (jsx(RovingFocusRoot, { role: 'tablist', activeValue: value, orientation: 'ambiguous', ref: ref, ...rest, children: children }));
-});
-
-export { TabsList };

package/dist/esm/components/Tabs/TabsPanel.js

@@ -1,29 +0,0 @@
-'use client';
-import { jsx, Fragment } from 'react/jsx-runtime';
-import { forwardRef, useContext, useState, useRef, useEffect } from 'react';
-import { Context } from './Tabs.js';
-import { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs.js';
-
-/**
- * A single content item in a Tabs component.
- *
- * @example
- * <Tabs.Panel value='1'>content 1</Tabs.Panel>
- */
-const TabsPanel = forwardRef(function TabsPanel({ children, value, ...rest }, ref) {
-    const { value: tabsValue } = useContext(Context);
-    const active = value === tabsValue;
-    const [hasTabbableElement, setHasTabbableElement] = useState(false);
-    const internalRef = useRef(null);
-    const mergedRef = useMergeRefs([ref, internalRef]);
-    /* Check if the panel has any tabbable elements */
-    useEffect(() => {
-        if (!internalRef.current)
-            return;
-        const tabbableElements = internalRef.current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
-        setHasTabbableElement(tabbableElements.length > 0);
-    }, [children]);
-    return (jsx(Fragment, { children: active && (jsx("div", { ref: mergedRef, role: 'tabpanel', tabIndex: hasTabbableElement ? undefined : 0, ...rest, children: children })) }));
-});
-
-export { TabsPanel };

package/dist/esm/components/Tabs/TabsTab.js

@@ -1,20 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext, useId } from 'react';
-import { RovingFocusItem } from '../../utilities/RovingFocus/RovingFocusItem.js';
-import { Context } from './Tabs.js';
-
-/**
- * A single item in a Tabs component.
- *
- * @example
- * <Tabs.Tab value='1'>Tab 1</Tabs.Tab>
- */
-const TabsTab = forwardRef(function TabsTab({ value, id, ...rest }, ref) {
-    const tabs = useContext(Context);
-    const generatedId = useId();
-    const buttonId = id ?? `tab-${generatedId}`;
-    return (jsx(RovingFocusItem, { value: value, ...rest, asChild: true, children: jsx("button", { ...rest, "aria-selected": tabs.value === value, id: buttonId, onClick: () => tabs.onChange?.(value), ref: ref, role: 'tab', type: 'button' }) }));
-});
-
-export { TabsTab };

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

@@ -1,31 +0,0 @@
-'use client';
-import { Tabs as Tabs$1 } from './Tabs.js';
-import { TabsList } from './TabsList.js';
-import { TabsPanel } from './TabsPanel.js';
-import { TabsTab } from './TabsTab.js';
-
-/**
- * Display a group of tabs that can be toggled between.
- *
- * @example
- * <Tabs onChange={(value) => console.log(value)}>
- *   <Tabs.List>
- *     <Tabs.Tab value='1'>Tab 1</Tabs.Tab>
- *     <Tabs.Tab value='2'>Tab 2</Tabs.Tab>
- *     <Tabs.Tab value='3'>Tab 3</Tabs.Tab>
- *   </Tabs.List>
- *   <Tabs.Panel value='1'>content 1</Tabs.Panel>
- *   <Tabs.Panel value='2'>content 2</Tabs.Panel>
- *   <Tabs.Panel value='3'>content 3</Tabs.Panel>
- * </Tabs>
- */
-const Tabs = Object.assign(Tabs$1, {
-    List: TabsList,
-    Tab: TabsTab,
-    Panel: TabsPanel,
-});
-Tabs.Tab.displayName = 'Tabs.Tab';
-Tabs.List.displayName = 'Tabs.List';
-Tabs.Panel.displayName = 'Tabs.Panel';
-
-export { Tabs, TabsList, TabsPanel, TabsTab };

package/dist/esm/components/Textfield/Textfield.js

@@ -1,25 +0,0 @@
-'use client';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { Field } from '../Field/index.js';
-import { Label } from '../Label/Label.js';
-import { FieldDescription } from '../Field/FieldDescription.js';
-import { FieldAffixes, FieldAffix } from '../Field/FieldAffix.js';
-import { Textarea } from '../Textarea/Textarea.js';
-import { Input } from '../Input/Input.js';
-import { ValidationMessage } from '../ValidationMessage/ValidationMessage.js';
-
-/**
- *  Composed text input component using `Field`
- *
- * `classname` & `style` are passed to the wrapper elements.
- *
- * Rest props are passed to the `Input` or `Textarea` component.
- * @example
- * <Textfield label="Textfield label">
- */
-const Textfield = forwardRef(function Textfield({ label, description, error, multiline, prefix, suffix, 'data-size': size, counter, style, className, ...rest }, ref) {
-    return (jsxs(Field, { className: className, "data-size": size, style: style, children: [!!label && jsx(Label, { children: label }), !!description && jsx(FieldDescription, { children: description }), jsxs(FieldAffixes, { children: [prefix === undefined || jsx(FieldAffix, { children: prefix }), multiline === true ? (jsx(Textarea, { ref: ref, "aria-invalid": Boolean(error) || undefined, ...rest })) : (jsx(Input, { ref: ref, "aria-invalid": Boolean(error) || undefined, ...rest })), suffix === undefined || jsx(FieldAffix, { children: suffix })] }), !!error && jsx(ValidationMessage, { children: error }), !!counter && (jsx(Field.Counter, { ...(typeof counter === 'number' ? { limit: counter } : counter) }))] }));
-});
-
-export { Textfield };

package/dist/esm/components/ToggleGroup/ToggleGroup.js

@@ -1,38 +0,0 @@
-'use client';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import cl from 'clsx/lite';
-import { forwardRef, useId, useState, createContext } from 'react';
-import { RovingFocusRoot } from '../../utilities/RovingFocus/RovingFocusRoot.js';
-
-const ToggleGroupContext = createContext({});
-/**
- * Display a group of buttons that can be toggled between.
- *
- * @example
- * <ToggleGroup onChange={(value) => console.log(value)}>
- *   <ToggleGroup.Item value='1'>Toggle 1</ToggleGroup.Item>
- *   <ToggleGroup.Item value='2'>Toggle 2</ToggleGroup.Item>
- *   <ToggleGroup.Item value='3'>Toggle 3</ToggleGroup.Item>
- * </ToggleGroup>
- */
-const ToggleGroup = forwardRef(function ToggleGroup({ children, value, defaultValue, onChange, name, className, ...rest }, ref) {
-    const nameId = useId();
-    const isControlled = value !== undefined;
-    const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);
-    let onValueChange = onChange;
-    if (!isControlled) {
-        onValueChange = (newValue) => {
-            setUncontrolledValue(newValue);
-            onChange?.(newValue);
-        };
-        value = uncontrolledValue;
-    }
-    return (jsx(ToggleGroupContext.Provider, { value: {
-            value,
-            defaultValue,
-            name: name ?? `togglegroup-name-${nameId}`,
-            onChange: onValueChange,
-        }, children: jsx(RovingFocusRoot, { asChild: true, activeValue: value, orientation: 'ambiguous', children: jsxs("div", { className: cl('ds-togglegroup', className), role: 'radiogroup', ref: ref, ...rest, children: [name && jsx("input", { type: 'hidden', name: name, value: value }), children] }) }) }));
-});
-
-export { ToggleGroup, ToggleGroupContext };

package/dist/esm/components/ToggleGroup/ToggleGroupItem.js

@@ -1,18 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { RovingFocusItem } from '../../utilities/RovingFocus/RovingFocusItem.js';
-import { Button } from '../Button/Button.js';
-import { useToggleGroupItem } from './useToggleGroupitem.js';
-
-/**
- * A single item in a ToggleGroup.
- * @example
- * <ToggleGroup.Item value='1'>Toggle 1</ToggleGroup.Item>
- */
-const ToggleGroupItem = forwardRef(function ToggleGroupItem(rest, ref) {
-    const { active, buttonProps, value } = useToggleGroupItem(rest);
-    return (jsx(RovingFocusItem, { asChild: true, value: value, children: jsx(Button, { variant: active ? 'primary' : 'tertiary', ref: ref, ...rest, ...buttonProps }) }));
-});
-
-export { ToggleGroupItem };