@bcgov/design-system-react-components 0.2.4-rc3 → 0.3.0-pr491
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/dist/cjs/index.cjs +63 -548
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/types/components/index.d.ts +2 -5
- package/dist/esm/index.js +64 -545
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/index.d.ts +2 -5
- package/dist/index.d.ts +37 -54
- package/package.json +1 -1
- package/dist/cjs/types/components/AlertDialog/AlertDialog.d.ts +0 -13
- package/dist/cjs/types/components/AlertDialog/index.d.ts +0 -2
- package/dist/cjs/types/components/Dialog/Dialog.d.ts +0 -7
- package/dist/cjs/types/components/Dialog/index.d.ts +0 -2
- package/dist/cjs/types/components/Modal/Modal.d.ts +0 -3
- package/dist/cjs/types/components/Modal/index.d.ts +0 -2
- package/dist/cjs/types/components/ModalOverlay/ModalOverlay.d.ts +0 -3
- package/dist/cjs/types/components/ModalOverlay/index.d.ts +0 -2
- package/dist/esm/types/components/AlertDialog/AlertDialog.d.ts +0 -13
- package/dist/esm/types/components/AlertDialog/index.d.ts +0 -2
- package/dist/esm/types/components/Dialog/Dialog.d.ts +0 -7
- package/dist/esm/types/components/Dialog/index.d.ts +0 -2
- package/dist/esm/types/components/Modal/Modal.d.ts +0 -3
- package/dist/esm/types/components/Modal/index.d.ts +0 -2
- package/dist/esm/types/components/ModalOverlay/ModalOverlay.d.ts +0 -3
- package/dist/esm/types/components/ModalOverlay/index.d.ts +0 -2
|
@@ -1,15 +1,12 @@
|
|
|
1
1
|
import "@bcgov/design-tokens/css/variables.css";
|
|
2
|
-
export { default as
|
|
2
|
+
export { default as InlineAlert } from "./InlineAlert";
|
|
3
3
|
export { default as Button } from "./Button";
|
|
4
4
|
export { default as ButtonGroup } from "./ButtonGroup";
|
|
5
5
|
export { default as Checkbox } from "./Checkbox";
|
|
6
6
|
export { default as CheckboxGroup } from "./CheckboxGroup";
|
|
7
|
-
export { default as
|
|
7
|
+
export { default as Header } from "./Header";
|
|
8
8
|
export { default as Footer, FooterLinks } from "./Footer";
|
|
9
9
|
export { default as Form } from "./Form";
|
|
10
|
-
export { default as Header } from "./Header";
|
|
11
|
-
export { default as InlineAlert } from "./InlineAlert";
|
|
12
|
-
export { default as Modal } from "./Modal";
|
|
13
10
|
export { default as Radio } from "./Radio";
|
|
14
11
|
export { default as RadioGroup } from "./RadioGroup";
|
|
15
12
|
export { default as Select } from "./Select";
|
package/dist/index.d.ts
CHANGED
|
@@ -1,17 +1,19 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import {
|
|
3
|
-
export {
|
|
4
|
-
import
|
|
2
|
+
import { ButtonProps as ButtonProps$1, CheckboxProps, CheckboxGroupProps as CheckboxGroupProps$1, ValidationResult, FormProps, RadioProps, RadioGroupProps as RadioGroupProps$1, SelectProps as SelectProps$1, ListBoxItemProps as ListBoxItemProps$1, Key, TagProps as TagProps$1, TagGroupProps as TagGroupProps$1, TagListProps as TagListProps$1, TextFieldProps as TextFieldProps$1, SwitchProps as SwitchProps$1, TooltipProps } from 'react-aria-components';
|
|
3
|
+
export { TooltipTrigger } from 'react-aria-components';
|
|
4
|
+
import { PropsWithChildren } from 'react';
|
|
5
5
|
|
|
6
|
-
interface
|
|
7
|
-
variant?: "info" | "
|
|
6
|
+
interface InlineAlertProps extends React.PropsWithChildren {
|
|
7
|
+
variant?: "info" | "success" | "warning" | "danger";
|
|
8
8
|
title?: string;
|
|
9
9
|
description?: string;
|
|
10
|
-
|
|
10
|
+
buttons?: React.ReactNode;
|
|
11
11
|
isCloseable?: boolean;
|
|
12
|
-
|
|
12
|
+
isIconHidden?: boolean;
|
|
13
|
+
role?: React.AriaRole | undefined;
|
|
14
|
+
onClose?: () => void;
|
|
13
15
|
}
|
|
14
|
-
declare function
|
|
16
|
+
declare function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, buttons, children, onClose, ...props }: InlineAlertProps): react_jsx_runtime.JSX.Element;
|
|
15
17
|
|
|
16
18
|
interface ButtonProps extends ButtonProps$1 {
|
|
17
19
|
/**
|
|
@@ -52,10 +54,33 @@ interface CheckboxGroupProps extends CheckboxGroupProps$1 {
|
|
|
52
54
|
}
|
|
53
55
|
declare function CheckboxGroup({ orientation, label, description, errorMessage, flexWrap, children, ...props }: CheckboxGroupProps): react_jsx_runtime.JSX.Element;
|
|
54
56
|
|
|
55
|
-
interface
|
|
56
|
-
|
|
57
|
+
interface HeaderProps {
|
|
58
|
+
/**
|
|
59
|
+
* Link element that surrounds the logo. Use what's appropriate for your
|
|
60
|
+
* router, like a `<Link>`. Defaults to a generic HTML link element like
|
|
61
|
+
* `<a href="/" title="Government of British Columbia">`
|
|
62
|
+
*/
|
|
63
|
+
logoLinkElement?: React.ReactElement;
|
|
64
|
+
/**
|
|
65
|
+
* Image used for the logo. Defaults to an SVG of the Government of B.C. logo.
|
|
66
|
+
*/
|
|
67
|
+
logoImage?: JSX.Element;
|
|
68
|
+
/**
|
|
69
|
+
* Array of link elements that are not visible until they are focused. Used
|
|
70
|
+
* for accessibility for keyboard users, to let them easily skip to main
|
|
71
|
+
* content, navigation, etc.
|
|
72
|
+
*/
|
|
73
|
+
skipLinks?: React.ReactElement[];
|
|
74
|
+
/**
|
|
75
|
+
* Header title text that appears to the right of the logo.
|
|
76
|
+
*/
|
|
77
|
+
title?: string;
|
|
78
|
+
/**
|
|
79
|
+
* Desired element that renders the `title` string. Defaults to `<span>`.
|
|
80
|
+
*/
|
|
81
|
+
titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "p";
|
|
57
82
|
}
|
|
58
|
-
declare function
|
|
83
|
+
declare function Header({ children, logoLinkElement, logoImage, skipLinks, title, titleElement, }: PropsWithChildren<HeaderProps>): react_jsx_runtime.JSX.Element;
|
|
59
84
|
|
|
60
85
|
interface FooterLinksProps {
|
|
61
86
|
/**
|
|
@@ -121,48 +146,6 @@ declare function Footer({ children, acknowledgement, logo, contact, links, copyr
|
|
|
121
146
|
|
|
122
147
|
declare function Form({ ...props }: FormProps): react_jsx_runtime.JSX.Element;
|
|
123
148
|
|
|
124
|
-
interface HeaderProps {
|
|
125
|
-
/**
|
|
126
|
-
* Link element that surrounds the logo. Use what's appropriate for your
|
|
127
|
-
* router, like a `<Link>`. Defaults to a generic HTML link element like
|
|
128
|
-
* `<a href="/" title="Government of British Columbia">`
|
|
129
|
-
*/
|
|
130
|
-
logoLinkElement?: React.ReactElement;
|
|
131
|
-
/**
|
|
132
|
-
* Image used for the logo. Defaults to an SVG of the Government of B.C. logo.
|
|
133
|
-
*/
|
|
134
|
-
logoImage?: JSX.Element;
|
|
135
|
-
/**
|
|
136
|
-
* Array of link elements that are not visible until they are focused. Used
|
|
137
|
-
* for accessibility for keyboard users, to let them easily skip to main
|
|
138
|
-
* content, navigation, etc.
|
|
139
|
-
*/
|
|
140
|
-
skipLinks?: React.ReactElement[];
|
|
141
|
-
/**
|
|
142
|
-
* Header title text that appears to the right of the logo.
|
|
143
|
-
*/
|
|
144
|
-
title?: string;
|
|
145
|
-
/**
|
|
146
|
-
* Desired element that renders the `title` string. Defaults to `<span>`.
|
|
147
|
-
*/
|
|
148
|
-
titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "p";
|
|
149
|
-
}
|
|
150
|
-
declare function Header({ children, logoLinkElement, logoImage, skipLinks, title, titleElement, }: PropsWithChildren<HeaderProps>): react_jsx_runtime.JSX.Element;
|
|
151
|
-
|
|
152
|
-
interface InlineAlertProps extends React.PropsWithChildren {
|
|
153
|
-
variant?: "info" | "success" | "warning" | "danger";
|
|
154
|
-
title?: string;
|
|
155
|
-
description?: string;
|
|
156
|
-
buttons?: React.ReactNode;
|
|
157
|
-
isCloseable?: boolean;
|
|
158
|
-
isIconHidden?: boolean;
|
|
159
|
-
role?: React.AriaRole | undefined;
|
|
160
|
-
onClose?: () => void;
|
|
161
|
-
}
|
|
162
|
-
declare function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, buttons, children, onClose, ...props }: InlineAlertProps): react_jsx_runtime.JSX.Element;
|
|
163
|
-
|
|
164
|
-
declare function Modal({ children, ...props }: ModalOverlayProps): react_jsx_runtime.JSX.Element;
|
|
165
|
-
|
|
166
149
|
declare function Radio({ value, children, ...props }: RadioProps): react_jsx_runtime.JSX.Element;
|
|
167
150
|
|
|
168
151
|
interface RadioGroupProps extends RadioGroupProps$1 {
|
|
@@ -319,4 +302,4 @@ declare function Switch({ labelPosition, children, ...props }: SwitchProps): rea
|
|
|
319
302
|
|
|
320
303
|
declare function Tooltip(props: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
321
304
|
|
|
322
|
-
export {
|
|
305
|
+
export { Button, ButtonGroup, Checkbox, CheckboxGroup, Footer, FooterLinks, Form, Header, InlineAlert, Radio, RadioGroup, Select, SvgBcLogo, SvgCheckCircleIcon, SvgCheckIcon, SvgChevronDownIcon, SvgChevronUpIcon, SvgCloseIcon, SvgDashIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, SvgTooltipArrowUp, Switch, Tag, TagGroup, TagList, TextArea, TextField, Tooltip };
|
package/package.json
CHANGED
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { DialogTrigger, DialogProps as ReactAriaDialogProps } from "react-aria-components";
|
|
2
|
-
import "./AlertDialog.css";
|
|
3
|
-
import React from "react";
|
|
4
|
-
export interface AlertDialogProps extends ReactAriaDialogProps {
|
|
5
|
-
variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
|
|
6
|
-
title?: string;
|
|
7
|
-
description?: string;
|
|
8
|
-
isIconHidden?: boolean;
|
|
9
|
-
isCloseable?: boolean;
|
|
10
|
-
buttons?: React.ReactNode;
|
|
11
|
-
}
|
|
12
|
-
export default function AlertDialog({ variant, role, title, isCloseable, isIconHidden, description, buttons, ...props }: AlertDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
-
export { DialogTrigger };
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { DialogTrigger, DialogProps as ReactAriaDialogProps } from "react-aria-components";
|
|
2
|
-
import "./Dialog.css";
|
|
3
|
-
export interface DialogProps extends ReactAriaDialogProps {
|
|
4
|
-
isCloseable?: boolean;
|
|
5
|
-
}
|
|
6
|
-
export default function Dialog({ isCloseable, role, children, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
-
export { DialogTrigger };
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { DialogTrigger, DialogProps as ReactAriaDialogProps } from "react-aria-components";
|
|
2
|
-
import "./AlertDialog.css";
|
|
3
|
-
import React from "react";
|
|
4
|
-
export interface AlertDialogProps extends ReactAriaDialogProps {
|
|
5
|
-
variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
|
|
6
|
-
title?: string;
|
|
7
|
-
description?: string;
|
|
8
|
-
isIconHidden?: boolean;
|
|
9
|
-
isCloseable?: boolean;
|
|
10
|
-
buttons?: React.ReactNode;
|
|
11
|
-
}
|
|
12
|
-
export default function AlertDialog({ variant, role, title, isCloseable, isIconHidden, description, buttons, ...props }: AlertDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
-
export { DialogTrigger };
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { DialogTrigger, DialogProps as ReactAriaDialogProps } from "react-aria-components";
|
|
2
|
-
import "./Dialog.css";
|
|
3
|
-
export interface DialogProps extends ReactAriaDialogProps {
|
|
4
|
-
isCloseable?: boolean;
|
|
5
|
-
}
|
|
6
|
-
export default function Dialog({ isCloseable, role, children, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
-
export { DialogTrigger };
|