@punkbit/cui 0.0.251-rc.16 → 0.2.0

package/dist/cjs/components/Grid/Header.cjs

@@ -0,0 +1,106 @@
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('react/jsx-runtime');
+const styledComponents = require('styled-components');
+const StyledCell = require('./StyledCell.cjs');
+const ColumnResizer = require('./ColumnResizer.cjs');
+
+const HeaderContainer = styledComponents.styled.div.withConfig({
+  componentId: "sc-1439i96-0"
+})(["position:sticky;top:0;left:0;display:flex;flex-direction:row;height:", "px;", ""], ({
+  $height
+}) => $height, ({
+  $scrolledVertical,
+  theme
+}) => $scrolledVertical ? `box-shadow: 0px 0 0px 1px ${theme.click.grid.header.cell.color.stroke.default};` : "");
+const ScrollableHeaderContainer = styledComponents.styled.div.withConfig({
+  componentId: "sc-1439i96-1"
+})(["position:relative;left:", "px;"], ({
+  $left
+}) => $left);
+const HeaderCellContainer = styledComponents.styled.div.withConfig({
+  componentId: "sc-1439i96-2"
+})(["position:absolute;display:flex;width:", ";height:", "px;left:", "px;&:hover [data-resize]{background:", ";}"], ({
+  $width
+}) => typeof $width === "string" ? $width : `${$width}px`, ({
+  $height
+}) => $height, ({
+  $columnPosition
+}) => $columnPosition, ({
+  theme
+}) => theme.click.grid.header.cell.color.stroke.selectDirect);
+const RowColumnContainer = styledComponents.styled(HeaderCellContainer).withConfig({
+  componentId: "sc-1439i96-3"
+})(["position:sticky;top:0;left:0;width:", ";text-align:right;", ""], ({
+  $width
+}) => typeof $width === "string" ? $width : `${$width}px`, ({
+  $scrolledHorizontal,
+  theme
+}) => $scrolledHorizontal ? `box-shadow: 0px 0 0px 1px ${theme.click.grid.header.cell.color.stroke.default};` : "");
+const RowColumn = styledComponents.styled(StyledCell.StyledCell).withConfig({
+  componentId: "sc-1439i96-4"
+})(["width:100%;text-align:right;overflow:hidden;"]);
+const Column = ({
+  columnIndex,
+  cell,
+  getColumnWidth,
+  getColumnHorizontalPosition,
+  getSelectionType,
+  isFirstColumn,
+  isLastColumn,
+  onColumnResize,
+  height,
+  getResizerPosition,
+  showBorder,
+  resizingState
+}) => {
+  const selectionType = getSelectionType({
+    column: columnIndex,
+    type: "column"
+  });
+  const leftSelectionType = getSelectionType({
+    column: columnIndex - 1,
+    type: "column"
+  });
+  const columnPosition = getColumnHorizontalPosition(columnIndex);
+  const isSelected = selectionType === "selectDirect";
+  const isSelectedLeft = (leftSelectionType === "selectDirect" || isSelected) && leftSelectionType !== selectionType;
+  const columnWidth = getColumnWidth(columnIndex);
+  return /* @__PURE__ */ jsxRuntime.jsxs(HeaderCellContainer, { $width: columnWidth, $columnPosition: columnPosition, $height: height, "data-header": columnIndex, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(StyledCell.StyledCell, { $type: "header", as: cell, columnIndex, type: "header-cell", $isFirstColumn: isFirstColumn, $selectionType: selectionType, $isLastColumn: isLastColumn, $isFocused: false, $isSelectedLeft: isSelectedLeft, $isSelectedTop: isSelected, $isLastRow: false, $isFirstRow: true, $height: height, "data-grid-row": -1, "data-grid-column": columnIndex, "data-selected": isSelected, $showBorder: showBorder, width: columnWidth }),
+    /* @__PURE__ */ jsxRuntime.jsx(ColumnResizer.default, { height, onColumnResize, columnIndex, getResizerPosition, columnWidth, resizingState })
+  ] });
+};
+const Header = ({
+  scrolledVertical,
+  scrolledHorizontal,
+  showRowNumber,
+  rowNumberWidth,
+  minColumn,
+  maxColumn,
+  height,
+  getColumnWidth,
+  cell,
+  columnCount,
+  getSelectionType,
+  onColumnResize,
+  getColumnHorizontalPosition,
+  getResizerPosition,
+  showBorder,
+  resizingState
+}) => {
+  const selectedAllType = getSelectionType({
+    type: "all"
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(HeaderContainer, { $height: height, $scrolledVertical: scrolledVertical, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ScrollableHeaderContainer, { $left: rowNumberWidth, children: Array.from({
+      length: maxColumn - minColumn + 1
+    }, (_, index) => minColumn + index).map((columnIndex) => /* @__PURE__ */ jsxRuntime.jsx(Column, { getSelectionType, columnIndex, getColumnWidth, getColumnHorizontalPosition, cell, isFirstColumn: columnIndex === 0 && !showRowNumber, isLastColumn: columnIndex + 1 === columnCount, onColumnResize, height, getResizerPosition, showBorder, resizingState }, `header-${columnIndex}`)) }),
+    showRowNumber && /* @__PURE__ */ jsxRuntime.jsx(RowColumnContainer, { $width: rowNumberWidth, $height: height, $columnPosition: 0, $scrolledHorizontal: scrolledHorizontal, children: /* @__PURE__ */ jsxRuntime.jsx(RowColumn, { "data-selected": selectedAllType === "selectDirect", $type: "header", $isFirstRow: true, $isFirstColumn: true, $selectionType: selectedAllType, $isLastRow: false, $isLastColumn: false, $height: height, $isFocused: false, $isSelectedLeft: false, $isSelectedTop: false, "data-grid-row": -1, "data-grid-column": -1, $showBorder: showBorder, children: "#" }) })
+  ] });
+};
+
+exports.default = Header;
+//# sourceMappingURL=Header.cjs.map

