@atom-learning/components 7.0.0 → 8.0.1

package/dist/components/banner/banner-regular/BannerRegular.d.ts

@@ -5,9 +5,7 @@ export declare const BannerRegular: {
     displayName: string;
 } & {
     Content: {
-        (props: React.ComponentProps<React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-            ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-        }, "size"> & {
+        (props: React.ComponentProps<React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "size"> & {
             size?: ("sm" | "md" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md">>) | undefined;
         } & {
             as?: React.ElementType;
@@ -15,11 +13,11 @@ export declare const BannerRegular: {
         displayName: string;
     };
     Heading: {
-        (props: React.ComponentProps<typeof import("../..").Heading>): React.JSX.Element;
+        (props: React.ComponentPropsWithoutRef<typeof import("../..").Heading>): React.JSX.Element;
         displayName: string;
     };
     Text: {
-        (props: React.ComponentProps<typeof import("../..").Text>): React.JSX.Element;
+        (props: React.ComponentPropsWithoutRef<typeof import("../..").Text>): React.JSX.Element;
         displayName: string;
     };
     Actions: {
@@ -27,7 +25,7 @@ export declare const BannerRegular: {
         displayName: string;
     };
     Image: {
-        (props: React.ComponentProps<typeof import("../..").Image>): React.JSX.Element;
+        (props: React.ComponentPropsWithoutRef<typeof import("../..").Image>): React.JSX.Element;
         displayName: string;
     };
     Button: {
@@ -49,24 +47,73 @@ export declare const BannerRegular: {
             style?: React.CSSProperties | undefined;
             title?: string | undefined | undefined;
             ref?: React.Ref<HTMLButtonElement> | undefined;
+            as?: React.ElementType | undefined;
             className?: string | undefined | undefined;
+            key?: React.Key | null | undefined;
+            value?: string | number | readonly string[] | undefined;
+            name?: string | undefined | undefined;
+            defaultChecked?: boolean | undefined | undefined;
+            defaultValue?: string | number | readonly string[] | undefined;
+            suppressContentEditableWarning?: boolean | undefined | undefined;
+            suppressHydrationWarning?: boolean | undefined | undefined;
+            accessKey?: string | undefined | undefined;
+            autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
+            autoFocus?: boolean | undefined | undefined;
+            contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+            contextMenu?: string | undefined | undefined;
+            dir?: string | undefined | undefined;
+            draggable?: (boolean | "true" | "false") | undefined;
+            enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
+            hidden?: boolean | undefined | undefined;
             id?: string | undefined | undefined;
             lang?: string | undefined | undefined;
-            name?: string | undefined | undefined;
-            type?: "submit" | "reset" | "button" | undefined | undefined;
-            role?: React.AriaRole | undefined;
+            nonce?: string | undefined | undefined;
+            spellCheck?: (boolean | "true" | "false") | undefined;
             tabIndex?: number | undefined | undefined;
+            radioGroup?: string | undefined | undefined;
+            role?: React.AriaRole | undefined;
+            about?: string | undefined | undefined;
+            datatype?: string | undefined | undefined;
+            inlist?: any;
+            property?: string | undefined | undefined;
+            rel?: string | undefined | undefined;
+            resource?: string | undefined | undefined;
+            rev?: string | undefined | undefined;
+            typeof?: string | undefined | undefined;
+            vocab?: string | undefined | undefined;
+            autoCorrect?: string | undefined | undefined;
+            autoSave?: string | undefined | undefined;
+            itemProp?: string | undefined | undefined;
+            itemScope?: boolean | undefined | undefined;
+            itemType?: string | undefined | undefined;
+            itemID?: string | undefined | undefined;
+            itemRef?: string | undefined | undefined;
+            results?: number | undefined | undefined;
+            security?: string | undefined | undefined;
+            unselectable?: "on" | "off" | undefined | undefined;
+            popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
+            popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
+            popoverTarget?: string | undefined | undefined;
+            inert?: boolean | undefined | undefined;
+            inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
+            is?: string | undefined | undefined;
+            exportparts?: string | undefined | undefined;
+            part?: string | undefined | undefined;
             "aria-activedescendant"?: string | undefined | undefined;
             "aria-atomic"?: (boolean | "true" | "false") | undefined;
             "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
+            "aria-braillelabel"?: string | undefined | undefined;
+            "aria-brailleroledescription"?: string | undefined | undefined;
             "aria-busy"?: (boolean | "true" | "false") | undefined;
             "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
             "aria-colcount"?: number | undefined | undefined;
             "aria-colindex"?: number | undefined | undefined;
+            "aria-colindextext"?: string | undefined | undefined;
             "aria-colspan"?: number | undefined | undefined;
             "aria-controls"?: string | undefined | undefined;
             "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
             "aria-describedby"?: string | undefined | undefined;
+            "aria-description"?: string | undefined | undefined;
             "aria-details"?: string | undefined | undefined;
             "aria-disabled"?: (boolean | "true" | "false") | undefined;
             "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
@@ -96,6 +143,7 @@ export declare const BannerRegular: {
             "aria-roledescription"?: string | undefined | undefined;
             "aria-rowcount"?: number | undefined | undefined;
             "aria-rowindex"?: number | undefined | undefined;
+            "aria-rowindextext"?: string | undefined | undefined;
             "aria-rowspan"?: number | undefined | undefined;
             "aria-selected"?: (boolean | "true" | "false") | undefined;
             "aria-setsize"?: number | undefined | undefined;
@@ -123,18 +171,18 @@ export declare const BannerRegular: {
             onFocusCapture?: React.FocusEventHandler<HTMLButtonElement> | undefined;
             onBlur?: React.FocusEventHandler<HTMLButtonElement> | undefined;
             onBlurCapture?: React.FocusEventHandler<HTMLButtonElement> | undefined;
-            onChange?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onChangeCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onBeforeInput?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onBeforeInputCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onInput?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onInputCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onReset?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onResetCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onSubmit?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onSubmitCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onInvalid?: React.FormEventHandler<HTMLButtonElement> | undefined;
-            onInvalidCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
+            onChange?: React.ChangeEventHandler<HTMLButtonElement, Element> | undefined;
+            onChangeCapture?: React.ChangeEventHandler<HTMLButtonElement, Element> | undefined;
+            onBeforeInput?: React.InputEventHandler<HTMLButtonElement> | undefined;
+            onBeforeInputCapture?: React.InputEventHandler<HTMLButtonElement> | undefined;
+            onInput?: React.InputEventHandler<HTMLButtonElement> | undefined;
+            onInputCapture?: React.InputEventHandler<HTMLButtonElement> | undefined;
+            onReset?: React.ReactEventHandler<HTMLButtonElement> | undefined;
+            onResetCapture?: React.ReactEventHandler<HTMLButtonElement> | undefined;
+            onSubmit?: React.SubmitEventHandler<HTMLButtonElement> | undefined;
+            onSubmitCapture?: React.SubmitEventHandler<HTMLButtonElement> | undefined;
+            onInvalid?: React.ReactEventHandler<HTMLButtonElement> | undefined;
+            onInvalidCapture?: React.ReactEventHandler<HTMLButtonElement> | undefined;
             onLoad?: React.ReactEventHandler<HTMLButtonElement> | undefined;
             onLoadCapture?: React.ReactEventHandler<HTMLButtonElement> | undefined;
             onError?: React.ReactEventHandler<HTMLButtonElement> | undefined;
@@ -243,9 +291,7 @@ export declare const BannerRegular: {
             onPointerCancel?: React.PointerEventHandler<HTMLButtonElement> | undefined;
             onPointerCancelCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
             onPointerEnter?: React.PointerEventHandler<HTMLButtonElement> | undefined;
-            onPointerEnterCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
             onPointerLeave?: React.PointerEventHandler<HTMLButtonElement> | undefined;
-            onPointerLeaveCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
             onPointerOver?: React.PointerEventHandler<HTMLButtonElement> | undefined;
             onPointerOverCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
             onPointerOut?: React.PointerEventHandler<HTMLButtonElement> | undefined;
@@ -256,6 +302,8 @@ export declare const BannerRegular: {
             onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
             onScroll?: React.UIEventHandler<HTMLButtonElement> | undefined;
             onScrollCapture?: React.UIEventHandler<HTMLButtonElement> | undefined;
+            onScrollEnd?: React.UIEventHandler<HTMLButtonElement> | undefined;
+            onScrollEndCapture?: React.UIEventHandler<HTMLButtonElement> | undefined;
             onWheel?: React.WheelEventHandler<HTMLButtonElement> | undefined;
             onWheelCapture?: React.WheelEventHandler<HTMLButtonElement> | undefined;
             onAnimationStart?: React.AnimationEventHandler<HTMLButtonElement> | undefined;
@@ -264,50 +312,19 @@ export declare const BannerRegular: {
             onAnimationEndCapture?: React.AnimationEventHandler<HTMLButtonElement> | undefined;
             onAnimationIteration?: React.AnimationEventHandler<HTMLButtonElement> | undefined;
             onAnimationIterationCapture?: React.AnimationEventHandler<HTMLButtonElement> | undefined;
+            onToggle?: React.ToggleEventHandler<HTMLButtonElement> | undefined;
+            onBeforeToggle?: React.ToggleEventHandler<HTMLButtonElement> | undefined;
+            onTransitionCancel?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
+            onTransitionCancelCapture?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
             onTransitionEnd?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
             onTransitionEndCapture?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
-            key?: React.Key | null | undefined;
-            defaultChecked?: boolean | undefined | undefined;
-            defaultValue?: string | number | readonly string[] | undefined;
-            suppressContentEditableWarning?: boolean | undefined | undefined;
-            suppressHydrationWarning?: boolean | undefined | undefined;
-            accessKey?: string | undefined | undefined;
-            autoFocus?: boolean | undefined | undefined;
-            contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
-            contextMenu?: string | undefined | undefined;
-            dir?: string | undefined | undefined;
-            draggable?: (boolean | "true" | "false") | undefined;
-            hidden?: boolean | undefined | undefined;
-            nonce?: string | undefined | undefined;
-            placeholder?: string | undefined | undefined;
-            spellCheck?: (boolean | "true" | "false") | undefined;
-            radioGroup?: string | undefined | undefined;
-            about?: string | undefined | undefined;
-            datatype?: string | undefined | undefined;
-            inlist?: any;
-            property?: string | undefined | undefined;
-            rel?: string | undefined | undefined;
-            resource?: string | undefined | undefined;
-            rev?: string | undefined | undefined;
-            typeof?: string | undefined | undefined;
-            vocab?: string | undefined | undefined;
-            autoCapitalize?: string | undefined | undefined;
-            autoCorrect?: string | undefined | undefined;
-            autoSave?: string | undefined | undefined;
-            itemProp?: string | undefined | undefined;
-            itemScope?: boolean | undefined | undefined;
-            itemType?: string | undefined | undefined;
-            itemID?: string | undefined | undefined;
-            itemRef?: string | undefined | undefined;
-            results?: number | undefined | undefined;
-            security?: string | undefined | undefined;
-            unselectable?: "on" | "off" | undefined | undefined;
-            inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
-            is?: string | undefined | undefined;
+            onTransitionRun?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
+            onTransitionRunCapture?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
+            onTransitionStart?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
+            onTransitionStartCapture?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
             disabled?: boolean | undefined | undefined;
-            value?: string | number | readonly string[] | undefined;
-            as?: React.ElementType | undefined;
-            formAction?: string | undefined | undefined;
+            type?: "submit" | "reset" | "button" | undefined | undefined;
+            formAction?: string | ((formData: FormData) => void | Promise<void>) | undefined;
             formEncType?: string | undefined | undefined;
             formMethod?: string | undefined | undefined;
             formNoValidate?: boolean | undefined | undefined;

package/dist/components/banner/banner-regular/BannerRegular.js

@@ -7,16 +7,18 @@ import { BannerRegularDismiss } from "./BannerRegularDismiss.js";
 import { BannerRegularHeading } from "./BannerRegularHeading.js";
 import { BannerRegularImage } from "./BannerRegularImage.js";
 import { BannerRegularText } from "./BannerRegularText.js";
-import * as React$1 from "react";
+import "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/banner/banner-regular/BannerRegular.tsx
-var BannerRegularComponent = ({ colorScheme, size, emphasis, onDismiss, ...rest }) => /* @__PURE__ */ React$1.createElement(Banner, {
+var BannerRegularComponent = ({ colorScheme, size, emphasis, onDismiss, ...rest }) => /* @__PURE__ */ jsx(Banner, {
 	size,
-	emphasis
-}, /* @__PURE__ */ React$1.createElement(BannerRegularContainer, {
-	colorScheme,
-	onDismiss,
-	...rest
-}));
+	emphasis,
+	children: /* @__PURE__ */ jsx(BannerRegularContainer, {
+		colorScheme,
+		onDismiss,
+		...rest
+	})
+});
 var BannerRegular = Object.assign(BannerRegularComponent, {
 	Content: BannerRegularContent,
 	Heading: BannerRegularHeading,

package/dist/components/banner/banner-regular/BannerRegular.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegular.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegular.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Banner } from '../Banner'\nimport { BannerRegularActions } from './BannerRegularActions'\nimport { BannerRegularButton } from './BannerRegularButton'\nimport { BannerRegularContainer } from './BannerRegularContainer'\nimport { BannerRegularContent } from './BannerRegularContent'\nimport { BannerRegularDismiss } from './BannerRegularDismiss'\nimport { BannerRegularHeading } from './BannerRegularHeading'\nimport { BannerRegularImage } from './BannerRegularImage'\nimport { BannerRegularText } from './BannerRegularText'\n\nconst BannerRegularComponent = ({\n  colorScheme,\n  size,\n  emphasis,\n  onDismiss,\n  ...rest\n}: React.ComponentProps<typeof BannerRegularContainer>) => (\n  <Banner size={size} emphasis={emphasis}>\n    <BannerRegularContainer\n      colorScheme={colorScheme}\n      onDismiss={onDismiss}\n      {...rest}\n    />\n  </Banner>\n)\n\nexport const BannerRegular = Object.assign(BannerRegularComponent, {\n  Content: BannerRegularContent,\n  Heading: BannerRegularHeading,\n  Text: BannerRegularText,\n  Actions: BannerRegularActions,\n  Image: BannerRegularImage,\n  Button: BannerRegularButton,\n  Dismiss: BannerRegularDismiss\n})\n\nBannerRegularComponent.displayName = 'BannerRegular'\n"],"mappings":";;;;;;;;;;;AAYA,IAAM,0BAA0B,EAC9B,aACA,MACA,UACA,WACA,GAAG,WAEH,wBAAA,cAAC,QAAD;CAAc;CAAgB;CAMrB,EALP,wBAAA,cAAC,wBAAD;CACe;CACF;CACX,GAAI;CACJ,CAAA,CACK;AAGX,IAAa,gBAAgB,OAAO,OAAO,wBAAwB;CACjE,SAAS;CACT,SAAS;CACT,MAAM;CACN,SAAS;CACT,OAAO;CACP,QAAQ;CACR,SAAS;CACV,CAAC;AAEF,uBAAuB,cAAc"}
+{"version":3,"file":"BannerRegular.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegular.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Banner } from '../Banner'\nimport { BannerRegularActions } from './BannerRegularActions'\nimport { BannerRegularButton } from './BannerRegularButton'\nimport { BannerRegularContainer } from './BannerRegularContainer'\nimport { BannerRegularContent } from './BannerRegularContent'\nimport { BannerRegularDismiss } from './BannerRegularDismiss'\nimport { BannerRegularHeading } from './BannerRegularHeading'\nimport { BannerRegularImage } from './BannerRegularImage'\nimport { BannerRegularText } from './BannerRegularText'\n\nconst BannerRegularComponent = ({\n  colorScheme,\n  size,\n  emphasis,\n  onDismiss,\n  ...rest\n}: React.ComponentProps<typeof BannerRegularContainer>) => (\n  <Banner size={size} emphasis={emphasis}>\n    <BannerRegularContainer\n      colorScheme={colorScheme}\n      onDismiss={onDismiss}\n      {...rest}\n    />\n  </Banner>\n)\n\nexport const BannerRegular = Object.assign(BannerRegularComponent, {\n  Content: BannerRegularContent,\n  Heading: BannerRegularHeading,\n  Text: BannerRegularText,\n  Actions: BannerRegularActions,\n  Image: BannerRegularImage,\n  Button: BannerRegularButton,\n  Dismiss: BannerRegularDismiss\n})\n\nBannerRegularComponent.displayName = 'BannerRegular'\n"],"mappings":";;;;;;;;;;;;AAYA,IAAM,0BAA0B,EAC9B,aACA,MACA,UACA,WACA,GAAG,WAEH,oBAAC,QAAD;CAAc;CAAgB;WAC5B,oBAAC,wBAAD;EACe;EACF;EACX,GAAI;EACJ,CAAA;CACK,CAAA;AAGX,IAAa,gBAAgB,OAAO,OAAO,wBAAwB;CACjE,SAAS;CACT,SAAS;CACT,MAAM;CACN,SAAS;CACT,OAAO;CACP,QAAQ;CACR,SAAS;CACV,CAAC;AAEF,uBAAuB,cAAc"}

package/dist/components/banner/banner-regular/BannerRegularActions.js

@@ -2,6 +2,7 @@ import { cn } from "../../../styled.js";
 import { useBannerContext } from "../BannerContext.js";
 import { BannerRegularButton } from "./BannerRegularButton.js";
 import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
 import invariant from "invariant";
 //#region src/components/banner/banner-regular/BannerRegularActions.tsx
 var MAX_ALLOWED_CHILDREN = 2;
@@ -24,16 +25,17 @@ var BannerRegularActions = ({ children, className, ...props }) => {
 		return "flex-col md:flex-row";
 	}, [size]);
 	invariant(React$1.Children.count(children) <= MAX_ALLOWED_CHILDREN, `A maximum of ${MAX_ALLOWED_CHILDREN} ${BannerRegularButton.displayName} component(s) are permitted as children of ${BannerRegularActions.displayName}`);
-	return /* @__PURE__ */ React$1.createElement("div", {
+	return /* @__PURE__ */ jsx("div", {
 		className: cn("flex", gap, direction, className),
-		...props
-	}, React$1.Children.map(children, (child, index) => {
-		if (child == null) return child;
-		if (!React$1.isValidElement(child)) throw new Error(`Child passed to ${BannerRegularActions.displayName} is not a valid element`);
-		invariant(child.type === BannerRegularButton, `Children of type ${child?.type} aren't permitted. Only an ${BannerRegularButton.displayName} component is allowed in ${BannerRegularActions.displayName}`);
-		const propsToInject = { appearance: index > 0 ? "outline" : void 0 };
-		return React$1.cloneElement(child, propsToInject);
-	}));
+		...props,
+		children: React$1.Children.map(children, (child, index) => {
+			if (child == null) return child;
+			if (!React$1.isValidElement(child)) throw new Error(`Child passed to ${BannerRegularActions.displayName} is not a valid element`);
+			invariant(child.type === BannerRegularButton, `Children of type ${child?.type} aren't permitted. Only an ${BannerRegularButton.displayName} component is allowed in ${BannerRegularActions.displayName}`);
+			const propsToInject = { appearance: index > 0 ? "outline" : void 0 };
+			return React$1.cloneElement(child, propsToInject);
+		})
+	});
 };
 BannerRegularActions.displayName = "BannerRegularActions";
 //#endregion

package/dist/components/banner/banner-regular/BannerRegularActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularActions.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularActions.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { cn } from '~/styled'\n\nimport { useBannerContext } from '../BannerContext'\nimport { BannerRegularButton } from './BannerRegularButton'\n\nconst MAX_ALLOWED_CHILDREN = 2\n\nconst toGap = {\n  sm: 'gap-2',\n  md: 'gap-4'\n}\n\nconst toDirection = {\n  sm: 'flex-col',\n  md: 'flex-row'\n}\n\nexport const BannerRegularActions = ({\n  children,\n  className,\n  ...props\n}: React.PropsWithChildren<React.ComponentProps<'div'>>) => {\n  const { size } = useBannerContext()\n\n  const gap = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toGap[size]\n    }\n    return 'gap-2 md:gap-4'\n  }, [size])\n\n  const direction = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toDirection[size]\n    }\n    return 'flex-col md:flex-row'\n  }, [size])\n\n  invariant(\n    React.Children.count(children) <= MAX_ALLOWED_CHILDREN,\n    `A maximum of ${MAX_ALLOWED_CHILDREN} ${BannerRegularButton.displayName} component(s) are permitted as children of ${BannerRegularActions.displayName}`\n  )\n\n  return (\n    <div className={cn('flex', gap, direction, className)} {...props}>\n      {React.Children.map(children, (child, index) => {\n        // if child is undefined or null, React.isValidElement returns false and hence error is thrown.\n        // This line will prevent that from happening\n        if (child == null) return child\n\n        if (!React.isValidElement(child)) {\n          throw new Error(\n            `Child passed to ${BannerRegularActions.displayName} is not a valid element`\n          )\n        }\n\n        invariant(\n          child.type === BannerRegularButton,\n          `Children of type ${child?.type} aren't permitted. Only an ${BannerRegularButton.displayName} component is allowed in ${BannerRegularActions.displayName}`\n        )\n\n        const propsToInject: Partial<\n          React.ComponentProps<typeof BannerRegularButton>\n        > = {\n          // Override button appearance - make the second button outlined\n          appearance: index > 0 ? 'outline' : undefined\n        }\n\n        return React.cloneElement(\n          child as React.ReactElement<\n            React.ComponentProps<typeof BannerRegularButton>\n          >,\n          propsToInject\n        )\n      })}\n    </div>\n  )\n}\n\nBannerRegularActions.displayName = 'BannerRegularActions'\n"],"mappings":";;;;;;AAQA,IAAM,uBAAuB;AAE7B,IAAM,QAAQ;CACZ,IAAI;CACJ,IAAI;CACL;AAED,IAAM,cAAc;CAClB,IAAI;CACJ,IAAI;CACL;AAED,IAAa,wBAAwB,EACnC,UACA,WACA,GAAG,YACuD;CAC1D,MAAM,EAAE,SAAS,kBAAkB;CAEnC,MAAM,MAAM,QAAM,cAAc;AAC9B,MAAI,OAAO,SAAS,SAClB,QAAO,MAAM;AAEf,SAAO;IACN,CAAC,KAAK,CAAC;CAEV,MAAM,YAAY,QAAM,cAAc;AACpC,MAAI,OAAO,SAAS,SAClB,QAAO,YAAY;AAErB,SAAO;IACN,CAAC,KAAK,CAAC;AAEV,WACE,QAAM,SAAS,MAAM,SAAS,IAAI,sBAClC,gBAAgB,qBAAqB,GAAG,oBAAoB,YAAY,6CAA6C,qBAAqB,cAC3I;AAED,QACE,wBAAA,cAAC,OAAD;EAAK,WAAW,GAAG,QAAQ,KAAK,WAAW,UAAU;EAAE,GAAI;EA+BrD,EA9BH,QAAM,SAAS,IAAI,WAAW,OAAO,UAAU;AAG9C,MAAI,SAAS,KAAM,QAAO;AAE1B,MAAI,CAAC,QAAM,eAAe,MAAM,CAC9B,OAAM,IAAI,MACR,mBAAmB,qBAAqB,YAAY,yBACrD;AAGH,YACE,MAAM,SAAS,qBACf,oBAAoB,OAAO,KAAK,6BAA6B,oBAAoB,YAAY,2BAA2B,qBAAqB,cAC9I;EAED,MAAM,gBAEF,EAEF,YAAY,QAAQ,IAAI,YAAY,KAAA,GACrC;AAED,SAAO,QAAM,aACX,OAGA,cACD;GACD,CACE;;AAIV,qBAAqB,cAAc"}
+{"version":3,"file":"BannerRegularActions.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularActions.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { cn } from '~/styled'\n\nimport { useBannerContext } from '../BannerContext'\nimport { BannerRegularButton } from './BannerRegularButton'\n\nconst MAX_ALLOWED_CHILDREN = 2\n\nconst toGap = {\n  sm: 'gap-2',\n  md: 'gap-4'\n}\n\nconst toDirection = {\n  sm: 'flex-col',\n  md: 'flex-row'\n}\n\nexport const BannerRegularActions = ({\n  children,\n  className,\n  ...props\n}: React.PropsWithChildren<React.ComponentProps<'div'>>) => {\n  const { size } = useBannerContext()\n\n  const gap = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toGap[size]\n    }\n    return 'gap-2 md:gap-4'\n  }, [size])\n\n  const direction = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toDirection[size]\n    }\n    return 'flex-col md:flex-row'\n  }, [size])\n\n  invariant(\n    React.Children.count(children) <= MAX_ALLOWED_CHILDREN,\n    `A maximum of ${MAX_ALLOWED_CHILDREN} ${BannerRegularButton.displayName} component(s) are permitted as children of ${BannerRegularActions.displayName}`\n  )\n\n  return (\n    <div className={cn('flex', gap, direction, className)} {...props}>\n      {React.Children.map(children, (child, index) => {\n        // if child is undefined or null, React.isValidElement returns false and hence error is thrown.\n        // This line will prevent that from happening\n        if (child == null) return child\n\n        if (!React.isValidElement(child)) {\n          throw new Error(\n            `Child passed to ${BannerRegularActions.displayName} is not a valid element`\n          )\n        }\n\n        invariant(\n          child.type === BannerRegularButton,\n          `Children of type ${child?.type} aren't permitted. Only an ${BannerRegularButton.displayName} component is allowed in ${BannerRegularActions.displayName}`\n        )\n\n        const propsToInject: Partial<\n          React.ComponentProps<typeof BannerRegularButton>\n        > = {\n          // Override button appearance - make the second button outlined\n          appearance: index > 0 ? 'outline' : undefined\n        }\n\n        return React.cloneElement(\n          child as React.ReactElement<\n            React.ComponentProps<typeof BannerRegularButton>\n          >,\n          propsToInject\n        )\n      })}\n    </div>\n  )\n}\n\nBannerRegularActions.displayName = 'BannerRegularActions'\n"],"mappings":";;;;;;;AAQA,IAAM,uBAAuB;AAE7B,IAAM,QAAQ;CACZ,IAAI;CACJ,IAAI;CACL;AAED,IAAM,cAAc;CAClB,IAAI;CACJ,IAAI;CACL;AAED,IAAa,wBAAwB,EACnC,UACA,WACA,GAAG,YACuD;CAC1D,MAAM,EAAE,SAAS,kBAAkB;CAEnC,MAAM,MAAM,QAAM,cAAc;AAC9B,MAAI,OAAO,SAAS,SAClB,QAAO,MAAM;AAEf,SAAO;IACN,CAAC,KAAK,CAAC;CAEV,MAAM,YAAY,QAAM,cAAc;AACpC,MAAI,OAAO,SAAS,SAClB,QAAO,YAAY;AAErB,SAAO;IACN,CAAC,KAAK,CAAC;AAEV,WACE,QAAM,SAAS,MAAM,SAAS,IAAI,sBAClC,gBAAgB,qBAAqB,GAAG,oBAAoB,YAAY,6CAA6C,qBAAqB,cAC3I;AAED,QACE,oBAAC,OAAD;EAAK,WAAW,GAAG,QAAQ,KAAK,WAAW,UAAU;EAAE,GAAI;YACxD,QAAM,SAAS,IAAI,WAAW,OAAO,UAAU;AAG9C,OAAI,SAAS,KAAM,QAAO;AAE1B,OAAI,CAAC,QAAM,eAAe,MAAM,CAC9B,OAAM,IAAI,MACR,mBAAmB,qBAAqB,YAAY,yBACrD;AAGH,aACE,MAAM,SAAS,qBACf,oBAAoB,OAAO,KAAK,6BAA6B,oBAAoB,YAAY,2BAA2B,qBAAqB,cAC9I;GAED,MAAM,gBAEF,EAEF,YAAY,QAAQ,IAAI,YAAY,KAAA,GACrC;AAED,UAAO,QAAM,aACX,OAGA,cACD;IACD;EACE,CAAA;;AAIV,qBAAqB,cAAc"}

package/dist/components/banner/banner-regular/BannerRegularButton.js

@@ -2,13 +2,13 @@ import { Button } from "../../button/Button.js";
 import { overrideStyledVariantValue } from "../../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";
 import { useBannerContext } from "../BannerContext.js";
 import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/banner/banner-regular/BannerRegularButton.tsx
 var BannerRegularButton = (props) => {
 	const { emphasis, size } = useBannerContext();
-	const fullWidth = React$1.useMemo(() => overrideStyledVariantValue(size, (s) => s === "sm"), [size]);
-	return /* @__PURE__ */ React$1.createElement(Button, {
+	return /* @__PURE__ */ jsx(Button, {
 		size,
-		fullWidth,
+		fullWidth: React$1.useMemo(() => overrideStyledVariantValue(size, (s) => s === "sm"), [size]),
 		theme: emphasis === "bold" ? "neutral" : "primary",
 		...props
 	});

package/dist/components/banner/banner-regular/BannerRegularButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularButton.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Button } from '../../button/Button'\nimport { useBannerContext } from '../BannerContext'\n\nexport const BannerRegularButton = (\n  props: React.ComponentProps<typeof Button>\n) => {\n  const { emphasis, size } = useBannerContext()\n\n  const fullWidth = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => s === 'sm'),\n    [size]\n  )\n\n  return (\n    <Button\n      size={size}\n      fullWidth={fullWidth}\n      theme={emphasis === 'bold' ? 'neutral' : 'primary'}\n      {...props}\n    />\n  )\n}\n\nBannerRegularButton.displayName = 'BannerRegularButton'\n"],"mappings":";;;;;AAOA,IAAa,uBACX,UACG;CACH,MAAM,EAAE,UAAU,SAAS,kBAAkB;CAE7C,MAAM,YAAY,QAAM,cAChB,2BAA2B,OAAO,MAAM,MAAM,KAAK,EACzD,CAAC,KAAK,CACP;AAED,QACE,wBAAA,cAAC,QAAD;EACQ;EACK;EACX,OAAO,aAAa,SAAS,YAAY;EACzC,GAAI;EACJ,CAAA;;AAIN,oBAAoB,cAAc"}
+{"version":3,"file":"BannerRegularButton.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Button } from '../../button/Button'\nimport { useBannerContext } from '../BannerContext'\n\nexport const BannerRegularButton = (\n  props: React.ComponentProps<typeof Button>\n) => {\n  const { emphasis, size } = useBannerContext()\n\n  const fullWidth = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => s === 'sm'),\n    [size]\n  )\n\n  return (\n    <Button\n      size={size}\n      fullWidth={fullWidth}\n      theme={emphasis === 'bold' ? 'neutral' : 'primary'}\n      {...props}\n    />\n  )\n}\n\nBannerRegularButton.displayName = 'BannerRegularButton'\n"],"mappings":";;;;;;AAOA,IAAa,uBACX,UACG;CACH,MAAM,EAAE,UAAU,SAAS,kBAAkB;AAO7C,QACE,oBAAC,QAAD;EACQ;EACK,WARG,QAAM,cAChB,2BAA2B,OAAO,MAAM,MAAM,KAAK,EACzD,CAAC,KAAK,CACP;EAMG,OAAO,aAAa,SAAS,YAAY;EACzC,GAAI;EACJ,CAAA;;AAIN,oBAAoB,cAAc"}

package/dist/components/banner/banner-regular/BannerRegularContainer.js

@@ -1,7 +1,8 @@
 import { BannerContainer } from "../BannerContainer.js";
-import * as React$1 from "react";
+import "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/banner/banner-regular/BannerRegularContainer.tsx
-var BannerRegularContainer = (props) => /* @__PURE__ */ React$1.createElement(BannerContainer, props);
+var BannerRegularContainer = (props) => /* @__PURE__ */ jsx(BannerContainer, { ...props });
 //#endregion
 export { BannerRegularContainer };
 

package/dist/components/banner/banner-regular/BannerRegularContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularContainer.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularContainer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { BannerContainer } from '../BannerContainer'\n\ntype TBannerRegularContainerProps = Omit<\n  React.ComponentProps<typeof BannerContainer>,\n  'direction' | 'align' | 'wrap' | 'gap' | 'justify'\n>\n\nexport const BannerRegularContainer = (props: TBannerRegularContainerProps) => (\n  <BannerContainer {...props} />\n)\n"],"mappings":";;;AASA,IAAa,0BAA0B,UACrC,wBAAA,cAAC,iBAAoB,MAAS"}
+{"version":3,"file":"BannerRegularContainer.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularContainer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { BannerContainer } from '../BannerContainer'\n\ntype TBannerRegularContainerProps = Omit<\n  React.ComponentProps<typeof BannerContainer>,\n  'direction' | 'align' | 'wrap' | 'gap' | 'justify'\n>\n\nexport const BannerRegularContainer = (props: TBannerRegularContainerProps) => (\n  <BannerContainer {...props} />\n)\n"],"mappings":";;;;AASA,IAAa,0BAA0B,UACrC,oBAAC,iBAAD,EAAiB,GAAI,OAAS,CAAA"}

package/dist/components/banner/banner-regular/BannerRegularContent.d.ts

@@ -1,7 +1,5 @@
 import * as React from 'react';
-declare const Container: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-}, "size"> & {
+declare const Container: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "size"> & {
     size?: ("sm" | "md" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md">>) | undefined;
 } & {
     as?: React.ElementType;

package/dist/components/banner/banner-regular/BannerRegularContent.js

@@ -1,6 +1,7 @@
 import { styled } from "../../../styled.js";
 import { useBannerContext } from "../BannerContext.js";
-import * as React$1 from "react";
+import "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/banner/banner-regular/BannerRegularContent.tsx
 var Container = styled("div", {
 	base: ["w-31/50", "grow"],
@@ -11,7 +12,7 @@ var Container = styled("div", {
 }, { enabledResponsiveVariants: true });
 var BannerRegularContent = (props) => {
 	const { size } = useBannerContext();
-	return /* @__PURE__ */ React$1.createElement(Container, {
+	return /* @__PURE__ */ jsx(Container, {
 		size,
 		...props
 	});

package/dist/components/banner/banner-regular/BannerRegularContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularContent.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { useBannerContext } from '../BannerContext'\n\nconst Container = styled(\n  'div',\n  {\n    base: ['w-31/50', 'grow'],\n    variants: {\n      size: {\n        sm: ['p-4'],\n        md: ['p-6', 'pr-8']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nexport const BannerRegularContent = (\n  props: React.ComponentProps<typeof Container>\n) => {\n  const { size } = useBannerContext()\n\n  return <Container size={size} {...props} />\n}\n\nBannerRegularContent.displayName = 'BannerRegularContent'\n"],"mappings":";;;;AAMA,IAAM,YAAY,OAChB,OACA;CACE,MAAM,CAAC,WAAW,OAAO;CACzB,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,MAAM;EACX,IAAI,CAAC,OAAO,OAAO;EACpB,EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAa,wBACX,UACG;CACH,MAAM,EAAE,SAAS,kBAAkB;AAEnC,QAAO,wBAAA,cAAC,WAAD;EAAiB;EAAM,GAAI;EAAS,CAAA;;AAG7C,qBAAqB,cAAc"}
+{"version":3,"file":"BannerRegularContent.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { useBannerContext } from '../BannerContext'\n\nconst Container = styled(\n  'div',\n  {\n    base: ['w-31/50', 'grow'],\n    variants: {\n      size: {\n        sm: ['p-4'],\n        md: ['p-6', 'pr-8']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nexport const BannerRegularContent = (\n  props: React.ComponentProps<typeof Container>\n) => {\n  const { size } = useBannerContext()\n\n  return <Container size={size} {...props} />\n}\n\nBannerRegularContent.displayName = 'BannerRegularContent'\n"],"mappings":";;;;;AAMA,IAAM,YAAY,OAChB,OACA;CACE,MAAM,CAAC,WAAW,OAAO;CACzB,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,MAAM;EACX,IAAI,CAAC,OAAO,OAAO;EACpB,EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAa,wBACX,UACG;CACH,MAAM,EAAE,SAAS,kBAAkB;AAEnC,QAAO,oBAAC,WAAD;EAAiB;EAAM,GAAI;EAAS,CAAA;;AAG7C,qBAAqB,cAAc"}

package/dist/components/banner/banner-regular/BannerRegularDismiss.d.ts

@@ -1,7 +1,5 @@
 import * as React from 'react';
-declare const StyledDismiss: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-}, "appearance" | "size" | "theme" | "isRounded"> & {
+declare const StyledDismiss: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "appearance" | "size" | "theme" | "isRounded"> & {
     theme?: ("primary" | "white" | "neutral" | "primaryDark" | "success" | "warning" | "danger" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "primary" | "white" | "neutral" | "primaryDark" | "success" | "warning" | "danger">>) | undefined;
     appearance?: ("simple" | "outline" | "solid" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "simple" | "outline" | "solid">>) | undefined;
     size?: ("sm" | "md" | "lg" | "xs" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs">>) | undefined;

package/dist/components/banner/banner-regular/BannerRegularDismiss.js

@@ -5,6 +5,7 @@ import { overrideStyledVariantValue } from "../../../utilities/override-styled-v
 import { useBannerContext } from "../BannerContext.js";
 import { Banner } from "../Banner.js";
 import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
 import { Close } from "@atom-learning/icons";
 //#region src/components/banner/banner-regular/BannerRegularDismiss.tsx
 var toActionIconSize = {
@@ -26,15 +27,19 @@ var BannerRegularDismiss = ({ label = "dismiss", ...rest }) => {
 		};
 	}, [setHasDismiss]);
 	const actionIconSize = React$1.useMemo(() => overrideStyledVariantValue(size, (s) => toActionIconSize[s]), [size]);
-	return /* @__PURE__ */ React$1.createElement(Banner.Dismiss, { asChild: true }, /* @__PURE__ */ React$1.createElement(StyledDismiss, {
-		label,
-		size: actionIconSize,
-		hasTooltip: false,
-		isRounded: true,
-		theme: "neutral",
-		appearance: "solid",
-		...rest
-	}, /* @__PURE__ */ React$1.createElement(Icon, { is: Close })));
+	return /* @__PURE__ */ jsx(Banner.Dismiss, {
+		asChild: true,
+		children: /* @__PURE__ */ jsx(StyledDismiss, {
+			label,
+			size: actionIconSize,
+			hasTooltip: false,
+			isRounded: true,
+			theme: "neutral",
+			appearance: "solid",
+			...rest,
+			children: /* @__PURE__ */ jsx(Icon, { is: Close })
+		})
+	});
 };
 BannerRegularDismiss.displayName = "BannerRegularDismiss";
 //#endregion

package/dist/components/banner/banner-regular/BannerRegularDismiss.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularDismiss.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { ActionIcon } from '../../action-icon/ActionIcon'\nimport { Icon } from '../../icon/Icon'\nimport { Banner } from '../Banner'\nimport { useBannerContext } from '../BannerContext'\n\nconst toActionIconSize = {\n  sm: 'md',\n  md: 'sm'\n}\n\nconst StyledDismiss = styled(ActionIcon, {\n  base: ['z-1', 'absolute', 'top-3', 'right-3']\n})\n\ntype BannerRegularDismissProps = Omit<\n  React.ComponentProps<typeof StyledDismiss>,\n  'children' | 'onClick' | 'href'\n>\n\nexport const BannerRegularDismiss = ({\n  label = 'dismiss',\n  ...rest\n}: BannerRegularDismissProps) => {\n  const { size, setHasDismiss } = useBannerContext()\n\n  React.useEffect(() => {\n    setHasDismiss(true)\n    return () => {\n      setHasDismiss(false)\n    }\n  }, [setHasDismiss])\n\n  const actionIconSize = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toActionIconSize[s]),\n    [size]\n  )\n\n  return (\n    <Banner.Dismiss asChild>\n      <StyledDismiss\n        label={label}\n        size={actionIconSize}\n        hasTooltip={false}\n        isRounded\n        theme=\"neutral\"\n        appearance=\"solid\"\n        {...rest}\n      >\n        <Icon is={Close} />\n      </StyledDismiss>\n    </Banner.Dismiss>\n  )\n}\n\nBannerRegularDismiss.displayName = 'BannerRegularDismiss'\n"],"mappings":";;;;;;;;;AAWA,IAAM,mBAAmB;CACvB,IAAI;CACJ,IAAI;CACL;AAED,IAAM,gBAAgB,OAAO,YAAY,EACvC,MAAM;CAAC;CAAO;CAAY;CAAS;CAAU,EAC9C,CAAC;AAOF,IAAa,wBAAwB,EACnC,QAAQ,WACR,GAAG,WAC4B;CAC/B,MAAM,EAAE,MAAM,kBAAkB,kBAAkB;AAElD,SAAM,gBAAgB;AACpB,gBAAc,KAAK;AACnB,eAAa;AACX,iBAAc,MAAM;;IAErB,CAAC,cAAc,CAAC;CAEnB,MAAM,iBAAiB,QAAM,cACrB,2BAA2B,OAAO,MAAM,iBAAiB,GAAG,EAClE,CAAC,KAAK,CACP;AAED,QACE,wBAAA,cAAC,OAAO,SAAR,EAAgB,SAAA,MAYC,EAXf,wBAAA,cAAC,eAAD;EACS;EACP,MAAM;EACN,YAAY;EACZ,WAAA;EACA,OAAM;EACN,YAAW;EACX,GAAI;EAGU,EADd,wBAAA,cAAC,MAAD,EAAM,IAAI,OAAS,CAAA,CACL,CACD;;AAIrB,qBAAqB,cAAc"}
+{"version":3,"file":"BannerRegularDismiss.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { ActionIcon } from '../../action-icon/ActionIcon'\nimport { Icon } from '../../icon/Icon'\nimport { Banner } from '../Banner'\nimport { useBannerContext } from '../BannerContext'\n\nconst toActionIconSize = {\n  sm: 'md',\n  md: 'sm'\n}\n\nconst StyledDismiss = styled(ActionIcon, {\n  base: ['z-1', 'absolute', 'top-3', 'right-3']\n})\n\ntype BannerRegularDismissProps = Omit<\n  React.ComponentProps<typeof StyledDismiss>,\n  'children' | 'onClick' | 'href'\n>\n\nexport const BannerRegularDismiss = ({\n  label = 'dismiss',\n  ...rest\n}: BannerRegularDismissProps) => {\n  const { size, setHasDismiss } = useBannerContext()\n\n  React.useEffect(() => {\n    setHasDismiss(true)\n    return () => {\n      setHasDismiss(false)\n    }\n  }, [setHasDismiss])\n\n  const actionIconSize = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toActionIconSize[s]),\n    [size]\n  )\n\n  return (\n    <Banner.Dismiss asChild>\n      <StyledDismiss\n        label={label}\n        size={actionIconSize}\n        hasTooltip={false}\n        isRounded\n        theme=\"neutral\"\n        appearance=\"solid\"\n        {...rest}\n      >\n        <Icon is={Close} />\n      </StyledDismiss>\n    </Banner.Dismiss>\n  )\n}\n\nBannerRegularDismiss.displayName = 'BannerRegularDismiss'\n"],"mappings":";;;;;;;;;;AAWA,IAAM,mBAAmB;CACvB,IAAI;CACJ,IAAI;CACL;AAED,IAAM,gBAAgB,OAAO,YAAY,EACvC,MAAM;CAAC;CAAO;CAAY;CAAS;CAAU,EAC9C,CAAC;AAOF,IAAa,wBAAwB,EACnC,QAAQ,WACR,GAAG,WAC4B;CAC/B,MAAM,EAAE,MAAM,kBAAkB,kBAAkB;AAElD,SAAM,gBAAgB;AACpB,gBAAc,KAAK;AACnB,eAAa;AACX,iBAAc,MAAM;;IAErB,CAAC,cAAc,CAAC;CAEnB,MAAM,iBAAiB,QAAM,cACrB,2BAA2B,OAAO,MAAM,iBAAiB,GAAG,EAClE,CAAC,KAAK,CACP;AAED,QACE,oBAAC,OAAO,SAAR;EAAgB,SAAA;YACd,oBAAC,eAAD;GACS;GACP,MAAM;GACN,YAAY;GACZ,WAAA;GACA,OAAM;GACN,YAAW;GACX,GAAI;aAEJ,oBAAC,MAAD,EAAM,IAAI,OAAS,CAAA;GACL,CAAA;EACD,CAAA;;AAIrB,qBAAqB,cAAc"}

package/dist/components/banner/banner-regular/BannerRegularHeading.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Heading } from '../../heading/Heading';
 export declare const BannerRegularHeading: {
-    (props: React.ComponentProps<typeof Heading>): React.JSX.Element;
+    (props: React.ComponentPropsWithoutRef<typeof Heading>): React.JSX.Element;
     displayName: string;
 };

package/dist/components/banner/banner-regular/BannerRegularHeading.js

@@ -1,7 +1,8 @@
 import { styled } from "../../../styled.js";
 import { Heading } from "../../heading/Heading.js";
 import { useBannerContext } from "../BannerContext.js";
-import * as React$1 from "react";
+import "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/banner/banner-regular/BannerRegularHeading.tsx
 var StyledHeading = styled(Heading, {
 	base: ["mb-4", "text-(--banner-heading-color)"],
@@ -20,7 +21,7 @@ var StyledHeading = styled(Heading, {
 }, { enabledResponsiveVariants: true });
 var BannerRegularHeading = (props) => {
 	const { size, hasDismiss } = useBannerContext();
-	return /* @__PURE__ */ React$1.createElement(StyledHeading, {
+	return /* @__PURE__ */ jsx(StyledHeading, {
 		size: "md",
 		containerSize: size,
 		hasDismiss,

package/dist/components/banner/banner-regular/BannerRegularHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularHeading.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Heading } from '../../heading/Heading'\nimport { useBannerContext } from '../BannerContext'\n\nconst StyledHeading = styled(\n  Heading,\n  {\n    base: ['mb-4', 'text-(--banner-heading-color)'],\n    variants: {\n      containerSize: {\n        sm: [],\n        md: []\n      },\n      hasDismiss: {\n        true: []\n      }\n    },\n    compoundVariants: [\n      {\n        containerSize: 'sm',\n        hasDismiss: true,\n        class: ['mr-10']\n      }\n    ]\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nexport const BannerRegularHeading = (\n  props: React.ComponentProps<typeof Heading>\n) => {\n  const { size, hasDismiss } = useBannerContext()\n\n  return (\n    <StyledHeading\n      size=\"md\"\n      containerSize={size}\n      hasDismiss={hasDismiss}\n      {...props}\n    />\n  )\n}\n\nBannerRegularHeading.displayName = 'BannerRegularHeading'\n"],"mappings":";;;;;AAOA,IAAM,gBAAgB,OACpB,SACA;CACE,MAAM,CAAC,QAAQ,gCAAgC;CAC/C,UAAU;EACR,eAAe;GACb,IAAI,EAAE;GACN,IAAI,EAAE;GACP;EACD,YAAY,EACV,MAAM,EAAE,EACT;EACF;CACD,kBAAkB,CAChB;EACE,eAAe;EACf,YAAY;EACZ,OAAO,CAAC,QAAQ;EACjB,CACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAa,wBACX,UACG;CACH,MAAM,EAAE,MAAM,eAAe,kBAAkB;AAE/C,QACE,wBAAA,cAAC,eAAD;EACE,MAAK;EACL,eAAe;EACH;EACZ,GAAI;EACJ,CAAA;;AAIN,qBAAqB,cAAc"}
+{"version":3,"file":"BannerRegularHeading.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Heading } from '../../heading/Heading'\nimport { useBannerContext } from '../BannerContext'\n\nconst StyledHeading = styled(\n  Heading,\n  {\n    base: ['mb-4', 'text-(--banner-heading-color)'],\n    variants: {\n      containerSize: {\n        sm: [],\n        md: []\n      },\n      hasDismiss: {\n        true: []\n      }\n    },\n    compoundVariants: [\n      {\n        containerSize: 'sm',\n        hasDismiss: true,\n        class: ['mr-10']\n      }\n    ]\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nexport const BannerRegularHeading = (\n  props: React.ComponentPropsWithoutRef<typeof Heading>\n) => {\n  const { size, hasDismiss } = useBannerContext()\n\n  return (\n    <StyledHeading\n      size=\"md\"\n      containerSize={size}\n      hasDismiss={hasDismiss}\n      {...props}\n    />\n  )\n}\n\nBannerRegularHeading.displayName = 'BannerRegularHeading'\n"],"mappings":";;;;;;AAOA,IAAM,gBAAgB,OACpB,SACA;CACE,MAAM,CAAC,QAAQ,gCAAgC;CAC/C,UAAU;EACR,eAAe;GACb,IAAI,EAAE;GACN,IAAI,EAAE;GACP;EACD,YAAY,EACV,MAAM,EAAE,EACT;EACF;CACD,kBAAkB,CAChB;EACE,eAAe;EACf,YAAY;EACZ,OAAO,CAAC,QAAQ;EACjB,CACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAa,wBACX,UACG;CACH,MAAM,EAAE,MAAM,eAAe,kBAAkB;AAE/C,QACE,oBAAC,eAAD;EACE,MAAK;EACL,eAAe;EACH;EACZ,GAAI;EACJ,CAAA;;AAIN,qBAAqB,cAAc"}

package/dist/components/banner/banner-regular/BannerRegularImage.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Image } from '../../image/Image';
 export declare const BannerRegularImage: {
-    (props: React.ComponentProps<typeof Image>): React.JSX.Element;
+    (props: React.ComponentPropsWithoutRef<typeof Image>): React.JSX.Element;
     displayName: string;
 };

package/dist/components/banner/banner-regular/BannerRegularImage.js

@@ -1,7 +1,8 @@
 import { styled } from "../../../styled.js";
 import { Image } from "../../image/Image.js";
 import { useBannerContext } from "../BannerContext.js";
-import * as React$1 from "react";
+import "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/banner/banner-regular/BannerRegularImage.tsx
 var Container = styled("div", {
 	base: [
@@ -22,7 +23,10 @@ var StyledImage = styled(Image, { base: [
 ] });
 var BannerRegularImage = (props) => {
 	const { size } = useBannerContext();
-	return /* @__PURE__ */ React$1.createElement(Container, { size }, /* @__PURE__ */ React$1.createElement(StyledImage, props));
+	return /* @__PURE__ */ jsx(Container, {
+		size,
+		children: /* @__PURE__ */ jsx(StyledImage, { ...props })
+	});
 };
 BannerRegularImage.displayName = "BannerRegularImage";
 //#endregion

package/dist/components/banner/banner-regular/BannerRegularImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularImage.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularImage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Image } from '../../image/Image'\nimport { useBannerContext } from '../BannerContext'\n\nconst Container = styled(\n  'div',\n  {\n    base: ['relative', 'overflow-hidden', 'w-19/50'],\n    variants: {\n      size: {\n        sm: ['hidden'],\n        md: ['block']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nconst StyledImage = styled(Image, {\n  base: ['absolute', 'max-w-none', 'size-full', 'object-cover']\n})\n\nexport const BannerRegularImage = (\n  props: React.ComponentProps<typeof Image>\n) => {\n  const { size } = useBannerContext()\n\n  return (\n    <Container size={size}>\n      <StyledImage {...props} />\n    </Container>\n  )\n}\n\nBannerRegularImage.displayName = 'BannerRegularImage'\n"],"mappings":";;;;;AAOA,IAAM,YAAY,OAChB,OACA;CACE,MAAM;EAAC;EAAY;EAAmB;EAAU;CAChD,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,SAAS;EACd,IAAI,CAAC,QAAQ;EACd,EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,cAAc,OAAO,OAAO,EAChC,MAAM;CAAC;CAAY;CAAc;CAAa;CAAe,EAC9D,CAAC;AAEF,IAAa,sBACX,UACG;CACH,MAAM,EAAE,SAAS,kBAAkB;AAEnC,QACE,wBAAA,cAAC,WAAD,EAAiB,MAEL,EADV,wBAAA,cAAC,aAAgB,MAAS,CAChB;;AAIhB,mBAAmB,cAAc"}
+{"version":3,"file":"BannerRegularImage.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularImage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Image } from '../../image/Image'\nimport { useBannerContext } from '../BannerContext'\n\nconst Container = styled(\n  'div',\n  {\n    base: ['relative', 'overflow-hidden', 'w-19/50'],\n    variants: {\n      size: {\n        sm: ['hidden'],\n        md: ['block']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nconst StyledImage = styled(Image, {\n  base: ['absolute', 'max-w-none', 'size-full', 'object-cover']\n})\n\nexport const BannerRegularImage = (\n  props: React.ComponentPropsWithoutRef<typeof Image>\n) => {\n  const { size } = useBannerContext()\n\n  return (\n    <Container size={size}>\n      <StyledImage {...props} />\n    </Container>\n  )\n}\n\nBannerRegularImage.displayName = 'BannerRegularImage'\n"],"mappings":";;;;;;AAOA,IAAM,YAAY,OAChB,OACA;CACE,MAAM;EAAC;EAAY;EAAmB;EAAU;CAChD,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,SAAS;EACd,IAAI,CAAC,QAAQ;EACd,EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,cAAc,OAAO,OAAO,EAChC,MAAM;CAAC;CAAY;CAAc;CAAa;CAAe,EAC9D,CAAC;AAEF,IAAa,sBACX,UACG;CACH,MAAM,EAAE,SAAS,kBAAkB;AAEnC,QACE,oBAAC,WAAD;EAAiB;YACf,oBAAC,aAAD,EAAa,GAAI,OAAS,CAAA;EAChB,CAAA;;AAIhB,mBAAmB,cAAc"}

package/dist/components/banner/banner-regular/BannerRegularText.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Text } from '../../text/Text';
 export declare const BannerRegularText: {
-    (props: React.ComponentProps<typeof Text>): React.JSX.Element;
+    (props: React.ComponentPropsWithoutRef<typeof Text>): React.JSX.Element;
     displayName: string;
 };

package/dist/components/banner/banner-regular/BannerRegularText.js

@@ -1,7 +1,8 @@
 import { styled } from "../../../styled.js";
 import { Text } from "../../text/Text.js";
 import { useBannerContext } from "../BannerContext.js";
-import * as React$1 from "react";
+import "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/banner/banner-regular/BannerRegularText.tsx
 var StyledText = styled(Text, {
 	base: ["text-(--banner-text-color)"],
@@ -20,7 +21,7 @@ var StyledText = styled(Text, {
 }, { enabledResponsiveVariants: true });
 var BannerRegularText = (props) => {
 	const { size, hasDismiss } = useBannerContext();
-	return /* @__PURE__ */ React$1.createElement(StyledText, {
+	return /* @__PURE__ */ jsx(StyledText, {
 		size,
 		containerSize: size,
 		hasDismiss,

package/dist/components/banner/banner-regular/BannerRegularText.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularText.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularText.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Text } from '../../text/Text'\nimport { useBannerContext } from '../BannerContext'\n\nconst StyledText = styled(\n  Text,\n  {\n    base: ['text-(--banner-text-color)'],\n    variants: {\n      containerSize: {\n        sm: ['mb-4'],\n        md: ['mb-6']\n      },\n      hasDismiss: {\n        true: []\n      }\n    },\n    compoundVariants: [\n      {\n        containerSize: 'sm',\n        hasDismiss: true,\n        class: ['mr-10']\n      }\n    ]\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nexport const BannerRegularText = (props: React.ComponentProps<typeof Text>) => {\n  const { size, hasDismiss } = useBannerContext()\n\n  return (\n    <StyledText\n      size={size}\n      containerSize={size}\n      hasDismiss={hasDismiss}\n      {...props}\n    />\n  )\n}\n\nBannerRegularText.displayName = 'BannerRegularText'\n"],"mappings":";;;;;AAOA,IAAM,aAAa,OACjB,MACA;CACE,MAAM,CAAC,6BAA6B;CACpC,UAAU;EACR,eAAe;GACb,IAAI,CAAC,OAAO;GACZ,IAAI,CAAC,OAAO;GACb;EACD,YAAY,EACV,MAAM,EAAE,EACT;EACF;CACD,kBAAkB,CAChB;EACE,eAAe;EACf,YAAY;EACZ,OAAO,CAAC,QAAQ;EACjB,CACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAa,qBAAqB,UAA6C;CAC7E,MAAM,EAAE,MAAM,eAAe,kBAAkB;AAE/C,QACE,wBAAA,cAAC,YAAD;EACQ;EACN,eAAe;EACH;EACZ,GAAI;EACJ,CAAA;;AAIN,kBAAkB,cAAc"}
+{"version":3,"file":"BannerRegularText.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularText.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Text } from '../../text/Text'\nimport { useBannerContext } from '../BannerContext'\n\nconst StyledText = styled(\n  Text,\n  {\n    base: ['text-(--banner-text-color)'],\n    variants: {\n      containerSize: {\n        sm: ['mb-4'],\n        md: ['mb-6']\n      },\n      hasDismiss: {\n        true: []\n      }\n    },\n    compoundVariants: [\n      {\n        containerSize: 'sm',\n        hasDismiss: true,\n        class: ['mr-10']\n      }\n    ]\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nexport const BannerRegularText = (\n  props: React.ComponentPropsWithoutRef<typeof Text>\n) => {\n  const { size, hasDismiss } = useBannerContext()\n\n  return (\n    <StyledText\n      size={size}\n      containerSize={size}\n      hasDismiss={hasDismiss}\n      {...props}\n    />\n  )\n}\n\nBannerRegularText.displayName = 'BannerRegularText'\n"],"mappings":";;;;;;AAOA,IAAM,aAAa,OACjB,MACA;CACE,MAAM,CAAC,6BAA6B;CACpC,UAAU;EACR,eAAe;GACb,IAAI,CAAC,OAAO;GACZ,IAAI,CAAC,OAAO;GACb;EACD,YAAY,EACV,MAAM,EAAE,EACT;EACF;CACD,kBAAkB,CAChB;EACE,eAAe;EACf,YAAY;EACZ,OAAO,CAAC,QAAQ;EACjB,CACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAa,qBACX,UACG;CACH,MAAM,EAAE,MAAM,eAAe,kBAAkB;AAE/C,QACE,oBAAC,YAAD;EACQ;EACN,eAAe;EACH;EACZ,GAAI;EACJ,CAAA;;AAIN,kBAAkB,cAAc"}