@economic/taco 1.11.2 → 1.12.1

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import './css/global.css';
+export * from './components/AlertDialog/AlertDialog';
 export * from './components/Accordion/Accordion';
 export * from './components/Backdrop/Backdrop';
 export * from './components/Badge/Badge';

package/dist/taco.cjs.development.js

@@ -6,7 +6,9 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 
 var React = require('react');
 var React__default = _interopDefault(React);
+var AlertDialogPrimitive = require('@radix-ui/react-alert-dialog');
 var cn = _interopDefault(require('classnames'));
+var interactions = require('@react-aria/interactions');
 var AccordionPrimitive = require('@radix-ui/react-accordion');
 var TooltipPrimitive = require('@radix-ui/react-tooltip');
 var ReactDayPicker = _interopDefault(require('react-day-picker'));
@@ -17,7 +19,6 @@ var PopoverPrimitive = require('@radix-ui/react-popover');
 var debounce = _interopDefault(require('lodash/debounce'));
 var dateFns = require('date-fns');
 var DialogPrimitive = require('@radix-ui/react-dialog');
-var interactions = require('@react-aria/interactions');
 var HoverCardPrimitive = require('@radix-ui/react-hover-card');
 var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
 var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
@@ -37,6 +38,187 @@ var PrimitiveSwitch = require('@radix-ui/react-switch');
 var Joyride = require('react-joyride');
 var Joyride__default = _interopDefault(Joyride);
 
