@bcgov/design-system-react-components 0.4.0 → 0.5.0-pr507

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

@@ -0,0 +1,6 @@
+import { DisclosureProps as DisclosureProps } from "react-aria-components";
+import "./Accordion.css";
+export interface AccordionProps extends DisclosureProps {
+    label?: string;
+}
+export default function Accordion({ label, children, ...props }: AccordionProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+export { default } from "./Accordion";
+export type { AccordionProps } from "./Accordion";

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

@@ -0,0 +1,7 @@
+import { DisclosureGroupProps } from "react-aria-components";
+import "./AccordionGroup.css";
+export interface AccordionGroupProps extends DisclosureGroupProps {
+    title?: string;
+    titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+}
+export default function AccordionGroup({ title, titleElement, children, ...props }: AccordionGroupProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+export { default } from "./AccordionGroup";
+export type { AccordionGroupProps } from "./AccordionGroup";

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

@@ -0,0 +1,10 @@
+import "./AlertBanner.css";
+export interface AlertBannerProps extends React.PropsWithChildren {
+    variant?: "info" | "success" | "warning" | "danger" | "black";
+    isIconHidden?: boolean;
+    isCloseable?: boolean;
+    role?: React.AriaRole | undefined;
+    customIcon?: React.ReactNode;
+    onClose?: () => void;
+}
+export default function AlertBanner({ variant, isIconHidden, isCloseable, role, onClose, children, customIcon, ...props }: AlertBannerProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+export { default } from "./AlertBanner";
+export type { AlertBannerProps } from "./AlertBanner";

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

@@ -0,0 +1,10 @@
+import "./Callout.css";
+export interface CalloutProps extends React.PropsWithChildren {
+    variant?: "lightGrey" | "lightBlue" | "lightGold" | "Blue" | "Grey" | "Black";
+    title?: string;
+    description?: string;
+    buttons?: React.ReactNode;
+    role?: React.AriaRole | undefined;
+    isLeftBorderDisabled?: boolean;
+}
+export default function Callout({ variant, title, description, buttons, role, isLeftBorderDisabled, children, ...props }: CalloutProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+export { default } from "./Callout";
+export type { CalloutProps } from "./Callout";

package/dist/esm/types/components/Icons/SvgBcOutlineIcon/SvgBcOutlineIcon.d.ts

@@ -0,0 +1,3 @@
+export default function SvgBcOutlineIcon({ id }: {
+    id?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export { default } from "./SvgBcOutlineIcon";

package/dist/esm/types/components/Icons/SvgBetaIcon/SvgBetaIcon.d.ts

@@ -0,0 +1,3 @@
+export default function SvgBetaIcon({ id }: {
+    id?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export { default } from "./SvgBetaIcon";

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

@@ -0,0 +1,15 @@
+import { LinkProps as ReactAriaLinkProps } from "react-aria-components";
+import "./Link.css";
+import "../Button/Button.css";
+export interface LinkProps extends ReactAriaLinkProps {
+    children?: React.ReactNode;
+    size?: "small" | "medium" | "large";
+    isButton?: boolean;
+    buttonVariant?: "primary" | "secondary" | "tertiary";
+    ariaLabel?: string | undefined;
+    danger?: boolean;
+    isUnstyled?: boolean;
+    iconLeft?: React.ReactElement;
+    iconRight?: React.ReactElement;
+}
+export default function Link({ children, size, danger, isButton, buttonVariant, isUnstyled, iconLeft, iconRight, ariaLabel, ...props }: LinkProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+export { default } from "./Link";
+export type { LinkProps } from "./Link";

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

@@ -9,5 +9,13 @@ export interface TagProps extends ReactAriaTagProps {
      * Background color
      */
     color?: "bc-blue" | "bc-gold" | "blue" | "dark" | "gray" | "grey" | "green" | "red" | "yellow";
+    /**
+     * tagStyle
+     */
+    tagStyle?: "rectangular" | "circular";
+    /**
+     * size
+     */
+    size?: "small" | "medium";
 }
-export default function Tag({ color, icon, id, textValue }: TagProps): import("react/jsx-runtime").JSX.Element;
+export default function Tag({ color, tagStyle, size, icon, id, textValue, }: TagProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,7 +1,11 @@
 import "@bcgov/design-tokens/css/variables.css";
+export { default as Accordion } from "./Accordion";
+export { default as AccordionGroup } from "./AccordionGroup";
+export { default as AlertBanner } from "./AlertBanner";
 export { default as AlertDialog } from "./AlertDialog";
 export { default as Button } from "./Button";
 export { default as ButtonGroup } from "./ButtonGroup";
+export { default as Callout } from "./Callout";
 export { default as Checkbox } from "./Checkbox";
 export { default as CheckboxGroup } from "./CheckboxGroup";
 export { default as Dialog, DialogTrigger } from "./Dialog";
@@ -9,11 +13,14 @@ 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 Link } from "./Link";
 export { default as Modal } from "./Modal";
 export { default as Radio } from "./Radio";
 export { default as RadioGroup } from "./RadioGroup";
 export { default as Select } from "./Select";
 export { default as SvgBcLogo } from "./Icons/SvgBcLogo";
+export { default as SvgBcOutlineIcon } from "./Icons/SvgBcOutlineIcon";
+export { default as SvgBetaIcon } from "./Icons/SvgBetaIcon";
 export { default as SvgCheckIcon } from "./Icons/SvgCheckIcon";
 export { default as SvgCheckCircleIcon } from "./Icons/SvgCheckCircleIcon";
 export { default as SvgDashIcon } from "./Icons/SvgDashIcon";

package/dist/index.d.ts

@@ -1,8 +1,29 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-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';
+import { DisclosureProps, DisclosureGroupProps, DialogProps as DialogProps$1, ButtonProps as ButtonProps$1, CheckboxProps, CheckboxGroupProps as CheckboxGroupProps$1, ValidationResult, FormProps, LinkProps as LinkProps$1, 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 AccordionProps extends DisclosureProps {
+    label?: string;
+}
+declare function Accordion({ label, children, ...props }: AccordionProps): react_jsx_runtime.JSX.Element;
+
+interface AccordionGroupProps extends DisclosureGroupProps {
+    title?: string;
+    titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+}
+declare function AccordionGroup({ title, titleElement, children, ...props }: AccordionGroupProps): react_jsx_runtime.JSX.Element;
+
+interface AlertBannerProps extends React.PropsWithChildren {
+    variant?: "info" | "success" | "warning" | "danger" | "black";
+    isIconHidden?: boolean;
+    isCloseable?: boolean;
+    role?: React.AriaRole | undefined;
+    customIcon?: React.ReactNode;
+    onClose?: () => void;
+}
+declare function AlertBanner({ variant, isIconHidden, isCloseable, role, onClose, children, customIcon, ...props }: AlertBannerProps): react_jsx_runtime.JSX.Element;
+
 interface AlertDialogProps extends DialogProps$1 {
     variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
     title?: string;
@@ -39,6 +60,16 @@ interface ButtonGroupProps extends React.PropsWithChildren {
 }
 declare function ButtonGroup({ orientation, alignment, ariaLabel, children, ...props }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
 
+interface CalloutProps extends React.PropsWithChildren {
+    variant?: "lightGrey" | "lightBlue" | "lightGold" | "Blue" | "Grey" | "Black";
+    title?: string;
+    description?: string;
+    buttons?: React.ReactNode;
+    role?: React.AriaRole | undefined;
+    isLeftBorderDisabled?: boolean;
+}
+declare function Callout({ variant, title, description, buttons, role, isLeftBorderDisabled, children, ...props }: CalloutProps): react_jsx_runtime.JSX.Element;
+
 declare function Checkbox({ value, children, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
 
 interface CheckboxGroupProps extends CheckboxGroupProps$1 {
@@ -160,6 +191,19 @@ interface InlineAlertProps extends React.PropsWithChildren {
 }
 declare function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, buttons, children, onClose, ...props }: InlineAlertProps): react_jsx_runtime.JSX.Element;
 
+interface LinkProps extends LinkProps$1 {
+    children?: React.ReactNode;
+    size?: "small" | "medium" | "large";
+    isButton?: boolean;
+    buttonVariant?: "primary" | "secondary" | "tertiary";
+    ariaLabel?: string | undefined;
+    danger?: boolean;
+    isUnstyled?: boolean;
+    iconLeft?: React.ReactElement;
+    iconRight?: React.ReactElement;
+}
+declare function Link({ children, size, danger, isButton, buttonVariant, isUnstyled, iconLeft, iconRight, ariaLabel, ...props }: LinkProps): 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;
@@ -217,6 +261,14 @@ declare function SvgBcLogo({ id }: {
     id?: string | undefined;
 }): react_jsx_runtime.JSX.Element;
 
+declare function SvgBcOutlineIcon({ id }: {
+    id?: string | undefined;
+}): react_jsx_runtime.JSX.Element;
+
+declare function SvgBetaIcon({ id }: {
+    id?: string | undefined;
+}): react_jsx_runtime.JSX.Element;
+
 declare function SvgCheckIcon({ id }: {
     id?: string | undefined;
 }): react_jsx_runtime.JSX.Element;
@@ -266,8 +318,16 @@ interface TagProps extends TagProps$1 {
      * Background color
      */
     color?: "bc-blue" | "bc-gold" | "blue" | "dark" | "gray" | "grey" | "green" | "red" | "yellow";
+    /**
+     * tagStyle
+     */
+    tagStyle?: "rectangular" | "circular";
+    /**
+     * size
+     */
+    size?: "small" | "medium";
 }
-declare function Tag({ color, icon, id, textValue }: TagProps): react_jsx_runtime.JSX.Element;
+declare function Tag({ color, tagStyle, size, icon, id, textValue, }: TagProps): react_jsx_runtime.JSX.Element;
 
 interface TagGroupProps extends TagGroupProps$1 {
     /**
@@ -318,4 +378,4 @@ declare function Switch({ labelPosition, children, ...props }: SwitchProps): rea
 
 declare function Tooltip(props: TooltipProps): react_jsx_runtime.JSX.Element;
 
-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 };
+export { Accordion, AccordionGroup, AlertBanner, AlertDialog, Button, ButtonGroup, Callout, Checkbox, CheckboxGroup, Dialog, Footer, FooterLinks, Form, Header, InlineAlert, Link, Modal, Radio, RadioGroup, Select, SvgBcLogo, SvgBcOutlineIcon, SvgBetaIcon, 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.4.0",
+  "version": "0.5.0-pr507",
   "type": "module",
   "scripts": {
     "rollup": "rm -rf dist && rollup -c --bundleConfigAsCjs",
@@ -23,13 +23,13 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@bcgov/design-tokens": "3.1.1",
-    "react-aria-components": "1.3.3"
+    "@bcgov/design-tokens": "3.2.0",
+    "react-aria-components": "1.5.0"
   },
   "peerDependencies": {
     "@bcgov/bc-sans": "^2.1.0",
-    "react": "^16.14.0 || ^17.0.0-rc.1 || ^18.0.0",
-    "react-dom": "^16.14.0 || ^17.0.0-rc.1 || ^18.0.0"
+    "react": "^16.14.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0",
+    "react-dom": "^16.14.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
   },
   "devDependencies": {
     "@react-stately/data": "3.11.6",
@@ -37,15 +37,15 @@
     "@rollup/plugin-json": "6.1.0",
     "@rollup/plugin-node-resolve": "15.2.3",
     "@rollup/plugin-typescript": "11.1.6",
-    "@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",
+    "@storybook/addon-a11y": "8.4.7",
+    "@storybook/addon-essentials": "8.4.7",
+    "@storybook/addon-interactions": "8.4.7",
+    "@storybook/addon-links": "8.4.7",
+    "@storybook/blocks": "8.4.7",
+    "@storybook/react": "8.4.7",
+    "@storybook/react-vite": "8.4.7",
+    "@storybook/test": "8.4.7",
+    "@storybook/test-runner": "0.20.1",
     "@testing-library/jest-dom": "6.5.0",
     "@testing-library/react": "16.0.1",
     "@types/jest": "29.5.13",
@@ -66,7 +66,7 @@
     "rollup-plugin-dts": "6.1.1",
     "rollup-plugin-peer-deps-external": "2.2.4",
     "rollup-plugin-postcss": "4.0.2",
-    "storybook": "8.3.2",
+    "storybook": "8.4.7",
     "ts-jest": "29.2.5",
     "ts-node": "10.9.2",
     "tslib": "2.7.0",