@teamturing/react-kit 2.65.0 → 2.66.0

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

@@ -1,16 +1,22 @@
-import { PropsWithChildren } from 'react';
+import { ComponentType, PropsWithChildren, SVGProps } from 'react';
 import { ResponsiveValue } from 'styled-system';
+type ToastVariantType = 'success' | 'warning';
 type Props = {
     /**
      * 변주에 대해 정의합니다.
      */
-    variant?: 'success' | 'warning';
+    variant?: ToastVariantType;
+    /**
+     * 아이콘을 정의합니다.
+     * 기본값은 variant에 따라 결정됩니다.
+     */
+    icon?: ComponentType<SVGProps<SVGSVGElement>>;
     /**
      * 크기 변화에 대한 행동을 정의합니다.
      * 반응형 디자인이 적용됩니다.
      */
     resizing?: ResponsiveValue<'hug' | 'fill'>;
 };
-declare const Toast: ({ variant, resizing, children }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
+declare const Toast: ({ variant, icon: Icon, resizing, children, }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
 export default Toast;
 export type { Props as ToastProps };

package/dist/index.js

@@ -7432,17 +7432,16 @@ const ThemeProvider = ({
 
 const Toast = ({
   variant = 'success',
+  icon: Icon = variant === 'success' ? icons.CheckInCircleIcon : icons.ExclamationPointInCircleIcon,
   resizing = 'hug',
   children
 }) => {
-  const IconByVariant = {
-    success: icons.CheckInCircleIcon,
-    warning: icons.ExclamationPointInCircleIcon
-  }[variant];
   return /*#__PURE__*/jsxRuntime.jsxs(BaseToast, {
     variant: variant,
     resizing: resizing,
-    children: [/*#__PURE__*/jsxRuntime.jsx(IconByVariant, {}), children]
+    children: [/*#__PURE__*/jsxRuntime.jsx(Icon, {
+      className: 'toast__leading_icon'
+    }), children]
   });
 };
 const BaseToast = /*#__PURE__*/styled__default.default.div.withConfig({
@@ -7462,11 +7461,7 @@ const BaseToast = /*#__PURE__*/styled__default.default.div.withConfig({
   'fontSize': theme.fontSizes.s,
   'fontWeight': theme.fontWeights.medium,
   'lineHeight': theme.lineHeights[2],
-  '& div': {
-    margin: 0,
-    display: 'inline-block'
-  },
-  '& svg': {
+  '& .toast__leading_icon': {
     width: 24,
     minWidth: 24,
     height: 24,
@@ -7478,12 +7473,12 @@ const BaseToast = /*#__PURE__*/styled__default.default.div.withConfig({
   prop: 'variant',
   variants: {
     success: {
-      '& svg': {
+      '& .toast__leading_icon': {
         color: theme.colors['icon/success']
       }
     },
     warning: {
-      '& svg': {
+      '& .toast__leading_icon': {
         color: theme.colors['icon/warning']
       }
     }

package/esm/core/Toast/index.js

@@ -6,17 +6,16 @@ import { variant } from '../../node_modules/@styled-system/variant/dist/index.es
 
 const Toast = ({
   variant = 'success',
+  icon: Icon = variant === 'success' ? CheckInCircleIcon : ExclamationPointInCircleIcon,
   resizing = 'hug',
   children
 }) => {
-  const IconByVariant = {
-    success: CheckInCircleIcon,
-    warning: ExclamationPointInCircleIcon
-  }[variant];
   return /*#__PURE__*/jsxs(BaseToast, {
     variant: variant,
     resizing: resizing,
-    children: [/*#__PURE__*/jsx(IconByVariant, {}), children]
+    children: [/*#__PURE__*/jsx(Icon, {
+      className: 'toast__leading_icon'
+    }), children]
   });
 };
 const BaseToast = /*#__PURE__*/styled.div.withConfig({
@@ -36,11 +35,7 @@ const BaseToast = /*#__PURE__*/styled.div.withConfig({
   'fontSize': theme.fontSizes.s,
   'fontWeight': theme.fontWeights.medium,
   'lineHeight': theme.lineHeights[2],
-  '& div': {
-    margin: 0,
-    display: 'inline-block'
-  },
-  '& svg': {
+  '& .toast__leading_icon': {
     width: 24,
     minWidth: 24,
     height: 24,
@@ -52,12 +47,12 @@ const BaseToast = /*#__PURE__*/styled.div.withConfig({
   prop: 'variant',
   variants: {
     success: {
-      '& svg': {
+      '& .toast__leading_icon': {
         color: theme.colors['icon/success']
       }
     },
     warning: {
-      '& svg': {
+      '& .toast__leading_icon': {
         color: theme.colors['icon/warning']
       }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamturing/react-kit",
-  "version": "2.65.0",
+  "version": "2.66.0",
   "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",
@@ -55,7 +55,7 @@
   "dependencies": {
     "@floating-ui/react": "^0.27.16",
     "@primer/behaviors": "^1.3.6",
-    "@teamturing/icons": "^1.72.0",
+    "@teamturing/icons": "^1.73.0",
     "@teamturing/token-studio": "^1.16.4",
     "@teamturing/utils": "^1.6.1",
     "framer-motion": "^10.16.4",
@@ -65,5 +65,5 @@
     "react-textarea-autosize": "^8.5.3",
     "styled-system": "^5.1.5"
   },
-  "gitHead": "1c27b74c7b552cc68964894260bd3368a1bfaf2e"
+  "gitHead": "41e122dba2061e6ccd79e36a744a3092fa80f1c5"
 }