@dnb/eufemia 9.23.0-beta.1 → 9.23.0-beta.2

package/components/pagination/PaginationBar.d.ts

@@ -1,34 +1,42 @@
-export default class PaginationBar extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<{
-        pagination: {};
-    }>;
-    static propTypes: {
-        button_title: PropTypes.Requireable<string>;
-        prev_title: PropTypes.Requireable<string>;
-        next_title: PropTypes.Requireable<string>;
-        more_pages: PropTypes.Requireable<string>;
-        contentRef: PropTypes.Requireable<object>;
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-    };
-    static defaultProps: {
-        button_title: any;
-        prev_title: any;
-        next_title: any;
-        more_pages: any;
-        contentRef: any;
-        children: any;
-    };
-    constructor(props: any);
-    constructor(props: any, context: any);
-    focusPage(): void;
-    keepPageHeight(): void;
-    setPage: (currentPage: any, event?: any) => void;
-    setPrevPage: () => void;
-    setNextPage: () => void;
-    clickHandler: ({ pageNumber, event }: {
-        pageNumber: any;
-        event: any;
-    }) => void;
+import * as React from 'react';
+export type PaginationBarChildren =
+  | React.ReactNode
+  | ((...args: any[]) => any);
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface PaginationBarProps extends React.HTMLProps<HTMLElement> {
+  /**
+   * The title used in every button shown in the bar. Defaults to `Side %s`.
+   */
+  button_title?: string;
+
+  /**
+   * The title used in the previous page button. Defaults to `Forrige side`.
+   */
+  prev_title?: string;
+
+  /**
+   * The title used in the next page button. Defaults to `Neste side`.
+   */
+  next_title?: string;
+
+  /**
+   * The title used in the dots. Relevant for screen-readers. Defaults to `%s flere sider`.
+   */
+  more_pages?: string;
+  contentRef?: Object;
+
+  /**
+   * The given content can be either a function or a React node, depending on your needs. A function contains several helper functions. More details down below and have a look at the examples in the demos section.
+   */
+  children?: PaginationBarChildren;
+}
+export default class PaginationBar extends React.Component<
+  PaginationBarProps,
+  any
+> {
+  static defaultProps: object;
+  render(): JSX.Element;
 }
-import React from "react";
-import PropTypes from "prop-types";

package/components/pagination/PaginationHelpers.d.ts

@@ -1,43 +1,22 @@
-export function isTrElement(Element: any): boolean;
-export function preparePageElement(Element: any, includeClassName?: string): any;
-export class PaginationIndicator extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<{
-        translation: any;
-        updateTranslation: (locale: any, translation: any) => void;
-        getTranslation: (props: any) => any;
-        locales: any;
-        Avatar: {};
-        AvatarGroup: {};
-        Breadcrumb: {};
-        BreadcrumbItem: {};
-        InfoCard: {};
-        Tag: {};
-        TagGroup: {};
-        Timeline: {};
-        TimelineItem: {};
-        VisuallyHidden: {};
-        Drawer: {};
-        Dialog: {};
-    }>;
-    static propTypes: {
-        indicator_element: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-    };
-    static defaultProps: {
-        indicator_element: string;
-    };
-    constructor(props: any);
-    constructor(props: any, context: any);
+import * as React from 'react';
+export type PaginationIndicatorIndicatorElement =
+  | Object
+  | React.ReactNode
+  | ((...args: any[]) => any)
+  | string;
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface PaginationIndicatorProps {
+  /**
+   * (infinity mode) is used by the <em>indicator</em>. Falls back to `fallback_element` if not defined.
+   */
+  indicator_element?: PaginationIndicatorIndicatorElement;
 }
