@norges-domstoler/dds-components 4.0.2 → 4.1.0

package/dist/cjs/components/Select/Select.tokens.d.ts

@@ -0,0 +1,144 @@
+import { CSSObject } from 'styled-components';
+import { Property } from 'csstype';
+export declare const multiValueContainerMinHeight: string;
+export declare const selectTokens: {
+    container: {
+        base: CSSObject;
+        defaultWidth: Property.Width<string>;
+        hover: {
+            base: CSSObject;
+        };
+        focus: {
+            base: CSSObject;
+        };
+        danger: {
+            base: CSSObject;
+            hover: {
+                base: CSSObject;
+            };
+            focus: {
+                base: CSSObject;
+            };
+        };
+        disabled: {
+            base: CSSObject;
+        };
+        readOnly: {
+            base: CSSObject;
+        };
+    };
+    label: {
+        base: CSSObject;
+        hover: {
+            base: CSSObject;
+        };
+        focus: {
+            base: CSSObject;
+        };
+    };
+    input: {
+        base: CSSObject;
+        noLabel: {
+            base: CSSObject;
+        };
+        isMulti: {
+            noLabel: {
+                base: CSSObject;
+            };
+        };
+    };
+    placeholder: {
+        base: CSSObject;
+    };
+    menu: {
+        base: CSSObject;
+        spaceTop: number;
+    };
+    option: {
+        base: CSSObject;
+        hover: {
+            base: CSSObject;
+        };
+        selected: {
+            base: CSSObject;
+            icon: {
+                margin: string;
+            };
+        };
+    };
+    valueContainer: {
+        withLabel: {
+            base: CSSObject;
+        };
+        noLabel: {
+            base: CSSObject;
+        };
+        isMulti: {
+            base: CSSObject;
+            withLabel: {
+                base: CSSObject;
+            };
+            noLabel: {
+                base: CSSObject;
+            };
+        };
+    };
+    multiValue: {
+        base: CSSObject;
+        enabled: {
+            base: CSSObject;
+        };
+        disabled: {
+            base: CSSObject;
+        };
+    };
+    multiValueLabel: {
+        base: CSSObject;
+    };
+    multiValueRemove: {
+        base: CSSObject;
+        hover: {
+            base: CSSObject;
+        };
+        icon: {
+            base: CSSObject;
+        };
+    };
+    indicatorsContainer: {
+        withLabel: {
+            base: CSSObject;
+        };
+        noLabel: {
+            base: CSSObject;
+        };
+        isMulti: {
+            withLabel: {
+                base: CSSObject;
+            };
+            noLabel: {
+                base: CSSObject;
+            };
+        };
+    };
+    dropdownIndicator: {
+        base: CSSObject;
+        hover: {
+            base: CSSObject;
+        };
+        readOnly: {
+            base: CSSObject;
+        };
+    };
+    noOptionsMessage: {
+        base: CSSObject;
+    };
+    clearIndicator: {
+        base: CSSObject;
+        hover: {
+            base: CSSObject;
+        };
+    };
+    loadingIndicator: {
+        base: CSSObject;
+    };
+};

package/dist/cjs/components/Select/index.d.ts

@@ -0,0 +1 @@
+export * from './Select';

