@luscii-healthtech/web-ui 52.6.0 → 52.6.2

package/dist/index.development.js

@@ -1258,7 +1258,7 @@ const createSpacingClassNames = (keys, spacingPropsArg) => {
   const underscored = keys.filter((key) => spacingPropsArg[key] && underscoredPropKeys.includes(key)).map((key) => `ui:${key.replace("_", "")}-f_${spacingPropsArg[key]}`).join(" ");
   return `${current} ${underscored}`;
 };
-const Box = (props) => {
+const BoxInner = (props, ref) => {
   const { as: Element = "div", borderRadius, borderRadiusLeft, borderRadiusRight, className, elevation, width, backgroundColor, hoverBackgroundColor, cursor } = props, attributes = __rest(props, ["as", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "className", "elevation", "width", "backgroundColor", "hoverBackgroundColor", "cursor"]);
   const spacingClasses = createSpacingClassNames(allSpacingPropNames, props);
   const shadowClassName = createShadowClassName(elevation);
@@ -1311,11 +1311,12 @@ const Box = (props) => {
     "ui:cursor-grab": cursor === "grab",
     "ui:cursor-grabbing": cursor === "grabbing"
   }, shadowClassName, borderRadiusClassName, borderRadiusLeftClassName, borderRadiusRightClassName);
-  return jsxRuntime.jsx(Element, Object.assign({ className: tailwindMerge.twMerge(boxClasses, className) }, attributesWithoutSpacingKeys));
+  return jsxRuntime.jsx(Element, Object.assign({ ref, className: tailwindMerge.twMerge(boxClasses, className) }, attributesWithoutSpacingKeys));
 };
+const Box = React__namespace.default.forwardRef(BoxInner);
 
-const Stack = (props) => {
-  const { children, gap, _gap, align = "start", justify = "normal", axis = "y", className, reverse, wrap = false, divider } = props, attributes = __rest(props, ["children", "gap", "_gap", "align", "justify", "axis", "className", "reverse", "wrap", "divider"]);
+const StackInner = (props, ref) => {
+  const { children, gap, _gap, align = "start", justify = "normal", axis = "y", className, reverse, wrap = false, divider, as } = props, attributes = __rest(props, ["children", "gap", "_gap", "align", "justify", "axis", "className", "reverse", "wrap", "divider", "as"]);
   const stackClasses = classNames__default.default(`ui:flex`, {
     "ui:flex-row": axis === "x",
     "ui:flex-col": axis === "y",
@@ -1364,19 +1365,26 @@ const Stack = (props) => {
   const classes = tailwindMerge.twMerge(stackClasses, className);
   if (divider) {
     const numberOfChildNodes = React__namespace.default.Children.toArray(children).length;
-    return jsxRuntime.jsx(Box, Object.assign({ className: classes }, attributes, { children: React__namespace.default.Children.map(children, (child, index) => {
-      const isLastItem = index >= numberOfChildNodes - 1;
-      if (React__namespace.default.isValidElement(child) === false) {
-        return null;
-      }
-      if (isLastItem) {
-        return child;
-      }
-      return jsxRuntime.jsxs(React__namespace.default.Fragment, { children: [child, divider] });
-    }) }));
+    return (
+      // @ts-expect-error - Complex polymorphic type intersection between Stack and Box props
+      jsxRuntime.jsx(Box, Object.assign({ as, ref, className: classes }, attributes, { children: React__namespace.default.Children.map(children, (child, index) => {
+        const isLastItem = index >= numberOfChildNodes - 1;
+        if (React__namespace.default.isValidElement(child) === false) {
+          return null;
+        }
+        if (isLastItem) {
+          return child;
+        }
+        return jsxRuntime.jsxs(React__namespace.default.Fragment, { children: [child, divider] });
+      }) }))
+    );
   }
-  return jsxRuntime.jsx(Box, Object.assign({ className: classes }, attributes, { children }));
+  return (
+    // @ts-expect-error - Complex polymorphic type intersection between Stack and Box props
+    jsxRuntime.jsx(Box, Object.assign({ as, ref, className: classes }, attributes, { children }))
+  );
 };
+const Stack = React__namespace.default.forwardRef(StackInner);
 
 const BaseListHeader = ({ title, subtitle, button, headerAccessory, transparent, withBorder }) => {
   const hasHeaderComponent = Boolean(button || headerAccessory);
@@ -3714,9 +3722,9 @@ const TableRoot = React__namespace.default.forwardRef((_a, ref) => {
     return child;
   })] }));
 });
