@beryl-ui/react 2.2.1 → 2.2.3

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import { ComponentProps, ElementType, ReactElement, ReactNode } from 'react';
+import { ComponentProps, ElementType, ReactNode, ReactElement } from 'react';
 import * as styled_components_dist_types from 'styled-components/dist/types';
 import * as styled_components from 'styled-components';
 import * as Avatar$1 from '@radix-ui/react-avatar';
@@ -22,11 +22,9 @@ declare const BoxContainer: styled_components_dist_types.IStyledComponentBase<"w
 
 interface BoxProps extends ComponentProps<typeof BoxContainer> {
     as?: ElementType;
+    children?: ReactNode;
 }
-declare function Box(props: BoxProps): react_jsx_runtime.JSX.Element;
-declare namespace Box {
-    var displayName: string;
-}
+declare const Box: react.ForwardRefExoticComponent<Omit<BoxProps, "ref"> & react.RefAttributes<HTMLElement>>;
 
 interface ButtonContainerProps {
     variant?: "primary" | "secondary" | "tertiary";

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import { ComponentProps, ElementType, ReactElement, ReactNode } from 'react';
+import { ComponentProps, ElementType, ReactNode, ReactElement } from 'react';
 import * as styled_components_dist_types from 'styled-components/dist/types';
 import * as styled_components from 'styled-components';
 import * as Avatar$1 from '@radix-ui/react-avatar';
@@ -22,11 +22,9 @@ declare const BoxContainer: styled_components_dist_types.IStyledComponentBase<"w
 
 interface BoxProps extends ComponentProps<typeof BoxContainer> {
     as?: ElementType;
+    children?: ReactNode;
 }
-declare function Box(props: BoxProps): react_jsx_runtime.JSX.Element;
-declare namespace Box {
-    var displayName: string;
-}
+declare const Box: react.ForwardRefExoticComponent<Omit<BoxProps, "ref"> & react.RefAttributes<HTMLElement>>;
 
 interface ButtonContainerProps {
     variant?: "primary" | "secondary" | "tertiary";

package/dist/index.js

@@ -120,6 +120,9 @@ function Avatar2(props) {
 }
 Avatar2.displayName = "Avatar";
 
+// src/components/Box/index.tsx
+var import_react = require("react");
+
 // src/components/Box/styles.ts
 var import_styled_components2 = require("styled-components");
 var BoxContainer = import_styled_components2.styled.div`
@@ -131,13 +134,13 @@ var BoxContainer = import_styled_components2.styled.div`
 
 // src/components/Box/index.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
-function Box(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BoxContainer, __spreadValues({}, props));
-}
+var Box = (0, import_react.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BoxContainer, __spreadValues({ ref }, props));
+});
 Box.displayName = "Box";
 
 // src/components/Button/index.tsx
-var import_react = require("react");
+var import_react2 = require("react");
 
 // src/components/Button/styles.ts
 var import_styled_components3 = require("styled-components");
@@ -234,7 +237,7 @@ var ButtonContainer = import_styled_components3.styled.button`
 
 // src/components/Button/index.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
-var Button = (0, import_react.forwardRef)(
+var Button = (0, import_react2.forwardRef)(
   (props, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ButtonContainer, __spreadValues({ ref }, props));
   }
@@ -301,7 +304,7 @@ function Checkbox2(props) {
 Checkbox2.displayName = "Checkbox";
 
 // src/components/Heading/index.tsx
-var import_react2 = require("react");
+var import_react3 = require("react");
 
 // src/components/Heading/styles.ts
 var import_styled_components5 = require("styled-components");
@@ -342,7 +345,7 @@ var HeadingContainer = import_styled_components5.styled.h2`
 
 // src/components/Heading/index.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var Heading = (0, import_react2.forwardRef)(
