@digdir/designsystemet-react 1.0.0-next.32 → 1.0.0-next.34

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

@@ -0,0 +1,18 @@
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { PadlockLockedFillIcon } from '@navikt/aksel-icons';
+import cl from 'clsx/lite';
+import { forwardRef } from 'react';
+import { useSelect } from './useSelect.js';
+import { Label } from '../../Typography/Label/Label.js';
+import { omit } from '../../../utilities/omit/omit.js';
+import { ValidationMessage } from '../../Typography/ValidationMessage/ValidationMessage.js';
+import { Paragraph } from '../../Typography/Paragraph/Paragraph.js';
+
+const Select = forwardRef(function Select(props, ref) {
+    const { children, disabled = false, label, description, hideLabel = false, error, className, htmlSize = 0, ...rest } = props;
+    const { selectProps, descriptionId, errorId, readOnly, size = 'md', } = useSelect(props);
+    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: cl('ds-select--container', readOnly && 'ds-select--readonly', error && 'ds-select--error'), children: [label && (jsxs(Label, { weight: 'medium', size: size, htmlFor: selectProps.id, className: cl('ds-select__label', hideLabel && 'ds-sr-only'), children: [readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: 'ds-select__readonly__icon' })), label] })), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: cl(`ds-select__description`, hideLabel && `ds-sr-only`), children: description }) })), jsx("div", { className: 'ds-select__wrapper', children: jsx("select", { disabled: disabled, ref: ref, size: htmlSize, className: cl('ds-select', `ds-select--${size}`, `ds-focus`, props.multiple && 'ds-select--multiple', className), ...omit(['size', 'error', 'errorId'], rest), ...omit(['readOnly', 'disabled'], selectProps), children: children }) }), error && (jsx("div", { id: errorId, className: 'ds-select__error-message', "aria-live": 'polite', "aria-relevant": 'additions removals', children: jsx(ValidationMessage, { size: size, children: error }) }))] }) }));
+});
+
+export { Select };

package/dist/esm/components/form/Select/SelectOptgroup.js

@@ -0,0 +1,11 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Slot } from '@radix-ui/react-slot';
+import { forwardRef } from 'react';
+
+const SelectOptgroup = forwardRef(function SelectOptgroup({ asChild, ...rest }, ref) {
+    const Component = asChild ? Slot : 'optgroup';
+    return jsx(Component, { ...rest, ref: ref });
+});
+
+export { SelectOptgroup };

package/dist/esm/components/form/Select/SelectOption.js

@@ -0,0 +1,11 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Slot } from '@radix-ui/react-slot';
+import { forwardRef } from 'react';
+
+const SelectOption = forwardRef(function SelectOption({ asChild, ...rest }, ref) {
+    const Component = asChild ? Slot : 'option';
+    return jsx(Component, { ...rest, ref: ref });
+});
+
+export { SelectOption };

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

@@ -0,0 +1,12 @@
+'use client';
+import { Select as Select$1 } from './Select.js';
+import { SelectOptgroup } from './SelectOptgroup.js';
+import { SelectOption } from './SelectOption.js';
+
+const Select = Select$1;
+Select.Option = SelectOption;
+Select.Optgroup = SelectOptgroup;
+Select.Option.displayName = 'Select.Option';
+Select.Optgroup.displayName = 'Select.Optgroup';
+
+export { Select, SelectOptgroup, SelectOption };

package/dist/esm/components/form/Select/useSelect.js

@@ -0,0 +1,47 @@
+'use client';
+import { useContext } from 'react';
+import { FieldsetContext } from '../Fieldset/FieldsetContext.js';
+import { useFormField } from '../useFormField.js';
+
+/** Handles props for `Select` in context with `Fieldset` */
+const useSelect = (props) => {
+    const fieldset = useContext(FieldsetContext);
+    const { inputProps: selectProps, readOnly = false, size = fieldset?.size ?? 'md', ...rest } = useFormField(props, 'select');
+    return {
+        ...rest,
+        readOnly,
+        size,
+        selectProps: {
+            ...selectProps,
+            readOnly,
+            onClick: (event) => {
+                if (readOnly)
+                    return event.preventDefault();
+                props?.onClick?.(event);
+            },
+            onKeyDown: (event) => {
+                if (readOnly) {
+                    if (event.key === 'Tab')
+                        return;
+                    return event.preventDefault();
+                }
+                props?.onKeyDown?.(event);
+            },
+            onMouseDown: (event) => {
+                if (readOnly) {
+                    if (event.target instanceof HTMLElement)
+                        event.target.focus();
+                    return event.preventDefault();
+                }
+                props?.onMouseDown?.(event);
+            },
+            onChange: (event) => {
+                if (readOnly)
+                    return event.preventDefault();
+                props?.onChange?.(event);
+            },
+        },
+    };
+};
+
+export { useSelect };

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

@@ -1,7 +1,7 @@
 'use client';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { PadlockLockedFillIcon } from '@navikt/aksel-icons';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
