@digdir/designsystemet-react 1.0.0-next.47 → 1.0.0-next.49

package/dist/esm/index.js

@@ -27,7 +27,6 @@ export { Alert } from './components/Alert/Alert.js';
 export { Tag } from './components/Tag/Tag.js';
 export { Chip } from './components/Chip/index.js';
 export { ChipButton, ChipCheckbox, ChipRadio, ChipRemovable } from './components/Chip/Chips.js';
-export { usePagination } from './components/Pagination/usePagination.js';
 export { Pagination } from './components/Pagination/index.js';
 export { PaginationList } from './components/Pagination/PaginationList.js';
 export { PaginationItem } from './components/Pagination/PaginationItem.js';
@@ -57,10 +56,10 @@ export { Popover } from './components/Popover/index.js';
 export { PopoverTriggerContext } from './components/Popover/PopoverTriggerContext.js';
 export { PopoverTrigger } from './components/Popover/PopoverTrigger.js';
 export { Divider } from './components/Divider/Divider.js';
-export { Modal } from './components/Modal/index.js';
-export { ModalBlock } from './components/Modal/ModalBlock.js';
-export { ModalTriggerContext } from './components/Modal/ModalTriggerContext.js';
-export { ModalTrigger } from './components/Modal/ModalTrigger.js';
+export { Dialog } from './components/Dialog/index.js';
+export { DialogBlock } from './components/Dialog/DialogBlock.js';
+export { DialogTriggerContext } from './components/Dialog/DialogTriggerContext.js';
+export { DialogTrigger } from './components/Dialog/DialogTrigger.js';
 export { Dropdown } from './components/Dropdown/index.js';
 export { DropdownTriggerContext } from './components/Dropdown/DropdownTriggerContext.js';
 export { DropdownList } from './components/Dropdown/DropdownList.js';
@@ -88,14 +87,21 @@ export { ErrorSummary } from './components/ErrorSummary/index.js';
 export { ErrorSummaryItem } from './components/ErrorSummary/ErrorSummaryItem.js';
 export { ErrorSummaryHeading } from './components/ErrorSummary/ErrorSummaryHeading.js';
 export { ErrorSummaryList } from './components/ErrorSummary/ErrorSummaryList.js';
+export { ErrorSummaryLink } from './components/ErrorSummary/ErrorSummaryLink.js';
+export { EXPERIMENTAL_Suggestion } from './components/Suggestion/index.js';
+export { SuggestionList as EXPERIMENTAL_SuggestionList } from './components/Suggestion/SuggestionList.js';
+export { SuggestionInput as EXPERIMENTAL_SuggestionInput } from './components/Suggestion/SuggestionInput.js';
+export { SuggestionEmpty as EXPERIMENTAL_SuggestionEmpty } from './components/Suggestion/SuggestionEmpty.js';
+export { SuggestionOption as EXPERIMENTAL_SuggestionOption } from './components/Suggestion/SuggestionOption.js';
+export { SuggestionClear as EXPERIMENTAL_SuggestionClear } from './components/Suggestion/SuggestionClear.js';
 export { omit } from './utilities/omit/omit.js';
 export { useCheckboxGroup } from './utilities/hooks/useCheckboxGroup/useCheckboxGroup.js';
 export { useDebounceCallback } from './utilities/hooks/useDebounceCallback/useDebounceCallback.js';
 export { useIsomorphicLayoutEffect } from './utilities/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.js';
 export { useMediaQuery } from './utilities/hooks/useMediaQuery/useMediaQuery.js';
-export { usePrevious } from './utilities/hooks/usePrevious/usePrevious.js';
 export { useRadioGroup } from './utilities/hooks/useRadioGroup/useRadioGroup.js';
 export { useSynchronizedAnimation } from './utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js';
+export { usePagination } from './utilities/hooks/usePagination/usePagination.js';
 export { RovingFocusRoot } from './utilities/RovingFocus/RovingFocusRoot.js';
 export { useRovingFocus } from './utilities/RovingFocus/useRovingFocus.js';
 export { RovingFocusItem, getNextFocusableValue, getPrevFocusableValue } from './utilities/RovingFocus/RovingFocusItem.js';

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

