@digdir/designsystemet-react 1.20.0 → 1.21.0

package/dist/cjs/components/link/link.d.cts

@@ -0,0 +1,36 @@
+
+import { DefaultProps } from "../../types.cjs";
+import { MergeRight } from "../../utilities/types.cjs";
+import "../../utilities/index.cjs";
+import { AnchorHTMLAttributes, ReactNode } from "react";
+//#region src/components/link/link.d.ts
+type LinkProps = MergeRight<DefaultProps & AnchorHTMLAttributes<HTMLAnchorElement>, {
+  /**
+   * The content to display inside the link.
+   **/
+  children: ReactNode;
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+}>;
+/**
+ * Link component, renders a native `a` element.
+ *
+ * @example
+ * <Link href='#'>Link</Link>
+ */
+declare const Link: import("react").ForwardRefExoticComponent<Omit<DefaultProps & AnchorHTMLAttributes<HTMLAnchorElement>, "asChild" | "children"> & {
+  /**
+   * The content to display inside the link.
+   **/
+  children: ReactNode;
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & import("react").RefAttributes<HTMLAnchorElement>>;
+//#endregion
+export { Link, LinkProps };

package/dist/cjs/components/list/index.cjs

@@ -0,0 +1,17 @@
+'use client';
+const require_list_item = require("./list-item.cjs");
+const require_lists = require("./lists.cjs");
+//#region src/components/list/index.ts
+const ListComponent = {
+	Item: require_list_item.ListItem,
+	Ordered: require_lists.ListOrdered,
+	Unordered: require_lists.ListUnordered
+};
+ListComponent.Item.displayName = "List.Item";
+ListComponent.Ordered.displayName = "List.Ordered";
+ListComponent.Unordered.displayName = "List.Unordered";
+//#endregion
+exports.List = ListComponent;
+exports.ListItem = require_list_item.ListItem;
+exports.ListOrdered = require_lists.ListOrdered;
+exports.ListUnordered = require_lists.ListUnordered;

package/dist/cjs/components/list/index.d.cts

@@ -0,0 +1,38 @@
+
+import { ListItem, ListItemProps } from "./list-item.cjs";
+import { ListOrdered, ListOrderedProps, ListUnordered, ListUnorderedProps } from "./lists.cjs";
+//#region src/components/list/index.d.ts
+type List = {
+  /**
+   * Component that provides a list item.
+   *
+   * @example
+   * <List.Item>Item</List.Item>
+   */
+  Item: typeof ListItem;
+  /**
+   * List.Ordered component, used to display a list of items.
+   * Renders a native `ol` element.
+   *
+   * @example
+   * <List.Ordered>
+   *   <List.Item>Item 1</List.Item>
+   *   <List.Item>Item 2</List.Item>
+   * </List.Ordered>
+   */
+  Ordered: typeof ListOrdered;
+  /**
+   * List.Unordered component, used to display a list of items.
+   * Renders a native `ul` element.
+   *
+   * @example
+   * <List.Unordered>
+   *   <List.Item>Item 1</List.Item>
+   *   <List.Item>Item 2</List.Item>
+   * </List.Unordered>
+   */
+  Unordered: typeof ListUnordered;
+};
+declare const ListComponent: List;
+//#endregion
+export { ListComponent as List, ListItem, type ListItemProps, ListOrdered, type ListOrderedProps, ListUnordered, type ListUnorderedProps };

package/dist/cjs/components/list/list-item.cjs

@@ -0,0 +1,19 @@
+'use client';
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _radix_ui_react_slot = require("@radix-ui/react-slot");
+//#region src/components/list/list-item.tsx
+/**
+* Component that provides a list item.
+*
+* @example
+* <List.Item>Item</List.Item>
+*/
+const ListItem = (0, react.forwardRef)(function ListItem({ asChild, ...rest }, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(asChild ? _radix_ui_react_slot.Slot : "li", {
+		...rest,
+		ref
+	});
+});
+//#endregion
+exports.ListItem = ListItem;

package/dist/cjs/components/list/list-item.d.cts

@@ -0,0 +1,25 @@
+
+import { LiHTMLAttributes } from "react";
+//#region src/components/list/list-item.d.ts
+type ListItemProps = {
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & LiHTMLAttributes<HTMLLIElement>;
+/**
+ * Component that provides a list item.
+ *
+ * @example
+ * <List.Item>Item</List.Item>
+ */
+declare const ListItem: import("react").ForwardRefExoticComponent<{
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & LiHTMLAttributes<HTMLLIElement> & import("react").RefAttributes<HTMLLIElement>>;
+//#endregion
+export { ListItem, ListItemProps };

package/dist/cjs/components/list/lists.cjs

@@ -0,0 +1,45 @@
+'use client';
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+let clsx_lite = require("clsx/lite");
+clsx_lite = require_runtime.__toESM(clsx_lite, 1);
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _radix_ui_react_slot = require("@radix-ui/react-slot");
+//#region src/components/list/lists.tsx
+/**
+* ListUnordered component, used to display a list of items.
+* Renders a native `ul` element.
+*
+* @example
+* <ListUnordered>
+*   <ListItem>Item 1</ListItem>
+*   <ListItem>Item 2</ListItem>
+* </ListUnordered>
+*/
+const ListUnordered = (0, react.forwardRef)(function ListUnordered({ asChild, className, ...rest }, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(asChild ? _radix_ui_react_slot.Slot : "ul", {
+		className: (0, clsx_lite.default)(`ds-list`, className),
+		ref,
+		...rest
+	});
+});
+/**
+* ListOrdered component, used to display a list of items.
+* Renders a native `ol` element.
+*
+* @example
+* <ListOrdered>
+*   <ListItem>Item 1</ListItem>
+*   <ListItem>Item 2</ListItem>
+* </ListOrdered>
+*/
+const ListOrdered = (0, react.forwardRef)(function ListOrdered({ asChild, className, ...rest }, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(asChild ? _radix_ui_react_slot.Slot : "ol", {
+		className: (0, clsx_lite.default)(`ds-list`, className),
+		ref,
+		...rest
+	});
+});
+//#endregion
+exports.ListOrdered = ListOrdered;
+exports.ListUnordered = ListUnordered;

package/dist/cjs/components/list/lists.d.cts

@@ -0,0 +1,49 @@
+
+import { DefaultProps } from "../../types.cjs";
+import { HTMLAttributes, OlHTMLAttributes } from "react";
+//#region src/components/list/lists.d.ts
+type ListBaseProps = {
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & DefaultProps;
+type ListUnorderedProps = ListBaseProps & Omit<HTMLAttributes<HTMLUListElement>, 'size'>;
+type ListOrderedProps = ListBaseProps & Omit<OlHTMLAttributes<HTMLOListElement>, 'size'>;
+/**
+ * ListUnordered component, used to display a list of items.
+ * Renders a native `ul` element.
+ *
+ * @example
+ * <ListUnordered>
+ *   <ListItem>Item 1</ListItem>
+ *   <ListItem>Item 2</ListItem>
+ * </ListUnordered>
+ */
+declare const ListUnordered: import("react").ForwardRefExoticComponent<{
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & DefaultProps & Omit<HTMLAttributes<HTMLUListElement>, "size"> & import("react").RefAttributes<HTMLUListElement>>;
+/**
+ * ListOrdered component, used to display a list of items.
+ * Renders a native `ol` element.
+ *
+ * @example
+ * <ListOrdered>
+ *   <ListItem>Item 1</ListItem>
+ *   <ListItem>Item 2</ListItem>
+ * </ListOrdered>
+ */
+declare const ListOrdered: import("react").ForwardRefExoticComponent<{
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & DefaultProps & Omit<OlHTMLAttributes<HTMLOListElement>, "size"> & import("react").RefAttributes<HTMLOListElement>>;
+//#endregion
+export { ListOrdered, ListOrderedProps, ListUnordered, ListUnorderedProps };

package/dist/cjs/components/pagination/index.cjs

@@ -0,0 +1,37 @@
+'use client';
+const require_pagination = require("./pagination.cjs");
+const require_pagination_button = require("./pagination-button.cjs");
+const require_pagination_item = require("./pagination-item.cjs");
+const require_pagination_list = require("./pagination-list.cjs");
+//#region src/components/pagination/index.ts
+/**
+* Pagination component, used to navigate through a list of items.
+*
+* @example
+* <Pagination>
+*   <Pagination.List>
+*     <Pagination.Item>
+*       <Pagination.Button aria-label='Forrige side'>Forrige</Pagination.Button>
+*     </Pagination.Item>
+*     <Pagination.Item>
+*       <Pagination.Button aria-label='Side 1'>1</Pagination.Button>
+*     </Pagination.Item>
+*     <Pagination.Item>
+*       <Pagination.Button aria-label='Side 2'>2</Pagination.Button>
+*     </Pagination.Item>
+*   </Pagination.List>
+* </Pagination>
+*/
+const PaginationComponent = Object.assign(require_pagination.Pagination, {
+	List: require_pagination_list.PaginationList,
+	Item: require_pagination_item.PaginationItem,
+	Button: require_pagination_button.PaginationButton
+});
+PaginationComponent.List.displayName = "Pagination.List";
+PaginationComponent.Item.displayName = "Pagination.Item";
+PaginationComponent.Button.displayName = "Pagination.Button";
+//#endregion
+exports.Pagination = PaginationComponent;
+exports.PaginationButton = require_pagination_button.PaginationButton;
+exports.PaginationItem = require_pagination_item.PaginationItem;
+exports.PaginationList = require_pagination_list.PaginationList;

package/dist/cjs/components/pagination/index.d.cts

@@ -0,0 +1,62 @@
+
+import { Pagination as Pagination$1, PaginationProps } from "./pagination.cjs";
+import { PaginationButton, PaginationButtonProps } from "./pagination-button.cjs";
+import { PaginationItem, PaginationItemProps } from "./pagination-item.cjs";
+import { PaginationList, PaginationListProps } from "./pagination-list.cjs";
+//#region src/components/pagination/index.d.ts
+type Pagination = typeof Pagination$1 & {
+  /**
+   * Pagination.List component, use within a Pagination.
+   *
+   * @example
+   * <Pagination>
+   *   <Pagination.List>
+   *     <Pagination.Item>
+   *       <Pagination.Button aria-label='Forrige side'>Forrige</Pagination.Button>
+   *     </Pagination.Item>
+   *   </Pagination.List>
+   * </Pagination>
+   */
+  List: typeof PaginationList;
+  /**
+   * Pagination.Item component, use within a Pagination.List.
+   *
+   * @example
+   * <Pagination.List>
+   *   <Pagination.Item>
+   *     <Pagination.Button aria-label='Forrige side'>Forrige</Pagination.Button>
+   *   </Pagination.Item>
+   * </Pagination.List>
+   */
+  Item: typeof PaginationItem;
+  /**
+   * PaginationButton component, use within a Pagination.Item.
+   *
+   * @example
+   * <Pagination.Item>
+   *   <Pagination.Button aria-label='Forrige side'>Forrige</Pagination.Button>
+   * </Pagination.Item>
+   */
+  Button: typeof PaginationButton;
+};
+/**
+ * Pagination component, used to navigate through a list of items.
+ *
+ * @example
+ * <Pagination>
+ *   <Pagination.List>
+ *     <Pagination.Item>
+ *       <Pagination.Button aria-label='Forrige side'>Forrige</Pagination.Button>
+ *     </Pagination.Item>
+ *     <Pagination.Item>
+ *       <Pagination.Button aria-label='Side 1'>1</Pagination.Button>
+ *     </Pagination.Item>
+ *     <Pagination.Item>
+ *       <Pagination.Button aria-label='Side 2'>2</Pagination.Button>
+ *     </Pagination.Item>
+ *   </Pagination.List>
+ * </Pagination>
+ */
+declare const PaginationComponent: Pagination;
+//#endregion
+export { PaginationComponent as Pagination, PaginationButton, type PaginationButtonProps, PaginationItem, type PaginationItemProps, PaginationList, type PaginationListProps, type PaginationProps };

package/dist/cjs/components/pagination/pagination-button.cjs

@@ -0,0 +1,21 @@
+'use client';
+const require_button = require("../button/button.cjs");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/components/pagination/pagination-button.tsx
+/**
+* PaginationButton component, use within a Pagination.Item.
+*
+* @example
+* <PaginationItem>
+*   <PaginationButton aria-label='Forrige side'>Forrige</PaginationButton>
+* </PaginationItem>
+*/
+const PaginationButton = (0, react.forwardRef)(function PaginationButton(rest, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
+		ref,
+		...rest
+	});
+});
+//#endregion
+exports.PaginationButton = PaginationButton;

package/dist/cjs/components/pagination/pagination-button.d.cts

@@ -0,0 +1,28 @@
+
+import { ButtonProps } from "../button/button.cjs";
+import { AriaAttributes } from "react";
+//#region src/components/pagination/pagination-button.d.ts
+type PaginationButtonProps = {
+  /**
+   * Toggle button as active
+   * @default false
+   */
+  'aria-current'?: AriaAttributes['aria-current'];
+} & Omit<ButtonProps, 'icon' | 'loading'>;
+/**
+ * PaginationButton component, use within a Pagination.Item.
+ *
+ * @example
+ * <PaginationItem>
+ *   <PaginationButton aria-label='Forrige side'>Forrige</PaginationButton>
+ * </PaginationItem>
+ */
+declare const PaginationButton: import("react").ForwardRefExoticComponent<{
+  /**
+   * Toggle button as active
+   * @default false
+   */
+  'aria-current'?: AriaAttributes["aria-current"];
+} & Omit<ButtonProps, "icon" | "loading"> & import("react").RefAttributes<HTMLButtonElement>>;
+//#endregion
+export { PaginationButton, PaginationButtonProps };

package/dist/cjs/components/pagination/pagination-item.cjs

@@ -0,0 +1,23 @@
+'use client';
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _radix_ui_react_slot = require("@radix-ui/react-slot");
+//#region src/components/pagination/pagination-item.tsx
+/**
+* PaginationItem component, use within a Pagination.List.
+*
+* @example
+* <PaginationList>
+*   <PaginationItem>
+*     <PaginationButton aria-label='Forrige side'>Forrige</PaginationButton>
+*   </PaginationItem>
+* </PaginationList>
+*/
+const PaginationItem = (0, react.forwardRef)(function PaginationItem({ asChild, className, ...rest }, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(asChild ? _radix_ui_react_slot.Slot : "li", {
+		ref,
+		...rest
+	});
+});
+//#endregion
+exports.PaginationItem = PaginationItem;

package/dist/cjs/components/pagination/pagination-item.d.cts

@@ -0,0 +1,29 @@
+
+import { HTMLAttributes } from "react";
+//#region src/components/pagination/pagination-item.d.ts
+type PaginationItemProps = {
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & Omit<HTMLAttributes<HTMLLIElement>, 'size'>;
+/**
+ * PaginationItem component, use within a Pagination.List.
+ *
+ * @example
+ * <PaginationList>
+ *   <PaginationItem>
+ *     <PaginationButton aria-label='Forrige side'>Forrige</PaginationButton>
+ *   </PaginationItem>
+ * </PaginationList>
+ */
+declare const PaginationItem: import("react").ForwardRefExoticComponent<{
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & Omit<HTMLAttributes<HTMLLIElement>, "size"> & import("react").RefAttributes<HTMLLIElement>>;
+//#endregion
+export { PaginationItem, PaginationItemProps };

package/dist/cjs/components/pagination/pagination-list.cjs

@@ -0,0 +1,25 @@
+'use client';
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _radix_ui_react_slot = require("@radix-ui/react-slot");
+//#region src/components/pagination/pagination-list.tsx
+/**
+* PaginationList component, use within a Pagination.
+*
+* @example
+* <Pagination>
+*   <PaginationList>
+*     <PaginationItem>
+*       <PaginationButton aria-label='Forrige side'>Forrige</PaginationButton>
+*     </PaginationItem>
+*   </PaginationList>
+* </Pagination>
+*/
+const PaginationList = (0, react.forwardRef)(function PaginationList({ asChild, ...rest }, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(asChild ? _radix_ui_react_slot.Slot : "ul", {
+		ref,
+		...rest
+	});
+});
+//#endregion
+exports.PaginationList = PaginationList;

package/dist/cjs/components/pagination/pagination-list.d.cts

@@ -0,0 +1,31 @@
+
+import { HTMLAttributes } from "react";
+//#region src/components/pagination/pagination-list.d.ts
+type PaginationListProps = {
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & Omit<HTMLAttributes<HTMLUListElement>, 'size'>;
+/**
+ * PaginationList component, use within a Pagination.
+ *
+ * @example
+ * <Pagination>
+ *   <PaginationList>
+ *     <PaginationItem>
+ *       <PaginationButton aria-label='Forrige side'>Forrige</PaginationButton>
+ *     </PaginationItem>
+ *   </PaginationList>
+ * </Pagination>
+ */
+declare const PaginationList: import("react").ForwardRefExoticComponent<{
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   */
+  asChild?: boolean;
+} & Omit<HTMLAttributes<HTMLUListElement>, "size"> & import("react").RefAttributes<HTMLUListElement>>;
+//#endregion
+export { PaginationList, PaginationListProps };

package/dist/cjs/components/pagination/pagination.cjs

@@ -0,0 +1,37 @@
+'use client';
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+require("@digdir/designsystemet-web");
+let clsx_lite = require("clsx/lite");
+clsx_lite = require_runtime.__toESM(clsx_lite, 1);
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _radix_ui_react_slot = require("@radix-ui/react-slot");
+//#region src/components/pagination/pagination.tsx
+/**
+* Pagination component, used to navigate through a list of items.
+*
+* @example
+* <Pagination>
+*   <Pagination.List>
+*     <Pagination.Item>
+*       <Pagination.Button aria-label='Forrige side'>Forrige</Pagination.Button>
+*     </Pagination.Item>
+*     <Pagination.Item>
+*       <Pagination.Button aria-label='Side 1'>1</Pagination.Button>
+*     </Pagination.Item>
+*     <Pagination.Item>
+*       <Pagination.Button aria-label='Side 2'>2</Pagination.Button>
+*     </Pagination.Item>
+*   </Pagination.List>
+* </Pagination>
+*/
+const Pagination = (0, react.forwardRef)(function Pagination({ asChild, className, ...rest }, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(asChild ? _radix_ui_react_slot.Slot : "ds-pagination", {
+		...asChild ? { className: (0, clsx_lite.default)("ds-pagination", className) } : { class: (0, clsx_lite.default)("ds-pagination", className) },
+		suppressHydrationWarning: true,
+		ref,
+		...rest
+	});
+});
+//#endregion
+exports.Pagination = Pagination;

package/dist/cjs/components/pagination/pagination.d.cts

@@ -0,0 +1,71 @@
+
+import { DefaultProps } from "../../types.cjs";
+import { MergeRight } from "../../utilities/types.cjs";
+import "../../utilities/index.cjs";
+import { DSPaginationElement } from "@digdir/designsystemet-web";
+import { HTMLAttributes } from "react";
+//#region src/components/pagination/pagination.d.ts
+type PaginationProps = MergeRight<DefaultProps & HTMLAttributes<DSPaginationElement>, {
+  /**
+   * Sets the screen reader label for the Pagination area
+   * @default 'Bla i sider'
+   */
+  'aria-label'?: string;
+  /**
+   * Current page number
+   */
+  'data-current'?: string;
+  /**
+   * Total number of pages
+   */
+  'data-total'?: string;
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   *
+   * @deprecated This is not supported anymore, as the element needs to be `ds-pagination`
+   */
+  asChild?: boolean;
+}>;
+/**
+ * Pagination component, used to navigate through a list of items.
+ *
+ * @example
+ * <Pagination>
+ *   <Pagination.List>
+ *     <Pagination.Item>
+ *       <Pagination.Button aria-label='Forrige side'>Forrige</Pagination.Button>
+ *     </Pagination.Item>
+ *     <Pagination.Item>
+ *       <Pagination.Button aria-label='Side 1'>1</Pagination.Button>
+ *     </Pagination.Item>
+ *     <Pagination.Item>
+ *       <Pagination.Button aria-label='Side 2'>2</Pagination.Button>
+ *     </Pagination.Item>
+ *   </Pagination.List>
+ * </Pagination>
+ */
+declare const Pagination: import("react").ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<DSPaginationElement>, "asChild" | "aria-label" | "data-current" | "data-total"> & {
+  /**
+   * Sets the screen reader label for the Pagination area
+   * @default 'Bla i sider'
+   */
+  'aria-label'?: string;
+  /**
+   * Current page number
+   */
+  'data-current'?: string;
+  /**
+   * Total number of pages
+   */
+  'data-total'?: string;
+  /**
+   * Change the default rendered element for the one passed as a child, merging their props and behavior.
+   * @default false
+   *
+   * @deprecated This is not supported anymore, as the element needs to be `ds-pagination`
+   */
+  asChild?: boolean;
+} & import("react").RefAttributes<DSPaginationElement>>;
+//#endregion
+export { Pagination, PaginationProps };

package/dist/cjs/components/paragraph/paragraph.cjs

@@ -0,0 +1,25 @@
+'use client';
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+let clsx_lite = require("clsx/lite");
+clsx_lite = require_runtime.__toESM(clsx_lite, 1);
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _radix_ui_react_slot = require("@radix-ui/react-slot");
+//#region src/components/paragraph/paragraph.tsx
+/**
+* Use `Paragraph` to display text with paragraph text styles.
+* Renders a native `p` element.
+*
+* @example
+* <Paragraph data-size='lg'>Paragraph</Paragraph>
+*/
+const Paragraph = (0, react.forwardRef)(function Paragraph({ className, asChild, variant, ...rest }, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(asChild ? _radix_ui_react_slot.Slot : "p", {
+		ref,
+		className: (0, clsx_lite.default)(`ds-paragraph`, className),
+		"data-variant": variant,
+		...rest
+	});
+});
+//#endregion
+exports.Paragraph = Paragraph;