@sproutsocial/seeds-react-modal 1.0.5 → 1.1.0

package/dist/index.js

@@ -321,6 +321,11 @@ var StyledOverlay = (0, import_styled_components2.default)(Dialog.Overlay)`
     ${(props) => props.theme.easing.ease_inout};
   z-index: ${(props) => props.zIndex ? props.zIndex + DEFAULT_OVERLAY_Z_INDEX_OFFSET : 999};
 
+  /* Allow clicking through overlay when modal is draggable */
+  ${(props) => props.allowInteraction && `
+    pointer-events: none;
+  `}
+
   ${import_styled_system2.zIndex}
 
   &[data-state="open"] {
@@ -348,15 +353,19 @@ var StyledContent = (0, import_styled_components2.default)(Dialog.Content)`
   filter: blur(0);
   color: ${(props) => props.theme.colors.text.body};
   outline: none;
-  max-width: calc(100vw - ${BODY_PADDING2});
+  max-width: ${(props) => {
+  const railSize = props.railSize ?? 44;
+  const railOffset = props.railOffset ?? 12;
+  const railExtraSpace = railSize + railOffset;
+  return `calc(100vw - ${BODY_PADDING2} - ${railExtraSpace}px)`;
+}};
   max-height: calc(100vh - ${BODY_PADDING2});
   z-index: ${(props) => props.zIndex || 1e3};
 
-  /* Draggable styling */
-  ${(props) => props.draggable && `
-    cursor: ${props.isDragging ? "grabbing" : "grab"};
-    user-select: none;
-  `}
+  /* When viewport is <= 400px, rail is above modal, so restore full width */
+  @media (max-width: 400px) {
+    max-width: calc(100vw - ${BODY_PADDING2});
+  }
 
   @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
     height: calc(100vh - ${BODY_PADDING2});
@@ -403,6 +412,12 @@ var Header2 = (0, import_styled_components2.default)(import_seeds_react_box3.def
   align-items: center;
   justify-content: space-between;
   flex: 0 0 auto;
+
+  /* Draggable cursor styling */
+  ${(props) => props.draggable && `
+    cursor: ${props.isDragging ? "grabbing" : "grab"};
+    user-select: none;
+  `}
 `;
 var Footer2 = (0, import_styled_components2.default)(import_seeds_react_box3.default)`
   flex: 0 0 auto;
@@ -517,19 +532,29 @@ var ModalHeader2 = (props) => {
     title,
     subtitle,
     children,
-    bordered,
     titleProps = {},
     subtitleProps = {},
     showInlineClose,
     ...rest
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Header2, { ...rest, children: children ? children : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(React5.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_seeds_react_box4.default, { children: [
-      title && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Dialog3.Title, { asChild: true, ...titleProps, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_seeds_react_text2.default.Headline, { children: title }) }),
-      subtitle && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Dialog3.Description, { asChild: true, ...subtitleProps, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_seeds_react_text2.default, { as: "div", fontSize: 200, children: subtitle }) })
-    ] }),
-    showInlineClose && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_seeds_react_box4.default, { display: "flex", alignItems: "center", justifyContent: "flex-end", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ModalCloseButton2, { position: "relative", offset: 0 }) })
-  ] }) });
+  const dragContext = useDragContext();
+  const isDraggable = dragContext?.draggable ?? false;
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    Header2,
+    {
+      ...rest,
+      onMouseDown: isDraggable ? dragContext?.onHeaderMouseDown : void 0,
+      draggable: isDraggable,
+      isDragging: dragContext?.isDragging,
+      children: children ? children : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(React5.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_seeds_react_box4.default, { children: [
+          title && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Dialog3.Title, { asChild: true, ...titleProps, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_seeds_react_text2.default.Headline, { children: title }) }),
+          subtitle && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Dialog3.Description, { asChild: true, ...subtitleProps, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_seeds_react_text2.default, { as: "div", fontSize: 200, children: subtitle }) })
+        ] }),
+        showInlineClose && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_seeds_react_box4.default, { display: "flex", alignItems: "center", justifyContent: "flex-end", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ModalCloseButton2, { position: "relative", offset: 0 }) })
+      ] })
+    }
+  );
 };
 ModalHeader2.displayName = "ModalHeader";
 
