@dreamcommerce/aurora 3.1.28 → 3.1.30

package/build/esm/packages/aurora/src/components/controls/controls_group/controls_group.js

@@ -1,11 +1,11 @@
-import React from 'react';
+import React__default from 'react';
 import { Stack } from '../../stack/stack.js';
 
 var ControlsGroup = function ControlsGroup(_ref) {
   var children = _ref.children,
     _ref$spacing = _ref.spacing,
     spacing = _ref$spacing === void 0 ? '4' : _ref$spacing;
-  return /*#__PURE__*/React.createElement(Stack, {
+  return /*#__PURE__*/React__default.createElement(Stack, {
     spacing: spacing,
     direction: "column",
     width: "100%"

package/build/esm/packages/aurora/src/components/controls/input_control/input_control.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { Control } from '../../control/control.js';
@@ -8,7 +8,7 @@ import { Label } from '../../label/label.js';
 import { Input } from '../../input/input.js';
 
 var _excluded = ["id", "name", "label", "helperText", "preElement", "postElement", "errors", "disabled", "defaultValue", "value", "placeholder", "readOnly", "type", "required", "tooltip", "onChange", "onKeyDown", "onKeyUp"];
-var InputControl = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+var InputControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var id = _ref.id,
     name = _ref.name,
     label = _ref.label,
@@ -28,14 +28,14 @@ var InputControl = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     onKeyDown = _ref.onKeyDown,
     onKeyUp = _ref.onKeyUp,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-flex-col"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     htmlFor: id,
     required: required,
     tooltip: tooltip,
     disabled: disabled
-  }, label)) : null, /*#__PURE__*/React.createElement(Input, _objectSpread2({
+  }, label)) : null, /*#__PURE__*/React__default.createElement(Input, _objectSpread2({
     ref: ref,
     id: id,
     name: name,
@@ -51,9 +51,9 @@ var InputControl = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     onChange: onChange,
     onKeyDown: onKeyDown,
     onKeyUp: onKeyUp
-  }, props)), helperText ? /*#__PURE__*/React.createElement(HelperText, {
+  }, props)), helperText ? /*#__PURE__*/React__default.createElement(HelperText, {
     color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
-  }, helperText) : null, errors ? /*#__PURE__*/React.createElement(ErrorList, {
+  }, helperText) : null, errors ? /*#__PURE__*/React__default.createElement(ErrorList, {
     errors: errors
   }) : null);
 });

package/build/esm/packages/aurora/src/components/controls/multiselect_control/multiselect_control.d.ts

@@ -1,3 +1,9 @@
 import React from 'react';
-import { TMultiSelectControlProps } from './multiselect_control_types';
-export declare const MultiSelectControl: React.FC<TMultiSelectControlProps>;
+export declare const MultiSelectControl: React.ForwardRefExoticComponent<import("../../multiselect/multiselect_types").TMultiSelectProps & {
+    id: string;
+    label?: React.ReactNode;
+    helperText?: React.ReactNode;
+    tooltip?: React.ReactNode;
+    errors?: string | string[] | undefined;
+    required?: boolean | undefined;
+} & React.RefAttributes<HTMLButtonElement>>;

package/build/esm/packages/aurora/src/components/controls/multiselect_control/multiselect_control.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { Control } from '../../control/control.js';
@@ -8,7 +8,7 @@ import { Label } from '../../label/label.js';
 import { MultiSelect } from '../../multiselect/multiselect.js';
 
 var _excluded = ["id", "options", "placeholder", "disabled", "label", "helperText", "tooltip", "errors", "onValueChange", "required"];