package/dist/cjs/components/Grid/Header.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.cjs","sources":["../../../../src/components/Grid/Header.tsx"],"sourcesContent":["import { styled } from 'styled-components';\nimport {\n  CellProps,\n  ColumnResizeFn,\n  GetResizerPositionFn,\n  SelectionTypeFn,\n} from './types';\nimport { StyledCell } from './StyledCell';\nimport ColumnResizer from './ColumnResizer';\nimport { ResizingState } from './useResizingState';\n\ninterface HeaderProps {\n  showRowNumber: boolean;\n  rowNumberWidth: number;\n  minColumn: number;\n  maxColumn: number;\n  height: number;\n  getColumnWidth: (index: number) => number;\n  cell: CellProps;\n  getSelectionType: SelectionTypeFn;\n  columnCount: number;\n  onColumnResize: ColumnResizeFn;\n  getColumnHorizontalPosition: (columnIndex: number) => number;\n  scrolledVertical: boolean;\n  getResizerPosition: GetResizerPositionFn;\n  showBorder: boolean;\n  scrolledHorizontal: boolean;\n  resizingState: ResizingState;\n}\n\nconst HeaderContainer = styled.div<{ $height: number; $scrolledVertical: boolean }>`\n  position: sticky;\n  top: 0;\n  left: 0;\n  display: flex;\n  flex-direction: row;\n  height: ${({ $height }) => $height}px;\n  ${({ $scrolledVertical, theme }) =>\n    $scrolledVertical\n      ? `box-shadow: 0px 0 0px 1px ${theme.click.grid.header.cell.color.stroke.default};`\n      : ''}\n`;\n\nconst ScrollableHeaderContainer = styled.div<{\n  $left: number;\n}>`\n  position: relative;\n  left: ${({ $left }) => $left}px;\n`;\n\ninterface ColumnProps extends Pick<\n  HeaderProps,\n  | 'cell'\n  | 'getSelectionType'\n  | 'onColumnResize'\n  | 'getColumnWidth'\n  | 'height'\n  | 'getResizerPosition'\n  | 'showBorder'\n  | 'getColumnHorizontalPosition'\n  | 'resizingState'\n> {\n  columnIndex: number;\n  isFirstColumn: boolean;\n  isLastColumn: boolean;\n}\n\nconst HeaderCellContainer = styled.div<{\n  $width: string | number;\n  $height: number;\n  $columnPosition: number;\n}>`\n  position: absolute;\n  display: flex;\n  width: ${({ $width }) => (typeof $width === 'string' ? $width : `${$width}px`)};\n  height: ${({ $height }) => $height}px;\n  left: ${({ $columnPosition }) => $columnPosition}px;\n  &:hover [data-resize] {\n    background: ${({ theme }) => theme.click.grid.header.cell.color.stroke.selectDirect};\n  }\n`;\n\nconst RowColumnContainer = styled(HeaderCellContainer)<{\n  $width: string | number;\n  $scrolledHorizontal: boolean;\n}>`\n  position: sticky;\n  top: 0;\n  left: 0;\n  width: ${({ $width }) => (typeof $width === 'string' ? $width : `${$width}px`)};\n  text-align: right;\n  ${({ $scrolledHorizontal, theme }) =>\n    $scrolledHorizontal\n      ? `box-shadow: 0px 0 0px 1px ${theme.click.grid.header.cell.color.stroke.default};`\n      : ''}\n`;\n\nconst RowColumn = styled(StyledCell)`\n  width: 100%;\n  text-align: right;\n  overflow: hidden;\n`;\n\nconst Column = ({\n  columnIndex,\n  cell,\n  getColumnWidth,\n  getColumnHorizontalPosition,\n  getSelectionType,\n  isFirstColumn,\n  isLastColumn,\n  onColumnResize,\n  height,\n  getResizerPosition,\n  showBorder,\n  resizingState,\n}: ColumnProps) => {\n  const selectionType = getSelectionType({\n    column: columnIndex,\n    type: 'column',\n  });\n  const leftSelectionType = getSelectionType({\n    column: columnIndex - 1,\n    type: 'column',\n  });\n  const columnPosition = getColumnHorizontalPosition(columnIndex);\n\n  const isSelected = selectionType === 'selectDirect';\n  const isSelectedLeft =\n    (leftSelectionType === 'selectDirect' || isSelected) &&\n    leftSelectionType !== selectionType;\n\n  const columnWidth = getColumnWidth(columnIndex);\n  return (\n    <HeaderCellContainer\n      $width={columnWidth}\n      $columnPosition={columnPosition}\n      $height={height}\n      data-header={columnIndex}\n    >\n      <StyledCell\n        $type=\"header\"\n        as={cell}\n        columnIndex={columnIndex}\n        type=\"header-cell\"\n        $isFirstColumn={isFirstColumn}\n        $selectionType={selectionType}\n        $isLastColumn={isLastColumn}\n        $isFocused={false}\n        $isSelectedLeft={isSelectedLeft}\n        $isSelectedTop={isSelected}\n        $isLastRow={false}\n        $isFirstRow\n        $height={height}\n        data-grid-row={-1}\n        data-grid-column={columnIndex}\n        data-selected={isSelected}\n        $showBorder={showBorder}\n        width={columnWidth}\n      />\n      <ColumnResizer\n        height={height}\n        onColumnResize={onColumnResize}\n        columnIndex={columnIndex}\n        getResizerPosition={getResizerPosition}\n        columnWidth={columnWidth}\n        resizingState={resizingState}\n      />\n    </HeaderCellContainer>\n  );\n};\n\nconst Header = ({\n  scrolledVertical,\n  scrolledHorizontal,\n  showRowNumber,\n  rowNumberWidth,\n  minColumn,\n  maxColumn,\n  height,\n  getColumnWidth,\n  cell,\n  columnCount,\n  getSelectionType,\n  onColumnResize,\n  getColumnHorizontalPosition,\n  getResizerPosition,\n  showBorder,\n  resizingState,\n}: HeaderProps) => {\n  const selectedAllType = getSelectionType({\n    type: 'all',\n  });\n  return (\n    <HeaderContainer\n      $height={height}\n      $scrolledVertical={scrolledVertical}\n    >\n      <ScrollableHeaderContainer $left={rowNumberWidth}>\n        {Array.from(\n          { length: maxColumn - minColumn + 1 },\n          (_, index) => minColumn + index\n        ).map(columnIndex => (\n          <Column\n            key={`header-${columnIndex}`}\n            getSelectionType={getSelectionType}\n            columnIndex={columnIndex}\n            getColumnWidth={getColumnWidth}\n            getColumnHorizontalPosition={getColumnHorizontalPosition}\n            cell={cell}\n            isFirstColumn={columnIndex === 0 && !showRowNumber}\n            isLastColumn={columnIndex + 1 === columnCount}\n            onColumnResize={onColumnResize}\n            height={height}\n            getResizerPosition={getResizerPosition}\n            showBorder={showBorder}\n            resizingState={resizingState}\n          />\n        ))}\n      </ScrollableHeaderContainer>\n      {showRowNumber && (\n        <RowColumnContainer\n          $width={rowNumberWidth}\n          $height={height}\n          $columnPosition={0}\n          $scrolledHorizontal={scrolledHorizontal}\n        >\n          <RowColumn\n            data-selected={selectedAllType === 'selectDirect'}\n            $type=\"header\"\n            $isFirstRow\n            $isFirstColumn\n            $selectionType={selectedAllType}\n            $isLastRow={false}\n            $isLastColumn={false}\n            $height={height}\n            $isFocused={false}\n            $isSelectedLeft={false}\n            $isSelectedTop={false}\n            data-grid-row={-1}\n            data-grid-column={-1}\n            $showBorder={showBorder}\n          >\n            #\n          </RowColumn>\n        </RowColumnContainer>\n      )}\n    </HeaderContainer>\n  );\n};\n\nexport default Header;\n"],"names":["HeaderContainer","styled","div","withConfig","componentId","$height","$scrolledVertical","theme","click","grid","header","cell","color","stroke","default","ScrollableHeaderContainer","$left","HeaderCellContainer","$width","$columnPosition","selectDirect","RowColumnContainer","$scrolledHorizontal","RowColumn","StyledCell","Column","columnIndex","getColumnWidth","getColumnHorizontalPosition","getSelectionType","isFirstColumn","isLastColumn","onColumnResize","height","getResizerPosition","showBorder","resizingState","selectionType","column","type","leftSelectionType","columnPosition","isSelected","isSelectedLeft","columnWidth","jsxs","jsx","ColumnResizer","Header","scrolledVertical","scrolledHorizontal","showRowNumber","rowNumberWidth","minColumn","maxColumn","columnCount","selectedAllType","Array","from","length","_","index","map"],"mappings":"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"}