+/* eslint-disable @typescript-eslint/no-empty-function */
+const AlertDialogContext = /*#__PURE__*/React__default.createContext({
+  draggable: false,
+  onClose: () => {},
+  props: {},
+  ref: null,
+  size: 'dialog'
+});
+const useCurrentAlertDialog = () => {
+  return React__default.useContext(AlertDialogContext);
+};
+
+function mergeRefs(refs) {
+  return value => {
+    refs.forEach(ref => {
+      if (typeof ref === 'function') {
+        ref(value);
+      } else if (ref != null) {
+        ref.current = value;
+      }
+    });
+  };
+}
+
+const Trigger = /*#__PURE__*/React.forwardRef(function AlertDialogTrigger(props, ref) {
+  const dialog = useCurrentAlertDialog();
+  return /*#__PURE__*/React.createElement(AlertDialogPrimitive.Trigger, Object.assign({}, props, {
+    ref: mergeRefs([dialog.ref, ref]),
+    asChild: true
+  }));
+});
+
+const Footer = /*#__PURE__*/React.forwardRef(function AlertDialogFooter(props, ref) {
+  const className = 'flex justify-end gap-2';
+  return /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
+    className: className,
+    ref: ref
+  }), props.children);
+});
+const Cancel = /*#__PURE__*/React.forwardRef(function AlertDialogCancel(props, ref) {
+  return /*#__PURE__*/React.createElement(AlertDialogPrimitive.Cancel, Object.assign({}, props, {
+    ref: ref,
+    asChild: true
+  }));
+});
+const Action = /*#__PURE__*/React.forwardRef(function AlertDialogAction(props, ref) {
+  return /*#__PURE__*/React.createElement(AlertDialogPrimitive.Action, Object.assign({}, props, {
+    className: props.className,
+    ref: ref,
+    asChild: true
+  }));
+});
+
+const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(props, ref) {
+  const className = cn('fixed inset-0 cursor-default overflow-y-auto bg-purple-darker/[0.3] aria-hidden:hidden z-[996]', props.className);
+  return /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
+    className: className,
+    ref: ref
+  }));
+});
+
+const useDraggable = ref => {
+  const [position, setPosition] = React__default.useState({
+    x: 0,
+    y: 0
+  });
+  const {
+    moveProps
+  } = interactions.useMove({
+    onMove(event) {
+      var _ref$current;
+
+      const rect = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.getBoundingClientRect(); // Prevent dragging out of bounds
+
+      if (rect && (rect.left + event.deltaX < 0 || rect.right + event.deltaX > window.innerWidth || rect.top + event.deltaY < 0 || rect.bottom + event.deltaY > window.innerHeight)) {
+        return;
+      }
+
+      setPosition(({
+        x,
+        y
+      }) => {
+        x += event.deltaX;
+        y += event.deltaY;
+        return {
+          x,
+          y
+        };
+      });
+    }
+
+  });
+  return {
+    position,
+    handleProps: moveProps
+  };
+};
+
+const useProxiedRef = ref => {
+  const internalRef = React.useRef(null);
+  React.useEffect(() => {
+    if (ref) {
+      if (typeof ref === 'function') {
+        ref(internalRef.current);
+      } else {
+        ref.current = internalRef.current;
+      }
+    }
+  }, [ref]);
+  return internalRef;
+};
+
+const Title = /*#__PURE__*/React.forwardRef(function AlertDialogTitle(props, ref) {
+  const className = cn('text-center', props.className);
+  return /*#__PURE__*/React.createElement(AlertDialogPrimitive.Title, Object.assign({}, props, {
+    className: className,
+    ref: ref
+  }));
+});
+const Content = /*#__PURE__*/React.forwardRef(function AlertDialogContent(props, ref) {
+  const dialog = useCurrentAlertDialog();
+  const internalRef = useProxiedRef(ref);
+  const {
+    position,
+    handleProps: dragHandleProps
+  } = useDraggable(internalRef);
+  const className = cn('bg-white rounded relative p-6 mt-16 mx-auto origin-center rounded animate-[fade-in_150ms] z-[997] shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]', {
+    'w-128 justify-center': dialog.size === 'dialog',
+    'w-xs': dialog.size === 'xs',
+    'w-sm': dialog.size === 'sm',
+    'w-md': dialog.size === 'md',
+    'w-lg': dialog.size === 'lg'
+  });
+  return /*#__PURE__*/React.createElement(AlertDialogPrimitive.Portal, null, /*#__PURE__*/React.createElement(AlertDialogPrimitive.Overlay, {
+    asChild: true
+  }, /*#__PURE__*/React.createElement(Backdrop, null, /*#__PURE__*/React.createElement(AlertDialogPrimitive.Content, Object.assign({}, props, {
+    ref: ref,
+    className: className,
+    style: { ...props.style,
+      left: dialog.draggable ? `${position.x}px` : undefined,
+      top: dialog.draggable ? `${position.y}px` : undefined
+    }
+  }), dialog.draggable && /*#__PURE__*/React.createElement("div", Object.assign({}, dragHandleProps, {
+    "aria-label": 'alert-dialog-drag',
+    className: "yt-dialog__drag absolute-center-x bg-grey-light top-1.5 h-3 w-24 cursor-move rounded text-center"
+  })), props.children))));
+});
+
+const AlertDialog = /*#__PURE__*/React.forwardRef(function AlertDialog(props, ref) {
+  const {
+    children: initialChildren,
+    defaultOpen,
+    draggable = false,
+    size = 'dialog',
+    onChange,
+    open,
+    trigger,
+    ...otherProps
+  } = props;
+  const context = React.useMemo(() => ({
+    ref,
+    draggable,
+    props: otherProps,
+    size,
+    trigger
+  }), [draggable, open, otherProps]);
+  return /*#__PURE__*/React.createElement(AlertDialogContext.Provider, {
+    value: context
+  }, /*#__PURE__*/React.createElement(AlertDialogPrimitive.Root, Object.assign({}, props, {
+    defaultOpen: defaultOpen,
+    open: open,
+    onOpenChange: onChange
+  }), trigger && /*#__PURE__*/React.createElement(Trigger, null, trigger), props.children));
+});
+AlertDialog.Trigger = Trigger;
+AlertDialog.Content = Content;
+AlertDialog.Title = Title;
+AlertDialog.Cancel = Cancel;
+AlertDialog.Action = Action;
+AlertDialog.Footer = Footer;
+
 function IconAccountPreview(props, svgRef) {
   return /*#__PURE__*/React.createElement("svg", Object.assign({
     xmlns: "http://www.w3.org/2000/svg",
@@ -3239,7 +3421,7 @@ const StyledTrigger = /*#__PURE__*/React__default.forwardRef(function AccordionS
     name: isExpanded ? 'chevron-up' : 'chevron-down'
   }));
 });
-const Trigger = /*#__PURE__*/React__default.forwardRef(function AccordionTrigger(props, ref) {
+const Trigger$1 = /*#__PURE__*/React__default.forwardRef(function AccordionTrigger(props, ref) {
   const {
     children
   } = props;
@@ -3255,7 +3437,7 @@ const Trigger = /*#__PURE__*/React__default.forwardRef(function AccordionTrigger
     asChild: true
   }, /*#__PURE__*/React__default.createElement(StyledTrigger, null, children))));
 });
