@bcgov/design-system-react-components 0.4.0 → 0.4.1-rc1
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 +68 -17
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/types/components/AlertBanner/AlertBanner.d.ts +10 -0
- package/dist/cjs/types/components/AlertBanner/index.d.ts +2 -0
- package/dist/cjs/types/components/Callout/Callout.d.ts +10 -0
- package/dist/cjs/types/components/Callout/index.d.ts +2 -0
- package/dist/cjs/types/components/Icons/SvgBcOutlineIcon/SvgBcOutlineIcon.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgBcOutlineIcon/index.d.ts +1 -0
- package/dist/cjs/types/components/Icons/SvgBetaIcon/SvgBetaIcon.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgBetaIcon/index.d.ts +1 -0
- package/dist/cjs/types/components/Tag/Tag.d.ts +9 -1
- package/dist/cjs/types/components/index.d.ts +4 -0
- package/dist/esm/index.js +65 -18
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/AlertBanner/AlertBanner.d.ts +10 -0
- package/dist/esm/types/components/AlertBanner/index.d.ts +2 -0
- package/dist/esm/types/components/Callout/Callout.d.ts +10 -0
- package/dist/esm/types/components/Callout/index.d.ts +2 -0
- package/dist/esm/types/components/Icons/SvgBcOutlineIcon/SvgBcOutlineIcon.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgBcOutlineIcon/index.d.ts +1 -0
- package/dist/esm/types/components/Icons/SvgBetaIcon/SvgBetaIcon.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgBetaIcon/index.d.ts +1 -0
- package/dist/esm/types/components/Tag/Tag.d.ts +9 -1
- package/dist/esm/types/components/index.d.ts +4 -0
- package/dist/index.d.ts +38 -2
- package/package.json +1 -1
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import "./AlertBanner.css";
|
|
2
|
+
export interface AlertBannerProps extends React.PropsWithChildren {
|
|
3
|
+
variant?: "info" | "success" | "warning" | "danger" | "black";
|
|
4
|
+
isIconHidden?: boolean;
|
|
5
|
+
isCloseable?: boolean;
|
|
6
|
+
role?: React.AriaRole | undefined;
|
|
7
|
+
customIcon?: React.ReactNode;
|
|
8
|
+
onClose?: () => void;
|
|
9
|
+
}
|
|
10
|
+
export default function AlertBanner({ variant, isIconHidden, isCloseable, role, onClose, children, customIcon, ...props }: AlertBannerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import "./Callout.css";
|
|
2
|
+
export interface CalloutProps extends React.PropsWithChildren {
|
|
3
|
+
variant?: "lightGrey" | "lightBlue" | "lightGold" | "Blue" | "Grey" | "Black";
|
|
4
|
+
title?: string;
|
|
5
|
+
description?: string;
|
|
6
|
+
buttons?: React.ReactNode;
|
|
7
|
+
role?: React.AriaRole | undefined;
|
|
8
|
+
isLeftBorderDisabled?: boolean;
|
|
9
|
+
}
|
|
10
|
+
export default function Callout({ variant, title, description, buttons, role, isLeftBorderDisabled, children, ...props }: CalloutProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "./SvgBcOutlineIcon";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "./SvgBetaIcon";
|
|
@@ -9,5 +9,13 @@ export interface TagProps extends ReactAriaTagProps {
|
|
|
9
9
|
* Background color
|
|
10
10
|
*/
|
|
11
11
|
color?: "bc-blue" | "bc-gold" | "blue" | "dark" | "gray" | "grey" | "green" | "red" | "yellow";
|
|
12
|
+
/**
|
|
13
|
+
* tagStyle
|
|
14
|
+
*/
|
|
15
|
+
tagStyle?: "rectangular" | "circular";
|
|
16
|
+
/**
|
|
17
|
+
* size
|
|
18
|
+
*/
|
|
19
|
+
size?: "small" | "medium";
|
|
12
20
|
}
|
|
13
|
-
export default function Tag({ color, icon, id, textValue }: TagProps): import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
export default function Tag({ color, tagStyle, size, icon, id, textValue, }: TagProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import "@bcgov/design-tokens/css/variables.css";
|
|
2
|
+
export { default as AlertBanner } from "./AlertBanner";
|
|
2
3
|
export { default as AlertDialog } from "./AlertDialog";
|
|
3
4
|
export { default as Button } from "./Button";
|
|
4
5
|
export { default as ButtonGroup } from "./ButtonGroup";
|
|
6
|
+
export { default as Callout } from "./Callout";
|
|
5
7
|
export { default as Checkbox } from "./Checkbox";
|
|
6
8
|
export { default as CheckboxGroup } from "./CheckboxGroup";
|
|
7
9
|
export { default as Dialog, DialogTrigger } from "./Dialog";
|
|
@@ -14,6 +16,8 @@ export { default as Radio } from "./Radio";
|
|
|
14
16
|
export { default as RadioGroup } from "./RadioGroup";
|
|
15
17
|
export { default as Select } from "./Select";
|
|
16
18
|
export { default as SvgBcLogo } from "./Icons/SvgBcLogo";
|
|
19
|
+
export { default as SvgBcOutlineIcon } from "./Icons/SvgBcOutlineIcon";
|
|
20
|
+
export { default as SvgBetaIcon } from "./Icons/SvgBetaIcon";
|
|
17
21
|
export { default as SvgCheckIcon } from "./Icons/SvgCheckIcon";
|
|
18
22
|
export { default as SvgCheckCircleIcon } from "./Icons/SvgCheckCircleIcon";
|
|
19
23
|
export { default as SvgDashIcon } from "./Icons/SvgDashIcon";
|
package/dist/index.d.ts
CHANGED
|
@@ -3,6 +3,16 @@ import { DialogProps as DialogProps$1, ButtonProps as ButtonProps$1, CheckboxPro
|
|
|
3
3
|
export { DialogTrigger, TooltipTrigger } from 'react-aria-components';
|
|
4
4
|
import { PropsWithChildren } from 'react';
|
|
5
5
|
|
|
6
|
+
interface AlertBannerProps extends React.PropsWithChildren {
|
|
7
|
+
variant?: "info" | "success" | "warning" | "danger" | "black";
|
|
8
|
+
isIconHidden?: boolean;
|
|
9
|
+
isCloseable?: boolean;
|
|
10
|
+
role?: React.AriaRole | undefined;
|
|
11
|
+
customIcon?: React.ReactNode;
|
|
12
|
+
onClose?: () => void;
|
|
13
|
+
}
|
|
14
|
+
declare function AlertBanner({ variant, isIconHidden, isCloseable, role, onClose, children, customIcon, ...props }: AlertBannerProps): react_jsx_runtime.JSX.Element;
|
|
15
|
+
|
|
6
16
|
interface AlertDialogProps extends DialogProps$1 {
|
|
7
17
|
variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
|
|
8
18
|
title?: string;
|
|
@@ -39,6 +49,16 @@ interface ButtonGroupProps extends React.PropsWithChildren {
|
|
|
39
49
|
}
|
|
40
50
|
declare function ButtonGroup({ orientation, alignment, ariaLabel, children, ...props }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
|
|
41
51
|
|
|
52
|
+
interface CalloutProps extends React.PropsWithChildren {
|
|
53
|
+
variant?: "lightGrey" | "lightBlue" | "lightGold" | "Blue" | "Grey" | "Black";
|
|
54
|
+
title?: string;
|
|
55
|
+
description?: string;
|
|
56
|
+
buttons?: React.ReactNode;
|
|
57
|
+
role?: React.AriaRole | undefined;
|
|
58
|
+
isLeftBorderDisabled?: boolean;
|
|
59
|
+
}
|
|
60
|
+
declare function Callout({ variant, title, description, buttons, role, isLeftBorderDisabled, children, ...props }: CalloutProps): react_jsx_runtime.JSX.Element;
|
|
61
|
+
|
|
42
62
|
declare function Checkbox({ value, children, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
|
|
43
63
|
|
|
44
64
|
interface CheckboxGroupProps extends CheckboxGroupProps$1 {
|
|
@@ -217,6 +237,14 @@ declare function SvgBcLogo({ id }: {
|
|
|
217
237
|
id?: string | undefined;
|
|
218
238
|
}): react_jsx_runtime.JSX.Element;
|
|
219
239
|
|
|
240
|
+
declare function SvgBcOutlineIcon({ id }: {
|
|
241
|
+
id?: string | undefined;
|
|
242
|
+
}): react_jsx_runtime.JSX.Element;
|
|
243
|
+
|
|
244
|
+
declare function SvgBetaIcon({ id }: {
|
|
245
|
+
id?: string | undefined;
|
|
246
|
+
}): react_jsx_runtime.JSX.Element;
|
|
247
|
+
|
|
220
248
|
declare function SvgCheckIcon({ id }: {
|
|
221
249
|
id?: string | undefined;
|
|
222
250
|
}): react_jsx_runtime.JSX.Element;
|
|
@@ -266,8 +294,16 @@ interface TagProps extends TagProps$1 {
|
|
|
266
294
|
* Background color
|
|
267
295
|
*/
|
|
268
296
|
color?: "bc-blue" | "bc-gold" | "blue" | "dark" | "gray" | "grey" | "green" | "red" | "yellow";
|
|
297
|
+
/**
|
|
298
|
+
* tagStyle
|
|
299
|
+
*/
|
|
300
|
+
tagStyle?: "rectangular" | "circular";
|
|
301
|
+
/**
|
|
302
|
+
* size
|
|
303
|
+
*/
|
|
304
|
+
size?: "small" | "medium";
|
|
269
305
|
}
|
|
270
|
-
declare function Tag({ color, icon, id, textValue }: TagProps): react_jsx_runtime.JSX.Element;
|
|
306
|
+
declare function Tag({ color, tagStyle, size, icon, id, textValue, }: TagProps): react_jsx_runtime.JSX.Element;
|
|
271
307
|
|
|
272
308
|
interface TagGroupProps extends TagGroupProps$1 {
|
|
273
309
|
/**
|
|
@@ -318,4 +354,4 @@ declare function Switch({ labelPosition, children, ...props }: SwitchProps): rea
|
|
|
318
354
|
|
|
319
355
|
declare function Tooltip(props: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
320
356
|
|
|
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 };
|
|
357
|
+
export { AlertBanner, AlertDialog, Button, ButtonGroup, Callout, Checkbox, CheckboxGroup, Dialog, Footer, FooterLinks, Form, Header, InlineAlert, Modal, Radio, RadioGroup, Select, SvgBcLogo, SvgBcOutlineIcon, SvgBetaIcon, SvgCheckCircleIcon, SvgCheckIcon, SvgChevronDownIcon, SvgChevronUpIcon, SvgCloseIcon, SvgDashIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, SvgTooltipArrowUp, Switch, Tag, TagGroup, TagList, TextArea, TextField, Tooltip };
|