package/dist/cjs/components/Grid/RowNumberColumn.cjs

@@ -0,0 +1,75 @@
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('react/jsx-runtime');
+const styledComponents = require('styled-components');
+const StyledCell = require('./StyledCell.cjs');
+
+const RowNumberColumnContainer = styledComponents.styled.div.withConfig({
+  componentId: "sc-68jz95-0"
+})(["position:sticky;left:0;", " ", ""], ({
+  $height,
+  $width
+}) => `
+    top: ${$height}px;
+    width: ${$width}px;
+    height: 100%;
+  `, ({
+  $scrolledHorizontal,
+  theme
+}) => $scrolledHorizontal ? `box-shadow: 0px 0 0px 1px ${theme.click.grid.header.cell.color.stroke.default};` : "");
+const RowNumberCell = styledComponents.styled.div.withConfig({
+  componentId: "sc-68jz95-1"
+})(["position:absolute;left:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;", ""], ({
+  $height,
+  $rowNumber,
+  $rowAutoHeight
+}) => `
+    top: ${$height * $rowNumber}px;
+    height: ${$rowAutoHeight ? "100%" : `${$height}px`};
+  `);
+const RowNumber = ({
+  rowIndex,
+  rowHeight,
+  getSelectionType,
+  isLastRow,
+  isFirstRow,
+  showBorder,
+  rowStart,
+  rowAutoHeight
+}) => {
+  const currentRowIndex = rowIndex + rowStart;
+  const selectionType = getSelectionType({
+    row: currentRowIndex,
+    type: "row"
+  });
+  const isSelected = selectionType === "selectDirect";
+  const topSelectionType = getSelectionType({
+    row: currentRowIndex - 1,
+    type: "row"
+  });
+  const isSelectedTop = (topSelectionType === "selectDirect" || isSelected) && topSelectionType !== selectionType;
+  return /* @__PURE__ */ jsxRuntime.jsx(RowNumberCell, { $rowNumber: rowIndex, $height: rowHeight, $rowAutoHeight: rowAutoHeight, children: /* @__PURE__ */ jsxRuntime.jsx(StyledCell.StyledCell, { $height: rowHeight, $isLastColumn: false, $selectionType: selectionType, $isFirstColumn: true, $type: "header", $isFirstRow: isFirstRow, $isFocused: false, $isLastRow: isLastRow, $isSelectedLeft: isSelected, $isSelectedTop: isSelectedTop, $rowAutoHeight: rowAutoHeight, "data-selected": isSelected, "data-grid-row": currentRowIndex, "data-grid-column": -1, "data-testid": `header-cell-${currentRowIndex}-x`, $showBorder: showBorder, "data-align": "right", children: currentRowIndex }) });
+};
+const RowNumberColumn = ({
+  minRow,
+  maxRow,
+  rowHeight,
+  headerHeight,
+  rowWidth,
+  getSelectionType,
+  rowCount,
+  showHeader,
+  scrolledHorizontal,
+  rowStart = 0,
+  showBorder,
+  rowAutoHeight
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(RowNumberColumnContainer, { $height: headerHeight, $width: rowWidth, $scrolledHorizontal: scrolledHorizontal, $rowAutoHeight: rowAutoHeight, children: Array.from({
+    length: maxRow - minRow + 1
+  }, (_, index) => minRow + index).map((rowIndex) => /* @__PURE__ */ jsxRuntime.jsx(RowNumber, { getSelectionType, rowHeight, rowIndex, isLastRow: rowIndex === rowCount, isFirstRow: !showHeader && rowIndex === 0, showBorder, rowStart, rowAutoHeight }, `row-number-${rowIndex}`)) });
+};
+
+exports.default = RowNumberColumn;
+//# sourceMappingURL=RowNumberColumn.cjs.map

package/dist/cjs/components/Grid/RowNumberColumn.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowNumberColumn.cjs","sources":["../../../../src/components/Grid/RowNumberColumn.tsx"],"sourcesContent":["import { styled } from 'styled-components';\nimport { SelectionTypeFn } from './types';\nimport { StyledCell } from './StyledCell';\nconst RowNumberColumnContainer = styled.div<{\n  $height: number;\n  $width: number;\n  $scrolledHorizontal: boolean;\n  $rowAutoHeight?: boolean;\n}>`\n  position: sticky;\n  left: 0;\n  ${({ $height, $width }) => `\n    top: ${$height}px;\n    width: ${$width}px;\n    height: 100%;\n  `}\n\n  ${({ $scrolledHorizontal, theme }) =>\n    $scrolledHorizontal\n      ? `box-shadow: 0px 0 0px 1px ${theme.click.grid.header.cell.color.stroke.default};`\n      : ''}\n`;\n\nconst RowNumberCell = styled.div<{\n  $height: number;\n  $rowNumber: number;\n  $rowAutoHeight?: boolean;\n}>`\n  position: absolute;\n  left: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  width: 100%;\n  ${({ $height, $rowNumber, $rowAutoHeight }) => `\n    top: ${$height * $rowNumber}px;\n    height: ${$rowAutoHeight ? '100%' : `${$height}px`};\n  `}\n`;\ninterface RowNumberColumnProps {\n  minRow: number;\n  maxRow: number;\n  rowHeight: number;\n  headerHeight: number;\n  rowWidth: number;\n  getSelectionType: SelectionTypeFn;\n  rowCount: number;\n  showHeader: boolean;\n  scrolledHorizontal: boolean;\n  rowStart: number;\n  showBorder: boolean;\n  rowAutoHeight?: boolean;\n}\ninterface RowNumberProps extends Pick<\n  RowNumberColumnProps,\n  'rowHeight' | 'getSelectionType' | 'showBorder' | 'rowStart'\n> {\n  rowIndex: number;\n  isLastRow: boolean;\n  isFirstRow: boolean;\n  rowAutoHeight?: boolean;\n}\nconst RowNumber = ({\n  rowIndex,\n  rowHeight,\n  getSelectionType,\n  isLastRow,\n  isFirstRow,\n  showBorder,\n  rowStart,\n  rowAutoHeight,\n}: RowNumberProps) => {\n  const currentRowIndex = rowIndex + rowStart;\n  const selectionType = getSelectionType({\n    row: currentRowIndex,\n    type: 'row',\n  });\n  const isSelected = selectionType === 'selectDirect';\n  const topSelectionType = getSelectionType({\n    row: currentRowIndex - 1,\n    type: 'row',\n  });\n  const isSelectedTop =\n    (topSelectionType === 'selectDirect' || isSelected) &&\n    topSelectionType !== selectionType;\n\n  return (\n    <RowNumberCell\n      $rowNumber={rowIndex}\n      $height={rowHeight}\n      $rowAutoHeight={rowAutoHeight}\n    >\n      <StyledCell\n        $height={rowHeight}\n        $isLastColumn={false}\n        $selectionType={selectionType}\n        $isFirstColumn\n        $type=\"header\"\n        $isFirstRow={isFirstRow}\n        $isFocused={false}\n        $isLastRow={isLastRow}\n        $isSelectedLeft={isSelected}\n        $isSelectedTop={isSelectedTop}\n        $rowAutoHeight={rowAutoHeight}\n        data-selected={isSelected}\n        data-grid-row={currentRowIndex}\n        data-grid-column={-1}\n        data-testid={`header-cell-${currentRowIndex}-x`}\n        $showBorder={showBorder}\n        data-align=\"right\"\n      >\n        {currentRowIndex}\n      </StyledCell>\n    </RowNumberCell>\n  );\n};\n\nconst RowNumberColumn = ({\n  minRow,\n  maxRow,\n  rowHeight,\n  headerHeight,\n  rowWidth,\n  getSelectionType,\n  rowCount,\n  showHeader,\n  scrolledHorizontal,\n  rowStart = 0,\n  showBorder,\n  rowAutoHeight,\n}: RowNumberColumnProps) => {\n  return (\n    <RowNumberColumnContainer\n      $height={headerHeight}\n      $width={rowWidth}\n      $scrolledHorizontal={scrolledHorizontal}\n      $rowAutoHeight={rowAutoHeight}\n    >\n      {Array.from({ length: maxRow - minRow + 1 }, (_, index) => minRow + index).map(\n        rowIndex => (\n          <RowNumber\n            key={`row-number-${rowIndex}`}\n            getSelectionType={getSelectionType}\n            rowHeight={rowHeight}\n            rowIndex={rowIndex}\n            isLastRow={rowIndex === rowCount}\n            isFirstRow={!showHeader && rowIndex === 0}\n            showBorder={showBorder}\n            rowStart={rowStart}\n            rowAutoHeight={rowAutoHeight}\n          />\n        )\n      )}\n    </RowNumberColumnContainer>\n  );\n};\n\nexport default RowNumberColumn;\n"],"names":["RowNumberColumnContainer","styled","div","withConfig","componentId","$height","$width","$scrolledHorizontal","theme","click","grid","header","cell","color","stroke","default","RowNumberCell","$rowNumber","$rowAutoHeight","RowNumber","rowIndex","rowHeight","getSelectionType","isLastRow","isFirstRow","showBorder","rowStart","rowAutoHeight","currentRowIndex","selectionType","row","type","isSelected","topSelectionType","isSelectedTop","jsx","StyledCell","RowNumberColumn","minRow","maxRow","headerHeight","rowWidth","rowCount","showHeader","scrolledHorizontal","Array","from","length","_","index","map"],"mappings":"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"}

package/dist/cjs/components/Grid/StyledCell.cjs

@@ -0,0 +1,70 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponents = require('styled-components');
+
+const StyledCell = styledComponents.styled.div.withConfig({
+  componentId: "sc-sgj5pj-0"
+})(["display:block;text-align:left;&[data-align='right']{text-align:right;}overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:default;width:100%;box-sizing:border-box;", " ", ";"], ({
+  theme,
+  $isFocused,
+  $isLastRow,
+  $isLastColumn,
+  $selectionType,
+  $height,
+  $type = "body",
+  $showBorder,
+  $rowAutoHeight
+}) => `
+    height: ${$rowAutoHeight ? "100%" : `${$height}px`};
+    min-height: ${$rowAutoHeight ? "auto" : ""};
+    overflow-y: ${$rowAutoHeight ? "auto" : ""};
+    background: ${theme.click.grid[$type].cell.color.background[$selectionType]};
+    color: ${$type === "header" ? theme.click.grid.header.cell.color.title[$selectionType] : theme.click.grid.body.cell.color.text[$selectionType]};
+    font: ${theme.click.grid.cell.text.default};
+    padding: ${theme.click.grid[$type].cell.space.y} ${theme.click.grid[$type].cell.space.x};
+    border: 1px solid ${theme.click.grid[$type].cell.color.stroke.default};
+    ${$type === "header" && !$showBorder ? `
+      &[data-grid-row="-1"] {
+        border-top: none;
+      }
+      &[data-grid-column="-1"] {
+        border-left: none;
+      }
+    ` : ""}
+    ${$isFocused ? `box-shadow: inset 0 0 0 1px ${theme.click.grid[$type].cell.color.stroke.selectDirect};` : ""}
+    ${$isLastRow ? `
+        border-bottom-color: ${theme.click.grid[$type].cell.color.stroke[$isFocused ? "selectDirect" : $selectionType]};
+    ` : "border-bottom: none;"}
+    ${$isLastColumn ? `
+        border-right-color: ${theme.click.grid[$type].cell.color.stroke[$isFocused ? "selectDirect" : $selectionType]};
+    ` : "border-right: none;"}
+    ${$rowAutoHeight && "border: none;"}
+  `, ({
+  theme,
+  $isLastRow,
+  $isLastColumn,
+  $selectionType,
+  $type = "body",
+  $isSelectedTop,
+  $isSelectedLeft,
+  $rowAutoHeight
+}) => $isSelectedTop || $isSelectedLeft || $selectionType === "selectDirect" && ($isLastRow || $isLastColumn) || $rowAutoHeight ? `
+          &::before {
+            content: "";
+            position: absolute;
+            top: 0;
+            bottom: 0;
+            right: 0;
+            left: 0;
+            ${$isSelectedTop ? `border-top: 1px solid ${theme.click.grid[$type].cell.color.stroke.selectDirect};` : ""}
+            ${$isSelectedLeft ? `border-left: 1px solid ${theme.click.grid[$type].cell.color.stroke.selectDirect};` : ""}
+            ${$selectionType === "selectDirect" && $isLastRow ? `border-bottom: 1px solid ${theme.click.grid[$type].cell.color.stroke.selectDirect};` : ""}
+            ${$selectionType === "selectDirect" && $isLastColumn ? `border-right: 1px solid ${theme.click.grid[$type].cell.color.stroke.selectDirect};` : ""}
+            ${$rowAutoHeight && "border: none;"}
+          }
+        ` : "");
+
+exports.StyledCell = StyledCell;
+//# sourceMappingURL=StyledCell.cjs.map

package/dist/cjs/components/Grid/StyledCell.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledCell.cjs","sources":["../../../../src/components/Grid/StyledCell.tsx"],"sourcesContent":["import { styled } from 'styled-components';\nimport { SelectionType } from './types';\n\nexport const StyledCell = styled.div<{\n  $isFocused: boolean;\n  $selectionType: SelectionType;\n  $isSelectedTop: boolean;\n  $isSelectedLeft: boolean;\n  $isLastRow: boolean;\n  $isLastColumn: boolean;\n  $isFirstRow: boolean;\n  $isFirstColumn: boolean;\n  $height: number;\n  $type?: 'body' | 'header';\n  $showBorder: boolean;\n  $rowAutoHeight?: boolean;\n}>`\n  display: block;\n  text-align: left;\n  &[data-align='right'] {\n    text-align: right;\n  }\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  cursor: default;\n  width: 100%;\n  box-sizing: border-box;\n  ${({\n    theme,\n    $isFocused,\n    $isLastRow,\n    $isLastColumn,\n    $selectionType,\n    $height,\n    $type = 'body',\n    $showBorder,\n    $rowAutoHeight,\n  }) => `\n    height: ${$rowAutoHeight ? '100%' : `${$height}px`};\n    min-height: ${$rowAutoHeight ? 'auto' : ''};\n    overflow-y: ${$rowAutoHeight ? 'auto' : ''};\n    background: ${theme.click.grid[$type].cell.color.background[$selectionType]};\n    color: ${\n      $type === 'header'\n        ? theme.click.grid.header.cell.color.title[$selectionType]\n        : theme.click.grid.body.cell.color.text[$selectionType]\n    };\n    font: ${theme.click.grid.cell.text.default};\n    padding: ${theme.click.grid[$type].cell.space.y} ${\n      theme.click.grid[$type].cell.space.x\n    };\n    border: 1px solid ${theme.click.grid[$type].cell.color.stroke.default};\n    ${\n      $type === 'header' && !$showBorder\n        ? `\n      &[data-grid-row=\"-1\"] {\n        border-top: none;\n      }\n      &[data-grid-column=\"-1\"] {\n        border-left: none;\n      }\n    `\n        : ''\n    }\n    ${\n      $isFocused\n        ? `box-shadow: inset 0 0 0 1px ${theme.click.grid[$type].cell.color.stroke.selectDirect};`\n        : ''\n    }\n    ${\n      $isLastRow\n        ? `\n        border-bottom-color: ${\n          theme.click.grid[$type].cell.color.stroke[\n            $isFocused ? 'selectDirect' : $selectionType\n          ]\n        };\n    `\n        : 'border-bottom: none;'\n    }\n    ${\n      $isLastColumn\n        ? `\n        border-right-color: ${\n          theme.click.grid[$type].cell.color.stroke[\n            $isFocused ? 'selectDirect' : $selectionType\n          ]\n        };\n    `\n        : 'border-right: none;'\n    }\n    ${$rowAutoHeight && 'border: none;'}\n  `}\n  ${({\n    theme,\n    $isLastRow,\n    $isLastColumn,\n    $selectionType,\n    $type = 'body',\n    $isSelectedTop,\n    $isSelectedLeft,\n    $rowAutoHeight,\n  }) =>\n    $isSelectedTop ||\n    $isSelectedLeft ||\n    ($selectionType === 'selectDirect' && ($isLastRow || $isLastColumn)) ||\n    $rowAutoHeight\n      ? `\n          &::before {\n            content: \"\";\n            position: absolute;\n            top: 0;\n            bottom: 0;\n            right: 0;\n            left: 0;\n            ${\n              $isSelectedTop\n                ? `border-top: 1px solid ${theme.click.grid[$type].cell.color.stroke.selectDirect};`\n                : ''\n            }\n            ${\n              $isSelectedLeft\n                ? `border-left: 1px solid ${theme.click.grid[$type].cell.color.stroke.selectDirect};`\n                : ''\n            }\n            ${\n              $selectionType === 'selectDirect' && $isLastRow\n                ? `border-bottom: 1px solid ${theme.click.grid[$type].cell.color.stroke.selectDirect};`\n                : ''\n            }\n            ${\n              $selectionType === 'selectDirect' && $isLastColumn\n                ? `border-right: 1px solid ${theme.click.grid[$type].cell.color.stroke.selectDirect};`\n                : ''\n            }\n            ${$rowAutoHeight && 'border: none;'}\n          }\n        `\n      : ''};\n`;\n"],"names":["StyledCell","styled","div","withConfig","componentId","theme","$isFocused","$isLastRow","$isLastColumn","$selectionType","$height","$type","$showBorder","$rowAutoHeight","click","grid","cell","color","background","header","title","body","text","default","space","y","x","stroke","selectDirect","$isSelectedTop","$isSelectedLeft"],"mappings":"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"}