@@ -2,7 +2,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { useMergeRefs } from '@floating-ui/react';
 import { Slot } from '@radix-ui/react-slot';
-import { createContext, forwardRef, useState, useRef, useEffect } from 'react';
+import { forwardRef, useState, useRef, useEffect, createContext } from 'react';
 
 const RovingFocusContext = createContext({
     elements: { current: new Map() },
@@ -21,7 +21,7 @@ const RovingFocusRoot = forwardRef(({ activeValue, asChild, orientation = 'horiz
     const [focusableValue, setFocusableValue] = useState(null);
     const [isShiftTabbing, setIsShiftTabbing] = useState(false);
     const elements = useRef(new Map());
-    const myRef = useRef();
+    const myRef = useRef(null);
     const refs = useMergeRefs([ref, myRef]);
     const getOrderedItems = () => {
         if (!myRef.current)

package/dist/esm/{components/Pagination → utilities/hooks/usePagination}/usePagination.js

@@ -12,8 +12,36 @@ const getSteps = (now, max, show) => {
         pages.splice(-2, 2, 0, max);
     return pages;
 };
-/** Hook to help manage pagination state */
-const usePagination = ({ currentPage = 1, setCurrentPage, onChange, totalPages, showPages = 7, }) => useMemo(() => {
+/**
+ * Hook to help manage pagination state
+ *
+ * @example
+ * const { pages, nextButtonProps, prevButtonProps } = usePagination({
+ *   currentPage: page,
+ *   totalPages: 10,
+ *   showPages: 7,
+ *   setCurrentPage,
+ * })
+ *
+ * <Pagination>
+ *   <Pagination.Item>
+ *     <Pagination.Button {...prevButtonProps}>Forrige</Pagination.Button>
+ *   </Pagination.Item>
+ *   {pages.map(({ page, itemKey, buttonProps }) => (
+ *     <Pagination.Item key={itemKey}>
+ *       {typeof page === 'number' && (
+ *         <Pagination.Button {...buttonProps} aria-label={`Side ${page}`}>
+ *           {page}
+ *         </Pagination.Button>
+ *       )}
+ *     </Pagination.Item>
+ *   ))}
+ *   <Pagination.Item>
+ *     <Pagination.Button {...nextButtonProps}>Neste</Pagination.Button>
+ *   </Pagination.Item>
+ * </Pagination>
+ **/
+const usePagination = ({ currentPage = 1, setCurrentPage, onChange, totalPages = 1, showPages = 7, }) => useMemo(() => {
     const hasNext = currentPage < totalPages;
     const hasPrev = currentPage !== 1;
     const handleClick = (page) => (event) => {
@@ -26,8 +54,17 @@ const usePagination = ({ currentPage = 1, setCurrentPage, onChange, totalPages,
     return {
         /** Number of steps */
         pages: getSteps(currentPage, totalPages, showPages).map((page, index) => ({
+            /**
+             * Page number or "ellipsis" for the ellipsis item
+             */
             page: page || 'ellipsis',
+            /**
+             * Unique key for the item
+             */
             itemKey: page ? `page-${page}` : `ellipsis-${index}`, // React key utility
+            /**
+             * Properties to spread on Pagination.Button
+             */
             buttonProps: (page
                 ? {
                     'aria-current': page === currentPage ? 'page' : undefined,

package/dist/types/colors.d.ts

@@ -1,3 +1,7 @@
+declare const emptyObjectSymbol: unique symbol;
+type EmptyObject = {
+    [emptyObjectSymbol]?: never;
+};
 /**
  * Base interface for available colors in the design system.
  * The CLI will generate augmentations of this interface to allow
@@ -5,7 +9,13 @@
  */
 export interface MainAndSupportColors {
 }
+/**
+ * If {@link MainAndSupportColors} has been extended to include color names, return T,
+ * otherwise return the arbitrary string type.
+ */
+type ColorWithFallback<T> = MainAndSupportColors extends EmptyObject ? string & {} : T;
 export type SeverityColors = 'info' | 'success' | 'warning' | 'danger';
-export type CustomColors = 'neutral' | keyof MainAndSupportColors;
-export type Color = CustomColors | SeverityColors;
+export type CustomColors = ColorWithFallback<'neutral' | keyof MainAndSupportColors>;
+export type Color = CustomColors | ColorWithFallback<SeverityColors>;
+export {};
 //# sourceMappingURL=colors.d.ts.map

package/dist/types/colors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../src/colors.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,MAAM,WAAW,oBAAoB;CAAG;AAExC,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEvE,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,MAAM,oBAAoB,CAAC;AAElE,MAAM,MAAM,KAAK,GAAG,YAAY,GAAG,cAAc,CAAC"}
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../src/colors.ts"],"names":[],"mappings":"AACA,OAAO,CAAC,MAAM,iBAAiB,EAAE,OAAO,MAAM,CAAC;AAC/C,KAAK,WAAW,GAAG;IAAE,CAAC,iBAAiB,CAAC,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAEnD;;;;GAIG;AAGH,MAAM,WAAW,oBAAoB;CAAG;AAExC;;;GAGG;AACH,KAAK,iBAAiB,CAAC,CAAC,IAAI,oBAAoB,SAAS,WAAW,GAChE,MAAM,GAAG,EAAE,GACX,CAAC,CAAC;AAEN,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEvE,MAAM,MAAM,YAAY,GAAG,iBAAiB,CAC1C,SAAS,GAAG,MAAM,oBAAoB,CACvC,CAAC;AAEF,MAAM,MAAM,KAAK,GAAG,YAAY,GAAG,iBAAiB,CAAC,cAAc,CAAC,CAAC"}

package/dist/types/components/Alert/Alert.d.ts

@@ -5,19 +5,22 @@ import type { MergeRight } from '../../utilities';
 export type AlertProps = MergeRight<DefaultProps & HTMLAttributes<HTMLDivElement>, {
     /**
      * Sets color and icon.
-     * @default info
+     *
+     * @default 'info'
      */
     'data-color'?: SeverityColors;
 }>;
 /**
  * Alerts are used to inform users about important information, warnings, errors, or success.
+ *
  * @example
- * <Alert color='info'>Dette er en informasjonsmelding</Alert>
+ * <Alert data-color='info'>Dette er en informasjonsmelding</Alert>
  */
 export declare const Alert: React.ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLDivElement>, "data-color"> & {
     /**
      * Sets color and icon.
-     * @default info
+     *
+     * @default 'info'
      */
     'data-color'?: SeverityColors;
 } & React.RefAttributes<HTMLDivElement>>;

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

@@ -1 +1 @@
-{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,UAAU,GAAG,UAAU,CACjC,YAAY,GAAG,cAAc,CAAC,cAAc,CAAC,EAC7C;IACE;;;OAGG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B,CACF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,KAAK;IAbd;;;OAGG;mBACY,cAAc;wCAqB/B,CAAC"}
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,UAAU,GAAG,UAAU,CACjC,YAAY,GAAG,cAAc,CAAC,cAAc,CAAC,EAC7C;IACE;;;;OAIG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B,CACF,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,KAAK;IAfd;;;;OAIG;mBACY,cAAc;wCAsB/B,CAAC"}

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

@@ -1,2 +1,3 @@
-export * from './Alert';
+export { Alert } from './Alert';
+export type { AlertProps } from './Alert';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}

package/dist/types/components/Badge/Badge.d.ts

@@ -10,24 +10,26 @@ export type BadgeProps = MergeRight<DefaultProps & HTMLAttributes<HTMLSpanElemen
      * The maximum number to display in the badge, when the count exceeds this number, the badge will display `{max}+`
      */
     maxCount?: number;
+    /**
+     * Change the background color of the badge.
+     *
+     * @default 'base'
+     */
+    'data-variant'?: 'base' | 'tinted';
     children?: never;
 }>;
 /**
  * `Badge` is a non-interactive component for displaying status with or without numbers.
  *
  * @example without children
- * ```jsx
- * <Badge color='accent' count={5} />
- * ```
+ * <Badge count={5} maxCount={10} />
  *
  * @example with children
- * ```jsx
- * <Badge color='accent'>
- *  <Icon />
+ * <Badge count={5} maxCount={10}>
+ *   <Icon />
  * </Badge>
- * ```
  */
-export declare const Badge: React.ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLSpanElement>, "children" | "count" | "maxCount"> & {
+export declare const Badge: React.ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLSpanElement>, "children" | "data-variant" | "count" | "maxCount"> & {
     /**
      * The number to display in the badge
      */
@@ -36,6 +38,12 @@ export declare const Badge: React.ForwardRefExoticComponent<Omit<DefaultProps &
      * The maximum number to display in the badge, when the count exceeds this number, the badge will display `{max}+`
      */
     maxCount?: number;
+    /**
+     * Change the background color of the badge.
+     *
+     * @default 'base'
+     */
+    'data-variant'?: "base" | "tinted";
     children?: never;
 } & React.RefAttributes<HTMLSpanElement>>;
 //# sourceMappingURL=Badge.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAc,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,UAAU,GAAG,UAAU,CACjC,YAAY,GAAG,cAAc,CAAC,eAAe,CAAC,EAC9C;IACE;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB,CACF,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,KAAK;IA3Bd;;OAEG;YACK,MAAM;IACd;;OAEG;eACQ,MAAM;eACN,KAAK;yCAiClB,CAAC"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAc,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,UAAU,GAAG,UAAU,CACjC,YAAY,GAAG,cAAc,CAAC,eAAe,CAAC,EAC9C;IACE;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB,CACF,CAAC;AAEF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,KAAK;IA7Bd;;OAEG;YACK,MAAM;IACd;;OAEG;eACQ,MAAM;IACjB;;;;OAIG;qBACc,MAAM,GAAG,QAAQ;eACvB,KAAK;yCA8BlB,CAAC"}

package/dist/types/components/Badge/BadgePosition.d.ts

@@ -15,6 +15,15 @@ export type BadgePositionProps = MergeRight<DefaultProps & HTMLAttributes<HTMLSp
      */
     overlap?: 'circle' | 'rectangle';
 }>;
+/**
+ * `BadgePosition` is a component that positions the badge.
+ *
+ * @example
+ * <BadgePosition placement='top-right' overlap='circle'>
+ *  <Badge count={5} maxCount={10} />
+ *  <Element />
+ * </BadgePosition>
+ */
 export declare const BadgePosition: React.ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLSpanElement>, "placement" | "overlap"> & {
     /**
      * The placement of the badge

package/dist/types/components/Badge/BadgePosition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BadgePosition.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/BadgePosition.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAc,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAClD,MAAM,MAAM,kBAAkB,GAAG,UAAU,CACzC,YAAY,GAAG,cAAc,CAAC,eAAe,CAAC,EAC9C;IACE;;;;OAIG;IACH,SAAS,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa,CAAC;IACtE;;;;OAIG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,WAAW,CAAC;CAClC,CACF,CAAC;AAEF,eAAO,MAAM,aAAa;IAftB;;;;OAIG;gBACS,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa;IACrE;;;;OAIG;cACO,QAAQ,GAAG,WAAW;yCAmBnC,CAAC"}
+{"version":3,"file":"BadgePosition.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/BadgePosition.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAc,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAClD,MAAM,MAAM,kBAAkB,GAAG,UAAU,CACzC,YAAY,GAAG,cAAc,CAAC,eAAe,CAAC,EAC9C;IACE;;;;OAIG;IACH,SAAS,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa,CAAC;IACtE;;;;OAIG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,WAAW,CAAC;CAClC,CACF,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,aAAa;IAxBtB;;;;OAIG;gBACS,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa;IACrE;;;;OAIG;cACO,QAAQ,GAAG,WAAW;yCA4BnC,CAAC"}

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

@@ -1,7 +1,14 @@
 import { BadgePosition } from './BadgePosition';
-declare const Badge: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.HTMLAttributes<HTMLSpanElement>, "children" | "count" | "maxCount"> & {
+/**
+ * `Badge` is a non-interactive component for displaying status with or without numbers.
+ *
+ * @example without children
+ * <Badge count={5} maxCount={10} />
+ */
+declare const Badge: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.HTMLAttributes<HTMLSpanElement>, "children" | "data-variant" | "count" | "maxCount"> & {
     count?: number;
     maxCount?: number;
+    'data-variant'?: "base" | "tinted";
     children?: never;
 } & React.RefAttributes<HTMLSpanElement>> & {
     Position: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.HTMLAttributes<HTMLSpanElement>, "placement" | "overlap"> & {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,QAAA,MAAM,KAAK;;;;;;;;;CAAuD,CAAC;AAInE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD;;;;;GAKG;AACH,QAAA,MAAM,KAAK;;;;;;;;;;CAAuD,CAAC;AAInE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/types/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -8,6 +8,24 @@ export type BreadcrumbsProps = MergeRight<DefaultProps & HTMLAttributes<HTMLElem
      */
     'aria-label'?: string;
 }>;
+/**
+ * `Breadcrumbs` is a component that displays a list of breadcrumbs.
+ *
+ * @example
+ * <Breadcrumbs aria-label='Du er her:' {...args}>
+ *  <Breadcrumbs.Link href='#' aria-label='Tilbake til Nivå 1'>
+ *    Nivå 1
+ *  </Breadcrumbs.Link>
+ *  <Breadcrumbs.List>
+ *    <Breadcrumbs.Item>
+ *      <Breadcrumbs.Link href='#'>Nivå 1</Breadcrumbs.Link>
+ *    </Breadcrumbs.Item>
+ *    <Breadcrumbs.Item>
+ *      <Breadcrumbs.Link href='#'>Nivå 2</Breadcrumbs.Link>
+ *    </Breadcrumbs.Item>
+ *  </Breadcrumbs.List>
+ * </Breadcrumbs>
+ */
 export declare const Breadcrumbs: React.ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLElement>, "aria-label"> & {
     /**
      * Sets the screen reader label for the Breadcrumbs area

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

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAc,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,gBAAgB,GAAG,UAAU,CACvC,YAAY,GAAG,cAAc,CAAC,WAAW,CAAC,EAC1C;IACE;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CACF,CAAC;AAEF,eAAO,MAAM,WAAW;IARpB;;;OAGG;mBACY,MAAM;qCAaxB,CAAC"}
+{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAc,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,gBAAgB,GAAG,UAAU,CACvC,YAAY,GAAG,cAAc,CAAC,WAAW,CAAC,EAC1C;IACE;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CACF,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,WAAW;IA1BpB;;;OAGG;mBACY,MAAM;qCA+BxB,CAAC"}

package/dist/types/components/Breadcrumbs/BreadcrumbsLink.d.ts

@@ -1,9 +1,7 @@
 import type { LinkProps } from '../Link';
 export type BreadcrumbsLinkProps = LinkProps;
-export declare const BreadcrumbsLink: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.AnchorHTMLAttributes<HTMLAnchorElement>, "className" | "children" | "asChild" | "href"> & {
+export declare const BreadcrumbsLink: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.AnchorHTMLAttributes<HTMLAnchorElement>, "children" | "asChild"> & {
     children: React.ReactNode;
-    className?: string;
-    href?: string;
     asChild?: boolean;
 } & React.RefAttributes<HTMLAnchorElement>>;
 //# sourceMappingURL=BreadcrumbsLink.d.ts.map

package/dist/types/components/Breadcrumbs/BreadcrumbsLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbsLink.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/BreadcrumbsLink.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,oBAAoB,GAAG,SAAS,CAAC;AAE7C,eAAO,MAAM,eAAe;;;;;2CAK1B,CAAC"}
+{"version":3,"file":"BreadcrumbsLink.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/BreadcrumbsLink.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,oBAAoB,GAAG,SAAS,CAAC;AAE7C,eAAO,MAAM,eAAe;;;2CAK1B,CAAC"}

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

@@ -2,27 +2,30 @@ import { BreadcrumbsItem } from './BreadcrumbsItem';
 import { BreadcrumbsLink } from './BreadcrumbsLink';
 import { BreadcrumbsList } from './BreadcrumbsList';
 /**
- * Breadcrumbs are used to visualize the current page path.
+ * `Breadcrumbs` is a component that displays a list of breadcrumbs.
+ *
  * @example
- * <Breadcrumbs aria-label="You are here:">
- *  <Breadcrumbs.Link aria-label="Go back to level 2">Level 2</Breadcrumbs.Link>
+ * <Breadcrumbs aria-label='Du er her:' {...args}>
+ *  <Breadcrumbs.Link href='#' aria-label='Tilbake til Nivå 1'>
+ *    Nivå 1
+ *  </Breadcrumbs.Link>
  *  <Breadcrumbs.List>
- *   <Breadcrumbs.Item><Breadcrumbs.Link>Level 1</Breadcrumbs.Link></Breadcrumbs.Item>
- *   <Breadcrumbs.Item><Breadcrumbs.Link>Level 2</Breadcrumbs.Link></Breadcrumbs.Item>
- *   <Breadcrumbs.Item><Breadcrumbs.Link>Level 3</Breadcrumbs.Link></Breadcrumbs.Item>
- *   <Breadcrumbs.Item><Breadcrumbs.Link>Level 4</Breadcrumbs.Link></Breadcrumbs.Item>
+ *    <Breadcrumbs.Item>
+ *      <Breadcrumbs.Link href='#'>Nivå 1</Breadcrumbs.Link>
+ *    </Breadcrumbs.Item>
+ *    <Breadcrumbs.Item>
+ *      <Breadcrumbs.Link href='#'>Nivå 2</Breadcrumbs.Link>
+ *    </Breadcrumbs.Item>
  *  </Breadcrumbs.List>
- * <Breadcrumbs>
+ * </Breadcrumbs>
  */
 export declare const Breadcrumbs: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.HTMLAttributes<HTMLElement>, "aria-label"> & {
     'aria-label'?: string;
 } & React.RefAttributes<HTMLElement>> & {
     List: React.ForwardRefExoticComponent<import("./BreadcrumbsList").BreadcrumbsListProps & React.RefAttributes<HTMLOListElement>>;
     Item: React.ForwardRefExoticComponent<import("./BreadcrumbsItem").BreadcrumbsItemProps & React.RefAttributes<HTMLLIElement>>;
-    Link: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.AnchorHTMLAttributes<HTMLAnchorElement>, "className" | "children" | "asChild" | "href"> & {
+    Link: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.AnchorHTMLAttributes<HTMLAnchorElement>, "children" | "asChild"> & {
         children: React.ReactNode;
-        className?: string;
-        href?: string;
         asChild?: boolean;
     } & React.RefAttributes<HTMLAnchorElement>>;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;;CAItB,CAAC;AAMH,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,WAAW;;;;;;;;;CAItB,CAAC;AAMH,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,CAAC"}

package/dist/types/components/Button/Button.d.ts

@@ -1,20 +1,24 @@
-import type { ButtonHTMLAttributes } from 'react';
+import type { ButtonHTMLAttributes, ReactNode } from 'react';
 import type { DefaultProps } from '../../types';
 import type { MergeRight } from '../../utilities';
 export type ButtonProps = MergeRight<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, {
     /**
      * Specify which variant to use
-     * @default primary
+     * @default 'primary'
      */
     variant?: 'primary' | 'secondary' | 'tertiary';
-    /** Toggle icon only styling, pass icon as children
+    /**
+     * Toggle icon only styling, pass icon as children
      * @default false
      */
     icon?: boolean;
-    /** Toggle loading state
+    /**
+     * Toggle loading state.
+     * Pass an element if you want to display a custom loader.
+     *
      * @default false
      */
-    loading?: boolean;
+    loading?: boolean | ReactNode;
     /**
      * Change the default rendered element for the one passed as a child, merging their props and behavior.
      * @default false
@@ -28,23 +32,28 @@ export type ButtonProps = MergeRight<DefaultProps & ButtonHTMLAttributes<HTMLBut
 }>;
 /**
  * Button used for interaction
+ *
  * @example
  * <Button>Click me</Button>
  */
-export declare const Button: React.ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, "type" | "asChild" | "variant" | "icon" | "loading"> & {
+export declare const Button: React.ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, "type" | "variant" | "icon" | "loading" | "asChild"> & {
     /**
      * Specify which variant to use
-     * @default primary
+     * @default 'primary'
      */
     variant?: "primary" | "secondary" | "tertiary";
-    /** Toggle icon only styling, pass icon as children
+    /**
+     * Toggle icon only styling, pass icon as children
      * @default false
      */
     icon?: boolean;
-    /** Toggle loading state
+    /**
+     * Toggle loading state.
+     * Pass an element if you want to display a custom loader.
+     *
      * @default false
      */
-    loading?: boolean;
+    loading?: boolean | ReactNode;
     /**
      * Change the default rendered element for the one passed as a child, merging their props and behavior.
      * @default false

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

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGlD,MAAM,MAAM,WAAW,GAAG,UAAU,CAClC,YAAY,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,EACtD;IACE;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC;CACxD,CACF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,MAAM;IA/Bf;;;OAGG;cACO,SAAS,GAAG,WAAW,GAAG,UAAU;IAC9C;;OAEG;WACI,OAAO;IACd;;OAEG;cACO,OAAO;IACjB;;;OAGG;cACO,OAAO;IACjB;;;OAGG;WACI,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC;2CA8CzD,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGlD,MAAM,MAAM,WAAW,GAAG,UAAU,CAClC,YAAY,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,EACtD;IACE;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC;CACxD,CACF,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,MAAM;IApCf;;;OAGG;cACO,SAAS,GAAG,WAAW,GAAG,UAAU;IAC9C;;;OAGG;WACI,OAAO;IACd;;;;;OAKG;cACO,OAAO,GAAG,SAAS;IAC7B;;;OAGG;cACO,OAAO;IACjB;;;OAGG;WACI,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC;2CA+CzD,CAAC"}

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

@@ -3,16 +3,22 @@ import type { DefaultProps } from '../../types';
 import type { MergeRight } from '../../utilities';
 export type CardProps = MergeRight<DefaultProps & HTMLAttributes<HTMLDivElement>, {
     /**
-     * Changes background & border color.
-     * @default neutral
+     * Change the background color of the card.
+     *
+     * @default 'default'
+     */
+    'data-variant'?: 'default' | 'tinted';
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
      */
-    'data-color'?: 'subtle' | DefaultProps['data-color'];
     asChild?: boolean;
     /** Instances of `Card.Block`, `Divider` or other React nodes */
     children: ReactNode;
 }>;
 /**
  * Card component to present content in a structured way.
+ *
  * @example
  * <Card>
  *  <Card.Block>Header</Card.Block>
@@ -20,12 +26,17 @@ export type CardProps = MergeRight<DefaultProps & HTMLAttributes<HTMLDivElement>
  *  <Card.Block>Footer</Card.Block>
  * </Card>
  */
-export declare const Card: React.ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLDivElement>, "data-color" | "children" | "asChild"> & {
+export declare const Card: React.ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLDivElement>, "children" | "asChild" | "data-variant"> & {
+    /**
+     * Change the background color of the card.
+     *
+     * @default 'default'
+     */
+    'data-variant'?: "default" | "tinted";
     /**
-     * Changes background & border color.
-     * @default neutral
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
      */
-    'data-color'?: "subtle" | DefaultProps["data-color"];
     asChild?: boolean;
     /** Instances of `Card.Block`, `Divider` or other React nodes */
     children: ReactNode;

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

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,SAAS,GAAG,UAAU,CAChC,YAAY,GAAG,cAAc,CAAC,cAAc,CAAC,EAC7C;IACE;;;OAGG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,YAAY,CAAC,YAAY,CAAC,CAAC;IACrD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gEAAgE;IAChE,QAAQ,EAAE,SAAS,CAAC;CACrB,CACF,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,IAAI;IApBb;;;OAGG;mBACY,QAAQ,GAAG,YAAY,CAAC,YAAY,CAAC;cAC1C,OAAO;IACjB,gEAAgE;cACtD,SAAS;wCA+CrB,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,SAAS,GAAG,UAAU,CAChC,YAAY,GAAG,cAAc,CAAC,cAAc,CAAC,EAC7C;IACE;;;;OAIG;IACH,cAAc,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACtC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gEAAgE;IAChE,QAAQ,EAAE,SAAS,CAAC;CACrB,CACF,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,IAAI;IA1Bb;;;;OAIG;qBACc,SAAS,GAAG,QAAQ;IACrC;;;OAGG;cACO,OAAO;IACjB,gEAAgE;cACtD,SAAS;wCAgDrB,CAAC"}

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

@@ -1,6 +1,16 @@
 import { CardBlock } from './CardBlock';
-declare const Card: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.HTMLAttributes<HTMLDivElement>, "data-color" | "children" | "asChild"> & {
-    'data-color'?: "subtle" | import("../../types").DefaultProps["data-color"];
+/**
+ * Card component to present content in a structured way.
+ *
+ * @example
+ * <Card>
+ *  <Card.Block>Header</Card.Block>
+ *  <Card.Block>Content</Card.Block>
+ *  <Card.Block>Footer</Card.Block>
+ * </Card>
+ */
+declare const Card: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.HTMLAttributes<HTMLDivElement>, "children" | "asChild" | "data-variant"> & {
+    'data-variant'?: "default" | "tinted";
     asChild?: boolean;
     children: React.ReactNode;
 } & React.RefAttributes<HTMLDivElement>> & {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,QAAA,MAAM,IAAI;;;;;;;;CAER,CAAC;AAIH,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC;;;;;;;;;GASG;AACH,QAAA,MAAM,IAAI;;;;;;;;CAER,CAAC;AAIH,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC"}

package/dist/types/components/Checkbox/Checkbox.d.ts

@@ -3,19 +3,30 @@ import type { DefaultProps, LabelRequired } from '../../types';
 import type { MergeRight } from '../../utilities';
 import { type InputProps } from '../Input';
 export type CheckboxProps = MergeRight<DefaultProps & Omit<InputProps, 'type' | 'role' | 'size'>, {
-    /** Optional aria-label */
+    /**
+     * Optional aria-label
+     */
     'aria-label'?: string;
-    /** Checkbox label */
+    /**
+     * Checkbox label
+     */
     label?: ReactNode;
-    /** Description for field */
+    /**
+     * Description for field
+     */
     description?: ReactNode;
-    /** Value of the `input` element */
+    /**
+     * Value of the `input` element
+     */
     value?: InputProps['value'];
-    /** Validation message for field */
-    validation?: ReactNode;
+    /**
+     * Error message for field
+     */
+    error?: ReactNode;
 } & LabelRequired>;
 /**
  * Checkbox used to select multiple options.
+ *
  * @example
  * <Checkbox label="I agree" value="agree" />
  */

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAIlD,MAAM,MAAM,aAAa,GAAG,UAAU,CACpC,YAAY,GAAG,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC,EACzD;IACE,0BAA0B;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,4BAA4B;IAC5B,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,mCAAmC;IACnC,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC5B,mCAAmC;IACnC,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB,GAAG,aAAa,CAClB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,QAAQ,wFAuBpB,CAAC"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAIlD,MAAM,MAAM,aAAa,GAAG,UAAU,CACpC,YAAY,GAAG,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC,EACzD;IACE;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,GAAG,aAAa,CAClB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,QAAQ,wFAuBpB,CAAC"}

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

@@ -1,2 +1,3 @@
-export * from './Checkbox';
+export { Checkbox } from './Checkbox';
+export type { CheckboxProps } from './Checkbox';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC"}

package/dist/types/components/Chip/Chips.d.ts

@@ -14,6 +14,7 @@ export type ChipButtonProps = MergeRight<DefaultProps & ButtonHTMLAttributes<HTM
 export type ChipCheckboxProps = MergeRight<DefaultProps & Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'>, ChipBaseProps>;
 /**
  * Chip.Button used for interaction
+ *
  * @example
  * <Chip.Button>Click me</Chip.Button>
  */