-var MultiSelectControl = function MultiSelectControl(_ref) {
+var MultiSelectControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var id = _ref.id,
     options = _ref.options,
     placeholder = _ref.placeholder,
@@ -20,26 +20,27 @@ var MultiSelectControl = function MultiSelectControl(_ref) {
     onValueChange = _ref.onValueChange,
     required = _ref.required,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-flex-col"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     htmlFor: id,
     required: required,
     tooltip: tooltip,
     disabled: disabled
-  }, label)) : null, /*#__PURE__*/React.createElement(MultiSelect, _objectSpread2({
+  }, label)) : null, /*#__PURE__*/React__default.createElement(MultiSelect, _objectSpread2({
     id: id,
     options: options,
     placeholder: placeholder,
     disabled: disabled,
     onValueChange: onValueChange,
-    errors: errors
-  }, props)), helperText ? /*#__PURE__*/React.createElement(HelperText, {
+    errors: errors,
+    ref: ref
+  }, props)), helperText ? /*#__PURE__*/React__default.createElement(HelperText, {
     color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
-  }, helperText) : null, errors ? /*#__PURE__*/React.createElement(ErrorList, {
+  }, helperText) : null, errors ? /*#__PURE__*/React__default.createElement(ErrorList, {
     errors: errors
   }) : null);
-};
+});
 MultiSelectControl.displayName = 'MultiSelectControl';
 
 export { MultiSelectControl };

package/build/esm/packages/aurora/src/components/controls/multiselect_control/multiselect_control.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/controls/radio_group_control/radio_group_control.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
-import { TRadioGroupControlProps } from './radio_group_control_types';
-export declare const RadioGroupControl: React.FC<TRadioGroupControlProps>;
+export declare const RadioGroupControl: React.ForwardRefExoticComponent<import("../../radio_group/radio_group_types").TRadioGroupProps & {
+    items: import("../../radio_group/radio_group_types").TRadioGroupItemProps[];
+    label?: React.ReactNode;
+    tooltip?: React.ReactNode;
+    helperText?: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement>>;

package/build/esm/packages/aurora/src/components/controls/radio_group_control/radio_group_control.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { Stack } from '../../stack/stack.js';
@@ -10,7 +10,7 @@ import { RadioGroup } from '../../radio_group/radio_group.js';
 import { RadioGroupItem } from '../../radio_group/components/radio_group_item.js';
 
 var _excluded = ["id", "name", "items", "label", "value", "defaultValue", "tooltip", "helperText", "errors", "disabled", "required", "onValueChange"];
-var RadioGroupControl = function RadioGroupControl(_ref) {
+var RadioGroupControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var id = _ref.id,
     name = _ref.name,
     items = _ref.items,
@@ -26,29 +26,30 @@ var RadioGroupControl = function RadioGroupControl(_ref) {
     required = _ref$required === void 0 ? false : _ref$required,
     onValueChange = _ref.onValueChange,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-flex-col aurora-gap-3"
-  }, /*#__PURE__*/React.createElement(Stack, {
+  }, /*#__PURE__*/React__default.createElement(Stack, {
     spacing: "0.5",
     direction: "column"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     htmlFor: id,
     required: required,
     disabled: disabled,
     tooltip: tooltip,
     className: "aurora-text"
-  }, label)) : null, helperText ? /*#__PURE__*/React.createElement(HelperText, {
+  }, label)) : null, helperText ? /*#__PURE__*/React__default.createElement(HelperText, {
     color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
-  }, helperText) : null), /*#__PURE__*/React.createElement(RadioGroup, _objectSpread2({
+  }, helperText) : null), /*#__PURE__*/React__default.createElement(RadioGroup, _objectSpread2({
     id: id,
     name: name,
     value: value,
     defaultValue: defaultValue,
     disabled: disabled,
     required: required,
-    onValueChange: onValueChange
+    onValueChange: onValueChange,
+    ref: ref
   }, rest), items.map(function (item) {
-    return /*#__PURE__*/React.createElement(RadioGroupItem, {
+    return /*#__PURE__*/React__default.createElement(RadioGroupItem, {
       key: "radio-button-".concat(item.value),
       value: item.value,
       id: item.id,
@@ -58,10 +59,11 @@ var RadioGroupControl = function RadioGroupControl(_ref) {
       helperText: item.helperText,
       tooltip: item.tooltip
     });
-  })), errors ? /*#__PURE__*/React.createElement(ErrorList, {
+  })), errors ? /*#__PURE__*/React__default.createElement(ErrorList, {
     errors: errors
   }) : null);
-};
+});
+RadioGroupControl.displayName = 'RadioGroupControl';
 
 export { RadioGroupControl };
 //# sourceMappingURL=radio_group_control.js.map