package/dist/cjs/components/Grid/copyGridElements.cjs

@@ -0,0 +1,104 @@
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const react = require('react');
+const client = require('react-dom/client');
+const reactDom = require('react-dom');
+
+const addCellToRow = (row, cell, rowIndex, columnIndex) => {
+  const td = document.createElement("td");
+  const container = document.createElement("div");
+  const root = client.createRoot(container);
+  reactDom.flushSync(() => {
+    root.render(react.createElement(cell, {
+      rowIndex,
+      columnIndex,
+      width: 1e3,
+      type: "row-cell"
+    }));
+  });
+  td.innerHTML = container.innerHTML;
+  root.unmount();
+  row.appendChild(td);
+};
+const columnListLoop = (tbody, columnList, cell, rowIndex) => {
+  const row = document.createElement("tr");
+  columnList.forEach((columnIndex) => {
+    addCellToRow(row, cell, rowIndex, columnIndex);
+  });
+  tbody.appendChild(row);
+};
+const copyGridElements = async ({
+  cell,
+  selection,
+  rowCount,
+  columnCount,
+  pageStart = 0,
+  focus,
+  outerRef
+}) => {
+  if (!outerRef.current) {
+    throw "Could not fetch selection";
+  }
+  const table = document.createElement("table");
+  table.style.position = "absolute";
+  table.style.top = "-200px";
+  table.style.left = "-200px";
+  table.style.width = "0px";
+  table.style.height = "0px";
+  table.style.overflow = "hidden";
+  const thead = document.createElement("thead");
+  const tbody = document.createElement("tbody");
+  switch (selection.type) {
+    case "rectangle":
+      Array.from({
+        length: selection.bounds.bottom + 1 - selection.bounds.top
+      }, (_, index) => selection.bounds.top + index).forEach((rowIndex) => {
+        const columnList = Array.from({
+          length: selection.bounds.right + 1 - selection.bounds.left
+        }, (_, index) => selection.bounds.left + index);
+        columnListLoop(tbody, columnList, cell, rowIndex);
+      });
+      break;
+    case "columns":
+      Array.from({
+        length: rowCount
+      }, (_, index) => pageStart + index).forEach((rowIndex) => {
+        const columnList = [...selection.columns].sort();
+        columnListLoop(tbody, columnList, cell, rowIndex);
+      });
+      break;
+    case "rows":
+      [...selection.rows].sort().forEach((rowIndex) => {
+        const columnList = Array.from({
+          length: columnCount
+        }, (_, index) => pageStart + index);
+        columnListLoop(tbody, columnList, cell, rowIndex);
+      });
+      break;
+    case "empty":
+      columnListLoop(tbody, [focus.column], cell, focus.row);
+      break;
+    default:
+      throw new Error("incorrect selection provided");
+  }
+  table.appendChild(thead);
+  table.appendChild(tbody);
+  outerRef.current.appendChild(table);
+  const windowSelection = window.getSelection();
+  if (windowSelection) {
+    const range = document.createRange();
+    range.selectNodeContents(table);
+    windowSelection.removeAllRanges();
+    windowSelection.addRange(range);
+    await navigator.clipboard.writeText(table.innerText);
+    windowSelection.removeAllRanges();
+    outerRef.current.removeChild(table);
+  } else {
+    throw "Could not fetch selection";
+  }
+};
+
+exports.default = copyGridElements;
+//# sourceMappingURL=copyGridElements.cjs.map