@@ -612,13 +637,19 @@ var Rail = import_styled_components4.default.div`
   position: absolute;
   top: ${(p) => p.offset}px;
   ${(p) => p.side === "right" ? `right: calc(-1 * (${p.size}px + ${p.offset}px));` : `left: calc(-1 * (${p.size}px + ${p.offset}px));`}
-  display: grid;
-  grid-auto-flow: row;
+  display: flex;
+  flex-direction: column;
   gap: ${(p) => p.gap}px;
   z-index: 1;
 
-  @media (max-width: ${(p) => p.collapseAt}px) {
-    ${(p) => p.side === "right" ? `right: ${p.offset}px;` : `left: ${p.offset}px;`}
+  @media (max-width: 400px) {
+    /* Move rail above the modal on the right side */
+    top: auto;
+    bottom: calc(100% + ${(p) => p.offset}px);
+    right: ${(p) => p.offset}px;
+    left: auto;
+    /* Change to horizontal layout with reversed order */
+    flex-direction: row-reverse;
   }
 `;
 var RailBtn = import_styled_components4.default.button`
@@ -657,7 +688,6 @@ var ModalRail = ({
   offset = 12,
   gap = 12,
   size = 44,
-  collapseAt = 640,
   children
 }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
@@ -668,7 +698,6 @@ var ModalRail = ({
       offset,
       gap,
       size,
-      collapseAt,
       "aria-label": "Modal quick actions",
       children: React11.Children.map(
         children,
@@ -702,6 +731,11 @@ var ModalAction = ({
 
 // src/v2/ModalV2.tsx
 var import_jsx_runtime11 = require("react/jsx-runtime");
+var DragContext = React12.createContext(null);
+var useDragContext = () => {
+  const context = React12.useContext(DragContext);
+  return context;
+};
 var DraggableModalContent = ({
   children,
   computedWidth,
@@ -710,12 +744,17 @@ var DraggableModalContent = ({
   label,
   dataAttributes,
   draggable,
-  rest
+  rest,
+  railProps
 }) => {
   const [position, setPosition] = React12.useState({ x: 0, y: 0 });
   const [isDragging, setIsDragging] = React12.useState(false);
   const contentRef = React12.useRef(null);
-  const handleMouseDown = React12.useCallback(
+  const railSize = railProps?.size ?? 44;
+  const railOffset = railProps?.offset ?? 12;
+  const railSide = railProps?.side ?? "right";
+  const railExtraSpace = railSize + railOffset;
+  const handleHeaderMouseDown = React12.useCallback(
     (e) => {
       if (!draggable) return;
       const target = e.target;
@@ -732,12 +771,22 @@ var DraggableModalContent = ({
         e2.preventDefault();
         const newX = e2.clientX - offsetX;
         const newY = e2.clientY - offsetY;
+        const isRailOnSide = window.innerWidth > 400;
         const modalWidth = rect.width;
         const modalHeight = rect.height;
-        const maxX = window.innerWidth - modalWidth;
-        const minX = 0;
-        const maxY = window.innerHeight - modalHeight;
-        const minY = 0;
+        let maxX = window.innerWidth - modalWidth;
+        let minX = 0;
+        let maxY = window.innerHeight - modalHeight;
+        let minY = 0;
+        if (isRailOnSide) {
+          if (railSide === "right") {
+            maxX = window.innerWidth - modalWidth - railExtraSpace;
+          } else {
+            minX = railExtraSpace;
+          }
+        } else {
+          minY = railSize + railOffset;
+        }
         const constrainedX = Math.max(minX, Math.min(maxX, newX));
         const constrainedY = Math.max(minY, Math.min(maxY, newY));
         const centerX = window.innerWidth / 2 - modalWidth / 2;
@@ -755,9 +804,27 @@ var DraggableModalContent = ({
       document.addEventListener("mousemove", handleMouseMove);
       document.addEventListener("mouseup", handleMouseUp);
     },
+    [draggable, railSide, railExtraSpace]
+  );
+  const dragContextValue = React12.useMemo(
+    () => ({
+      position,
+      isDragging,
+      onHeaderMouseDown: handleHeaderMouseDown,
+      contentRef,
+      draggable: draggable ?? false
+    }),
+    [position, isDragging, handleHeaderMouseDown, draggable]
+  );
+  const handleInteractOutside = React12.useCallback(
+    (e) => {
+      if (draggable) {
+        e.preventDefault();
+      }
+    },
     [draggable]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DragContext.Provider, { value: draggable ? dragContextValue : null, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     StyledContent,
     {
       ref: contentRef,
@@ -767,7 +834,10 @@ var DraggableModalContent = ({
       "aria-label": label,
       draggable,
       isDragging,
-      onMouseDown: handleMouseDown,
+      railSize,
+      railOffset,
+      railSide,
+      onInteractOutside: handleInteractOutside,
       style: draggable ? {
         transform: `translate(calc(-50% + ${position.x}px), calc(-50% + ${position.y}px))`,
         transition: isDragging ? "none" : void 0
@@ -776,7 +846,7 @@ var DraggableModalContent = ({
       ...rest,
       children
     }
-  );
+  ) });
 };
 var Modal2 = (props) => {
   const {
@@ -844,8 +914,11 @@ var Modal2 = (props) => {
     if (onOpenChange) {
       props2.onOpenChange = handleOpenChange;
     }
+    if (draggable) {
+      props2.modal = false;
+    }
     return props2;
-  }, [open, defaultOpen, handleOpenChange, onOpenChange]);
+  }, [open, defaultOpen, handleOpenChange, onOpenChange, draggable]);
   const triggers = [];
   const content = [];
   if (modalTrigger) {
@@ -865,7 +938,7 @@ var Modal2 = (props) => {
   return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(Dialog8.Root, { ...dialogRootProps, children: [
     triggers,
     /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(Dialog8.Portal, { children: [
-      showOverlay && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(StyledOverlay, { zIndex: computedZIndex }),
+      showOverlay && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(StyledOverlay, { zIndex: computedZIndex, allowInteraction: draggable }),
       /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
         DraggableModalContent,
         {
@@ -876,6 +949,7 @@ var Modal2 = (props) => {
           dataAttributes,
           draggable,
           rest,
+          railProps,
           children: [
             /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(ModalRail, { ...railProps, children: [
               /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/v1/Modal.tsx","../src/v1/styles.tsx","../src/v1/index.ts","../src/v2/ModalV2.tsx","../src/v2/ModalV2Styles.tsx","../src/shared/constants.ts","../src/v2/components/ModalHeader.tsx","../src/v2/components/ModalCloseButton.tsx","../src/v2/components/ModalFooter.tsx","../src/v2/components/ModalContent.tsx","../src/v2/components/ModalDescription.tsx","../src/v2/components/ModalTrigger.tsx","../src/v2/components/ModalClose.tsx","../src/v2/components/ModalRail.tsx"],"sourcesContent":["// Main export - V1 Modal for backwards compatibility\nimport Modal from \"./v1\";\nexport default Modal;\nexport { Modal };\n\n// Explicit type exports from V1 for tree shaking\nexport type {\n  TypeModalProps,\n  TypeModalHeaderProps,\n  TypeModalFooterProps,\n  TypeModalContentProps,\n  TypeModalCloseButtonProps,\n} from \"./v1\";\n\n// V2 Modal exports\nexport {\n  Modal as ModalV2,\n  ModalTrigger,\n  ModalDescription,\n  ModalHeader,\n  ModalFooter,\n  ModalContent,\n  ModalCloseButton,\n  ModalClose,\n  ModalRail,\n  ModalAction,\n} from \"./v2\";\nexport type {\n  TypeModalV2Props,\n  TypeModalV2TriggerProps,\n  TypeModalV2CloseButtonProps,\n  TypeModalV2HeaderProps,\n  TypeModalV2FooterProps,\n  TypeModalV2ContentProps,\n  TypeModalV2DescriptionProps,\n  TypeModalRailProps,\n  TypeModalActionProps,\n} from \"./v2\";\n","import * as React from \"react\";\nimport { useContext } from \"react\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport { Container, Content, Header, Footer, Body } from \"./styles\";\nimport type {\n  TypeModalProps,\n  TypeModalCloseButtonProps,\n  TypeModalContentProps,\n  TypeModalFooterProps,\n  TypeModalHeaderProps,\n} from \"./ModalTypes\";\n\ntype TypeModalContext = Partial<{\n  onClose: () => void;\n  closeButtonLabel: string;\n  label: string;\n}>;\n\nconst ModalContext = React.createContext<TypeModalContext>({});\n\nconst ModalHeader = (props: TypeModalHeaderProps) => {\n  const { title, subtitle, children, bordered, ...rest } = props;\n  return (\n    <Header bordered={title || subtitle || bordered} {...rest}>\n      {children ? (\n        children\n      ) : (\n        <React.Fragment>\n          <Box>\n            {title && (\n              <Text as=\"h1\" fontSize={400} fontWeight=\"semibold\">\n                {title}\n              </Text>\n            )}\n            {subtitle && (\n              <Text as=\"div\" fontSize={200}>\n                {subtitle}\n              </Text>\n            )}\n          </Box>\n          <Box display=\"flex\" alignItems=\"center\" justify-content=\"flex-end\">\n            <ModalCloseButton ml={400} />\n          </Box>\n        </React.Fragment>\n      )}\n    </Header>\n  );\n};\n\nconst ModalCloseButton = (props: TypeModalCloseButtonProps) => {\n  const { onClose, closeButtonLabel } = useContext(ModalContext);\n  if (!onClose) return null;\n  return (\n    <Button onClick={onClose} {...props}>\n      <Icon name=\"x-outline\" ariaLabel={closeButtonLabel} />\n    </Button>\n  );\n};\n\nconst ModalFooter = ({\n  bg = \"container.background.base\",\n  ...rest\n}: TypeModalFooterProps) => (\n  <Footer\n    bg={bg}\n    borderTop={500}\n    borderColor=\"container.border.base\"\n    {...rest}\n  />\n);\n\nconst ModalContent = React.forwardRef(\n  ({ children, ...rest }: TypeModalContentProps, ref) => {\n    const { label } = useContext(ModalContext);\n    return (\n      <Content data-qa-modal data-qa-label={label} ref={ref} {...rest}>\n        {children}\n      </Content>\n    );\n  }\n);\n\n/**\n * The modal you want\n */\nconst Modal = (props: TypeModalProps) => {\n  const {\n    appElementSelector,\n    children,\n    isOpen,\n    label,\n    onClose,\n    closeButtonLabel,\n    width = \"800px\",\n    zIndex = 6,\n    data = {},\n    ...rest\n  } = props;\n\n  const isCloseable = Boolean(onClose);\n  const appElement =\n    appElementSelector && document\n      ? (document.querySelector(appElementSelector) as HTMLElement)\n      : undefined;\n\n  return (\n    <Container\n      appElement={appElement}\n      ariaHideApp={!!appElement}\n      isOpen={isOpen}\n      contentLabel={label}\n      // eslint-disable-next-line @typescript-eslint/no-empty-function\n      onRequestClose={onClose || (() => {})}\n      shouldFocusAfterRender={true}\n      shouldCloseOnOverlayClick={isCloseable}\n      shouldCloseOnEsc={isCloseable}\n      shouldReturnFocusAfterClose={true}\n      closeTimeoutMS={200}\n      role=\"dialog\"\n      width={width}\n      zIndex={zIndex}\n      data={{\n        \"qa-modal\": \"\",\n        \"qa-modal-isopen\": isOpen,\n        ...data,\n      }}\n      {...rest}\n    >\n      <React.Fragment>\n        <Body />\n\n        <ModalContext.Provider\n          value={{\n            onClose,\n            closeButtonLabel,\n            label,\n          }}\n        >\n          {children}\n        </ModalContext.Provider>\n      </React.Fragment>\n    </Container>\n  );\n};\n\nModalHeader.displayName = \"Modal.Header\";\nModalFooter.displayName = \"Modal.Footer\";\nModalContent.displayName = \"Modal.Content\";\nModalCloseButton.displayName = \"Modal.CloseButton\";\n\nModal.Header = ModalHeader;\nModal.Footer = ModalFooter;\nModal.Content = ModalContent;\nModal.CloseButton = ModalCloseButton;\n\nexport default Modal;\n","import React from \"react\";\nimport styled, { createGlobalStyle } from \"styled-components\";\nimport { width, zIndex } from \"styled-system\";\nimport ReactModal from \"react-modal\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport Box, { type TypeContainerProps } from \"@sproutsocial/seeds-react-box\";\n\n// This is the max space allowed between the modal and the edge of the browser\nconst BODY_PADDING = \"64px\";\n\nconst ReactModalAdapter = ({\n  className = \"\",\n  ...props\n}: { className?: string } & Omit<\n  ReactModal.Props,\n  \"portalClassName\" | \"className\" | \"overlayClassName\"\n>) => {\n  // We want to create *__Content and *__Overlay class names on the subcomponents.\n  // Because `className` could be a space-separated list of class names, we make\n  // sure that we append `__Content` and `__Overlay` to every class name.\n  const contentClassName = className\n    .split(\" \")\n    .map((className) => `${className} ${className}__Content`)\n    .join(\" \");\n\n  const overlayClassName = className\n    .split(\" \")\n    .map((className) => `${className} ${className}__Overlay`)\n    .join(\" \");\n\n  return (\n    <ReactModal\n      portalClassName={className}\n      className={contentClassName}\n      overlayClassName={overlayClassName}\n      {...props}\n    />\n  );\n};\n\nexport const Body = createGlobalStyle`\n  .ReactModal__Body--open {\n    overflow: hidden;\n  }\n`;\n\nexport const Container = styled(ReactModalAdapter)<TypeContainerProps>`\n  &__Overlay {\n    position: fixed;\n    top: 0px;\n    left: 0px;\n    right: 0px;\n    bottom: 0px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: ${(props) => props.theme.colors.overlay.background.base};\n    opacity: 0;\n    will-change: opacity;\n    transition: opacity ${(props) => props.theme.duration.medium}\n      ${(props) => props.theme.easing.ease_inout};\n\n    ${zIndex}\n\n    &.ReactModal__Overlay--after-open {\n      opacity: 1;\n    }\n    &.ReactModal__Overlay--before-close {\n      opacity: 0;\n    }\n  }\n\n  &__Content {\n    display: flex;\n    flex-direction: column;\n    background: ${(props) => props.theme.colors.container.background.base};\n    border-radius: ${(props) => props.theme.radii[600]};\n    box-shadow: ${(props) => props.theme.shadows.medium};\n    filter: blur(0);\n    color: ${(props) => props.theme.colors.text.body};\n\n    outline: none;\n    max-width: calc(100vw - ${BODY_PADDING});\n    max-height: calc(100vh - ${BODY_PADDING});\n    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n      /**\n       * This prevents the modal from being very short in IE11. Better too big\n       * than too small.\n       */\n      height: calc(100vh - ${BODY_PADDING});\n    }\n\n    ${width}\n\n    ${COMMON}\n  }\n`;\n\nexport const Content = styled(Box)`\n  font-family: ${(props) => props.theme.fontFamily};\n  min-height: 80px;\n  overflow-y: auto;\n  flex: 1 1 auto;\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[450]};\n  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n    /* 'flex-basis: auto' breaks overflow in IE11 */\n    flex-basis: 100%;\n  }\n`;\n\nexport const HeaderContainer = styled(Box)`\n  font-family: ${(props) => props.theme.fontFamily};\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[450]};\n`;\n\nexport const Header = styled(HeaderContainer)<{ bordered?: boolean }>`\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex: 0 0 auto;\n  border-bottom-width: ${(props) => props.theme.borderWidths[500]};\n  border-bottom-color: ${(props) =>\n    props.bordered ? props.theme.colors.container.border.base : \"transparent\"};\n  border-bottom-style: solid;\n`;\n\nexport const Footer = styled(Box)`\n  flex: 0 0 auto;\n  font-family: ${(props) => props.theme.fontFamily};\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[450]};\n  border-bottom-right-radius: ${(props) => props.theme.radii[500]};\n  border-bottom-left-radius: ${(props) => props.theme.radii[500]};\n`;\n\nContainer.displayName = \"ModalContainer\";\nContent.displayName = \"Content\";\nHeader.displayName = \"Modal.Header\";\nFooter.displayName = \"Modal.Footer\";\n","// V1 Modal - Explicit exports for optimal tree shaking\nimport Modal from \"./Modal\";\n\nexport default Modal;\nexport { Modal };\n\n// Explicit type exports\nexport type {\n  TypeModalProps,\n  TypeModalHeaderProps,\n  TypeModalFooterProps,\n  TypeModalContentProps,\n  TypeModalCloseButtonProps,\n} from \"./ModalTypes\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport { StyledOverlay, StyledContent } from \"./ModalV2Styles\";\nimport {\n  ModalHeader,\n  ModalDescription,\n  ModalTrigger,\n  ModalRail,\n  ModalAction,\n} from \"./components\";\nimport {\n  DEFAULT_MODAL_WIDTH,\n  DEFAULT_MODAL_BG,\n  DEFAULT_MODAL_Z_INDEX,\n  MODAL_SIZE_PRESETS,\n  MODAL_PRIORITY_Z_INDEX,\n} from \"../shared/constants\";\nimport type { TypeModalV2Props } from \"./ModalV2Types\";\n\ninterface DraggableModalContentProps {\n  children: React.ReactNode;\n  computedWidth: any;\n  bg: any;\n  computedZIndex: number;\n  label?: string;\n  dataAttributes: Record<string, string>;\n  draggable?: boolean;\n  rest: any;\n}\n\nconst DraggableModalContent: React.FC<DraggableModalContentProps> = ({\n  children,\n  computedWidth,\n  bg,\n  computedZIndex,\n  label,\n  dataAttributes,\n  draggable,\n  rest,\n}) => {\n  const [position, setPosition] = React.useState({ x: 0, y: 0 });\n  const [isDragging, setIsDragging] = React.useState(false);\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const handleMouseDown = React.useCallback(\n    (e: React.MouseEvent) => {\n      if (!draggable) return;\n\n      // Only allow dragging from certain areas (not interactive elements)\n      const target = e.target as HTMLElement;\n      if (\n        target.tagName === \"BUTTON\" ||\n        target.tagName === \"INPUT\" ||\n        target.closest(\"button\")\n      ) {\n        return;\n      }\n\n      e.preventDefault();\n      setIsDragging(true);\n\n      const rect = contentRef.current?.getBoundingClientRect();\n      if (!rect) return;\n\n      // Calculate offset from mouse to current modal position\n      const offsetX = e.clientX - rect.left;\n      const offsetY = e.clientY - rect.top;\n\n      const handleMouseMove = (e: MouseEvent) => {\n        e.preventDefault();\n\n        // Calculate new position based on mouse position minus offset\n        const newX = e.clientX - offsetX;\n        const newY = e.clientY - offsetY;\n\n        // Constrain to viewport bounds (keeping modal fully visible)\n        const modalWidth = rect.width;\n        const modalHeight = rect.height;\n        const maxX = window.innerWidth - modalWidth;\n        const minX = 0;\n        const maxY = window.innerHeight - modalHeight;\n        const minY = 0;\n\n        const constrainedX = Math.max(minX, Math.min(maxX, newX));\n        const constrainedY = Math.max(minY, Math.min(maxY, newY));\n\n        // Convert to offset from center for our transform\n        const centerX = window.innerWidth / 2 - modalWidth / 2;\n        const centerY = window.innerHeight / 2 - modalHeight / 2;\n\n        setPosition({\n          x: constrainedX - centerX,\n          y: constrainedY - centerY,\n        });\n      };\n\n      const handleMouseUp = () => {\n        setIsDragging(false);\n        document.removeEventListener(\"mousemove\", handleMouseMove);\n        document.removeEventListener(\"mouseup\", handleMouseUp);\n      };\n\n      document.addEventListener(\"mousemove\", handleMouseMove);\n      document.addEventListener(\"mouseup\", handleMouseUp);\n    },\n    [draggable]\n  );\n\n  return (\n    <StyledContent\n      ref={contentRef}\n      width={computedWidth}\n      bg={bg}\n      zIndex={computedZIndex}\n      aria-label={label}\n      draggable={draggable}\n      isDragging={isDragging}\n      onMouseDown={handleMouseDown}\n      style={\n        draggable\n          ? {\n              transform: `translate(calc(-50% + ${position.x}px), calc(-50% + ${position.y}px))`,\n              transition: isDragging ? \"none\" : undefined,\n            }\n          : undefined\n      }\n      {...dataAttributes}\n      {...rest}\n    >\n      {children}\n    </StyledContent>\n  );\n};\n\n/**\n * The modal you want - with Radix UI Dialog\n *\n * Features:\n * - Built with Radix UI Dialog for superior accessibility\n * - Same API as the original Modal component\n * - Automatic focus management and keyboard navigation\n * - Portal rendering for proper z-index layering\n * - Customizable styling through system props\n * - Optional draggable functionality using react-dnd\n */\nconst Modal = (props: TypeModalV2Props) => {\n  const {\n    children,\n    modalTrigger,\n    draggable = false,\n    open,\n    defaultOpen,\n    onOpenChange,\n    \"aria-label\": label,\n    title,\n    subtitle,\n    description,\n    size,\n    priority,\n    data = {},\n    bg = DEFAULT_MODAL_BG,\n    showOverlay = true,\n    actions,\n    railProps,\n    ...rest\n  } = props;\n\n  const handleOpenChange = React.useCallback(\n    (newOpen: boolean) => {\n      onOpenChange?.(newOpen);\n    },\n    [onOpenChange]\n  );\n\n  // Compute actual width\n  const computedWidth = React.useMemo(() => {\n    if (size) {\n      // Handle preset sizes\n      if (typeof size === \"string\" && size in MODAL_SIZE_PRESETS) {\n        return MODAL_SIZE_PRESETS[size as keyof typeof MODAL_SIZE_PRESETS];\n      }\n      // Handle custom size values\n      return size;\n    }\n    // Fall back to default width\n    return DEFAULT_MODAL_WIDTH;\n  }, [size]);\n\n  // Compute actual z-index\n  const computedZIndex = React.useMemo(() => {\n    if (priority) {\n      return MODAL_PRIORITY_Z_INDEX[priority];\n    }\n    return DEFAULT_MODAL_Z_INDEX;\n  }, [priority]);\n\n  // Create data attributes object\n  const dataAttributes = React.useMemo(() => {\n    const attrs: Record<string, string> = {};\n    Object.entries(data).forEach(([key, value]) => {\n      attrs[`data-${key}`] = String(value);\n    });\n    attrs[\"data-qa-modal\"] = \"\";\n    // Only add open attribute if in controlled mode\n    if (open !== undefined) {\n      attrs[\"data-qa-modal-open\"] = String(open);\n    }\n    return attrs;\n  }, [data, open]);\n\n  // Determine if we should auto-render the header from provided props\n  const shouldRenderHeader = Boolean(title || subtitle);\n\n  // Build Dialog.Root props conditionally\n  const dialogRootProps = React.useMemo(() => {\n    const props: any = {};\n\n    // If controlled (open prop provided), use it\n    if (open !== undefined) {\n      props.open = open;\n    }\n    // If uncontrolled with explicit defaultOpen, use it\n    else if (defaultOpen !== undefined) {\n      props.defaultOpen = defaultOpen;\n    }\n    // If completely uncontrolled (neither open nor defaultOpen provided), default to closed\n    else {\n      props.defaultOpen = false;\n    }\n\n    // Always add onOpenChange if provided\n    if (onOpenChange) {\n      props.onOpenChange = handleOpenChange;\n    }\n\n    return props;\n  }, [open, defaultOpen, handleOpenChange, onOpenChange]);\n\n  // Handle trigger - use modalTrigger prop if provided, otherwise look for ModalTrigger children (backward compatibility)\n  const triggers: React.ReactNode[] = [];\n  const content: React.ReactNode[] = [];\n\n  if (modalTrigger) {\n    // New prop-based approach: wrap the provided element with Dialog.Trigger\n    triggers.push(\n      <Dialog.Trigger key=\"modal-trigger\" asChild>\n        {modalTrigger}\n      </Dialog.Trigger>\n    );\n    // All children are content\n    content.push(children);\n  } else {\n    // Legacy approach: separate ModalTrigger children from content children\n    React.Children.forEach(children, (child) => {\n      if (React.isValidElement(child) && child.type === ModalTrigger) {\n        triggers.push(child);\n      } else {\n        content.push(child);\n      }\n    });\n  }\n\n  return (\n    <Dialog.Root {...dialogRootProps}>\n      {/* Render triggers as direct children of Dialog.Root */}\n      {triggers}\n\n      <Dialog.Portal>\n        {showOverlay && <StyledOverlay zIndex={computedZIndex} />}\n        <DraggableModalContent\n          computedWidth={computedWidth}\n          bg={bg}\n          computedZIndex={computedZIndex}\n          label={label}\n          dataAttributes={dataAttributes}\n          draggable={draggable}\n          rest={rest}\n        >\n          {/* Floating actions rail - always show a close by default */}\n          <ModalRail {...railProps}>\n            <ModalAction\n              actionType=\"close\"\n              aria-label=\"Close\"\n              iconName=\"x-outline\"\n            />\n            {actions?.map((action, idx) => (\n              <ModalAction key={idx} {...action} />\n            ))}\n          </ModalRail>\n          {/* Auto-render header when title or subtitle is provided */}\n          {shouldRenderHeader && (\n            <ModalHeader title={title} subtitle={subtitle} />\n          )}\n\n          {/* Auto-render description when provided */}\n          {description && <ModalDescription>{description}</ModalDescription>}\n\n          {/* Main content (everything except triggers) */}\n          {content}\n        </DraggableModalContent>\n      </Dialog.Portal>\n    </Dialog.Root>\n  );\n};\n\nexport default Modal;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { width, zIndex } from \"styled-system\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport Box, { type TypeContainerProps } from \"@sproutsocial/seeds-react-box\";\nimport {\n  BODY_PADDING,\n  DEFAULT_OVERLAY_Z_INDEX_OFFSET,\n} from \"../shared/constants\";\n\ninterface StyledOverlayProps extends TypeContainerProps {\n  zIndex?: number;\n}\n\nexport const StyledOverlay = styled(Dialog.Overlay)<StyledOverlayProps>`\n  position: fixed;\n  top: 0px;\n  left: 0px;\n  right: 0px;\n  bottom: 0px;\n  background-color: ${(props) => props.theme.colors.overlay.background.base};\n  opacity: 0;\n  will-change: opacity;\n  transition: opacity ${(props) => props.theme.duration.medium}\n    ${(props) => props.theme.easing.ease_inout};\n  z-index: ${(props) =>\n    props.zIndex ? props.zIndex + DEFAULT_OVERLAY_Z_INDEX_OFFSET : 999};\n\n  ${zIndex}\n\n  &[data-state=\"open\"] {\n    opacity: 1;\n  }\n  &[data-state=\"closed\"] {\n    opacity: 0;\n  }\n`;\n\ninterface StyledContentProps extends TypeContainerProps {\n  zIndex?: number;\n  isDragging?: boolean;\n  draggable?: boolean;\n}\n\nexport const StyledContent = styled(Dialog.Content)<StyledContentProps>`\n  position: fixed;\n  ${(props) =>\n    props.draggable\n      ? `\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n      `\n      : `\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n      `}\n  display: flex;\n  flex-direction: column;\n  border-radius: ${(props) => props.theme.radii[600]};\n  box-shadow: ${(props) => props.theme.shadows.medium};\n  filter: blur(0);\n  color: ${(props) => props.theme.colors.text.body};\n  outline: none;\n  max-width: calc(100vw - ${BODY_PADDING});\n  max-height: calc(100vh - ${BODY_PADDING});\n  z-index: ${(props) => props.zIndex || 1000};\n\n  /* Draggable styling */\n  ${(props) =>\n    props.draggable &&\n    `\n    cursor: ${props.isDragging ? \"grabbing\" : \"grab\"};\n    user-select: none;\n  `}\n\n  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n    height: calc(100vh - ${BODY_PADDING});\n  }\n\n  ${width}\n  ${COMMON}\n\n  /* Enhanced Radix Dialog animations */\n  opacity: 0;\n  ${(props) =>\n    !props.draggable\n      ? `\n    transform: translate(-50%, -50%) scale(0.95);\n    transition: opacity ${props.theme.duration.medium} ${props.theme.easing.ease_inout},\n      transform ${props.theme.duration.medium} ${props.theme.easing.ease_inout};\n  `\n      : `\n    transition: opacity ${props.theme.duration.medium} ${props.theme.easing.ease_inout};\n  `}\n\n  &[data-state=\"open\"] {\n    opacity: 1;\n    ${(props) =>\n      !props.draggable ? `transform: translate(-50%, -50%) scale(1);` : ``}\n  }\n  &[data-state=\"closed\"] {\n    opacity: 0;\n    ${(props) =>\n      !props.draggable ? `transform: translate(-50%, -50%) scale(0.95);` : ``}\n  }\n`;\n\nexport const Content = styled(Box)`\n  font-family: ${(props) => props.theme.fontFamily};\n  min-height: 80px;\n  overflow-y: auto;\n  flex: 1 1 auto;\n  padding: 0 ${(props) => props.theme.space[300]}\n    ${(props) => props.theme.space[300]} ${(props) => props.theme.space[300]};\n  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n    flex-basis: 100%;\n  }\n`;\n\nexport const Header = styled(Box)`\n  font-family: ${(props) => props.theme.fontFamily};\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[300]};\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex: 0 0 auto;\n`;\n\nexport const Footer = styled(Box)`\n  flex: 0 0 auto;\n  font-family: ${(props) => props.theme.fontFamily};\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[300]};\n  border-bottom-right-radius: ${(props) => props.theme.radii[500]};\n  border-bottom-left-radius: ${(props) => props.theme.radii[500]};\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: ${(props) => props.theme.space[100]};\n`;\n\nStyledOverlay.displayName = \"ModalOverlay\";\nStyledContent.displayName = \"ModalContent\";\nContent.displayName = \"ModalContent\";\nHeader.displayName = \"ModalHeader\";\nFooter.displayName = \"ModalFooter\";\n","// Shared constants for both Modal versions\n\n// Default z-index values\nexport const DEFAULT_MODAL_Z_INDEX = 6;\nexport const DEFAULT_OVERLAY_Z_INDEX_OFFSET = -1;\n\n// Default styling values\nexport const DEFAULT_MODAL_WIDTH = \"600px\";\nexport const DEFAULT_MODAL_BG = \"container.background.base\";\nexport const DEFAULT_CLOSE_BUTTON_LABEL = \"Close dialog\";\n\n// Max space allowed between the modal and the edge of the browser\nexport const BODY_PADDING = \"64px\";\n\n// Size presets for simplified API\nexport const MODAL_SIZE_PRESETS = {\n  small: \"400px\",\n  medium: \"600px\",\n  large: \"800px\",\n  full: \"90vw\",\n} as const;\n\n// Priority level z-index mappings\nexport const MODAL_PRIORITY_Z_INDEX = {\n  low: 100,\n  medium: 1000,\n  high: 2000,\n} as const;\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport { Header } from \"../ModalV2Styles\";\nimport { ModalCloseButton } from \"./ModalCloseButton\";\nimport type { TypeModalV2HeaderProps } from \"../ModalV2Types\";\n\nexport const ModalHeader = (props: TypeModalV2HeaderProps) => {\n  const {\n    title,\n    subtitle,\n    children,\n    bordered,\n    titleProps = {},\n    subtitleProps = {},\n    showInlineClose,\n    ...rest\n  } = props;\n\n  return (\n    <Header {...rest}>\n      {children ? (\n        children\n      ) : (\n        <React.Fragment>\n          <Box>\n            {title && (\n              <Dialog.Title asChild {...titleProps}>\n                <Text.Headline>{title}</Text.Headline>\n              </Dialog.Title>\n            )}\n            {subtitle && (\n              <Dialog.Description asChild {...subtitleProps}>\n                <Text as=\"div\" fontSize={200}>\n                  {subtitle}\n                </Text>\n              </Dialog.Description>\n            )}\n          </Box>\n          {showInlineClose && (\n            <Box display=\"flex\" alignItems=\"center\" justifyContent=\"flex-end\">\n              <ModalCloseButton position=\"relative\" offset={0} />\n            </Box>\n          )}\n        </React.Fragment>\n      )}\n    </Header>\n  );\n};\n\nModalHeader.displayName = \"ModalHeader\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport styled from \"styled-components\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeModalV2CloseButtonProps } from \"../ModalV2Types\";\n\nconst CloseButtonWrapper = styled.button<{\n  size?: number;\n  position?: \"absolute\" | \"relative\";\n  side?: \"right\" | \"left\";\n  offset?: number;\n}>`\n  width: ${(p) => p.size || 44}px;\n  height: ${(p) => p.size || 44}px;\n  display: inline-grid;\n  place-items: center;\n  border-radius: 8px;\n  border: none;\n  background: rgba(22, 32, 32, 0.56);\n  color: #ffffff;\n  cursor: pointer;\n  outline: none;\n  transition: all 0.2s ease;\n\n  ${(p) =>\n    p.position === \"absolute\" &&\n    `\n    position: absolute;\n    top: 0px;\n    ${p.side || \"right\"}: ${p.offset || -48}px;\n    z-index: 1;\n  `}\n\n  &:hover {\n    background: rgba(22, 32, 32, 0.7);\n    transform: translateY(-1px);\n  }\n\n  &:active {\n    transform: translateY(0);\n  }\n\n  &:focus-visible {\n    box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #205bc3;\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n`;\n\nexport const ModalCloseButton = (props: TypeModalV2CloseButtonProps) => {\n  const {\n    children,\n    onClick,\n    asChild,\n    closeButtonLabel = \"Close modal\",\n    size = 44,\n    position = \"absolute\",\n    side = \"right\",\n    offset = -48,\n    ...rest\n  } = props;\n\n  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n    onClick?.(e);\n    // Dialog.Close automatically handles closing\n  };\n\n  if (asChild) {\n    return (\n      <Dialog.Close asChild>\n        {React.cloneElement(children as React.ReactElement, {\n          onClick: handleClick,\n          ...rest,\n        })}\n      </Dialog.Close>\n    );\n  }\n\n  return (\n    <Dialog.Close asChild>\n      <CloseButtonWrapper\n        onClick={handleClick}\n        size={size}\n        position={position}\n        side={side}\n        offset={offset}\n        aria-label={closeButtonLabel}\n        title={closeButtonLabel}\n        {...rest}\n      >\n        {children || <Icon name=\"x-outline\" size=\"small\" />}\n      </CloseButtonWrapper>\n    </Dialog.Close>\n  );\n};\n\nModalCloseButton.displayName = \"ModalCloseButton\";\n","import * as React from \"react\";\nimport { Footer } from \"../ModalV2Styles\";\nimport { DEFAULT_MODAL_BG } from \"../../shared/constants\";\nimport type { TypeModalV2FooterProps } from \"../ModalV2Types\";\n\nexport const ModalFooter = (props: TypeModalV2FooterProps) => {\n  const { bg = DEFAULT_MODAL_BG, children, ...rest } = props;\n  return (\n    <Footer\n      bg={bg}\n      borderTop={500}\n      borderColor=\"container.border.base\"\n      {...rest}\n    >\n      {children}\n    </Footer>\n  );\n};\n\nModalFooter.displayName = \"ModalFooter\";\n","import * as React from \"react\";\nimport { Content } from \"../ModalV2Styles\";\nimport type { TypeModalV2ContentProps } from \"../ModalV2Types\";\n\nexport const ModalContent = React.forwardRef<\n  HTMLDivElement,\n  TypeModalV2ContentProps\n>(({ children, ...rest }, ref) => {\n  return (\n    <Content data-qa-modal ref={ref} {...rest}>\n      {children}\n    </Content>\n  );\n});\n\nModalContent.displayName = \"ModalContent\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport type { TypeModalV2DescriptionProps } from \"../ModalV2Types\";\n\nexport const ModalDescription = React.forwardRef<\n  HTMLDivElement,\n  TypeModalV2DescriptionProps\n>(({ children, descriptionProps = {}, ...rest }, ref) => {\n  return (\n    <Dialog.Description asChild {...descriptionProps}>\n      <Box ref={ref} {...rest}>\n        {children}\n      </Box>\n    </Dialog.Description>\n  );\n});\n\nModalDescription.displayName = \"ModalDescription\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport type { TypeModalV2TriggerProps } from \"../ModalV2Types\";\n\n/**\n * A trigger button that opens the modal when clicked.\n * Must be used inside a Modal component's Dialog.Root context.\n * Uses Seeds Button by default but supports asChild for custom elements.\n */\nexport const ModalTrigger = (props: TypeModalV2TriggerProps) => {\n  const { children, onClick, asChild, ...rest } = props;\n\n  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n    onClick?.(e);\n    // Dialog.Trigger automatically handles modal opening\n  };\n\n  if (asChild) {\n    return (\n      <Dialog.Trigger asChild>\n        {React.cloneElement(children as React.ReactElement, {\n          onClick: handleClick,\n          ...rest,\n        })}\n      </Dialog.Trigger>\n    );\n  }\n\n  return (\n    <Dialog.Trigger asChild>\n      <Button onClick={handleClick} {...rest}>\n        {children}\n      </Button>\n    </Dialog.Trigger>\n  );\n};\n\nModalTrigger.displayName = \"ModalTrigger\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\n\nexport interface ModalCloseProps {\n  children: React.ReactNode;\n  onClick?: (e: React.MouseEvent) => void;\n  asChild?: boolean;\n}\n\n/**\n * A component that closes the modal when clicked.\n * Uses asChild pattern like Radix primitives.\n */\nexport const ModalClose = (props: ModalCloseProps) => {\n  const { children, onClick, asChild = false, ...rest } = props;\n\n  const handleClick = (e: React.MouseEvent) => {\n    onClick?.(e);\n    // Dialog.Close automatically handles closing\n  };\n\n  return (\n    <Dialog.Close asChild={asChild} onClick={handleClick} {...rest}>\n      {children}\n    </Dialog.Close>\n  );\n};\n\nModalClose.displayName = \"ModalClose\";\n","// components/ModalRail.tsx\nimport * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport styled from \"styled-components\";\nimport Icon from \"@sproutsocial/seeds-react-icon\"; // adjust import if path differs\nimport type { TypeModalRailProps, TypeModalActionProps } from \"../ModalV2Types\";\n\n// --- styled wrappers ---\nconst Rail = styled.div<{\n  side: \"right\" | \"left\";\n  offset: number;\n  gap: number;\n  size: number;\n  collapseAt: number;\n}>`\n  position: absolute;\n  top: ${(p) => p.offset}px;\n  ${(p) =>\n    p.side === \"right\"\n      ? `right: calc(-1 * (${p.size}px + ${p.offset}px));`\n      : `left: calc(-1 * (${p.size}px + ${p.offset}px));`}\n  display: grid;\n  grid-auto-flow: row;\n  gap: ${(p) => p.gap}px;\n  z-index: 1;\n\n  @media (max-width: ${(p) => p.collapseAt}px) {\n    ${(p) =>\n      p.side === \"right\" ? `right: ${p.offset}px;` : `left: ${p.offset}px;`}\n  }\n`;\n\nconst RailBtn = styled.button<{ size: number }>`\n  width: ${(p) => p.size}px;\n  height: ${(p) => p.size}px;\n  display: inline-grid;\n  place-items: center;\n  border-radius: 8px;\n  border: none;\n  background: rgba(22, 32, 32, 0.56);\n  color: #ffffff;\n  cursor: pointer;\n  outline: none;\n  transition: all 0.2s ease;\n\n  &:hover {\n    background: rgba(22, 32, 32, 0.7);\n    transform: translateY(-1px);\n  }\n\n  &:active {\n    transform: translateY(0);\n  }\n\n  &:focus-visible {\n    box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #205bc3;\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n`;\n\n// --- components ---\nexport const ModalRail: React.FC<TypeModalRailProps> = ({\n  side = \"right\",\n  offset = 12,\n  gap = 12,\n  size = 44,\n  collapseAt = 640,\n  children,\n}) => {\n  return (\n    <Rail\n      data-slot=\"modal-rail\"\n      side={side}\n      offset={offset}\n      gap={gap}\n      size={size}\n      collapseAt={collapseAt}\n      aria-label=\"Modal quick actions\"\n    >\n      {React.Children.map(children, (child) =>\n        React.isValidElement(child)\n          ? React.cloneElement(child as any, { size })\n          : child\n      )}\n    </Rail>\n  );\n};\n\nexport const ModalAction: React.FC<\n  TypeModalActionProps & { size?: number }\n> = ({\n  \"aria-label\": ariaLabel,\n  iconName,\n  disabled,\n  size = 44,\n  actionType,\n  onClick,\n  ...rest\n}) => {\n  const Btn = (\n    <RailBtn\n      size={size}\n      aria-label={ariaLabel}\n      title={ariaLabel}\n      disabled={disabled}\n      {...rest}\n    >\n      {iconName ? <Icon name={iconName} size=\"small\" /> : ariaLabel}\n    </RailBtn>\n  );\n\n  return actionType === \"close\" ? (\n    <Dialog.Close asChild>{Btn}</Dialog.Close>\n  ) : (\n    React.cloneElement(Btn, { onClick })\n  );\n};\n"],"mappings":"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","names":["ModalCloseButton","ModalContent","ModalFooter","ModalHeader","React","import_react","import_seeds_react_box","className","ReactModal","styled","Box","import_jsx_runtime","Box","Text","Button","Icon","width","zIndex","React","Dialog","import_react","import_styled_components","import_styled_system","import_seeds_react_system_props","import_seeds_react_box","BODY_PADDING","styled","BODY_PADDING","Content","Box","Header","Footer","React","Dialog","import_seeds_react_box","import_seeds_react_text","React","Dialog","import_styled_components","import_seeds_react_icon","import_jsx_runtime","styled","ModalCloseButton","Icon","import_jsx_runtime","ModalHeader","Header","Box","Text","ModalCloseButton","React","import_jsx_runtime","ModalFooter","Footer","React","import_jsx_runtime","ModalContent","Content","React","Dialog","import_seeds_react_box","import_jsx_runtime","Box","React","Dialog","import_seeds_react_button","import_jsx_runtime","Button","React","Dialog","import_jsx_runtime","React","Dialog","import_styled_components","import_seeds_react_icon","import_jsx_runtime","styled","Icon","import_jsx_runtime","e","Modal","props","ModalHeader"]}
