@economic/taco 1.1.10 → 1.1.12

package/dist/taco.cjs.development.js

@@ -38,6 +38,23 @@ var PrimitiveSwitch = require('@radix-ui/react-switch');
 var Joyride = require('react-joyride');
 var Joyride__default = _interopDefault(Joyride);
 
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
@@ -3347,20 +3364,19 @@ const getOutlineClasses = state => {
   }
 };
 
-const Badge = /*#__PURE__*/React.forwardRef(function Badge(props, ref) {
-  const {
-    children,
-    compact = false,
-    outline = false,
-    state,
-    ...otherProps
-  } = props;
-  const className = cn('rounded-full border font-bold text-xs uppercase overflow-hidden whitespace-nowrap inline-flex items-center justify-center h-5', {
-    [getOutlineClasses(state)]: outline,
-    [`border-transparent ${getStateClasses(state)}`]: !outline,
-    'h-2 w-2 min-w-0': compact,
-    'h-5 py-0 px-1.5': !compact
-  }, props.className);
+var _excluded$1 = ["children", "compact", "outline", "state"];
+var Badge = /*#__PURE__*/React.forwardRef(function Badge(props, ref) {
+  var _cn;
+
+  var children = props.children,
+      _props$compact = props.compact,
+      compact = _props$compact === void 0 ? false : _props$compact,
+      _props$outline = props.outline,
+      outline = _props$outline === void 0 ? false : _props$outline,
+      state = props.state,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$1);
+
+  var className = cn('rounded-full border font-bold text-xs uppercase overflow-hidden whitespace-nowrap inline-flex items-center justify-center h-5', (_cn = {}, _cn[getOutlineClasses(state)] = outline, _cn["border-transparent " + getStateClasses(state)] = !outline, _cn['h-2 w-2 min-w-0'] = compact, _cn['h-5 py-0 px-1.5'] = !compact, _cn), props.className);
   return React.createElement("span", Object.assign({}, otherProps, {
     "aria-atomic": "true",
     "aria-live": "polite",
@@ -3561,32 +3577,32 @@ var Banner = /*#__PURE__*/React.forwardRef(function Banner(props, ref) {
   }) : null);
 });
 
-const Button$1 = /*#__PURE__*/React.forwardRef(function Button(props, ref) {
-  const {
-    fluid,
-    ...otherProps
-  } = props;
-  const className = cn(getButtonClasses(), getAppearanceClasses(otherProps.appearance), 'rounded px-3', {
+var _excluded$2 = ["fluid"];
+var Button$1 = /*#__PURE__*/React.forwardRef(function Button(props, ref) {
+  var fluid = props.fluid,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$2);
+
+  var className = cn(getButtonClasses(), getAppearanceClasses(otherProps.appearance), 'rounded px-3', {
     'cursor-not-allowed opacity-50': props.disabled,
     'focus:yt-focus active:focus:yt-focus': !props.disabled,
     'w-full': fluid
   }, props.className);
-  let children = otherProps.children; // add a chevron icon to menu buttons
+  var children = otherProps.children; // add a chevron icon to menu buttons
 
   if (typeof otherProps.menu === 'function') {
-    children = Array.isArray(children) ? [...children, React.createElement(Icon, {
+    children = Array.isArray(children) ? [].concat(children, [React.createElement(Icon, {
       key: "chevron-down",
       name: "chevron-down"
-    })] : [children, React.createElement(Icon, {
+    })]) : [children, React.createElement(Icon, {
       key: "chevron-down",
       name: "chevron-down"
     })];
   }
 
-  return createButton({ ...otherProps,
-    children,
+  return createButton(_extends({}, otherProps, {
+    children: children,
     'data-taco': 'button'
-  }, className, ref);
+  }), className, ref);
 });
 
 function useTimer(duration = 0, callback) {
@@ -4042,37 +4058,37 @@ const Provider = props => {
 const useTaco = () => React.useContext(Context);
 const useLocalization = () => useTaco().localization;
 
-const renderDay = (day, modifiers) => modifiers.disabled ? React.createElement("span", {
-  className: "dot"
-}) : day.getDate();
+var _excluded$3 = ["onChange", "value"];
+
+var renderDay = function renderDay(day, modifiers) {
+  return modifiers.disabled ? React.createElement("span", {
+    className: "dot"
+  }) : day.getDate();
+};
 
-const thisYear = /*#__PURE__*/new Date().getFullYear();
-const years = [];
+var thisYear = /*#__PURE__*/new Date().getFullYear();
+var years = [];
 
-for (let i = thisYear - 10; i <= thisYear + 10; i += 1) {
+for (var i = thisYear - 10; i <= thisYear + 10; i += 1) {
   years.push(i);
 }
 
-const Navbar = /*#__PURE__*/React.memo(({
-  onMonthChange,
-  onNextClick,
-  onPreviousClick,
-  value = new Date()
-}) => {
-  const {
-    texts: {
-      calendar: {
-        actions,
-        months
-      }
-    }
-  } = useLocalization();
+var Navbar = /*#__PURE__*/React.memo(function (_ref) {
+  var onMonthChange = _ref.onMonthChange,
+      onNextClick = _ref.onNextClick,
+      onPreviousClick = _ref.onPreviousClick,
+      _ref$value = _ref.value,
+      value = _ref$value === void 0 ? new Date() : _ref$value;
 
-  const handleChange = function handleChange(event) {
-    const {
-      year,
-      month
-    } = event.target.form;
+  var _useLocalization = useLocalization(),
+      _useLocalization$text = _useLocalization.texts.calendar,
+      actions = _useLocalization$text.actions,
+      months = _useLocalization$text.months;
+
+  var handleChange = function handleChange(event) {
+    var _event$target$form = event.target.form,
+        year = _event$target$form.year,
+        month = _event$target$form.month;
     onMonthChange(new Date(year.value, month.value));
   };
 
@@ -4085,49 +4101,59 @@ const Navbar = /*#__PURE__*/React.memo(({
     name: "month",
     onChange: handleChange,
     value: value.getMonth()
-  }, months.map((month, i) => React.createElement("option", {
-    key: month,
-    value: i
-  }, month))), React.createElement("select", {
+  }, months.map(function (month, i) {
+    return React.createElement("option", {
+      key: month,
+      value: i
+    }, month);
+  })), React.createElement("select", {
     className: "h-8 px-2",
     name: "year",
     onChange: handleChange,
     value: value.getFullYear()
-  }, years.map(year => React.createElement("option", {
-    key: year,
-    value: year
-  }, String(year))))), React.createElement("div", null, React.createElement(IconButton, {
+  }, years.map(function (year) {
+    return React.createElement("option", {
+      key: year,
+      value: year
+    }, String(year));
+  }))), React.createElement("div", null, React.createElement(IconButton, {
     appearance: "discrete",
     icon: "chevron-left",
     "aria-label": actions.previousMonth,
-    onClick: () => onPreviousClick(),
+    onClick: function onClick() {
+      return onPreviousClick();
+    },
     rounded: true
   }), React.createElement(IconButton, {
     appearance: "discrete",
     icon: "chevron-right",
     "aria-label": actions.nextMonth,
-    onClick: () => onNextClick(),
+    onClick: function onClick() {
+      return onNextClick();
+    },
     rounded: true
   })));
 });
-const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
-  const {
-    onChange: handleChange,
-    value,
-    ...otherProps
-  } = props;
-  const {
-    locale,
-    texts
-  } = useLocalization();
-  const [visibleMonth, setVisibleMonth] = React.useState(value !== null && value !== void 0 ? value : new Date());
-  React.useEffect(() => {
+var Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
+  var handleChange = props.onChange,
+      value = props.value,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$3);
+
+  var _useLocalization2 = useLocalization(),
+      locale = _useLocalization2.locale,
+      texts = _useLocalization2.texts;
+
+  var _React$useState = React.useState(value !== null && value !== void 0 ? value : new Date()),
+      visibleMonth = _React$useState[0],
+      setVisibleMonth = _React$useState[1];
+
+  React.useEffect(function () {
     if (visibleMonth !== value) {
       setVisibleMonth(value !== null && value !== void 0 ? value : new Date());
     }
   }, [value]);
 
-  const handleDayClick = (date, modifiers, event) => {
+  var handleDayClick = function handleDayClick(date, modifiers, event) {
     if (modifiers.outside || modifiers.disabled) {
       return;
     }
@@ -4135,8 +4161,8 @@ const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
     handleChange(date, event);
   };
 
-  const handleCalendarClickToday = () => {
-    const today = new Date(); // set to midday to avoid UTC offset causing dates to be mismatched server side
+  var handleCalendarClickToday = function handleCalendarClickToday() {
+    var today = new Date(); // set to midday to avoid UTC offset causing dates to be mismatched server side
 
     today.setHours(12);
     today.setMinutes(0);
@@ -4144,7 +4170,7 @@ const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
     handleChange(today);
   };
 
-  const className = cn('flex bg-white text-xs p-4', otherProps.className);
+  var className = cn('flex bg-white text-xs p-4', otherProps.className);
   return React.createElement("div", {
     "data-taco": "calendar"
   }, React.createElement(ReactDayPicker, Object.assign({}, otherProps, {
@@ -4155,14 +4181,18 @@ const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
     firstDayOfWeek: 1,
     months: texts.calendar.months,
     weekdaysShort: texts.calendar.weekdaysShort,
-    navbarElement: navProps => React.createElement(Navbar, Object.assign({}, navProps, {
-      onMonthChange: setVisibleMonth,
-      value: visibleMonth
-    })),
+    navbarElement: function navbarElement(navProps) {
+      return React.createElement(Navbar, Object.assign({}, navProps, {
+        onMonthChange: setVisibleMonth,
+        value: visibleMonth
+      }));
+    },
     onDayClick: handleDayClick,
     onMonthChange: setVisibleMonth,
     onTodayButtonClick: handleCalendarClickToday,
-    captionElement: () => null,
+    captionElement: function captionElement() {
+      return null;
+    },
     todayButton: texts.calendar.actions.today,
     showOutsideDays: true,
     renderDay: renderDay,
@@ -4171,30 +4201,32 @@ const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
   })));
 });
 
-const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
-  const {
-    checked,
-    highlighted,
-    indeterminate,
-    invalid,
-    label,
-    onChange,
-    ...otherProps
-  } = props;
-  const className = cn('bg-white h-5 w-5 border rounded text-sm flex-shrink-0 self-start mt-[0.1rem] focus:yt-focus', //hover:shadow-[0_0_0_1px_rgba(235,235,235,1)]
+var _excluded$4 = ["checked", "highlighted", "indeterminate", "invalid", "label", "onChange"];
+var Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
+  var checked = props.checked,
+      highlighted = props.highlighted,
+      indeterminate = props.indeterminate,
+      invalid = props.invalid,
+      label = props.label,
+      onChange = props.onChange,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$4);
+
+  var className = cn('bg-white h-5 w-5 border rounded text-sm flex-shrink-0 self-start mt-[0.1rem] focus:yt-focus', //hover:shadow-[0_0_0_1px_rgba(235,235,235,1)]
   props.className, {
     'border-grey-dark text-blue hover:text-blue-light focus:border-blue focus:hover:border-blue-light': !props.disabled && !invalid,
     'border-grey text-blue-light cursor-not-allowed': props.disabled,
     'bg-[rgba(255,255,0,0.2)] disabled:bg-[rgba(255,255,0,0.075)]': highlighted,
     'border-red text-red hover:text-red-light hover:border-red-light focus:border-red focus:hover:border-red-light': invalid && !props.disabled
   });
-  let handleChange;
+  var handleChange;
 
   if (onChange) {
-    handleChange = checked => onChange(checked === 'indeterminate' ? false : checked);
+    handleChange = function handleChange(checked) {
+      return onChange(checked === 'indeterminate' ? false : checked);
+    };
   }
 
-  const element = React.createElement(CheckboxPrimitive.Root, Object.assign({}, otherProps, {
+  var element = React.createElement(CheckboxPrimitive.Root, Object.assign({}, otherProps, {
     "data-taco": "checkbox",
     checked: indeterminate ? 'indeterminate' : checked,
     className: className,
@@ -4208,7 +4240,7 @@ const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
   })));
 
   if (label) {
-    const labelClassName = cn('flex items-center cursor-pointer gap-2', {
+    var labelClassName = cn('flex items-center cursor-pointer gap-2', {
       'cursor-not-allowed text-grey-dark': props.disabled
     }, props.className);
     return React.createElement("label", {
@@ -4219,9 +4251,9 @@ const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
   return element;
 });
 
-const useProxiedRef = ref => {
-  const internalRef = React.useRef(null);
-  React.useEffect(() => {
+var useProxiedRef = function useProxiedRef(ref) {
+  var internalRef = React.useRef(null);
+  React.useEffect(function () {
     if (ref) {
       if (typeof ref === 'function') {
         ref(internalRef.current);
@@ -5089,26 +5121,27 @@ var useBoundingClientRectListener = function useBoundingClientRectListener(ref)
   return dimensions;
 };
 
-const Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
-  const {
-    className: externalClassName,
-    dialog,
-    style,
-    ...otherProps
-  } = props;
-  const {
-    combobox,
-    button,
-    input,
-    popover,
-    list
-  } = useCombobox(otherProps, ref);
-  const internalRef = React.useRef(null);
-  const {
-    texts
-  } = useLocalization();
-  const selectDimensions = useBoundingClientRectListener(internalRef);
-  const className = cn('inline-flex relative', {
+var _excluded$5 = ["className", "dialog", "style"];
+var Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
+  var externalClassName = props.className,
+      dialog = props.dialog,
+      style = props.style,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$5);
+
+  var _useCombobox = useCombobox(otherProps, ref),
+      combobox = _useCombobox.combobox,
+      button = _useCombobox.button,
+      input = _useCombobox.input,
+      popover = _useCombobox.popover,
+      list = _useCombobox.list;
+
+  var internalRef = React.useRef(null);
+
+  var _useLocalization = useLocalization(),
+      texts = _useLocalization.texts;
+
+  var selectDimensions = useBoundingClientRectListener(internalRef);
+  var className = cn('inline-flex relative', {
     'yt-combobox--inline': props.inline
   }, externalClassName);
   return React.createElement("span", {
@@ -5127,7 +5160,7 @@ const Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
       appearance: "discrete",
       className: "!border-l-0 focus:!border-none focus:!shadow-none active:!border-none",
       icon: popover.open ? 'chevron-up' : 'chevron-down',
-      onClick: () => {
+      onClick: function onClick() {
         var _input$ref$current;
 
         popover.onOpenChange(true);
@@ -5135,10 +5168,11 @@ const Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
       },
       tabIndex: -1
     }) : dialog ? React.createElement(IconButton, {
+      "aria-label": texts.combobox.tooltip,
       icon: "list-search",
       disabled: props.readOnly || props.disabled,
       dialog: dialog,
-      onFocus: event => {
+      onFocus: function onFocus(event) {
         var _input$ref$current2;
 
         // Prevents the default focus behaviour of showing the tooltip, on parent tooltip element
@@ -5151,7 +5185,7 @@ const Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
     }) : undefined
   })))), React.createElement(PopoverPrimitive.Content, {
     align: "start",
-    onOpenAutoFocus: event => {
+    onOpenAutoFocus: function onOpenAutoFocus(event) {
       event.preventDefault();
     },
     sideOffset: 4
@@ -5374,8 +5408,8 @@ const UnstyledContent = /*#__PURE__*/React.forwardRef(function PopoverContent(pr
 });
 
 function mergeRefs(refs) {
-  return value => {
-    refs.forEach(ref => {
+  return function (value) {
+    refs.forEach(function (ref) {
       if (typeof ref === 'function') {
         ref(value);
       } else if (ref != null) {
@@ -5461,23 +5495,23 @@ Popover.Trigger = Trigger$1;
 Popover.Content = Content$1;
 Popover.Close = Close$1;
 
-const Datepicker = /*#__PURE__*/React.forwardRef(function Datepicker(props, ref) {
-  const {
-    className: externalClassName,
-    onReset: handleReset,
-    style,
-    shortcuts,
-    shortcutsText,
-    ...otherProps
-  } = props;
-  const {
-    calendar,
-    input
-  } = useDatepicker(otherProps, ref);
-  const {
-    texts
-  } = useLocalization();
-  const className = cn('inline-flex w-full text-black font-normal', externalClassName);
+var _excluded$6 = ["className", "onReset", "style", "shortcuts", "shortcutsText"];
+var Datepicker = /*#__PURE__*/React.forwardRef(function Datepicker(props, ref) {
+  var externalClassName = props.className,
+      handleReset = props.onReset,
+      style = props.style,
+      shortcuts = props.shortcuts,
+      shortcutsText = props.shortcutsText,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$6);
+
+  var _useDatepicker = useDatepicker(otherProps, ref),
+      calendar = _useDatepicker.calendar,
+      input = _useDatepicker.input;
+
+  var _useLocalization = useLocalization(),
+      texts = _useLocalization.texts;
+
+  var className = cn('inline-flex w-full text-black font-normal', externalClassName);
   return React.createElement("span", {
     className: className,
     "data-taco": "datepicker",
@@ -5487,37 +5521,40 @@ const Datepicker = /*#__PURE__*/React.forwardRef(function Datepicker(props, ref)
       "aria-label": texts.datepicker.expand,
       disabled: input.disabled || input.readOnly,
       icon: "calendar"
-    })), React.createElement(Popover.Content, null, ({
-      close
-    }) => React.createElement("div", {
-      className: "-m-3 flex"
-    }, React.createElement(Calendar$1, Object.assign({}, calendar, {
-      onChange: (date, event) => {
-        calendar.onChange(date, event);
-        close();
-      },
-      tabIndex: -1
-    })), shortcuts && React.createElement("div", {
-      className: "border-grey-dark flex flex-col border-l"
-    }, React.createElement("span", {
-      className: "m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold"
-    }, shortcutsText !== null && shortcutsText !== void 0 ? shortcutsText : texts.datepicker.shortcuts), React.createElement("ul", null, shortcuts.map((shortcut, i) => React.createElement("li", {
-      key: i
-    }, React.createElement("button", {
-      className: "hover:bg-grey-light flex w-full items-start px-4 py-1 text-xs",
-      onClick: event => {
-        event.persist();
-        shortcut.onClick(event);
-        close();
-      }
-    }, shortcut.text)))), handleReset && React.createElement("button", {
-      className: "text-blue hover:text-blue-light my-4 mx-auto mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs",
-      onClick: event => {
-        event.persist();
-        handleReset(event);
-        close();
-      }
-    }, texts.datepicker.clear)))))
+    })), React.createElement(Popover.Content, null, function (_ref) {
+      var close = _ref.close;
+      return React.createElement("div", {
+        className: "-m-3 flex"
+      }, React.createElement(Calendar$1, Object.assign({}, calendar, {
+        onChange: function onChange(date, event) {
+          calendar.onChange(date, event);
+          close();
+        },
+        tabIndex: -1
+      })), shortcuts && React.createElement("div", {
+        className: "border-grey-dark flex flex-col border-l"
+      }, React.createElement("span", {
+        className: "m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold"
+      }, shortcutsText !== null && shortcutsText !== void 0 ? shortcutsText : texts.datepicker.shortcuts), React.createElement("ul", null, shortcuts.map(function (shortcut, i) {
+        return React.createElement("li", {
+          key: i
+        }, React.createElement("button", {
+          className: "hover:bg-grey-light flex w-full items-start px-4 py-1 text-xs",
+          onClick: function onClick(event) {
+            event.persist();
+            shortcut.onClick(event);
+            close();
+          }
+        }, shortcut.text));
+      })), handleReset && React.createElement("button", {
+        className: "text-blue hover:text-blue-light my-4 mx-auto mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs",
+        onClick: function onClick(event) {
+          event.persist();
+          handleReset(event);
+          close();
+        }
+      }, texts.datepicker.clear)));
+    }))
   })));
 });
 
@@ -5760,12 +5797,14 @@ const Extra = /*#__PURE__*/React.forwardRef(function DialogExtra(props, ref) {
 });
 Extra.displayName = 'DialogExtra';
 
-const useSeparatedChildren = initialChildren => {
-  return React.useMemo(() => {
-    const children = [];
-    let drawer;
-    let extra;
-    React.Children.toArray(initialChildren).forEach(child => {
+var _excluded$7 = ["children", "closeOnEscape", "defaultOpen", "draggable", "onChange", "onClose", "open", "showCloseButton", "size", "trigger"];
+
+var useSeparatedChildren = function useSeparatedChildren(initialChildren) {
+  return React.useMemo(function () {
+    var children = [];
+    var drawer;
+    var extra;
+    React.Children.toArray(initialChildren).forEach(function (child) {
       var _child$type, _child$type2;
 
       if (((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName) === Drawer.displayName) {
@@ -5780,39 +5819,55 @@ const useSeparatedChildren = initialChildren => {
   }, [initialChildren]);
 };
 
-const Dialog = /*#__PURE__*/React.forwardRef(function Dialog(props, ref) {
-  const {
-    children: initialChildren,
-    closeOnEscape = true,
-    defaultOpen,
-    draggable = false,
-    onChange,
-    onClose,
-    open,
-    showCloseButton = true,
-    size = 'sm',
-    trigger,
-    ...otherProps
-  } = props;
-  const [children, drawer, extra] = useSeparatedChildren(initialChildren);
-  const [drawerOpen, setDrawerOpen] = React.useState(false);
-  const context = React.useMemo(() => ({
-    closeOnEscape,
-    draggable,
-    drawer: {
-      open: drawerOpen,
-      toggle: () => setDrawerOpen(isDrawerOpen => !isDrawerOpen)
-    },
-    elements: {
-      drawer,
-      extra
-    },
-    onClose,
-    props: otherProps,
-    showCloseButton,
-    size,
-    ref
-  }), [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]);
+var Dialog = /*#__PURE__*/React.forwardRef(function Dialog(props, ref) {
+  var initialChildren = props.children,
+      _props$closeOnEscape = props.closeOnEscape,
+      closeOnEscape = _props$closeOnEscape === void 0 ? true : _props$closeOnEscape,
+      defaultOpen = props.defaultOpen,
+      _props$draggable = props.draggable,
+      draggable = _props$draggable === void 0 ? false : _props$draggable,
+      onChange = props.onChange,
+      onClose = props.onClose,
+      open = props.open,
+      _props$showCloseButto = props.showCloseButton,
+      showCloseButton = _props$showCloseButto === void 0 ? true : _props$showCloseButto,
+      _props$size = props.size,
+      size = _props$size === void 0 ? 'sm' : _props$size,
+      trigger = props.trigger,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$7);
+
+  var _useSeparatedChildren = useSeparatedChildren(initialChildren),
+      children = _useSeparatedChildren[0],
+      drawer = _useSeparatedChildren[1],
+      extra = _useSeparatedChildren[2];
+
+  var _React$useState = React.useState(false),
+      drawerOpen = _React$useState[0],
+      setDrawerOpen = _React$useState[1];
+
+  var context = React.useMemo(function () {
+    return {
+      closeOnEscape: closeOnEscape,
+      draggable: draggable,
+      drawer: {
+        open: drawerOpen,
+        toggle: function toggle() {
+          return setDrawerOpen(function (isDrawerOpen) {
+            return !isDrawerOpen;
+          });
+        }
+      },
+      elements: {
+        drawer: drawer,
+        extra: extra
+      },
+      onClose: onClose,
+      props: otherProps,
+      showCloseButton: showCloseButton,
+      size: size,
+      ref: ref
+    };
+  }, [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]);
   return React.createElement(DialogContext.Provider, {
     value: context
   }, React.createElement(DialogPrimitive.Root, {
@@ -5829,18 +5884,19 @@ Dialog.Extra = Extra;
 Dialog.Drawer = Drawer;
 Dialog.Close = Close$2;
 
-const Field = /*#__PURE__*/React.forwardRef(function Field(props, ref) {
-  const {
-    disabled,
-    children,
-    invalid = false,
-    message,
-    ...otherProps
-  } = props;
-  const className = cn('flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]', {
+var _excluded$8 = ["disabled", "children", "invalid", "message"];
+var Field = /*#__PURE__*/React.forwardRef(function Field(props, ref) {
+  var disabled = props.disabled,
+      children = props.children,
+      _props$invalid = props.invalid,
+      invalid = _props$invalid === void 0 ? false : _props$invalid,
+      message = props.message,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$8);
+
+  var className = cn('flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]', {
     'text-grey-dark': disabled
   }, props.className);
-  const messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {
+  var messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {
     'text-grey-darkest': !invalid,
     'text-red': invalid,
     'opacity-50': disabled
@@ -5855,12 +5911,13 @@ const Field = /*#__PURE__*/React.forwardRef(function Field(props, ref) {
   }, message));
 });
 
-const Form = /*#__PURE__*/React.forwardRef(function Form(props, ref) {
-  const {
-    horizontal = false,
-    ...otherProps
-  } = props;
-  const className = cn('yt-form', {
+var _excluded$9 = ["horizontal"];
+var Form = /*#__PURE__*/React.forwardRef(function Form(props, ref) {
+  var _props$horizontal = props.horizontal,
+      horizontal = _props$horizontal === void 0 ? false : _props$horizontal,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$9);
+
+  var className = cn('yt-form', {
     'yt-form--horizontal flex flex-wrap': horizontal
   }, props.className);
   return React.createElement("form", Object.assign({}, otherProps, {
@@ -5870,12 +5927,13 @@ const Form = /*#__PURE__*/React.forwardRef(function Form(props, ref) {
   }));
 });
 
-const Group = /*#__PURE__*/React.forwardRef(function Group(props, ref) {
-  const {
-    as: Tag = 'span',
-    ...otherProps
-  } = props;
-  const className = cn('flex ', props.className);
+var _excluded$a = ["as"];
+var Group = /*#__PURE__*/React.forwardRef(function Group(props, ref) {
+  var _props$as = props.as,
+      Tag = _props$as === void 0 ? 'span' : _props$as,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$a);
+
+  var className = cn('flex ', props.className);
   return React.createElement(Tag, Object.assign({}, otherProps, {
     className: className,
     "data-taco": "group",
@@ -5883,18 +5941,19 @@ const Group = /*#__PURE__*/React.forwardRef(function Group(props, ref) {
   }));
 });
 
-const HangerContext = /*#__PURE__*/React.createContext({
+var _excluded$b = ["anchor", "children", "defaultOpen"];
+var HangerContext = /*#__PURE__*/React.createContext({
   props: {},
   ref: null
 });
-const Anchor = /*#__PURE__*/React.forwardRef(function HangerAnchor(props, ref) {
+var Anchor = /*#__PURE__*/React.forwardRef(function HangerAnchor(props, ref) {
   var _props$children;
 
-  const context = React.useContext(HangerContext);
-  let children = props.children;
+  var context = React.useContext(HangerContext);
+  var children = props.children;
 
   if (React.isValidElement(props.children) && typeof ((_props$children = props.children) === null || _props$children === void 0 ? void 0 : _props$children.type) === 'function') {
-    console.warn(`Hanger.Anchor requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`);
+    console.warn("Hanger.Anchor requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '" + props.children.type.name + "' in React.forwardRef()? Taco has wrapped '" + props.children.type.name + "' in a 'span' to maintain functionality, but this may cause unintended behaviour");
     children = React.createElement("span", null, props.children);
   }
 
@@ -5904,21 +5963,22 @@ const Anchor = /*#__PURE__*/React.forwardRef(function HangerAnchor(props, ref) {
     asChild: true
   }));
 });
-const Title$1 = /*#__PURE__*/React.forwardRef(function DialogTitle(props, ref) {
-  const className = cn('mb-1 text-base font-bold flex w-full', props.className);
+var Title$1 = /*#__PURE__*/React.forwardRef(function DialogTitle(props, ref) {
+  var className = cn('mb-1 text-base font-bold flex w-full', props.className);
   return React.createElement("span", Object.assign({}, props, {
     className: className,
     ref: ref
   }));
 });
-const Content$3 = /*#__PURE__*/React.forwardRef(function HangerContent(props, ref) {
-  const context = React.useContext(HangerContext);
-  const {
-    texts
-  } = useLocalization();
-  const className = cn('wcag-blue border border-transparent rounded p-3 pr-12 yt-shadow z-[996] focus:border-transparent max-w-sm', props.className);
+var Content$3 = /*#__PURE__*/React.forwardRef(function HangerContent(props, ref) {
+  var context = React.useContext(HangerContext);
+
+  var _useLocalization = useLocalization(),
+      texts = _useLocalization.texts;
 
-  const handleInteractOutside = event => {
+  var className = cn('wcag-blue border border-transparent rounded p-3 pr-12 yt-shadow z-[996] focus:border-transparent max-w-sm', props.className);
+
+  var handleInteractOutside = function handleInteractOutside(event) {
     event.preventDefault();
   };
 
@@ -5940,20 +6000,25 @@ const Content$3 = /*#__PURE__*/React.forwardRef(function HangerContent(props, re
     onClick: context.props.onClose
   })));
 });
-const Hanger = /*#__PURE__*/React.forwardRef(function Hanger(props, ref) {
-  const {
-    anchor,
-    children,
-    defaultOpen = true,
-    ...otherProps
-  } = props;
-  const context = React.useMemo(() => ({
-    props: otherProps,
-    ref
-  }), [otherProps]); // we do this to ensure hangers are mounted after their containers, e.g. if the container is another portal
+var Hanger = /*#__PURE__*/React.forwardRef(function Hanger(props, ref) {
+  var anchor = props.anchor,
+      children = props.children,
+      _props$defaultOpen = props.defaultOpen,
+      defaultOpen = _props$defaultOpen === void 0 ? true : _props$defaultOpen,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded$b);
+
+  var context = React.useMemo(function () {
+    return {
+      props: otherProps,
+      ref: ref
+    };
+  }, [otherProps]); // we do this to ensure hangers are mounted after their containers, e.g. if the container is another portal
 
-  const [open, setOpen] = React.useState(false);
-  React.useEffect(() => {
+  var _React$useState = React.useState(false),
+      open = _React$useState[0],
+      setOpen = _React$useState[1];
+
+  React.useEffect(function () {
     if (defaultOpen) {
       setOpen(defaultOpen);
     }
@@ -6865,23 +6930,26 @@ const Treeview = /*#__PURE__*/React__default.forwardRef(function Treeview(props,
 Treeview.Group = TreeviewGroup;
 Treeview.Item = TreeviewItem;
 
-const useDropTarget = onDrop => {
-  const [isDraggedOver, setDraggedOver] = React__default.useState(false);
-  const handleDragEnter = React__default.useCallback(event => {
+var useDropTarget = function useDropTarget(onDrop) {
+  var _React$useState = React__default.useState(false),
+      isDraggedOver = _React$useState[0],
+      setDraggedOver = _React$useState[1];
+
+  var handleDragEnter = React__default.useCallback(function (event) {
     event.preventDefault();
     setDraggedOver(true);
   }, []);
-  const handleDragLeave = React__default.useCallback(event => {
+  var handleDragLeave = React__default.useCallback(function (event) {
     event.preventDefault();
 
     if (event.target === event.currentTarget) {
       setDraggedOver(false);
     }
   }, []);
-  const handleDragOver = React__default.useCallback(event => {
+  var handleDragOver = React__default.useCallback(function (event) {
     event.preventDefault();
   }, []);
-  const handleDrop = React__default.useCallback(event => {
+  var handleDrop = React__default.useCallback(function (event) {
     event.preventDefault();
     event.persist();
     setDraggedOver(false);
@@ -6890,7 +6958,7 @@ const useDropTarget = onDrop => {
       onDrop(event);
     }
   }, [onDrop]);
-  const props = onDrop ? {
+  var props = onDrop ? {
     onDragEnter: handleDragEnter,
     onDragLeave: handleDragLeave,
     onDragOver: handleDragOver,
@@ -9409,12 +9477,12 @@ var useOnClickOutside = function useOnClickOutside(ref, callback) {
   }, [ref, callback]);
 };
 
-const Content$6 = /*#__PURE__*/React.forwardRef(function CardContent(externalProps, ref) {
-  const {
-    noPadding,
-    ...props
-  } = externalProps;
-  const className = cn('flex-grow overflow-auto', {
+var _excluded$c = ["noPadding"];
+var Content$6 = /*#__PURE__*/React.forwardRef(function CardContent(externalProps, ref) {
+  var noPadding = externalProps.noPadding,
+      props = _objectWithoutPropertiesLoose(externalProps, _excluded$c);
+
+  var className = cn('flex-grow overflow-auto', {
     'mx-4 mb-4': !noPadding
   }, props.className);
   return React.createElement("div", Object.assign({}, props, {
@@ -9422,13 +9490,11 @@ const Content$6 = /*#__PURE__*/React.forwardRef(function CardContent(externalPro
     ref: ref
   }));
 });
-const Card = /*#__PURE__*/React.forwardRef(function Card(props, ref) {
-  const {
-    title,
-    menu,
-    children
-  } = props;
-  const className = cn('bg-white flex flex-col rounded-xl shadow-[0px_0px_1px_rgba(0,0,0,0.1),0px_6px_18px_rgba(47,51,68,0.2)]', props.className);
+var Card = /*#__PURE__*/React.forwardRef(function Card(props, ref) {
+  var title = props.title,
+      menu = props.menu,
+      children = props.children;
+  var className = cn('bg-white flex flex-col rounded-xl shadow-[0px_0px_1px_rgba(0,0,0,0.1),0px_6px_18px_rgba(47,51,68,0.2)]', props.className);
   return React.createElement("div", {
     className: className,
     "data-taco": "card",
@@ -9500,16 +9566,19 @@ exports.getParentRowIndexPath = getParentRowIndexPath;
 exports.getRadioGroupItemValueAsString = getRadioGroupItemValueAsString;
 exports.icons = icons;
 exports.insertChildTableRow = insertChildTableRow;
+exports.mergeRefs = mergeRefs;
 exports.parseFromCustomString = parseFromCustomString;
 exports.parseFromISOString = parseFromISOString;
 exports.removeChildTableRow = removeChildTableRow;
 exports.setByRowIndexPath = setByRowIndexPath;
 exports.useBoundingClientRectListener = useBoundingClientRectListener;
+exports.useDropTarget = useDropTarget;
 exports.useListKeyboardNavigation = useListKeyboardNavigation;
 exports.useListScrollTo = useListScrollTo;
 exports.useLocalization = useLocalization;
 exports.useOnClickOutside = useOnClickOutside;
 exports.usePagination = usePagination;
+exports.useProxiedRef = useProxiedRef;
 exports.useRadioGroup = useRadioGroup;
 exports.useTableRowCreation = useTableRowCreation;
 exports.useTaco = useTaco;