+import cl from 'clsx/lite';
 import { forwardRef } from 'react';
 import { useSwitch } from './useSwitch.js';
 import { Paragraph } from '../../Typography/Paragraph/Paragraph.js';
@@ -11,7 +11,7 @@ import { Label } from '../../Typography/Label/Label.js';
 const Switch = forwardRef((props, ref) => {
     const { children, description, position = 'left', className, ...rest } = props;
     const { inputProps, descriptionId, size = 'md', readOnly, } = useSwitch(props);
-    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: clsx(`ds-switch`, `ds-switch--${size}`, inputProps.disabled && `ds-switch--disabled`, readOnly && `ds-switch--readonly`, className), children: [jsx("input", { className: `ds-switch__input`, disabled: inputProps.disabled, ref: ref, ...omit(['size', 'error'], rest), ...inputProps }), jsxs(Label, { className: clsx(`ds-switch__label`, position === 'right' && `ds-switch__label--right`), htmlFor: inputProps.id, size: size, weight: 'regular', children: [jsx("span", { className: `ds-switch__track`, children: jsx("span", { className: `ds-switch__thumb` }) }), readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: `ds-switch__readonly__icon` })), children && jsx("span", { children: children })] }), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: `ds-switch__description`, children: description }) }))] }) }));
+    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: cl(`ds-switch`, `ds-switch--${size}`, inputProps.disabled && `ds-switch--disabled`, readOnly && `ds-switch--readonly`, className), children: [jsx("input", { className: `ds-switch__input`, disabled: inputProps.disabled, ref: ref, ...omit(['size', 'error'], rest), ...inputProps }), jsxs(Label, { className: cl(`ds-switch__label`, position === 'right' && `ds-switch__label--right`), htmlFor: inputProps.id, size: size, weight: 'regular', children: [jsx("span", { className: `ds-switch__track`, children: jsx("span", { className: `ds-switch__thumb` }) }), readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: `ds-switch__readonly__icon` })), children && jsx("span", { children: children })] }), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: `ds-switch__description`, children: description }) }))] }) }));
 });
 Switch.displayName = 'Switch';
 

package/dist/esm/components/form/Textarea/Textarea.js

@@ -1,14 +1,14 @@
 'use client';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { PadlockLockedFillIcon } from '@navikt/aksel-icons';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
+import cl from 'clsx/lite';
 import { forwardRef, useState } from 'react';
 import { CharacterCounter } from '../CharacterCounter.js';
 import { useTextarea } from './useTextarea.js';
 import { Paragraph } from '../../Typography/Paragraph/Paragraph.js';
 import { Label } from '../../Typography/Label/Label.js';
 import { omit } from '../../../utilities/omit/omit.js';