+{"version":3,"sources":["../src/index.ts","../src/v1/Modal.tsx","../src/v1/styles.tsx","../src/v1/index.ts","../src/v2/ModalV2.tsx","../src/v2/ModalV2Styles.tsx","../src/shared/constants.ts","../src/v2/components/ModalHeader.tsx","../src/v2/components/ModalCloseButton.tsx","../src/v2/components/ModalFooter.tsx","../src/v2/components/ModalContent.tsx","../src/v2/components/ModalDescription.tsx","../src/v2/components/ModalTrigger.tsx","../src/v2/components/ModalClose.tsx","../src/v2/components/ModalRail.tsx"],"sourcesContent":["// Main export - V1 Modal for backwards compatibility\nimport Modal from \"./v1\";\nexport default Modal;\nexport { Modal };\n\n// Explicit type exports from V1 for tree shaking\nexport type {\n  TypeModalProps,\n  TypeModalHeaderProps,\n  TypeModalFooterProps,\n  TypeModalContentProps,\n  TypeModalCloseButtonProps,\n} from \"./v1\";\n\n// V2 Modal exports\nexport {\n  Modal as ModalV2,\n  ModalTrigger,\n  ModalDescription,\n  ModalHeader,\n  ModalFooter,\n  ModalContent,\n  ModalCloseButton,\n  ModalClose,\n  ModalRail,\n  ModalAction,\n} from \"./v2\";\nexport type {\n  TypeModalV2Props,\n  TypeModalV2TriggerProps,\n  TypeModalV2CloseButtonProps,\n  TypeModalV2HeaderProps,\n  TypeModalV2FooterProps,\n  TypeModalV2ContentProps,\n  TypeModalV2DescriptionProps,\n  TypeModalRailProps,\n  TypeModalActionProps,\n} from \"./v2\";\n","import * as React from \"react\";\nimport { useContext } from \"react\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport { Container, Content, Header, Footer, Body } from \"./styles\";\nimport type {\n  TypeModalProps,\n  TypeModalCloseButtonProps,\n  TypeModalContentProps,\n  TypeModalFooterProps,\n  TypeModalHeaderProps,\n} from \"./ModalTypes\";\n\ntype TypeModalContext = Partial<{\n  onClose: () => void;\n  closeButtonLabel: string;\n  label: string;\n}>;\n\nconst ModalContext = React.createContext<TypeModalContext>({});\n\nconst ModalHeader = (props: TypeModalHeaderProps) => {\n  const { title, subtitle, children, bordered, ...rest } = props;\n  return (\n    <Header bordered={title || subtitle || bordered} {...rest}>\n      {children ? (\n        children\n      ) : (\n        <React.Fragment>\n          <Box>\n            {title && (\n              <Text as=\"h1\" fontSize={400} fontWeight=\"semibold\">\n                {title}\n              </Text>\n            )}\n            {subtitle && (\n              <Text as=\"div\" fontSize={200}>\n                {subtitle}\n              </Text>\n            )}\n          </Box>\n          <Box display=\"flex\" alignItems=\"center\" justify-content=\"flex-end\">\n            <ModalCloseButton ml={400} />\n          </Box>\n        </React.Fragment>\n      )}\n    </Header>\n  );\n};\n\nconst ModalCloseButton = (props: TypeModalCloseButtonProps) => {\n  const { onClose, closeButtonLabel } = useContext(ModalContext);\n  if (!onClose) return null;\n  return (\n    <Button onClick={onClose} {...props}>\n      <Icon name=\"x-outline\" ariaLabel={closeButtonLabel} />\n    </Button>\n  );\n};\n\nconst ModalFooter = ({\n  bg = \"container.background.base\",\n  ...rest\n}: TypeModalFooterProps) => (\n  <Footer\n    bg={bg}\n    borderTop={500}\n    borderColor=\"container.border.base\"\n    {...rest}\n  />\n);\n\nconst ModalContent = React.forwardRef(\n  ({ children, ...rest }: TypeModalContentProps, ref) => {\n    const { label } = useContext(ModalContext);\n    return (\n      <Content data-qa-modal data-qa-label={label} ref={ref} {...rest}>\n        {children}\n      </Content>\n    );\n  }\n);\n\n/**\n * The modal you want\n */\nconst Modal = (props: TypeModalProps) => {\n  const {\n    appElementSelector,\n    children,\n    isOpen,\n    label,\n    onClose,\n    closeButtonLabel,\n    width = \"800px\",\n    zIndex = 6,\n    data = {},\n    ...rest\n  } = props;\n\n  const isCloseable = Boolean(onClose);\n  const appElement =\n    appElementSelector && document\n      ? (document.querySelector(appElementSelector) as HTMLElement)\n      : undefined;\n\n  return (\n    <Container\n      appElement={appElement}\n      ariaHideApp={!!appElement}\n      isOpen={isOpen}\n      contentLabel={label}\n      // eslint-disable-next-line @typescript-eslint/no-empty-function\n      onRequestClose={onClose || (() => {})}\n      shouldFocusAfterRender={true}\n      shouldCloseOnOverlayClick={isCloseable}\n      shouldCloseOnEsc={isCloseable}\n      shouldReturnFocusAfterClose={true}\n      closeTimeoutMS={200}\n      role=\"dialog\"\n      width={width}\n      zIndex={zIndex}\n      data={{\n        \"qa-modal\": \"\",\n        \"qa-modal-isopen\": isOpen,\n        ...data,\n      }}\n      {...rest}\n    >\n      <React.Fragment>\n        <Body />\n\n        <ModalContext.Provider\n          value={{\n            onClose,\n            closeButtonLabel,\n            label,\n          }}\n        >\n          {children}\n        </ModalContext.Provider>\n      </React.Fragment>\n    </Container>\n  );\n};\n\nModalHeader.displayName = \"Modal.Header\";\nModalFooter.displayName = \"Modal.Footer\";\nModalContent.displayName = \"Modal.Content\";\nModalCloseButton.displayName = \"Modal.CloseButton\";\n\nModal.Header = ModalHeader;\nModal.Footer = ModalFooter;\nModal.Content = ModalContent;\nModal.CloseButton = ModalCloseButton;\n\nexport default Modal;\n","import React from \"react\";\nimport styled, { createGlobalStyle } from \"styled-components\";\nimport { width, zIndex } from \"styled-system\";\nimport ReactModal from \"react-modal\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport Box, { type TypeContainerProps } from \"@sproutsocial/seeds-react-box\";\n\n// This is the max space allowed between the modal and the edge of the browser\nconst BODY_PADDING = \"64px\";\n\nconst ReactModalAdapter = ({\n  className = \"\",\n  ...props\n}: { className?: string } & Omit<\n  ReactModal.Props,\n  \"portalClassName\" | \"className\" | \"overlayClassName\"\n>) => {\n  // We want to create *__Content and *__Overlay class names on the subcomponents.\n  // Because `className` could be a space-separated list of class names, we make\n  // sure that we append `__Content` and `__Overlay` to every class name.\n  const contentClassName = className\n    .split(\" \")\n    .map((className) => `${className} ${className}__Content`)\n    .join(\" \");\n\n  const overlayClassName = className\n    .split(\" \")\n    .map((className) => `${className} ${className}__Overlay`)\n    .join(\" \");\n\n  return (\n    <ReactModal\n      portalClassName={className}\n      className={contentClassName}\n      overlayClassName={overlayClassName}\n      {...props}\n    />\n  );\n};\n\nexport const Body = createGlobalStyle`\n  .ReactModal__Body--open {\n    overflow: hidden;\n  }\n`;\n\nexport const Container = styled(ReactModalAdapter)<TypeContainerProps>`\n  &__Overlay {\n    position: fixed;\n    top: 0px;\n    left: 0px;\n    right: 0px;\n    bottom: 0px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: ${(props) => props.theme.colors.overlay.background.base};\n    opacity: 0;\n    will-change: opacity;\n    transition: opacity ${(props) => props.theme.duration.medium}\n      ${(props) => props.theme.easing.ease_inout};\n\n    ${zIndex}\n\n    &.ReactModal__Overlay--after-open {\n      opacity: 1;\n    }\n    &.ReactModal__Overlay--before-close {\n      opacity: 0;\n    }\n  }\n\n  &__Content {\n    display: flex;\n    flex-direction: column;\n    background: ${(props) => props.theme.colors.container.background.base};\n    border-radius: ${(props) => props.theme.radii[600]};\n    box-shadow: ${(props) => props.theme.shadows.medium};\n    filter: blur(0);\n    color: ${(props) => props.theme.colors.text.body};\n\n    outline: none;\n    max-width: calc(100vw - ${BODY_PADDING});\n    max-height: calc(100vh - ${BODY_PADDING});\n    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n      /**\n       * This prevents the modal from being very short in IE11. Better too big\n       * than too small.\n       */\n      height: calc(100vh - ${BODY_PADDING});\n    }\n\n    ${width}\n\n    ${COMMON}\n  }\n`;\n\nexport const Content = styled(Box)`\n  font-family: ${(props) => props.theme.fontFamily};\n  min-height: 80px;\n  overflow-y: auto;\n  flex: 1 1 auto;\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[450]};\n  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n    /* 'flex-basis: auto' breaks overflow in IE11 */\n    flex-basis: 100%;\n  }\n`;\n\nexport const HeaderContainer = styled(Box)`\n  font-family: ${(props) => props.theme.fontFamily};\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[450]};\n`;\n\nexport const Header = styled(HeaderContainer)<{ bordered?: boolean }>`\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex: 0 0 auto;\n  border-bottom-width: ${(props) => props.theme.borderWidths[500]};\n  border-bottom-color: ${(props) =>\n    props.bordered ? props.theme.colors.container.border.base : \"transparent\"};\n  border-bottom-style: solid;\n`;\n\nexport const Footer = styled(Box)`\n  flex: 0 0 auto;\n  font-family: ${(props) => props.theme.fontFamily};\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[450]};\n  border-bottom-right-radius: ${(props) => props.theme.radii[500]};\n  border-bottom-left-radius: ${(props) => props.theme.radii[500]};\n`;\n\nContainer.displayName = \"ModalContainer\";\nContent.displayName = \"Content\";\nHeader.displayName = \"Modal.Header\";\nFooter.displayName = \"Modal.Footer\";\n","// V1 Modal - Explicit exports for optimal tree shaking\nimport Modal from \"./Modal\";\n\nexport default Modal;\nexport { Modal };\n\n// Explicit type exports\nexport type {\n  TypeModalProps,\n  TypeModalHeaderProps,\n  TypeModalFooterProps,\n  TypeModalContentProps,\n  TypeModalCloseButtonProps,\n} from \"./ModalTypes\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport { StyledOverlay, StyledContent } from \"./ModalV2Styles\";\nimport {\n  ModalHeader,\n  ModalDescription,\n  ModalTrigger,\n  ModalRail,\n  ModalAction,\n} from \"./components\";\nimport {\n  DEFAULT_MODAL_WIDTH,\n  DEFAULT_MODAL_BG,\n  DEFAULT_MODAL_Z_INDEX,\n  MODAL_SIZE_PRESETS,\n  MODAL_PRIORITY_Z_INDEX,\n} from \"../shared/constants\";\nimport type { TypeModalV2Props } from \"./ModalV2Types\";\n\ninterface DraggableModalContentProps {\n  children: React.ReactNode;\n  computedWidth: any;\n  bg: any;\n  computedZIndex: number;\n  label?: string;\n  dataAttributes: Record<string, string>;\n  draggable?: boolean;\n  rest: any;\n  railProps?: Partial<TypeModalV2Props[\"railProps\"]>;\n}\n\n// Context to share drag state between modal content and header\ninterface DragContextValue {\n  position: { x: number; y: number };\n  isDragging: boolean;\n  onHeaderMouseDown: (e: React.MouseEvent) => void;\n  contentRef: React.RefObject<HTMLDivElement>;\n  draggable: boolean;\n}\n\nconst DragContext = React.createContext<DragContextValue | null>(null);\n\nexport const useDragContext = () => {\n  const context = React.useContext(DragContext);\n  return context;\n};\n\nconst DraggableModalContent: React.FC<DraggableModalContentProps> = ({\n  children,\n  computedWidth,\n  bg,\n  computedZIndex,\n  label,\n  dataAttributes,\n  draggable,\n  rest,\n  railProps,\n}) => {\n  const [position, setPosition] = React.useState({ x: 0, y: 0 });\n  const [isDragging, setIsDragging] = React.useState(false);\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  // Calculate rail dimensions for boundary constraints\n  const railSize = railProps?.size ?? 44;\n  const railOffset = railProps?.offset ?? 12;\n  const railSide = railProps?.side ?? \"right\";\n\n  // Total extra space needed on the side with the rail\n  // (only when viewport is wider than 400px breakpoint)\n  const railExtraSpace = railSize + railOffset;\n\n  const handleHeaderMouseDown = React.useCallback(\n    (e: React.MouseEvent) => {\n      if (!draggable) return;\n\n      // Only allow dragging from header (not interactive elements)\n      const target = e.target as HTMLElement;\n      if (\n        target.tagName === \"BUTTON\" ||\n        target.tagName === \"INPUT\" ||\n        target.closest(\"button\")\n      ) {\n        return;\n      }\n\n      e.preventDefault();\n      setIsDragging(true);\n\n      const rect = contentRef.current?.getBoundingClientRect();\n      if (!rect) return;\n\n      // Calculate offset from mouse to current modal position\n      const offsetX = e.clientX - rect.left;\n      const offsetY = e.clientY - rect.top;\n\n      const handleMouseMove = (e: MouseEvent) => {\n        e.preventDefault();\n\n        // Calculate new position based on mouse position minus offset\n        const newX = e.clientX - offsetX;\n        const newY = e.clientY - offsetY;\n\n        // Determine if rail is on the side (viewport > 400px) or above (viewport <= 400px)\n        const isRailOnSide = window.innerWidth > 400;\n\n        // Constrain to viewport bounds (keeping modal AND rail fully visible)\n        const modalWidth = rect.width;\n        const modalHeight = rect.height;\n\n        // Adjust boundaries to account for rail position\n        let maxX = window.innerWidth - modalWidth;\n        let minX = 0;\n        let maxY = window.innerHeight - modalHeight;\n        let minY = 0;\n\n        if (isRailOnSide) {\n          // Rail is positioned on the side of the modal\n          if (railSide === \"right\") {\n            // Rail is on the right, so reduce maxX to prevent rail from going off-screen\n            maxX = window.innerWidth - modalWidth - railExtraSpace;\n          } else {\n            // Rail is on the left, so increase minX to prevent rail from going off-screen\n            minX = railExtraSpace;\n          }\n        } else {\n          // Rail is positioned above the modal (viewport <= 400px)\n          // Account for rail height + offset at the top\n          minY = railSize + railOffset;\n        }\n\n        const constrainedX = Math.max(minX, Math.min(maxX, newX));\n        const constrainedY = Math.max(minY, Math.min(maxY, newY));\n\n        // Convert to offset from center for our transform\n        const centerX = window.innerWidth / 2 - modalWidth / 2;\n        const centerY = window.innerHeight / 2 - modalHeight / 2;\n\n        setPosition({\n          x: constrainedX - centerX,\n          y: constrainedY - centerY,\n        });\n      };\n\n      const handleMouseUp = () => {\n        setIsDragging(false);\n        document.removeEventListener(\"mousemove\", handleMouseMove);\n        document.removeEventListener(\"mouseup\", handleMouseUp);\n      };\n\n      document.addEventListener(\"mousemove\", handleMouseMove);\n      document.addEventListener(\"mouseup\", handleMouseUp);\n    },\n    [draggable, railSide, railExtraSpace]\n  );\n\n  const dragContextValue = React.useMemo<DragContextValue>(\n    () => ({\n      position,\n      isDragging,\n      onHeaderMouseDown: handleHeaderMouseDown,\n      contentRef,\n      draggable: draggable ?? false,\n    }),\n    [position, isDragging, handleHeaderMouseDown, draggable]\n  );\n\n  // Prevent modal from closing on outside interaction when draggable\n  const handleInteractOutside = React.useCallback(\n    (e: Event) => {\n      if (draggable) {\n        e.preventDefault();\n      }\n    },\n    [draggable]\n  );\n\n  return (\n    <DragContext.Provider value={draggable ? dragContextValue : null}>\n      <StyledContent\n        ref={contentRef}\n        width={computedWidth}\n        bg={bg}\n        zIndex={computedZIndex}\n        aria-label={label}\n        draggable={draggable}\n        isDragging={isDragging}\n        railSize={railSize}\n        railOffset={railOffset}\n        railSide={railSide}\n        onInteractOutside={handleInteractOutside}\n        style={\n          draggable\n            ? {\n                transform: `translate(calc(-50% + ${position.x}px), calc(-50% + ${position.y}px))`,\n                transition: isDragging ? \"none\" : undefined,\n              }\n            : undefined\n        }\n        {...dataAttributes}\n        {...rest}\n      >\n        {children}\n      </StyledContent>\n    </DragContext.Provider>\n  );\n};\n\n/**\n * The modal you want - with Radix UI Dialog\n *\n * Features:\n * - Built with Radix UI Dialog for superior accessibility\n * - Same API as the original Modal component\n * - Automatic focus management and keyboard navigation\n * - Portal rendering for proper z-index layering\n * - Customizable styling through system props\n * - Optional draggable functionality using react-dnd\n */\nconst Modal = (props: TypeModalV2Props) => {\n  const {\n    children,\n    modalTrigger,\n    draggable = false,\n    open,\n    defaultOpen,\n    onOpenChange,\n    \"aria-label\": label,\n    title,\n    subtitle,\n    description,\n    size,\n    priority,\n    data = {},\n    bg = DEFAULT_MODAL_BG,\n    showOverlay = true,\n    actions,\n    railProps,\n    ...rest\n  } = props;\n\n  const handleOpenChange = React.useCallback(\n    (newOpen: boolean) => {\n      onOpenChange?.(newOpen);\n    },\n    [onOpenChange]\n  );\n\n  // Compute actual width\n  const computedWidth = React.useMemo(() => {\n    if (size) {\n      // Handle preset sizes\n      if (typeof size === \"string\" && size in MODAL_SIZE_PRESETS) {\n        return MODAL_SIZE_PRESETS[size as keyof typeof MODAL_SIZE_PRESETS];\n      }\n      // Handle custom size values\n      return size;\n    }\n    // Fall back to default width\n    return DEFAULT_MODAL_WIDTH;\n  }, [size]);\n\n  // Compute actual z-index\n  const computedZIndex = React.useMemo(() => {\n    if (priority) {\n      return MODAL_PRIORITY_Z_INDEX[priority];\n    }\n    return DEFAULT_MODAL_Z_INDEX;\n  }, [priority]);\n\n  // Create data attributes object\n  const dataAttributes = React.useMemo(() => {\n    const attrs: Record<string, string> = {};\n    Object.entries(data).forEach(([key, value]) => {\n      attrs[`data-${key}`] = String(value);\n    });\n    attrs[\"data-qa-modal\"] = \"\";\n    // Only add open attribute if in controlled mode\n    if (open !== undefined) {\n      attrs[\"data-qa-modal-open\"] = String(open);\n    }\n    return attrs;\n  }, [data, open]);\n\n  // Determine if we should auto-render the header from provided props\n  const shouldRenderHeader = Boolean(title || subtitle);\n\n  // Build Dialog.Root props conditionally\n  const dialogRootProps = React.useMemo(() => {\n    const props: any = {};\n\n    // If controlled (open prop provided), use it\n    if (open !== undefined) {\n      props.open = open;\n    }\n    // If uncontrolled with explicit defaultOpen, use it\n    else if (defaultOpen !== undefined) {\n      props.defaultOpen = defaultOpen;\n    }\n    // If completely uncontrolled (neither open nor defaultOpen provided), default to closed\n    else {\n      props.defaultOpen = false;\n    }\n\n    // Always add onOpenChange if provided\n    if (onOpenChange) {\n      props.onOpenChange = handleOpenChange;\n    }\n\n    // When draggable, prevent modal from closing on outside interaction\n    // This allows users to interact with background content\n    if (draggable) {\n      props.modal = false;\n    }\n\n    return props;\n  }, [open, defaultOpen, handleOpenChange, onOpenChange, draggable]);\n\n  // Handle trigger - use modalTrigger prop if provided, otherwise look for ModalTrigger children (backward compatibility)\n  const triggers: React.ReactNode[] = [];\n  const content: React.ReactNode[] = [];\n\n  if (modalTrigger) {\n    // New prop-based approach: wrap the provided element with Dialog.Trigger\n    triggers.push(\n      <Dialog.Trigger key=\"modal-trigger\" asChild>\n        {modalTrigger}\n      </Dialog.Trigger>\n    );\n    // All children are content\n    content.push(children);\n  } else {\n    // Legacy approach: separate ModalTrigger children from content children\n    React.Children.forEach(children, (child) => {\n      if (React.isValidElement(child) && child.type === ModalTrigger) {\n        triggers.push(child);\n      } else {\n        content.push(child);\n      }\n    });\n  }\n\n  return (\n    <Dialog.Root {...dialogRootProps}>\n      {/* Render triggers as direct children of Dialog.Root */}\n      {triggers}\n\n      <Dialog.Portal>\n        {showOverlay && (\n          <StyledOverlay zIndex={computedZIndex} allowInteraction={draggable} />\n        )}\n        <DraggableModalContent\n          computedWidth={computedWidth}\n          bg={bg}\n          computedZIndex={computedZIndex}\n          label={label}\n          dataAttributes={dataAttributes}\n          draggable={draggable}\n          rest={rest}\n          railProps={railProps}\n        >\n          {/* Floating actions rail - always show a close by default */}\n          <ModalRail {...railProps}>\n            <ModalAction\n              actionType=\"close\"\n              aria-label=\"Close\"\n              iconName=\"x-outline\"\n            />\n            {actions?.map((action, idx) => (\n              <ModalAction key={idx} {...action} />\n            ))}\n          </ModalRail>\n          {/* Auto-render header when title or subtitle is provided */}\n          {shouldRenderHeader && (\n            <ModalHeader title={title} subtitle={subtitle} />\n          )}\n\n          {/* Auto-render description when provided */}\n          {description && <ModalDescription>{description}</ModalDescription>}\n\n          {/* Main content (everything except triggers) */}\n          {content}\n        </DraggableModalContent>\n      </Dialog.Portal>\n    </Dialog.Root>\n  );\n};\n\nexport default Modal;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { width, zIndex } from \"styled-system\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport Box, { type TypeContainerProps } from \"@sproutsocial/seeds-react-box\";\nimport {\n  BODY_PADDING,\n  DEFAULT_OVERLAY_Z_INDEX_OFFSET,\n} from \"../shared/constants\";\n\ninterface StyledOverlayProps extends TypeContainerProps {\n  zIndex?: number;\n  allowInteraction?: boolean;\n}\n\nexport const StyledOverlay = styled(Dialog.Overlay)<StyledOverlayProps>`\n  position: fixed;\n  top: 0px;\n  left: 0px;\n  right: 0px;\n  bottom: 0px;\n  background-color: ${(props) => props.theme.colors.overlay.background.base};\n  opacity: 0;\n  will-change: opacity;\n  transition: opacity ${(props) => props.theme.duration.medium}\n    ${(props) => props.theme.easing.ease_inout};\n  z-index: ${(props) =>\n    props.zIndex ? props.zIndex + DEFAULT_OVERLAY_Z_INDEX_OFFSET : 999};\n\n  /* Allow clicking through overlay when modal is draggable */\n  ${(props) =>\n    props.allowInteraction &&\n    `\n    pointer-events: none;\n  `}\n\n  ${zIndex}\n\n  &[data-state=\"open\"] {\n    opacity: 1;\n  }\n  &[data-state=\"closed\"] {\n    opacity: 0;\n  }\n`;\n\ninterface StyledContentProps extends TypeContainerProps {\n  zIndex?: number;\n  isDragging?: boolean;\n  draggable?: boolean;\n  railSize?: number;\n  railOffset?: number;\n  railSide?: \"right\" | \"left\";\n}\n\nexport const StyledContent = styled(Dialog.Content)<StyledContentProps>`\n  position: fixed;\n  ${(props) =>\n    props.draggable\n      ? `\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n      `\n      : `\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n      `}\n  display: flex;\n  flex-direction: column;\n  border-radius: ${(props) => props.theme.radii[600]};\n  box-shadow: ${(props) => props.theme.shadows.medium};\n  filter: blur(0);\n  color: ${(props) => props.theme.colors.text.body};\n  outline: none;\n  max-width: ${(props) => {\n    // Calculate extra space needed for the rail when it's on the side (viewport > 400px)\n    const railSize = props.railSize ?? 44;\n    const railOffset = props.railOffset ?? 12;\n    const railExtraSpace = railSize + railOffset;\n\n    // Account for rail space when positioned on the side\n    // At viewport <= 400px, rail is above modal, so no horizontal space needed\n    return `calc(100vw - ${BODY_PADDING} - ${railExtraSpace}px)`;\n  }};\n  max-height: calc(100vh - ${BODY_PADDING});\n  z-index: ${(props) => props.zIndex || 1000};\n\n  /* When viewport is <= 400px, rail is above modal, so restore full width */\n  @media (max-width: 400px) {\n    max-width: calc(100vw - ${BODY_PADDING});\n  }\n\n  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n    height: calc(100vh - ${BODY_PADDING});\n  }\n\n  ${width}\n  ${COMMON}\n\n  /* Enhanced Radix Dialog animations */\n  opacity: 0;\n  ${(props) =>\n    !props.draggable\n      ? `\n    transform: translate(-50%, -50%) scale(0.95);\n    transition: opacity ${props.theme.duration.medium} ${props.theme.easing.ease_inout},\n      transform ${props.theme.duration.medium} ${props.theme.easing.ease_inout};\n  `\n      : `\n    transition: opacity ${props.theme.duration.medium} ${props.theme.easing.ease_inout};\n  `}\n\n  &[data-state=\"open\"] {\n    opacity: 1;\n    ${(props) =>\n      !props.draggable ? `transform: translate(-50%, -50%) scale(1);` : ``}\n  }\n  &[data-state=\"closed\"] {\n    opacity: 0;\n    ${(props) =>\n      !props.draggable ? `transform: translate(-50%, -50%) scale(0.95);` : ``}\n  }\n`;\n\nexport const Content = styled(Box)`\n  font-family: ${(props) => props.theme.fontFamily};\n  min-height: 80px;\n  overflow-y: auto;\n  flex: 1 1 auto;\n  padding: 0 ${(props) => props.theme.space[300]}\n    ${(props) => props.theme.space[300]} ${(props) => props.theme.space[300]};\n  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n    flex-basis: 100%;\n  }\n`;\n\ninterface HeaderProps {\n  draggable?: boolean;\n  isDragging?: boolean;\n}\n\nexport const Header = styled(Box)<HeaderProps>`\n  font-family: ${(props) => props.theme.fontFamily};\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[300]};\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex: 0 0 auto;\n\n  /* Draggable cursor styling */\n  ${(props) =>\n    props.draggable &&\n    `\n    cursor: ${props.isDragging ? \"grabbing\" : \"grab\"};\n    user-select: none;\n  `}\n`;\n\nexport const Footer = styled(Box)`\n  flex: 0 0 auto;\n  font-family: ${(props) => props.theme.fontFamily};\n  padding: ${(props) => props.theme.space[400]}\n    ${(props) => props.theme.space[300]};\n  border-bottom-right-radius: ${(props) => props.theme.radii[500]};\n  border-bottom-left-radius: ${(props) => props.theme.radii[500]};\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: ${(props) => props.theme.space[100]};\n`;\n\nStyledOverlay.displayName = \"ModalOverlay\";\nStyledContent.displayName = \"ModalContent\";\nContent.displayName = \"ModalContent\";\nHeader.displayName = \"ModalHeader\";\nFooter.displayName = \"ModalFooter\";\n","// Shared constants for both Modal versions\n\n// Default z-index values\nexport const DEFAULT_MODAL_Z_INDEX = 6;\nexport const DEFAULT_OVERLAY_Z_INDEX_OFFSET = -1;\n\n// Default styling values\nexport const DEFAULT_MODAL_WIDTH = \"600px\";\nexport const DEFAULT_MODAL_BG = \"container.background.base\";\nexport const DEFAULT_CLOSE_BUTTON_LABEL = \"Close dialog\";\n\n// Max space allowed between the modal and the edge of the browser\nexport const BODY_PADDING = \"64px\";\n\n// Size presets for simplified API\nexport const MODAL_SIZE_PRESETS = {\n  small: \"400px\",\n  medium: \"600px\",\n  large: \"800px\",\n  full: \"90vw\",\n} as const;\n\n// Priority level z-index mappings\nexport const MODAL_PRIORITY_Z_INDEX = {\n  low: 100,\n  medium: 1000,\n  high: 2000,\n} as const;\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport { Header } from \"../ModalV2Styles\";\nimport { ModalCloseButton } from \"./ModalCloseButton\";\nimport type { TypeModalV2HeaderProps } from \"../ModalV2Types\";\nimport { useDragContext } from \"../ModalV2\";\n\nexport const ModalHeader = (props: TypeModalV2HeaderProps) => {\n  const {\n    title,\n    subtitle,\n    children,\n    titleProps = {},\n    subtitleProps = {},\n    showInlineClose,\n    ...rest\n  } = props;\n\n  const dragContext = useDragContext();\n  const isDraggable = dragContext?.draggable ?? false;\n\n  return (\n    <Header\n      {...rest}\n      onMouseDown={isDraggable ? dragContext?.onHeaderMouseDown : undefined}\n      draggable={isDraggable}\n      isDragging={dragContext?.isDragging}\n    >\n      {children ? (\n        children\n      ) : (\n        <React.Fragment>\n          <Box>\n            {title && (\n              <Dialog.Title asChild {...titleProps}>\n                <Text.Headline>{title}</Text.Headline>\n              </Dialog.Title>\n            )}\n            {subtitle && (\n              <Dialog.Description asChild {...subtitleProps}>\n                <Text as=\"div\" fontSize={200}>\n                  {subtitle}\n                </Text>\n              </Dialog.Description>\n            )}\n          </Box>\n          {showInlineClose && (\n            <Box display=\"flex\" alignItems=\"center\" justifyContent=\"flex-end\">\n              <ModalCloseButton position=\"relative\" offset={0} />\n            </Box>\n          )}\n        </React.Fragment>\n      )}\n    </Header>\n  );\n};\n\nModalHeader.displayName = \"ModalHeader\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport styled from \"styled-components\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeModalV2CloseButtonProps } from \"../ModalV2Types\";\n\nconst CloseButtonWrapper = styled.button<{\n  size?: number;\n  position?: \"absolute\" | \"relative\";\n  side?: \"right\" | \"left\";\n  offset?: number;\n}>`\n  width: ${(p) => p.size || 44}px;\n  height: ${(p) => p.size || 44}px;\n  display: inline-grid;\n  place-items: center;\n  border-radius: 8px;\n  border: none;\n  background: rgba(22, 32, 32, 0.56);\n  color: #ffffff;\n  cursor: pointer;\n  outline: none;\n  transition: all 0.2s ease;\n\n  ${(p) =>\n    p.position === \"absolute\" &&\n    `\n    position: absolute;\n    top: 0px;\n    ${p.side || \"right\"}: ${p.offset || -48}px;\n    z-index: 1;\n  `}\n\n  &:hover {\n    background: rgba(22, 32, 32, 0.7);\n    transform: translateY(-1px);\n  }\n\n  &:active {\n    transform: translateY(0);\n  }\n\n  &:focus-visible {\n    box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #205bc3;\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n`;\n\nexport const ModalCloseButton = (props: TypeModalV2CloseButtonProps) => {\n  const {\n    children,\n    onClick,\n    asChild,\n    closeButtonLabel = \"Close modal\",\n    size = 44,\n    position = \"absolute\",\n    side = \"right\",\n    offset = -48,\n    ...rest\n  } = props;\n\n  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n    onClick?.(e);\n    // Dialog.Close automatically handles closing\n  };\n\n  if (asChild) {\n    return (\n      <Dialog.Close asChild>\n        {React.cloneElement(children as React.ReactElement, {\n          onClick: handleClick,\n          ...rest,\n        })}\n      </Dialog.Close>\n    );\n  }\n\n  return (\n    <Dialog.Close asChild>\n      <CloseButtonWrapper\n        onClick={handleClick}\n        size={size}\n        position={position}\n        side={side}\n        offset={offset}\n        aria-label={closeButtonLabel}\n        title={closeButtonLabel}\n        {...rest}\n      >\n        {children || <Icon name=\"x-outline\" size=\"small\" />}\n      </CloseButtonWrapper>\n    </Dialog.Close>\n  );\n};\n\nModalCloseButton.displayName = \"ModalCloseButton\";\n","import * as React from \"react\";\nimport { Footer } from \"../ModalV2Styles\";\nimport { DEFAULT_MODAL_BG } from \"../../shared/constants\";\nimport type { TypeModalV2FooterProps } from \"../ModalV2Types\";\n\nexport const ModalFooter = (props: TypeModalV2FooterProps) => {\n  const { bg = DEFAULT_MODAL_BG, children, ...rest } = props;\n  return (\n    <Footer\n      bg={bg}\n      borderTop={500}\n      borderColor=\"container.border.base\"\n      {...rest}\n    >\n      {children}\n    </Footer>\n  );\n};\n\nModalFooter.displayName = \"ModalFooter\";\n","import * as React from \"react\";\nimport { Content } from \"../ModalV2Styles\";\nimport type { TypeModalV2ContentProps } from \"../ModalV2Types\";\n\nexport const ModalContent = React.forwardRef<\n  HTMLDivElement,\n  TypeModalV2ContentProps\n>(({ children, ...rest }, ref) => {\n  return (\n    <Content data-qa-modal ref={ref} {...rest}>\n      {children}\n    </Content>\n  );\n});\n\nModalContent.displayName = \"ModalContent\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport type { TypeModalV2DescriptionProps } from \"../ModalV2Types\";\n\nexport const ModalDescription = React.forwardRef<\n  HTMLDivElement,\n  TypeModalV2DescriptionProps\n>(({ children, descriptionProps = {}, ...rest }, ref) => {\n  return (\n    <Dialog.Description asChild {...descriptionProps}>\n      <Box ref={ref} {...rest}>\n        {children}\n      </Box>\n    </Dialog.Description>\n  );\n});\n\nModalDescription.displayName = \"ModalDescription\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport type { TypeModalV2TriggerProps } from \"../ModalV2Types\";\n\n/**\n * A trigger button that opens the modal when clicked.\n * Must be used inside a Modal component's Dialog.Root context.\n * Uses Seeds Button by default but supports asChild for custom elements.\n */\nexport const ModalTrigger = (props: TypeModalV2TriggerProps) => {\n  const { children, onClick, asChild, ...rest } = props;\n\n  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n    onClick?.(e);\n    // Dialog.Trigger automatically handles modal opening\n  };\n\n  if (asChild) {\n    return (\n      <Dialog.Trigger asChild>\n        {React.cloneElement(children as React.ReactElement, {\n          onClick: handleClick,\n          ...rest,\n        })}\n      </Dialog.Trigger>\n    );\n  }\n\n  return (\n    <Dialog.Trigger asChild>\n      <Button onClick={handleClick} {...rest}>\n        {children}\n      </Button>\n    </Dialog.Trigger>\n  );\n};\n\nModalTrigger.displayName = \"ModalTrigger\";\n","import * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\n\nexport interface ModalCloseProps {\n  children: React.ReactNode;\n  onClick?: (e: React.MouseEvent) => void;\n  asChild?: boolean;\n}\n\n/**\n * A component that closes the modal when clicked.\n * Uses asChild pattern like Radix primitives.\n */\nexport const ModalClose = (props: ModalCloseProps) => {\n  const { children, onClick, asChild = false, ...rest } = props;\n\n  const handleClick = (e: React.MouseEvent) => {\n    onClick?.(e);\n    // Dialog.Close automatically handles closing\n  };\n\n  return (\n    <Dialog.Close asChild={asChild} onClick={handleClick} {...rest}>\n      {children}\n    </Dialog.Close>\n  );\n};\n\nModalClose.displayName = \"ModalClose\";\n","// components/ModalRail.tsx\nimport * as React from \"react\";\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport styled from \"styled-components\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport type { TypeModalRailProps, TypeModalActionProps } from \"../ModalV2Types\";\n\n// --- styled wrappers ---\nconst Rail = styled.div<{\n  side: \"right\" | \"left\";\n  offset: number;\n  gap: number;\n  size: number;\n}>`\n  position: absolute;\n  top: ${(p) => p.offset}px;\n  ${(p) =>\n    p.side === \"right\"\n      ? `right: calc(-1 * (${p.size}px + ${p.offset}px));`\n      : `left: calc(-1 * (${p.size}px + ${p.offset}px));`}\n  display: flex;\n  flex-direction: column;\n  gap: ${(p) => p.gap}px;\n  z-index: 1;\n\n  @media (max-width: 400px) {\n    /* Move rail above the modal on the right side */\n    top: auto;\n    bottom: calc(100% + ${(p) => p.offset}px);\n    right: ${(p) => p.offset}px;\n    left: auto;\n    /* Change to horizontal layout with reversed order */\n    flex-direction: row-reverse;\n  }\n`;\n\nconst RailBtn = styled.button<{ size: number }>`\n  width: ${(p) => p.size}px;\n  height: ${(p) => p.size}px;\n  display: inline-grid;\n  place-items: center;\n  border-radius: 8px;\n  border: none;\n  background: rgba(22, 32, 32, 0.56);\n  color: #ffffff;\n  cursor: pointer;\n  outline: none;\n  transition: all 0.2s ease;\n\n  &:hover {\n    background: rgba(22, 32, 32, 0.7);\n    transform: translateY(-1px);\n  }\n\n  &:active {\n    transform: translateY(0);\n  }\n\n  &:focus-visible {\n    box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #205bc3;\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n`;\n\n// --- components ---\nexport const ModalRail: React.FC<TypeModalRailProps> = ({\n  side = \"right\",\n  offset = 12,\n  gap = 12,\n  size = 44,\n  children,\n}) => {\n  return (\n    <Rail\n      data-slot=\"modal-rail\"\n      side={side}\n      offset={offset}\n      gap={gap}\n      size={size}\n      aria-label=\"Modal quick actions\"\n    >\n      {React.Children.map(children, (child) =>\n        React.isValidElement(child)\n          ? React.cloneElement(child as any, { size })\n          : child\n      )}\n    </Rail>\n  );\n};\n\nexport const ModalAction: React.FC<\n  TypeModalActionProps & { size?: number }\n> = ({\n  \"aria-label\": ariaLabel,\n  iconName,\n  disabled,\n  size = 44,\n  actionType,\n  onClick,\n  ...rest\n}) => {\n  const Btn = (\n    <RailBtn\n      size={size}\n      aria-label={ariaLabel}\n      title={ariaLabel}\n      disabled={disabled}\n      {...rest}\n    >\n      {iconName ? <Icon name={iconName} size=\"small\" /> : ariaLabel}\n    </RailBtn>\n  );\n\n  return actionType === \"close\" ? (\n    <Dialog.Close asChild>{Btn}</Dialog.Close>\n  ) : (\n    React.cloneElement(Btn, { onClick })\n  );\n};\n"],"mappings":"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","names":["ModalCloseButton","ModalContent","ModalFooter","ModalHeader","React","import_react","import_seeds_react_box","className","ReactModal","styled","Box","import_jsx_runtime","Box","Text","Button","Icon","width","zIndex","React","Dialog","import_react","import_styled_components","import_styled_system","import_seeds_react_system_props","import_seeds_react_box","BODY_PADDING","styled","BODY_PADDING","Content","Box","Header","Footer","React","Dialog","import_seeds_react_box","import_seeds_react_text","React","Dialog","import_styled_components","import_seeds_react_icon","import_jsx_runtime","styled","ModalCloseButton","Icon","import_jsx_runtime","ModalHeader","Header","Box","Text","ModalCloseButton","React","import_jsx_runtime","ModalFooter","Footer","React","import_jsx_runtime","ModalContent","Content","React","Dialog","import_seeds_react_box","import_jsx_runtime","Box","React","Dialog","import_seeds_react_button","import_jsx_runtime","Button","React","Dialog","import_jsx_runtime","React","Dialog","import_styled_components","import_seeds_react_icon","import_jsx_runtime","styled","Icon","import_jsx_runtime","e","Modal","props","ModalHeader"]}

