@digdir/designsystemet-react 1.1.2 → 1.1.4

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

@@ -0,0 +1,77 @@
+import type { Color, SeverityDanger } from '@digdir/designsystemet-react/colors';
+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'
+     */
+    variant?: 'primary' | 'secondary' | 'tertiary';
+    /**
+     * Change the color scheme of the button
+     */
+    'data-color'?: Color | SeverityDanger;
+    /**
+     * Toggle icon only styling, pass icon as children
+     * @default false
+     */
+    icon?: boolean;
+    /**
+     * Toggle loading state.
+     * Pass an element if you want to display a custom loader.
+     *
+     * @default false
+     */
+    loading?: boolean | ReactNode;
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Specify the type of button. Unset when `asChild` is true
+     * @default 'button'
+     */
+    type?: ButtonHTMLAttributes<HTMLButtonElement>['type'];
+}>;
+/**
+ * Button used for interaction
+ *
+ * @example
+ * <Button>Click me</Button>
+ */
+export declare const Button: React.ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, "type" | "data-color" | "variant" | "icon" | "loading" | "asChild"> & {
+    /**
+     * Specify which variant to use
+     * @default 'primary'
+     */
+    variant?: "primary" | "secondary" | "tertiary";
+    /**
+     * Change the color scheme of the button
+     */
+    'data-color'?: Color | SeverityDanger;
+    /**
+     * Toggle icon only styling, pass icon as children
+     * @default false
+     */
+    icon?: boolean;
+    /**
+     * Toggle loading state.
+     * Pass an element if you want to display a custom loader.
+     *
+     * @default false
+     */
+    loading?: boolean | ReactNode;
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Specify the type of button. Unset when `asChild` is true
+     * @default 'button'
+     */
+    type?: ButtonHTMLAttributes<HTMLButtonElement>["type"];
+} & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=button.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,KAAK,EACL,cAAc,EACf,MAAM,qCAAqC,CAAC;AAG7C,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7D,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,YAAY,CAAC,EAAE,KAAK,GAAG,cAAc,CAAC;IACtC;;;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;IAxCf;;;OAGG;cACO,SAAS,GAAG,WAAW,GAAG,UAAU;IAC9C;;OAEG;mBACY,KAAK,GAAG,cAAc;IACrC;;;OAGG;WACI,OAAO;IACd;;;;;OAKG;cACO,OAAO,GAAG,SAAS;IAC7B;;;OAGG;cACO,OAAO;IACjB;;;OAGG;WACI,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC;2CAgDzD,CAAC"}

package/dist/types/components/card/card-block.d.ts