-function Thead(_a) {
+const Thead = React__namespace.default.forwardRef((_a, ref) => {
   var { className, children, stickyHeader } = _a, attrs = __rest(_a, ["className", "children", "stickyHeader"]);
-  return jsxRuntime.jsx("thead", Object.assign({ className: classNames__default.default(
+  return jsxRuntime.jsx("thead", Object.assign({ ref, className: classNames__default.default(
     // Styles for all <th>
     "ui:[&>tr>th]:border-neutral-border-high-contrast ui:[&>tr>th]:border-b",
     // Styles for the first <th> in the header row
@@ -3731,10 +3739,10 @@ function Thead(_a) {
     },
     className
   ) }, attrs, { children }));
-}
-function Tbody(_a) {
+});
+const Tbody = React__namespace.default.forwardRef((_a, ref) => {
   var { className, children, hasTFoot } = _a, attrs = __rest(_a, ["className", "children", "hasTFoot"]);
-  return jsxRuntime.jsx("tbody", Object.assign({ className: classNames__default.default(
+  return jsxRuntime.jsx("tbody", Object.assign({ ref, className: classNames__default.default(
     // setting border color across all cells
     "ui:[&>tr>td]:border-neutral-border-high-contrast ui:[&>tr>th]:border-neutral-border-high-contrast",
     // Top border for all rows except the first one
@@ -3746,30 +3754,30 @@ function Tbody(_a) {
     },
     className
   ) }, attrs, { children }));
-}
-function TFoot(_a) {
+});
+const TFoot = React__namespace.default.forwardRef((_a, ref) => {
   var { className, children } = _a, attrs = __rest(_a, ["className", "children"]);
-  return jsxRuntime.jsx("tfoot", Object.assign({ className: classNames__default.default(className) }, attrs, { children }));
-}
-function Tr(_a) {
+  return jsxRuntime.jsx("tfoot", Object.assign({ ref, className: classNames__default.default(className) }, attrs, { children }));
+});
+const Tr = React__namespace.default.forwardRef((_a, ref) => {
   var { className, children } = _a, attrs = __rest(_a, ["className", "children"]);
-  return jsxRuntime.jsx(Box, Object.assign({ as: "tr", className: classNames__default.default(className) }, attrs, { children }));
-}
+  return jsxRuntime.jsx(Box, Object.assign({ as: "tr", ref, className: classNames__default.default(className) }, attrs, { children }));
+});
 const getCellClasses = (options) => {
   return classNames__default.default("ui:first:pl-l ui:last:pr-l ui:text-left", {
     "ui:px-xxs ui:py-m": !options.omitPadding
   }, options.className);
 };
-function Th(_a) {
+const Th = React__namespace.default.forwardRef((_a, ref) => {
   var { className, children, omitPadding = false } = _a, attrs = __rest(_a, ["className", "children", "omitPadding"]);
   const content = isPlainText(children) ? jsxRuntime.jsx(Text, { as: "span", variant: "strong", children }) : children;
-  return jsxRuntime.jsx("th", Object.assign({ className: getCellClasses({ omitPadding, className }) }, attrs, { children: content }));
-}
-function Td(_a) {
+  return jsxRuntime.jsx("th", Object.assign({ ref, className: getCellClasses({ omitPadding, className }) }, attrs, { children: content }));
+});
+const Td = React__namespace.default.forwardRef((_a, ref) => {
   var { className, children, omitPadding = false } = _a, attrs = __rest(_a, ["className", "children", "omitPadding"]);
   const content = isPlainText(children) ? jsxRuntime.jsx(Text, { as: "span", children }) : children;
-  return jsxRuntime.jsx("td", Object.assign({ className: getCellClasses({ omitPadding, className }) }, attrs, { children: content }));
-}
+  return jsxRuntime.jsx("td", Object.assign({ ref, className: getCellClasses({ omitPadding, className }) }, attrs, { children: content }));
+});
 const TableNew = Object.assign(TableRoot, {
   Thead,
   Tbody,