@teamturing/react-kit 2.46.3 → 2.46.5

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

@@ -6,6 +6,11 @@ type Props = {
      */
     icon: ComponentType<SVGProps<SVGSVGElement>>;
 } & Pick<ViewProps, 'size' | 'color' | 'sx'> & Pick<HTMLAttributes<HTMLDivElement>, 'className'>;
-declare const StyledIcon: ({ icon: Icon, sx, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const StyledIcon: import("react").ForwardRefExoticComponent<{
+    /**
+     * @teamturing/icons와 함께 사용
+     */
+    icon: ComponentType<SVGProps<SVGSVGElement>>;
+} & Pick<ViewProps, "color" | "size" | "sx"> & Pick<HTMLAttributes<HTMLDivElement>, "className"> & import("react").RefAttributes<HTMLDivElement>>;
 export default StyledIcon;
 export type { Props as StyledIconProps };

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

@@ -1,4 +1,5 @@
 import { PropsWithChildren } from 'react';
+import { TooltipOptions } from './useTooltip';
 type Props = {
     /**
      * children 컴포넌트 기준으로 Tooltip의 위치를 정의합니다.
@@ -8,7 +9,11 @@ type Props = {
      * Tooltip의 텍스트를 정의합니다.
      */
     text?: string;
-} & PropsWithChildren;
-declare const Tooltip: ({ children, direction, text }: Props) => import("react/jsx-runtime").JSX.Element;
+    /**
+     * Tooltip의 활성화 여부를 정의합니다.
+     */
+    disabled?: boolean;
+} & PropsWithChildren & Pick<TooltipOptions, 'mouseOnly'>;
+declare const Tooltip: ({ children, direction, text, disabled, mouseOnly }: Props) => import("react/jsx-runtime").JSX.Element;
 export default Tooltip;
 export type { Props as TooltipProps };

package/dist/core/Tooltip/useTooltip.d.ts

@@ -1,12 +1,12 @@
-import { type Placement, type UseFloatingReturn, type UseInteractionsReturn } from '@floating-ui/react';
+import { type Placement, type UseFloatingReturn, type UseInteractionsReturn, type UseHoverProps } from '@floating-ui/react';
 import { type MutableRefObject } from 'react';
-export interface TooltipOptions {
+export type TooltipOptions = {
     initialOpen?: boolean;
     placement?: Placement;
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
-}
-export declare function useTooltip({ initialOpen, placement, open: controlledOpen, onOpenChange: setControlledOpen, }?: TooltipOptions): {
+} & Pick<UseHoverProps, 'mouseOnly'>;
+export declare function useTooltip({ initialOpen, placement, open: controlledOpen, onOpenChange: setControlledOpen, mouseOnly, }?: TooltipOptions): {
     open: boolean;
     setOpen: (open: boolean) => void;
 } & UseInteractionsReturn & UseFloatingReturn & {

package/dist/index.js

@@ -7031,11 +7031,12 @@ var Grid$1 = Object.assign(Grid, {
   Unit
 });
 
-const StyledIcon = ({
+const StyledIcon = /*#__PURE__*/React.forwardRef(({
   icon: Icon,
   sx,
   ...props
-}) => /*#__PURE__*/jsxRuntimeExports.jsx(View, {
+}, ref) => /*#__PURE__*/jsxRuntimeExports.jsx(View, {
+  ref: ref,
   ...props,
   color: props.color,
   sx: {
@@ -7047,7 +7048,7 @@ const StyledIcon = ({
     ...sx
   },
   children: /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {})
-});
+}));
 
 const Text = styled__default.default.span({
   'display': 'block',
@@ -34120,7 +34121,8 @@ function useTooltip({
   initialOpen = false,
   placement = 'top',
   open: controlledOpen,
-  onOpenChange: setControlledOpen
+  onOpenChange: setControlledOpen,
+  mouseOnly = true
 } = {}) {
   const theme = styled.useTheme();
   const [uncontrolledOpen, setUncontrolledOpen] = React.useState(initialOpen);
@@ -34147,7 +34149,7 @@ function useTooltip({
     move: false,
     restMs: 300,
     enabled: controlledOpen == null,
-    mouseOnly: true
+    mouseOnly
   });
   const focus = useFocus(context, {
     enabled: controlledOpen == null
@@ -34251,6 +34253,9 @@ const StyledBaseTooltipContent = styled__default.default.div`
   border-radius: ${({
   theme
 }) => forcePixelValue(theme.radii.xs)};
+  box-shadow: ${({
+  theme
+}) => theme.shadows['shadow/overlay']};
   padding: ${({
   theme
 }) => `${forcePixelValue(theme.space[2])} ${forcePixelValue(theme.space[3])}`};
@@ -34293,7 +34298,9 @@ const StyledBaseTooltipContent = styled__default.default.div`
 const Tooltip = ({
   children,
   direction = 'top-center',
-  text
+  text,
+  disabled = false,
+  mouseOnly = true
 }) => {
   const directionToPlacement = {
     'top-center': 'top',
@@ -34307,13 +34314,14 @@ const Tooltip = ({
   }[direction];
   return /*#__PURE__*/jsxRuntimeExports.jsxs(BaseTooltip, {
     placement: directionToPlacement,
+    mouseOnly: mouseOnly,
     children: [/*#__PURE__*/jsxRuntimeExports.jsx(BaseTooltipTrigger, {
       className: 'tooltip__tooltip_trigger',
       children: children
-    }), /*#__PURE__*/jsxRuntimeExports.jsx(BaseTooltipContent, {
+    }), !disabled ? /*#__PURE__*/jsxRuntimeExports.jsx(BaseTooltipContent, {
       className: 'tooltip__tooltip_content',
       children: text
-    })]
+    }) : null]
   });
 };
 

package/esm/core/StyledIcon/index.js

@@ -1,11 +1,13 @@
+import { forwardRef } from 'react';
 import View from '../View/index.js';
 import { j as jsxRuntimeExports } from '../../node_modules/react/jsx-runtime.js';
 
-const StyledIcon = ({
+const StyledIcon = /*#__PURE__*/forwardRef(({
   icon: Icon,
   sx,
   ...props
-}) => /*#__PURE__*/jsxRuntimeExports.jsx(View, {
+}, ref) => /*#__PURE__*/jsxRuntimeExports.jsx(View, {
+  ref: ref,
   ...props,
   color: props.color,
   sx: {
@@ -17,6 +19,6 @@ const StyledIcon = ({
     ...sx
   },
   children: /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {})
-});
+}));
 
 export { StyledIcon as default };

package/esm/core/Tooltip/BaseTooltip.js

@@ -83,6 +83,9 @@ const StyledBaseTooltipContent = styled.div`
   border-radius: ${({
   theme
 }) => forcePixelValue(theme.radii.xs)};
+  box-shadow: ${({
+  theme
+}) => theme.shadows['shadow/overlay']};
   padding: ${({
   theme
 }) => `${forcePixelValue(theme.space[2])} ${forcePixelValue(theme.space[3])}`};

package/esm/core/Tooltip/index.js

@@ -4,7 +4,9 @@ import { j as jsxRuntimeExports } from '../../node_modules/react/jsx-runtime.js'
 const Tooltip = ({
   children,
   direction = 'top-center',
-  text
+  text,
+  disabled = false,
+  mouseOnly = true
 }) => {
   const directionToPlacement = {
     'top-center': 'top',
@@ -18,13 +20,14 @@ const Tooltip = ({
   }[direction];
   return /*#__PURE__*/jsxRuntimeExports.jsxs(BaseTooltip, {
     placement: directionToPlacement,
+    mouseOnly: mouseOnly,
     children: [/*#__PURE__*/jsxRuntimeExports.jsx(BaseTooltipTrigger, {
       className: 'tooltip__tooltip_trigger',
       children: children
-    }), /*#__PURE__*/jsxRuntimeExports.jsx(BaseTooltipContent, {
+    }), !disabled ? /*#__PURE__*/jsxRuntimeExports.jsx(BaseTooltipContent, {
       className: 'tooltip__tooltip_content',
       children: text
-    })]
+    }) : null]
   });
 };
 

package/esm/core/Tooltip/useTooltip.js

@@ -8,7 +8,8 @@ function useTooltip({
   initialOpen = false,
   placement = 'top',
   open: controlledOpen,
-  onOpenChange: setControlledOpen
+  onOpenChange: setControlledOpen,
+  mouseOnly = true
 } = {}) {
   const theme = useTheme();
   const [uncontrolledOpen, setUncontrolledOpen] = useState(initialOpen);
@@ -35,7 +36,7 @@ function useTooltip({
     move: false,
     restMs: 300,
     enabled: controlledOpen == null,
-    mouseOnly: true
+    mouseOnly
   });
   const focus = useFocus(context, {
     enabled: controlledOpen == null

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamturing/react-kit",
-  "version": "2.46.3",
+  "version": "2.46.5",
   "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",
@@ -66,5 +66,5 @@
     "react-textarea-autosize": "^8.5.3",
     "styled-system": "^5.1.5"
   },
-  "gitHead": "9b9125cc4c39a4f0064a6ab1be742a030e3bf307"
+  "gitHead": "fc093fecce517059d071cf41c0993cfafe8e2f90"
 }