@@ -0,0 +1,16 @@
+import type { HTMLAttributes } from 'react';
+export type CardBlockProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const CardBlock: React.ForwardRefExoticComponent<{
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=card-block.d.ts.map

package/dist/types/components/card/card-block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-block.d.ts","sourceRoot":"","sources":["../../../src/components/card/card-block.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,MAAM,MAAM,cAAc,GAAG;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,SAAS;IAPpB;;;OAGG;cACO,OAAO;yEAelB,CAAC"}

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

@@ -0,0 +1,44 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+import type { DefaultProps } from '../../types';
+import type { MergeRight } from '../../utilities';
+export type CardProps = MergeRight<DefaultProps & HTMLAttributes<HTMLDivElement>, {
+    /**
+     * Change the background color of the card.
+     *
+     * @default 'default'
+     */
+    variant?: 'default' | 'tinted';
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    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>
+ *  <Card.Block>Content</Card.Block>
+ *  <Card.Block>Footer</Card.Block>
+ * </Card>
+ */
+export declare const Card: React.ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLDivElement>, "children" | "variant" | "asChild"> & {
+    /**
+     * Change the background color of the card.
+     *
+     * @default 'default'
+     */
+    variant?: "default" | "tinted";
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /** Instances of `Card.Block`, `Divider` or other React nodes */
+    children: ReactNode;
+} & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=card.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/components/card/card.tsx"],"names":[],"mappings":"AAEA,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;AAGlD,MAAM,MAAM,SAAS,GAAG,UAAU,CAChC,YAAY,GAAG,cAAc,CAAC,cAAc,CAAC,EAC7C;IACE;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC/B;;;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;cACO,SAAS,GAAG,QAAQ;IAC9B;;;OAGG;cACO,OAAO;IACjB,gEAAgE;cACtD,SAAS;wCAgDrB,CAAC"}

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

@@ -0,0 +1,24 @@
+import { CardBlock } from './card-block';
+/**
+ * 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" | "variant" | "asChild"> & {
+    variant?: "default" | "tinted";
+    asChild?: boolean;
+    children: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement>> & {
+    Block: React.ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+};
+export type { CardProps } from './card';
+export type { CardBlockProps } from './card-block';
+export { Card, CardBlock };
+//# sourceMappingURL=index.d.ts.map

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

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

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

@@ -0,0 +1,34 @@
+import type { ReactNode } from 'react';
+import type { DefaultProps, LabelRequired } from '../../types';
+import type { MergeRight } from '../../utilities';
+import { type InputProps } from '../input/input';
+export type CheckboxProps = MergeRight<DefaultProps & Omit<InputProps, 'type' | 'role' | 'size'>, {
+    /**
+     * Optional aria-label
+     */
+    'aria-label'?: string;
+    /**
+     * Checkbox label
+     */
+    label?: ReactNode;
+    /**
+     * Description for field
+     */
+    description?: ReactNode;
+    /**
+     * Value of the `input` element
+     */
+    value?: InputProps['value'];
+    /**
+     * Error message for field
+     */
+    error?: ReactNode;
+} & LabelRequired>;
+/**
+ * Checkbox used to select multiple options.
+ *
+ * @example
+ * <Checkbox label="I agree" value="agree" />
+ */
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=checkbox.d.ts.map

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

@@ -0,0 +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,gBAAgB,CAAC;AAIxD,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/chip/chips.d.ts

@@ -0,0 +1,43 @@
+import type { ButtonHTMLAttributes, InputHTMLAttributes } from 'react';
+import type { DefaultProps } from '../../types';
+import type { MergeRight } from '../../utilities';
+type ChipBaseProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+};
+export type ChipRemovableProps = ChipButtonProps;
+export type ChipRadioProps = ChipCheckboxProps;
+export type ChipButtonProps = MergeRight<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, ChipBaseProps>;
+export type ChipCheckboxProps = MergeRight<DefaultProps & Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'>, ChipBaseProps>;
+/**
+ * Chip.Button used for interaction
+ *
+ * @example
+ * <Chip.Button>Click me</Chip.Button>
+ */
+export declare const ChipButton: React.ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, "asChild"> & ChipBaseProps & React.RefAttributes<HTMLButtonElement>>;
+/**
+ * Chip.Removable used for interaction
+ * @example
+ * <Chip.Removable>Click to remove me</Chip.Removable>
+ */
+export declare const ChipRemovable: React.ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, "asChild"> & ChipBaseProps & React.RefAttributes<HTMLButtonElement>>;
+/**
+ * Chip.Checkbox used for multiselection
+ * @example
+ * <Chip.Checkbox name="language" value="nynorsk">Nynorsk</Chip.Checkbox>
+ * <Chip.Checkbox name="language" value="bokmål">Bokmål</Chip.Checkbox>
+ */
+export declare const ChipCheckbox: React.ForwardRefExoticComponent<Omit<DefaultProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size">, "asChild"> & ChipBaseProps & React.RefAttributes<HTMLLabelElement>>;
+/**
+ * Chip.Radio used for single selection
+ * @example
+ * <Chip.Radio name="language" value="nynorsk">Nynorsk</Chip.Radio>
+ * <Chip.Radio name="language" value="bokmål">Bokmål</Chip.Radio>
+ */
+export declare const ChipRadio: React.ForwardRefExoticComponent<Omit<DefaultProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size">, "asChild"> & ChipBaseProps & React.RefAttributes<HTMLLabelElement>>;
+export {};
+//# sourceMappingURL=chips.d.ts.map

package/dist/types/components/chip/chips.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chips.d.ts","sourceRoot":"","sources":["../../../src/components/chip/chips.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEvE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGlD,KAAK,aAAa,GAAG;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,eAAe,CAAC;AACjD,MAAM,MAAM,cAAc,GAAG,iBAAiB,CAAC;AAC/C,MAAM,MAAM,eAAe,GAAG,UAAU,CACtC,YAAY,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,EACtD,aAAa,CACd,CAAC;AACF,MAAM,MAAM,iBAAiB,GAAG,UAAU,CACxC,YAAY,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,EAC3E,aAAa,CACd,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,UAAU,mKAatB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,mKAIzB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,YAAY,uLA4BxB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,SAAS,uLAIrB,CAAC"}

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