+var Heading = (0, import_react3.forwardRef)(
   (props, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(HeadingContainer, __spreadValues({ ref }, props));
   }
@@ -353,7 +356,7 @@ Heading.displayName = "Heading";
 var import_styled_components7 = require("styled-components");
 
 // src/components/Text/index.tsx
-var import_react3 = require("react");
+var import_react4 = require("react");
 
 // src/components/Text/styles.ts
 var import_styled_components6 = require("styled-components");
@@ -368,7 +371,7 @@ var TextContainer = import_styled_components6.styled.p`
 
 // src/components/Text/index.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
-var Text = (0, import_react3.forwardRef)(
+var Text = (0, import_react4.forwardRef)(
   (props, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TextContainer, __spreadValues({ ref }, props));
   }
@@ -414,7 +417,7 @@ function MultiStep({ size, currentStep = 1 }) {
 MultiStep.displayName = "MultiStep";
 
 // src/components/TextArea/index.tsx
-var import_react4 = require("react");
+var import_react5 = require("react");
 
 // src/components/TextArea/styles.ts
 var import_styled_components8 = require("styled-components");
@@ -448,13 +451,13 @@ var TextAreaContainer = import_styled_components8.styled.textarea`
 
 // src/components/TextArea/index.tsx
 var import_jsx_runtime8 = require("react/jsx-runtime");
-var TextArea = (0, import_react4.forwardRef)((props, ref) => {
+var TextArea = (0, import_react5.forwardRef)((props, ref) => {
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(TextAreaContainer, __spreadValues({ ref }, props));
 });
 TextArea.displayName = "TextArea";
 
 // src/components/TextInput/index.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 
 // src/components/TextInput/styles.ts
 var import_styled_components9 = require("styled-components");
@@ -513,7 +516,7 @@ var Input = import_styled_components9.styled.input`
 
 // src/components/TextInput/index.tsx
 var import_jsx_runtime9 = require("react/jsx-runtime");
-var TextInput = (0, import_react5.forwardRef)(
+var TextInput = (0, import_react6.forwardRef)(
   (_a, ref) => {
     var _b = _a, { prefix } = _b, props = __objRest(_b, ["prefix"]);
     return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(TextInputContainer, { children: [
@@ -527,7 +530,7 @@ TextInput.displayName = "TextInput";
 // src/components/Toast/index.tsx
 var RadixToast = __toESM(require("@radix-ui/react-toast"));
 var import_phosphor_react3 = require("phosphor-react");
-var import_react6 = require("react");
+var import_react7 = require("react");
 
 // src/components/Toast/styles.ts
 var Toast = __toESM(require("@radix-ui/react-toast"));
@@ -618,9 +621,9 @@ var ToastClose = (0, import_styled_components10.styled)(Toast.Close)`
 
 // src/components/Toast/index.tsx
 var import_jsx_runtime10 = require("react/jsx-runtime");
-var ToastContext = (0, import_react6.createContext)({});
+var ToastContext = (0, import_react7.createContext)({});
 function ToastProvider({ children }) {
-  const [toasts, setToasts] = (0, import_react6.useState)([]);
+  const [toasts, setToasts] = (0, import_react7.useState)([]);
   function showToast({ title, description }) {
     const newToast = {
       id: (/* @__PURE__ */ new Date()).getTime().toString(),
@@ -654,7 +657,7 @@ function ToastProvider({ children }) {
   ] }) });
 }
 var useToast = () => {
-  const context = (0, import_react6.useContext)(ToastContext);
+  const context = (0, import_react7.useContext)(ToastContext);
   if (!context) {
     throw new Error("useToast must be used within a ToastProvider");
   }

package/dist/index.mjs

@@ -74,6 +74,9 @@ function Avatar2(props) {
 }
 Avatar2.displayName = "Avatar";
 
+// src/components/Box/index.tsx
+import { forwardRef } from "react";
+
 // src/components/Box/styles.ts
 import { styled as styled2 } from "styled-components";
 var BoxContainer = styled2.div`
@@ -85,13 +88,13 @@ var BoxContainer = styled2.div`
 
 // src/components/Box/index.tsx
 import { jsx as jsx2 } from "react/jsx-runtime";
-function Box(props) {
-  return /* @__PURE__ */ jsx2(BoxContainer, __spreadValues({}, props));
-}
+var Box = forwardRef((props, ref) => {
+  return /* @__PURE__ */ jsx2(BoxContainer, __spreadValues({ ref }, props));
+});
 Box.displayName = "Box";
 
 // src/components/Button/index.tsx
-import { forwardRef } from "react";
+import { forwardRef as forwardRef2 } from "react";
 
 // src/components/Button/styles.ts
 import { css, styled as styled3 } from "styled-components";
@@ -188,7 +191,7 @@ var ButtonContainer = styled3.button`
 
 // src/components/Button/index.tsx
 import { jsx as jsx3 } from "react/jsx-runtime";
-var Button = forwardRef(
+var Button = forwardRef2(
   (props, ref) => {
     return /* @__PURE__ */ jsx3(ButtonContainer, __spreadValues({ ref }, props));
   }
@@ -255,7 +258,7 @@ function Checkbox2(props) {
 Checkbox2.displayName = "Checkbox";
 
 // src/components/Heading/index.tsx
-import { forwardRef as forwardRef2 } from "react";
+import { forwardRef as forwardRef3 } from "react";
 
 // src/components/Heading/styles.ts
 import { css as css2, styled as styled5 } from "styled-components";
@@ -296,7 +299,7 @@ var HeadingContainer = styled5.h2`
 
 // src/components/Heading/index.tsx
 import { jsx as jsx5 } from "react/jsx-runtime";
-var Heading = forwardRef2(
+var Heading = forwardRef3(
   (props, ref) => {
     return /* @__PURE__ */ jsx5(HeadingContainer, __spreadValues({ ref }, props));
   }
@@ -307,7 +310,7 @@ Heading.displayName = "Heading";
 import { styled as styled7 } from "styled-components";
 
 // src/components/Text/index.tsx
-import { forwardRef as forwardRef3 } from "react";
+import { forwardRef as forwardRef4 } from "react";
 
 // src/components/Text/styles.ts
 import { styled as styled6 } from "styled-components";
@@ -322,7 +325,7 @@ var TextContainer = styled6.p`
 
 // src/components/Text/index.tsx
 import { jsx as jsx6 } from "react/jsx-runtime";
-var Text = forwardRef3(
+var Text = forwardRef4(
   (props, ref) => {
     return /* @__PURE__ */ jsx6(TextContainer, __spreadValues({ ref }, props));
   }
@@ -368,7 +371,7 @@ function MultiStep({ size, currentStep = 1 }) {
 MultiStep.displayName = "MultiStep";
 
 // src/components/TextArea/index.tsx
-import { forwardRef as forwardRef4 } from "react";
+import { forwardRef as forwardRef5 } from "react";
 
 // src/components/TextArea/styles.ts
 import { styled as styled8 } from "styled-components";
@@ -402,13 +405,13 @@ var TextAreaContainer = styled8.textarea`
 
 // src/components/TextArea/index.tsx
 import { jsx as jsx8 } from "react/jsx-runtime";
-var TextArea = forwardRef4((props, ref) => {
+var TextArea = forwardRef5((props, ref) => {
   return /* @__PURE__ */ jsx8(TextAreaContainer, __spreadValues({ ref }, props));
 });
 TextArea.displayName = "TextArea";
 
 // src/components/TextInput/index.tsx
-import { forwardRef as forwardRef5 } from "react";
+import { forwardRef as forwardRef6 } from "react";
 
 // src/components/TextInput/styles.ts
 import { styled as styled9 } from "styled-components";
@@ -467,7 +470,7 @@ var Input = styled9.input`
 
 // src/components/TextInput/index.tsx
 import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
-var TextInput = forwardRef5(
+var TextInput = forwardRef6(
   (_a, ref) => {
     var _b = _a, { prefix } = _b, props = __objRest(_b, ["prefix"]);
     return /* @__PURE__ */ jsxs3(TextInputContainer, { children: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beryl-ui/react",
-  "version": "2.2.1",
+  "version": "2.2.3",
   "description": "React components for the beryl-ui Design System.",
   "license": "MIT",
   "main": "./dist/index.js",
@@ -29,8 +29,8 @@
     "styled-components"
   ],
   "scripts": {
-    "build": "tsup src/index.tsx --format esm,cjs --dts --external react,styled-components",
-    "dev": "tsup src/index.tsx --format esm,cjs --dts --external react --watch",
+    "build": "tsup",
+    "dev": "tsup",
     "lint": "eslint src --ext .ts,.tsx --fix"
   },
   "peerDependencies": {