-import { ErrorMessage } from '../../Typography/ErrorMessage/ErrorMessage.js';
+import { ValidationMessage } from '../../Typography/ValidationMessage/ValidationMessage.js';
 
 /** Textarea field
  *
@@ -23,11 +23,11 @@ const Textarea = forwardRef((props, ref) => {
     const [value, setValue] = useState(props.defaultValue);
     const characterLimitId = `${textareaProps.id}-charactercount}`;
     const hasCharacterLimit = characterLimit != null;
-    const describedBy = clsx(textareaProps['aria-describedby'], hasCharacterLimit && characterLimitId) || undefined;
-    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { style: style, className: clsx('ds-textarea', `ds-textarea--${size}`, hasError && `ds-textarea--error`, className), children: [label && (jsxs(Label, { size: size, weight: 'medium', htmlFor: textareaProps.id, className: clsx('ds-textarea__label', hideLabel && `ds-sr-only`), children: [readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: 'ds-textarea__readonly-icon' })), jsx("span", { children: label })] })), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: clsx('ds-textarea__description', hideLabel && `ds-sr-only`), children: description }) })), jsx("textarea", { className: clsx('ds-textarea__input', `ds-focus`), ref: ref, "aria-describedby": describedBy, disabled: textareaProps.disabled, readOnly: readOnly, ...omit(['size', 'error', 'errorId'], rest), ...textareaProps, onChange: (e) => {
+    const describedBy = cl(textareaProps['aria-describedby'], hasCharacterLimit && characterLimitId) || undefined;
+    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { style: style, className: cl('ds-textarea', `ds-textarea--${size}`, hasError && `ds-textarea--error`, className), children: [label && (jsxs(Label, { size: size, weight: 'medium', htmlFor: textareaProps.id, className: cl('ds-textarea__label', hideLabel && `ds-sr-only`), children: [readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: 'ds-textarea__readonly-icon' })), jsx("span", { children: label })] })), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: cl('ds-textarea__description', hideLabel && `ds-sr-only`), children: description }) })), jsx("textarea", { className: cl('ds-textarea__input', `ds-focus`), ref: ref, "aria-describedby": describedBy, disabled: textareaProps.disabled, readOnly: readOnly, ...omit(['size', 'error', 'errorId'], rest), ...textareaProps, onChange: (e) => {
                         textareaProps?.onChange?.(e);
                         setValue(e.target.value);
-                    } }), hasCharacterLimit && (jsx(CharacterCounter, { size: size, value: value ? value.toString() : '', id: characterLimitId, ...characterLimit })), jsx("div", { className: 'ds-textarea__error-message', id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', children: hasError && jsx(ErrorMessage, { size: size, children: props.error }) })] }) }));
+                    } }), hasCharacterLimit && (jsx(CharacterCounter, { size: size, value: value ? value.toString() : '', id: characterLimitId, ...characterLimit })), jsx("div", { className: 'ds-textarea__error-message', id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', children: hasError && (jsx(ValidationMessage, { size: size, children: props.error })) })] }) }));
 });
 Textarea.displayName = 'Textarea';
 

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

@@ -1,14 +1,14 @@
 'use client';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { PadlockLockedFillIcon } from '@navikt/aksel-icons';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
+import cl from 'clsx/lite';
 import { forwardRef, useState, useId } from 'react';
 import { CharacterCounter } from '../CharacterCounter.js';
 import { useTextfield } from './useTextfield.js';
 import { Paragraph } from '../../Typography/Paragraph/Paragraph.js';
 import { Label } from '../../Typography/Label/Label.js';
 import { omit } from '../../../utilities/omit/omit.js';
-import { ErrorMessage } from '../../Typography/ErrorMessage/ErrorMessage.js';
+import { ValidationMessage } from '../../Typography/ValidationMessage/ValidationMessage.js';
 
 /** Text input field
  *
@@ -23,11 +23,11 @@ const Textfield = forwardRef((props, ref) => {
     const [inputValue, setInputValue] = useState(props.value || props.defaultValue);
     const characterLimitId = `textfield-charactercount-${useId()}`;
     const hasCharacterLimit = characterLimit != null;
-    const describedBy = clsx(inputProps['aria-describedby'], hasCharacterLimit && characterLimitId) || undefined;
-    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { style: style, className: clsx(`ds-textfield`, `ds-textfield--${size}`, readOnly && `ds-textfield--readonly`, hasError && `ds-textfield--error`, className), children: [label && (jsxs(Label, { size: size, weight: 'medium', htmlFor: inputProps.id, className: clsx(`ds-textfield__label`, hideLabel && `ds-sr-only`), children: [readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: 'ds-textfield__readonly__icon' })), jsx("span", { children: label })] })), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: clsx(`ds-textfield__description`, hideLabel && `ds-sr-only`), children: description }) })), jsxs("div", { className: 'ds-textfield__field', children: [prefix && (jsx(Paragraph, { asChild: true, size: size, variant: 'short', children: jsx("div", { className: clsx(`ds-textfield__adornment`, `ds-textfield__prefix`), "aria-hidden": 'true', children: prefix }) })), jsx("input", { className: clsx(`ds-textfield__input`, `ds-focus`, prefix && `ds-textfield__input--with-prefix`, suffix && `ds-textfield__input--with-suffix`), ref: ref, type: type, disabled: inputProps.disabled, "aria-describedby": describedBy, size: htmlSize, ...omit(['size', 'error', 'errorId'], rest), ...inputProps, onChange: (e) => {
+    const describedBy = cl(inputProps['aria-describedby'], hasCharacterLimit && characterLimitId) || undefined;
+    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { style: style, className: cl(`ds-textfield`, `ds-textfield--${size}`, readOnly && `ds-textfield--readonly`, hasError && `ds-textfield--error`, className), children: [label && (jsxs(Label, { size: size, weight: 'medium', htmlFor: inputProps.id, className: cl(`ds-textfield__label`, hideLabel && `ds-sr-only`), children: [readOnly && (jsx(PadlockLockedFillIcon, { "aria-hidden": true, className: 'ds-textfield__readonly__icon' })), jsx("span", { children: label })] })), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: cl(`ds-textfield__description`, hideLabel && `ds-sr-only`), children: description }) })), jsxs("div", { className: 'ds-textfield__field', children: [prefix && (jsx(Paragraph, { asChild: true, size: size, variant: 'short', children: jsx("div", { className: cl(`ds-textfield__adornment`, `ds-textfield__prefix`), "aria-hidden": 'true', children: prefix }) })), jsx("input", { className: cl(`ds-textfield__input`, `ds-focus`, prefix && `ds-textfield__input--with-prefix`, suffix && `ds-textfield__input--with-suffix`), ref: ref, type: type, disabled: inputProps.disabled, "aria-describedby": describedBy, size: htmlSize, ...omit(['size', 'error', 'errorId'], rest), ...inputProps, onChange: (e) => {
                                 inputProps?.onChange?.(e);
                                 setInputValue(e.target.value);
-                            } }), suffix && (jsx(Paragraph, { asChild: true, size: size, variant: 'short', children: jsx("div", { className: clsx(`ds-textfield__adornment`, `ds-textfield__suffix`), "aria-hidden": 'true', children: suffix }) }))] }), hasCharacterLimit && (jsx(CharacterCounter, { size: size, value: inputValue ? inputValue.toString() : '', id: characterLimitId, ...characterLimit })), jsx("div", { className: 'ds-textfield__error-message', id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', children: hasError && jsx(ErrorMessage, { size: size, children: props.error }) })] }) }));
+                            } }), suffix && (jsx(Paragraph, { asChild: true, size: size, variant: 'short', children: jsx("div", { className: cl(`ds-textfield__adornment`, `ds-textfield__suffix`), "aria-hidden": 'true', children: suffix }) }))] }), hasCharacterLimit && (jsx(CharacterCounter, { size: size, value: inputValue ? inputValue.toString() : '', id: characterLimitId, ...characterLimit })), jsx("div", { className: 'ds-textfield__error-message', id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', children: hasError && (jsx(ValidationMessage, { size: size, children: props.error })) })] }) }));
 });
 Textfield.displayName = 'Textfield';
 

package/dist/esm/components/form/useFormField.js

@@ -1,5 +1,5 @@
 'use client';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
+import cl from 'clsx/lite';
 import { useContext, useId } from 'react';
 import { FieldsetContext } from './Fieldset/FieldsetContext.js';
 
@@ -26,7 +26,7 @@ const useFormField = (props, prefix) => {
             id,
             disabled,
             'aria-invalid': hasError ? true : undefined,
-            'aria-describedby': clsx(props['aria-describedby'], !!props?.description &&
+            'aria-describedby': cl(props['aria-describedby'], !!props?.description &&
                 typeof props?.description === 'string' &&
                 descriptionId, hasError && !fieldset?.error && errorId, hasError && !!fieldset?.error && fieldset?.errorId) || undefined,
         },

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

@@ -0,0 +1,16 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { useMergeRefs } from '@floating-ui/react';
+import { Slot } from '@radix-ui/react-slot';
+import cl from 'clsx/lite';
+import { forwardRef } from 'react';
+import { useSynchronizedAnimation } from '../../../utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js';
+
+const Skeleton = forwardRef(function Skeleton({ asChild, className, height, style, variant = 'rectangle', width, ...rest }, ref) {
+    const Component = asChild ? Slot : 'span';
+    const animationRef = useSynchronizedAnimation('ds-skeleton-opacity-fade');
+    const mergedRefs = useMergeRefs([animationRef, ref]);
+    return (jsx(Component, { "aria-hidden": 'true', className: cl('ds-skeleton', className), "data-variant": variant, ref: mergedRefs, style: { width, height, ...style }, ...rest }));
+});
+
+export { Skeleton };

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

@@ -0,0 +1,14 @@
+'use client';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import cl from 'clsx/lite';
+import { useSynchronizedAnimation } from '../../../utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js';
+
+/**  Spinner component used for indicating busy or indeterminate loading */
+const Spinner = ({ title, color = 'neutral', size = 'md', className, ...rest }) => {
+    const svgRef = useSynchronizedAnimation('ds-spinner-rotate-animation');
+    const strokeRef = useSynchronizedAnimation('ds-spinner-stroke-animation');
+    return (jsxs("svg", { className: cl('ds-spinner', className), viewBox: '0 0 50 50', ref: svgRef, "data-color": color, "data-size": size, ...rest, children: [jsx("title", { children: title }), 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 })] }));
+};
+Spinner.displayName = 'Spinner';
+
+export { Spinner };

