Update themed components to respect theme from SpaceKitProvider

src/AlertBanner/AlertBanner.tsx

@@ -10,6 +10,7 @@ import { IconInfoSolid } from "../icons/IconInfoSolid";
 import { IconWarningSolid } from "../icons/IconWarningSolid";
 import { IconErrorSolid } from "../icons/IconErrorSolid";
 import { IconSuccessSolid } from "../icons/IconSuccessSolid";
+import { useSpaceKitProvider } from "../SpaceKitProvider";
 
 interface AlertBannerProps {
   /**
@@ -45,10 +46,13 @@ interface AlertBannerProps {
 export const AlertBanner: React.FC<AlertBannerProps> = ({
   children,
   childrenContainerAs = "div",
-  theme = "light",
+  theme: propTheme,
   type,
   ...otherProps
 }) => {
+  const { theme: providerTheme } = useSpaceKitProvider();
+  const theme = propTheme || providerTheme;
+
   const { Icon, color } = useMemo(() => {
     switch (type) {
       case "info":

src/AlertCard/AlertCard.tsx

@@ -14,6 +14,7 @@ import { IconWarningSolid } from "../icons/IconWarningSolid";
 import { IconErrorSolid } from "../icons/IconErrorSolid";
 import { IconSuccessSolid } from "../icons/IconSuccessSolid";
 import { Button } from "../Button";
+import { useSpaceKitProvider } from "../SpaceKitProvider";
 
 interface AlertCardProps {
   /**
@@ -83,11 +84,14 @@ export const AlertCard: React.FC<AlertCardProps> = ({
   actions,
   headingAs = "h2",
   children,
-  theme = "light",
+  theme: propTheme,
   extended = false,
   type,
   ...otherProps
 }) => {
+  const { theme: providerTheme } = useSpaceKitProvider();
+  const theme = propTheme || providerTheme;
+
   const { Icon, color } = useMemo(() => {
     switch (type) {
       case "info":