@ultraviolet/ui 3.0.0-beta.27 → 3.0.0-beta.29

package/dist/components/NumberInput/index.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsxs, jsx } from "@emotion/react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { MinusIcon, PlusIcon } from "@ultraviolet/icons";
 import { forwardRef, useRef, useImperativeHandle, useId, useMemo, useCallback } from "react";
 import { Button } from "../Button/index.js";
@@ -9,137 +9,246 @@ import { Stack } from "../Stack/index.js";
 import { Text } from "../Text/index.js";
 import { Tooltip } from "../Tooltip/index.js";
 import { numberinputContainer, numberinputSideContainer, inputContainer, numberinput, unit } from "./styles.css.js";
-const NumberInput = forwardRef(({
-  disabled = false,
-  max = Number.MAX_SAFE_INTEGER,
-  min = 0,
-  name,
-  onChange,
-  onFocus,
-  onBlur,
-  size = "large",
-  step,
-  unit: unit$1,
-  value,
-  tooltip,
-  className,
-  label,
-  labelDescription,
-  id,
-  controls = true,
-  placeholder = "",
-  error,
-  success,
-  helper,
-  "aria-label": ariaLabel,
-  "data-testid": dataTestId,
-  required,
-  autoFocus,
-  readOnly,
-  style
-}, ref) => {
-  const localRef = useRef(null);
-  useImperativeHandle(ref, () => localRef.current);
-  const uniqueId = useId();
-  const localId = id ?? uniqueId;
-  const computedState = useMemo(() => {
-    if (disabled) {
-      return "disabled";
-    }
-    if (readOnly) {
-      return "readOnly";
-    }
-    if (error) {
-      return "error";
-    }
-    if (success) {
-      return "success";
-    }
-    return "default";
-  }, [error, success, disabled, readOnly]);
-  const onClickSideButton = useCallback((direction) => () => {
-    if (direction === "up") {
-      localRef.current?.stepUp();
-    } else if (direction === "down") {
-      localRef.current?.stepDown();
-    }
-    onChange?.(Number.parseFloat(localRef.current?.value ?? "") ?? min);
-  }, [localRef, min, onChange]);
-  const isMinusDisabled = useCallback(() => {
-    if (!localRef?.current?.value || localRef?.current?.value === "") {
-      return false;
-    }
-    const numericValue = Number(localRef?.current?.value);
-    if (Number.isNaN(numericValue)) {
-      return false;
-    }
-    const minValue = typeof min === "number" ? min : Number(min);
-    return Number.isNaN(numericValue) || numericValue <= minValue;
-  }, [localRef?.current?.value, min]);
-  const isPlusDisabled = useCallback(() => {
-    if (!localRef?.current?.value || localRef?.current?.value === "") {
-      return false;
-    }
-    const numericValue = Number(localRef?.current?.value);
-    if (Number.isNaN(numericValue)) {
-      return false;
-    }
-    const maxValue = typeof max === "number" ? max : Number(max);
-    return numericValue >= maxValue;
-  }, [localRef?.current?.value, max]);
-  const helperSentiment = useMemo(() => {
-    if (error) {
-      return "danger";
-    }
-    if (success) {
-      return "success";
-    }
-    return "neutral";
-  }, [error, success]);
-  let inputValue;
-  if (value !== void 0) {
-    inputValue = value !== null && typeof value === "number" ? value.toString() : "";
-    if (localRef.current) {
-      localRef.current.value = inputValue;
+const NumberInput = forwardRef(
+  ({
+    disabled = false,
+    max = Number.MAX_SAFE_INTEGER,
+    min = 0,
+    name,
+    onChange,
+    onFocus,
+    onBlur,
+    size = "large",
+    step,
+    unit: unit$1,
+    value,
+    tooltip,
+    className,
+    label,
+    labelDescription,
+    id,
+    controls = true,
+    placeholder = "",
+    error,
+    success,
+    helper,
+    "aria-label": ariaLabel,
+    "data-testid": dataTestId,
+    required,
+    autoFocus,
+    readOnly,
+    style
+  }, ref) => {
+    const localRef = useRef(null);
+    useImperativeHandle(ref, () => localRef.current);
+    const uniqueId = useId();
+    const localId = id ?? uniqueId;
+    const computedState = useMemo(() => {
+      if (disabled) {
+        return "disabled";
+      }
+      if (readOnly) {
+        return "readOnly";
+      }
+      if (error) {
+        return "error";
+      }
+      if (success) {
+        return "success";
+      }
+      return "default";
+    }, [error, success, disabled, readOnly]);
+    const onClickSideButton = useCallback(
+      (direction) => () => {
+        if (direction === "up") {
+          localRef.current?.stepUp();
+        } else if (direction === "down") {
+          localRef.current?.stepDown();
+        }
+        onChange?.(Number.parseFloat(localRef.current?.value ?? "") ?? min);
+      },
+      [localRef, min, onChange]
+    );
+    const isMinusDisabled = useCallback(() => {
+      if (!localRef?.current?.value || localRef?.current?.value === "") {
+        return false;
+      }
+      const numericValue = Number(localRef?.current?.value);
+      if (Number.isNaN(numericValue)) {
+        return false;
+      }
+      const minValue = typeof min === "number" ? min : Number(min);
+      return Number.isNaN(numericValue) || numericValue <= minValue;
+    }, [localRef?.current?.value, min]);
+    const isPlusDisabled = useCallback(() => {
+      if (!localRef?.current?.value || localRef?.current?.value === "") {
+        return false;
+      }
+      const numericValue = Number(localRef?.current?.value);
+      if (Number.isNaN(numericValue)) {
+        return false;
+      }
+      const maxValue = typeof max === "number" ? max : Number(max);
+      return numericValue >= maxValue;
+    }, [localRef?.current?.value, max]);
+    const helperSentiment = useMemo(() => {
+      if (error) {
+        return "danger";
+      }
+      if (success) {
+        return "success";
+      }
+      return "neutral";
+    }, [error, success]);
+    let inputValue;
+    if (value !== void 0) {
+      inputValue = value !== null && typeof value === "number" ? value.toString() : "";
+      if (localRef.current) {
+        localRef.current.value = inputValue;
+      }
     }
+    return /* @__PURE__ */ jsxs(Stack, { className, gap: "0.5", children: [
+      label || labelDescription ? /* @__PURE__ */ jsx(
+        Label,
+        {
+          htmlFor: id ?? localId,
+          labelDescription,
+          required,
+          size,
+          children: label
+        }
+      ) : null,
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Tooltip, { text: tooltip, children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: numberinputContainer({ size, state: computedState }),
+          "data-controls": controls,
+          "data-disabled": disabled,
+          "data-error": !!error,
+          "data-readonly": readOnly,
+          "data-size": size,
+          "data-success": !!success,
+          "data-unit": !!unit$1,
+          children: [
+            controls ? /* @__PURE__ */ jsx(
+              Stack,
+              {
+                alignItems: "center",
+                className: numberinputSideContainer[size],
+                "data-size": size,
+                justifyContent: "center",
+                children: /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    "aria-label": "minus",
+                    disabled: disabled || readOnly || isMinusDisabled(),
+                    onClick: onClickSideButton("down"),
+                    sentiment: "neutral",
+                    size: size === "small" ? "xsmall" : "small",
+                    variant: "ghost",
+                    children: /* @__PURE__ */ jsx(MinusIcon, { size: size === "large" ? "small" : "small" })
+                  }
+                )
+              }
+            ) : null,
+            /* @__PURE__ */ jsxs(
+              Row,
+              {
+                alignItems: "center",
+                className: inputContainer({ controls }),
+                justifyContent: "space-between",
+                templateColumns: "1fr auto",
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "input",
+                    {
+                      "aria-label": ariaLabel,
+                      autoFocus,
+                      className: numberinput({ controls, hasUnit: !!unit$1, size }),
+                      "data-testid": dataTestId,
+                      disabled,
+                      id: localId,
+                      max,
+                      min,
+                      name,
+                      onBlur: (event) => {
+                        if (value && value > max) {
+                          onChange?.(max);
+                        } else if (value && value < min) {
+                          onChange?.(min);
+                        }
+                        onBlur?.(event);
+                      },
+                      onChange: onChange ? (event) => {
+                        const newNumber = Number.parseFloat(
+                          event.target.value
+                        );
+                        onChange(Number.isNaN(newNumber) ? null : newNumber);
+                      } : void 0,
+                      onFocus,
+                      placeholder,
+                      readOnly,
+                      ref: localRef,
+                      required,
+                      step,
+                      style,
+                      type: "number",
+                      value: inputValue
+                    }
+                  ),
+                  unit$1 ? /* @__PURE__ */ jsx(
+                    Text,
+                    {
+                      as: "span",
+                      className: unit({ disabled, readOnly, size }),
+                      disabled,
+                      sentiment: "neutral",
+                      variant: "body",
+                      children: unit$1
+                    }
+                  ) : null
+                ]
+              }
+            ),
+            controls ? /* @__PURE__ */ jsx(
+              Stack,
+              {
+                alignItems: "center",
+                className: numberinputSideContainer[size],
+                "data-size": size,
+                justifyContent: "center",
+                children: /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    "aria-label": "plus",
+                    disabled: disabled || readOnly || isPlusDisabled(),
+                    onClick: onClickSideButton("up"),
+                    sentiment: "neutral",
+                    size: size === "small" ? "xsmall" : "small",
+                    variant: "ghost",
+                    children: /* @__PURE__ */ jsx(PlusIcon, { size: size === "large" ? "small" : "small" })
+                  }
+                )
+              }
+            ) : null
+          ]
+        }
+      ) }) }),
+      error || typeof success === "string" || typeof helper === "string" ? /* @__PURE__ */ jsx(
+        Text,
+        {
+          as: "span",
+          disabled: disabled || readOnly,
+          prominence: !error && !success ? "weak" : "default",
+          sentiment: helperSentiment,
+          variant: "caption",
+          children: error || success || helper
+        }
+      ) : null,
+      !error && !success && typeof helper !== "string" && helper ? helper : null
+    ] });
   }