-const Content = /*#__PURE__*/React__default.forwardRef(function AccordionContent(props, ref) {
+const Content$1 = /*#__PURE__*/React__default.forwardRef(function AccordionContent(props, ref) {
   return /*#__PURE__*/React__default.createElement(AccordionPrimitive.Content, Object.assign({}, props, {
     ref: ref
   }));
@@ -3306,16 +3488,8 @@ const Accordion = props => {
   })));
 };
 Accordion.Item = Item;
-Accordion.Trigger = Trigger;
-Accordion.Content = Content;
-
-const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(props, ref) {
-  const className = cn('fixed inset-0 cursor-default overflow-y-auto bg-purple-darker/[0.3] aria-hidden:hidden z-[996]', props.className);
-  return /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
-    className: className,
-    ref: ref
-  }));
-});
+Accordion.Trigger = Trigger$1;
+Accordion.Content = Content$1;
 
 const VisuallyHidden = /*#__PURE__*/React.forwardRef(function VisuallyHidden(props, ref) {
   return /*#__PURE__*/React.createElement("span", Object.assign({}, props, {
@@ -4192,7 +4366,7 @@ const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
   })));
 });
 
-const Content$1 = /*#__PURE__*/React.forwardRef(function CardContent(externalProps, ref) {
+const Content$2 = /*#__PURE__*/React.forwardRef(function CardContent(externalProps, ref) {
   const {
     noPadding,
     ...props
@@ -4227,7 +4401,7 @@ const Card = /*#__PURE__*/React.forwardRef(function Card(props, ref) {
     className: "-mt-[4px]"
   }) : null), children);
 });
-Card.Content = Content$1;
+Card.Content = Content$2;
 
 const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
   const {
@@ -4277,20 +4451,6 @@ const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
   return element;
 });
 
-const useProxiedRef = ref => {
-  const internalRef = React.useRef(null);
-  React.useEffect(() => {
-    if (ref) {
-      if (typeof ref === 'function') {
-        ref(internalRef.current);
-      } else {
-        ref.current = internalRef.current;
-      }
-    }
-  }, [ref]);
-  return internalRef;
-};
-
 const getInputClasses = props => {
   return cn('peer bg-white text-black text-sm border font-normal not-italic no-underline rounded inline-flex leading-6 px-2 relative w-full text-ellipsis flex items-center', {
     'cursor-not-allowed text-black bg-grey': props.readOnly,
@@ -5391,23 +5551,11 @@ const UnstyledContent = /*#__PURE__*/React.forwardRef(function PopoverContent(pr
   }));
 });
 
-function mergeRefs(refs) {
-  return value => {
-    refs.forEach(ref => {
-      if (typeof ref === 'function') {
-        ref(value);
-      } else if (ref != null) {
-        ref.current = value;
-      }
-    });
-  };
-}
-
 const PopoverContext = /*#__PURE__*/React.createContext({
   props: {},
   ref: null
 });
-const Trigger$1 = /*#__PURE__*/React.forwardRef(function PopoverTrigger(props, ref) {
+const Trigger$2 = /*#__PURE__*/React.forwardRef(function PopoverTrigger(props, ref) {
   var _props$children;
 
   const context = React.useContext(PopoverContext);
@@ -5437,7 +5585,7 @@ const RenderPropWrapper = /*#__PURE__*/React.forwardRef(function RenderPropWrapp
     ref
   });
 });
-const Content$2 = /*#__PURE__*/React.forwardRef(function PopoverContent(props, ref) {
+const Content$3 = /*#__PURE__*/React.forwardRef(function PopoverContent(props, ref) {
   const className = cn('bg-white focus:border-blue-light', props.className);
   let output;
 
@@ -5473,10 +5621,10 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(props, ref) {
   }), [otherProps]);
   return /*#__PURE__*/React.createElement(PopoverContext.Provider, {
     value: context
-  }, /*#__PURE__*/React.createElement(PopoverPrimitive.Root, null, trigger && /*#__PURE__*/React.createElement(Trigger$1, null, trigger), children));
+  }, /*#__PURE__*/React.createElement(PopoverPrimitive.Root, null, trigger && /*#__PURE__*/React.createElement(Trigger$2, null, trigger), children));
 });
