@bcgov/design-system-react-components 0.3.0 → 0.3.1-pr494
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 +3 -0
- package/dist/cjs/index.cjs +539 -54
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/types/components/AlertDialog/AlertDialog.d.ts +11 -0
- package/dist/cjs/types/components/AlertDialog/AlertDialog.test.d.ts +1 -0
- package/dist/cjs/types/components/AlertDialog/index.d.ts +2 -0
- package/dist/cjs/types/components/Dialog/Dialog.d.ts +11 -0
- package/dist/cjs/types/components/Dialog/Dialog.test.d.ts +1 -0
- package/dist/cjs/types/components/Dialog/index.d.ts +2 -0
- package/dist/cjs/types/components/Modal/Modal.d.ts +3 -0
- package/dist/cjs/types/components/Modal/Modal.test.d.ts +1 -0
- package/dist/cjs/types/components/Modal/index.d.ts +2 -0
- package/dist/cjs/types/components/index.d.ts +5 -2
- package/dist/esm/index.js +536 -55
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/AlertDialog/AlertDialog.d.ts +11 -0
- package/dist/esm/types/components/AlertDialog/AlertDialog.test.d.ts +1 -0
- package/dist/esm/types/components/AlertDialog/index.d.ts +2 -0
- package/dist/esm/types/components/Dialog/Dialog.d.ts +11 -0
- package/dist/esm/types/components/Dialog/Dialog.test.d.ts +1 -0
- package/dist/esm/types/components/Dialog/index.d.ts +2 -0
- package/dist/esm/types/components/Modal/Modal.d.ts +3 -0
- package/dist/esm/types/components/Modal/Modal.test.d.ts +1 -0
- package/dist/esm/types/components/Modal/index.d.ts +2 -0
- package/dist/esm/types/components/index.d.ts +5 -2
- package/dist/index.d.ts +53 -37
- package/package.json +17 -17
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { DialogTrigger, DialogProps as ReactAriaDialogProps } from "react-aria-components";
|
|
2
|
+
import "./AlertDialog.css";
|
|
3
|
+
export interface AlertDialogProps extends ReactAriaDialogProps {
|
|
4
|
+
variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
|
|
5
|
+
title?: string;
|
|
6
|
+
isIconHidden?: boolean;
|
|
7
|
+
isCloseable?: boolean;
|
|
8
|
+
buttons?: React.ReactNode;
|
|
9
|
+
}
|
|
10
|
+
export default function AlertDialog({ children, variant, role, title, isCloseable, isIconHidden, buttons, ...props }: AlertDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export { DialogTrigger };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "@testing-library/jest-dom";
|
|
@@ -0,0 +1,11 @@
|
|
|
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 interface DialogRenderProps {
|
|
7
|
+
/** Handler function to close the Dialog */
|
|
8
|
+
close: () => void;
|
|
9
|
+
}
|
|
10
|
+
export default function Dialog({ isCloseable, role, children, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export { DialogTrigger };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "@testing-library/jest-dom";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "@testing-library/jest-dom";
|
|
@@ -1,12 +1,15 @@
|
|
|
1
1
|
import "@bcgov/design-tokens/css/variables.css";
|
|
2
|
-
export { default as
|
|
2
|
+
export { default as AlertDialog } from "./AlertDialog";
|
|
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 Dialog, DialogTrigger } from "./Dialog";
|
|
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";
|
|
10
13
|
export { default as Radio } from "./Radio";
|
|
11
14
|
export { default as RadioGroup } from "./RadioGroup";
|
|
12
15
|
export { default as Select } from "./Select";
|
package/dist/index.d.ts
CHANGED
|
@@ -1,19 +1,16 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
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';
|
|
2
|
+
import { DialogProps as DialogProps$1, ButtonProps as ButtonProps$1, CheckboxProps, CheckboxGroupProps as CheckboxGroupProps$1, ValidationResult, FormProps, ModalOverlayProps, 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 { DialogTrigger, TooltipTrigger } from 'react-aria-components';
|
|
4
4
|
import { PropsWithChildren } from 'react';
|
|
5
5
|
|
|
6
|
-
interface
|
|
7
|
-
variant?: "info" | "
|
|
6
|
+
interface AlertDialogProps extends DialogProps$1 {
|
|
7
|
+
variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
|
|
8
8
|
title?: string;
|
|
9
|
-
description?: string;
|
|
10
|
-
buttons?: React.ReactNode;
|
|
11
|
-
isCloseable?: boolean;
|
|
12
9
|
isIconHidden?: boolean;
|
|
13
|
-
|
|
14
|
-
|
|
10
|
+
isCloseable?: boolean;
|
|
11
|
+
buttons?: React.ReactNode;
|
|
15
12
|
}
|
|
16
|
-
declare function
|
|
13
|
+
declare function AlertDialog({ children, variant, role, title, isCloseable, isIconHidden, buttons, ...props }: AlertDialogProps): react_jsx_runtime.JSX.Element;
|
|
17
14
|
|
|
18
15
|
interface ButtonProps extends ButtonProps$1 {
|
|
19
16
|
/**
|
|
@@ -54,33 +51,10 @@ interface CheckboxGroupProps extends CheckboxGroupProps$1 {
|
|
|
54
51
|
}
|
|
55
52
|
declare function CheckboxGroup({ orientation, label, description, errorMessage, flexWrap, children, ...props }: CheckboxGroupProps): react_jsx_runtime.JSX.Element;
|
|
56
53
|
|
|
57
|
-
interface
|
|
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";
|
|
54
|
+
interface DialogProps extends DialogProps$1 {
|
|
55
|
+
isCloseable?: boolean;
|
|
82
56
|
}
|
|
83
|
-
declare function
|
|
57
|
+
declare function Dialog({ isCloseable, role, children, ...props }: DialogProps): react_jsx_runtime.JSX.Element;
|
|
84
58
|
|
|
85
59
|
interface FooterLinksProps {
|
|
86
60
|
/**
|
|
@@ -146,6 +120,48 @@ declare function Footer({ children, acknowledgement, logo, contact, links, copyr
|
|
|
146
120
|
|
|
147
121
|
declare function Form({ ...props }: FormProps): react_jsx_runtime.JSX.Element;
|
|
148
122
|
|
|
123
|
+
interface HeaderProps {
|
|
124
|
+
/**
|
|
125
|
+
* Link element that surrounds the logo. Use what's appropriate for your
|
|
126
|
+
* router, like a `<Link>`. Defaults to a generic HTML link element like
|
|
127
|
+
* `<a href="/" title="Government of British Columbia">`
|
|
128
|
+
*/
|
|
129
|
+
logoLinkElement?: React.ReactElement;
|
|
130
|
+
/**
|
|
131
|
+
* Image used for the logo. Defaults to an SVG of the Government of B.C. logo.
|
|
132
|
+
*/
|
|
133
|
+
logoImage?: JSX.Element;
|
|
134
|
+
/**
|
|
135
|
+
* Array of link elements that are not visible until they are focused. Used
|
|
136
|
+
* for accessibility for keyboard users, to let them easily skip to main
|
|
137
|
+
* content, navigation, etc.
|
|
138
|
+
*/
|
|
139
|
+
skipLinks?: React.ReactElement[];
|
|
140
|
+
/**
|
|
141
|
+
* Header title text that appears to the right of the logo.
|
|
142
|
+
*/
|
|
143
|
+
title?: string;
|
|
144
|
+
/**
|
|
145
|
+
* Desired element that renders the `title` string. Defaults to `<span>`.
|
|
146
|
+
*/
|
|
147
|
+
titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "p";
|
|
148
|
+
}
|
|
149
|
+
declare function Header({ children, logoLinkElement, logoImage, skipLinks, title, titleElement, }: PropsWithChildren<HeaderProps>): react_jsx_runtime.JSX.Element;
|
|
150
|
+
|
|
151
|
+
interface InlineAlertProps extends React.PropsWithChildren {
|
|
152
|
+
variant?: "info" | "success" | "warning" | "danger";
|
|
153
|
+
title?: string;
|
|
154
|
+
description?: string;
|
|
155
|
+
buttons?: React.ReactNode;
|
|
156
|
+
isCloseable?: boolean;
|
|
157
|
+
isIconHidden?: boolean;
|
|
158
|
+
role?: React.AriaRole | undefined;
|
|
159
|
+
onClose?: () => void;
|
|
160
|
+
}
|
|
161
|
+
declare function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, buttons, children, onClose, ...props }: InlineAlertProps): react_jsx_runtime.JSX.Element;
|
|
162
|
+
|
|
163
|
+
declare function Modal({ children, ...props }: ModalOverlayProps): react_jsx_runtime.JSX.Element;
|
|
164
|
+
|
|
149
165
|
declare function Radio({ value, children, ...props }: RadioProps): react_jsx_runtime.JSX.Element;
|
|
150
166
|
|
|
151
167
|
interface RadioGroupProps extends RadioGroupProps$1 {
|
|
@@ -302,4 +318,4 @@ declare function Switch({ labelPosition, children, ...props }: SwitchProps): rea
|
|
|
302
318
|
|
|
303
319
|
declare function Tooltip(props: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
304
320
|
|
|
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 };
|
|
321
|
+
export { AlertDialog, Button, ButtonGroup, Checkbox, CheckboxGroup, Dialog, Footer, FooterLinks, Form, Header, InlineAlert, Modal, 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,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bcgov/design-system-react-components",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.1-pr494",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"rollup": "rm -rf dist && rollup -c --bundleConfigAsCjs",
|
|
@@ -37,41 +37,41 @@
|
|
|
37
37
|
"@rollup/plugin-json": "6.1.0",
|
|
38
38
|
"@rollup/plugin-node-resolve": "15.2.3",
|
|
39
39
|
"@rollup/plugin-typescript": "11.1.6",
|
|
40
|
-
"@storybook/addon-a11y": "8.3.
|
|
41
|
-
"@storybook/addon-essentials": "8.3.
|
|
42
|
-
"@storybook/addon-interactions": "8.3.
|
|
43
|
-
"@storybook/addon-links": "8.3.
|
|
44
|
-
"@storybook/blocks": "8.3.
|
|
45
|
-
"@storybook/react": "8.3.
|
|
46
|
-
"@storybook/react-vite": "8.3.
|
|
47
|
-
"@storybook/test": "8.3.
|
|
40
|
+
"@storybook/addon-a11y": "8.3.2",
|
|
41
|
+
"@storybook/addon-essentials": "8.3.2",
|
|
42
|
+
"@storybook/addon-interactions": "8.3.2",
|
|
43
|
+
"@storybook/addon-links": "8.3.2",
|
|
44
|
+
"@storybook/blocks": "8.3.2",
|
|
45
|
+
"@storybook/react": "8.3.2",
|
|
46
|
+
"@storybook/react-vite": "8.3.2",
|
|
47
|
+
"@storybook/test": "8.3.2",
|
|
48
48
|
"@storybook/test-runner": "0.19.1",
|
|
49
49
|
"@testing-library/jest-dom": "6.5.0",
|
|
50
50
|
"@testing-library/react": "16.0.1",
|
|
51
51
|
"@types/jest": "29.5.13",
|
|
52
|
-
"@types/react": "18.3.
|
|
52
|
+
"@types/react": "18.3.8",
|
|
53
53
|
"@types/react-dom": "18.3.0",
|
|
54
|
-
"@typescript-eslint/eslint-plugin": "8.
|
|
55
|
-
"@typescript-eslint/parser": "8.
|
|
54
|
+
"@typescript-eslint/eslint-plugin": "8.6.0",
|
|
55
|
+
"@typescript-eslint/parser": "8.6.0",
|
|
56
56
|
"@vitejs/plugin-react": "4.3.1",
|
|
57
57
|
"axe-playwright": "2.0.2",
|
|
58
58
|
"eslint": "8.57.0",
|
|
59
59
|
"eslint-plugin-react-hooks": "4.6.2",
|
|
60
|
-
"eslint-plugin-react-refresh": "0.4.
|
|
60
|
+
"eslint-plugin-react-refresh": "0.4.12",
|
|
61
61
|
"eslint-plugin-storybook": "0.8.0",
|
|
62
62
|
"identity-obj-proxy": "3.0.0",
|
|
63
63
|
"jest": "29.7.0",
|
|
64
64
|
"jest-environment-jsdom": "29.7.0",
|
|
65
|
-
"rollup": "4.
|
|
65
|
+
"rollup": "4.22.0",
|
|
66
66
|
"rollup-plugin-dts": "6.1.1",
|
|
67
67
|
"rollup-plugin-peer-deps-external": "2.2.4",
|
|
68
68
|
"rollup-plugin-postcss": "4.0.2",
|
|
69
|
-
"storybook": "8.3.
|
|
69
|
+
"storybook": "8.3.2",
|
|
70
70
|
"ts-jest": "29.2.5",
|
|
71
71
|
"ts-node": "10.9.2",
|
|
72
72
|
"tslib": "2.7.0",
|
|
73
|
-
"typescript": "5.
|
|
74
|
-
"vite": "5.4.
|
|
73
|
+
"typescript": "5.6.2",
|
|
74
|
+
"vite": "5.4.6"
|
|
75
75
|
},
|
|
76
76
|
"optionalDependencies": {
|
|
77
77
|
"@rollup/rollup-linux-x64-gnu": "*"
|