@teamturing/react-kit 2.74.0 → 2.75.0

package/dist/core/Datagrid/DatagridBody.d.ts

@@ -1,6 +1,6 @@
-import { PropsWithChildren } from 'react';
+import { AriaAttributes, HTMLAttributes, PropsWithChildren } from 'react';
 import { SxProp } from '../../utils/styled-system';
-type Props = {} & SxProp;
-declare const DatagridBody: ({ ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
+type Props = {} & SxProp & Pick<HTMLAttributes<HTMLDivElement>, 'id' | 'role'> & AriaAttributes;
+declare const DatagridBody: ({ role, ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
 export default DatagridBody;
 export type { Props as DatagridBodyProps };

package/dist/core/Datagrid/DatagridCell.d.ts

@@ -1,6 +1,11 @@
-import { PropsWithChildren } from 'react';
+import { AriaAttributes, HTMLAttributes, PropsWithChildren } from 'react';
 import { GridUnitProps } from '../Grid';
-type Props = {} & Pick<GridUnitProps, 'size' | 'sx'>;
-declare const DatagridCell: ({ children, ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
+type Props = {
+    /**
+     * 셀을 열 헤더(`columnheader`)로 표시합니다. 기본값(`false`)은 데이터 셀(`cell`)입니다.
+     */
+    columnHeader?: boolean;
+} & Pick<GridUnitProps, 'size' | 'sx'> & Pick<HTMLAttributes<HTMLDivElement>, 'id' | 'role' | 'tabIndex'> & AriaAttributes;
+declare const DatagridCell: ({ children, columnHeader, role, ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
 export default DatagridCell;
 export type { Props as DatagridCellProps };

package/dist/core/Datagrid/DatagridHeader.d.ts

@@ -1,9 +1,9 @@
-import { ElementType, HTMLAttributes, ReactElement, ReactNode } from 'react';
+import { AriaAttributes, ElementType, HTMLAttributes, ReactElement, ReactNode } from 'react';
 import { SxProp } from '../../utils/styled-system';
 type Props = {
     leadingVisual?: ElementType | ReactNode;
     trailingAction?: ReactElement<HTMLAttributes<HTMLElement>>;
-} & SxProp;
+} & SxProp & Pick<HTMLAttributes<HTMLDivElement>, 'id'> & AriaAttributes;
 declare const DatagridHeader: ({ leadingVisual: LeadingVisual, trailingAction, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
 export default DatagridHeader;
 export type { Props as DatagridHeaderProps };

package/dist/core/Datagrid/DatagridRow.d.ts

@@ -1,7 +1,12 @@
-import { PropsWithChildren } from 'react';
+import { AriaAttributes, HTMLAttributes, PropsWithChildren } from 'react';
 import { GridProps } from '../Grid';
 import { SpaceProps } from '../Space';
-type Props = {} & Pick<GridProps, 'gapX' | 'alignItems' | 'justifyContent'> & Pick<SpaceProps, 'p' | 'px' | 'py' | 'pt' | 'pr' | 'pb' | 'pl' | 'padding' | 'paddingX' | 'paddingY' | 'paddingTop' | 'paddingRight' | 'paddingBottom' | 'paddingLeft' | 'sx'>;
-declare const DatagridRow: ({ gapX, alignItems, justifyContent, children, ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
+type Props = {
+    /**
+     * 행을 열 제목 행으로 표시합니다. `true`이면 하위 `Datagrid.Cell`들이 열 헤더(`columnheader`)로 처리됩니다.
+     */
+    columnHeader?: boolean;
+} & Pick<GridProps, 'gapX' | 'alignItems' | 'justifyContent'> & Pick<SpaceProps, 'p' | 'px' | 'py' | 'pt' | 'pr' | 'pb' | 'pl' | 'padding' | 'paddingX' | 'paddingY' | 'paddingTop' | 'paddingRight' | 'paddingBottom' | 'paddingLeft' | 'sx'> & Pick<HTMLAttributes<HTMLDivElement>, 'id' | 'role' | 'tabIndex'> & AriaAttributes;
+declare const DatagridRow: ({ gapX, alignItems, justifyContent, columnHeader, role, children, ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
 export default DatagridRow;
 export type { Props as DatagridRowProps };

package/dist/core/Datagrid/DatagridRowList.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import { ItemListProps } from '../ItemList';
+import { DatagridCellProps } from './DatagridCell';
+import { DatagridRowProps } from './DatagridRow';
+type Props<T extends {
+    id: string;
+}> = {
+    rows: readonly T[];
+    columns: readonly {
+        field: string;
+        size: DatagridCellProps['size'];
+        renderValue: (row: T, index: number) => ReactNode;
+    }[];
+    rowProps?: DatagridRowProps;
+    columnsTransformer?: (columns: Props<T>['columns']) => typeof columns;
+} & Pick<ItemListProps<T>, 'renderItemWrapper' | 'emptyState'>;
+declare const DatagridRowList: <T extends {
+    id: string;
+}>({ rows, columns, rowProps, renderItemWrapper, emptyState, columnsTransformer, }: Props<T>) => import("react/jsx-runtime").JSX.Element;
+export default DatagridRowList;
+export type { Props as DatagridRowListProps };

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

@@ -4,13 +4,17 @@ import { DatagridBodyProps } from './DatagridBody';
 import { DatagridCellProps } from './DatagridCell';
 import { DatagridHeaderProps } from './DatagridHeader';
 import { DatagridRowProps } from './DatagridRow';
+import { DatagridRowListProps } from './DatagridRowList';
 type Props = {} & HTMLAttributes<HTMLDivElement> & SxProp;
-declare const _default: (({ children, sx, ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element) & {
+declare const _default: (({ children, sx, role, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element) & {
     Header: ({ leadingVisual: LeadingVisual, trailingAction, ...props }: DatagridHeaderProps) => import("react/jsx-runtime").JSX.Element;
     Subheader: ({ ...props }: PropsWithChildren<SxProp>) => import("react/jsx-runtime").JSX.Element;
-    Body: ({ ...props }: PropsWithChildren<SxProp>) => import("react/jsx-runtime").JSX.Element;
-    Row: ({ gapX, alignItems, justifyContent, children, ...props }: PropsWithChildren<DatagridRowProps>) => import("react/jsx-runtime").JSX.Element;
-    Cell: ({ children, ...props }: PropsWithChildren<Pick<import("../Grid").GridUnitProps, "size" | "sx">>) => import("react/jsx-runtime").JSX.Element;
+    Body: ({ role, ...props }: PropsWithChildren<DatagridBodyProps>) => import("react/jsx-runtime").JSX.Element;
+    Row: ({ gapX, alignItems, justifyContent, columnHeader, role, children, ...props }: PropsWithChildren<DatagridRowProps>) => import("react/jsx-runtime").JSX.Element;
+    RowList: <T extends {
+        id: string;
+    }>({ rows, columns, rowProps, renderItemWrapper, emptyState, columnsTransformer, }: DatagridRowListProps<T>) => import("react/jsx-runtime").JSX.Element;
+    Cell: ({ children, columnHeader, role, ...props }: PropsWithChildren<DatagridCellProps>) => import("react/jsx-runtime").JSX.Element;
 };
 export default _default;
-export type { Props as DatagridProps, DatagridBodyProps, DatagridCellProps, DatagridHeaderProps, DatagridRowProps };
+export type { Props as DatagridProps, DatagridBodyProps, DatagridCellProps, DatagridHeaderProps, DatagridRowProps, DatagridRowListProps, };

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

@@ -1,5 +1,5 @@
 import { SpaceKey } from '@teamturing/token-studio';
-import { HTMLAttributes, PropsWithChildren } from 'react';
+import { AriaAttributes, HTMLAttributes, PropsWithChildren } from 'react';
 import { ResponsiveValue } from 'styled-system';
 import { AsProp } from '../../utils/styled-system';
 import { ViewProps } from '../View';
@@ -11,11 +11,11 @@ type Props = {
      * 화면의 레이아웃을 위해 사용하는 경우 document size를 넘어가는 경우를 방지하기 위해 사용합니다.
      */
     layout?: boolean;
-} & Pick<ViewProps, 'alignItems' | 'justifyContent' | 'sx'> & Pick<HTMLAttributes<HTMLDivElement>, 'className'> & AsProp;
+} & Pick<ViewProps, 'alignItems' | 'justifyContent' | 'sx'> & Pick<HTMLAttributes<HTMLDivElement>, 'className' | 'id' | 'role' | 'tabIndex'> & AriaAttributes & AsProp;
 type UnitSizeType = 'min' | 'max' | number;
 type GridUnitProps = {
     size: ResponsiveValue<UnitSizeType>;
-} & Pick<ViewProps, 'order' | 'sx'> & Pick<HTMLAttributes<HTMLDivElement>, 'className'> & AsProp;
+} & Pick<ViewProps, 'order' | 'sx'> & Pick<HTMLAttributes<HTMLDivElement>, 'className' | 'id' | 'role' | 'tabIndex'> & AriaAttributes & AsProp;
 declare const _default: import("react").ForwardRefExoticComponent<{
     gapX?: ResponsiveValue<0 | 1 | 20 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 10 | 12 | 14 | 16 | 18 | "-80" | "-50" | "-48" | "-40" | "-32" | "-30" | "-28" | "-24" | "-20" | "-18" | "-16" | "-14" | "-12" | "-10" | "-8" | "-7" | "-6" | "-5" | "-4" | "-3" | "-2" | "-1" | "-0.5" | "-0.25" | 0.25 | 0.5 | 24 | 28 | 30 | 32 | 40 | 48 | 50 | 80> | undefined;
     gapY?: ResponsiveValue<0 | 1 | 20 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 10 | 12 | 14 | 16 | 18 | "-80" | "-50" | "-48" | "-40" | "-32" | "-30" | "-28" | "-24" | "-20" | "-18" | "-16" | "-14" | "-12" | "-10" | "-8" | "-7" | "-6" | "-5" | "-4" | "-3" | "-2" | "-1" | "-0.5" | "-0.25" | 0.25 | 0.5 | 24 | 28 | 30 | 32 | 40 | 48 | 50 | 80> | undefined;
@@ -24,7 +24,7 @@ declare const _default: import("react").ForwardRefExoticComponent<{
      * 화면의 레이아웃을 위해 사용하는 경우 document size를 넘어가는 경우를 방지하기 위해 사용합니다.
      */
     layout?: boolean | undefined;
-} & Pick<ViewProps, "alignItems" | "justifyContent" | "sx"> & Pick<HTMLAttributes<HTMLDivElement>, "className"> & AsProp & {
+} & Pick<ViewProps, "alignItems" | "justifyContent" | "sx"> & Pick<HTMLAttributes<HTMLDivElement>, "className" | "id" | "tabIndex" | "role"> & AriaAttributes & AsProp & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLDivElement>> & {
     Unit: ({ size, as, children, ...props }: PropsWithChildren<GridUnitProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/index.d.ts

@@ -32,7 +32,7 @@ export type { ClickAreaProps } from './core/ClickArea';
 export { default as CounterBadge } from './core/CounterBadge';
 export type { CounterBadgeProps } from './core/CounterBadge';
 export { default as Datagrid } from './core/Datagrid';
-export type { DatagridProps, DatagridBodyProps, DatagridCellProps, DatagridHeaderProps, DatagridRowProps, } from './core/Datagrid';
+export type { DatagridProps, DatagridBodyProps, DatagridCellProps, DatagridHeaderProps, DatagridRowProps, DatagridRowListProps, } from './core/Datagrid';
 export { default as DescriptionList } from './core/DescriptionList';
 export type { DescriptionListProps } from './core/DescriptionList';
 export { default as Dialog } from './core/Dialog';

package/dist/index.js

@@ -5103,8 +5103,10 @@ const BaseCounterBadge = /*#__PURE__*/styled__default.default.span.withConfig({
 }), sx);
 
 const DatagridBody = ({
+  role,
   ...props
 }) => /*#__PURE__*/jsxRuntime.jsx(BaseDatagridBody, {
+  role: role ?? 'rowgroup',
   ...props
 });
 const BaseDatagridBody = /*#__PURE__*/styled__default.default.div.withConfig({
@@ -5116,8 +5118,11 @@ const BaseDatagridBody = /*#__PURE__*/styled__default.default.div.withConfig({
 
 const DatagridCell = ({
   children,
+  columnHeader = false,
+  role,
   ...props
 }) => /*#__PURE__*/jsxRuntime.jsx(BaseDatagridCell, {
+  role: role ?? (columnHeader ? 'columnheader' : 'cell'),
   ...props,
   children: children
 });
@@ -5154,21 +5159,69 @@ const DatagridRow = ({
   gapX = 2,
   alignItems,
   justifyContent,
+  columnHeader = false,
+  role,
   children,
   ...props
-}) => /*#__PURE__*/jsxRuntime.jsx(DatagridRowWrapper, {
+}) =>
+/*#__PURE__*/
+// 외부 wrapper가 `rowgroup`의 직접 자식이 되도록 여기에 role="row"를 부여하고,
+// 셀을 직접 감싸는 내부 Grid는 presentation 처리하여 row가 cell을 직접 소유하도록 한다.
+jsxRuntime.jsx(DatagridRowWrapper, {
+  role: role ?? 'row',
   ...props,
   children: /*#__PURE__*/jsxRuntime.jsx(BaseDatagridRow, {
+    role: 'presentation',
     wrap: false,
     gapX: gapX,
     alignItems: alignItems,
     justifyContent: justifyContent,
-    children: children
+    children: columnHeader ? React.Children.map(children, child => /*#__PURE__*/React.isValidElement(child) ? /*#__PURE__*/React.cloneElement(child, {
+      columnHeader: child.props.columnHeader ?? true
+    }) : child) : children
   })
 });
 const BaseDatagridRow = Grid$1;
 const DatagridRowWrapper = Space;
 
+const ItemList = ({
+  items,
+  renderItem,
+  renderItemWrapper = children => children,
+  emptyState = null
+}) => {
+  if (items.length === 0) return emptyState;
+  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: items.map((item, i) => renderItemWrapper(renderItem(item, i), item, i))
+  });
+};
+
+const DatagridRowList = ({
+  rows,
+  columns,
+  rowProps = {
+    alignItems: 'center'
+  },
+  renderItemWrapper,
+  emptyState,
+  columnsTransformer = columns => columns
+}) => /*#__PURE__*/jsxRuntime.jsx(ItemList, {
+  items: rows,
+  renderItem: (row, i) => /*#__PURE__*/jsxRuntime.jsx(DatagridRow, {
+    ...rowProps,
+    children: columnsTransformer(columns).filter(column => !utils.isNullable(column)).map(({
+      field,
+      renderValue,
+      size
+    }) => /*#__PURE__*/jsxRuntime.jsx(DatagridCell, {
+      size: size,
+      children: renderValue(row, i)
+    }, field))
+  }, row.id),
+  renderItemWrapper: renderItemWrapper,
+  emptyState: emptyState
+});
+
 const DatagridSubheader = ({
   ...props
 }) => /*#__PURE__*/jsxRuntime.jsx(DataGridSubheaderWrapper, {
@@ -5188,6 +5241,9 @@ const DataGridSubheaderWrapper = /*#__PURE__*/styled__default.default.div.withCo
 const Datagrid = ({
   children,
   sx,
+  role = 'table',
+  'aria-label': ariaLabel,
+  'aria-labelledby': ariaLabelledby,
   ...props
 }) => {
   const [relocatableComponentsObject, restConmponents] = useRelocation({
@@ -5197,9 +5253,28 @@ const Datagrid = ({
       subHeader: DatagridSubheader
     }
   });
+
+  // Header가 있고 별도 라벨이 지정되지 않은 경우, Header를 표의 접근 가능한 이름으로 연결한다.
+  const generatedHeaderId = React.useId();
+  const {
+    header: rawHeader,
+    subHeader
+  } = relocatableComponentsObject;
+  let headerNode = rawHeader;
+  let resolvedLabelledby = ariaLabelledby;
+  if (!ariaLabel && !ariaLabelledby && /*#__PURE__*/React.isValidElement(rawHeader)) {
+    const headerId = rawHeader.props.id ?? generatedHeaderId;
+    headerNode = /*#__PURE__*/React.cloneElement(rawHeader, {
+      id: headerId
+    });
+    resolvedLabelledby = headerId;
+  }
   return /*#__PURE__*/jsxRuntime.jsxs(DatagridWrapper, {
     sx: sx,
-    children: [relocatableComponentsObject.header, relocatableComponentsObject.subHeader, /*#__PURE__*/jsxRuntime.jsx(BaseDatagrid, {
+    children: [headerNode, subHeader, /*#__PURE__*/jsxRuntime.jsx(BaseDatagrid, {
+      role: role,
+      "aria-label": ariaLabel,
+      "aria-labelledby": resolvedLabelledby,
       ...props,
       children: restConmponents
     })]
@@ -5222,21 +5297,10 @@ var index$9 = Object.assign(Datagrid, {
   Subheader: DatagridSubheader,
   Body: DatagridBody,
   Row: DatagridRow,
+  RowList: DatagridRowList,
   Cell: DatagridCell
 });
 
-const ItemList = ({
-  items,
-  renderItem,
-  renderItemWrapper = children => children,
-  emptyState = null
-}) => {
-  if (items.length === 0) return emptyState;
-  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
-    children: items.map((item, i) => renderItemWrapper(renderItem(item, i), item, i))
-  });
-};
-
 const DescriptionList = ({
   item,
   itemDescriptions,

package/esm/core/Datagrid/DatagridBody.js

@@ -4,8 +4,10 @@ import { sx } from '../../utils/styled-system/index.js';
 import { jsx } from 'react/jsx-runtime';
 
 const DatagridBody = ({
+  role,
   ...props
 }) => /*#__PURE__*/jsx(BaseDatagridBody, {
+  role: role ?? 'rowgroup',
   ...props
 });
 const BaseDatagridBody = /*#__PURE__*/styled.div.withConfig({

package/esm/core/Datagrid/DatagridCell.js

@@ -3,8 +3,11 @@ import { jsx } from 'react/jsx-runtime';
 
 const DatagridCell = ({
   children,
+  columnHeader = false,
+  role,
   ...props
 }) => /*#__PURE__*/jsx(BaseDatagridCell, {
+  role: role ?? (columnHeader ? 'columnheader' : 'cell'),
   ...props,
   children: children
 });

package/esm/core/Datagrid/DatagridRow.js

@@ -1,3 +1,4 @@
+import { Children, isValidElement, cloneElement } from 'react';
 import Grid from '../Grid/index.js';
 import Space from '../Space/index.js';
 import { jsx } from 'react/jsx-runtime';
@@ -6,16 +7,26 @@ const DatagridRow = ({
   gapX = 2,
   alignItems,
   justifyContent,
+  columnHeader = false,
+  role,
   children,
   ...props
-}) => /*#__PURE__*/jsx(DatagridRowWrapper, {
+}) =>
+/*#__PURE__*/
+// 외부 wrapper가 `rowgroup`의 직접 자식이 되도록 여기에 role="row"를 부여하고,
+// 셀을 직접 감싸는 내부 Grid는 presentation 처리하여 row가 cell을 직접 소유하도록 한다.
+jsx(DatagridRowWrapper, {
+  role: role ?? 'row',
   ...props,
   children: /*#__PURE__*/jsx(BaseDatagridRow, {
+    role: 'presentation',
     wrap: false,
     gapX: gapX,
     alignItems: alignItems,
     justifyContent: justifyContent,
-    children: children
+    children: columnHeader ? Children.map(children, child => /*#__PURE__*/isValidElement(child) ? /*#__PURE__*/cloneElement(child, {
+      columnHeader: child.props.columnHeader ?? true
+    }) : child) : children
   })
 });
 const BaseDatagridRow = Grid;

package/esm/core/Datagrid/DatagridRowList.js

@@ -0,0 +1,33 @@
+import { isNullable } from '@teamturing/utils';
+import ItemList from '../ItemList/index.js';
+import DatagridCell from './DatagridCell.js';
+import DatagridRow from './DatagridRow.js';
+import { jsx } from 'react/jsx-runtime';
+
+const DatagridRowList = ({
+  rows,
+  columns,
+  rowProps = {
+    alignItems: 'center'
+  },
+  renderItemWrapper,
+  emptyState,
+  columnsTransformer = columns => columns
+}) => /*#__PURE__*/jsx(ItemList, {
+  items: rows,
+  renderItem: (row, i) => /*#__PURE__*/jsx(DatagridRow, {
+    ...rowProps,
+    children: columnsTransformer(columns).filter(column => !isNullable(column)).map(({
+      field,
+      renderValue,
+      size
+    }) => /*#__PURE__*/jsx(DatagridCell, {
+      size: size,
+      children: renderValue(row, i)
+    }, field))
+  }, row.id),
+  renderItemWrapper: renderItemWrapper,
+  emptyState: emptyState
+});
+
+export { DatagridRowList as default };

package/esm/core/Datagrid/index.js

@@ -1,4 +1,5 @@
 import { forcePixelValue } from '@teamturing/utils';
+import { useId, isValidElement, cloneElement } from 'react';
 import styled from 'styled-components';
 import useRelocation from '../../hook/useRelocation.js';
 import { sx } from '../../utils/styled-system/index.js';
@@ -6,12 +7,16 @@ import DatagridBody from './DatagridBody.js';
 import DatagridCell from './DatagridCell.js';
 import DatagridHeader from './DatagridHeader.js';
 import DatagridRow from './DatagridRow.js';
+import DatagridRowList from './DatagridRowList.js';
 import DatagridSubheader from './DatagridSubheader.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 const Datagrid = ({
   children,
   sx,
+  role = 'table',
+  'aria-label': ariaLabel,
+  'aria-labelledby': ariaLabelledby,
   ...props
 }) => {
   const [relocatableComponentsObject, restConmponents] = useRelocation({
@@ -21,9 +26,28 @@ const Datagrid = ({
       subHeader: DatagridSubheader
     }
   });
+
+  // Header가 있고 별도 라벨이 지정되지 않은 경우, Header를 표의 접근 가능한 이름으로 연결한다.
+  const generatedHeaderId = useId();
+  const {
+    header: rawHeader,
+    subHeader
+  } = relocatableComponentsObject;
+  let headerNode = rawHeader;
+  let resolvedLabelledby = ariaLabelledby;
+  if (!ariaLabel && !ariaLabelledby && /*#__PURE__*/isValidElement(rawHeader)) {
+    const headerId = rawHeader.props.id ?? generatedHeaderId;
+    headerNode = /*#__PURE__*/cloneElement(rawHeader, {
+      id: headerId
+    });
+    resolvedLabelledby = headerId;
+  }
   return /*#__PURE__*/jsxs(DatagridWrapper, {
     sx: sx,
-    children: [relocatableComponentsObject.header, relocatableComponentsObject.subHeader, /*#__PURE__*/jsx(BaseDatagrid, {
+    children: [headerNode, subHeader, /*#__PURE__*/jsx(BaseDatagrid, {
+      role: role,
+      "aria-label": ariaLabel,
+      "aria-labelledby": resolvedLabelledby,
       ...props,
       children: restConmponents
     })]
@@ -46,6 +70,7 @@ var index = Object.assign(Datagrid, {
   Subheader: DatagridSubheader,
   Body: DatagridBody,
   Row: DatagridRow,
+  RowList: DatagridRowList,
   Cell: DatagridCell
 });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamturing/react-kit",
-  "version": "2.74.0",
+  "version": "2.75.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",
@@ -65,5 +65,5 @@
     "react-textarea-autosize": "^8.5.3",
     "styled-system": "^5.1.5"
   },
-  "gitHead": "b096bdb9ffa2f75b160b773e60a1a2130989ff3c"
+  "gitHead": "dfe41b5bceb6209a01bc7fe08d2cb52ac8447a4e"
 }