package/dist/v2/index.d.mts

@@ -1,4 +1,4 @@
-export { M as Modal, i as ModalAction, g as ModalClose, f as ModalCloseButton, e as ModalContent, b as ModalDescription, d as ModalFooter, c as ModalHeader, h as ModalRail, a as ModalTrigger, q as TypeModalActionProps, p as TypeModalRailProps, k as TypeModalV2CloseButtonProps, n as TypeModalV2ContentProps, o as TypeModalV2DescriptionProps, m as TypeModalV2FooterProps, l as TypeModalV2HeaderProps, T as TypeModalV2Props, j as TypeModalV2TriggerProps } from '../ModalRail-OQ8DZ1vH.mjs';
+export { M as Modal, i as ModalAction, g as ModalClose, f as ModalCloseButton, e as ModalContent, b as ModalDescription, d as ModalFooter, c as ModalHeader, h as ModalRail, a as ModalTrigger, q as TypeModalActionProps, p as TypeModalRailProps, k as TypeModalV2CloseButtonProps, n as TypeModalV2ContentProps, o as TypeModalV2DescriptionProps, m as TypeModalV2FooterProps, l as TypeModalV2HeaderProps, T as TypeModalV2Props, j as TypeModalV2TriggerProps, u as useDragContext } from '../ModalRail-5PeilhW7.mjs';
 import 'react/jsx-runtime';
 import 'react';
 import '@radix-ui/react-dialog';