-export class ContentObject {
-    constructor({ pageNumber, ...props }: {
-        [x: string]: any;
-        pageNumber: any;
-    });
-    content: any;
-    pageNumber: any;
-    hasContent: boolean;
-    insert(content: any): ContentObject;
-    update(content: any): ContentObject;
+export class PaginationIndicator extends React.Component<
+  PaginationIndicatorProps,
+  any
+> {
+  render(): JSX.Element;
 }
-import React from "react";
-import PropTypes from "prop-types";

package/components/pagination/PaginationInfinity.d.ts

@@ -1,72 +1,46 @@
-export default class InfinityScroller extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<{
-        pagination: {};
-    }>;
-    static propTypes: {
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-    };
-    static defaultProps: {
-        children: any;
-    };
-    constructor(props: any, context: any);
-    hideIndicator: boolean;
-    useLoadButton: boolean;
-    lastElement: React.RefObject<any>;
-    callOnUnmount: any[];
-    startup: () => void;
-    getNewContent: (newPageNo: any, props?: {}, { callStartupEvent, preventWaitForDelay }?: {
-        callStartupEvent?: boolean;
-        preventWaitForDelay?: boolean;
-    }) => any;
-    waitForReachedTime(fn: any, params: any): void;
-    callbackBuffer: any;
-    callBuffer({ minTime }?: {
-        minTime?: any;
-    }): void;
-    _lastCall: number;
-    _bufferTimeout: NodeJS.Timeout;
-    callEventHandler(pageNumber: any, { callStartupEvent, preventWaitForDelay, callOnEnd, onDispatch, }?: {
-        callStartupEvent?: boolean;
-        preventWaitForDelay?: boolean;
-        callOnEnd?: boolean;
-        onDispatch?: any;
-    }): void;
-    handleInfinityMarker(): JSX.Element;
-    _startupTimeout: NodeJS.Timeout;
+import * as React from 'react';
+export type InfinityScrollerChildren =
+  | React.ReactNode
+  | ((...args: any[]) => any);
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface InfinityScrollerProps
+  extends React.HTMLProps<HTMLElement> {
+  /**
+   * The given content can be either a function or a React node, depending on your needs. A function contains several helper functions. More details down below and have a look at the examples in the demos section.
+   */
+  children?: InfinityScrollerChildren;
 }
-export class InfinityLoadButton extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<{
-        translation: any;
-        updateTranslation: (locale: any, translation: any) => void;
-        getTranslation: (props: any) => any;
-        locales: any;
-        Avatar: {};
-        AvatarGroup: {};
-        Breadcrumb: {};
-        BreadcrumbItem: {};
-        InfoCard: {};
-        Tag: {};
-        TagGroup: {};
-        Timeline: {};
-        TimelineItem: {};
-        VisuallyHidden: {};
-        Drawer: {};
-        Dialog: {};
-    }>;
-    static propTypes: {
-        element: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        pressed_element: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        icon: PropTypes.Validator<string>;
-        on_click: PropTypes.Validator<(...args: any[]) => any>;
-    };
-    static defaultProps: {
-        element: string;
-        pressed_element: any;
-        icon: string;
-    };
-    constructor(props: any);
-    constructor(props: any, context: any);
-    onClickHandler: (e: any) => void;
+export default class InfinityScroller extends React.Component<
+  InfinityScrollerProps,
+  any
+> {
+  render(): JSX.Element;
+}
+export type InfinityLoadButtonElement =
+  | Object
+  | React.ReactNode
+  | ((...args: any[]) => any)
+  | string;
+export type InfinityLoadButtonPressedElement =
+  | Object
+  | React.ReactNode
+  | ((...args: any[]) => any);
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface InfinityLoadButtonProps {
+  element?: InfinityLoadButtonElement;
+  pressed_element?: InfinityLoadButtonPressedElement;
+  icon: string;
+  on_click: (...args: any[]) => any;
+}
+export class InfinityLoadButton extends React.Component<
+  InfinityLoadButtonProps,
+  any
+> {
+  render(): JSX.Element;
 }
-import React from "react";
-import PropTypes from "prop-types";

package/components/pagination/PaginationProvider.d.ts

@@ -1,75 +1,87 @@
-export default class PaginationProvider extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<{
-        translation: any;
-        updateTranslation: (locale: any, translation: any) => void;
-        getTranslation: (props: any) => any;
-        locales: any;
-        Avatar: {};
-        AvatarGroup: {};
-        Breadcrumb: {};
-        BreadcrumbItem: {};
-        InfoCard: {};
-        Tag: {};
-        TagGroup: {};
-        Timeline: {};
-        TimelineItem: {};
-        VisuallyHidden: {};
-        Drawer: {};
-        Dialog: {};
-    }>;
-    static propTypes: {
-        startup_page: PropTypes.Requireable<string | number>;
-        current_page: PropTypes.Requireable<string | number>;
-        page_count: PropTypes.Requireable<string | number>;
-        set_content_handler: PropTypes.Requireable<(...args: any[]) => any>;
-        reset_content_handler: PropTypes.Requireable<(...args: any[]) => any>;
-        reset_pagination_handler: PropTypes.Requireable<(...args: any[]) => any>;
-        end_infinity_handler: PropTypes.Requireable<(...args: any[]) => any>;
-        rerender: PropTypes.Requireable<PropTypes.InferProps<{
-            current: PropTypes.Requireable<(...args: any[]) => any>;
-        }>>;
-        store: PropTypes.Requireable<PropTypes.InferProps<{
-            current: PropTypes.Requireable<object>;
-        }>>;
-        useMarkerOnly: PropTypes.Requireable<boolean>;
-        internalContent: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-    };
-    static defaultProps: {
-        startup_page: any;
-        current_page: any;
-        page_count: any;
-        set_content_handler: any;
-        reset_content_handler: any;
-        reset_pagination_handler: any;
-        end_infinity_handler: any;
-        rerender: any;
-        store: any;
-        useMarkerOnly: any;
-        internalContent: any;
-        children: any;
-    };
-    static getDerivedStateFromProps(props: any, state: any): any;
-    constructor(props: any);
-    rerender: ({ current: store }: {
-        current: any;
-    }) => void;
-    rerenderTimeout: NodeJS.Timeout;
-    _isMounted: boolean;
-    setContent: (newContent: any, content?: any, position?: any) => void;
-    resetContent: () => void;
-    resetContentTimeout: NodeJS.Timeout;
-    resetInfinity: (pageNumber?: any) => void;
-    startInfinity: () => void;
-    endInfinity: () => void;
-    setItems: (items: any, cb: any) => void;
-    prefillItems: (pageNumber: any, props?: {}, items?: any[]) => any[];
-    setStateHandler: (state: any, cb: any) => void;
-    callOnPageUpdate: () => void;
-    _updateStack: any;
-    updatePageContent: (pageNumber?: any) => void;
-    onPageUpdate: (fn: any) => void;
-    callOnPageUpdateTimeout: NodeJS.Timeout;
+import * as React from 'react';
+export type PaginationProviderStartupPage = string | number;
+export type PaginationProviderCurrentPage = string | number;
+export type PaginationProviderPageCount = string | number;
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface PaginationProviderRerender {
+  current?: (...args: any[]) => any;
+}
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface PaginationProviderStore {
+  current?: Object | ((...args: any[]) => any);
+}
+export type PaginationProviderInternalContent =
+  | string
+  | ((...args: any[]) => any)
+  | React.ReactNode
+  | Object
+  | any[];
+export type PaginationProviderChildren =
+  | string
+  | ((...args: any[]) => any)
+  | React.ReactNode
+  | Object
+  | any[];
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface PaginationProviderProps
+  extends React.HTMLProps<HTMLElement> {
+  /**
+   * The page shown in the very beginning. If `current_page` is set, then it may not make too much sense to set this as well.
+   */
+  startup_page?: PaginationProviderStartupPage;
+
+  /**
+   * The page shown at the moment the component renders. Defaults to `1`.
+   */
+  current_page?: PaginationProviderCurrentPage;
+
+  /**
+   * The total pages count. Defaults to `1`.
+   */
+  page_count?: PaginationProviderPageCount;
+
+  /**
+   * Callback function to get the `setContent` handler from the current pagination instance. e.g. `set_content_handler={fn => (...)}`. Use this handler to insert content during infinity mode.
+   */
+  set_content_handler?: (...args: any[]) => any;
+
+  /**
+   * Callback function to get the `resetContent` handler from the current pagination instance. e.g. `reset_content_handler={fn => (...)}`. Use this handler to reset all the content. You can set it to `true`, to programmatically reset the content.
+   */
+  reset_content_handler?: (...args: any[]) => any;
+
+  /**
+   * Callback function to get the `resetInfinity` handler from the current pagination instance. e.g. `reset_pagination_handler={fn => (...)}`. Use this handler to reset all the internal states. You can set it to `true`, to programmatically reset the states.
+   */
+  reset_pagination_handler?: (...args: any[]) => any;
+
+  /**
+   * Callback function to get the `endInfinity` handler from the current pagination instance. e.g. `end_infinity_handler={fn => (...)}`. Use this handler to end the infinity scrolling procedure, in case the `page_count` is unknown.
+   */
+  end_infinity_handler?: (...args: any[]) => any;
+  rerender?: PaginationProviderRerender;
+  store?: PaginationProviderStore;
+  useMarkerOnly?: boolean;
+  internalContent?: PaginationProviderInternalContent;
+
+  /**
+   * The given content can be either a function or a React node, depending on your needs. A function contains several helper functions. More details down below and have a look at the examples in the demos section.
+   */
+  children?: PaginationProviderChildren;
+}
+export default class PaginationProvider extends React.Component<
+  PaginationProviderProps,
+  any
+> {
+  static defaultProps: object;
+  render(): JSX.Element;
 }
-import React from "react";
-import PropTypes from "prop-types";

package/components/progress-indicator/ProgressIndicator.d.ts

@@ -1,76 +1,146 @@
-export default class ProgressIndicator extends React.PureComponent<any, any, any> {
-    static tagName: string;
-    static contextType: React.Context<{
-        translation: any;
-        updateTranslation: (locale: any, translation: any) => void;
-        getTranslation: (props: any) => any;
-        locales: any;
-        Avatar: {};
-        AvatarGroup: {};
-        Breadcrumb: {};
-        BreadcrumbItem: {};
-        InfoCard: {};
-        Tag: {};
-        TagGroup: {};
-        Timeline: {};
-        TimelineItem: {};
-        VisuallyHidden: {};
-        Drawer: {};
-        Dialog: {};
-    }>;
-    static propTypes: {
-        class: PropTypes.Requireable<string>;
-        className: PropTypes.Requireable<string>;
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        on_complete: PropTypes.Requireable<(...args: any[]) => any>;
-        space: PropTypes.Requireable<string | number | boolean | PropTypes.InferProps<{
-            top: PropTypes.Requireable<string | number | boolean>;
-            right: PropTypes.Requireable<string | number | boolean>;
-            bottom: PropTypes.Requireable<string | number | boolean>;
-            left: PropTypes.Requireable<string | number | boolean>;
-        }>>;
-        top: PropTypes.Requireable<string | number | boolean>;
-        right: PropTypes.Requireable<string | number | boolean>;
-        bottom: PropTypes.Requireable<string | number | boolean>;
-        left: PropTypes.Requireable<string | number | boolean>;
-        visible: PropTypes.Requireable<string | boolean>;
-        type: PropTypes.Requireable<string>;
-        no_animation: PropTypes.Requireable<string | boolean>;
-        size: PropTypes.Requireable<string>;
-        progress: PropTypes.Requireable<string | number>;
-        label: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        label_direction: PropTypes.Requireable<string>;
-        show_label: PropTypes.Requireable<string | boolean>;
-        indicator_label: PropTypes.Requireable<string>;
-        section_style: PropTypes.Requireable<string>;
-        section_spacing: PropTypes.Requireable<string>;
-        title: PropTypes.Requireable<string>;
+import * as React from 'react';
+export type ProgressIndicatorVisible = string | boolean;
+export type ProgressIndicatorType = 'circular' | 'linear';
+export type ProgressIndicatorNoAnimation = string | boolean;
+export type ProgressIndicatorSize =
+  | 'default'
+  | 'small'
+  | 'medium'
+  | 'large'
+  | 'huge';
+export type ProgressIndicatorProgress = string | number;
+export type ProgressIndicatorShowLabel = string | boolean;
+export type ProgressIndicatorSpace =
+  | string
+  | number
+  | boolean
+  | {
+      /**
+       * Use spacing values like: `small`, `1rem`, `1` or , `16px`. Will use `margin-top`.
+       */
+      top?: string | number | boolean;
+
+      /**
+       * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-right`.
+       */
+      right?: string | number | boolean;
+
+      /**
+       * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-bottom`.
+       */
+      bottom?: string | number | boolean;
+
+      /**
+       * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-left`.
+       */
+      left?: string | number | boolean;
     };
-    static defaultProps: {
-        visible: boolean;
-        type: string;
-        no_animation: boolean;
-        size: string;
-        progress: any;
-        label: any;
-        label_direction: string;
-        show_label: boolean;
-        indicator_label: any;
-        section_style: any;
-        section_spacing: any;
-        title: any;
-        class: any;
-        className: any;
-        children: any;
-        on_complete: any;
-    };
-    static enableWebComponent(): void;
-    static getDerivedStateFromProps(props: any, state: any): any;
-    constructor(props: any);
-    constructor(props: any, context: any);
-    callOnCompleteHandler: () => void;
-    completeTimeout: NodeJS.Timeout;
-    fadeOutTimeout: NodeJS.Timeout;
+export type ProgressIndicatorTop = string | number | boolean;
+export type ProgressIndicatorRight = string | number | boolean;
+export type ProgressIndicatorBottom = string | number | boolean;
+export type ProgressIndicatorLeft = string | number | boolean;
+export type ProgressIndicatorChildren =
+  | React.ReactNode
+  | ((...args: any[]) => any);
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface ProgressIndicatorProps
+  extends React.HTMLProps<HTMLElement> {
+  /**
+   * Defines the visibility of the progress. Toggling the `visible` property to false will force a fade-out animation. Defaults to `true`.
+   */
+  visible?: ProgressIndicatorVisible;
+
+  /**
+   * Defines the "type" of progress, like `circular` or `linear`. Defaults to `circular`.
+   */
+  type?: ProgressIndicatorType;
+
+  /**
+   * Disables the fade-in and fade-out animation. Defaults to false.
+   */
+  no_animation?: ProgressIndicatorNoAnimation;
+
+  /**
+   * Defines the size, like `large` or `medium`. Defaults to `medium`.
+   */
+  size?: ProgressIndicatorSize;
+
+  /**
+   * To visualize a static "percentage" (0-100) as a progress state. Defaults to `null`.
+   */
+  progress?: ProgressIndicatorProgress;
+
+  /**
+   * Show a custom label to the right or under the indicator.
+   */
+  label?: React.ReactNode;
+
+  /**
+   * Set it to `vertical` if you want the label to be placed under the indicator. Defaults to `horizontal`.
+   */
+  label_direction?: string;
+
+  /**
+   * If set to `true` a default label will be shown.
+   */
+  show_label?: ProgressIndicatorShowLabel;
+  indicator_label?: string;
+
+  /**
+   * To enable the visual helper `.dnb-section` class. Use a supported modifier from the <a href="/uilib/components/section/properties">Section component</a>. Defaults to null.
+   */
+  section_style?: string;
+
+  /**
+   * To modify the `spacing`. Use a supported modifier from the <a href="/uilib/components/section/properties">Section component</a>. Defaults to null.
+   */
+  section_spacing?: string;
+
+  /**
+   * Used to set title and aria-label. Defaults to the value of progress property, formatted as a percent.
+   */
+  title?: string;
+
+  /**
+   * Has to be an object with either: `top`, `right`, `bottom` or `left`. Use spacing values like: `small`, `1rem`, `1` or , `16px`.
+   */
+  space?: ProgressIndicatorSpace;
+
+  /**
+   * Use spacing values like: `small`, `1rem`, `1` or , `16px`. Will use `margin-top`.
+   */
+  top?: ProgressIndicatorTop;
+
+  /**
+   * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-right`.
+   */
+  right?: ProgressIndicatorRight;
+
+  /**
+   * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-bottom`.
+   */
+  bottom?: ProgressIndicatorBottom;
+
+  /**
+   * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-left`.
+   */
+  left?: ProgressIndicatorLeft;
+  class?: string;
+  className?: string;
+  children?: ProgressIndicatorChildren;
+
+  /**
+   * Will be called once the `min_time` has timed out.
+   */
+  on_complete?: (...args: any[]) => any;
+}
+export default class ProgressIndicator extends React.Component<
+  ProgressIndicatorProps,
+  any
+> {
+  static defaultProps: object;
+  render(): JSX.Element;
 }
-import React from "react";
-import PropTypes from "prop-types";