package/dist/esm/index.js

@@ -1,38 +1,36 @@
 'use client';
-export { default as ErrorSummaryList } from './components/ErrorSummary/ErrorSummaryList.js';
 export { useSynchronizedAnimation } from './utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js';
 export { useIsomorphicLayoutEffect } from './utilities/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.js';
 export { RovingFocusRoot } from './utilities/RovingFocus/RovingFocusRoot.js';
 export { useRovingFocus } from './utilities/RovingFocus/useRovingFocus.js';
 export { RovingFocusItem, getNextFocusableValue, getPrevFocusableValue } from './utilities/RovingFocus/RovingFocusItem.js';
 export { omit } from './utilities/omit/omit.js';
+export { Avatar } from './components/Avatar/Avatar.js';
 export { Button } from './components/Button/Button.js';
 export { Badge } from './components/Badge/Badge.js';
 export { Breadcrumbs } from './components/Breadcrumbs/index.js';
-export { BreadcrumbsRoot } from './components/Breadcrumbs/BreadcrumbsRoot.js';
-export { BreadcrumbsNav } from './components/Breadcrumbs/BreadcrumbsNav.js';
 export { BreadcrumbsList } from './components/Breadcrumbs/BreadcrumbsList.js';
 export { BreadcrumbsItem } from './components/Breadcrumbs/BreadcrumbsItem.js';
 export { BreadcrumbsLink } from './components/Breadcrumbs/BreadcrumbsLink.js';
 export { HelpText } from './components/HelpText/HelpText.js';
