draft-components 1.0.0-beta.13 → 1.0.0-beta.14

package/cjs/components/alert/alert.cjs

@@ -1,9 +1,10 @@
 'use strict';
 
 const jsxRuntime = require('react/jsx-runtime');
+const react = require('react');
 const reactHelpers = require('../../lib/react-helpers.cjs');
 
-function Alert({ icon = null, heading = null, variant = 'default', appearance = 'default', className, children, ...props }) {
+const Alert = react.forwardRef(function Alert({ icon = null, heading = null, variant = 'default', appearance = 'default', className, children, ...props }) {
     const shouldShowIcon = Boolean(icon);
     const shouldRenderHeading = Boolean(heading);
     const shouldRenderContent = Boolean(children);
@@ -13,6 +14,6 @@ function Alert({ icon = null, heading = null, variant = 'default', appearance =
             [`dc-alert_variant_${variant}`]: variant,
             [`dc-alert_appearance_${appearance}`]: appearance,
         }), children: [shouldShowIcon && jsxRuntime.jsx("div", { className: "dc-alert__icon", children: icon }), jsxRuntime.jsxs("div", { className: "dc-alert__body", children: [shouldRenderHeading && (jsxRuntime.jsx("h1", { className: "dc-alert__title", children: heading })), shouldRenderContent && (jsxRuntime.jsx("div", { className: "dc-alert__content", children: children }))] })] }));
-}
+});
 
 exports.Alert = Alert;

package/esm/components/alert/alert.js

@@ -1,7 +1,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
 import { classNames } from '../../lib/react-helpers.js';
 
-function Alert({ icon = null, heading = null, variant = 'default', appearance = 'default', className, children, ...props }) {
+const Alert = forwardRef(function Alert({ icon = null, heading = null, variant = 'default', appearance = 'default', className, children, ...props }) {
     const shouldShowIcon = Boolean(icon);
     const shouldRenderHeading = Boolean(heading);
     const shouldRenderContent = Boolean(children);
@@ -11,6 +12,6 @@ function Alert({ icon = null, heading = null, variant = 'default', appearance =
             [`dc-alert_variant_${variant}`]: variant,
             [`dc-alert_appearance_${appearance}`]: appearance,
         }), children: [shouldShowIcon && jsx("div", { className: "dc-alert__icon", children: icon }), jsxs("div", { className: "dc-alert__body", children: [shouldRenderHeading && (jsx("h1", { className: "dc-alert__title", children: heading })), shouldRenderContent && (jsx("div", { className: "dc-alert__content", children: children }))] })] }));
-}
+});
 
 export { Alert };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "draft-components",
-  "version": "1.0.0-beta.13",
+  "version": "1.0.0-beta.14",
   "description": "The React based UI components library.",
   "type": "module",
   "exports": {

package/types/components/alert/alert.d.ts

@@ -1,4 +1,5 @@
-import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+type AlertHTMLProps = ComponentPropsWithRef<'section'>;
 export type AlertAppearance = 'default' | 'info' | 'success' | 'warning' | 'error';
 export type AlertVariant = 'default' | 'full-width' | 'accent-border';
 export type AlertProps = {
@@ -6,5 +7,6 @@ export type AlertProps = {
     heading?: ReactNode;
     variant?: AlertVariant;
     appearance?: AlertAppearance;
-} & ComponentPropsWithoutRef<'section'>;
-export declare function Alert({ icon, heading, variant, appearance, className, children, ...props }: AlertProps): JSX.Element;
+} & AlertHTMLProps;
+export declare const Alert: import("react").ForwardRefExoticComponent<Pick<AlertProps, "key" | keyof import("react").HTMLAttributes<HTMLElement> | "icon" | "heading" | "variant" | "appearance"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};