package/dist/cjs/components/SkipToContent/SkipToContent.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { Property } from 'csstype';
+import { BaseComponentProps } from '../../types';
+export declare type SkipToContentProps = BaseComponentProps<HTMLAnchorElement, {
+    /** Teksten som vises i lenka. */
+    text?: string;
+    /**Spesifiserer hvor det skal hoppes til via `id`-attributtet til innholdet. */
+    href: string;
+    /**Avstand fra top i nærmeste posisjonert container. */
+    top?: Property.Top<string | number>;
+}>;
+export declare const SkipToContent: import("react").ForwardRefExoticComponent<{
+    htmlProps?: import("react").HTMLAttributes<HTMLAnchorElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLAnchorElement>, "className" | "id"> & {
+    /** Teksten som vises i lenka. */
+    text?: string | undefined;
+    /**Spesifiserer hvor det skal hoppes til via `id`-attributtet til innholdet. */
+    href: string;
+    /**Avstand fra top i nærmeste posisjonert container. */
+    top?: Property.Top<string | number> | undefined;
+} & import("react").RefAttributes<HTMLAnchorElement>>;

package/dist/cjs/components/SkipToContent/SkipToContent.stories.d.ts

@@ -0,0 +1,33 @@
+/// <reference types="react" />
+import { SkipToContentProps } from '.';
+declare const _default: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<{
+        htmlProps?: import("react").HTMLAttributes<HTMLAnchorElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLAnchorElement>, "id" | "className"> & {
+        text?: string | undefined;
+        href: string;
+        top?: import("csstype").Property.Top<string | number> | undefined;
+    } & import("react").RefAttributes<HTMLAnchorElement>>;
+    argTypes: {
+        text: {
+            control: {
+                type: string;
+            };
+        };
+        top: {
+            control: {
+                type: string;
+            };
+        };
+    };
+    parameters: {
+        controls: {
+            exclude: string[];
+        };
+    };
+};
+export default _default;
+export declare const Overview: () => JSX.Element;
+export declare const Default: (args: SkipToContentProps) => JSX.Element;
+export declare const Example: (args: SkipToContentProps) => JSX.Element;

package/dist/cjs/components/SkipToContent/SkipToContent.tokens.d.ts

@@ -0,0 +1,19 @@
+import { CSSObject } from 'styled-components';
+export declare const skipToContentTokens: {
+    link: {
+        base: CSSObject;
+        hover: {
+            base: CSSObject;
+        };
+        focus: {
+            base: CSSObject;
+        };
+        focusOutline: {
+            color: string;
+            width: string;
+        };
+    };
+    wrapper: {
+        base: CSSObject;
+    };
+};

package/dist/cjs/components/SkipToContent/index.d.ts

@@ -0,0 +1 @@
+export * from './SkipToContent';

package/dist/cjs/components/Spinner/Spinner.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { Property } from 'csstype';
+import { TextColor } from '../Typography';
+import { BaseComponentProps } from '../../types';
+export declare type SpinnerProps = BaseComponentProps<SVGElement, {
+    /**Farge på spinneren. */
+    color?: TextColor | string;
+    /**Størrelse; Setter høyde og bredde på spinneren. */
+    size?: Property.Width<string>;
+}>;
+export declare function Spinner(props: SpinnerProps): JSX.Element;

package/dist/cjs/components/Spinner/Spinner.stories.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { Spinner, SpinnerProps } from '.';
+declare const _default: {
+    title: string;
+    component: typeof Spinner;
+    argTypes: {
+        color: {
+            control: {
+                type: string;
+            };
+        };
+        size: {
+            control: {
+                type: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Overview: () => JSX.Element;
+export declare const Default: (args: SpinnerProps) => JSX.Element;

package/dist/cjs/components/Spinner/Spinner.tokens.d.ts

@@ -0,0 +1,6 @@
+import { CSSObject } from 'styled-components';
+export declare const spinnerTokens: {
+    circle: {
+        base: CSSObject;
+    };
+};

package/dist/cjs/components/Spinner/index.d.ts

@@ -0,0 +1 @@
+export * from './Spinner';

package/dist/cjs/components/Table/Body.d.ts

@@ -0,0 +1,3 @@
+import { HTMLAttributes } from 'react';
+export declare type BodyProps = HTMLAttributes<HTMLTableSectionElement>;
+export declare const Body: import("react").ForwardRefExoticComponent<BodyProps & import("react").RefAttributes<HTMLTableSectionElement>>;

package/dist/cjs/components/Table/Cell.d.ts

@@ -0,0 +1,10 @@
+import { ThHTMLAttributes, TdHTMLAttributes } from 'react';
+export declare type TableCellType = 'data' | 'head';
+export declare type TableCellLayout = 'left' | 'right' | 'center' | 'text and icon';
+export declare type TableCellProps = {
+    /**Type celle. Returnerer enten `<td>` eller `<th>`. */
+    type?: TableCellType;
+    /**Layout av innholdet i cellen. 'tekst and icon' legger margin mellom første barnet og andre barnet i cellen, og skal hovedsakelig brukes når innholdet er tekst og ikon; tekst må bli wrappet i `<span>` hvis det er det første barnet.  */
+    layout?: TableCellLayout;
+} & (TdHTMLAttributes<HTMLTableCellElement> | ThHTMLAttributes<HTMLTableCellElement>);
+export declare const Cell: import("react").ForwardRefExoticComponent<TableCellProps & import("react").RefAttributes<HTMLTableCellElement>>;

package/dist/cjs/components/Table/Cell.tokens.d.ts

@@ -0,0 +1,31 @@
+import { CSSObject } from 'styled-components';
+export declare const cellTokens: {
+    base: CSSObject;
+    density: {
+        normal: {
+            base: CSSObject;
+        };
+        compact: {
+            base: CSSObject;
+        };
+    };
+    head: {
+        base: CSSObject;
+        sortCell: {
+            icon: {
+                base: CSSObject;
+            };
+            focus: {
+                base: CSSObject;
+            };
+        };
+    };
+    data: {
+        base: CSSObject;
+        layout: {
+            textAndIcon: {
+                base: CSSObject;
+            };
+        };
+    };
+};

package/dist/cjs/components/Table/Foot.d.ts

@@ -0,0 +1,3 @@
+import { HTMLAttributes } from 'react';
+export declare type FootProps = HTMLAttributes<HTMLTableSectionElement>;
+export declare const Foot: import("react").ForwardRefExoticComponent<FootProps & import("react").RefAttributes<HTMLTableSectionElement>>;

package/dist/cjs/components/Table/Head.d.ts

@@ -0,0 +1,3 @@
+import { HTMLAttributes } from 'react';
+export declare type HeadProps = HTMLAttributes<HTMLTableSectionElement>;
+export declare const Head: import("react").ForwardRefExoticComponent<HeadProps & import("react").RefAttributes<HTMLTableSectionElement>>;

package/dist/cjs/components/Table/Row.d.ts

@@ -0,0 +1,23 @@
+import { HTMLAttributes } from 'react';
+export declare type TableRowType = 'body' | 'head';
+export declare type RowMode = 'normal' | 'sum';
+export declare type TableRowProps = {
+    /**Spesifiserer om raden skal brukes i `<head>` eller `<body>`-seksjonen. */
+    type?: TableRowType;
+    /**Custom modus for rader som har ytterligere semantisk betydning (f.eks. summeringsrad), definerer kun styling. Ved bruk av sum må `<Cell>` med tall i høyrestilles vha layout prop.  */
+    mode?: RowMode;
+    /**Spesifiserer om raden har blitt valgt/markert. */
+    selected?: boolean;
+    /**Spesifiserer om raden skal ha hover styling. Brukes hovedsakelig på klikkbare rader. */
+    hoverable?: boolean;
+} & HTMLAttributes<HTMLTableRowElement>;
+export declare const Row: import("react").ForwardRefExoticComponent<{
+    /**Spesifiserer om raden skal brukes i `<head>` eller `<body>`-seksjonen. */
+    type?: TableRowType | undefined;
+    /**Custom modus for rader som har ytterligere semantisk betydning (f.eks. summeringsrad), definerer kun styling. Ved bruk av sum må `<Cell>` med tall i høyrestilles vha layout prop.  */
+    mode?: RowMode | undefined;
+    /**Spesifiserer om raden har blitt valgt/markert. */
+    selected?: boolean | undefined;
+    /**Spesifiserer om raden skal ha hover styling. Brukes hovedsakelig på klikkbare rader. */
+    hoverable?: boolean | undefined;
+} & HTMLAttributes<HTMLTableRowElement> & import("react").RefAttributes<HTMLTableRowElement>>;

package/dist/cjs/components/Table/Row.tokens.d.ts

@@ -0,0 +1,32 @@
+import { CSSObject } from 'styled-components';
+export declare const rowTokens: {
+    head: {
+        base: CSSObject;
+    };
+    body: {
+        base: CSSObject;
+        odd: {
+            base: CSSObject;
+        };
+        even: {
+            base: CSSObject;
+        };
+        selected: {
+            base: CSSObject;
+        };
+        hover: {
+            base: CSSObject;
+        };
+        focus: {
+            base: CSSObject;
+        };
+        mode: {
+            sum: {
+                base: CSSObject;
+            };
+            normal: {
+                base: {};
+            };
+        };
+    };
+};

package/dist/cjs/components/Table/SortCell.d.ts

@@ -0,0 +1,19 @@
+import { MouseEvent } from 'react';
+import { TableCellProps } from './Cell';
+export declare type SortOrder = 'ascending' | 'descending';
+export declare type SortCellProps = {
+    /**Spesifiserer om kolonnen er sortert. */
+    isSorted?: boolean;
+    /**Sorteringsrekkefølge i kolonnen. Avgjør hvilket ikon skal vises i cellen. */
+    sortOrder?: SortOrder;
+    /**onClick-funksjon for sortering og annen logikk. */
+    onClick: (event: MouseEvent<HTMLButtonElement>) => void;
+} & Omit<TableCellProps, 'type'>;
+export declare const SortCell: import("react").ForwardRefExoticComponent<{
+    /**Spesifiserer om kolonnen er sortert. */
+    isSorted?: boolean | undefined;
+    /**Sorteringsrekkefølge i kolonnen. Avgjør hvilket ikon skal vises i cellen. */
+    sortOrder?: SortOrder | undefined;
+    /**onClick-funksjon for sortering og annen logikk. */
+    onClick: (event: MouseEvent<HTMLButtonElement>) => void;
+} & Omit<TableCellProps, "type"> & import("react").RefAttributes<HTMLTableCellElement>>;

package/dist/cjs/components/Table/Table.d.ts

@@ -0,0 +1,14 @@
+import { HTMLAttributes } from 'react';
+export declare type TableDensity = 'normal' | 'compact';
+export declare type TableProps = {
+    /**Spesifiserer hvor romslige cellene i tabellen skal være. */
+    density?: TableDensity;
+    /**Spesifiserer om cellene i `<Head>` skal bli sticky ved scrolling. */
+    stickyHeader?: boolean;
+} & HTMLAttributes<HTMLTableElement>;
+export declare const Table: import("react").ForwardRefExoticComponent<{
+    /**Spesifiserer hvor romslige cellene i tabellen skal være. */
+    density?: TableDensity | undefined;
+    /**Spesifiserer om cellene i `<Head>` skal bli sticky ved scrolling. */
+    stickyHeader?: boolean | undefined;
+} & HTMLAttributes<HTMLTableElement> & import("react").RefAttributes<HTMLTableElement>>;

package/dist/cjs/components/Table/Table.stories.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+import { TableProps } from '.';
+declare const _default: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<{
+        density?: import("./Table").TableDensity | undefined;
+        stickyHeader?: boolean | undefined;
+    } & import("react").HTMLAttributes<HTMLTableElement> & import("react").RefAttributes<HTMLTableElement>>;
+    argTypes: {
+        stickyHeader: {
+            control: {
+                type: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Default: (args: TableProps) => JSX.Element;
+export declare const Focusable: (args: TableProps) => JSX.Element;
+export declare const Compact: (args: TableProps) => JSX.Element;
+export declare const StickyHeader: (args: TableProps) => JSX.Element;
+export declare const Hoverable: (args: TableProps) => JSX.Element;
+export declare const WithButtonAndIcons: (args: TableProps) => JSX.Element;
+export declare const WithSum: (args: TableProps) => JSX.Element;
+export declare const WithCheckbox: (args: TableProps) => JSX.Element;
+export declare const Complex: (args: TableProps) => JSX.Element;
+export declare const Sortable: (args: TableProps) => JSX.Element;
+export declare const ColumnAndRowHeaders: (args: TableProps) => JSX.Element;

package/dist/cjs/components/Table/TableWrapper.d.ts

@@ -0,0 +1,3 @@
+import { HTMLAttributes } from 'react';
+export declare type TableWrapperProps = HTMLAttributes<HTMLDivElement>;
+export declare const TableWrapper: ({ children, ...rest }: TableWrapperProps) => JSX.Element;

package/dist/cjs/components/Table/index.d.ts

@@ -0,0 +1,8 @@
+export * from './Table';
+export * from './Body';
+export * from './Head';
+export * from './Row';
+export * from './Cell';
+export * from './SortCell';
+export * from './Foot';
+export * from './TableWrapper';

package/dist/cjs/components/Table/tableData.d.ts

@@ -0,0 +1,17 @@
+import { SortOrder } from './SortCell';
+export declare type HeaderCellToSort = {
+    name: string;
+    dataName: string;
+    sortOrder?: SortOrder | 'none';
+    isSorted?: boolean;
+};
+export declare const headerCells: HeaderCellToSort[];
+export declare type CellDataToSort = {
+    name: string;
+    fnumber: string;
+    employer: string;
+    orgnumber: string;
+    percentage: string;
+};
+export declare const data: CellDataToSort[];
+export declare const mapCellContents: (data: CellDataToSort[], headerCells: HeaderCellToSort[]) => string[][];

package/dist/cjs/components/Tabs/Tab.d.ts

@@ -0,0 +1,37 @@
+import { SvgIconTypeMap } from '@mui/material';
+import { OverridableComponent } from '@mui/material/OverridableComponent';
+import { ButtonHTMLAttributes, Dispatch, SetStateAction } from 'react';
+import { BaseComponentPropsWithChildren } from '../../types';
+import { Property } from 'csstype';
+export declare type TabProps = BaseComponentPropsWithChildren<HTMLButtonElement, {
+    /**Spesifiserer om fanen er aktiv. */
+    active?: boolean;
+    /** Ikon. */
+    Icon?: OverridableComponent<SvgIconTypeMap<Record<string, unknown>, 'svg'>>;
+    /** Custom bredde for enkel fane. */
+    width?: Property.Width;
+    /** Spesifiserer om `<Tab />` skal ha fokus. **OBS!** settes automatisk av forelder.*/
+    focus?: boolean;
+    /**  Callback som setter fokus. **OBS!** settes automatisk av forelder.*/
+    setFocus?: Dispatch<SetStateAction<number>>;
+    /** Indeksen til `<Tab />`. **OBS!** settes automatisk av forelder.*/
+    index?: number;
+} & Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'onKeyDown'>, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'onKeyDown'>>;
+export declare const Tab: import("react").ForwardRefExoticComponent<{
+    htmlProps?: Omit<ButtonHTMLAttributes<HTMLButtonElement>, "onKeyDown" | "onClick"> | undefined;
+} & Pick<Omit<ButtonHTMLAttributes<HTMLButtonElement>, "onKeyDown" | "onClick">, "className" | "id"> & {
+    /**Spesifiserer om fanen er aktiv. */
+    active?: boolean | undefined;
+    /** Ikon. */
+    Icon?: OverridableComponent<SvgIconTypeMap<Record<string, unknown>, "svg">> | undefined;
+    /** Custom bredde for enkel fane. */
+    width?: Property.Width<0 | (string & {})> | undefined;
+    /** Spesifiserer om `<Tab />` skal ha fokus. **OBS!** settes automatisk av forelder.*/
+    focus?: boolean | undefined;
+    /**  Callback som setter fokus. **OBS!** settes automatisk av forelder.*/
+    setFocus?: Dispatch<SetStateAction<number>> | undefined;
+    /** Indeksen til `<Tab />`. **OBS!** settes automatisk av forelder.*/
+    index?: number | undefined;
+} & Pick<ButtonHTMLAttributes<HTMLButtonElement>, "onKeyDown" | "onClick"> & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/cjs/components/Tabs/TabList.d.ts

@@ -0,0 +1,3 @@
+import { HTMLAttributes } from 'react';
+export declare type TabListProps = HTMLAttributes<HTMLDivElement>;
+export declare const TabList: import("react").ForwardRefExoticComponent<TabListProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Tabs/TabPanel.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { BaseComponentPropsWithChildren } from '../../types';
+export declare type TabPanelProps = BaseComponentPropsWithChildren<HTMLDivElement, {
+    /** Spesifiserer om panelet skal vises basert på aktiv fane. */
+    active?: boolean;
+}>;
+export declare const TabPanel: import("react").ForwardRefExoticComponent<{
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
+    /** Spesifiserer om panelet skal vises basert på aktiv fane. */
+    active?: boolean | undefined;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Tabs/TabPanels.d.ts

@@ -0,0 +1,3 @@
+import { HTMLAttributes } from 'react';
+export declare type TabPanelsProps = HTMLAttributes<HTMLDivElement>;
+export declare const TabPanels: import("react").ForwardRefExoticComponent<TabPanelsProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Tabs/Tabs.context.d.ts

@@ -0,0 +1,17 @@
+import { RefObject } from 'react';
+import { Direction } from '../../types';
+import { Property } from 'csstype';
+declare type Tabs = {
+    activeTab: number;
+    tabsId: string;
+    handleTabChange: (index: number) => void;
+    tabListRef: RefObject<HTMLDivElement> | null;
+    tabPanelsRef: RefObject<HTMLDivElement> | null;
+    hasTabFocus: boolean;
+    setHasTabFocus: (hasFocus: boolean) => void;
+    tabContentDirection: Direction;
+    tabWidth: Property.Width;
+};
+export declare const TabsContext: import("react").Context<Tabs>;
+export declare const useTabsContext: () => Tabs;
+export {};

package/dist/cjs/components/Tabs/Tabs.d.ts

@@ -0,0 +1,27 @@
+import { HTMLAttributes } from 'react';
+import { BaseComponentPropsWithChildren, Direction } from '../../types';
+import { Property } from 'csstype';
+export declare type TabsProps = BaseComponentPropsWithChildren<HTMLDivElement, {
+    /** Indeksen til den aktive fanen. **OBS!** Ved å sette denne vil brukere aldri kunne endre tab uten at du også registrerer en `onChange`-lytter for å ta vare på aktiv tab utenfor komponenten. */
+    activeTab?: number;
+    /** Ekstra logikk ved endring av aktiv fane. */
+    onChange?: (index: number) => void;
+    /** Retningen ikon og tekst vises i `<Tab />`-elementer. */
+    tabContentDirection?: Direction;
+    /**Custom bredde lik for alle `<Tab />`. */
+    tabWidth?: Property.Width;
+}, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>>;
+export declare const Tabs: import("react").ForwardRefExoticComponent<{
+    htmlProps?: Omit<HTMLAttributes<HTMLDivElement>, "onChange"> | undefined;
+} & Pick<Omit<HTMLAttributes<HTMLDivElement>, "onChange">, "className" | "id"> & {
+    /** Indeksen til den aktive fanen. **OBS!** Ved å sette denne vil brukere aldri kunne endre tab uten at du også registrerer en `onChange`-lytter for å ta vare på aktiv tab utenfor komponenten. */
+    activeTab?: number | undefined;
+    /** Ekstra logikk ved endring av aktiv fane. */
+    onChange?: ((index: number) => void) | undefined;
+    /** Retningen ikon og tekst vises i `<Tab />`-elementer. */
+    tabContentDirection?: Direction | undefined;
+    /**Custom bredde lik for alle `<Tab />`. */
+    tabWidth?: Property.Width<0 | (string & {})> | undefined;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Tabs/Tabs.stories.d.ts

@@ -0,0 +1,10 @@
+import { TabsProps } from '.';
+import { Story, Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Overview: Story<TabsProps>;
+export declare const Default: Story<TabsProps>;
+export declare const WithIcon: Story<TabsProps>;
+export declare const ActiveTab: Story<TabsProps>;
+export declare const TabWidth: Story<TabsProps>;
+export declare const ManyTabs: Story<TabsProps>;

package/dist/cjs/components/Tabs/Tabs.tokens.d.ts

@@ -0,0 +1,38 @@
+import { CSSObject } from 'styled-components';
+export declare const tabsTokens: {
+    tabList: {
+        base: CSSObject;
+        focus: {
+            base: CSSObject;
+        };
+    };
+    tab: {
+        base: CSSObject;
+        direction: {
+            row: {
+                base: CSSObject;
+            };
+            column: {
+                base: CSSObject;
+            };
+        };
+        active: {
+            base: CSSObject;
+        };
+        hover: {
+            base: CSSObject;
+            active: {
+                base: CSSObject;
+            };
+        };
+        focus: {
+            base: CSSObject;
+        };
+    };
+    panel: {
+        base: CSSObject;
+        focusVisible: {
+            base: CSSObject;
+        };
+    };
+};

package/dist/cjs/components/Tabs/index.d.ts

@@ -0,0 +1,5 @@
+export * from './Tabs';
+export * from './Tab';
+export * from './TabList';
+export * from './TabPanel';
+export * from './TabPanels';