-export { Spinner } from './components/Spinner/Spinner.js';
+export { Spinner } from './components/loaders/Spinner/Spinner.js';
+export { Skeleton } from './components/loaders/Skeleton/Skeleton.js';
 export { Link } from './components/Link/Link.js';
 export { List } from './components/List/index.js';
-export { ListRoot } from './components/List/ListRoot.js';
+export { ListOrdered, ListUnordered } from './components/List/Lists.js';
 export { ListItem } from './components/List/ListItem.js';
-export { ListHeading } from './components/List/ListHeading.js';
-export { Ordered as ListOrdered, Unordered as ListUnordered } from './components/List/Lists.js';
 export { Paragraph } from './components/Typography/Paragraph/Paragraph.js';
 export { Heading } from './components/Typography/Heading/Heading.js';
 export { Ingress } from './components/Typography/Ingress/Ingress.js';
 export { Label } from './components/Typography/Label/Label.js';
-export { ErrorMessage } from './components/Typography/ErrorMessage/ErrorMessage.js';
+export { ValidationMessage } from './components/Typography/ValidationMessage/ValidationMessage.js';
 export { Accordion } from './components/Accordion/index.js';
-export { AccordionRoot } from './components/Accordion/AccordionRoot.js';
 export { AccordionItem } from './components/Accordion/AccordionItem.js';
 export { AccordionContent } from './components/Accordion/AccordionContent.js';
 export { AccordionHeading } from './components/Accordion/AccordionHeading.js';
-export { NativeSelect } from './components/form/NativeSelect/NativeSelect.js';
+export { Select } from './components/form/Select/index.js';
+export { SelectOption } from './components/form/Select/SelectOption.js';
+export { SelectOptgroup } from './components/form/Select/SelectOptgroup.js';
 export { Alert } from './components/Alert/Alert.js';
 export { Tag } from './components/Tag/Tag.js';
 export { Chip } from './components/Chip/index.js';
@@ -42,7 +40,7 @@ export { ToggleChip as ChipToggle } from './components/Chip/Toggle/Toggle.js';
 export { usePagination } from './components/Pagination/usePagination.js';
 export { Pagination } from './components/Pagination/index.js';
 export { PaginationRoot } from './components/Pagination/PaginationRoot.js';
-export { PaginationContent } from './components/Pagination/PaginationContent.js';
+export { PaginationList } from './components/Pagination/PaginationList.js';
 export { PaginationItem } from './components/Pagination/PaginationItem.js';
 export { PaginationButton } from './components/Pagination/PaginationButton.js';
 export { PaginationEllipsis } from './components/Pagination/PaginationEllipsis.js';
@@ -58,16 +56,13 @@ export { Switch } from './components/form/Switch/Switch.js';
 export { Textfield } from './components/form/Textfield/Textfield.js';
 export { Textarea } from './components/form/Textarea/Textarea.js';
 export { Tabs } from './components/Tabs/index.js';
-export { TabsRoot } from './components/Tabs/TabsRoot.js';
-export { Tab } from './components/Tabs/Tab.js';
-export { TabList } from './components/Tabs/TabList.js';
-export { TabContent } from './components/Tabs/TabContent.js';
+export { TabsTab } from './components/Tabs/TabsTab.js';
+export { TabsList } from './components/Tabs/TabsList.js';
+export { TabsPanel } from './components/Tabs/TabsPanel.js';
 export { ToggleGroup } from './components/ToggleGroup/index.js';
-export { ToggleGroupRoot } from './components/ToggleGroup/ToggleGroupRoot.js';
-export { ToggleGroupItem } from './components/ToggleGroup/ToggleGroupItem/ToggleGroupItem.js';
+export { ToggleGroupItem } from './components/ToggleGroup/ToggleGroupItem.js';
 export { Popover } from './components/Popover/index.js';
-export { PopoverRoot } from './components/Popover/PopoverRoot.js';
-export { PopoverContent } from './components/Popover/PopoverContent.js';
+export { PopoverContext } from './components/Popover/PopoverContext.js';
 export { PopoverTrigger } from './components/Popover/PopoverTrigger.js';
 export { Divider } from './components/Divider/Divider.js';
 export { Modal } from './components/Modal/index.js';
@@ -77,18 +72,13 @@ export { ModalFooter } from './components/Modal/ModalFooter.js';
 export { ModalHeader } from './components/Modal/ModalHeader.js';
 export { ModalTrigger } from './components/Modal/ModalTrigger.js';
 export { ModalDialog } from './components/Modal/ModalDialog.js';