-  return /* @__PURE__ */ jsxs(Stack, { className, gap: "0.5", children: [
-    label || labelDescription ? /* @__PURE__ */ jsx(Label, { htmlFor: id ?? localId, labelDescription, required, size, children: label }) : null,
-    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Tooltip, { text: tooltip, children: /* @__PURE__ */ jsxs("div", { className: numberinputContainer({
-      size,
-      state: computedState
-    }), "data-controls": controls, "data-disabled": disabled, "data-error": !!error, "data-readonly": readOnly, "data-size": size, "data-success": !!success, "data-unit": !!unit$1, children: [
-      controls ? /* @__PURE__ */ jsx(Stack, { alignItems: "center", className: numberinputSideContainer[size], "data-size": size, justifyContent: "center", children: /* @__PURE__ */ jsx(Button, { "aria-label": "minus", disabled: disabled || readOnly || isMinusDisabled(), onClick: onClickSideButton("down"), sentiment: "neutral", size: size === "small" ? "xsmall" : "small", variant: "ghost", children: /* @__PURE__ */ jsx(MinusIcon, { size: size === "large" ? "small" : "small" }) }) }) : null,
-      /* @__PURE__ */ jsxs(Row, { alignItems: "center", className: inputContainer({
-        controls
-      }), justifyContent: "space-between", templateColumns: "1fr auto", children: [
-        /* @__PURE__ */ jsx("input", { "aria-label": ariaLabel, autoFocus, className: numberinput({
-          controls,
-          hasUnit: !!unit$1,
-          size
-        }), "data-testid": dataTestId, disabled, id: localId, max, min, name, onBlur: (event) => {
-          if (value && value > max) {
-            onChange?.(max);
-          } else if (value && value < min) {
-            onChange?.(min);
-          }
-          onBlur?.(event);
-        }, onChange: onChange ? (event) => {
-          const newNumber = Number.parseFloat(event.target.value);
-          onChange(Number.isNaN(newNumber) ? null : newNumber);
-        } : void 0, onFocus, placeholder, readOnly, ref: localRef, required, step, style, type: "number", value: inputValue }),
-        unit$1 ? /* @__PURE__ */ jsx(Text, { as: "span", className: unit({
-          disabled,
-          readOnly,
-          size
-        }), disabled, sentiment: "neutral", variant: "body", children: unit$1 }) : null
-      ] }),
-      controls ? /* @__PURE__ */ jsx(Stack, { alignItems: "center", className: numberinputSideContainer[size], "data-size": size, justifyContent: "center", children: /* @__PURE__ */ jsx(Button, { "aria-label": "plus", disabled: disabled || readOnly || isPlusDisabled(), onClick: onClickSideButton("up"), sentiment: "neutral", size: size === "small" ? "xsmall" : "small", variant: "ghost", children: /* @__PURE__ */ jsx(PlusIcon, { size: size === "large" ? "small" : "small" }) }) }) : null
-    ] }) }) }),
-    error || typeof success === "string" || typeof helper === "string" ? /* @__PURE__ */ jsx(Text, { as: "span", disabled: disabled || readOnly, prominence: !error && !success ? "weak" : "default", sentiment: helperSentiment, variant: "caption", children: error || success || helper }) : null,
-    !error && !success && typeof helper !== "string" && helper ? helper : null
-  ] });
-});
+);
 export {
   NumberInput
 };