@@ -0,0 +1,18 @@
+import { ChipButton, ChipCheckbox, ChipRadio, ChipRemovable } from './chips';
+declare const Chip: {
+    Button: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.ButtonHTMLAttributes<HTMLButtonElement>, "asChild"> & {
+        asChild?: boolean;
+    } & React.RefAttributes<HTMLButtonElement>>;
+    Checkbox: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size">, "asChild"> & {
+        asChild?: boolean;
+    } & React.RefAttributes<HTMLLabelElement>>;
+    Radio: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size">, "asChild"> & {
+        asChild?: boolean;
+    } & React.RefAttributes<HTMLLabelElement>>;
+    Removable: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.ButtonHTMLAttributes<HTMLButtonElement>, "asChild"> & {
+        asChild?: boolean;
+    } & React.RefAttributes<HTMLButtonElement>>;
+};
+export type { ChipButtonProps, ChipCheckboxProps, ChipRadioProps, ChipRemovableProps, } from './chips';
+export { Chip, ChipButton, ChipCheckbox, ChipRadio, ChipRemovable };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7E,QAAA,MAAM,IAAI;;;;;;;;;;;;;CAKT,CAAC;AAOF,YAAY,EACV,eAAe,EACf,iBAAiB,EACjB,cAAc,EACd,kBAAkB,GACnB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC"}

package/dist/types/components/details/details-content.d.ts

@@ -0,0 +1,10 @@
+import type { HTMLAttributes } from 'react';
+export type DetailsContentProps = HTMLAttributes<HTMLDivElement>;
+/**
+ * Details content component, contains the content of the details item.
+ *
+ * @example
+ * <DetailsContent>Content</DetailsContent>
+ */
+export declare const DetailsContent: React.ForwardRefExoticComponent<DetailsContentProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=details-content.d.ts.map

package/dist/types/components/details/details-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"details-content.d.ts","sourceRoot":"","sources":["../../../src/components/details/details-content.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEjE;;;;;GAKG;AACH,eAAO,MAAM,cAAc,4FAI1B,CAAC"}

package/dist/types/components/details/details-summary.d.ts

@@ -0,0 +1,16 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+export type DetailsSummaryProps = {
+    /** Heading text */
+    children: ReactNode;
+} & HTMLAttributes<HTMLElement>;
+/**
+ * Details summary component, contains a the heading to toggle the content.
+ *
+ * @example
+ * <Details.Summary>Heading</Details.Summary>
+ */
+export declare const DetailsSummary: React.ForwardRefExoticComponent<{
+    /** Heading text */
+    children: ReactNode;
+} & HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
+//# sourceMappingURL=details-summary.d.ts.map

package/dist/types/components/details/details-summary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"details-summary.d.ts","sourceRoot":"","sources":["../../../src/components/details/details-summary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,MAAM,MAAM,mBAAmB,GAAG;IAChC,mBAAmB;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC;AAEhC;;;;;GAKG;AACH,eAAO,MAAM,cAAc;IAVzB,mBAAmB;cACT,SAAS;mEAcpB,CAAC"}

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

@@ -0,0 +1,50 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+import '@u-elements/u-details';
+import type { DefaultProps } from '../../types';
+import type { MergeRight } from '../../utilities';
+export type DetailsProps = MergeRight<DefaultProps & HTMLAttributes<HTMLDetailsElement>, {
+    /**
+     * Change the background color of the details.
+     *
+     * @default 'default'
+     */
+    variant?: 'default' | 'tinted';
+    /**
+     * Controls open-state.
+     *
+     * Using this removes automatic control of open-state
+     *
+     * @default undefined
+     */
+    open?: boolean;
+    /**
+     * Defaults the details to open if not controlled
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /**
+     * Callback function when Details toggles due to click on summary or find in page-search
+     */
+    onToggle?: (event: Event) => void;
+    /**
+     * Content should be one `<Details.Summary>` and `<Details.Content>`
+     */
+    children?: ReactNode;
+}> & ({
+    open: boolean;
+    onToggle: (event: Event) => void;
+} | {
+    open?: never;
+    onToggle?: (event: Event) => void;
+});
+/**
+ * Details component, contains `Details.Summary` and `Details.Content` components.
+ *
+ * @example
+ * <Details>
+ *  <Details.Summary>Header</Details.Summary>
+ *  <Details.Content>Content</Details.Content>
+ * </Details>
+ */
+export declare const Details: React.ForwardRefExoticComponent<DetailsProps & React.RefAttributes<HTMLDetailsElement>>;
+//# sourceMappingURL=details.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"details.d.ts","sourceRoot":"","sources":["../../../src/components/details/details.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,MAAM,MAAM,YAAY,GAAG,UAAU,CACnC,YAAY,GAAG,cAAc,CAAC,kBAAkB,CAAC,EACjD;IACE;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC/B;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CACF,GACC,CACI;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;CAAE,GACnD;IAAE,IAAI,CAAC,EAAE,KAAK,CAAC;IAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;CAAE,CACtD,CAAC;AAEJ;;;;;;;;GAQG;AACH,eAAO,MAAM,OAAO,yFA2CnB,CAAC"}

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