-export { DropdownMenu } from './components/DropdownMenu/index.js';
-export { DropdownMenuRoot } from './components/DropdownMenu/DropdownMenuRoot.js';
-export { DropdownMenuContent } from './components/DropdownMenu/DropdownMenuContent.js';
-export { DropdownMenuGroup } from './components/DropdownMenu/DropdownMenuGroup.js';
-export { DropdownMenuItem } from './components/DropdownMenu/DropdownMenuItem.js';
-export { DropdownMenuTrigger } from './components/DropdownMenu/DropdownMenuTrigger.js';
+export { Dropdown } from './components/Dropdown/index.js';
+export { DropdownContext } from './components/Dropdown/DropdownContext.js';
+export { DropdownList } from './components/Dropdown/DropdownList.js';
+export { DropdownHeading } from './components/Dropdown/DropdownHeading.js';
+export { DropdownItem } from './components/Dropdown/DropdownItem.js';
+export { DropdownTrigger } from './components/Dropdown/DropdownTrigger.js';
 export { Search } from './components/form/Search/Search.js';
-export { Skeleton } from './components/Skeleton/index.js';
-export { Circle as SkeletonCircle } from './components/Skeleton/Circle/Circle.js';
-export { Rectangle as SkeletonRectangle } from './components/Skeleton/Rectangle/Rectangle.js';
-export { Text as SkeletonText } from './components/Skeleton/Text/Text.js';
-export { Box } from './components/Box/Box.js';
 export { Card } from './components/Card/index.js';
 export { CardHeader } from './components/Card/CardHeader.js';
 export { CardContent } from './components/Card/CardContent.js';
@@ -104,6 +94,6 @@ export { TableRow } from './components/Table/TableRow.js';
 export { TableCell } from './components/Table/TableCell.js';
 export { TableHeaderCell } from './components/Table/TableHeaderCell.js';
 export { ErrorSummary } from './components/ErrorSummary/index.js';
-export { ErrorSummaryRoot } from './components/ErrorSummary/ErrorSummaryRoot.js';
 export { ErrorSummaryItem } from './components/ErrorSummary/ErrorSummaryItem.js';
 export { ErrorSummaryHeading } from './components/ErrorSummary/ErrorSummaryHeading.js';
+export { ErrorSummaryList } from './components/ErrorSummary/ErrorSummaryList.js';

package/dist/esm/utilities/RovingFocus/RovingFocusItem.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
-import { useMergeRefs } from '../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
-import { Slot } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
+import { useMergeRefs } from '@floating-ui/react';
+import { Slot } from '@radix-ui/react-slot';
 import { forwardRef } from 'react';
 import { useRovingFocus } from './useRovingFocus.js';
 

