@teamturing/react-kit 2.16.1 → 2.16.2

package/dist/core/Overlay/index.d.ts

@@ -1,16 +1,17 @@
 import { HTMLAttributes, RefObject } from 'react';
 import { ResponsiveValue } from 'styled-system';
+type OverlaySizeType = 's' | 'm' | 'l';
 type Props = {
     isOpen?: boolean;
     onDismiss?: () => void;
-    size?: ResponsiveValue<'m'>;
+    size?: ResponsiveValue<OverlaySizeType>;
     ignoreOutsideClickRefs?: RefObject<HTMLElement>[];
     dismissFocusRef?: RefObject<HTMLElement>;
 } & HTMLAttributes<HTMLElement>;
 declare const _default: import("react").ForwardRefExoticComponent<{
     isOpen?: boolean | undefined;
     onDismiss?: (() => void) | undefined;
-    size?: ResponsiveValue<"m"> | undefined;
+    size?: ResponsiveValue<OverlaySizeType> | undefined;
     ignoreOutsideClickRefs?: RefObject<HTMLElement>[] | undefined;
     dismissFocusRef?: RefObject<HTMLElement> | undefined;
 } & HTMLAttributes<HTMLElement> & {

package/dist/core/OverlayPopper/index.d.ts

@@ -2,15 +2,17 @@ import { Placement } from '@floating-ui/react-dom';
 import { PropsWithChildren, ReactNode } from 'react';
 import { FocusTrapHookSettings } from '../../hook/useFocusTrap';
 import { FocusZoneHookSettings } from '../../hook/useFocusZone';
+import { OverlayProps } from '../Overlay';
 type Props = {
     renderOverlay: ({ isOpen, closeOverlay }: {
         isOpen: boolean;
         closeOverlay: () => void;
     }) => ReactNode;
+    overlayProps?: OverlayProps;
     placement?: Placement;
     focusZoneSettings?: Partial<FocusZoneHookSettings>;
     focusTrapSettings?: Partial<FocusTrapHookSettings>;
 };
-declare const OverlayPopper: ({ children: propChildren, renderOverlay, placement, focusZoneSettings, focusTrapSettings, }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
+declare const OverlayPopper: ({ children: propChildren, renderOverlay, overlayProps, placement, focusZoneSettings, focusTrapSettings, }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
 export default OverlayPopper;
 export type { Props as OverlayPopperProps };

package/dist/index.js

@@ -18924,6 +18924,7 @@ const Overlay = ({
     ref: overlayRef,
     size: size,
     ...props,
+    role: 'dialog',
     children: children
   }) : null;
 };
@@ -18945,8 +18946,14 @@ const BaseOverlay = styled__default.default.div`
   ${variant({
   prop: 'size',
   variants: {
+    s: {
+      width: forcePixelValue(256)
+    },
     m: {
-      width: forcePixelValue(180)
+      width: forcePixelValue(320)
+    },
+    l: {
+      width: forcePixelValue(480)
     }
   }
 })}
@@ -20541,6 +20548,7 @@ const useToggleHandler = ({
 const OverlayPopper = ({
   children: propChildren,
   renderOverlay,
+  overlayProps,
   placement = 'bottom-start',
   focusZoneSettings,
   focusTrapSettings
@@ -20562,6 +20570,10 @@ const OverlayPopper = ({
   } = useToggleHandler({
     initialState: false
   });
+  const handleDismiss = () => {
+    overlayProps?.onDismiss?.();
+    closeOverlay();
+  };
   const children = React.Children.map(propChildren, child => /*#__PURE__*/React.cloneElement(child, {
     onClick: toggleOverlay,
     tabIndex: 0,
@@ -20583,10 +20595,11 @@ const OverlayPopper = ({
     children: [children, /*#__PURE__*/jsxRuntimeExports.jsx(Overlay$1, {
       ref: refs.setFloating,
       isOpen: isOpen,
-      onDismiss: closeOverlay,
       dismissFocusRef: refs.reference,
       ignoreOutsideClickRefs: [refs.reference],
+      ...overlayProps,
       style: floatingStyles,
+      onDismiss: handleDismiss,
       children: renderOverlay({
         isOpen,
         closeOverlay

package/esm/core/Overlay/index.js

@@ -67,6 +67,7 @@ const Overlay = ({
     ref: overlayRef,
     size: size,
     ...props,
+    role: 'dialog',
     children: children
   }) : null;
 };
@@ -88,8 +89,14 @@ const BaseOverlay = styled.div`
   ${variant({
   prop: 'size',
   variants: {
+    s: {
+      width: forcePixelValue(256)
+    },
     m: {
-      width: forcePixelValue(180)
+      width: forcePixelValue(320)
+    },
+    l: {
+      width: forcePixelValue(480)
     }
   }
 })}

package/esm/core/OverlayPopper/index.js

@@ -13,6 +13,7 @@ import { offset, flip, shift } from '../../node_modules/@floating-ui/core/dist/f
 const OverlayPopper = ({
   children: propChildren,
   renderOverlay,
+  overlayProps,
   placement = 'bottom-start',
   focusZoneSettings,
   focusTrapSettings
@@ -34,6 +35,10 @@ const OverlayPopper = ({
   } = useToggleHandler({
     initialState: false
   });
+  const handleDismiss = () => {
+    overlayProps?.onDismiss?.();
+    closeOverlay();
+  };
   const children = Children.map(propChildren, child => /*#__PURE__*/cloneElement(child, {
     onClick: toggleOverlay,
     tabIndex: 0,
@@ -55,10 +60,11 @@ const OverlayPopper = ({
     children: [children, /*#__PURE__*/jsxRuntimeExports.jsx(Overlay, {
       ref: refs.setFloating,
       isOpen: isOpen,
-      onDismiss: closeOverlay,
       dismissFocusRef: refs.reference,
       ignoreOutsideClickRefs: [refs.reference],
+      ...overlayProps,
       style: floatingStyles,
+      onDismiss: handleDismiss,
       children: renderOverlay({
         isOpen,
         closeOverlay

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamturing/react-kit",
-  "version": "2.16.1",
+  "version": "2.16.2",
   "description": "React components, hooks for create teamturing web application",
   "author": "Sungchang Park <psch300@gmail.com> (https://github.com/psch300)",
   "homepage": "https://github.com/weareteamturing/bombe#readme",
@@ -62,5 +62,5 @@
     "react-is": "^18.2.0",
     "styled-system": "^5.1.5"
   },
-  "gitHead": "b202599554a5c0aaf45652c3f5815d171b7ba8fb"
+  "gitHead": "0118720b3b7893121d2252a7098195f196cccf68"
 }