package/dist/v2/index.d.ts

@@ -1,4 +1,4 @@
-export { M as Modal, i as ModalAction, g as ModalClose, f as ModalCloseButton, e as ModalContent, b as ModalDescription, d as ModalFooter, c as ModalHeader, h as ModalRail, a as ModalTrigger, q as TypeModalActionProps, p as TypeModalRailProps, k as TypeModalV2CloseButtonProps, n as TypeModalV2ContentProps, o as TypeModalV2DescriptionProps, m as TypeModalV2FooterProps, l as TypeModalV2HeaderProps, T as TypeModalV2Props, j as TypeModalV2TriggerProps } from '../ModalRail-OQ8DZ1vH.js';
+export { M as Modal, i as ModalAction, g as ModalClose, f as ModalCloseButton, e as ModalContent, b as ModalDescription, d as ModalFooter, c as ModalHeader, h as ModalRail, a as ModalTrigger, q as TypeModalActionProps, p as TypeModalRailProps, k as TypeModalV2CloseButtonProps, n as TypeModalV2ContentProps, o as TypeModalV2DescriptionProps, m as TypeModalV2FooterProps, l as TypeModalV2HeaderProps, T as TypeModalV2Props, j as TypeModalV2TriggerProps, u as useDragContext } from '../ModalRail-5PeilhW7.js';
 import 'react/jsx-runtime';
 import 'react';
 import '@radix-ui/react-dialog';