package/build/esm/packages/aurora/src/components/controls/radio_group_control/radio_group_control.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/controls/segmented_control_control/segmented_control_control.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { Stack } from '../../stack/stack.js';
@@ -23,31 +23,31 @@ var SegmentedControlControl = function SegmentedControlControl(_ref) {
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     onValueChange = _ref.onValueChange,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-flex-col aurora-gap-3"
-  }, /*#__PURE__*/React.createElement(Stack, {
+  }, /*#__PURE__*/React__default.createElement(Stack, {
     spacing: "0.5",
     direction: "column"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     htmlFor: id,
     disabled: disabled,
     tooltip: tooltip,
     className: "aurora-text"
-  }, label)) : null, helperText ? /*#__PURE__*/React.createElement(HelperText, {
+  }, label)) : null, helperText ? /*#__PURE__*/React__default.createElement(HelperText, {
     color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
-  }, helperText) : null), /*#__PURE__*/React.createElement(SegmentedControl, _objectSpread2({
+  }, helperText) : null), /*#__PURE__*/React__default.createElement(SegmentedControl, _objectSpread2({
     id: id,
     value: value,
     disabled: disabled,
     onValueChange: onValueChange
   }, rest), items.map(function (item) {
-    return /*#__PURE__*/React.createElement(SegmentedControlItem, {
+    return /*#__PURE__*/React__default.createElement(SegmentedControlItem, {
       key: "radio-button-".concat(item.value),
       value: item.value,
       id: item.id,
       disabled: disabled
     }, item.label);
-  })), errors ? /*#__PURE__*/React.createElement(ErrorList, {
+  })), errors ? /*#__PURE__*/React__default.createElement(ErrorList, {
     errors: errors
   }) : null);
 };

package/build/esm/packages/aurora/src/components/controls/select_control/select_control.d.ts

@@ -1,3 +1,8 @@
 import React from 'react';
-import { TSelectControlProps } from './select_control_types';
-export declare const SelectControl: React.FC<TSelectControlProps>;
+export declare const SelectControl: React.ForwardRefExoticComponent<import("../../select/select_types").TSelectProps & {
+    label?: React.ReactNode;
+    helperText?: React.ReactNode;
+    tooltip?: React.ReactNode;
+    errors?: string | string[] | undefined;
+    required?: boolean | undefined;
+} & React.RefAttributes<HTMLButtonElement>>;

package/build/esm/packages/aurora/src/components/controls/select_control/select_control.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { Control } from '../../control/control.js';
@@ -8,7 +8,7 @@ import { Label } from '../../label/label.js';
 import { Select } from '../../select/select.js';
 
 var _excluded = ["options", "id", "name", "label", "helperText", "tooltip", "placeholder", "searchPlaceholder", "hasSearch", "hasClearValueButton", "errors", "disabled", "value", "onValueChange", "onScroll", "innerAdditionalContent", "required"];
-var SelectControl = function SelectControl(_ref) {
+var SelectControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var options = _ref.options,
     id = _ref.id,
     name = _ref.name,
@@ -27,13 +27,13 @@ var SelectControl = function SelectControl(_ref) {
     innerAdditionalContent = _ref.innerAdditionalContent,
     required = _ref.required,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-flex-col"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     htmlFor: id,
     tooltip: tooltip,
     required: required
-  }, label)) : null, /*#__PURE__*/React.createElement(Select, _objectSpread2({
+  }, label)) : null, /*#__PURE__*/React__default.createElement(Select, _objectSpread2({
     id: id,
     name: name,
     options: options,
@@ -46,13 +46,14 @@ var SelectControl = function SelectControl(_ref) {
     errors: errors,
     value: value,
     onValueChange: onValueChange,
-    onScroll: onScroll
-  }, props)), helperText ? /*#__PURE__*/React.createElement(HelperText, {
+    onScroll: onScroll,
+    ref: ref
+  }, props)), helperText ? /*#__PURE__*/React__default.createElement(HelperText, {
     color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
-  }, helperText) : null, errors ? /*#__PURE__*/React.createElement(ErrorList, {
+  }, helperText) : null, errors ? /*#__PURE__*/React__default.createElement(ErrorList, {
     errors: errors
   }) : null);