@@ -0,0 +1,22 @@
+import { DetailsContent } from './details-content';
+import { DetailsSummary } from './details-summary';
+/**
+ * Details component, contains `Details.Summary` and `Details.Content` components.
+ *
+ * @example
+ * <Details>
+ *  <Details.Summary>Header</Details.Summary>
+ *  <Details.Content>Content</Details.Content>
+ * </Details>
+ */
+declare const Details: React.ForwardRefExoticComponent<import("./details").DetailsProps & React.RefAttributes<HTMLDetailsElement>> & {
+    Summary: React.ForwardRefExoticComponent<{
+        children: React.ReactNode;
+    } & React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
+    Content: React.ForwardRefExoticComponent<import("./details-content").DetailsContentProps & React.RefAttributes<HTMLDivElement>>;
+};
+export type { DetailsProps } from './details';
+export type { DetailsContentProps } from './details-content';
+export type { DetailsSummaryProps } from './details-summary';
+export { Details, DetailsContent, DetailsSummary };
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/details/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEnD;;;;;;;;GAQG;AACH,QAAA,MAAM,OAAO;;;;;CAGX,CAAC;AAKH,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAC9C,YAAY,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,YAAY,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC"}

package/dist/types/components/dialog/dialog-block.d.ts

@@ -0,0 +1,32 @@
+import type { HTMLAttributes } from 'react';
+export type DialogBlockProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+/**
+ * DialogBlock component, used to separate content in a Dialog.
+ *
+ * @example
+ * <Dialog>
+ *   <Dialog.Block>
+ *     Header
+ *   </Dialog.Block>
+ *   <Dialog.Block>
+ *     Content
+ *   </Dialog.Block>
+ *   <Dialog.Block>
+ *     Footer
+ *   </Dialog.Block>
+ * </Dialog>
+ */
+export declare const DialogBlock: React.ForwardRefExoticComponent<{
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=dialog-block.d.ts.map

package/dist/types/components/dialog/dialog-block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-block.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/dialog-block.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,WAAW;IAvBtB;;;OAGG;cACO,OAAO;yEA+BlB,CAAC"}

package/dist/types/components/dialog/dialog-trigger-context.d.ts

@@ -0,0 +1,21 @@
+import type { ReactNode, RefObject } from 'react';
+export declare const Context: React.Context<RefObject<HTMLDialogElement | null>>;
+export type DialogTriggerContextProps = {
+    children: ReactNode;
+};
+/**
+ * DialogTriggerContext component, used to provide a context for a dialog trigger.
+ *
+ * @example
+ * <Dialog.TriggerContext>
+ *   <Dialog.Trigger>Open Dialog</Dialog.Trigger>
+ *   <Dialog>
+ *     Content
+ *   </Dialog>
+ * </Dialog.TriggerContext>
+ */
+export declare const DialogTriggerContext: {
+    ({ children, }: DialogTriggerContextProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=dialog-trigger-context.d.ts.map

package/dist/types/components/dialog/dialog-trigger-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-trigger-context.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/dialog-trigger-context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlD,eAAO,MAAM,OAAO,oDAElB,CAAC;AAEH,MAAM,MAAM,yBAAyB,GAAG;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,CAAC;AAEhE;;;;;;;;;;GAUG;AACH,eAAO,MAAM,oBAAoB;oBAE9B,yBAAyB;;CAI3B,CAAC"}

package/dist/types/components/dialog/dialog-trigger.d.ts

@@ -0,0 +1,23 @@
+import type { ComponentPropsWithRef } from 'react';
+import { Button } from '../button/button';
+export type DialogTriggerProps = ComponentPropsWithRef<typeof Button>;
+/**
+ * DialogTrigger component, used within a Dialog.TriggerContext to open a dialog.
+ *
+ * @example
+ * <Dialog.TriggerContext>
+ *   <Dialog.Trigger>Open Dialog</Dialog.Trigger>
+ *   <Dialog>
+ *     Content
+ *   </Dialog>
+ * </Dialog.TriggerContext>
+ */
+export declare const DialogTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("../../types").DefaultProps & React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "data-color" | "variant" | "icon" | "loading" | "asChild"> & {
+    variant?: "primary" | "secondary" | "tertiary";
+    'data-color'?: import("../../colors").Color | import("../../colors").SeverityDanger;
+    icon?: boolean;
+    loading?: boolean | React.ReactNode;
+    asChild?: boolean;
+    type?: React.ButtonHTMLAttributes<HTMLButtonElement>["type"];
+} & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=dialog-trigger.d.ts.map

package/dist/types/components/dialog/dialog-trigger.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-trigger.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/dialog-trigger.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAGnD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAG1C,MAAM,MAAM,kBAAkB,GAAG,qBAAqB,CAAC,OAAO,MAAM,CAAC,CAAC;AAEtE;;;;;;;;;;GAUG;AACH,eAAO,MAAM,aAAa;;;;;;;4FAqBzB,CAAC"}

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

@@ -0,0 +1,95 @@
+import type { DialogHTMLAttributes } from 'react';
+import type { DefaultProps } from '../../types';
+import type { MergeRight } from '../../utilities';
+export type DialogProps = MergeRight<DefaultProps & DialogHTMLAttributes<HTMLDialogElement>, {
+    /**
+     * Screen reader label of close button. Set false to hide the close button.
+     * @default 'Lukk dialogvindu'
+     */
+    closeButton?: string | false;
+    /**
+     * Light dismiss behavior, allowing to close on backdrop click  by setting `closedby="any"`.
+     *
+     * @default 'closerequest'
+     */
+    closedby?: 'none' | 'closerequest' | 'any';
+    /**
+     * Toogle modal and non-modal dialog.
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog#creating_a_modal_dialog
+     *
+     * @default true
+     */
+    modal?: boolean;
+    /**
+     * @note Unlike standard html, where the open attribute always opens a non-modal dialog, Dialog's open prop uses the `modal` prop to determine whether the Dialog is modal or non-modal
+     */
+    open?: boolean;
+    /**
+     * Callback that is called when the dialog is closed.
+     */
+    onClose?: (event: Event) => void;
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+}>;
+/**
+ * Dialog component, used to display a dialog dialog.
+ *
+ * @example with TriggerContext
+ * <Dialog.TriggerContext>
+ *   <Dialog.Trigger>Open Dialog</Dialog.Trigger>
+ *   <Dialog>
+ *     <Dialog.Block>
+ *       Content
+ *     </Dialog.Block>
+ *   </Dialog>
+ * </Dialog.TriggerContext>
+ *
+ * @example without TriggerContext
+ * const dialogRef = useRef<HTMLDialogElement>(null);
+ *
+ * ...
+ *
+ * <Button onClick={() => dialogRef.current?.showModal()}>Open Dialog</Button>
+ * <Dialog ref={dialogRef}>
+ *   Content
+ * </Dialog>
+ */
+export declare const Dialog: React.ForwardRefExoticComponent<Omit<DefaultProps & DialogHTMLAttributes<HTMLDialogElement>, "asChild" | "open" | "onClose" | "closeButton" | "closedby" | "modal"> & {
+    /**
+     * Screen reader label of close button. Set false to hide the close button.
+     * @default 'Lukk dialogvindu'
+     */
+    closeButton?: string | false;
+    /**
+     * Light dismiss behavior, allowing to close on backdrop click  by setting `closedby="any"`.
+     *
+     * @default 'closerequest'
+     */
+    closedby?: "none" | "closerequest" | "any";
+    /**
+     * Toogle modal and non-modal dialog.
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog#creating_a_modal_dialog
+     *
+     * @default true
+     */
+    modal?: boolean;
+    /**
+     * @note Unlike standard html, where the open attribute always opens a non-modal dialog, Dialog's open prop uses the `modal` prop to determine whether the Dialog is modal or non-modal
+     */
+    open?: boolean;
+    /**
+     * Callback that is called when the dialog is closed.
+     */
+    onClose?: (event: Event) => void;
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & React.RefAttributes<HTMLDialogElement>>;
+//# sourceMappingURL=dialog.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAKlD,MAAM,MAAM,WAAW,GAAG,UAAU,CAClC,YAAY,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,EACtD;IACE;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAC7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,cAAc,GAAG,KAAK,CAAC;IAC3C;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CACF,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,MAAM;IA1Df;;;OAGG;kBACW,MAAM,GAAG,KAAK;IAC5B;;;;OAIG;eACQ,MAAM,GAAG,cAAc,GAAG,KAAK;IAC1C;;;;;;OAMG;YACK,OAAO;IACf;;OAEG;WACI,OAAO;IACd;;OAEG;cACO,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI;IAChC;;;OAGG;cACO,OAAO;2CAoHpB,CAAC"}