-Popover.Trigger = Trigger$1;
-Popover.Content = Content$2;
+Popover.Trigger = Trigger$2;
+Popover.Content = Content$3;
 Popover.Close = Close$1;
 
 const Datepicker = /*#__PURE__*/React.forwardRef(function Datepicker(props, ref) {
@@ -5561,7 +5709,7 @@ const useCurrentDialog = () => {
   return React.useContext(DialogContext);
 };
 
-const Trigger$2 = /*#__PURE__*/React.forwardRef(function DialogTrigger(props, ref) {
+const Trigger$3 = /*#__PURE__*/React.forwardRef(function DialogTrigger(props, ref) {
   const dialog = useCurrentDialog();
   return /*#__PURE__*/React.createElement(DialogPrimitive.Trigger, Object.assign({}, dialog.props, props, {
     ref: mergeRefs([dialog.ref, ref]),
@@ -5569,56 +5717,19 @@ const Trigger$2 = /*#__PURE__*/React.forwardRef(function DialogTrigger(props, re
   }));
 });
 
-const useDraggable = ref => {
-  const [position, setPosition] = React__default.useState({
-    x: 0,
-    y: 0
-  });
-  const {
-    moveProps
-  } = interactions.useMove({
-    onMove(event) {
-      var _ref$current;
-
-      const rect = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.getBoundingClientRect(); // Prevent dragging out of bounds
-
-      if (rect && (rect.left + event.deltaX < 0 || rect.right + event.deltaX > window.innerWidth || rect.top + event.deltaY < 0 || rect.bottom + event.deltaY > window.innerHeight)) {
-        return;
-      }
-
-      setPosition(({
-        x,
-        y
-      }) => {
-        x += event.deltaX;
-        y += event.deltaY;
-        return {
-          x,
-          y
-        };
-      });
-    }
-
-  });
-  return {
-    position,
-    handleProps: moveProps
-  };
-};
-
 const MenuContext = /*#__PURE__*/React.createContext(undefined);
 const useCurrentMenu = () => {
   return React.useContext(MenuContext);
 };
 
-const Title = /*#__PURE__*/React.forwardRef(function DialogTitle(props, ref) {
+const Title$1 = /*#__PURE__*/React.forwardRef(function DialogTitle(props, ref) {
   const className = cn('text-center', props.className);
   return /*#__PURE__*/React.createElement(DialogPrimitive.Title, Object.assign({}, props, {
     className: className,
     ref: ref
   }));
 });
-const Footer = /*#__PURE__*/React.forwardRef(function DialogFooter(props, ref) {
+const Footer$1 = /*#__PURE__*/React.forwardRef(function DialogFooter(props, ref) {
   const className = cn('mt-8 flex justify-end', props.className);
   return /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
     className: className,
@@ -5649,7 +5760,7 @@ const RenderPropWrapper$1 = /*#__PURE__*/React.forwardRef(function RenderPropWra
     ...renderProps
   });
 });
-const Content$3 = /*#__PURE__*/React.forwardRef(function DialogContent(props, ref) {
+const Content$4 = /*#__PURE__*/React.forwardRef(function DialogContent(props, ref) {
   const dialog = useCurrentDialog();
   const internalRef = useProxiedRef(ref);
   const {
@@ -5837,12 +5948,12 @@ const Dialog = /*#__PURE__*/React.forwardRef(function Dialog(props, ref) {
     defaultOpen: defaultOpen,
     open: open,
     onOpenChange: onChange
-  }, trigger && /*#__PURE__*/React.createElement(Trigger$2, null, trigger), children));
+  }, trigger && /*#__PURE__*/React.createElement(Trigger$3, null, trigger), children));
 });
-Dialog.Trigger = Trigger$2;
-Dialog.Content = Content$3;
-Dialog.Title = Title;
-Dialog.Footer = Footer;
+Dialog.Trigger = Trigger$3;
+Dialog.Content = Content$4;
+Dialog.Title = Title$1;
+Dialog.Footer = Footer$1;
 Dialog.Extra = Extra;
 Dialog.Drawer = Drawer;
 Dialog.Close = Close$2;
@@ -5925,14 +6036,14 @@ const Anchor = /*#__PURE__*/React.forwardRef(function HangerAnchor(props, ref) {
     asChild: true
   }));
 });
-const Title$1 = /*#__PURE__*/React.forwardRef(function DialogTitle(props, ref) {
+const Title$2 = /*#__PURE__*/React.forwardRef(function DialogTitle(props, ref) {
   const className = cn('mb-1 text-base font-bold flex w-full', props.className);
   return /*#__PURE__*/React.createElement("span", Object.assign({}, props, {
     className: className,
     ref: ref
   }));
 });
-const Content$4 = /*#__PURE__*/React.forwardRef(function HangerContent(props, ref) {
+const Content$5 = /*#__PURE__*/React.forwardRef(function HangerContent(props, ref) {
   const context = React.useContext(HangerContext);
   const {
     texts
@@ -5987,8 +6098,8 @@ const Hanger = /*#__PURE__*/React.forwardRef(function Hanger(props, ref) {
   }, anchor && /*#__PURE__*/React.createElement(Anchor, null, anchor), children));
 });
 Hanger.Anchor = Anchor;
-Hanger.Content = Content$4;
-Hanger.Title = Title$1;
+Hanger.Content = Content$5;
+Hanger.Title = Title$2;
 
 const UnstyledArrow$1 = /*#__PURE__*/React.forwardRef(function HoverCardArrow(props, ref) {
   return /*#__PURE__*/React.createElement(HoverCardPrimitive.Arrow, {
@@ -6025,13 +6136,13 @@ const UnstyledContent$1 = /*#__PURE__*/React.forwardRef(function HoverCardConten
   }));
 });
 
-const Trigger$3 = /*#__PURE__*/React.forwardRef(function HoverCardTrigger(props, ref) {
+const Trigger$4 = /*#__PURE__*/React.forwardRef(function HoverCardTrigger(props, ref) {
   return /*#__PURE__*/React.createElement(HoverCardPrimitive.Trigger, Object.assign({}, props, {
     asChild: true,
     ref: ref
   }));
 });
-const Content$5 = /*#__PURE__*/React.forwardRef(function HoverCardContent(externalProps, ref) {
+const Content$6 = /*#__PURE__*/React.forwardRef(function HoverCardContent(externalProps, ref) {
   const {
     placement,
     ...props
@@ -6050,8 +6161,8 @@ const HoverCard = props => {
     openDelay: 300
   }));
 };
-HoverCard.Trigger = Trigger$3;
-HoverCard.Content = Content$5;
+HoverCard.Trigger = Trigger$4;
+HoverCard.Content = Content$6;
 
 const SearchInput = /*#__PURE__*/React.forwardRef(function SearchInput({
   onSearch,
@@ -6490,7 +6601,7 @@ const MultiListbox = /*#__PURE__*/React.forwardRef(function Listbox(props, ref)
   })));
 });
 
-const Content$6 = /*#__PURE__*/React.forwardRef(function MenuContent(props, ref) {
+const Content$7 = /*#__PURE__*/React.forwardRef(function MenuContent(props, ref) {
   const internalRef = useProxiedRef(ref);
   const menu = useCurrentMenu();
   const {
@@ -6628,7 +6739,7 @@ const Link = /*#__PURE__*/React.forwardRef(function MenuLink(props, ref) {
   }), props.children));
 });
 
-const Trigger$4 = /*#__PURE__*/React.forwardRef(function MenuTrigger(props, ref) {
+const Trigger$5 = /*#__PURE__*/React.forwardRef(function MenuTrigger(props, ref) {
   const menu = useCurrentMenu();
   const internalRef = useProxiedRef(ref);
   React.useEffect(() => {
@@ -6849,12 +6960,12 @@ const Menu$1 = /*#__PURE__*/React.forwardRef(function Menu(externalProps, ref) {
     modal: false,
     open: open,
     onOpenChange: setOpen
-  }), trigger && /*#__PURE__*/React.createElement(Trigger$4, {
+  }), trigger && /*#__PURE__*/React.createElement(Trigger$5, {
     ref: ref
   }, trigger), children));
 });
-Menu$1.Trigger = Trigger$4;
-Menu$1.Content = Content$6;
+Menu$1.Trigger = Trigger$5;
+Menu$1.Content = Content$7;
 Menu$1.Item = Item$1;
 Menu$1.Link = Link;
 Menu$1.Checkbox = Checkbox$1;
@@ -9576,6 +9687,7 @@ const useOnClickOutside = (ref, callback) => {
 };
 
 exports.Accordion = Accordion;
+exports.AlertDialog = AlertDialog;
 exports.Backdrop = Backdrop;
 exports.Badge = Badge;
 exports.Banner = Banner;
@@ -9612,7 +9724,7 @@ exports.Table = Table;
 exports.Tabs = Tabs;
 exports.Tag = Tag$1;
 exports.Textarea = Textarea;
-exports.Title = Title$1;
+exports.Title = Title$2;
 exports.ToastProvider = ToastProvider;
 exports.Tooltip = Tooltip;
 exports.Tour = Tour;