-};
+});
 SelectControl.displayName = 'SelectControl';
 
 export { SelectControl };

package/build/esm/packages/aurora/src/components/controls/select_control/select_control.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/controls/switch_control/switch_control.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { cn } from '../../../utilities/cn.js';
@@ -28,7 +28,7 @@ var SwitchControl = function SwitchControl(_ref) {
     required = _ref$required === void 0 ? false : _ref$required,
     onCheckedChange = _ref.onCheckedChange,
     rest = _objectWithoutProperties(_ref, _excluded);
-  var _React$useState = React.useState(checked),
+  var _React$useState = React__default.useState(checked),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     _checked = _React$useState2[0],
     setChecked = _React$useState2[1];
@@ -36,9 +36,9 @@ var SwitchControl = function SwitchControl(_ref) {
     setChecked(checked);
     onCheckedChange === null || onCheckedChange === void 0 ? void 0 : onCheckedChange(checked);
   };
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-gap-3"
-  }, /*#__PURE__*/React.createElement(Switch, _objectSpread2({
+  }, /*#__PURE__*/React__default.createElement(Switch, _objectSpread2({
     id: id,
     name: name,
     value: value,
@@ -47,10 +47,10 @@ var SwitchControl = function SwitchControl(_ref) {
     disabled: disabled,
     onCheckedChange: handleCheckedChange,
     errors: errors
-  }, rest)), /*#__PURE__*/React.createElement(Stack, {
+  }, rest)), /*#__PURE__*/React__default.createElement(Stack, {
     spacing: "0.5",
     direction: "column"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     required: required,
     htmlFor: id,
     tooltip: tooltip,
@@ -58,9 +58,9 @@ var SwitchControl = function SwitchControl(_ref) {
     className: cn({
       'aurora-font-semibold': _checked
     })
-  }, label)) : null, helperText ? /*#__PURE__*/React.createElement(HelperText, {
+  }, label)) : null, helperText ? /*#__PURE__*/React__default.createElement(HelperText, {
     color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
-  }, helperText) : null, errors ? /*#__PURE__*/React.createElement(ErrorList, {
+  }, helperText) : null, errors ? /*#__PURE__*/React__default.createElement(ErrorList, {
     errors: errors
   }) : null));
 };

package/build/esm/packages/aurora/src/components/controls/text_area_control/text_area_control.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { TTextAreaControlProps } from './text_area_control_types';
-export declare const TextAreaControl: React.FC<TTextAreaControlProps>;
+export declare const TextAreaControl: React.ForwardRefExoticComponent<TTextAreaControlProps & React.RefAttributes<HTMLTextAreaElement>>;

package/build/esm/packages/aurora/src/components/controls/text_area_control/text_area_control.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { Control } from '../../control/control.js';
@@ -8,7 +8,7 @@ import { Label } from '../../label/label.js';
 import { TextArea } from '../../text_area/text_area.js';
 
 var _excluded = ["id", "name", "label", "errors", "placeholder", "disabled", "readOnly", "value", "helperText", "required", "tooltip", "onChange"];
-var TextAreaControl = function TextAreaControl(_ref) {
+var TextAreaControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var id = _ref.id,
     name = _ref.name,
     label = _ref.label,
@@ -23,14 +23,14 @@ var TextAreaControl = function TextAreaControl(_ref) {
     tooltip = _ref.tooltip,
     onChange = _ref.onChange,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-flex-col"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     htmlFor: id,
     required: required,
     tooltip: tooltip,
     disabled: disabled
-  }, label)) : null, /*#__PURE__*/React.createElement(TextArea, _objectSpread2({
+  }, label)) : null, /*#__PURE__*/React__default.createElement(TextArea, _objectSpread2({
     id: id,
     name: name,
     placeholder: placeholder,
@@ -38,13 +38,14 @@ var TextAreaControl = function TextAreaControl(_ref) {
     disabled: disabled,
     readOnly: readOnly,
     errors: errors,
-    onChange: onChange
-  }, props)), helperText ? /*#__PURE__*/React.createElement(HelperText, {
+    onChange: onChange,
+    ref: ref
+  }, props)), helperText ? /*#__PURE__*/React__default.createElement(HelperText, {
     color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
-  }, helperText) : null, errors ? /*#__PURE__*/React.createElement(ErrorList, {
+  }, helperText) : null, errors ? /*#__PURE__*/React__default.createElement(ErrorList, {
     errors: errors
   }) : null);
