@shopgate/engage 7.32.0-beta.7 → 7.32.0-beta.9

package/components/v2/ButtonBase/ButtonBase.d.ts

@@ -1,10 +1,5 @@
 import React from 'react';
-/**
- * The ButtonBase component serves as a foundational button element that can be extended with
- * additional styles and functionality. It handles basic button behavior, including disabled
- * state and type validation.
- */
-declare const ButtonBase: React.ForwardRefExoticComponent<ButtonBaseOwnProps & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
+import type { NavigationState } from '@shopgate/engage/core/router/helpers';
 declare const useStyles: (params: void, muiStyleOverridesParams?: {
     props: Record<string, unknown>;
     ownerState?: Record<string, unknown> | undefined;
@@ -14,9 +9,41 @@ declare const useStyles: (params: void, muiStyleOverridesParams?: {
     css: import("tss-react").Css;
     cx: import("tss-react").Cx;
 };
-export interface ButtonBaseOwnProps {
+export interface LinkOptions {
     /**
-     * If true, the button will be disabled and not respond to user interactions.
+     * Meta state to attach to the target route.
+     */
+    state?: NavigationState;
+    /**
+     * Where to open the target, e.g. `_blank`. Read by the router when the target is an external
+     * or a native link.
+     */
+    target?: string;
+    /**
+     * If true, the current route is replaced instead of a new one being pushed.
+     * @default false
+     */
+    replace?: boolean;
+}
+export interface ButtonBaseOwnProps<C extends React.ElementType = 'button'> {
+    /**
+     * The element or component rendered as the root node. Defaults to `button`, or to `a` on web
+     * builds when `href` is set. Note that a non focusable element (e.g. `div`) needs its own
+     * `tabIndex` to stay keyboard operable.
+     */
+    component?: C;
+    /**
+     * Renders the button as a link to this path. Navigation goes through the app router rather than
+     * the browser, so external and native URLs are handled as well.
+     */
+    href?: string;
+    /**
+     * Navigation options. Only meaningful together with `href`.
+     */
+    linkOptions?: LinkOptions;
+    /**
+     * If true, the button will be disabled and not respond to user interactions. Rendered as the
+     * native attribute on a button, and as `aria-disabled` on any other element.
      * @default false
      */
     disabled?: boolean;
@@ -25,16 +52,29 @@ export interface ButtonBaseOwnProps {
      * @default false
      */
     disableRipple?: boolean;
+    /**
+     * If true, the `engage__button-base` css hook is not rendered. Set by wrappers that provide a
+     * hook of their own, such as `Button`.
+     * @default false
+     */
+    disableBaseClassName?: boolean;
     /**
      * Custom class name for the button.
      */
     className?: string;
+    /**
+     * Value for the `data-test-id` attribute of the button.
+     */
+    testId?: string;
     /**
      * Override or extend the styles applied to the component.
      */
     classes?: Partial<ReturnType<typeof useStyles>['classes']>;
     children: React.ReactNode;
 }
-export type ButtonBaseProps = ButtonBaseOwnProps & React.ButtonHTMLAttributes<HTMLButtonElement>;
-export default ButtonBase;
+export type ButtonBaseProps<C extends React.ElementType = 'button'> = ButtonBaseOwnProps<C> & Omit<React.ComponentPropsWithRef<C>, keyof ButtonBaseOwnProps<C>>;
+declare const _default: <C extends React.ElementType = "button">(props: ButtonBaseProps<C> & {
+    ref?: React.ComponentPropsWithRef<C>["ref"];
+}) => React.ReactElement | null;
+export default _default;
 //# sourceMappingURL=ButtonBase.d.ts.map

package/components/v2/ButtonBase/ButtonBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonBase.d.ts","sourceRoot":"","sources":["../../../../components/v2/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAQ1C;;;;GAIG;AACH,QAAA,MAAM,UAAU,8IAsEd,CAAC;AAEH,QAAA,MAAM,SAAS;;cAyCP,CAAC;;;;;;CAVP,CAAC;AAEH,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IAC3D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,MAAM,eAAe,GAAG,kBAAkB,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;AAEjG,eAAe,UAAU,CAAC"}
+{"version":3,"file":"ButtonBase.d.ts","sourceRoot":"","sources":["../../../../components/v2/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAOrD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AA0Q5E,QAAA,MAAM,SAAS;;cArLJ,CAAC;;;;;;CAuNV,CAAC;AAEH,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ;IACxE;;;;OAIG;IACH,SAAS,CAAC,EAAE,CAAC,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IAC3D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAChE,kBAAkB,CAAC,CAAC,CAAC,GACrB,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,MAAM,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC;wBAQhC,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EACzE,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAA;CAAE,KACxE,KAAK,CAAC,YAAY,GAAG,IAAI;AAF9B,wBAE+B"}

package/components/v2/ButtonBase/ButtonBase.js

@@ -1,87 +1,254 @@
 import "core-js/modules/es.array.includes.js";
-import React, { forwardRef } from 'react';
+import "core-js/modules/es.string.replace.js";
+import React, { forwardRef, useEffect } from 'react';
 import { makeStyles } from '@shopgate/engage/styles';
 import { useReduceMotion } from '@shopgate/engage/a11y/hooks';
+// Imported from the defining modules instead of the `core` barrels on purpose: `core/hooks` imports
+// from `engage/components`, so going through a barrel would create a circular import.
+import { useNavigation } from '@shopgate/engage/core/hooks/useNavigation';
+import { hasWebBridge } from '@shopgate/engage/core/helpers/bridge';
 import Ripple from "./Ripple";
 import { usePressRipple } from "./hooks";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const supportedButtonTypes = ['button', 'submit', 'reset'];
 
+/**
+ * Whether a pointer position sits within the bounds of an element.
+ * @param element The element to measure.
+ * @param clientX Horizontal position of the pointer.
+ * @param clientY Vertical position of the pointer.
+ * @returns Whether the position is inside the element.
+ */
+const containsPoint = (element, clientX, clientY) => {
+  const {
+    top,
+    right,
+    bottom,
+    left
+  } = element.getBoundingClientRect();
+  return clientX >= left && clientX <= right && clientY >= top && clientY <= bottom;
+};
+
+/**
+ * Props read off the resolved element rather than declared on `ButtonBaseOwnProps`. Typed loosely
+ * because the element type is generic - `React.ComponentPropsWithRef<C>` keeps consumers exact.
+ */
+
 /**
  * The ButtonBase component serves as a foundational button element that can be extended with
  * additional styles and functionality. It handles basic button behavior, including disabled
  * state and type validation.
  */
-const ButtonBase = /*#__PURE__*/forwardRef((props, ref) => {
+function ButtonBase(props, ref) {
   const {
+    component,
+    href,
+    linkOptions,
     disabled = false,
     disableRipple: disableRippleProp = false,
+    disableBaseClassName = false,
+    className,
+    classes: classesProp,
+    testId,
+    children,
+    ...rest
+  } = props;
+  const {
     type = 'button',
+    onClick,
+    onKeyDown,
     onPointerDown,
     onPointerUp,
     onPointerLeave,
     onPointerCancel,
-    className,
-    children,
     ...other
-  } = props;
+  } = rest;
   const {
     classes,
     cx
   } = useStyles(undefined, {
     props: {
-      classes: props.classes
+      classes: classesProp
     }
   });
   const {
     ripples,
     start,
-    end
+    end,
+    clearAll
   } = usePressRipple();
   const reduceMotion = useReduceMotion();
+  const {
+    push,
+    replace
+  } = useNavigation();
   const disableRipple = disableRippleProp || reduceMotion;
+
+  // A button that disables itself on click gets `pointer-events: none`, which makes the browser
+  // drop the pointer capture. The pointer up then lands somewhere else and the ripple would never
+  // be told to finish, so it's cleared here instead.
+  useEffect(() => {
+    if (disabled) {
+      clearAll();
+    }
+  }, [disabled, clearAll]);
+
+  // A real anchor is only safe on web builds. Inside the app webview `preventDefault()` sometimes
+  // fails and the page navigates for real, so link buttons stay `<button>` there.
+  const Component = component || (href && hasWebBridge() ? 'a' : 'button');
+  const isButtonElement = Component === 'button';
+
+  /**
+   * Hands the target over to the app router. Deferred like the `Link` component does, so the
+   * current event finishes dispatching before the route changes.
+   */
+  const navigate = () => {
+    if (!href) {
+      return;
+    }
+    const state = {
+      ...linkOptions?.state,
+      ...(linkOptions?.target ? {
+        target: linkOptions.target
+      } : {})
+    };
+    const params = {
+      pathname: href,
+      ...(Object.keys(state).length ? {
+        state
+      } : {})
+    };
+    setTimeout(() => {
+      if (linkOptions?.replace) {
+        replace(params);
+      } else {
+        push(params);
+      }
+    }, 0);
+  };
+  const handleClick = event => {
+    if (disabled) {
+      event.preventDefault();
+      return;
+    }
+
+    // The pointer capture taken on pointer down redirects the release to this element, so a pointer
+    // that went up somewhere else still arrives here as a click. Without the capture the browser
+    // would have dropped it. Keyboard activation reports no button presses and carries no position,
+    // so it never takes this path.
+    if (event.detail > 0 && !containsPoint(event.currentTarget, event.clientX, event.clientY)) {
+      event.preventDefault();
+      return;
+    }
+    onClick?.(event);
+    if (!href || event.defaultPrevented) {
+      return;
+    }
+    event.preventDefault();
+    navigate();
+  };
+  const handleKeyDown = event => {
+    onKeyDown?.(event);
+    if (isButtonElement || disabled || event.defaultPrevented) {
+      return;
+    }
+    if (event.key !== 'Enter' && event.key !== ' ') {
+      return;
+    }
+
+    // Only buttons activate on Enter and Space. Preventing the default also stops an anchor from
+    // firing its own click on Enter, so the element is activated exactly once.
+    event.preventDefault();
+    event.currentTarget.click();
+  };
   const handlePointerDown = event => {
-    if (!disabled && !disableRipple) {
+    if (disabled) {
+      return;
+    }
+    if (!disableRipple) {
       event.currentTarget.setPointerCapture?.(event.pointerId);
       start(event);
     }
     onPointerDown?.(event);
   };
+
+  /**
+   * Gives up pointer capture that was taken on pointer down. While an element captures the pointer,
+   * hit testing is redirected to it, so it keeps matching `:hover` and never receives a leave event.
+   * @param event The pointer event.
+   */
+  const releaseCapture = event => {
+    const target = event.currentTarget;
+    if (target.hasPointerCapture?.(event.pointerId)) {
+      target.releasePointerCapture(event.pointerId);
+    }
+  };
   const handlePointerUp = event => {
+    releaseCapture(event);
     if (!disableRipple) {
       end(event.pointerId);
     }
+    if (disabled) {
+      return;
+    }
     onPointerUp?.(event);
   };
   const handlePointerCancel = event => {
+    releaseCapture(event);
     if (!disableRipple) {
       end(event.pointerId);
     }
+    if (disabled) {
+      return;
+    }
     onPointerCancel?.(event);
   };
+
+  /**
+   * Fires whenever the capture taken on pointer down ends - including when the browser drops it
+   * because the element stopped being hit testable. Without this the ripple would stay behind.
+   * @param event The pointer event.
+   */
+  const handleLostPointerCapture = event => {
+    if (!disableRipple) {
+      end(event.pointerId);
+    }
+  };
   const handlePointerLeave = event => {
     if (!disableRipple && event.buttons === 1) {
       end(event.pointerId);
     }
+    if (disabled) {
+      return;
+    }
     onPointerLeave?.(event);
   };
-  return /*#__PURE__*/_jsxs("button", {
+  return /*#__PURE__*/_jsxs(Component, {
     ref: ref,
-    className: cx(classes.root, className),
-    disabled: disabled,
+    "data-test-id": testId,
+    className: cx(classes.root, !disableBaseClassName && 'engage__button-base', className),
+    onClick: handleClick,
+    onKeyDown: handleKeyDown,
     onPointerDown: handlePointerDown,
     onPointerUp: handlePointerUp,
     onPointerCancel: handlePointerCancel,
-    onPointerLeave: handlePointerLeave
-    // eslint-disable-next-line react/button-has-type
-    ,
-    type: supportedButtonTypes.includes(type) ? type : 'button',
+    onPointerLeave: handlePointerLeave,
+    onLostPointerCapture: handleLostPointerCapture,
+    ...(isButtonElement ? {
+      disabled,
+      type: supportedButtonTypes.includes(type) ? type : 'button'
+    } : {
+      'aria-disabled': disabled || undefined,
+      ...(href ? {
+        href
+      } : {})
+    }),
     ...other,
     children: [children, !disableRipple && /*#__PURE__*/_jsx(Ripple, {
       ripples: ripples
     })]
   });
-});
+}
 const useStyles = makeStyles({
   name: 'ButtonBase'
 })({
@@ -109,9 +276,17 @@ const useStyles = makeStyles({
       borderStyle: 'none'
     },
     '&:disabled': {
+      cursor: 'not-allowed'
+    },
+    '&[aria-disabled="true"]': {
       pointerEvents: 'none',
       cursor: 'default'
     }
   }
 });
-export default ButtonBase;
+const ButtonBaseWithRef = /*#__PURE__*/forwardRef(ButtonBase);
+ButtonBaseWithRef.displayName = 'ButtonBase';
+
+// `forwardRef` erases the generic, so the call signature is restored with a cast. Same approach as
+// the Typography component.
+export default ButtonBaseWithRef;

package/components/v2/ButtonBase/hooks.d.ts

@@ -1,6 +1,5 @@
 export interface RippleItem {
     key: number;
-    pointerId: number;
     x: number;
     y: number;
     size: number;

package/components/v2/ButtonBase/hooks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../../components/v2/ButtonBase/hooks.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,UAAU;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc;;mBAKM,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC;qBA2B7B,MAAM;;EA0B3C"}
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../../components/v2/ButtonBase/hooks.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,UAAU;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc;;mBAYM,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC;qBAqC7B,MAAM;;EA2C3C"}

package/components/v2/ButtonBase/hooks.js

@@ -1,4 +1,4 @@
-import { useCallback, useRef, useState } from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
 import { RIPPLE_MIN_VISIBLE_MS } from "./constants";
 /**
  * Manages the active ripple queue.
@@ -12,39 +12,63 @@ import { RIPPLE_MIN_VISIBLE_MS } from "./constants";
 export function usePressRipple() {
   const [ripples, setRipples] = useState([]);
   const nextKey = useRef(0);
-  const startedAtByPointer = useRef(new Map());
+  const startedAtByKey = useRef(new Map());
+  const activeKeyByPointer = useRef(new Map());
+  const pendingTimeouts = useRef(new Set());
+  useEffect(() => () => {
+    pendingTimeouts.current.forEach(timeoutId => window.clearTimeout(timeoutId));
+    pendingTimeouts.current.clear();
+  }, []);
   const start = useCallback(event => {
     const element = event.currentTarget;
     const rect = element.getBoundingClientRect();
-    const rippleX = Math.round(event.clientX - rect.left);
-    const rippleY = Math.round(event.clientY - rect.top);
+    const hasPointerPosition = Number.isFinite(event.clientX) && Number.isFinite(event.clientY);
+    const rippleX = hasPointerPosition ? Math.round(event.clientX - rect.left) : Math.round(element.clientWidth / 2);
+    const rippleY = hasPointerPosition ? Math.round(event.clientY - rect.top) : Math.round(element.clientHeight / 2);
     const sizeX = Math.max(element.clientWidth - rippleX, rippleX) * 2 + 2;
     const sizeY = Math.max(element.clientHeight - rippleY, rippleY) * 2 + 2;
     const rippleSize = Math.sqrt(sizeX ** 2 + sizeY ** 2);
-    startedAtByPointer.current.set(event.pointerId, performance.now());
     nextKey.current += 1;
+    const key = nextKey.current;
+    startedAtByKey.current.set(key, performance.now());
+
+    // A mouse reuses one pointerId for every press, so the pointer only ever points at the newest
+    // one. Keying the rest by ripple instead means an earlier press can no longer end this one.
+    activeKeyByPointer.current.set(event.pointerId, key);
     setRipples(prev => [].concat(prev, [{
-      key: nextKey.current,
-      pointerId: event.pointerId,
+      key,
       x: rippleX,
       y: rippleY,
       size: rippleSize
     }]));
   }, []);
   const end = useCallback(pointerId => {
-    const startedAt = startedAtByPointer.current.get(pointerId);
+    const key = activeKeyByPointer.current.get(pointerId);
+    if (key == null) {
+      return;
+    }
+
+    // Pointer up, cancel, leave and lost capture can all fire for a single press, and the press is
+    // over after whichever comes first.
+    activeKeyByPointer.current.delete(pointerId);
+    const startedAt = startedAtByKey.current.get(key);
     if (startedAt == null) {
       return;
     }
     const elapsed = performance.now() - startedAt;
     const delay = Math.max(0, RIPPLE_MIN_VISIBLE_MS - elapsed);
-    window.setTimeout(() => {
-      setRipples(prev => prev.filter(ripple => ripple.pointerId !== pointerId));
-      startedAtByPointer.current.delete(pointerId);
+    const timeoutId = window.setTimeout(() => {
+      pendingTimeouts.current.delete(timeoutId);
+      setRipples(prev => prev.filter(ripple => ripple.key !== key));
+      startedAtByKey.current.delete(key);
     }, delay);
+    pendingTimeouts.current.add(timeoutId);
   }, []);
   const clearAll = useCallback(() => {
-    startedAtByPointer.current.clear();
+    pendingTimeouts.current.forEach(timeoutId => window.clearTimeout(timeoutId));
+    pendingTimeouts.current.clear();
+    startedAtByKey.current.clear();
+    activeKeyByPointer.current.clear();
     setRipples([]);
   }, []);
   return {

package/components/v2/ButtonGroup/ButtonGroup.d.ts

@@ -8,7 +8,7 @@ declare const useStyles: (params: Omit<ButtonGroupOwnProps, "children">, muiStyl
     props: Record<string, unknown>;
     ownerState?: Record<string, unknown> | undefined;
 } | undefined) => {
-    classes: Record<"root" | "disabled" | "contained" | "disableElevation" | "fullWidth" | "vertical" | "grouped" | "groupedHorizontal" | "groupedVertical" | "groupedContained" | "groupedContainedHorizontal" | "groupedContainedVertical" | "groupedOutlined" | "groupedOutlinedHorizontal" | "groupedOutlinedVertical" | "groupedText" | "groupedTextHorizontal" | "groupedTextVertical", string>;
+    classes: Record<"root" | "disabled" | "vertical" | "enableElevation" | "fullWidth" | "grouped" | "groupedHorizontal" | "groupedVertical" | "groupedContained" | "groupedContainedHorizontal" | "groupedContainedVertical" | "groupedOutlined" | "groupedOutlinedHorizontal" | "groupedOutlinedVertical" | "groupedText" | "groupedTextHorizontal" | "groupedTextVertical", string>;
     theme: import("@shopgate/engage/styles").Theme;
     css: import("tss-react").Css;
     cx: import("tss-react").Cx;
@@ -24,21 +24,27 @@ export interface ButtonGroupOwnProps {
      * @default 'medium'
      */
     size?: 'small' | 'medium' | 'large';
+    /**
+     * If true, the buttons use reduced padding.
+     * @default false
+     */
+    dense?: boolean;
     /**
      * The orientation of the buttons in the group.
      * @default 'horizontal'
      */
     orientation?: 'horizontal' | 'vertical';
     /**
-     * If true, no elevation is used for contained buttons.
+     * If true, a drop shadow is added to the group. Button groups are flat by default.
      * @default false
      */
-    disableElevation?: boolean;
+    enableElevation?: boolean;
     /**
-     * The color of the component.
+     * The color of the component. Besides the palette colors, `cta` is supported. It resolves to the
+     * merchant configurable call to action color from `components.ctaButton`.
      * @default 'inherit'
      */
-    color?: PaletteColorsWithMain | 'inherit';
+    color?: PaletteColorsWithMain | 'inherit' | 'cta';
     /**
      * If true, the buttons will take up the full width of their container.
      * @default false

package/components/v2/ButtonGroup/ButtonGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonGroup.d.ts","sourceRoot":"","sources":["../../../../components/v2/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAErE;;GAEG;AACH,QAAA,MAAM,WAAW,mIA4Df,CAAC;AAEH,QAAA,MAAM,SAAS;;cAoDM,CAAA;;;;;;CAmFnB,CAAC;AAEH,MAAM,WAAW,mBAAmB;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,MAAM,CAAC;IAC5C;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,qBAAqB,GAAG,SAAS,CAAC;IAC1C;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IAC3D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,MAAM,gBAAgB,GAAG,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAEzF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ButtonGroup.d.ts","sourceRoot":"","sources":["../../../../components/v2/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAErE;;GAEG;AACH,QAAA,MAAM,WAAW,mIAsEf,CAAC;AAQH,QAAA,MAAM,SAAS;;cAyB8B,CAAC;;;;;;CAqH5C,CAAC;AAEH,MAAM,WAAW,mBAAmB;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,MAAM,CAAC;IAC5C;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;OAIG;IACH,KAAK,CAAC,EAAE,qBAAqB,GAAG,SAAS,GAAG,KAAK,CAAC;IAClD;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IAC3D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,MAAM,gBAAgB,GAAG,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAIzF,eAAe,WAAW,CAAC"}