@mcf/lib-ui 2.0.156 → 2.0.169
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/.babelrc.json +18 -0
- package/README.md +2 -2
- package/dist/@types/Component/Button/Button.d.ts +15 -0
- package/dist/@types/Component/Button/ButtonConstants.d.ts +19 -0
- package/dist/@types/Component/CheckBox/CheckBox.d.ts +2 -1
- package/dist/@types/Component/ConfirmationBox/ConfirmationBox.d.ts +3 -2
- package/dist/@types/Component/Icon/Icon.d.ts +6 -0
- package/dist/@types/Component/ReactFileReader/ReactFileReader.d.ts +1 -1
- package/dist/@types/Component/TextArea/TextArea.d.ts +1 -1
- package/dist/@types/Component/TypeAhead/TypeAhead.d.ts +1 -0
- package/dist/@types/Component/Typography/Typography.d.ts +8 -0
- package/dist/@types/Component/Typography/TypographyConstants.d.ts +79 -0
- package/dist/@types/Component/utils.d.ts +2 -0
- package/dist/@types/Example/ReactFileReader/ReactFileReader.story.d.ts +11 -1
- package/dist/@types/Example/ReactFileReader/index.d.ts +2 -1
- package/dist/@types/stories/Button.stories.d.ts +12 -0
- package/dist/@types/stories/Typography.stories.d.ts +38 -0
- package/dist/index.js +2 -1
- package/dist/index.js.LICENSE.txt +1 -0
- package/dist/index.js.map +1 -1
- package/dist/main.css +14 -5
- package/jest.config.js +3 -2
- package/package.json +42 -29
- package/test/helpers/index.ts +1 -0
- package/tsconfig.json +2 -1
- package/tslint.json +0 -17
package/.babelrc.json
ADDED
package/README.md
CHANGED
|
@@ -70,8 +70,8 @@ List of CSS variables overridable (default only if you use the provided style):
|
|
|
70
70
|
|
|
71
71
|
## Quick Links
|
|
72
72
|
NPM: https://www.npmjs.com/package/@mcf/lib-ui
|
|
73
|
-
Dependency Images: https://gitlab.com/
|
|
74
|
-
Application Images: https://gitlab.com/
|
|
73
|
+
Dependency Images: https://sgts.gitlab-dedicated.com/wog/wsg/mycareersfuture/wsg-mycareersfuture/lib-ui/container_registry/3171
|
|
74
|
+
Application Images: https://sgts.gitlab-dedicated.com/wog/wsg/mycareersfuture/wsg-mycareersfuture/lib-ui/container_registry/3173
|
|
75
75
|
|
|
76
76
|
## Contributing
|
|
77
77
|
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { FC, ButtonHTMLAttributes, DetailedHTMLProps } from 'react';
|
|
2
|
+
import { BUTTON_CATEGORY, BUTTON_COLOR, BUTTON_ICON_POSITION, BUTTON_SIZE } from './ButtonConstants';
|
|
3
|
+
import { IconProps } from '../Icon/Icon';
|
|
4
|
+
interface ButtonProps extends DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> {
|
|
5
|
+
category?: BUTTON_CATEGORY;
|
|
6
|
+
color: BUTTON_COLOR;
|
|
7
|
+
size?: BUTTON_SIZE;
|
|
8
|
+
rounded?: boolean;
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
onClick?: () => void;
|
|
11
|
+
iconPosition?: BUTTON_ICON_POSITION;
|
|
12
|
+
iconProps?: IconProps;
|
|
13
|
+
}
|
|
14
|
+
declare const Button: FC<ButtonProps>;
|
|
15
|
+
export default Button;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export declare enum BUTTON_COLOR {
|
|
2
|
+
Primary = "Primary",
|
|
3
|
+
Generic = "Peneric",
|
|
4
|
+
Danger = "Danger"
|
|
5
|
+
}
|
|
6
|
+
export declare enum BUTTON_CATEGORY {
|
|
7
|
+
Solid = "Solid",
|
|
8
|
+
Outline = "Outline",
|
|
9
|
+
Transparent = "Transparent",
|
|
10
|
+
Text = "Text"
|
|
11
|
+
}
|
|
12
|
+
export declare enum BUTTON_SIZE {
|
|
13
|
+
Small = "Small",
|
|
14
|
+
Large = "Large"
|
|
15
|
+
}
|
|
16
|
+
export declare enum BUTTON_ICON_POSITION {
|
|
17
|
+
Left = "Left",
|
|
18
|
+
Right = "Right"
|
|
19
|
+
}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { IEmptyInterface } from '../utils';
|
|
2
3
|
export interface ICheckBoxProps {
|
|
3
4
|
id: string;
|
|
4
5
|
input: {
|
|
5
6
|
value?: boolean;
|
|
6
7
|
onChange: (isChecked: boolean) => void;
|
|
7
8
|
};
|
|
8
|
-
label: React.ReactElement<
|
|
9
|
+
label: React.ReactElement<IEmptyInterface> | string;
|
|
9
10
|
disabled?: boolean;
|
|
10
11
|
}
|
|
11
12
|
export declare const CheckBox: React.SFC<ICheckBoxProps>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React, { Component } from 'react';
|
|
2
|
-
import { TYPE } from '
|
|
2
|
+
import { TYPE } from '../BaseButton/BaseButton';
|
|
3
|
+
import { IEmptyInterface } from '../utils';
|
|
3
4
|
export interface IConfirmationBoxProps {
|
|
4
5
|
text: string;
|
|
5
6
|
buttonType?: TYPE;
|
|
@@ -9,7 +10,7 @@ export interface IConfirmationBoxProps {
|
|
|
9
10
|
handleReset: () => void;
|
|
10
11
|
container?: HTMLElement;
|
|
11
12
|
}
|
|
12
|
-
export declare class ConfirmationBox extends Component<IConfirmationBoxProps,
|
|
13
|
+
export declare class ConfirmationBox extends Component<IConfirmationBoxProps, IEmptyInterface> {
|
|
13
14
|
private el;
|
|
14
15
|
constructor(props: IConfirmationBoxProps);
|
|
15
16
|
componentDidMount(): void;
|
|
@@ -15,7 +15,7 @@ export interface IReactFileReaderDefaultProps {
|
|
|
15
15
|
isBase64: boolean;
|
|
16
16
|
isDisabled: boolean;
|
|
17
17
|
}
|
|
18
|
-
export
|
|
18
|
+
export type FileReaderResult = string | ArrayBuffer | null;
|
|
19
19
|
export interface IReactFileReaderResult {
|
|
20
20
|
base64: FileReaderResult[] | null;
|
|
21
21
|
fileList: FileList | null;
|
|
@@ -15,6 +15,6 @@ interface ITextAreaWithoutCounterProps extends IBaseProps {
|
|
|
15
15
|
hasCounter?: undefined;
|
|
16
16
|
maxLength?: undefined;
|
|
17
17
|
}
|
|
18
|
-
export
|
|
18
|
+
export type ITextAreaProps = ITextAreaWithCounterProps | ITextAreaWithoutCounterProps;
|
|
19
19
|
export declare const TextArea: React.SFC<ITextAreaProps>;
|
|
20
20
|
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { FC, HTMLProps } from 'react';
|
|
2
|
+
import { TypographyVariants } from './TypographyConstants';
|
|
3
|
+
type TypographyVariant = (typeof TypographyVariants)[keyof typeof TypographyVariants];
|
|
4
|
+
interface TypographyProps extends HTMLProps<HTMLDivElement> {
|
|
5
|
+
variant: TypographyVariant;
|
|
6
|
+
}
|
|
7
|
+
declare const Typography: FC<TypographyProps>;
|
|
8
|
+
export default Typography;
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
declare enum DisplayVariants {
|
|
2
|
+
Display01 = "Display-01",
|
|
3
|
+
Display02 = "Display-02",
|
|
4
|
+
Display03 = "Display-03",
|
|
5
|
+
Display03SB = "Display-03SB",
|
|
6
|
+
Display04 = "Display-04",
|
|
7
|
+
Display05 = "Display-05"
|
|
8
|
+
}
|
|
9
|
+
declare enum HeadingVariants {
|
|
10
|
+
Heading01 = "Heading-01",
|
|
11
|
+
Heading02 = "Heading-02",
|
|
12
|
+
Heading02Tight = "Heading-02Tight",
|
|
13
|
+
Heading03 = "Heading-03",
|
|
14
|
+
Heading04 = "Heading-04",
|
|
15
|
+
Heading05 = "Heading-05",
|
|
16
|
+
Heading06 = "Heading-06",
|
|
17
|
+
Heading07 = "Heading-07",
|
|
18
|
+
Heading08 = "Heading-08",
|
|
19
|
+
Heading09 = "Heading-09"
|
|
20
|
+
}
|
|
21
|
+
declare enum BodyVariants {
|
|
22
|
+
Body01 = "Body-01",
|
|
23
|
+
Body01I = "Body-01i",
|
|
24
|
+
Body01U = "Body-01u",
|
|
25
|
+
Body02 = "Body-02",
|
|
26
|
+
Body02I = "Body-02I",
|
|
27
|
+
Body02U = "Body-02U",
|
|
28
|
+
Body03 = "Body-03",
|
|
29
|
+
Body03Tight = "Body-03Tight",
|
|
30
|
+
Body03I = "Body-03I",
|
|
31
|
+
Body03U = "Body-03U",
|
|
32
|
+
Body04 = "Body-04",
|
|
33
|
+
Body04I = "Body-04I"
|
|
34
|
+
}
|
|
35
|
+
declare enum LabelsAndCaptionsVariants {
|
|
36
|
+
Field01 = "Field-01",
|
|
37
|
+
Button01 = "Button-01",
|
|
38
|
+
Button02 = "Button-02",
|
|
39
|
+
Button03 = "Button-03",
|
|
40
|
+
Pill01 = "Pill-01",
|
|
41
|
+
Pill02 = "Pill-02"
|
|
42
|
+
}
|
|
43
|
+
export declare const TypographyVariants: {
|
|
44
|
+
Field01: LabelsAndCaptionsVariants.Field01;
|
|
45
|
+
Button01: LabelsAndCaptionsVariants.Button01;
|
|
46
|
+
Button02: LabelsAndCaptionsVariants.Button02;
|
|
47
|
+
Button03: LabelsAndCaptionsVariants.Button03;
|
|
48
|
+
Pill01: LabelsAndCaptionsVariants.Pill01;
|
|
49
|
+
Pill02: LabelsAndCaptionsVariants.Pill02;
|
|
50
|
+
Body01: BodyVariants.Body01;
|
|
51
|
+
Body01I: BodyVariants.Body01I;
|
|
52
|
+
Body01U: BodyVariants.Body01U;
|
|
53
|
+
Body02: BodyVariants.Body02;
|
|
54
|
+
Body02I: BodyVariants.Body02I;
|
|
55
|
+
Body02U: BodyVariants.Body02U;
|
|
56
|
+
Body03: BodyVariants.Body03;
|
|
57
|
+
Body03Tight: BodyVariants.Body03Tight;
|
|
58
|
+
Body03I: BodyVariants.Body03I;
|
|
59
|
+
Body03U: BodyVariants.Body03U;
|
|
60
|
+
Body04: BodyVariants.Body04;
|
|
61
|
+
Body04I: BodyVariants.Body04I;
|
|
62
|
+
Heading01: HeadingVariants.Heading01;
|
|
63
|
+
Heading02: HeadingVariants.Heading02;
|
|
64
|
+
Heading02Tight: HeadingVariants.Heading02Tight;
|
|
65
|
+
Heading03: HeadingVariants.Heading03;
|
|
66
|
+
Heading04: HeadingVariants.Heading04;
|
|
67
|
+
Heading05: HeadingVariants.Heading05;
|
|
68
|
+
Heading06: HeadingVariants.Heading06;
|
|
69
|
+
Heading07: HeadingVariants.Heading07;
|
|
70
|
+
Heading08: HeadingVariants.Heading08;
|
|
71
|
+
Heading09: HeadingVariants.Heading09;
|
|
72
|
+
Display01: DisplayVariants.Display01;
|
|
73
|
+
Display02: DisplayVariants.Display02;
|
|
74
|
+
Display03: DisplayVariants.Display03;
|
|
75
|
+
Display03SB: DisplayVariants.Display03SB;
|
|
76
|
+
Display04: DisplayVariants.Display04;
|
|
77
|
+
Display05: DisplayVariants.Display05;
|
|
78
|
+
};
|
|
79
|
+
export {};
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { IReactFileReaderResult } from '../../Component/index';
|
|
3
|
+
import { IEmptyInterface } from '~/Component/utils';
|
|
3
4
|
interface IExampleReactFileReaderState {
|
|
4
5
|
results: {
|
|
5
6
|
[key: string]: IReactFileReaderResult;
|
|
6
7
|
};
|
|
7
8
|
}
|
|
8
|
-
export declare class ExampleReactFileReader extends React.Component<
|
|
9
|
+
export declare class ExampleReactFileReader extends React.Component<IEmptyInterface, IExampleReactFileReaderState> {
|
|
9
10
|
state: Readonly<IExampleReactFileReaderState>;
|
|
10
11
|
render(): JSX.Element;
|
|
11
12
|
private renderReactFileReader;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { type Meta, type StoryObj } from '@storybook/react';
|
|
2
|
+
import Button from '../Component/Button/Button';
|
|
3
|
+
declare const meta: Meta<typeof Button>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Button>;
|
|
6
|
+
export declare const PrimaryButton: Story;
|
|
7
|
+
export declare const GenericButton: Story;
|
|
8
|
+
export declare const DangerButton: Story;
|
|
9
|
+
export declare const OutlinedButton: Story;
|
|
10
|
+
export declare const TransparentButton: Story;
|
|
11
|
+
export declare const TextButton: Story;
|
|
12
|
+
export declare const IconButton: Story;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { type Meta, type StoryObj } from '@storybook/react';
|
|
2
|
+
import Typography from '../Component/Typography/Typography';
|
|
3
|
+
declare const meta: Meta<typeof Typography>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Typography>;
|
|
6
|
+
export declare const Display01: Story;
|
|
7
|
+
export declare const Display02: Story;
|
|
8
|
+
export declare const Display03: Story;
|
|
9
|
+
export declare const Display03SB: Story;
|
|
10
|
+
export declare const Display04: Story;
|
|
11
|
+
export declare const Display05: Story;
|
|
12
|
+
export declare const Body01: Story;
|
|
13
|
+
export declare const Body01Italic: Story;
|
|
14
|
+
export declare const Body01Underline: Story;
|
|
15
|
+
export declare const Body02: Story;
|
|
16
|
+
export declare const Body02Italic: Story;
|
|
17
|
+
export declare const Body02Underline: Story;
|
|
18
|
+
export declare const Body03: Story;
|
|
19
|
+
export declare const Body03Tight: Story;
|
|
20
|
+
export declare const Body03Italic: Story;
|
|
21
|
+
export declare const Body03Underline: Story;
|
|
22
|
+
export declare const Body04: Story;
|
|
23
|
+
export declare const Body04Italic: Story;
|
|
24
|
+
export declare const Heading01: Story;
|
|
25
|
+
export declare const Heading02: Story;
|
|
26
|
+
export declare const Heading02Tight: Story;
|
|
27
|
+
export declare const Heading03: Story;
|
|
28
|
+
export declare const Heading04: Story;
|
|
29
|
+
export declare const Heading05: Story;
|
|
30
|
+
export declare const Heading06: Story;
|
|
31
|
+
export declare const Heading07: Story;
|
|
32
|
+
export declare const Heading08: Story;
|
|
33
|
+
export declare const Field01: Story;
|
|
34
|
+
export declare const Button01: Story;
|
|
35
|
+
export declare const Button02: Story;
|
|
36
|
+
export declare const Button03: Story;
|
|
37
|
+
export declare const Pill01: Story;
|
|
38
|
+
export declare const Pill02: Story;
|