-};
+});
 TextAreaControl.displayName = 'TextAreaControl';
 
 export { TextAreaControl };

package/build/esm/packages/aurora/src/components/controls/text_area_control/text_area_control.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/controls/values_syncer_control/values_syncer_control.d.ts

@@ -1,6 +1,9 @@
 import React from 'react';
-import { TValuesSyncerControlProps } from './values_syncer_control_types';
-export declare const ValuesSyncerControl: {
-    <T>({ label, required, tooltip, errors, firstControl, secondControl, firstValue, secondValue, isLocked, onLock, disableLockButton, onChange, disabled, helperText, className }: TValuesSyncerControlProps<T>): React.JSX.Element;
-    displayName: string;
-};
+export declare const ValuesSyncerControl: React.ForwardRefExoticComponent<import("../../values_syncer/values_syncer_types").TValuesSyncerProps<unknown> & {
+    label?: React.ReactNode;
+    required?: boolean | undefined;
+    tooltip?: React.ReactNode;
+    helperText?: React.ReactNode;
+    errors?: string | string[] | undefined;
+    disabled?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;

package/build/esm/packages/aurora/src/components/controls/values_syncer_control/values_syncer_control.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { Control } from '../../control/control.js';
 import { ErrorList } from '../../error_list/error_list.js';
@@ -6,7 +6,7 @@ import { HelperText } from '../../helper_text/helper_text.js';
 import { Label } from '../../label/label.js';
 import { ValuesSyncer } from '../../values_syncer/values_syncer.js';
 
-var ValuesSyncerControl = function ValuesSyncerControl(_ref) {
+var ValuesSyncerControlInternal = function ValuesSyncerControlInternal(_ref, ref) {
   var label = _ref.label,
     _ref$required = _ref.required,
     required = _ref$required === void 0 ? false : _ref$required,
@@ -23,12 +23,12 @@ var ValuesSyncerControl = function ValuesSyncerControl(_ref) {
     disabled = _ref.disabled,
     helperText = _ref.helperText,
     className = _ref.className;
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-flex-col"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     tooltip: tooltip,
     required: required
-  }, label)) : null, /*#__PURE__*/React.createElement(ValuesSyncer, {
+  }, label)) : null, /*#__PURE__*/React__default.createElement(ValuesSyncer, {
     firstControl: firstControl,
     secondControl: secondControl,
     firstValue: firstValue,
@@ -37,13 +37,15 @@ var ValuesSyncerControl = function ValuesSyncerControl(_ref) {
     onLock: onLock,
     disableLockButton: disableLockButton,
     onChange: onChange,
-    className: className
-  }), helperText ? /*#__PURE__*/React.createElement(HelperText, {
+    className: className,
+    ref: ref
+  }), helperText ? /*#__PURE__*/React__default.createElement(HelperText, {
     color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
-  }, helperText) : null, errors ? /*#__PURE__*/React.createElement(ErrorList, {
+  }, helperText) : null, errors ? /*#__PURE__*/React__default.createElement(ErrorList, {
     errors: errors
   }) : null);
 };
+var ValuesSyncerControl = /*#__PURE__*/React__default.forwardRef(ValuesSyncerControlInternal);
 ValuesSyncerControl.displayName = 'ValuesSyncerControl';
 
 export { ValuesSyncerControl };

package/build/esm/packages/aurora/src/components/controls/values_syncer_control/values_syncer_control.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { IXhrImagePickerControl } from './xhr_image_picker_control_types';
-export declare const XhrImagePickerControl: React.ForwardRefExoticComponent<IXhrImagePickerControl & React.RefAttributes<HTMLButtonElement>>;
+export declare const XhrImagePickerControl: React.ForwardRefExoticComponent<IXhrImagePickerControl & React.RefAttributes<HTMLDivElement>>;