package/dist/components/Pagination/PaginationButtons.d.ts

@@ -8,5 +8,5 @@ type PaginationButtonsProps = {
     'data-testid'?: string;
     perPage: boolean;
 };
-export declare const PaginationButtons: ({ page, disabled, onChange, pageCount, pageTabCount, "data-testid": dataTestId, className, perPage, }: PaginationButtonsProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const PaginationButtons: ({ page, disabled, onChange, pageCount, pageTabCount, "data-testid": dataTestId, className, perPage, }: PaginationButtonsProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Pagination/PaginationButtons.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsxs, jsx, Fragment } from "@emotion/react/jsx-runtime";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { ArrowLeftIcon, ArrowRightIcon } from "@ultraviolet/icons";
 import { useCallback, useMemo } from "react";
 import { Button } from "../Button/index.js";
@@ -15,8 +15,34 @@ const MakeButton = ({
   handlePageClick,
   perPage
 }) => /* @__PURE__ */ jsxs(Fragment, { children: [
-  hasEllipsisBefore ? /* @__PURE__ */ jsx(Text, { "aria-label": "ellipsis", as: "span", className: ellipsisClass[perPage ? "small" : "medium"], disabled, placement: "center", prominence: "default", sentiment: "neutral", variant: "body", children: "..." }) : null,
-  /* @__PURE__ */ jsx(Button, { "aria-current": pageNumber === page, className: pageButton[perPage ? "small" : "medium"], disabled, onClick: handlePageClick(pageNumber), sentiment: pageNumber === page ? "primary" : "neutral", size: perPage ? "small" : "medium", type: "button", variant: pageNumber === page ? "filled" : "outlined", children: pageNumber })
+  hasEllipsisBefore ? /* @__PURE__ */ jsx(
+    Text,
+    {
+      "aria-label": "ellipsis",
+      as: "span",
+      className: ellipsisClass[perPage ? "small" : "medium"],
+      disabled,
+      placement: "center",
+      prominence: "default",
+      sentiment: "neutral",
+      variant: "body",
+      children: "..."
+    }
+  ) : null,
+  /* @__PURE__ */ jsx(
+    Button,
+    {
+      "aria-current": pageNumber === page,
+      className: pageButton[perPage ? "small" : "medium"],
+      disabled,
+      onClick: handlePageClick(pageNumber),
+      sentiment: pageNumber === page ? "primary" : "neutral",
+      size: perPage ? "small" : "medium",
+      type: "button",
+      variant: pageNumber === page ? "filled" : "outlined",
+      children: pageNumber
+    }
+  )
 ] });
 const PaginationButtons = ({
   page,
@@ -34,14 +60,53 @@ const PaginationButtons = ({
   const goToPreviousPage = useCallback(() => {
     onChange(page - 1);
   }, [onChange, page]);
-  const pageNumbersToDisplay = useMemo(() => pageCount > 1 ? getPageNumbers(page, pageCount, pageTabCount) : [1], [page, pageCount, pageTabCount]);
-  const handlePageClick = useCallback((pageNumber) => () => {
-    onChange(pageNumber);
-  }, [onChange]);
+  const pageNumbersToDisplay = useMemo(
+    () => pageCount > 1 ? getPageNumbers(page, pageCount, pageTabCount) : [1],
+    [page, pageCount, pageTabCount]
+  );
+  const handlePageClick = useCallback(
+    (pageNumber) => () => {
+      onChange(pageNumber);
+    },
+    [onChange]
+  );
   return /* @__PURE__ */ jsxs(Stack, { className, "data-testid": dataTestId, direction: "row", children: [
-    /* @__PURE__ */ jsx(Stack, { gap: 1, children: /* @__PURE__ */ jsx(Button, { "aria-label": "Back", disabled: page <= 1 || disabled, onClick: goToPreviousPage, sentiment: "primary", size: perPage ? "small" : "medium", variant: "outlined", children: /* @__PURE__ */ jsx(ArrowLeftIcon, {}) }) }),
-    /* @__PURE__ */ jsx(Stack, { className: pageNumbersContainer, direction: "row", gap: 1, children: pageNumbersToDisplay.map((pageNumber, index) => /* @__PURE__ */ jsx(MakeButton, { disabled, handlePageClick, hasEllipsisBefore: !(index === 0 || pageNumbersToDisplay[index - 1] === pageNumber - 1), page, pageNumber, perPage }, pageNumber)) }),
-    /* @__PURE__ */ jsx(Stack, { gap: 1, children: /* @__PURE__ */ jsx(Button, { "aria-label": "Next", disabled: page >= pageCount || disabled, onClick: goToNextPage, sentiment: "primary", size: perPage ? "small" : "medium", variant: "outlined", children: /* @__PURE__ */ jsx(ArrowRightIcon, {}) }) })
+    /* @__PURE__ */ jsx(Stack, { gap: 1, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        "aria-label": "Back",
+        disabled: page <= 1 || disabled,
+        onClick: goToPreviousPage,
+        sentiment: "primary",
+        size: perPage ? "small" : "medium",
+        variant: "outlined",
+        children: /* @__PURE__ */ jsx(ArrowLeftIcon, {})
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Stack, { className: pageNumbersContainer, direction: "row", gap: 1, children: pageNumbersToDisplay.map((pageNumber, index) => /* @__PURE__ */ jsx(
+      MakeButton,
+      {
+        disabled,
+        handlePageClick,
+        hasEllipsisBefore: !(index === 0 || pageNumbersToDisplay[index - 1] === pageNumber - 1),
+        page,
+        pageNumber,
+        perPage
+      },
+      pageNumber
+    )) }),
+    /* @__PURE__ */ jsx(Stack, { gap: 1, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        "aria-label": "Next",
+        disabled: page >= pageCount || disabled,
+        onClick: goToNextPage,
+        sentiment: "primary",
+        size: perPage ? "small" : "medium",
+        variant: "outlined",
+        children: /* @__PURE__ */ jsx(ArrowRightIcon, {})
+      }
+    ) })
   ] });
 };
 export {

package/dist/components/Pagination/PerPage.d.ts

@@ -8,5 +8,5 @@ type PerPageProps = {
     page: number;
     numberOfItems: number;
 };
-export declare const PerPage: ({ perPage, onChangePerPage, perPageText, setPerPage, numberOfItemsText, page, numberOfItems, }: PerPageProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const PerPage: ({ perPage, onChangePerPage, perPageText, setPerPage, numberOfItemsText, page, numberOfItems, }: PerPageProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Pagination/PerPage.js

@@ -1,21 +1,26 @@
 "use client";
-import { jsxs, jsx } from "@emotion/react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { SelectInput } from "../SelectInput/index.js";
 import { Stack } from "../Stack/index.js";
 import { Text } from "../Text/index.js";
-const optionsItemsPerPage = [{
-  label: "10",
-  value: "10"
-}, {
-  label: "25",
-  value: "25"
-}, {
-  label: "50",
-  value: "50"
-}, {
-  label: "100",
-  value: "100"
-}];
+const optionsItemsPerPage = [
+  {
+    label: "10",
+    value: "10"
+  },
+  {
+    label: "25",
+    value: "25"
+  },
+  {
+    label: "50",
+    value: "50"
+  },
+  {
+    label: "100",
+    value: "100"
+  }
+];
 const PerPage = ({
   perPage,
   onChangePerPage,
@@ -32,9 +37,19 @@ const PerPage = ({
   };
   return /* @__PURE__ */ jsxs(Stack, { alignItems: "center", direction: "row", gap: "2", children: [
     /* @__PURE__ */ jsx(Text, { as: "span", prominence: "weak", sentiment: "neutral", variant: "body", children: perPageText ?? "Items per page" }),
-    /* @__PURE__ */ jsx(SelectInput, { name: "select-items-per-page", onChange: handleChange, options: optionsItemsPerPage, size: "small", style: {
-      width: "fit-content"
-    }, value: perPage.toString() }),
+    /* @__PURE__ */ jsx(
+      SelectInput,
+      {
+        name: "select-items-per-page",
+        onChange: handleChange,
+        options: optionsItemsPerPage,
+        size: "small",
+        style: {
+          width: "fit-content"
+        },
+        value: perPage.toString()
+      }
+    ),
     /* @__PURE__ */ jsxs(Text, { as: "span", prominence: "weak", sentiment: "neutral", variant: "body", children: [
       (page - 1) * perPage + 1,
       "-",

package/dist/components/Pagination/getPageNumbers.js

@@ -3,20 +3,19 @@ const getPageNumbers = (currentPage, pageCount, range = 5) => {
   const truncationBefore = currentPage >= range;
   const truncationAfter = currentPage <= pageCount - range + 1 || currentPage < range;
   if (pageCount <= range) {
-    return Array.from({
-      length: pageCount
-    }, (_, index) => index + 1);
+    return Array.from({ length: pageCount }, (_, index) => index + 1);
   }
-  const pagesToShowBeforeTruncation = truncationBefore ? [1] : Array.from({
-    length: range
-  }, (_, index) => index + 1);
-  const pagesToShowAfterTruncation = truncationAfter ? [pageCount] : Array.from({
-    length: range
-  }, (_, index) => index + pageCount - range + 1);
-  const pagesToShowBetweenTruncation = truncationBefore && truncationAfter ? Array.from({
-    length: NUMBER_OF_BUTTONS_IN_BETWEEN
-  }, (_, index) => currentPage + index - 1) : [];
-  return [...pagesToShowBeforeTruncation, ...pagesToShowBetweenTruncation, ...pagesToShowAfterTruncation];
+  const pagesToShowBeforeTruncation = truncationBefore ? [1] : Array.from({ length: range }, (_, index) => index + 1);
+  const pagesToShowAfterTruncation = truncationAfter ? [pageCount] : Array.from({ length: range }, (_, index) => index + pageCount - range + 1);
+  const pagesToShowBetweenTruncation = truncationBefore && truncationAfter ? Array.from(
+    { length: NUMBER_OF_BUTTONS_IN_BETWEEN },
+    (_, index) => currentPage + index - 1
+  ) : [];
+  return [
+    ...pagesToShowBeforeTruncation,
+    ...pagesToShowBetweenTruncation,
+    ...pagesToShowAfterTruncation
+  ];
 };
 export {
   getPageNumbers

package/dist/components/Pagination/index.d.ts

@@ -55,5 +55,5 @@ type PaginationProps = {
  * Pagination is a component to navigate between pages, it is composed of 2 buttons to go to the previous and next page,
  * and a list of buttons to go to a specific page.
  */
-export declare const Pagination: ({ disabled, page, pageCount, onChange, pageTabCount, className, perPage, onChangePerPage, perPageText, numberOfItemsText, numberOfItems, "data-testid": dataTestId, style, }: PaginationProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const Pagination: ({ disabled, page, pageCount, onChange, pageTabCount, className, perPage, onChangePerPage, perPageText, numberOfItemsText, numberOfItems, "data-testid": dataTestId, style, }: PaginationProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Pagination/index.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsxs, jsx } from "@emotion/react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import { Stack } from "../Stack/index.js";
 import { PaginationButtons } from "./PaginationButtons.js";
@@ -34,8 +34,31 @@ const Pagination = ({
     }
   }, [perPage]);
   return /* @__PURE__ */ jsxs(Stack, { direction: "row", justifyContent: "space-between", style, children: [
-    perPage ? /* @__PURE__ */ jsx(PerPage, { numberOfItems, numberOfItemsText, onChangePerPage, page, perPage: perPageComputed, perPageText, setPerPage }) : null,
-    /* @__PURE__ */ jsx(PaginationButtons, { className, "data-testid": dataTestId, disabled, onChange, page, pageCount, pageTabCount, perPage: !!perPage })
+    perPage ? /* @__PURE__ */ jsx(
+      PerPage,
+      {
+        numberOfItems,
+        numberOfItemsText,
+        onChangePerPage,
+        page,
+        perPage: perPageComputed,
+        perPageText,
+        setPerPage
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(
+      PaginationButtons,
+      {
+        className,
+        "data-testid": dataTestId,
+        disabled,
+        onChange,
+        page,
+        pageCount,
+        pageTabCount,
+        perPage: !!perPage
+      }
+    )
   ] });
 };
 export {

package/dist/components/PasswordCheck/index.d.ts

@@ -18,5 +18,5 @@ type PasswordCheckProps = {
  * PasswordCheck is a component that display a list of password rules with a check or a cross depending on the validity
  * of the rule.
  */
-export declare const PasswordCheck: ({ rules, className, "data-testid": dataTestId, style, }: PasswordCheckProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const PasswordCheck: ({ rules, className, "data-testid": dataTestId, style, }: PasswordCheckProps) => import("react/jsx-runtime").JSX.Element;
 export {};