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

package/CHANGELOG.md

@@ -3,6 +3,13 @@
 All notable changes to @dnb/eufemia will be documented in this file. See
 [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [9.23.0-beta.2](https://github.com/dnbexperience/eufemia/compare/v9.23.0-beta.1...v9.23.0-beta.2) (2022-02-16)
+
+
+### Bug Fixes
+
+* ensure auto type generation dont gets overwritten by tsc afterwards ([b94a786](https://github.com/dnbexperience/eufemia/commit/b94a786572275489ba9e5b1f864d14a9f52a9022))
+
 # [9.23.0-beta.1](https://github.com/dnbexperience/eufemia/compare/v9.22.0...v9.23.0-beta.1) (2022-02-16)
 
 

package/cjs/shared/Eufemia.js

@@ -21,7 +21,7 @@ function init() {
       _createClass(Eufemia, [{
         key: "version",
         get: function get() {
-          return '9.23.0-beta.1';
+          return '9.23.0-beta.2';
         }
       }]);
 

package/components/accordion/Accordion.d.ts

@@ -1,137 +1,231 @@
-declare class Accordion extends React.PureComponent<any, any, any> {
-    static tagName: string;
-    static contextType: React.Context<{}>;
-    static Provider: typeof AccordionProvider;
-    static Header: typeof AccordionHeader;
-    static Content: typeof AccordionContent;
-    static propTypes: {
-        custom_element: PropTypes.Requireable<object>;
-        custom_method: PropTypes.Requireable<(...args: any[]) => any>;
-        on_change: PropTypes.Requireable<(...args: any[]) => any>;
-        on_state_update: 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>;
-        title: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        expanded: PropTypes.Requireable<string | boolean>;
-        no_animation: PropTypes.Requireable<string | boolean>;
-        expanded_ssr: PropTypes.Requireable<string | boolean>;
-        prerender: PropTypes.Requireable<string | boolean>;
-        prevent_rerender: PropTypes.Requireable<string | boolean>;
-        prevent_rerender_conditional: PropTypes.Requireable<string | boolean>;
-        remember_state: PropTypes.Requireable<string | boolean>;
-        flush_remembered_state: PropTypes.Requireable<string | boolean>;
-        single_container: PropTypes.Requireable<string | boolean>;
-        variant: PropTypes.Requireable<string>;
-        left_component: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        allow_close_all: PropTypes.Requireable<string | boolean>;
-        disabled: PropTypes.Requireable<string | boolean>;
-        skeleton: PropTypes.Requireable<string | boolean>;
-        id: PropTypes.Requireable<string>;
-        group: PropTypes.Requireable<string>;
-        element: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        heading: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        heading_level: PropTypes.Requireable<string | number>;
-        icon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        icon_position: PropTypes.Requireable<string>;
-        icon_size: PropTypes.Requireable<string>;
-        attributes: PropTypes.Requireable<string | object>;
-        class: PropTypes.Requireable<string>;
-        className: PropTypes.Requireable<string>;
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+import * as React from 'react';
+import AccordionContent from './AccordionContent';
+import AccordionHeader from './AccordionHeader';
+import AccordionProvider from './AccordionProvider';
+export type AccordionExpanded = string | boolean;
+export type AccordionNoAnimation = string | boolean;
+export type AccordionExpandedSsr = string | boolean;
+export type AccordionPrerender = string | boolean;
+export type AccordionPreventRerender = string | boolean;
+export type AccordionPreventRerenderConditional = string | boolean;
+export type AccordionRememberState = string | boolean;
+export type AccordionFlushRememberedState = string | boolean;
+export type AccordionSingleContainer = string | boolean;
+export type AccordionVariant = 'default' | 'outlined' | 'filled';
+export type AccordionAllowCloseAll = string | boolean;
+export type AccordionDisabled = string | boolean;
+export type AccordionSkeleton = string | boolean;
+export type AccordionHeading = boolean | React.ReactNode;
+export type AccordionHeadingLevel = string | number;
+export type AccordionIconPosition = 'left' | 'right';
+export type AccordionAttributes = string | Object;
+export type AccordionSpace =
+  | 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: {
-        title: any;
-        expanded: any;
-        no_animation: any;
-        expanded_ssr: any;
-        prerender: any;
-        prevent_rerender: any;
-        prevent_rerender_conditional: any;
-        remember_state: any;
-        flush_remembered_state: any;
-        single_container: any;
-        variant: string;
-        left_component: any;
-        allow_close_all: any;
-        disabled: any;
-        skeleton: any;
-        id: any;
-        group: any;
-        element: any;
-        heading: any;
-        heading_level: any;
-        icon: any;
-        icon_position: any;
-        icon_size: string;
-        attributes: any;
-        class: any;
-        className: any;
-        children: any;
-        custom_element: any;
-        custom_method: any;
-        on_change: any;
-        on_state_update: any;
-    };
-    static enableWebComponent(): void;
-    static getDerivedStateFromProps(props: any, state: any): any;
-    constructor(props: any, context: any);
-    _id: any;
-    store: Store;
-    _isMounted: boolean;
-    setExpandedState(expanded: any): void;
-    close(): void;
-    changeOpened(expanded: any): void;
-    handleDisabledClick: (e: any) => boolean;
-    callOnChangeHandler: (...params: any[]) => void;
-    callOnChange: ({ expanded, event }: {
-        expanded: any;
-        event: any;
-    }) => void;
+export type AccordionTop = string | number | boolean;
+export type AccordionRight = string | number | boolean;
+export type AccordionBottom = string | number | boolean;
+export type AccordionLeft = string | number | boolean;
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface AccordionProps extends React.HTMLProps<HTMLElement> {
+  /**
+   * A title as a string or React element. It will be used as the button text.
+   */
+  title?: React.ReactNode;
+
+  /**
+   * If set to `true` the accordion will be expanded as its initial state.
+   */
+  expanded?: AccordionExpanded;
+
+  /**
+   * If set to `true`, the open and close animation will be omitted.
+   */
+  no_animation?: AccordionNoAnimation;
+
+  /**
+   * If set to `true` the accordion will be expanded during SSR. Can be potentially useful for SEO, although it will disturb client hydration, where React expects the same state. But that&#39;s mainly a technical aspect to consider.
+   */
+  expanded_ssr?: AccordionExpandedSsr;
+
+  /**
+   * If set to `true` the content will be present, even the accordion is not expanded. Can be useful for assistive technology or SEO.
+   */
+  prerender?: AccordionPrerender;
+
+  /**
+   * If set to `true` the accordion component will not re-render its content – can be useful for widgets you don&#39;t have control of storing the temporary state during an interaction.
+   */
+  prevent_rerender?: AccordionPreventRerender;
+
+  /**
+   * Use this prop together with `prevent_rerender` – and if it is to `true`, the accordion component will re-render if the children are a new React element and does not match anymore the previews one.
+   */
+  prevent_rerender_conditional?: AccordionPreventRerenderConditional;
+
+  /**
+   * If set to `true`, it will remember a changed state initiated by the user. It requires a unique `id`. It will store the sate in the local storage.
+   */
+  remember_state?: AccordionRememberState;
+
+  /**
+   * If set to `true`, the saved (remembered) will be removed and the initial component state will be used and set.
+   */
+  flush_remembered_state?: AccordionFlushRememberedState;
+
+  /**
+   * If set to `true`, a group of accordions will be wrapped to sidebar looking menu for medium and larger screens.
+   */
+  single_container?: AccordionSingleContainer;
+
+  /**
+   * Defines the used styling. As of now, only `outlined` is available. It defaults to `outlined`.
+   */
+  variant?: AccordionVariant;
+
+  /**
+   * Will add a React element on the left side of the `title`, inside `AccordionHeaderContainer`.
+   */
+  left_component?: React.ReactNode;
+  allow_close_all?: AccordionAllowCloseAll;
+
+  /**
+   * If set to `true`, the accordion button will be disabled (dimmed).
+   */
+  disabled?: AccordionDisabled;
+
+  /**
+   * If set to `true`, an overlaying skeleton with animation will be shown.
+   */
+  skeleton?: AccordionSkeleton;
+
+  /**
+   * A unique `id` that will be used on the button element. If you use `remember_state`, an id is required.
+   */
+  id?: string;
+  group?: string;
+
+  /**
+   * Gives you the option to replace the used `button` element. Provide a React element, including a string (HTML element). Defaults to a `div` with all the needed accessibility features included.
+   */
+  element?: React.ReactNode;
+
+  /**
+   * If set to `true`, level 2 (h2) will be used. You can provide your own HTML heading (`h3`), or provide a `heading_level` property.
+   */
+  heading?: AccordionHeading;
+
+  /**
+   * If `heading` is set to `true`, you can provide a numeric value to define a different heading level. Defaults to `2`.
+   */
+  heading_level?: AccordionHeadingLevel;
+
+  /**
+   * Will replace the `chevron` icon. The icon will still rotate (by CSS).
+   */
+  icon?: React.ReactNode;
+
+  /**
+   * Will set the placement of the icon. Defaults to `left`.
+   */
+  icon_position?: AccordionIconPosition;
+
+  /**
+   * Define a different icon size. Defaults to `medium` (1.5rem).
+   */
+  icon_size?: string;
+  attributes?: AccordionAttributes;
+  class?: string;
+  className?: string;
+  children?: React.ReactNode;
+
+  /**
+   * Has to be an object with either: `top`, `right`, `bottom` or `left`. Use spacing values like: `small`, `1rem`, `1` or , `16px`.
+   */
+  space?: AccordionSpace;
+
+  /**
+   * Use spacing values like: `small`, `1rem`, `1` or , `16px`. Will use `margin-top`.
+   */
+  top?: AccordionTop;
+
+  /**
+   * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-right`.
+   */
+  right?: AccordionRight;
+
+  /**
+   * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-bottom`.
+   */
+  bottom?: AccordionBottom;
+
+  /**
+   * Use spacing values like: `small`, `1rem`, `1` or , `16px`. will use `margin-left`.
+   */
+  left?: AccordionLeft;
+  custom_element?: Object;
+  custom_method?: (...args: any[]) => any;
+
+  /**
+   * Will be called by user click interaction. Returns an object with a boolean state `expanded` inside `{ expanded, id, event, ...event }`.
+   */
+  on_change?: (...args: any[]) => any;
+  on_state_update?: (...args: any[]) => any;
 }
-declare namespace Accordion {
-    export { Group };
-    export function Store(id: any): Store;
+export default class Accordion extends React.Component<
+  AccordionProps,
+  any
+> {
+  static defaultProps: object;
+  static Content = AccordionContent;
+  static Header = AccordionHeader;
+  static Provider = AccordionProvider;
+  render(): JSX.Element;
 }
-export default Accordion;
-import React from "react";
-declare class Store {
-    constructor({ id, group }: {
-        id: any;
-        group: any;
-    });
-    id: any;
-    group: any;
-    storeId(id?: any): string;
-    saveState(expanded: any, id?: any, opts?: {}): void;
-    getData(id?: any): any;
-    getState(id?: any): boolean;
-    flush(id?: any): void;
+export type GroupRememberState = string | boolean;
+
+/**
+ * NB: Do not change the docs (comments) in here. The docs are updated during build time by "generateTypes.js" and "fetchPropertiesFromDocs.js".
+ */
+export interface GroupProps {
+  /**
+   * A unique `id` that will be used on the button element. If you use `remember_state`, an id is required.
+   */
+  id?: string;
+  group?: string;
+
+  /**
+   * If set to `true`, it will remember a changed state initiated by the user. It requires a unique `id`. It will store the sate in the local storage.
+   */
+  remember_state?: GroupRememberState;
 }
-import AccordionProvider from "./AccordionProvider";
-import AccordionHeader from "./AccordionHeader";
-import AccordionContent from "./AccordionContent";
-import PropTypes from "prop-types";
-declare class Group extends React.PureComponent<any, any, any> {
-    static propTypes: {
-        id: PropTypes.Requireable<string>;
-        group: PropTypes.Requireable<string>;
-        remember_state: PropTypes.Requireable<string | boolean>;
-    };
-    static defaultProps: {
-        id: any;
-        group: any;
-        remember_state: any;
-    };
-    constructor(props: any);
-    store: Store;
-    _IDs: any[];
-    onInit: (instance: any) => void;
+
+declare class Group extends React.Component<GroupProps, any> {
+  static defaultProps: object;
+  render(): JSX.Element;
 }

package/components/accordion/AccordionContent.d.ts

@@ -1,33 +1,40 @@
-export default class AccordionContent extends React.PureComponent<any, any, any> {
-    static contextType: React.Context<{}>;
-    static propTypes: {
-        className: PropTypes.Requireable<string>;
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        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>;
-        instance: PropTypes.Requireable<object>;
+import * as React from 'react';
+export type AccordionContentSpace =
+  | string
+  | number
+  | boolean
+  | {
+      top?: string | number | boolean;
+      right?: string | number | boolean;
+      bottom?: string | number | boolean;
+      left?: string | number | boolean;
     };
-    static defaultProps: {
-        instance: any;
-        className: any;
-        children: any;
-    };
-    static getContent(props: any): any;
-    constructor(props: any, context: any);
-    _ref: React.RefObject<any>;
-    anim: AnimateHeight;
-    setContainerHeight(): void;
-    renderContent(): any;
-    _cache: any;
+export type AccordionContentTop = string | number | boolean;
+export type AccordionContentRight = string | number | boolean;
+export type AccordionContentBottom = string | number | boolean;
+export type AccordionContentLeft = string | number | boolean;
+export type AccordionContentChildren =
+  | 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 AccordionContentProps
+  extends React.HTMLProps<HTMLElement> {
+  instance?: Object;
+  space?: AccordionContentSpace;
+  top?: AccordionContentTop;
+  right?: AccordionContentRight;
+  bottom?: AccordionContentBottom;
+  left?: AccordionContentLeft;
+  className?: string;
+  children?: AccordionContentChildren;
+}
+export default class AccordionContent extends React.Component<
+  AccordionContentProps,
+  any
+> {
+  static defaultProps: object;
+  render(): JSX.Element;
 }
-import React from "react";
-import AnimateHeight from "../../shared/AnimateHeight";
-import PropTypes from "prop-types";