package/dist/cjs/components/Grid/copyGridElements.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"copyGridElements.cjs","sources":["../../../../src/components/Grid/copyGridElements.ts"],"sourcesContent":["import { CellProps, SelectedRegion, SelectionFocus } from './types';\nimport { RefObject, createElement } from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { flushSync } from 'react-dom';\n\ninterface CopyGridElementsProps {\n  cell: CellProps;\n  selection: SelectedRegion;\n  rowCount: number;\n  columnCount: number;\n  pageStart?: number;\n  focus: SelectionFocus;\n  outerRef: RefObject<HTMLDivElement>;\n}\n\nconst addCellToRow = (\n  row: HTMLTableRowElement,\n  cell: CellProps,\n  rowIndex: number,\n  columnIndex: number\n) => {\n  const td = document.createElement('td');\n  const container = document.createElement('div');\n  const root = createRoot(container);\n\n  flushSync(() => {\n    root.render(\n      createElement(cell, { rowIndex, columnIndex, width: 1000, type: 'row-cell' })\n    );\n  });\n\n  td.innerHTML = container.innerHTML;\n  root.unmount();\n\n  row.appendChild(td);\n};\n\nconst columnListLoop = (\n  tbody: HTMLTableSectionElement,\n  columnList: number[],\n  cell: CellProps,\n  rowIndex: number\n) => {\n  const row = document.createElement('tr');\n  columnList.forEach(columnIndex => {\n    addCellToRow(row, cell, rowIndex, columnIndex);\n  });\n  tbody.appendChild(row);\n};\n\nconst copyGridElements = async ({\n  cell,\n  selection,\n  rowCount,\n  columnCount,\n  pageStart = 0,\n  focus,\n  outerRef,\n}: CopyGridElementsProps): Promise<void> => {\n  if (!outerRef.current) {\n    throw 'Could not fetch selection';\n  }\n  const table = document.createElement('table');\n  table.style.position = 'absolute';\n  table.style.top = '-200px';\n  table.style.left = '-200px';\n  table.style.width = '0px';\n  table.style.height = '0px';\n  table.style.overflow = 'hidden';\n  const thead = document.createElement('thead');\n  const tbody = document.createElement('tbody');\n\n  switch (selection.type) {\n    case 'rectangle':\n      Array.from(\n        { length: selection.bounds.bottom + 1 - selection.bounds.top },\n        (_, index) => selection.bounds.top + index\n      ).forEach(rowIndex => {\n        const columnList = Array.from(\n          { length: selection.bounds.right + 1 - selection.bounds.left },\n          (_, index) => selection.bounds.left + index\n        );\n        columnListLoop(tbody, columnList, cell, rowIndex);\n      });\n      break;\n    case 'columns':\n      Array.from({ length: rowCount }, (_, index) => pageStart + index).forEach(\n        rowIndex => {\n          const columnList = [...selection.columns].sort();\n          columnListLoop(tbody, columnList, cell, rowIndex);\n        }\n      );\n      break;\n    case 'rows':\n      [...selection.rows].sort().forEach(rowIndex => {\n        const columnList = Array.from(\n          { length: columnCount },\n          (_, index) => pageStart + index\n        );\n        columnListLoop(tbody, columnList, cell, rowIndex);\n      });\n      break;\n    case 'empty':\n      columnListLoop(tbody, [focus.column], cell, focus.row);\n      break;\n    default:\n      throw new Error('incorrect selection provided');\n  }\n\n  table.appendChild(thead);\n  table.appendChild(tbody);\n\n  outerRef.current.appendChild(table);\n\n  const windowSelection = window.getSelection();\n  if (windowSelection) {\n    const range = document.createRange();\n    range.selectNodeContents(table);\n    windowSelection.removeAllRanges();\n    windowSelection.addRange(range);\n    await navigator.clipboard.writeText(table.innerText);\n    windowSelection.removeAllRanges();\n\n    outerRef.current.removeChild(table);\n  } else {\n    throw 'Could not fetch selection';\n  }\n};\n\nexport default copyGridElements;\n"],"names":["addCellToRow","row","cell","rowIndex","columnIndex","td","document","createElement","container","root","createRoot","flushSync","render","width","type","innerHTML","unmount","appendChild","columnListLoop","tbody","columnList","forEach","copyGridElements","selection","rowCount","columnCount","pageStart","focus","outerRef","current","table","style","position","top","left","height","overflow","thead","Array","from","length","bounds","bottom","_","index","right","columns","sort","rows","column","Error","windowSelection","window","getSelection","range","createRange","selectNodeContents","removeAllRanges","addRange","navigator","clipboard","writeText","innerText","removeChild"],"mappings":";;;;;;;;AAeA,MAAMA,YAAAA,GAAeA,CACnBC,GAAAA,EACAC,IAAAA,EACAC,UACAC,WAAAA,KACG;AACH,EAAA,MAAMC,EAAAA,GAAKC,QAAAA,CAASC,aAAAA,CAAc,IAAI,CAAA;AACtC,EAAA,MAAMC,SAAAA,GAAYF,QAAAA,CAASC,aAAAA,CAAc,KAAK,CAAA;AAC9C,EAAA,MAAME,IAAAA,GAAOC,kBAAWF,SAAS,CAAA;AAEjCG,EAAAA,kBAAAA,CAAU,MAAM;AACdF,IAAAA,IAAAA,CAAKG,MAAAA,CACHL,oBAAcL,IAAAA,EAAM;AAAA,MAAEC,QAAAA;AAAAA,MAAUC,WAAAA;AAAAA,MAAaS,KAAAA,EAAO,GAAA;AAAA,MAAMC,IAAAA,EAAM;AAAA,KAAY,CAC9E,CAAA;AAAA,EACF,CAAC,CAAA;AAEDT,EAAAA,EAAAA,CAAGU,YAAYP,SAAAA,CAAUO,SAAAA;AACzBN,EAAAA,IAAAA,CAAKO,OAAAA,EAAQ;AAEbf,EAAAA,GAAAA,CAAIgB,YAAYZ,EAAE,CAAA;AACpB,CAAA;AAEA,MAAMa,cAAAA,GAAiBA,CACrBC,KAAAA,EACAC,UAAAA,EACAlB,MACAC,QAAAA,KACG;AACH,EAAA,MAAMF,GAAAA,GAAMK,QAAAA,CAASC,aAAAA,CAAc,IAAI,CAAA;AACvCa,EAAAA,UAAAA,CAAWC,QAAQjB,CAAAA,WAAAA,KAAe;AAChCJ,IAAAA,YAAAA,CAAaC,GAAAA,EAAKC,IAAAA,EAAMC,QAAAA,EAAUC,WAAW,CAAA;AAAA,EAC/C,CAAC,CAAA;AACDe,EAAAA,KAAAA,CAAMF,YAAYhB,GAAG,CAAA;AACvB,CAAA;AAEA,MAAMqB,mBAAmB,OAAO;AAAA,EAC9BpB,IAAAA;AAAAA,EACAqB,SAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,SAAAA,GAAY,CAAA;AAAA,EACZC,KAAAA;AAAAA,EACAC;AACqB,CAAA,KAAqB;AAC1C,EAAA,IAAI,CAACA,SAASC,OAAAA,EAAS;AACrB,IAAA,MAAM,2BAAA;AAAA,EACR;AACA,EAAA,MAAMC,KAAAA,GAAQxB,QAAAA,CAASC,aAAAA,CAAc,OAAO,CAAA;AAC5CuB,EAAAA,KAAAA,CAAMC,MAAMC,QAAAA,GAAW,UAAA;AACvBF,EAAAA,KAAAA,CAAMC,MAAME,GAAAA,GAAM,QAAA;AAClBH,EAAAA,KAAAA,CAAMC,MAAMG,IAAAA,GAAO,QAAA;AACnBJ,EAAAA,KAAAA,CAAMC,MAAMlB,KAAAA,GAAQ,KAAA;AACpBiB,EAAAA,KAAAA,CAAMC,MAAMI,MAAAA,GAAS,KAAA;AACrBL,EAAAA,KAAAA,CAAMC,MAAMK,QAAAA,GAAW,QAAA;AACvB,EAAA,MAAMC,KAAAA,GAAQ/B,QAAAA,CAASC,aAAAA,CAAc,OAAO,CAAA;AAC5C,EAAA,MAAMY,KAAAA,GAAQb,QAAAA,CAASC,aAAAA,CAAc,OAAO,CAAA;AAE5C,EAAA,QAAQgB,UAAUT,IAAAA;AAAI,IACpB,KAAK,WAAA;AACHwB,MAAAA,KAAAA,CAAMC,IAAAA,CACJ;AAAA,QAAEC,QAAQjB,SAAAA,CAAUkB,MAAAA,CAAOC,MAAAA,GAAS,CAAA,GAAInB,UAAUkB,MAAAA,CAAOR;AAAAA,OAAI,EAC7D,CAACU,CAAAA,EAAGC,KAAAA,KAAUrB,SAAAA,CAAUkB,OAAOR,GAAAA,GAAMW,KACvC,CAAA,CAAEvB,OAAAA,CAAQlB,CAAAA,QAAAA,KAAY;AACpB,QAAA,MAAMiB,UAAAA,GAAakB,MAAMC,IAAAA,CACvB;AAAA,UAAEC,QAAQjB,SAAAA,CAAUkB,MAAAA,CAAOI,KAAAA,GAAQ,CAAA,GAAItB,UAAUkB,MAAAA,CAAOP;AAAAA,WACxD,CAACS,CAAAA,EAAGC,UAAUrB,SAAAA,CAAUkB,MAAAA,CAAOP,OAAOU,KACxC,CAAA;AACA1B,QAAAA,cAAAA,CAAeC,KAAAA,EAAOC,UAAAA,EAAYlB,IAAAA,EAAMC,QAAQ,CAAA;AAAA,MAClD,CAAC,CAAA;AACD,MAAA;AAAA,IACF,KAAK,SAAA;AACHmC,MAAAA,KAAAA,CAAMC,IAAAA,CAAK;AAAA,QAAEC,MAAAA,EAAQhB;AAAAA,OAAS,EAAG,CAACmB,CAAAA,EAAGC,KAAAA,KAAUlB,YAAYkB,KAAK,CAAA,CAAEvB,QAChElB,CAAAA,QAAAA,KAAY;AACV,QAAA,MAAMiB,aAAa,CAAC,GAAGG,SAAAA,CAAUuB,OAAO,EAAEC,IAAAA,EAAK;AAC/C7B,QAAAA,cAAAA,CAAeC,KAAAA,EAAOC,UAAAA,EAAYlB,IAAAA,EAAMC,QAAQ,CAAA;AAAA,MAClD,CACF,CAAA;AACA,MAAA;AAAA,IACF,KAAK,MAAA;AACH,MAAA,CAAC,GAAGoB,SAAAA,CAAUyB,IAAI,EAAED,IAAAA,EAAK,CAAE1B,QAAQlB,CAAAA,QAAAA,KAAY;AAC7C,QAAA,MAAMiB,UAAAA,GAAakB,MAAMC,IAAAA,CACvB;AAAA,UAAEC,MAAAA,EAAQf;AAAAA,SAAY,EACtB,CAACkB,CAAAA,EAAGC,KAAAA,KAAUlB,YAAYkB,KAC5B,CAAA;AACA1B,QAAAA,cAAAA,CAAeC,KAAAA,EAAOC,UAAAA,EAAYlB,IAAAA,EAAMC,QAAQ,CAAA;AAAA,MAClD,CAAC,CAAA;AACD,MAAA;AAAA,IACF,KAAK,OAAA;AACHe,MAAAA,cAAAA,CAAeC,OAAO,CAACQ,KAAAA,CAAMsB,MAAM,CAAA,EAAG/C,IAAAA,EAAMyB,MAAM1B,GAAG,CAAA;AACrD,MAAA;AAAA,IACF;AACE,MAAA,MAAM,IAAIiD,MAAM,8BAA8B,CAAA;AAAA;AAGlDpB,EAAAA,KAAAA,CAAMb,YAAYoB,KAAK,CAAA;AACvBP,EAAAA,KAAAA,CAAMb,YAAYE,KAAK,CAAA;AAEvBS,EAAAA,QAAAA,CAASC,OAAAA,CAAQZ,YAAYa,KAAK,CAAA;AAElC,EAAA,MAAMqB,eAAAA,GAAkBC,OAAOC,YAAAA,EAAa;AAC5C,EAAA,IAAIF,eAAAA,EAAiB;AACnB,IAAA,MAAMG,KAAAA,GAAQhD,SAASiD,WAAAA,EAAY;AACnCD,IAAAA,KAAAA,CAAME,mBAAmB1B,KAAK,CAAA;AAC9BqB,IAAAA,eAAAA,CAAgBM,eAAAA,EAAgB;AAChCN,IAAAA,eAAAA,CAAgBO,SAASJ,KAAK,CAAA;AAC9B,IAAA,MAAMK,SAAAA,CAAUC,SAAAA,CAAUC,SAAAA,CAAU/B,KAAAA,CAAMgC,SAAS,CAAA;AACnDX,IAAAA,eAAAA,CAAgBM,eAAAA,EAAgB;AAEhC7B,IAAAA,QAAAA,CAASC,OAAAA,CAAQkC,YAAYjC,KAAK,CAAA;AAAA,EACpC,CAAA,MAAO;AACL,IAAA,MAAM,2BAAA;AAAA,EACR;AACF;;;;"}