@bcgov/design-system-react-components 0.3.0 → 0.3.1-rc1

package/dist/esm/types/components/AlertDialog/AlertDialog.d.ts

@@ -0,0 +1,11 @@
+import { DialogTrigger, DialogProps as ReactAriaDialogProps } from "react-aria-components";
+import "./AlertDialog.css";
+export interface AlertDialogProps extends ReactAriaDialogProps {
+    variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
+    title?: string;
+    isIconHidden?: boolean;
+    isCloseable?: boolean;
+    buttons?: React.ReactNode;
+}
+export default function AlertDialog({ children, variant, role, title, isCloseable, isIconHidden, buttons, ...props }: AlertDialogProps): import("react/jsx-runtime").JSX.Element;
+export { DialogTrigger };

package/dist/esm/types/components/AlertDialog/AlertDialog.test.d.ts

@@ -0,0 +1 @@
+import "@testing-library/jest-dom";

package/dist/esm/types/components/AlertDialog/index.d.ts

@@ -0,0 +1,2 @@
+export { default, DialogTrigger } from "./AlertDialog";
+export type { AlertDialogProps } from "./AlertDialog";

package/dist/esm/types/components/Dialog/Dialog.d.ts

@@ -0,0 +1,11 @@
+import { DialogTrigger, DialogProps as ReactAriaDialogProps } from "react-aria-components";
+import "./Dialog.css";
+export interface DialogProps extends ReactAriaDialogProps {
+    isCloseable?: boolean;
+}
+export interface DialogRenderProps {
+    /** Handler function to close the Dialog */
+    close: () => void;
+}
+export default function Dialog({ isCloseable, role, children, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;
+export { DialogTrigger };

package/dist/esm/types/components/Dialog/Dialog.test.d.ts

@@ -0,0 +1 @@
+import "@testing-library/jest-dom";

package/dist/esm/types/components/Dialog/index.d.ts

@@ -0,0 +1,2 @@
+export { default, DialogTrigger } from "./Dialog";
+export type { DialogProps } from "./Dialog";

package/dist/esm/types/components/Modal/Modal.d.ts

@@ -0,0 +1,3 @@
+import { ModalOverlayProps } from "react-aria-components";
+import "./Modal.css";
+export default function Modal({ children, ...props }: ModalOverlayProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/components/Modal/Modal.test.d.ts

@@ -0,0 +1 @@
+import "@testing-library/jest-dom";

package/dist/esm/types/components/Modal/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./Modal";
+export type { ModalOverlayProps } from "react-aria-components";

package/dist/esm/types/components/index.d.ts

@@ -1,12 +1,15 @@
 import "@bcgov/design-tokens/css/variables.css";
-export { default as InlineAlert } from "./InlineAlert";
+export { default as AlertDialog } from "./AlertDialog";
 export { default as Button } from "./Button";
 export { default as ButtonGroup } from "./ButtonGroup";
 export { default as Checkbox } from "./Checkbox";
 export { default as CheckboxGroup } from "./CheckboxGroup";
-export { default as Header } from "./Header";
+export { default as Dialog, DialogTrigger } from "./Dialog";
 export { default as Footer, FooterLinks } from "./Footer";
 export { default as Form } from "./Form";
+export { default as Header } from "./Header";
+export { default as InlineAlert } from "./InlineAlert";
+export { default as Modal } from "./Modal";
 export { default as Radio } from "./Radio";
 export { default as RadioGroup } from "./RadioGroup";
 export { default as Select } from "./Select";

package/dist/index.d.ts

@@ -1,19 +1,16 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-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';
-export { TooltipTrigger } from 'react-aria-components';
+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';
+export { DialogTrigger, TooltipTrigger } from 'react-aria-components';
 import { PropsWithChildren } from 'react';
 
-interface InlineAlertProps extends React.PropsWithChildren {
-    variant?: "info" | "success" | "warning" | "danger";
+interface AlertDialogProps extends DialogProps$1 {
+    variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
     title?: string;
-    description?: string;
-    buttons?: React.ReactNode;
-    isCloseable?: boolean;
     isIconHidden?: boolean;
-    role?: React.AriaRole | undefined;
-    onClose?: () => void;
+    isCloseable?: boolean;
+    buttons?: React.ReactNode;
 }
-declare function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, buttons, children, onClose, ...props }: InlineAlertProps): react_jsx_runtime.JSX.Element;
+declare function AlertDialog({ children, variant, role, title, isCloseable, isIconHidden, buttons, ...props }: AlertDialogProps): react_jsx_runtime.JSX.Element;
 
 interface ButtonProps extends ButtonProps$1 {
     /**
@@ -54,33 +51,10 @@ interface CheckboxGroupProps extends CheckboxGroupProps$1 {
 }
 declare function CheckboxGroup({ orientation, label, description, errorMessage, flexWrap, children, ...props }: CheckboxGroupProps): react_jsx_runtime.JSX.Element;
 
-interface HeaderProps {
-    /**
-     * Link element that surrounds the logo. Use what's appropriate for your
-     * router, like a `<Link>`. Defaults to a generic HTML link element like
-     * `<a href="/" title="Government of British Columbia">`
-     */
-    logoLinkElement?: React.ReactElement;
-    /**
-     * Image used for the logo. Defaults to an SVG of the Government of B.C. logo.
-     */
-    logoImage?: JSX.Element;
-    /**
-     * Array of link elements that are not visible until they are focused. Used
-     * for accessibility for keyboard users, to let them easily skip to main
-     * content, navigation, etc.
-     */
-    skipLinks?: React.ReactElement[];
-    /**
-     * Header title text that appears to the right of the logo.
-     */
-    title?: string;
-    /**
-     * Desired element that renders the `title` string. Defaults to `<span>`.
-     */
-    titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "p";
+interface DialogProps extends DialogProps$1 {
+    isCloseable?: boolean;
 }
-declare function Header({ children, logoLinkElement, logoImage, skipLinks, title, titleElement, }: PropsWithChildren<HeaderProps>): react_jsx_runtime.JSX.Element;
+declare function Dialog({ isCloseable, role, children, ...props }: DialogProps): react_jsx_runtime.JSX.Element;
 
 interface FooterLinksProps {
     /**
@@ -146,6 +120,48 @@ declare function Footer({ children, acknowledgement, logo, contact, links, copyr
 
 declare function Form({ ...props }: FormProps): react_jsx_runtime.JSX.Element;
 
+interface HeaderProps {
+    /**
+     * Link element that surrounds the logo. Use what's appropriate for your
+     * router, like a `<Link>`. Defaults to a generic HTML link element like
+     * `<a href="/" title="Government of British Columbia">`
+     */
+    logoLinkElement?: React.ReactElement;
+    /**
+     * Image used for the logo. Defaults to an SVG of the Government of B.C. logo.
+     */
+    logoImage?: JSX.Element;
+    /**
+     * Array of link elements that are not visible until they are focused. Used
+     * for accessibility for keyboard users, to let them easily skip to main
+     * content, navigation, etc.
+     */
+    skipLinks?: React.ReactElement[];
+    /**
+     * Header title text that appears to the right of the logo.
+     */
+    title?: string;
+    /**
+     * Desired element that renders the `title` string. Defaults to `<span>`.
+     */
+    titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "p";
+}
+declare function Header({ children, logoLinkElement, logoImage, skipLinks, title, titleElement, }: PropsWithChildren<HeaderProps>): react_jsx_runtime.JSX.Element;
+
+interface InlineAlertProps extends React.PropsWithChildren {
+    variant?: "info" | "success" | "warning" | "danger";
+    title?: string;
+    description?: string;
+    buttons?: React.ReactNode;
+    isCloseable?: boolean;
+    isIconHidden?: boolean;
+    role?: React.AriaRole | undefined;
+    onClose?: () => void;
+}
+declare function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, buttons, children, onClose, ...props }: InlineAlertProps): react_jsx_runtime.JSX.Element;
+
+declare function Modal({ children, ...props }: ModalOverlayProps): react_jsx_runtime.JSX.Element;
+
 declare function Radio({ value, children, ...props }: RadioProps): react_jsx_runtime.JSX.Element;
 
 interface RadioGroupProps extends RadioGroupProps$1 {
@@ -302,4 +318,4 @@ declare function Switch({ labelPosition, children, ...props }: SwitchProps): rea
 
 declare function Tooltip(props: TooltipProps): react_jsx_runtime.JSX.Element;
 
-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 };
+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

@@ -1,6 +1,6 @@
 {
   "name": "@bcgov/design-system-react-components",
-  "version": "0.3.0",
+  "version": "0.3.1-rc1",
   "type": "module",
   "scripts": {
     "rollup": "rm -rf dist && rollup -c --bundleConfigAsCjs",
@@ -37,41 +37,41 @@
     "@rollup/plugin-json": "6.1.0",
     "@rollup/plugin-node-resolve": "15.2.3",
     "@rollup/plugin-typescript": "11.1.6",
-    "@storybook/addon-a11y": "8.3.0",
-    "@storybook/addon-essentials": "8.3.0",
-    "@storybook/addon-interactions": "8.3.0",
-    "@storybook/addon-links": "8.3.0",
-    "@storybook/blocks": "8.3.0",
-    "@storybook/react": "8.3.0",
-    "@storybook/react-vite": "8.3.0",
-    "@storybook/test": "8.3.0",
+    "@storybook/addon-a11y": "8.3.2",
+    "@storybook/addon-essentials": "8.3.2",
+    "@storybook/addon-interactions": "8.3.2",
+    "@storybook/addon-links": "8.3.2",
+    "@storybook/blocks": "8.3.2",
+    "@storybook/react": "8.3.2",
+    "@storybook/react-vite": "8.3.2",
+    "@storybook/test": "8.3.2",
     "@storybook/test-runner": "0.19.1",
     "@testing-library/jest-dom": "6.5.0",
     "@testing-library/react": "16.0.1",
     "@types/jest": "29.5.13",
-    "@types/react": "18.3.5",
+    "@types/react": "18.3.8",
     "@types/react-dom": "18.3.0",
-    "@typescript-eslint/eslint-plugin": "8.5.0",
-    "@typescript-eslint/parser": "8.5.0",
+    "@typescript-eslint/eslint-plugin": "8.6.0",
+    "@typescript-eslint/parser": "8.6.0",
     "@vitejs/plugin-react": "4.3.1",
     "axe-playwright": "2.0.2",
     "eslint": "8.57.0",
     "eslint-plugin-react-hooks": "4.6.2",
-    "eslint-plugin-react-refresh": "0.4.11",
+    "eslint-plugin-react-refresh": "0.4.12",
     "eslint-plugin-storybook": "0.8.0",
     "identity-obj-proxy": "3.0.0",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
-    "rollup": "4.21.3",
+    "rollup": "4.22.0",
     "rollup-plugin-dts": "6.1.1",
     "rollup-plugin-peer-deps-external": "2.2.4",
     "rollup-plugin-postcss": "4.0.2",
-    "storybook": "8.3.0",
+    "storybook": "8.3.2",
     "ts-jest": "29.2.5",
     "ts-node": "10.9.2",
     "tslib": "2.7.0",
-    "typescript": "5.5.4",
-    "vite": "5.4.4"
+    "typescript": "5.6.2",
+    "vite": "5.4.6"
   },
   "optionalDependencies": {
     "@rollup/rollup-linux-x64-gnu": "*"