@navikt/ds-react 7.0.1 → 7.1.1

package/src/pagination/Pagination.tsx

@@ -189,21 +189,13 @@ export const Pagination = forwardRef<HTMLElement, PaginationProps>(
               size={size}
               icon={
                 <ChevronLeftIcon
-                  className="navds-pagination__prev-next-icon"
                   {...(prevNextTexts
                     ? { "aria-hidden": true }
                     : { title: "Forrige" })}
                 />
               }
             >
-              {prevNextTexts && (
-                <BodyShort
-                  size={size === "xsmall" ? "small" : size}
-                  className="navds-pagination__prev-text"
-                >
-                  Forrige
-                </BodyShort>
-              )}
+              {prevNextTexts && `Forrige`}
             </Item>
           </li>
           {getSteps({ page, count, siblingCount, boundaryCount }).map(
@@ -211,7 +203,10 @@ export const Pagination = forwardRef<HTMLElement, PaginationProps>(
               const n = Number(step);
               return Number.isNaN(n) ? (
                 <li className="navds-pagination__ellipsis" key={`${step}${i}`}>
-                  <BodyShort size={size === "xsmall" ? "small" : size}>
+                  <BodyShort
+                    size={size === "xsmall" ? "small" : size}
+                    as="span"
+                  >
                     ...
                   </BodyShort>
                 </li>
@@ -223,9 +218,7 @@ export const Pagination = forwardRef<HTMLElement, PaginationProps>(
                     page={n}
                     size={size}
                   >
-                    <BodyShort size={size === "xsmall" ? "small" : size}>
-                      {n}
-                    </BodyShort>
+                    {n}
                   </Item>
                 </li>
               );
@@ -243,7 +236,6 @@ export const Pagination = forwardRef<HTMLElement, PaginationProps>(
               size={size}
               icon={
                 <ChevronRightIcon
-                  className="navds-pagination__prev-next-icon"
                   {...(prevNextTexts
                     ? { "aria-hidden": true }
                     : { title: "Neste" })}
@@ -251,14 +243,7 @@ export const Pagination = forwardRef<HTMLElement, PaginationProps>(
               }
               iconPosition="right"
             >
-              {prevNextTexts && (
-                <BodyShort
-                  size={size === "xsmall" ? "small" : size}
-                  className="navds-pagination__next-text"
-                >
-                  Neste
-                </BodyShort>
-              )}
+              {prevNextTexts && `Neste`}
             </Item>
           </li>
         </ul>

package/src/pagination/PaginationItem.tsx

@@ -11,9 +11,10 @@ export interface PaginationItemProps extends ButtonProps {
    */
   selected?: boolean;
   /**
-   * The page the item represents
+   * Currently only sets `data-page` attribute.
+   * @deprecated Use `data-page` instead if you need to access the items page number in the future.
    */
-  page: number;
+  page?: number;
   /**
    * Changes padding, height and font-size
    * @default "medium"
@@ -48,7 +49,7 @@ export const Item: PaginationItemType = forwardRef(
           "navds-pagination__item--selected": selected,
         })}
         data-page={page}
-        /* TODO: Breaking change to remove. Add to future major version. */
+        /* TODO: Breaking change to remove since it's in use by some applications. Add to future major version. */
         page={page}
         {...(Component === "button" && { type: "button" })}
         {...rest}

package/src/util/create-context.tsx

@@ -40,8 +40,8 @@ export function createContext<T>(options: CreateContextOptions<T> = {}) {
    * We use forwardRef to allow `ref` to be used as a regular context value
    * @see https://reactjs.org/docs/forwarding-refs.html#forwarding-refs-to-dom-components
    */
-  const Provider = forwardRef(
-    ({ children, ...context }: ProviderProps<T>, ref) => {
+  const Provider = forwardRef<unknown, ProviderProps<T>>(
+    ({ children, ...context }, ref) => {
       // Only re-memoize when prop values change
       // eslint-disable-next-line react-hooks/exhaustive-deps
       const value = React.useMemo(() => context, Object.values(context)) as T;