package/dist/esm/utilities/RovingFocus/RovingFocusRoot.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
-import { useMergeRefs } from '../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
-import { Slot } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
+import { useMergeRefs } from '@floating-ui/react';
+import { Slot } from '@radix-ui/react-slot';
 import { createContext, forwardRef, useState, useRef, useEffect } from 'react';
 
 const RovingFocusContext = createContext({

package/dist/esm/utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js

@@ -29,11 +29,13 @@ function useSynchronizedAnimation(animationName) {
         if (myAnimation && myAnimation === firstOfType) {
             myAnimation.currentTime = 0;
         }
-        if (myAnimation && firstOfType && myAnimation !== firstOfType) {
+        if (myAnimation &&
+            firstOfType?.currentTime &&
+            myAnimation !== firstOfType) {
             myAnimation.currentTime = firstOfType.currentTime;
         }
         return () => {
-            if (myAnimation && firstOfType) {
+            if (myAnimation && firstOfType?.currentTime) {
                 myAnimation.currentTime = firstOfType.currentTime;
             }
         };

package/dist/types/components/Accordion/{AccordionRoot.d.ts → Accordion.d.ts}

@@ -1,5 +1,5 @@
 import type { HTMLAttributes, ReactNode } from 'react';
-export type AccordionRootProps = {
+export type AccordionProps = {
     /**
      * Accordion background color
      * @default neutral
@@ -14,9 +14,9 @@ export type AccordionRootProps = {
     children: ReactNode;
 } & HTMLAttributes<HTMLDivElement>;
 /**
- * Accordion root component, contains `Accordion.Item` components.
+ * Accordion component, contains `Accordion.Item` components.
  */
-export declare const AccordionRoot: import("react").ForwardRefExoticComponent<{
+export declare const Accordion: React.ForwardRefExoticComponent<{
     /**
      * Accordion background color
      * @default neutral
@@ -29,5 +29,5 @@ export declare const AccordionRoot: import("react").ForwardRefExoticComponent<{
     border?: boolean;
     /** Instances of `Accordion.Item` */
     children: ReactNode;
-} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=AccordionRoot.d.ts.map
+} & HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Accordion.d.ts.map

package/dist/types/components/Accordion/Accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,MAAM,MAAM,cAAc,GAAG;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC9D;;;QAGI;IACJ,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oCAAoC;IACpC,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC;;GAEG;AACH,eAAO,MAAM,SAAS;IAjBpB;;;OAGG;YACK,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ;IAC7D;;;QAGI;aACK,OAAO;IAChB,oCAAoC;cAC1B,SAAS;yEAqBpB,CAAC"}

package/dist/types/components/Accordion/AccordionContent.d.ts

@@ -5,5 +5,5 @@ export type AccordionContentProps = HTMLAttributes<HTMLDivElement>;
  * @example
  * <AccordionContent>Content</AccordionContent>
  */
-export declare const AccordionContent: import("react").ForwardRefExoticComponent<AccordionContentProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const AccordionContent: React.ForwardRefExoticComponent<AccordionContentProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=AccordionContent.d.ts.map

package/dist/types/components/Accordion/AccordionContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionContent.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/AccordionContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAQ5C,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnE;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,kHA0B3B,CAAC"}
+{"version":3,"file":"AccordionContent.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/AccordionContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAK5C,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnE;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,8FAS3B,CAAC"}

package/dist/types/components/Accordion/AccordionHeading.d.ts

@@ -1,29 +1,15 @@
-import type { HTMLAttributes, MouseEventHandler, ReactNode } from 'react';
+import type { HTMLAttributes, ReactNode } from 'react';
 export type AccordionHeadingProps = {
-    /**
-     * Heading level. Use this to make sure the heading is correct according to you page heading levels
-     * @default 1
-     */
-    level?: 1 | 2 | 3 | 4 | 5 | 6;
-    /** Handle when clicked on header */
-    onHeaderClick?: MouseEventHandler<HTMLButtonElement> | undefined;
     /** Heading text */
     children: ReactNode;
-} & HTMLAttributes<HTMLHeadingElement>;
+} & HTMLAttributes<HTMLElement>;
 /**
- * Accordion heading component, contains a button to toggle the content.
+ * Accordion header component, contains a button to toggle the content.
  * @example
- * <AccordionHeading>Header</AccordionHeading>
+ * <AccordionHeader>Header</AccordionHeader>
  */
-export declare const AccordionHeading: import("react").ForwardRefExoticComponent<{
-    /**
-     * Heading level. Use this to make sure the heading is correct according to you page heading levels
-     * @default 1
-     */
-    level?: 1 | 2 | 3 | 4 | 5 | 6;
-    /** Handle when clicked on header */
-    onHeaderClick?: MouseEventHandler<HTMLButtonElement> | undefined;
+export declare const AccordionHeading: React.ForwardRefExoticComponent<{
     /** Heading text */
     children: ReactNode;
-} & HTMLAttributes<HTMLHeadingElement> & import("react").RefAttributes<HTMLHeadingElement>>;
+} & HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
 //# sourceMappingURL=AccordionHeading.d.ts.map

package/dist/types/components/Accordion/AccordionHeading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionHeading.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/AccordionHeading.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAO1E,MAAM,MAAM,qBAAqB,GAAG;IAClC;;;OAGG;IACH,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC9B,oCAAoC;IACpC,aAAa,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAC;IACjE,mBAAmB;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,kBAAkB,CAAC,CAAC;AAEvC;;;;GAIG;AACH,eAAO,MAAM,gBAAgB;IAhB3B;;;OAGG;YACK,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC;IAC7B,oCAAoC;oBACpB,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS;IAChE,mBAAmB;cACT,SAAS;2FAoDnB,CAAC"}
+{"version":3,"file":"AccordionHeading.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/AccordionHeading.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvD,MAAM,MAAM,qBAAqB,GAAG;IAClC,mBAAmB;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC;AAEhC;;;;GAIG;AACH,eAAO,MAAM,gBAAgB;IAT3B,mBAAmB;cACT,SAAS;mEAuBpB,CAAC"}

package/dist/types/components/Accordion/AccordionItem.d.ts

@@ -1,4 +1,5 @@
 import type { HTMLAttributes, ReactNode } from 'react';
+import '@u-elements/u-details';
 export type AccordionItemProps = {
     /**
      * Controls open-state.
@@ -13,39 +14,24 @@ export type AccordionItemProps = {
      * @default false
      */
     defaultOpen?: boolean;
+    /** Callback function when AccordionItem wants to open due to a find in page-search */
+    onFound?: () => void;
     /** Content should be one `<Accordion.Header>` and `<Accordion.Content>` */
-    children: ReactNode;
-} & HTMLAttributes<HTMLDivElement>;
-type AccordionItemContextProps = {
+    children?: ReactNode;
+} & HTMLAttributes<HTMLDetailsElement> & ({
     open: boolean;
-    toggleOpen: () => void;
-    contentId: string;
-};
-export declare const AccordionItemContext: import("react").Context<AccordionItemContextProps | null>;
+    onFound: () => void;
+} | {
+    open?: never;
+    onFound?: () => void;
+});
 /**
  * Accordion item component, contains `Accordion.Header` and `Accordion.Content` components.
  * @example
  * <AccordionItem>
- *  <AccordionHeading>Header</AccordionHeading>
+ *  <AccordionHeader>Header</AccordionHeader>
  *  <AccordionContent>Content</AccordionContent>
  * </AccordionItem>
  */
-export declare const AccordionItem: import("react").ForwardRefExoticComponent<{
-    /**
-     * Controls open-state.
-     *
-     * Using this removes automatic control of open-state
-     *
-     * @default undefined
-     */
-    open?: boolean;
-    /**
-     * Defaults the accordion to open if not controlled
-     * @default false
-     */
-    defaultOpen?: boolean;
-    /** Content should be one `<Accordion.Header>` and `<Accordion.Content>` */
-    children: ReactNode;
-} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
-export {};
+export declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDetailsElement>>;
 //# sourceMappingURL=AccordionItem.d.ts.map

package/dist/types/components/Accordion/AccordionItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/AccordionItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2EAA2E;IAC3E,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,KAAK,yBAAyB,GAAG;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,oBAAoB,2DACsB,CAAC;AAExD;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa;IAlCxB;;;;;;OAMG;WACI,OAAO;IACd;;;OAGG;kBACW,OAAO;IACrB,2EAA2E;cACjE,SAAS;mFAmDpB,CAAC"}
+{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/AccordionItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,uBAAuB,CAAC;AAE/B,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sFAAsF;IACtF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,GAAG,cAAc,CAAC,kBAAkB,CAAC,GACpC,CACI;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,GACtC;IAAE,IAAI,CAAC,EAAE,KAAK,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,CACzC,CAAC;AAEJ;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa,+FAkDzB,CAAC"}

package/dist/types/components/Accordion/index.d.ts

@@ -1,13 +1,8 @@
-import type { AccordionContentProps } from './AccordionContent';
+import { Accordion as AccordionParent } from './Accordion';
 import { AccordionContent } from './AccordionContent';
-import type { AccordionHeadingProps } from './AccordionHeading';
 import { AccordionHeading } from './AccordionHeading';
-import type { AccordionItemProps } from './AccordionItem';
 import { AccordionItem } from './AccordionItem';
-import type { AccordionRootProps } from './AccordionRoot';
-import { AccordionRoot } from './AccordionRoot';
-type AccordionComponent = {
-    Root: typeof AccordionRoot;
+type AccordionComponent = typeof AccordionParent & {
     Item: typeof AccordionItem;
     Heading: typeof AccordionHeading;
     Content: typeof AccordionContent;
@@ -15,14 +10,17 @@ type AccordionComponent = {
 /**
  * Accordions are used to toggle the visibility of content.
  * @example
- * <Accordion.Root>
+ * <Accordion>
  *  <Accordion.Item>
  *   <Accordion.Heading>Heading 1</Accordion.Heading>
  *   <Accordion.Content>Content 1</Accordion.Content>
  *  </Accordion.Item>
- * <Accordion.Item>
+ * <Accordion>
  */
 declare const Accordion: AccordionComponent;
-export type { AccordionRootProps, AccordionContentProps, AccordionHeadingProps, AccordionItemProps, };
-export { Accordion, AccordionRoot, AccordionItem, AccordionContent, AccordionHeading, };
+export type { AccordionContentProps } from './AccordionContent';
+export type { AccordionHeadingProps } from './AccordionHeading';
+export type { AccordionItemProps } from './AccordionItem';
+export type { AccordionProps } from './Accordion';
+export { Accordion, AccordionItem, AccordionContent, AccordionHeading };
 //# sourceMappingURL=index.d.ts.map

package/dist/types/components/Accordion/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,KAAK,kBAAkB,GAAG;IACxB,IAAI,EAAE,OAAO,aAAa,CAAC;IAC3B,IAAI,EAAE,OAAO,aAAa,CAAC;IAC3B,OAAO,EAAE,OAAO,gBAAgB,CAAC;IACjC,OAAO,EAAE,OAAO,gBAAgB,CAAC;CAClC,CAAC;AAEF;;;;;;;;;GASG;AACH,QAAA,MAAM,SAAS,EAAS,kBAAkB,CAAC;AAY3C,YAAY,EACV,kBAAkB,EAClB,qBAAqB,EACrB,qBAAqB,EACrB,kBAAkB,GACnB,CAAC;AACF,OAAO,EACL,SAAS,EACT,aAAa,EACb,aAAa,EACb,gBAAgB,EAChB,gBAAgB,GACjB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,IAAI,eAAe,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,KAAK,kBAAkB,GAAG,OAAO,eAAe,GAAG;IACjD,IAAI,EAAE,OAAO,aAAa,CAAC;IAC3B,OAAO,EAAE,OAAO,gBAAgB,CAAC;IACjC,OAAO,EAAE,OAAO,gBAAgB,CAAC;CAClC,CAAC;AAEF;;;;;;;;;GASG;AACH,QAAA,MAAM,SAAS,EAAsB,kBAAkB,CAAC;AAUxD,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}