@kystverket/styrbord 0.301.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +78 -0
- package/dist/main.js +10332 -0
- package/dist/main.umd.cjs +37 -0
- package/dist/src/components/deprecated/Card/Card.d.ts +16 -0
- package/dist/src/components/deprecated/Card/Card.stories.d.ts +37 -0
- package/dist/src/components/deprecated/Details/Details.d.ts +6 -0
- package/dist/src/components/deprecated/Details/Details.stories.d.ts +12 -0
- package/dist/src/components/deprecated/ErrorLabel/errorLabel.d.ts +8 -0
- package/dist/src/components/deprecated/ErrorLabel/errorLabel.stories.d.ts +13 -0
- package/dist/src/components/deprecated/InputLabel/inputLabel.d.ts +12 -0
- package/dist/src/components/deprecated/InputLabel/inputLabel.stories.d.ts +20 -0
- package/dist/src/components/designsystemet/Button/Button.d.ts +11 -0
- package/dist/src/components/designsystemet/Button/Button.stories.d.ts +24 -0
- package/dist/src/components/designsystemet/Card/Card.stories.d.ts +30 -0
- package/dist/src/components/designsystemet/CardTitle/CardTitle.d.ts +10 -0
- package/dist/src/components/designsystemet/Details/Details.stories.d.ts +16 -0
- package/dist/src/components/designsystemet/Link/Link.stories.d.ts +10 -0
- package/dist/src/components/designsystemet/List/List.stories.d.ts +16 -0
- package/dist/src/components/designsystemet/NumberInput/NumberInput.d.ts +23 -0
- package/dist/src/components/designsystemet/NumberInput/NumberInput.stories.d.ts +21 -0
- package/dist/src/components/designsystemet/Select/Select.d.ts +19 -0
- package/dist/src/components/designsystemet/Select/Select.stories.d.ts +13 -0
- package/dist/src/components/designsystemet/Table/Table.d.ts +17 -0
- package/dist/src/components/designsystemet/Table/Table.stories.d.ts +17 -0
- package/dist/src/components/designsystemet/Tabs/Tabs.d.ts +15 -0
- package/dist/src/components/designsystemet/Tabs/Tabs.stories.d.ts +10 -0
- package/dist/src/components/designsystemet/TextArea/TextArea.d.ts +20 -0
- package/dist/src/components/designsystemet/TextArea/TextArea.stories.d.ts +20 -0
- package/dist/src/components/designsystemet/TextInput/TextInput.d.ts +24 -0
- package/dist/src/components/designsystemet/TextInput/TextInput.stories.d.ts +20 -0
- package/dist/src/components/kystverket/Alert/alert.d.ts +15 -0
- package/dist/src/components/kystverket/Alert/alert.stories.d.ts +17 -0
- package/dist/src/components/kystverket/Alert/alert.types.d.ts +3 -0
- package/dist/src/components/kystverket/Alert/alert.util.d.ts +3 -0
- package/dist/src/components/kystverket/BorderedRadioGroup/borderedRadioGroup.d.ts +16 -0
- package/dist/src/components/kystverket/BorderedRadioGroup/borderedRadioGroup.stories.d.ts +15 -0
- package/dist/src/components/kystverket/BorderedToggleGroup/borderedToggleGroup.d.ts +17 -0
- package/dist/src/components/kystverket/BorderedToggleGroup/borderedToggleGroup.stories.d.ts +15 -0
- package/dist/src/components/kystverket/Box/box.constants.d.ts +3 -0
- package/dist/src/components/kystverket/Box/box.d.ts +35 -0
- package/dist/src/components/kystverket/Box/box.stories.d.ts +21 -0
- package/dist/src/components/kystverket/Box/box.types.d.ts +14 -0
- package/dist/src/components/kystverket/Datepicker/Datepicker.d.ts +12 -0
- package/dist/src/components/kystverket/Datepicker/Datepicker.stories.d.ts +14 -0
- package/dist/src/components/kystverket/FileUploader/FileUploader.context.d.ts +7 -0
- package/dist/src/components/kystverket/FileUploader/FileUploader.d.ts +14 -0
- package/dist/src/components/kystverket/FileUploader/FileUploader.stories.d.ts +13 -0
- package/dist/src/components/kystverket/FileUploader/FileUploader.types.d.ts +17 -0
- package/dist/src/components/kystverket/Footer/Footer.d.ts +14 -0
- package/dist/src/components/kystverket/Footer/Footer.stories.d.ts +15 -0
- package/dist/src/components/kystverket/Header/Header.d.ts +33 -0
- package/dist/src/components/kystverket/Header/Header.stories.d.ts +38 -0
- package/dist/src/components/kystverket/Icon/Icon.stories.d.ts +11 -0
- package/dist/src/components/kystverket/Icon/icon.d.ts +10 -0
- package/dist/src/components/kystverket/Icon/icon.types.d.ts +2 -0
- package/dist/src/components/kystverket/Image/image.d.ts +29 -0
- package/dist/src/components/kystverket/Image/image.stories.d.ts +12 -0
- package/dist/src/components/kystverket/LabelContent/labelContent.d.ts +8 -0
- package/dist/src/components/kystverket/LabelContent/labelContent.stories.d.ts +20 -0
- package/dist/src/components/kystverket/Logo/Logo.d.ts +9 -0
- package/dist/src/components/kystverket/Logo/Logo.stories.d.ts +21 -0
- package/dist/src/components/kystverket/Stepper/stepper.d.ts +11 -0
- package/dist/src/components/kystverket/Stepper/stepper.stories.d.ts +13 -0
- package/dist/src/components/kystverket/Summary/summary.d.ts +4 -0
- package/dist/src/components/kystverket/Summary/summary.stories.d.ts +13 -0
- package/dist/src/components/kystverket/Summary/summary.types.d.ts +26 -0
- package/dist/src/components/kystverket/Typography/typography.d.ts +26 -0
- package/dist/src/components/kystverket/Typography/typography.stories.d.ts +13 -0
- package/dist/src/components/kystverket/Typography/typography.util.d.ts +14 -0
- package/dist/src/i18n/translations.d.ts +2 -0
- package/dist/src/main.d.ts +52 -0
- package/dist/src/utils/input/input.d.ts +2 -0
- package/dist/src/utils/sizing.d.ts +5 -0
- package/dist/src/utils/types.d.ts +2 -0
- package/dist/storybook/styrbordDecorator.d.ts +5 -0
- package/dist/style.css +1 -0
- package/package.json +114 -0
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { CardProps as DsCardProps } from '@digdir/designsystemet-react';
|
|
2
|
+
import { IconId } from '~/main';
|
|
3
|
+
export type CardProps = Omit<DsCardProps, 'children'> & {
|
|
4
|
+
title?: string;
|
|
5
|
+
titleLevel?: 1 | 2 | 3 | 4 | 5 | 6;
|
|
6
|
+
icon?: IconId;
|
|
7
|
+
link?: string;
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
};
|
|
10
|
+
declare const Card: {
|
|
11
|
+
({ title, icon, link, children, titleLevel, ...props }: CardProps): React.JSX.Element;
|
|
12
|
+
Block: React.ForwardRefExoticComponent<{
|
|
13
|
+
asChild?: boolean;
|
|
14
|
+
} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
15
|
+
};
|
|
16
|
+
export default Card;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: {
|
|
5
|
+
({ title, icon, link, children, titleLevel, ...props }: import("./Card").CardProps): React.JSX.Element;
|
|
6
|
+
Block: React.ForwardRefExoticComponent<{
|
|
7
|
+
asChild?: boolean;
|
|
8
|
+
} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
9
|
+
};
|
|
10
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
11
|
+
tags: string[];
|
|
12
|
+
argTypes: {
|
|
13
|
+
variant: {
|
|
14
|
+
options: string[];
|
|
15
|
+
control: {
|
|
16
|
+
type: "radio";
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
title: {
|
|
20
|
+
options: string[];
|
|
21
|
+
control: {
|
|
22
|
+
type: "radio";
|
|
23
|
+
};
|
|
24
|
+
};
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
export default meta;
|
|
28
|
+
type Story = StoryObj<typeof meta>;
|
|
29
|
+
export declare const Default: Story;
|
|
30
|
+
export declare const Tinted: Story;
|
|
31
|
+
export declare const CardWithTitleAndIcon: Story;
|
|
32
|
+
export declare const CardWithTitle: Story;
|
|
33
|
+
export declare const CardWithLinkInTitle: Story;
|
|
34
|
+
export declare const CardAsLink: Story;
|
|
35
|
+
export declare const CardAsButton: Story;
|
|
36
|
+
export declare const Media: Story;
|
|
37
|
+
export declare const Video: Story;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { DetailsProps as DsDetailsProps } from '@digdir/designsystemet-react';
|
|
2
|
+
export type DetailsProps = DsDetailsProps & {
|
|
3
|
+
summary: React.ReactNode;
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
};
|
|
6
|
+
export declare const Details: ({ summary, children, ...props }: DetailsProps) => React.JSX.Element;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { DetailsProps } from './Details';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ summary, children, ...props }: DetailsProps) => React.JSX.Element;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { ErrorLabelProps } from './errorLabel';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ ...props }: ErrorLabelProps) => React.JSX.Element;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const NoError: Story;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export interface InputLabelProps {
|
|
3
|
+
optional?: boolean | string | undefined;
|
|
4
|
+
required?: boolean | string | undefined;
|
|
5
|
+
text?: string | null;
|
|
6
|
+
subText?: ReactNode | string | null;
|
|
7
|
+
children?: ReactNode;
|
|
8
|
+
embedded?: boolean;
|
|
9
|
+
loading?: boolean;
|
|
10
|
+
}
|
|
11
|
+
declare const InputLabel: ({ text, subText, loading, optional, required, embedded, children, }: InputLabelProps) => React.JSX.Element | null;
|
|
12
|
+
export default InputLabel;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { InputLabelProps } from './inputLabel';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ text, subText, loading, optional, required, embedded, children, }: InputLabelProps) => React.JSX.Element | null;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const Valgfritt: Story;
|
|
14
|
+
export declare const LangTekst: Story;
|
|
15
|
+
export declare const LangRequired: Story;
|
|
16
|
+
export declare const LangRequiredText: Story;
|
|
17
|
+
export declare const Required: Story;
|
|
18
|
+
export declare const RequiredText: Story;
|
|
19
|
+
export declare const Hvorfor: Story;
|
|
20
|
+
export declare const Hvorfor2: Story;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ButtonProps as DsButtonProps } from '@digdir/designsystemet-react';
|
|
2
|
+
import { FC } from 'react';
|
|
3
|
+
export type ButtonProps = {
|
|
4
|
+
variant?: 'filled' | 'subtle' | 'outline' | 'ghost' | 'dashed';
|
|
5
|
+
color?: 'neutral' | 'danger';
|
|
6
|
+
size?: 'sm' | 'md' | 'lg';
|
|
7
|
+
text?: string;
|
|
8
|
+
href?: string;
|
|
9
|
+
target?: string;
|
|
10
|
+
} & Omit<DsButtonProps, 'variant' | 'data-color' | 'data-size'>;
|
|
11
|
+
export declare const Button: FC<ButtonProps>;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { ButtonProps } from './Button';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: React.FC<ButtonProps>;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const Filled: Story;
|
|
14
|
+
export declare const Subtle: Story;
|
|
15
|
+
export declare const Ghost: Story;
|
|
16
|
+
export declare const Dashed: Story;
|
|
17
|
+
export declare const Neutral: Story;
|
|
18
|
+
export declare const Danger: Story;
|
|
19
|
+
export declare const LinkTo: Story;
|
|
20
|
+
export declare const Small: Story;
|
|
21
|
+
export declare const Large: Story;
|
|
22
|
+
export declare const Loading: Story;
|
|
23
|
+
export declare const Disabled: Story;
|
|
24
|
+
export declare const WithIcon: Story;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: React.ForwardRefExoticComponent<Omit<import("@digdir/designsystemet-react/dist/types/types").DefaultProps & React.HTMLAttributes<HTMLDivElement>, "children" | "asChild" | "variant"> & {
|
|
5
|
+
variant?: "default" | "tinted";
|
|
6
|
+
asChild?: boolean;
|
|
7
|
+
children: React.ReactNode;
|
|
8
|
+
} & React.RefAttributes<HTMLDivElement>> & {
|
|
9
|
+
Block: typeof import("@digdir/designsystemet-react").CardBlock;
|
|
10
|
+
};
|
|
11
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
12
|
+
tags: string[];
|
|
13
|
+
argTypes: {
|
|
14
|
+
variant: {
|
|
15
|
+
options: string[];
|
|
16
|
+
control: {
|
|
17
|
+
type: "radio";
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
export default meta;
|
|
23
|
+
type Story = StoryObj<typeof meta>;
|
|
24
|
+
export declare const Default: Story;
|
|
25
|
+
export declare const Tinted: Story;
|
|
26
|
+
export declare const CardWithTitleAndIcon: Story;
|
|
27
|
+
export declare const CardWithTitle: Story;
|
|
28
|
+
export declare const CardWithLinkInTitle: Story;
|
|
29
|
+
export declare const CardAsLink: Story;
|
|
30
|
+
export declare const CardAsButton: Story;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { IconId } from '~/main';
|
|
2
|
+
export type CardTitleProps = {
|
|
3
|
+
children?: React.ReactNode;
|
|
4
|
+
icon?: IconId;
|
|
5
|
+
href?: string;
|
|
6
|
+
level?: 1 | 2 | 3 | 4 | 5 | 6;
|
|
7
|
+
size?: '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
|
8
|
+
};
|
|
9
|
+
declare const CardTitle: ({ icon, href, children, level, size }: CardTitleProps) => React.JSX.Element;
|
|
10
|
+
export default CardTitle;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { DetailsProps } from '@digdir/designsystemet-react';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: React.ForwardRefExoticComponent<DetailsProps & React.RefAttributes<HTMLDetailsElement>> & {
|
|
6
|
+
Summary: typeof import("@digdir/designsystemet-react").DetailsSummary;
|
|
7
|
+
Content: typeof import("@digdir/designsystemet-react").DetailsContent;
|
|
8
|
+
};
|
|
9
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
10
|
+
tags: string[];
|
|
11
|
+
argTypes: {};
|
|
12
|
+
};
|
|
13
|
+
export default meta;
|
|
14
|
+
type Story = StoryObj<typeof meta>;
|
|
15
|
+
export declare const Default: Story;
|
|
16
|
+
export declare const InCard: Story;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { Meta, StoryFn, StoryObj } from '@storybook/react';
|
|
2
|
+
import { Link } from '@digdir/designsystemet-react';
|
|
3
|
+
type Story = StoryObj<typeof Link>;
|
|
4
|
+
declare const _default: Meta;
|
|
5
|
+
export default _default;
|
|
6
|
+
export declare const Normal: Story;
|
|
7
|
+
export declare const Visited: Story;
|
|
8
|
+
export declare const InText: StoryFn<typeof Link>;
|
|
9
|
+
export declare const LongLink: StoryFn<typeof Link>;
|
|
10
|
+
export declare const Neutral: StoryFn<typeof Link>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { List } from '~/main';
|
|
2
|
+
import type { StoryFn } from '@storybook/react';
|
|
3
|
+
type Story = StoryFn<typeof List.Unordered>;
|
|
4
|
+
declare const _default: {
|
|
5
|
+
title: string;
|
|
6
|
+
component: React.ForwardRefExoticComponent<{
|
|
7
|
+
asChild?: boolean;
|
|
8
|
+
} & import("@digdir/designsystemet-react/dist/types/types").DefaultProps & Omit<React.HTMLAttributes<HTMLUListElement>, "size"> & React.RefAttributes<HTMLUListElement>>;
|
|
9
|
+
};
|
|
10
|
+
export default _default;
|
|
11
|
+
export declare const Preview: Story;
|
|
12
|
+
export declare const Sortert: StoryFn<typeof List.Ordered>;
|
|
13
|
+
export declare const Usortert: Story;
|
|
14
|
+
export declare const Innrykk: Story;
|
|
15
|
+
export declare const ListeMedLenker: Story;
|
|
16
|
+
export declare const ListeMedOverskrift: Story;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { InputSize } from '~/utils/input/input';
|
|
2
|
+
export interface NumberInputProps {
|
|
3
|
+
optional?: boolean | string | undefined;
|
|
4
|
+
required?: boolean | string | undefined;
|
|
5
|
+
className?: string;
|
|
6
|
+
placeholder?: string;
|
|
7
|
+
label?: string;
|
|
8
|
+
description?: string;
|
|
9
|
+
value: number | null | undefined;
|
|
10
|
+
onBlur?: () => void;
|
|
11
|
+
onChange?: (value?: number) => void;
|
|
12
|
+
error?: string | boolean | null;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
readOnly?: boolean;
|
|
15
|
+
inputMode?: 'numeric' | 'decimal';
|
|
16
|
+
prefix?: string;
|
|
17
|
+
suffix?: string;
|
|
18
|
+
min?: number;
|
|
19
|
+
max?: number;
|
|
20
|
+
align?: 'left' | 'right';
|
|
21
|
+
size?: InputSize;
|
|
22
|
+
}
|
|
23
|
+
export declare const NumberInput: ({ size, inputMode, className, align, ...props }: NumberInputProps) => React.JSX.Element;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { NumberInputProps } from './NumberInput';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: (props: NumberInputProps) => React.JSX.Element;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const Decimal: Story;
|
|
14
|
+
export declare const Required: Story;
|
|
15
|
+
export declare const Optional: Story;
|
|
16
|
+
export declare const OptionalText: Story;
|
|
17
|
+
export declare const WithPlaceholder: Story;
|
|
18
|
+
export declare const WithError: Story;
|
|
19
|
+
export declare const ReadOnly: Story;
|
|
20
|
+
export declare const Disabled: Story;
|
|
21
|
+
export declare const AlignRight: Story;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export type SelectOption = {
|
|
2
|
+
value: string;
|
|
3
|
+
label?: string;
|
|
4
|
+
};
|
|
5
|
+
export interface SelectProps {
|
|
6
|
+
className?: string;
|
|
7
|
+
optional?: boolean | string | undefined;
|
|
8
|
+
required?: boolean | string | undefined;
|
|
9
|
+
label?: string;
|
|
10
|
+
description?: string;
|
|
11
|
+
value?: string;
|
|
12
|
+
placeholder?: string;
|
|
13
|
+
error?: string;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
onBlur?: () => void;
|
|
16
|
+
onChange?: (value: string) => void;
|
|
17
|
+
options?: SelectOption[];
|
|
18
|
+
}
|
|
19
|
+
export declare const Select: ({ ...props }: SelectProps) => React.JSX.Element;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { SelectProps } from './Select';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ ...props }: SelectProps) => React.JSX.Element;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const WithValue: Story;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { TableProps as DsTableProps } from '@digdir/designsystemet-react';
|
|
2
|
+
export type TableProps = DsTableProps & {
|
|
3
|
+
header?: true | 'transparent' | 'opaque';
|
|
4
|
+
body?: 'transparent' | 'white';
|
|
5
|
+
};
|
|
6
|
+
declare const Table: {
|
|
7
|
+
({ header, body, className, ...props }: TableProps): React.JSX.Element;
|
|
8
|
+
Cell: React.ForwardRefExoticComponent<import("@digdir/designsystemet-react").TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
|
|
9
|
+
HeaderCell: React.ForwardRefExoticComponent<{
|
|
10
|
+
sort?: React.AriaAttributes["aria-sort"];
|
|
11
|
+
} & React.ThHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
|
|
12
|
+
Head: React.ForwardRefExoticComponent<import("@digdir/designsystemet-react").TableHeadProps & React.RefAttributes<HTMLTableSectionElement>>;
|
|
13
|
+
Body: React.ForwardRefExoticComponent<import("@digdir/designsystemet-react").TableBodyProps & React.RefAttributes<HTMLTableSectionElement>>;
|
|
14
|
+
Row: React.ForwardRefExoticComponent<import("@digdir/designsystemet-react").TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
|
|
15
|
+
Foot: React.ForwardRefExoticComponent<import("@digdir/designsystemet-react").TableFootProps & React.RefAttributes<HTMLTableSectionElement>>;
|
|
16
|
+
};
|
|
17
|
+
export default Table;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Table } from '~/main';
|
|
2
|
+
import type { Meta, StoryFn } from '@storybook/react';
|
|
3
|
+
type Story = StoryFn<typeof Table>;
|
|
4
|
+
declare const _default: Meta;
|
|
5
|
+
export default _default;
|
|
6
|
+
export declare const Preview: Story;
|
|
7
|
+
export declare const Numbers: Story;
|
|
8
|
+
export declare const Sortable: Story;
|
|
9
|
+
export declare const StickyHeader: Story;
|
|
10
|
+
export declare const WithFormElements: Story;
|
|
11
|
+
export declare const FixedTable: Story;
|
|
12
|
+
export declare const MultipleHeaderRows: Story;
|
|
13
|
+
export declare const WithBorder: Story;
|
|
14
|
+
export declare const OpaqueHeader: Story;
|
|
15
|
+
export declare const Zebra: Story;
|
|
16
|
+
export declare const ColorPrimary: Story;
|
|
17
|
+
export declare const ColorAccent: Story;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { TabsProps as DsTabsProps } from '@digdir/designsystemet-react';
|
|
2
|
+
export type TabsProps = DsTabsProps & {
|
|
3
|
+
underlined?: boolean;
|
|
4
|
+
};
|
|
5
|
+
declare const Tabs: {
|
|
6
|
+
({ underlined, className, ...props }: TabsProps): React.JSX.Element;
|
|
7
|
+
List: React.ForwardRefExoticComponent<import("@digdir/designsystemet-react").TabsListProps & React.RefAttributes<HTMLDivElement>>;
|
|
8
|
+
Tab: React.ForwardRefExoticComponent<{
|
|
9
|
+
value: string;
|
|
10
|
+
} & Omit<React.HTMLAttributes<HTMLButtonElement>, "value"> & React.RefAttributes<HTMLButtonElement>>;
|
|
11
|
+
Panel: React.ForwardRefExoticComponent<{
|
|
12
|
+
value: string;
|
|
13
|
+
} & Omit<React.HTMLAttributes<HTMLDivElement>, "value"> & React.RefAttributes<HTMLDivElement>>;
|
|
14
|
+
};
|
|
15
|
+
export default Tabs;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Tabs } from '~/main';
|
|
2
|
+
import type { Meta, StoryFn } from '@storybook/react';
|
|
3
|
+
declare const _default: Meta;
|
|
4
|
+
export default _default;
|
|
5
|
+
export declare const Preview: StoryFn<typeof Tabs>;
|
|
6
|
+
export declare const withButton: StoryFn<typeof Tabs>;
|
|
7
|
+
export declare const withoutUnderline: StoryFn<typeof Tabs>;
|
|
8
|
+
export declare const IconsOnly: StoryFn<typeof Tabs>;
|
|
9
|
+
export declare const IconsWithText: StoryFn<typeof Tabs>;
|
|
10
|
+
export declare const Controlled: StoryFn<typeof Tabs>;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { InputSize } from '~/utils/input/input';
|
|
2
|
+
export declare const Textfield: null;
|
|
3
|
+
export interface TextAreaProps {
|
|
4
|
+
optional?: boolean | string | undefined;
|
|
5
|
+
required?: boolean | string | undefined;
|
|
6
|
+
className?: string;
|
|
7
|
+
placeholder?: string;
|
|
8
|
+
label?: string;
|
|
9
|
+
description?: string | React.ReactNode;
|
|
10
|
+
value: string | null | undefined;
|
|
11
|
+
onBlur?: () => void;
|
|
12
|
+
onChange?: (value: string) => void;
|
|
13
|
+
error?: string | boolean | null;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
readOnly?: boolean;
|
|
16
|
+
inputMode?: 'email' | 'tel' | 'search' | 'text' | 'none' | 'url' | 'numeric' | 'decimal';
|
|
17
|
+
maxLength?: number;
|
|
18
|
+
size?: InputSize;
|
|
19
|
+
}
|
|
20
|
+
export declare const TextArea: ({ size, className, ...props }: TextAreaProps) => React.JSX.Element;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { TextAreaProps } from './TextArea';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ size, className, ...props }: TextAreaProps) => React.JSX.Element;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const Required: Story;
|
|
14
|
+
export declare const Optional: Story;
|
|
15
|
+
export declare const OptionalText: Story;
|
|
16
|
+
export declare const WithPlaceholder: Story;
|
|
17
|
+
export declare const WithError: Story;
|
|
18
|
+
export declare const ReadOnly: Story;
|
|
19
|
+
export declare const Disabled: Story;
|
|
20
|
+
export declare const WithCounter: Story;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { HTMLInputAutoCompleteAttribute } from 'react';
|
|
2
|
+
import { InputSize } from '~/utils/input/input';
|
|
3
|
+
export interface TextInputProps {
|
|
4
|
+
optional?: boolean | string | undefined;
|
|
5
|
+
required?: boolean | string | undefined;
|
|
6
|
+
className?: string;
|
|
7
|
+
placeholder?: string;
|
|
8
|
+
label?: string;
|
|
9
|
+
description?: string;
|
|
10
|
+
value: string | null | undefined;
|
|
11
|
+
onBlur?: () => void;
|
|
12
|
+
onChange?: (value: string) => void;
|
|
13
|
+
error?: string | null;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
readOnly?: boolean;
|
|
16
|
+
loading?: boolean;
|
|
17
|
+
inputMode?: 'email' | 'tel' | 'search' | 'text' | 'none' | 'url' | 'numeric' | 'decimal';
|
|
18
|
+
prefix?: string;
|
|
19
|
+
suffix?: string;
|
|
20
|
+
type?: 'email' | 'hidden' | 'password' | 'tel' | 'text' | 'time' | 'url';
|
|
21
|
+
size?: InputSize;
|
|
22
|
+
autoComplete?: HTMLInputAutoCompleteAttribute;
|
|
23
|
+
}
|
|
24
|
+
export declare const TextInput: ({ autoComplete, size, type, className, ...props }: TextInputProps) => React.JSX.Element;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { TextInputProps } from './TextInput';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ autoComplete, size, type, className, ...props }: TextInputProps) => React.JSX.Element;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const Required: Story;
|
|
14
|
+
export declare const Optional: Story;
|
|
15
|
+
export declare const OptionalText: Story;
|
|
16
|
+
export declare const WithPlaceholder: Story;
|
|
17
|
+
export declare const WithError: Story;
|
|
18
|
+
export declare const Disabled: Story;
|
|
19
|
+
export declare const ReadOnly: Story;
|
|
20
|
+
export declare const Loading: Story;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { AlertLevel, TextSize, Width } from './alert.types';
|
|
3
|
+
export interface AlertProps {
|
|
4
|
+
level: AlertLevel;
|
|
5
|
+
size?: TextSize;
|
|
6
|
+
title?: string;
|
|
7
|
+
text?: string;
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
width?: Width;
|
|
10
|
+
className?: string;
|
|
11
|
+
role?: 'status';
|
|
12
|
+
onDismiss?: () => void;
|
|
13
|
+
}
|
|
14
|
+
declare const Alert: ({ level, size, width, title, text, className, ...props }: AlertProps) => React.JSX.Element;
|
|
15
|
+
export default Alert;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { AlertProps } from './alert';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ level, size, width, title, text, className, ...props }: AlertProps) => React.JSX.Element;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const Small: Story;
|
|
14
|
+
export declare const DefaultKort: Story;
|
|
15
|
+
export declare const LargeWithDismiss: Story;
|
|
16
|
+
export declare const ClassNameCustomWidth: Story;
|
|
17
|
+
export declare const WithErrorDismiss: Story;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export type RadioGroupValueType = string | boolean | number;
|
|
3
|
+
export interface BorderedRadioGroupProps {
|
|
4
|
+
label?: string;
|
|
5
|
+
description?: ReactNode | string;
|
|
6
|
+
value?: RadioGroupValueType;
|
|
7
|
+
options: {
|
|
8
|
+
label: string;
|
|
9
|
+
value: RadioGroupValueType;
|
|
10
|
+
}[];
|
|
11
|
+
onChange?: (value: RadioGroupValueType) => void;
|
|
12
|
+
onBlur?: () => void;
|
|
13
|
+
error?: string;
|
|
14
|
+
}
|
|
15
|
+
declare const BorderedRadioGroup: (props: BorderedRadioGroupProps) => React.JSX.Element;
|
|
16
|
+
export default BorderedRadioGroup;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { BorderedRadioGroupProps } from './borderedRadioGroup';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: (props: BorderedRadioGroupProps) => React.JSX.Element;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const WithLongOptionText: Story;
|
|
14
|
+
export declare const WithReactElementDescription: Story;
|
|
15
|
+
export declare const WithError: Story;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export interface ToggleValue {
|
|
3
|
+
key: string;
|
|
4
|
+
label: string;
|
|
5
|
+
value: boolean;
|
|
6
|
+
}
|
|
7
|
+
export interface BorderedToggleGroupProps {
|
|
8
|
+
label?: string;
|
|
9
|
+
description?: ReactNode | string;
|
|
10
|
+
values: ToggleValue[];
|
|
11
|
+
onChanges?: (values: ToggleValue[]) => void;
|
|
12
|
+
onChange?: (value: ToggleValue) => void;
|
|
13
|
+
onBlur?: () => void;
|
|
14
|
+
error?: string;
|
|
15
|
+
}
|
|
16
|
+
declare const BorderedRadioGroup: (props: BorderedToggleGroupProps) => React.JSX.Element | null;
|
|
17
|
+
export default BorderedRadioGroup;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { BorderedToggleGroupProps } from './borderedToggleGroup';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: (props: BorderedToggleGroupProps) => React.JSX.Element | null;
|
|
6
|
+
decorators: ((Story: import("@storybook/types").PartialStoryFn) => React.JSX.Element)[];
|
|
7
|
+
tags: string[];
|
|
8
|
+
argTypes: {};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
export declare const Default: Story;
|
|
13
|
+
export declare const WithLongOptionText: Story;
|
|
14
|
+
export declare const WithReactElementDescription: Story;
|
|
15
|
+
export declare const WithError: Story;
|