@abgov/react-components 3.3.2-beta.3 → 3.4.0-alpha.4
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 +7 -102
- package/experimental/index.d.ts +0 -0
- package/experimental/package.json +1 -1
- package/experimental/react-components.esm.js +0 -1962
- package/experimental/react-components.umd.js +5 -1980
- package/index.d.ts +29 -14
- package/lib/app-header/app-header.d.ts +18 -0
- package/lib/badge/badge.d.ts +29 -0
- package/lib/button/button.d.ts +27 -35
- package/lib/button-group/button-group.d.ts +18 -0
- package/lib/callout/callout.d.ts +14 -23
- package/lib/card/card-actions.d.ts +16 -0
- package/lib/card/card-content.d.ts +13 -0
- package/lib/card/card-group.d.ts +16 -0
- package/lib/card/card-image.d.ts +18 -0
- package/lib/card/card.d.ts +18 -0
- package/lib/card/index.d.ts +5 -0
- package/lib/checkbox/checkbox.d.ts +26 -35
- package/lib/container/container.d.ts +23 -0
- package/lib/dropdown/dropdown-option.d.ts +21 -0
- package/lib/dropdown/dropdown.d.ts +35 -0
- package/lib/flex/index.d.ts +1 -0
- package/lib/flex/row.d.ts +8 -0
- package/lib/form/form-item.d.ts +24 -0
- package/lib/form/index.d.ts +1 -0
- package/lib/form/validators.d.ts +10 -0
- package/lib/hero-banner/hero-banner-actions.d.ts +4 -0
- package/lib/hero-banner/hero-banner-content.d.ts +4 -0
- package/lib/hero-banner/hero-banner.d.ts +18 -0
- package/lib/icons/icon-button.d.ts +27 -0
- package/lib/icons/icon.d.ts +37 -0
- package/lib/icons/index.d.ts +2 -0
- package/lib/input/input.d.ts +70 -0
- package/lib/modal/modal.d.ts +23 -0
- package/lib/notification/notification.d.ts +14 -35
- package/lib/page-loader/page-loader.d.ts +26 -0
- package/lib/radio-group/radio-group.d.ts +18 -44
- package/lib/radio-group/radio.d.ts +27 -0
- package/lib/service-level-header/service-level-header.d.ts +17 -0
- package/lib/skeleton/skeleton.d.ts +19 -0
- package/lib/spinner/spinner.d.ts +24 -0
- package/lib/textarea/textarea.d.ts +27 -0
- package/package.json +12 -7
- package/react-components.esm.js +690 -2556
- package/react-components.umd.js +747 -2598
- package/experimental/experimental/badge/badge.component.d.ts +0 -8
- package/experimental/experimental/element-loader/element-loader.d.ts +0 -18
- package/experimental/experimental/form/container/form.button.component.d.ts +0 -7
- package/experimental/experimental/form/container/form.container.component.d.ts +0 -7
- package/experimental/experimental/form/container/form.item.component.d.ts +0 -18
- package/experimental/experimental/form/form.component.d.ts +0 -32
- package/experimental/experimental/form/formFieldValidator.d.ts +0 -4
- package/experimental/experimental/index.d.ts +0 -9
- package/experimental/experimental/input/input.component.d.ts +0 -15
- package/experimental/experimental/page-loader/page-loader.d.ts +0 -43
- package/experimental/experimental/skeleton/skeleton-element.d.ts +0 -8
- package/experimental/experimental/skeleton/skeleton-grid-column.d.ts +0 -9
- package/experimental/experimental/skeleton/skeleton-image-content.d.ts +0 -9
- package/experimental/experimental/skeleton/skeleton-titled-content.d.ts +0 -9
- package/lib/card/card.component.d.ts +0 -26
- package/lib/card-group/card.group.component.d.ts +0 -24
- package/lib/dropdown/dropdown.component.d.ts +0 -20
- package/lib/dropdown/dropdown.context.d.ts +0 -17
- package/lib/dropdown/option/option.component.d.ts +0 -10
- package/lib/dropdown/option-group/option-group.component.d.ts +0 -6
- package/lib/header/header.d.ts +0 -10
- package/lib/hero-banner/content/hero-banner-content.component.d.ts +0 -7
- package/lib/hero-banner/hero-banner.component.d.ts +0 -11
- package/lib/hero-banner/link/hero-banner-link.component.d.ts +0 -8
- package/lib/microsite-logo/microsite-logo.d.ts +0 -8
- package/lib/radio-group/radio/radio.d.ts +0 -17
- package/lib/radio-group/radio-group.context.d.ts +0 -6
package/index.d.ts
CHANGED
|
@@ -1,15 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
1
|
+
/**
|
|
2
|
+
* IMPORTANT: Do NOT export experimental components in this file.
|
|
3
|
+
*/
|
|
4
|
+
import '@abgov/web-components';
|
|
5
|
+
import { GoAAppHeader } from './lib/app-header/app-header';
|
|
6
|
+
import { GoABadge, GoAInfoBadge, GoAEmergencyBadge, GoASuccessBadge, GoAWarningBadge } from './lib/badge/badge';
|
|
7
|
+
import { GoAButton } from './lib/button/button';
|
|
8
|
+
import { GoAButtonGroup } from './lib/button-group/button-group';
|
|
9
|
+
import { GoACallout } from './lib/callout/callout';
|
|
10
|
+
import { GoACheckbox } from './lib/checkbox/checkbox';
|
|
11
|
+
import { GoAContainer } from './lib/container/container';
|
|
12
|
+
import { GoADropdown, GoADropdownOption } from './lib/dropdown/dropdown';
|
|
13
|
+
import { GoAFlexRow } from './lib/flex';
|
|
14
|
+
import { GoAFormItem } from './lib/form';
|
|
15
|
+
import { GoAHeroBanner } from './lib/hero-banner/hero-banner';
|
|
16
|
+
import { GoAHeroBannerContent } from './lib/hero-banner/hero-banner-content';
|
|
17
|
+
import { GoAHeroBannerActions } from './lib/hero-banner/hero-banner-actions';
|
|
18
|
+
import { GoAIcon, GoAIconButton } from './lib/icons';
|
|
19
|
+
import { GoAInput, GoAInputText, GoAInputPassword, GoAInputDate, GoAInputTime, GoAInputDateTime, GoAInputEmail, GoAInputSearch, GoAInputUrl, GoAInputTel, GoAInputFile, GoAInputMonth, GoAInputNumber, GoAInputRange } from './lib/input/input';
|
|
20
|
+
import { GoAModal } from './lib/modal/modal';
|
|
21
|
+
import { GoANotification } from './lib/notification/notification';
|
|
22
|
+
import { GoAPageLoader } from './lib/page-loader/page-loader';
|
|
10
23
|
import { GoARadioGroup, GoARadio } from './lib/radio-group/radio-group';
|
|
11
|
-
import
|
|
12
|
-
import {
|
|
13
|
-
import
|
|
14
|
-
import {
|
|
15
|
-
export {
|
|
24
|
+
import { GoAServiceLevelHeader } from './lib/service-level-header/service-level-header';
|
|
25
|
+
import { GoATextArea } from './lib/textarea/textarea';
|
|
26
|
+
import type { GoAIconType } from './lib/icons';
|
|
27
|
+
import type { GoABadgeType } from './lib/badge/badge';
|
|
28
|
+
export type { GoAIconType };
|
|
29
|
+
export type { GoABadgeType };
|
|
30
|
+
export { GoAAppHeader, GoABadge, GoAButton, GoAButtonGroup, GoACallout, GoACheckbox, GoAContainer, GoADropdown, GoADropdownOption, GoAEmergencyBadge, GoAFlexRow, GoAFormItem, GoAHeroBanner, GoAHeroBannerContent, GoAHeroBannerActions, GoAIcon, GoAIconButton, GoAInfoBadge, GoAInput, GoAInputDate, GoAInputDateTime, GoAInputEmail, GoAInputFile, GoAInputMonth, GoAInputNumber, GoAInputPassword, GoAInputRange, GoAInputSearch, GoAInputTel, GoAInputText, GoAInputTime, GoAInputUrl, GoAModal, GoANotification, GoAPageLoader, GoARadio, GoARadioGroup, GoAServiceLevelHeader, GoASuccessBadge, GoATextArea, GoAWarningBadge, };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
interface WCProps {
|
|
3
|
+
title: string;
|
|
4
|
+
url: string;
|
|
5
|
+
}
|
|
6
|
+
declare global {
|
|
7
|
+
namespace JSX {
|
|
8
|
+
interface IntrinsicElements {
|
|
9
|
+
'goa-app-header': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
interface Props {
|
|
14
|
+
title: string;
|
|
15
|
+
url: string;
|
|
16
|
+
}
|
|
17
|
+
export declare const GoAAppHeader: FC<Props>;
|
|
18
|
+
export default GoAAppHeader;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
import { GoAIconType } from '../icons';
|
|
3
|
+
import './badge.scss';
|
|
4
|
+
export declare type GoABadgeType = 'information' | 'success' | 'warning' | 'emergency' | 'dark' | 'midtone' | 'light' | 'inactive';
|
|
5
|
+
interface GoABadgeProps {
|
|
6
|
+
type: GoABadgeType;
|
|
7
|
+
icon?: GoAIconType;
|
|
8
|
+
content?: string;
|
|
9
|
+
testId?: string;
|
|
10
|
+
}
|
|
11
|
+
interface WCProps {
|
|
12
|
+
type: GoABadgeType;
|
|
13
|
+
icon?: GoAIconType;
|
|
14
|
+
content?: string;
|
|
15
|
+
testid?: string;
|
|
16
|
+
}
|
|
17
|
+
declare global {
|
|
18
|
+
namespace JSX {
|
|
19
|
+
interface IntrinsicElements {
|
|
20
|
+
'goa-badge': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
export declare const GoABadge: FC<GoABadgeProps>;
|
|
25
|
+
export declare const GoAInfoBadge: FC<GoABadgeProps>;
|
|
26
|
+
export declare const GoASuccessBadge: FC<GoABadgeProps>;
|
|
27
|
+
export declare const GoAWarningBadge: FC<GoABadgeProps>;
|
|
28
|
+
export declare const GoAEmergencyBadge: FC<GoABadgeProps>;
|
|
29
|
+
export {};
|
package/lib/button/button.d.ts
CHANGED
|
@@ -1,39 +1,31 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
declare type
|
|
5
|
-
declare type
|
|
1
|
+
import React, { FC, ReactNode } from 'react';
|
|
2
|
+
import './button.css';
|
|
3
|
+
declare type ButtonType = 'primary' | 'secondary' | 'tertiary' | 'borderless';
|
|
4
|
+
declare type ButtonSize = 'small' | 'medium' | 'large';
|
|
5
|
+
declare type ButtonVariant = 'default' | 'danger';
|
|
6
|
+
interface WCProps {
|
|
7
|
+
type?: ButtonType;
|
|
8
|
+
size?: ButtonSize;
|
|
9
|
+
variant?: ButtonVariant;
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
title?: string;
|
|
12
|
+
ref: React.RefObject<HTMLElement>;
|
|
13
|
+
}
|
|
14
|
+
declare global {
|
|
15
|
+
namespace JSX {
|
|
16
|
+
interface IntrinsicElements {
|
|
17
|
+
'goa-button': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
}
|
|
6
21
|
declare type ButtonProps = {
|
|
7
|
-
|
|
8
|
-
* Type of button
|
|
9
|
-
*/
|
|
10
|
-
buttonType?: ButtonType;
|
|
11
|
-
/**
|
|
12
|
-
* Size of button
|
|
13
|
-
*/
|
|
14
|
-
buttonSize?: ButtonSize;
|
|
15
|
-
/**
|
|
16
|
-
* Mouseover popup description
|
|
17
|
-
*/
|
|
22
|
+
type?: ButtonType;
|
|
18
23
|
title?: string;
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
onClick
|
|
23
|
-
|
|
24
|
-
* Button content (between button tags)
|
|
25
|
-
*/
|
|
26
|
-
children?: React.ReactNode;
|
|
27
|
-
[key: string]: any;
|
|
28
|
-
};
|
|
29
|
-
export declare const GoAButton: {
|
|
30
|
-
({ buttonType, buttonSize, title, children, onClick, ...props }: ButtonProps): JSX.Element;
|
|
31
|
-
propTypes: {
|
|
32
|
-
buttonSize: PropTypes.Requireable<string>;
|
|
33
|
-
buttonType: PropTypes.Requireable<string>;
|
|
34
|
-
title: PropTypes.Requireable<string>;
|
|
35
|
-
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
36
|
-
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
37
|
-
};
|
|
24
|
+
size?: ButtonSize;
|
|
25
|
+
variant?: ButtonVariant;
|
|
26
|
+
disabled?: boolean;
|
|
27
|
+
onClick: () => void;
|
|
28
|
+
children: ReactNode;
|
|
38
29
|
};
|
|
30
|
+
export declare const GoAButton: FC<ButtonProps>;
|
|
39
31
|
export default GoAButton;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
import './button-group.css';
|
|
3
|
+
declare type Alignment = "start" | "end";
|
|
4
|
+
interface WCProps {
|
|
5
|
+
alignment?: Alignment;
|
|
6
|
+
}
|
|
7
|
+
declare global {
|
|
8
|
+
namespace JSX {
|
|
9
|
+
interface IntrinsicElements {
|
|
10
|
+
'goa-button-group': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
declare type ButtonGroupProps = {
|
|
15
|
+
alignment: Alignment;
|
|
16
|
+
};
|
|
17
|
+
export declare const GoAButtonGroup: FC<ButtonGroupProps>;
|
|
18
|
+
export default GoAButtonGroup;
|
package/lib/callout/callout.d.ts
CHANGED
|
@@ -1,29 +1,20 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
declare type CalloutType = "important" | 'information' | 'event' | 'success' | 'emergency';
|
|
3
|
+
interface WCProps {
|
|
4
|
+
title?: string;
|
|
5
|
+
type?: CalloutType;
|
|
6
|
+
}
|
|
7
|
+
declare global {
|
|
8
|
+
namespace JSX {
|
|
9
|
+
interface IntrinsicElements {
|
|
10
|
+
'goa-callout': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
}
|
|
6
14
|
export interface CalloutProps {
|
|
7
|
-
/**
|
|
8
|
-
* Callout title.
|
|
9
|
-
*/
|
|
10
15
|
title?: string;
|
|
11
|
-
|
|
12
|
-
* The type of the callout, changes stylings and icons.
|
|
13
|
-
*/
|
|
14
|
-
type?: calloutType;
|
|
15
|
-
/**
|
|
16
|
-
* Callout description
|
|
17
|
-
*/
|
|
18
|
-
content?: string;
|
|
16
|
+
type?: CalloutType;
|
|
19
17
|
children?: React.ReactNode;
|
|
20
18
|
}
|
|
21
|
-
export declare const GoACallout: {
|
|
22
|
-
({ title, type, content, children, ...props }: CalloutProps): JSX.Element;
|
|
23
|
-
propTypes: {
|
|
24
|
-
title: PropTypes.Requireable<string>;
|
|
25
|
-
type: PropTypes.Validator<string>;
|
|
26
|
-
content: PropTypes.Requireable<string>;
|
|
27
|
-
};
|
|
28
|
-
};
|
|
19
|
+
export declare const GoACallout: ({ title, type, children }: CalloutProps) => JSX.Element;
|
|
29
20
|
export default GoACallout;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
interface WCProps {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
}
|
|
5
|
+
declare global {
|
|
6
|
+
namespace JSX {
|
|
7
|
+
interface IntrinsicElements {
|
|
8
|
+
'goa-card-actions': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
interface Props {
|
|
13
|
+
children?: React.ReactNode;
|
|
14
|
+
}
|
|
15
|
+
export declare const GoACardActions: FC<Props>;
|
|
16
|
+
export default GoACardActions;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
declare global {
|
|
3
|
+
namespace JSX {
|
|
4
|
+
interface IntrinsicElements {
|
|
5
|
+
'goa-card-content': React.HTMLAttributes<HTMLElement>;
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
interface Props {
|
|
10
|
+
children?: React.ReactNode;
|
|
11
|
+
}
|
|
12
|
+
export declare const GoACardContent: FC<Props>;
|
|
13
|
+
export default GoACardContent;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
interface WCProps {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
}
|
|
5
|
+
declare global {
|
|
6
|
+
namespace JSX {
|
|
7
|
+
interface IntrinsicElements {
|
|
8
|
+
'goa-card-group': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
interface Props {
|
|
13
|
+
children?: React.ReactNode;
|
|
14
|
+
}
|
|
15
|
+
export declare const GoACardGroup: FC<Props>;
|
|
16
|
+
export default GoACardGroup;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
interface WCProps {
|
|
3
|
+
src: string;
|
|
4
|
+
height: string;
|
|
5
|
+
}
|
|
6
|
+
declare global {
|
|
7
|
+
namespace JSX {
|
|
8
|
+
interface IntrinsicElements {
|
|
9
|
+
'goa-card-image': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
interface Props {
|
|
14
|
+
src: string;
|
|
15
|
+
height: string;
|
|
16
|
+
}
|
|
17
|
+
export declare const GoACardImage: FC<Props>;
|
|
18
|
+
export default GoACardImage;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
interface WCProps {
|
|
3
|
+
elevation: number;
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
}
|
|
6
|
+
declare global {
|
|
7
|
+
namespace JSX {
|
|
8
|
+
interface IntrinsicElements {
|
|
9
|
+
'goa-card': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
interface Props {
|
|
14
|
+
elevation: number;
|
|
15
|
+
children?: React.ReactNode;
|
|
16
|
+
}
|
|
17
|
+
export declare const GoACard: FC<Props>;
|
|
18
|
+
export default GoACard;
|
|
@@ -1,40 +1,31 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
declare global {
|
|
3
|
+
namespace JSX {
|
|
4
|
+
interface IntrinsicElements {
|
|
5
|
+
'goa-checkbox': CheckboxProps & React.HTMLAttributes<HTMLElement>;
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
interface CheckboxProps {
|
|
10
|
+
ref: React.RefObject<HTMLElement>;
|
|
11
|
+
name: string;
|
|
12
|
+
checked?: boolean;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
indeterminate?: boolean;
|
|
15
|
+
error?: boolean;
|
|
16
|
+
text?: string;
|
|
17
|
+
value?: string | number | boolean;
|
|
18
|
+
}
|
|
19
|
+
export interface Props {
|
|
20
|
+
name: string;
|
|
8
21
|
checked?: boolean;
|
|
9
|
-
/**
|
|
10
|
-
* Boolean indicating whether or not the checkbox is required.
|
|
11
|
-
*/
|
|
12
|
-
required?: boolean;
|
|
13
|
-
/**
|
|
14
|
-
* Boolean indicating whether or not the checkbox is disabled.
|
|
15
|
-
*/
|
|
16
22
|
disabled?: boolean;
|
|
17
|
-
/**
|
|
18
|
-
* Boolean indicating whether or not the checkbox should display as indeterminate (i.e. it has associated 'child' checkboxes, some of which are selected)
|
|
19
|
-
*/
|
|
20
23
|
indeterminate?: boolean;
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
* The content of the checkbox label.
|
|
27
|
-
*/
|
|
28
|
-
content?: string;
|
|
29
|
-
/**
|
|
30
|
-
* The value of the checkbox.
|
|
31
|
-
*/
|
|
32
|
-
value?: string;
|
|
33
|
-
children?: React.ReactNode;
|
|
34
|
-
/**
|
|
35
|
-
* Callback which returns whether button is checked.
|
|
36
|
-
*/
|
|
37
|
-
selectionChange?: (value: boolean) => void;
|
|
24
|
+
error?: boolean;
|
|
25
|
+
text?: string;
|
|
26
|
+
value?: string | number | boolean;
|
|
27
|
+
testId?: string;
|
|
28
|
+
onChange?: (name: string, checked: boolean, value: string) => void;
|
|
38
29
|
}
|
|
39
|
-
export declare const GoACheckbox:
|
|
30
|
+
export declare const GoACheckbox: FC<Props>;
|
|
40
31
|
export default GoACheckbox;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import React, { FC, ReactNode } from 'react';
|
|
2
|
+
declare type ContainerVariant = 'primary' | 'info' | 'error' | 'success' | 'warning' | 'default';
|
|
3
|
+
declare type HeadingSize = 'large' | 'small' | 'none';
|
|
4
|
+
interface WCProps {
|
|
5
|
+
variant: ContainerVariant;
|
|
6
|
+
headingsize: HeadingSize;
|
|
7
|
+
}
|
|
8
|
+
declare global {
|
|
9
|
+
namespace JSX {
|
|
10
|
+
interface IntrinsicElements {
|
|
11
|
+
'goa-container': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
interface Props {
|
|
16
|
+
headingSize: HeadingSize;
|
|
17
|
+
variant: ContainerVariant;
|
|
18
|
+
title: ReactNode;
|
|
19
|
+
actions: ReactNode;
|
|
20
|
+
children: ReactNode;
|
|
21
|
+
}
|
|
22
|
+
export declare const GoAContainer: FC<Props>;
|
|
23
|
+
export default GoAContainer;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React, { FC } from "react";
|
|
2
|
+
declare global {
|
|
3
|
+
namespace JSX {
|
|
4
|
+
interface IntrinsicElements {
|
|
5
|
+
'goa-dropdown-item': DropdownOptionProps & React.HTMLAttributes<HTMLElement>;
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
interface DropdownOptionProps {
|
|
10
|
+
name: string;
|
|
11
|
+
value: string;
|
|
12
|
+
label?: string;
|
|
13
|
+
}
|
|
14
|
+
interface Props {
|
|
15
|
+
name: string;
|
|
16
|
+
value: string;
|
|
17
|
+
label?: string;
|
|
18
|
+
testId?: string;
|
|
19
|
+
}
|
|
20
|
+
export declare const GoADropdownOption: FC<Props>;
|
|
21
|
+
export default GoADropdownOption;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import React, { FC } from "react";
|
|
2
|
+
import { GoAIconType } from "../icons";
|
|
3
|
+
export * from './dropdown-option';
|
|
4
|
+
interface DropdownProps {
|
|
5
|
+
ref: React.MutableRefObject<HTMLElement | null>;
|
|
6
|
+
name: string;
|
|
7
|
+
values: string;
|
|
8
|
+
leadingicon?: string;
|
|
9
|
+
maxheight?: number;
|
|
10
|
+
placeholder?: string;
|
|
11
|
+
autocomplete?: boolean;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
multiselect?: boolean;
|
|
14
|
+
}
|
|
15
|
+
declare global {
|
|
16
|
+
namespace JSX {
|
|
17
|
+
interface IntrinsicElements {
|
|
18
|
+
'goa-dropdown': DropdownProps & React.HTMLAttributes<HTMLElement>;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
interface Props {
|
|
23
|
+
name: string;
|
|
24
|
+
selectedValues: string[];
|
|
25
|
+
onChange: (name: string, values: string[]) => void;
|
|
26
|
+
disabled?: boolean;
|
|
27
|
+
autoComplete?: boolean;
|
|
28
|
+
leadingIcon?: GoAIconType;
|
|
29
|
+
maxHeight?: number;
|
|
30
|
+
multiSelect?: boolean;
|
|
31
|
+
placeholder?: string;
|
|
32
|
+
testId?: string;
|
|
33
|
+
}
|
|
34
|
+
export declare const GoADropdown: FC<Props>;
|
|
35
|
+
export default GoADropdown;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * as GoAFlexRow from './row';
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
interface WCProps {
|
|
3
|
+
name: string;
|
|
4
|
+
label: string;
|
|
5
|
+
optional?: boolean;
|
|
6
|
+
error?: string;
|
|
7
|
+
helptext?: string;
|
|
8
|
+
}
|
|
9
|
+
declare global {
|
|
10
|
+
namespace JSX {
|
|
11
|
+
interface IntrinsicElements {
|
|
12
|
+
'goa-form-item': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
interface GoAFormItemProps {
|
|
17
|
+
name: string;
|
|
18
|
+
label: string;
|
|
19
|
+
optional?: boolean;
|
|
20
|
+
error?: string;
|
|
21
|
+
helpText?: string;
|
|
22
|
+
}
|
|
23
|
+
export declare const GoAFormItem: FC<GoAFormItemProps>;
|
|
24
|
+
export default GoAFormItem;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * as GoAFormItem from './form-item';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export declare type FormValidatorFn = (val: string) => [boolean, string];
|
|
2
|
+
export declare class FormValidator {
|
|
3
|
+
private items;
|
|
4
|
+
constructor();
|
|
5
|
+
add(fieldName: string, validators: FormValidatorFn[]): void;
|
|
6
|
+
validate(data: Record<string, string>): Record<string, string>;
|
|
7
|
+
}
|
|
8
|
+
export declare const requiredFieldValidator: FormValidatorFn;
|
|
9
|
+
export declare const emailFormatValidator: FormValidatorFn;
|
|
10
|
+
export declare const phoneNumberFormatValidator: FormValidatorFn;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
interface WCProps {
|
|
3
|
+
title: string;
|
|
4
|
+
backgroundurl: string;
|
|
5
|
+
}
|
|
6
|
+
declare global {
|
|
7
|
+
namespace JSX {
|
|
8
|
+
interface IntrinsicElements {
|
|
9
|
+
'goa-hero-banner': WCProps & React.HTMLAttributes<HTMLElement>;
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
interface Props {
|
|
14
|
+
title: string;
|
|
15
|
+
backgroundUrl: string;
|
|
16
|
+
}
|
|
17
|
+
export declare const GoAHeroBanner: FC<Props>;
|
|
18
|
+
export default GoAHeroBanner;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import React, { FC } from 'react';
|
|
2
|
+
import { IconSize, GoAIconType, IconVariant } from './icon';
|
|
3
|
+
interface WCProps {
|
|
4
|
+
ref: React.RefObject<HTMLElement>;
|
|
5
|
+
type: GoAIconType;
|
|
6
|
+
size?: IconSize;
|
|
7
|
+
variant?: IconVariant;
|
|
8
|
+
title?: string;
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
}
|
|
11
|
+
declare global {
|
|
12
|
+
namespace JSX {
|
|
13
|
+
interface IntrinsicElements {
|
|
14
|
+
'goa-icon-button': WCProps & React.HTMLAttributes<HTMLButtonElement>;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
interface Props {
|
|
19
|
+
type: GoAIconType;
|
|
20
|
+
size?: IconSize;
|
|
21
|
+
variant?: IconVariant;
|
|
22
|
+
title?: string;
|
|
23
|
+
disabled?: boolean;
|
|
24
|
+
onClick: () => void;
|
|
25
|
+
}
|
|
26
|
+
export declare const GoAIconButton: FC<Props>;
|
|
27
|
+
export {};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
declare type GoAIconFilledType = `${GoAIconType}-${IconTheme}`;
|
|
3
|
+
interface IonIconProps {
|
|
4
|
+
name: GoAIconType | GoAIconFilledType;
|
|
5
|
+
}
|
|
6
|
+
interface IonIconElement extends HTMLElement {
|
|
7
|
+
}
|
|
8
|
+
declare global {
|
|
9
|
+
namespace JSX {
|
|
10
|
+
interface IntrinsicElements {
|
|
11
|
+
'ion-icon': IonIconProps & React.HTMLAttributes<IonIconElement>;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
declare global {
|
|
16
|
+
namespace JSX {
|
|
17
|
+
interface IntrinsicElements {
|
|
18
|
+
'goa-icon': WCProps & React.HTMLAttributes<IonIconElement>;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
export declare type GoAIconType = 'accessibility' | 'add-circle' | 'add' | 'airplane' | 'alarm' | 'albums' | 'alert-circle' | 'alert' | 'american-football' | 'analytics' | 'aperture' | 'apps' | 'archive' | 'arrow-back-circle' | 'arrow-back' | 'arrow-down-circle' | 'arrow-down' | 'arrow-forward-circle' | 'arrow-forward' | 'arrow-redo-circle' | 'arrow-redo' | 'arrow-undo-circle' | 'arrow-undo' | 'arrow-up-circle' | 'arrow-up' | 'at-circle' | 'at' | 'attach' | 'backspace' | 'bag-add' | 'bag-check' | 'bag-handle' | 'bag' | 'bag-remove' | 'balloon' | 'ban' | 'bandage' | 'bar-chart' | 'barbell' | 'barcode' | 'baseball' | 'basket' | 'basketball' | 'battery-charging' | 'battery-dead' | 'battery-full' | 'battery-half' | 'beaker' | 'bed' | 'beer' | 'bicycle' | 'bluetooth' | 'boat' | 'body' | 'bonfire' | 'book' | 'bookmark' | 'bookmarks' | 'bowling-ball' | 'briefcase' | 'browsers' | 'brush' | 'bug' | 'build' | 'bulb' | 'bus' | 'business' | 'cafe' | 'calculator' | 'calendar-clear' | 'calendar-number' | 'calendar' | 'call' | 'camera' | 'camera-reverse' | 'car' | 'car-sport' | 'card' | 'caret-back-circle' | 'caret-back' | 'caret-down-circle' | 'caret-down' | 'caret-forward-circle' | 'caret-forward' | 'caret-up-circle' | 'caret-up' | 'cart' | 'cash' | 'cellular' | 'chatbox-ellipses' | 'chatbox' | 'chatbubble-ellipses' | 'chatbubble' | 'chatbubbles' | 'checkbox' | 'checkmark-circle' | 'checkmark-done-circle' | 'checkmark-done' | 'checkmark' | 'chevron-back-circle' | 'chevron-back' | 'chevron-down-circle' | 'chevron-down' | 'chevron-forward-circle' | 'chevron-forward' | 'chevron-up-circle' | 'chevron-up' | 'clipboard' | 'close-circle' | 'close' | 'cloud-circle' | 'cloud-done' | 'cloud-download' | 'cloud-offline' | 'cloud' | 'cloud-upload' | 'cloudy-night' | 'cloudy' | 'code-download' | 'code' | 'code-slash' | 'code-working' | 'cog' | 'color-fill' | 'color-filter' | 'color-palette' | 'color-wand' | 'compass' | 'construct' | 'contract' | 'contrast' | 'copy' | 'create' | 'crop' | 'cube' | 'cut' | 'desktop' | 'diamond' | 'dice' | 'disc' | 'document-attach' | 'document-lock' | 'document' | 'document-text' | 'documents' | 'download' | 'duplicate' | 'ear' | 'earth' | 'easel' | 'egg' | 'ellipse' | 'ellipsis-horizontal-circle' | 'ellipsis-horizontal' | 'ellipsis-vertical-circle' | 'ellipsis-vertical' | 'enter' | 'exit' | 'expand' | 'extension-puzzle' | 'eye-off' | 'eye' | 'eyedrop' | 'fast-food' | 'female' | 'file-tray-full' | 'file-tray' | 'file-tray-stacked' | 'filenames.ps1' | 'film' | 'filter-circle' | 'filter' | 'finger-print' | 'fish' | 'fitness' | 'flag' | 'flame' | 'flash-off' | 'flash' | 'flashlight' | 'flask' | 'flower' | 'folder-open' | 'folder' | 'football' | 'footsteps' | 'funnel' | 'game-controller' | 'gift' | 'git-branch' | 'git-commit' | 'git-compare' | 'git-merge' | 'git-network' | 'git-pull-request' | 'glasses' | 'globe' | 'golf' | 'grid' | 'hammer' | 'hand-left' | 'hand-right' | 'happy' | 'hardware-chip' | 'headset' | 'heart-circle' | 'heart-dislike-circle' | 'heart-dislike' | 'heart-half' | 'heart' | 'help-buoy' | 'help-circle' | 'help' | 'home' | 'hourglass' | 'ice-cream' | 'id-card' | 'image' | 'images' | 'infinite' | 'information-circle' | 'information' | 'invert-mode' | 'journal' | 'key' | 'keypad' | 'language' | 'laptop' | 'layers' | 'leaf' | 'library' | 'link' | 'list-circle' | 'list' | 'locate' | 'location' | 'lock-closed' | 'lock-open' | 'log-in' | 'log-out' | 'magnet' | 'mail-open' | 'mail' | 'mail-unread' | 'male-female' | 'male' | 'man' | 'map' | 'medal' | 'medical' | 'medkit' | 'megaphone' | 'menu' | 'mic-circle' | 'mic-off-circle' | 'mic-off' | 'mic' | 'moon' | 'move' | 'musical-note' | 'musical-notes' | 'navigate-circle' | 'navigate' | 'newspaper' | 'notifications-circle' | 'notifications-off-circle' | 'notifications-off' | 'notifications' | 'nuclear' | 'nutrition' | 'open' | 'options' | 'paper-plane' | 'partly-sunny' | 'pause-circle' | 'pause' | 'paw' | 'pencil' | 'people-circle' | 'people' | 'person-add' | 'person-circle' | 'person' | 'person-remove' | 'phone-landscape' | 'phone-portrait' | 'pie-chart' | 'pin' | 'pint' | 'pizza' | 'planet' | 'play-back-circle' | 'play-back' | 'play-circle' | 'play-forward-circle' | 'play-forward' | 'play' | 'play-skip-back-circle' | 'play-skip-back' | 'play-skip-forward-circle' | 'play-skip-forward' | 'podium' | 'power' | 'pricetag' | 'pricetags' | 'print' | 'prism' | 'pulse' | 'push' | 'qr-code' | 'radio-button-off' | 'radio-button-on' | 'radio' | 'rainy' | 'reader' | 'receipt' | 'recording' | 'refresh-circle' | 'refresh' | 'reload-circle' | 'reload' | 'remove-circle' | 'remove' | 'reorder-four' | 'reorder-three' | 'reorder-two' | 'repeat' | 'resize' | 'restaurant' | 'return-down-back' | 'return-down-forward' | 'return-up-back' | 'return-up-forward' | 'ribbon' | 'rocket' | 'rose' | 'sad' | 'save' | 'scale' | 'scan-circle' | 'scan' | 'school' | 'search-circle' | 'search' | 'send' | 'server' | 'settings' | 'shapes' | 'share' | 'share-social' | 'shield-checkmark' | 'shield-half' | 'shield' | 'shirt' | 'shuffle' | 'skull' | 'snow' | 'sparkles' | 'speedometer' | 'square' | 'star-half' | 'star' | 'stats-chart' | 'stop-circle' | 'stop' | 'stopwatch' | 'storefront' | 'subway' | 'sunny' | 'swap-horizontal' | 'swap-vertical' | 'sync-circle' | 'sync' | 'tablet-landscape' | 'tablet-portrait' | 'telescope' | 'tennisball' | 'terminal' | 'text' | 'thermometer' | 'thumbs-down' | 'thumbs-up' | 'thunderstorm' | 'ticket' | 'time' | 'timer' | 'today' | 'toggle' | 'trail-sign' | 'train' | 'transgender' | 'trash-bin' | 'trash' | 'trending-down' | 'trending-up' | 'triangle' | 'trophy' | 'tv' | 'umbrella' | 'unlink' | 'videocam-off' | 'videocam' | 'volume-high' | 'volume-low' | 'volume-medium' | 'volume-mute' | 'volume-off' | 'walk' | 'wallet' | 'warning' | 'watch' | 'water' | 'wifi' | 'wine' | 'woman';
|
|
23
|
+
export declare type IconSize = 'small' | 'medium' | 'large' | 'xlarge';
|
|
24
|
+
export declare type IconVariant = 'primary' | 'secondary' | 'tertiary';
|
|
25
|
+
export declare type IconTheme = 'outline' | 'filled' | 'sharp';
|
|
26
|
+
interface Props {
|
|
27
|
+
type: GoAIconType;
|
|
28
|
+
size?: IconSize;
|
|
29
|
+
theme?: IconTheme;
|
|
30
|
+
}
|
|
31
|
+
interface WCProps {
|
|
32
|
+
type: GoAIconType;
|
|
33
|
+
theme: IconTheme;
|
|
34
|
+
size: IconSize;
|
|
35
|
+
}
|
|
36
|
+
export declare function GoAIcon({ type, theme, size }: Props): JSX.Element;
|
|
37
|
+
export {};
|