@seeqdev/qomponents 0.0.159-patch-package-alternative → 0.0.160

package/dist/index.js

@@ -53,6 +53,7 @@ browserId && parseInt(browserId.split(' ', 2)[1], 10);
 const browserIsFirefox = browserId && browserName === 'Firefox';
 
 const DEFAULT_TOOL_TIP_DELAY = 500;
+const tooltipPositions = ['top', 'left', 'right', 'bottom'];
 
 const getQTipData = ({ tooltip, tooltipPlacement, isHtmlTooltip, tooltipTestId, tooltipDelay = DEFAULT_TOOL_TIP_DELAY, }) => tooltip
     ? {
@@ -1332,7 +1333,7 @@ const arrow$4 = options => ({
  * clipping boundary. Alternative to `autoPlacement`.
  * @see https://floating-ui.com/docs/flip
  */
-const flip$3 = function (options) {
+const flip$4 = function (options) {
   if (options === void 0) {
     options = {};
   }
@@ -1618,7 +1619,7 @@ const offset$2 = function (options) {
  * keep it in view when it will overflow the clipping boundary.
  * @see https://floating-ui.com/docs/shift
  */
-const shift$2 = function (options) {
+const shift$3 = function (options) {
   if (options === void 0) {
     options = {};
   }
@@ -2672,7 +2673,7 @@ const offset$1 = offset$2;
  * keep it in view when it will overflow the clipping boundary.
  * @see https://floating-ui.com/docs/shift
  */
-const shift$1 = shift$2;
+const shift$2 = shift$3;
 
 /**
  * Optimizes the visibility of the floating element by flipping the `placement`
@@ -2680,7 +2681,7 @@ const shift$1 = shift$2;
  * clipping boundary. Alternative to `autoPlacement`.
  * @see https://floating-ui.com/docs/flip
  */
-const flip$2 = flip$3;
+const flip$3 = flip$4;
 
 /**
  * Provides data that allows you to change the size of the floating element —
@@ -3019,8 +3020,8 @@ const offset = (options, deps) => ({
  * keep it in view when it will overflow the clipping boundary.
  * @see https://floating-ui.com/docs/shift
  */
-const shift = (options, deps) => ({
-  ...shift$1(options),
+const shift$1 = (options, deps) => ({
+  ...shift$2(options),
   options: [options, deps]
 });
 
@@ -3038,8 +3039,8 @@ const limitShift = (options, deps) => ({
  * clipping boundary. Alternative to `autoPlacement`.
  * @see https://floating-ui.com/docs/flip
  */
-const flip$1 = (options, deps) => ({
-  ...flip$2(options),
+const flip$2 = (options, deps) => ({
+  ...flip$3(options),
   options: [options, deps]
 });
 
@@ -3206,13 +3207,13 @@ var PopperContent = React__namespace.forwardRef(
       },
       middleware: [
         offset({ mainAxis: sideOffset + arrowHeight, alignmentAxis: alignOffset }),
-        avoidCollisions && shift({
+        avoidCollisions && shift$1({
           mainAxis: true,
           crossAxis: false,
           limiter: sticky === "partial" ? limitShift() : void 0,
           ...detectOverflowOptions
         }),
-        avoidCollisions && flip$1({ ...detectOverflowOptions }),
+        avoidCollisions && flip$2({ ...detectOverflowOptions }),
         size({
           ...detectOverflowOptions,
           apply: ({ elements, rects, availableWidth, availableHeight }) => {
@@ -6900,6 +6901,21 @@ function autoUpdate(reference, floating, update, options) {
   };
 }
 
+/**
+ * Optimizes the visibility of the floating element by shifting it in order to
+ * keep it in view when it will overflow the clipping boundary.
+ * @see https://floating-ui.com/docs/shift
+ */
+const shift = shift$3;
+
+/**
+ * Optimizes the visibility of the floating element by flipping the `placement`
+ * in order to keep it in view when the preferred placement(s) will overflow the
+ * clipping boundary. Alternative to `autoPlacement`.
+ * @see https://floating-ui.com/docs/flip
+ */
+const flip$1 = flip$4;
+
 /**
  * Provides data to position an inner element of the floating element so that it
  * appears centered to the reference element.
@@ -7421,8 +7437,8 @@ const QTip = () => {
                 if (tooltipRef.current && tooltipTarget.current) {
                     computePosition(tooltipTarget.current, tooltipRef.current, {
                         placement: position,
-                        middleware: [offset$2(10), arrow({ element: tooltipArrowRef.current })],
-                    }).then(({ x, y, middlewareData }) => {
+                        middleware: [offset$2(10), flip$1(), shift({ padding: 8 }), arrow({ element: tooltipArrowRef.current })],
+                    }).then(({ x, y, middlewareData, placement: finalPlacement }) => {
                         Object.assign(tooltipRef.current?.style, {
                             left: `${x}px`,
                             top: `${y}px`,
@@ -7432,7 +7448,7 @@ const QTip = () => {
                             const arrowWidth = tooltipArrowRef.current?.offsetHeight / 2;
                             const tooltipHeight = tooltipRef.current?.offsetHeight;
                             const tooltipWidth = tooltipRef.current?.offsetWidth;
-                            const style = getArrowStyle(position, x || y, arrowWidth, tooltipHeight, tooltipWidth);
+                            const style = getArrowStyle(finalPlacement, x || y, arrowWidth, tooltipHeight, tooltipWidth);
                             Object.assign(tooltipArrowRef.current.style, style);
                         }
                         setShow(true);
@@ -7446,7 +7462,7 @@ const QTip = () => {
                 : positionTooltip();
         }
     };
-    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { onMouseEnter: () => setOverTooltip(true), onMouseLeave: () => setOverTooltip(false), "data-testid": tooltipTestId, ref: tooltipRef, className: 'tw-absolute tw-rounded tw-bg-black tw-p-2 tw-text-xs tw-text-white tw-z-[9999] fade-in ' +
+    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { onMouseEnter: () => setOverTooltip(true), onMouseLeave: () => setOverTooltip(false), "data-testid": tooltipTestId, ref: tooltipRef, className: 'tw-absolute tw-rounded tw-bg-black tw-max-w-96 tw-p-2 tw-text-xs tw-text-white tw-z-[9999] fade-in ' +
                 (show ? 'tw-visible' : 'tw-invisible tw-pointer-events-none'), children: [html ? jsxRuntime.jsx(HTMLTip, { text: tooltipText }) : tooltipText, jsxRuntime.jsx("div", { className: "tw-absolute tw-w-[10px] tw-h-[10px] tw-rotate-45 tw-bg-black", ref: tooltipArrowRef })] }) }));
 };
 
@@ -28786,6 +28802,31 @@ const Carousel = ({ testId = 'carousel-id', activeIndex = 0, extraClassNames = '
     return (jsxRuntime.jsxs("div", { "data-testid": testId, className: `tw-flex tw-flex-col tw-items-center tw-justify-center tw-w-full tw-overflow-hidden ${extraClassNames}`, children: [jsxRuntime.jsxs("div", { className: "tw-flex tw-items-center tw-w-full tw-h-max tw-gap-1", children: [showArrows && (jsxRuntime.jsx(Button, { icon: prevIcon, size: "lg", variant: "no-border", testId: "carousel-prev", extraClassNames: `${currentIndex === 0 && !continuous ? 'tw-invisible' : ''} ${iconExtraClassNames} tw-animate-fadeIn`, onClick: onBackClick })), jsxRuntime.jsx(motion.div, { custom: 1, initial: "initial", animate: "animate", exit: "exit", variants: slideVariants, className: "tw-w-full", children: carouselItems[currentIndex] }, currentIndex), showArrows && (jsxRuntime.jsx(Button, { icon: nextIcon, testId: "carousel-next", size: "lg", variant: "no-border", extraClassNames: `${currentIndex === carouselItems.length - 1 && !continuous ? 'tw-invisible' : ''} ${iconExtraClassNames} tw-animate-fadeIn`, onClick: onForwardClick }))] }), showIndicators && (jsxRuntime.jsx("div", { className: "tw-flex tw-gap-1 tw-mt-2", children: carouselItems.map((_, i) => (jsxRuntime.jsx("div", { className: `tw-w-2 tw-h-2 tw-rounded-full tw-cursor-pointer ${i === currentIndex ? 'tw-bg-sq-color-dark' : 'tw-bg-sq-darkish-gray'}`, onClick: () => changeSlide(i) }, i))) }))] }));
 };
 
+const buttonTypes = ['button', 'reset', 'submit', 'link'];
+const buttonSizes = ['sm', 'lg'];
+const buttonVariants = ['outline', 'theme', 'theme-light', 'warning', 'danger', 'no-border'];
+const iconPositions = ['left', 'right'];
+
+const iconTypes = [
+    'theme',
+    'white',
+    'dark-gray',
+    'darkish-gray',
+    'gray',
+    'color',
+    'info',
+    'text',
+    'warning',
+    'inherit',
+    'danger',
+    'theme-light',
+    'success',
+];
+
+const svgIconTypes = [...iconTypes, 'default'];
+
+const toolbarButtonVariants = ['outline', 'theme', 'theme-light', 'warning', 'danger', 'no-border'];
+
 exports.Accordion = Accordion;
 exports.Alert = Alert;
 exports.Button = Button;
@@ -28795,6 +28836,7 @@ exports.ButtonWithPopover = ButtonWithPopover;
 exports.Carousel = Carousel;
 exports.Checkbox = Checkbox;
 exports.Collapse = Collapse;
+exports.DEFAULT_TOOL_TIP_DELAY = DEFAULT_TOOL_TIP_DELAY;
 exports.Icon = Icon;
 exports.InputGroup = InputGroup;
 exports.Modal = Modal;
@@ -28809,4 +28851,12 @@ exports.TextArea = TextArea;
 exports.TextField = TextField;
 exports.ToolbarButton = ToolbarButton;
 exports.Tooltip = Tooltip;
+exports.buttonSizes = buttonSizes;
+exports.buttonTypes = buttonTypes;
+exports.buttonVariants = buttonVariants;
+exports.iconPositions = iconPositions;
+exports.iconTypes = iconTypes;
+exports.svgIconTypes = svgIconTypes;
+exports.toolbarButtonVariants = toolbarButtonVariants;
+exports.tooltipPositions = tooltipPositions;
 //# sourceMappingURL=index.js.map