package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control.js

@@ -1,4 +1,4 @@
-import React, { forwardRef } from 'react';
+import React__default, { forwardRef } from 'react';
 import { Control } from '../../control/control.js';
 import { HelperText } from '../../helper_text/helper_text.js';
 import { Label } from '../../label/label.js';
@@ -34,13 +34,13 @@ var XhrImagePickerControl = /*#__PURE__*/forwardRef(function (_ref, ref) {
       fileAsDataUrl: fileAsDataUrl
     });
   };
-  return /*#__PURE__*/React.createElement(Control, {
+  return /*#__PURE__*/React__default.createElement(Control, {
     classname: "aurora-flex-col"
-  }, label ? (/*#__PURE__*/React.createElement(Label, {
+  }, label ? (/*#__PURE__*/React__default.createElement(Label, {
     htmlFor: id,
     tooltip: tooltip,
     required: required
-  }, label)) : null, /*#__PURE__*/React.createElement(XhrImagePicker, {
+  }, label)) : null, /*#__PURE__*/React__default.createElement(XhrImagePicker, {
     url: url,
     id: id,
     name: name,
@@ -55,7 +55,7 @@ var XhrImagePickerControl = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onImageSizeUpdated: onImageSizeUpdated,
     ImageEditor: ImageEditor,
     ref: ref
-  }), helperText ? /*#__PURE__*/React.createElement(HelperText, null, helperText) : null);
+  }), helperText ? /*#__PURE__*/React__default.createElement(HelperText, null, helperText) : null);
 });
 XhrImagePickerControl.displayName = 'XhrImagePickerControl';
 

package/build/esm/packages/aurora/src/components/divider/divider.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { cn } from '../../utilities/cn.js';
 import { Root } from '@radix-ui/react-separator';
@@ -6,7 +6,7 @@ import { DIVIDER_ORIENTATION } from './divider_constants.js';
 import { dividerVariants } from './divider_variants.js';
 
 var _excluded = ["className", "orientation", "color", "thickness", "height", "maxHeight", "minHeight", "width", "maxWidth", "minWidth", "variant", "decorative"];
-var Divider = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+var Divider = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     _ref$orientation = _ref.orientation,
     orientation = _ref$orientation === void 0 ? DIVIDER_ORIENTATION.horizontal : _ref$orientation,
@@ -22,7 +22,7 @@ var Divider = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     _ref$decorative = _ref.decorative,
     decorative = _ref$decorative === void 0 ? true : _ref$decorative,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Root, _objectSpread2({
+  return /*#__PURE__*/React__default.createElement(Root, _objectSpread2({
     ref: ref,
     decorative: decorative,
     orientation: orientation,

package/build/esm/packages/aurora/src/components/icon_button/icon_button.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { cn } from '../../utilities/cn.js';
 import { BUTTON_SIZES } from '../button/button_constants.js';
@@ -7,7 +7,7 @@ import { Slot } from '@radix-ui/react-slot';
 import { iconButtonVariants } from './icon_button_variants.js';
 
 var _excluded = ["className", "variant", "size", "asChild", "Icon", "children"];
-var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+var IconButton = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     variant = _ref.variant,
     size = _ref.size,
@@ -17,7 +17,7 @@ var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     children = _ref.children,
     props = _objectWithoutProperties(_ref, _excluded);
   var Comp = asChild ? Slot : 'button';
-  return /*#__PURE__*/React.createElement(Comp, _objectSpread2({
+  return /*#__PURE__*/React__default.createElement(Comp, _objectSpread2({
     className: cn(buttonVariants({
       variant: variant,
       size: size,
@@ -26,7 +26,7 @@ var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       size: size
     })),
     ref: ref
-  }, props), Icon ? /*#__PURE__*/React.createElement(Icon, {
+  }, props), Icon ? /*#__PURE__*/React__default.createElement(Icon, {
     size: size === BUTTON_SIZES.s ? '14' : '16'
   }) : children);
 });