@join-x5/react-data-grid 1.3.1-alpha-0 → 1.4.1

package/dist/TableInputCell/text.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.es.js","sources":["../../src/TableInputCell/text.tsx"],"sourcesContent":["'use client';\n\nimport styled from '@emotion/styled';\n\nimport {useEffect, useState} from 'react';\nimport {forwardRef} from '@join-x5/react-theme';\n\nimport {TableCell, TableCellContent} from '../TableCell';\n\nimport {useDataGridInputCell, useTableCellTextInput} from './hook';\n\nimport type {\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  InputHTMLAttributes,\n  KeyboardEventHandler,\n  ReactNode,\n} from 'react';\nimport type {Cell as ReactTableCell} from '@tanstack/react-table';\nimport type {FRC, PropsWithChildren} from '@join-x5/react-theme';\nimport type {DataGridTableCellProps, TableCellProps} from '../TableCell';\nimport type {ColumnDefTemplate} from './types';\n\nconst ChildContent = styled.div`\n  &[data-hidden] {\n    visibility: hidden;\n    pointer-events: none;\n  }\n`;\n\nconst Input = styled.input`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  min-width: 10px;\n  padding: 0;\n  background-color: transparent;\n  border: none;\n  outline: none;\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  line-height: inherit;\n\n  &[data-hidden] {\n    visibility: hidden;\n    pointer-events: none;\n  }\n`;\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype DefaultAny = any;\n\nexport type TextInputProps = {\n  value: string;\n  onChange: (newValue: string, e: FocusEvent<HTMLInputElement>) => void;\n} & Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'>;\n\ntype TTextInputCell = FRC<\n  HTMLTableCellElement,\n  {\n    inputProps: TextInputProps;\n  } & Omit<TableCellProps, 'value' | 'onChange'>\n>;\n\nexport const TextInputCell: TTextInputCell = forwardRef(({inputProps, ...props}, baseRef) => {\n  const {cellProps, ref, inputRef} = useTableCellTextInput<HTMLInputElement>(props, baseRef);\n\n  const [value, setValue] = useState(inputProps.value ?? '');\n\n  const onChange: ChangeEventHandler<HTMLInputElement> = e => {\n    setValue(e.target.value);\n  };\n\n  const onKeyDown: KeyboardEventHandler<HTMLInputElement> = e => {\n    const isEnterCode = e.code === 'Enter' || e.code === 'NumpadEnter';\n\n    if (e.code === 'Escape' || isEnterCode) {\n      props.setIsActive?.(false);\n      e.currentTarget.blur();\n    }\n  };\n\n  const onBlur: FocusEventHandler<HTMLInputElement> = e => {\n    props.setIsActive?.(false);\n\n    inputProps.onChange(value, e);\n    inputProps.onBlur?.(e);\n    ref.current?.blur();\n  };\n\n  const isChildHidden = props.isActive ? true : undefined;\n\n  const resultProps = {\n    ...inputProps,\n\n    value,\n    onChange,\n    onKeyDown,\n    onBlur,\n\n    size: 0,\n    'data-hidden': props.isActive ? undefined : true,\n  };\n\n  const contentProps = {\n    isMultiline: cellProps.isMultiline,\n    whiteSpace: cellProps.whiteSpace,\n    wordBreak: cellProps.wordBreak,\n  };\n\n  useEffect(() => {\n    setValue(inputProps.value);\n  }, [inputProps.value]);\n\n  return (\n    <TableCell {...cellProps}>\n      <TableCellContent {...contentProps}>\n        <ChildContent data-hidden={isChildHidden}>{props.children}</ChildContent>\n        <Input ref={inputRef} {...resultProps} />\n      </TableCellContent>\n    </TableCell>\n  );\n});\n\nexport type DataGridTextInputCellProps<T = DefaultAny, V = DefaultAny> = {\n  getValue: (cell: ReactTableCell<T, V>) => string;\n  onChange: (cell: ReactTableCell<T, V>, newValue: string, e: FocusEvent<HTMLInputElement>) => void;\n} & Omit<TextInputProps, 'value' | 'onChange'> &\n  DataGridTableCellProps<T, V> &\n  PropsWithChildren;\n\nexport const DataGridTextInputCell: FRC<HTMLTableCellElement, DataGridTextInputCellProps> = forwardRef((props, ref) => {\n  const {cell, getValue, onChange, children, ...rest} = props;\n\n  const cellProps = useDataGridInputCell(cell);\n\n  const inputProps = rest as TextInputProps;\n  inputProps.value = getValue(cell);\n  inputProps.onChange = (newValue, e) => onChange(cell, newValue, e);\n\n  return (\n    <TextInputCell ref={ref} {...cellProps} inputProps={inputProps}>\n      {children}\n    </TextInputCell>\n  );\n});\n\nexport type GetDataGridTextInputCellArgs<T = DefaultAny, V = DefaultAny> = Omit<\n  DataGridTextInputCellProps<T, V>,\n  'cell' | 'children'\n>;\n\nexport const getDataGridTextInputCell = <T, V>(args: GetDataGridTextInputCellArgs<T, V>): ColumnDefTemplate<T, V> => {\n  return ({cell}) => {\n    const content = (cell.getValue() ?? null) as ReactNode;\n\n    return (\n      <DataGridTextInputCell key={cell.id} cell={cell} {...args}>\n        {content}\n      </DataGridTextInputCell>\n    );\n  };\n};\n"],"names":["inputProps","cellProps","ref","inputRef","setValue","blur","props","value","onChange","onKeyDown","onBlur","isMultiline","whiteSpace","wordBreak","useEffect","cell","getValue","children","rest"],"mappings":";;;;;;;AAAa;AAAA;AAAA;AAwBb;AAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoC8C;AAACA;AAAoB;AAC5E;AAAM;AAACC;AAAWC;AAAKC;AAKrBC;AAAuB;;AAIvB;AAEA;AAEkBC;;AAKlBC;AAIaD;AAKK;AACfL;AAEHO;AACAC;AACAC;AACAC;AAEM;AACsC;AAGzB;AACIC;AACDC;AACDC;AAGvBC;AACEV;AAAyB;AAMrB;AAA0D;AACpB;AAI9C;AAUE;AAAM;AAACW;AAAMC;AAAUR;AAAUS;AAAaC;AAK9ClB;AAQF;AAQU;AAACe;AACP;AAEA;AAKF;;;;;;"}
+{"version":3,"file":"text.es.js","sources":["../../src/TableInputCell/text.tsx"],"sourcesContent":["'use client';\n\nimport styled from '@emotion/styled';\n\nimport {useEffect, useState} from 'react';\nimport {forwardRef} from '@join-x5/react-theme';\n\nimport {TableCell, TableCellContent} from '../TableCell';\n\nimport {useDataGridInputCell, useTableCellTextInput} from './hook';\n\nimport type {\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  InputHTMLAttributes,\n  KeyboardEventHandler,\n  ReactNode,\n} from 'react';\nimport type {Cell as ReactTableCell} from '@tanstack/react-table';\nimport type {FRC, PropsWithChildren} from '@join-x5/react-theme';\nimport type {DataGridTableCellProps, TableCellProps} from '../TableCell';\nimport type {ColumnDefTemplate} from './types';\n\nconst ChildContent = styled.div`\n  &[data-hidden] {\n    visibility: hidden;\n    pointer-events: none;\n  }\n`;\n\nconst Input = styled.input`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  min-width: 10px;\n  padding: 0;\n  background-color: transparent;\n  border: none;\n  outline: none;\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  line-height: inherit;\n\n  &[data-hidden] {\n    visibility: hidden;\n    pointer-events: none;\n  }\n`;\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype DefaultAny = any;\n\nexport type TextInputProps = {\n  value: string;\n  onChange: (newValue: string, e: FocusEvent<HTMLInputElement>) => void;\n} & Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'>;\n\ntype TTextInputCell = FRC<\n  HTMLTableCellElement,\n  {\n    inputProps: TextInputProps;\n  } & Omit<TableCellProps, 'value' | 'onChange'>\n>;\n\nexport const TextInputCell: TTextInputCell = forwardRef(({inputProps, ...props}, baseRef) => {\n  const {cellProps, ref, inputRef} = useTableCellTextInput<HTMLInputElement>(props, baseRef);\n\n  const [value, setValue] = useState(inputProps.value ?? '');\n\n  const onChange: ChangeEventHandler<HTMLInputElement> = e => {\n    setValue(e.target.value);\n  };\n\n  const onKeyDown: KeyboardEventHandler<HTMLInputElement> = e => {\n    const isEnterCode = e.code === 'Enter' || e.code === 'NumpadEnter';\n\n    if (e.code === 'Escape' || isEnterCode) {\n      props.setIsActive?.(false);\n      e.currentTarget.blur();\n    }\n  };\n\n  const onBlur: FocusEventHandler<HTMLInputElement> = e => {\n    props.setIsActive?.(false);\n\n    inputProps.onChange(value, e);\n    inputProps.onBlur?.(e);\n    ref.current?.blur();\n  };\n\n  const isChildHidden = props.isActive ? true : undefined;\n\n  const resultProps = {\n    ...inputProps,\n\n    value,\n    onChange,\n    onKeyDown,\n    onBlur,\n\n    size: 0,\n    'data-hidden': props.isActive ? undefined : true,\n  };\n\n  const contentProps = {\n    isMultiline: cellProps.isMultiline,\n    whiteSpace: cellProps.whiteSpace,\n    wordBreak: cellProps.wordBreak,\n  };\n\n  useEffect(() => {\n    setValue(inputProps.value);\n  }, [inputProps.value]);\n\n  return (\n    <TableCell {...cellProps}>\n      <TableCellContent {...contentProps}>\n        <ChildContent data-hidden={isChildHidden}>{props.children}</ChildContent>\n        <Input ref={inputRef} {...resultProps} />\n      </TableCellContent>\n    </TableCell>\n  );\n});\n\nexport type DataGridTextInputCellProps<T = DefaultAny, V = DefaultAny> = {\n  getValue: (cell: ReactTableCell<T, V>) => string;\n  onChange: (cell: ReactTableCell<T, V>, newValue: string, e: FocusEvent<HTMLInputElement>) => void;\n} & Omit<TextInputProps, 'value' | 'onChange'> &\n  DataGridTableCellProps<T, V> &\n  PropsWithChildren;\n\nexport const DataGridTextInputCell: FRC<HTMLTableCellElement, DataGridTextInputCellProps> = forwardRef((props, ref) => {\n  const {cell, getValue, onChange, children, ...rest} = props;\n\n  const cellProps = useDataGridInputCell(cell);\n\n  const inputProps = rest as TextInputProps;\n  inputProps.value = getValue(cell);\n  inputProps.onChange = (newValue, e) => onChange(cell, newValue, e);\n\n  return (\n    <TextInputCell ref={ref} {...cellProps} inputProps={inputProps}>\n      {children}\n    </TextInputCell>\n  );\n});\n\nexport type GetDataGridTextInputCellArgs<T = DefaultAny, V = DefaultAny> = Omit<\n  DataGridTextInputCellProps<T, V>,\n  'cell' | 'children'\n>;\n\nexport const getDataGridTextInputCell = <T, V>(args: GetDataGridTextInputCellArgs<T, V>): ColumnDefTemplate<T, V> => {\n  return ({cell}) => {\n    const content = (cell.getValue() ?? null) as ReactNode;\n\n    return (\n      <DataGridTextInputCell key={cell.id} cell={cell} {...args}>\n        {content}\n      </DataGridTextInputCell>\n    );\n  };\n};\n"],"names":["inputProps","cellProps","ref","inputRef","setValue","blur","props","value","onChange","onKeyDown","onBlur","isMultiline","whiteSpace","wordBreak","useEffect","cell","getValue","children","rest"],"mappings":";;;;;;;AAAa;AAAA;AAAA;AAwBb;AAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoC8C;AAACA;AAAoB;AAC5E;AAAM;AAACC;AAAWC;AAAKC;AAKrBC;AAAuB;AAIvB;AAEA;AAEkBC;AAKlBC;AAIaD;AAKK;AACfL;AAEHO;AACAC;AACAC;AACAC;AAEM;AACsC;AAGzB;AACIC;AACDC;AACDC;AAGvBC;AACEV;AAAyB;AAMrB;AAA0D;AACpB;AAI9C;AAUE;AAAM;AAACW;AAAMC;AAAUR;AAAUS;AAAaC;AAK9ClB;AAQF;AAQU;AAACe;AACP;AAEA;AAKF;;;;;;"}

package/dist/TableInputCell/textarea.es.js

@@ -1,14 +1,14 @@
 "use client";
-import { jsx as V, jsxs as s } from "@emotion/react/jsx-runtime";
-import m from "@emotion/styled/base";
-import { useState as F, useEffect as h } from "react";
-import J, { forwardRef as i } from "@join-x5/react-theme";
-import { TableCell as A, TableCellContent as Y } from "../TableCell/index.es.js";
-import { useTableCellTextInput as U, useDataGridInputCell as a } from "./hook.es.js";
-function N() {
+import { jsx as d, jsxs as x } from "@emotion/react/jsx-runtime";
+import R from "@emotion/styled/base";
+import { useState as e, useEffect as s } from "react";
+import F, { forwardRef as C } from "@join-x5/react-theme";
+import { TableCell as h, TableCellContent as J } from "../TableCell/index.es.js";
+import { useTableCellTextInput as A, useDataGridInputCell as Y } from "./hook.es.js";
+function U() {
   return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
 }
-const y = /* @__PURE__ */ m("div", process.env.NODE_ENV === "production" ? {
+const a = /* @__PURE__ */ R("div", process.env.NODE_ENV === "production" ? {
   target: "e1dalyc21"
 } : {
   target: "e1dalyc21",
@@ -19,65 +19,63 @@ const y = /* @__PURE__ */ m("div", process.env.NODE_ENV === "production" ? {
 } : {
   name: "1akleb8",
   styles: "min-height:100%;&[data-hidden]{visibility:hidden;pointer-events:none;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGVJbnB1dENlbGwvdGV4dGFyZWEudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdCK0IiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkL3NyYy9UYWJsZUlucHV0Q2VsbC90ZXh0YXJlYS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCc7XG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHt1c2VFZmZlY3QsIHVzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgYmFzZVRoZW1lLCB7Zm9yd2FyZFJlZn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuXG5pbXBvcnQge1RhYmxlQ2VsbCwgVGFibGVDZWxsQ29udGVudH0gZnJvbSAnLi4vVGFibGVDZWxsJztcblxuaW1wb3J0IHt1c2VEYXRhR3JpZElucHV0Q2VsbCwgdXNlVGFibGVDZWxsVGV4dElucHV0fSBmcm9tICcuL2hvb2snO1xuXG5pbXBvcnQgdHlwZSB7XG4gIENoYW5nZUV2ZW50SGFuZGxlcixcbiAgRm9jdXNFdmVudCxcbiAgRm9jdXNFdmVudEhhbmRsZXIsXG4gIElucHV0SFRNTEF0dHJpYnV0ZXMsXG4gIEtleWJvYXJkRXZlbnRIYW5kbGVyLFxuICBSZWFjdE5vZGUsXG59IGZyb20gJ3JlYWN0JztcbmltcG9ydCB0eXBlIHtDZWxsIGFzIFJlYWN0VGFibGVDZWxsfSBmcm9tICdAdGFuc3RhY2svcmVhY3QtdGFibGUnO1xuaW1wb3J0IHR5cGUge0ZSQywgUHJvcHNXaXRoQ2hpbGRyZW59IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB0eXBlIHtEYXRhR3JpZFRhYmxlQ2VsbFByb3BzLCBUYWJsZUNlbGxQcm9wc30gZnJvbSAnLi4vVGFibGVDZWxsJztcbmltcG9ydCB0eXBlIHtDb2x1bW5EZWZUZW1wbGF0ZX0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IENoaWxkQ29udGVudCA9IHN0eWxlZC5kaXZgXG4gIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICZbZGF0YS1oaWRkZW5dIHtcbiAgICB2aXNpYmlsaXR5OiBoaWRkZW47XG4gICAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gIH1cbmA7XG5cbmNvbnN0IFRleHRBcmVhID0gc3R5bGVkLnRleHRhcmVhYFxuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMDtcbiAgbGVmdDogMDtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogMTAwJTtcbiAgbWluLXdpZHRoOiAxMHB4O1xuICBwYWRkaW5nOiAwO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyOiBub25lO1xuICBvdXRsaW5lOiBub25lO1xuICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgZm9udC1zaXplOiBpbmhlcml0O1xuICBmb250LXdlaWdodDogaW5oZXJpdDtcbiAgbGluZS1oZWlnaHQ6IGluaGVyaXQ7XG4gIHJlc2l6ZTogbm9uZTtcblxuICAke2Jhc2VUaGVtZS5zY3JvbGx9XG5cbiAgJltkYXRhLWhpZGRlbl0ge1xuICAgIHZpc2liaWxpdHk6IGhpZGRlbjtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgfVxuYDtcblxuLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1leHBsaWNpdC1hbnlcbnR5cGUgRGVmYXVsdEFueSA9IGFueTtcblxuZXhwb3J0IHR5cGUgVGV4dEFyZWFJbnB1dFByb3BzID0ge1xuICB2YWx1ZTogc3RyaW5nO1xuICBvbkNoYW5nZTogKG5ld1ZhbHVlOiBzdHJpbmcsIGU6IEZvY3VzRXZlbnQ8SFRNTFRleHRBcmVhRWxlbWVudD4pID0+IHZvaWQ7XG59ICYgT21pdDxJbnB1dEhUTUxBdHRyaWJ1dGVzPEhUTUxUZXh0QXJlYUVsZW1lbnQ+LCAndmFsdWUnIHwgJ29uQ2hhbmdlJz47XG5cbnR5cGUgVFRleHRBcmVhSW5wdXRDZWxsID0gRlJDPFxuICBIVE1MVGFibGVDZWxsRWxlbWVudCxcbiAge1xuICAgIGlucHV0UHJvcHM6IFRleHRBcmVhSW5wdXRQcm9wcztcbiAgfSAmIE9taXQ8VGFibGVDZWxsUHJvcHMsICd2YWx1ZScgfCAnb25DaGFuZ2UnPlxuPjtcblxuZXhwb3J0IGNvbnN0IFRleHRBcmVhSW5wdXRDZWxsOiBUVGV4dEFyZWFJbnB1dENlbGwgPSBmb3J3YXJkUmVmKCh7aW5wdXRQcm9wcywgLi4ucHJvcHN9LCBiYXNlUmVmKSA9PiB7XG4gIGNvbnN0IHtjZWxsUHJvcHMsIHJlZiwgaW5wdXRSZWZ9ID0gdXNlVGFibGVDZWxsVGV4dElucHV0PEhUTUxUZXh0QXJlYUVsZW1lbnQ+KHByb3BzLCBiYXNlUmVmKTtcblxuICBjb25zdCBbdmFsdWUsIHNldFZhbHVlXSA9IHVzZVN0YXRlKGlucHV0UHJvcHMudmFsdWUgPz8gJycpO1xuXG4gIGNvbnN0IG9uQ2hhbmdlOiBDaGFuZ2VFdmVudEhhbmRsZXI8SFRNTFRleHRBcmVhRWxlbWVudD4gPSBlID0+IHtcbiAgICBzZXRWYWx1ZShlLnRhcmdldC52YWx1ZSk7XG4gIH07XG5cbiAgY29uc3Qgb25LZXlEb3duOiBLZXlib2FyZEV2ZW50SGFuZGxlcjxIVE1MVGV4dEFyZWFFbGVtZW50PiA9IGUgPT4ge1xuICAgIGNvbnN0IGlzRW50ZXJDb2RlID0gZS5jb2RlID09PSAnRW50ZXInIHx8IGUuY29kZSA9PT0gJ051bXBhZEVudGVyJztcblxuICAgIGlmIChlLmNvZGUgPT09ICdFc2NhcGUnIHx8IChpc0VudGVyQ29kZSAmJiBlLmN0cmxLZXkpKSB7XG4gICAgICBwcm9wcy5zZXRJc0FjdGl2ZT8uKGZhbHNlKTtcbiAgICAgIGUuY3VycmVudFRhcmdldC5ibHVyKCk7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IG9uQmx1cjogRm9jdXNFdmVudEhhbmRsZXI8SFRNTFRleHRBcmVhRWxlbWVudD4gPSBlID0+IHtcbiAgICBwcm9wcy5zZXRJc0FjdGl2ZT8uKGZhbHNlKTtcblxuICAgIGlucHV0UHJvcHMub25DaGFuZ2UodmFsdWUsIGUpO1xuICAgIGlucHV0UHJvcHMub25CbHVyPy4oZSk7XG4gICAgcmVmLmN1cnJlbnQ/LmJsdXIoKTtcbiAgfTtcblxuICBjb25zdCBpc0NoaWxkSGlkZGVuID0gcHJvcHMuaXNBY3RpdmUgPyB0cnVlIDogdW5kZWZpbmVkO1xuXG4gIGNvbnN0IHJlc3VsdFByb3BzID0ge1xuICAgIC4uLmlucHV0UHJvcHMsXG5cbiAgICB2YWx1ZSxcbiAgICBvbkNoYW5nZSxcbiAgICBvbktleURvd24sXG4gICAgb25CbHVyLFxuXG4gICAgc2l6ZTogMCxcbiAgICAnZGF0YS1oaWRkZW4nOiBwcm9wcy5pc0FjdGl2ZSA/IHVuZGVmaW5lZCA6IHRydWUsXG4gIH07XG5cbiAgY29uc3QgY29udGVudCA9IHByb3BzLmlzQWN0aXZlID8gdmFsdWUgOiBwcm9wcy5jaGlsZHJlbjtcblxuICBjb25zdCBjb250ZW50UHJvcHMgPSB7XG4gICAgaXNNdWx0aWxpbmU6IGNlbGxQcm9wcy5pc011bHRpbGluZSxcbiAgICB3aGl0ZVNwYWNlOiBjZWxsUHJvcHMud2hpdGVTcGFjZSxcbiAgICB3b3JkQnJlYWs6IGNlbGxQcm9wcy53b3JkQnJlYWssXG4gIH07XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBzZXRWYWx1ZShpbnB1dFByb3BzLnZhbHVlKTtcbiAgfSwgW2lucHV0UHJvcHMudmFsdWVdKTtcblxuICByZXR1cm4gKFxuICAgIDxUYWJsZUNlbGwgey4uLmNlbGxQcm9wc30+XG4gICAgICA8VGFibGVDZWxsQ29udGVudCB7Li4uY29udGVudFByb3BzfT5cbiAgICAgICAgPENoaWxkQ29udGVudCBkYXRhLWhpZGRlbj17aXNDaGlsZEhpZGRlbn0+e2NvbnRlbnR9PC9DaGlsZENvbnRlbnQ+XG4gICAgICAgIDxUZXh0QXJlYSByZWY9e2lucHV0UmVmfSB7Li4ucmVzdWx0UHJvcHN9IC8+XG4gICAgICA8L1RhYmxlQ2VsbENvbnRlbnQ+XG4gICAgPC9UYWJsZUNlbGw+XG4gICk7XG59KTtcblxuZXhwb3J0IHR5cGUgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbFByb3BzPFQgPSBEZWZhdWx0QW55LCBWID0gRGVmYXVsdEFueT4gPSB7XG4gIGdldFZhbHVlOiAoY2VsbDogUmVhY3RUYWJsZUNlbGw8VCwgVj4pID0+IHN0cmluZztcbiAgb25DaGFuZ2U6IChjZWxsOiBSZWFjdFRhYmxlQ2VsbDxULCBWPiwgbmV3VmFsdWU6IHN0cmluZywgZTogRm9jdXNFdmVudDxIVE1MVGV4dEFyZWFFbGVtZW50PikgPT4gdm9pZDtcbn0gJiBPbWl0PFRleHRBcmVhSW5wdXRQcm9wcywgJ3ZhbHVlJyB8ICdvbkNoYW5nZSc+ICZcbiAgRGF0YUdyaWRUYWJsZUNlbGxQcm9wczxULCBWPiAmXG4gIFByb3BzV2l0aENoaWxkcmVuO1xuXG50eXBlIFREYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsID0gRlJDPEhUTUxUYWJsZUNlbGxFbGVtZW50LCBEYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsUHJvcHM+O1xuXG5leHBvcnQgY29uc3QgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbDogVERhdGFHcmlkVGV4dEFyZWFJbnB1dENlbGwgPSBmb3J3YXJkUmVmKChwcm9wcywgcmVmKSA9PiB7XG4gIGNvbnN0IHtjZWxsLCBnZXRWYWx1ZSwgb25DaGFuZ2UsIC4uLnJlc3R9ID0gcHJvcHM7XG5cbiAgY29uc3QgY2VsbFByb3BzID0gdXNlRGF0YUdyaWRJbnB1dENlbGwoY2VsbCk7XG5cbiAgY29uc3QgY29udGVudCA9IChjZWxsLmdldFZhbHVlKCkgPz8gbnVsbCkgYXMgUmVhY3ROb2RlO1xuXG4gIGNvbnN0IGlucHV0UHJvcHMgPSByZXN0IGFzIFRleHRBcmVhSW5wdXRQcm9wcztcbiAgaW5wdXRQcm9wcy52YWx1ZSA9IGdldFZhbHVlKGNlbGwpO1xuICBpbnB1dFByb3BzLm9uQ2hhbmdlID0gKG5ld1ZhbHVlLCBlKSA9PiBvbkNoYW5nZShjZWxsLCBuZXdWYWx1ZSwgZSk7XG5cbiAgcmV0dXJuIChcbiAgICA8VGV4dEFyZWFJbnB1dENlbGwgcmVmPXtyZWZ9IHsuLi5jZWxsUHJvcHN9IGlucHV0UHJvcHM9e2lucHV0UHJvcHN9PlxuICAgICAge2NvbnRlbnR9XG4gICAgPC9UZXh0QXJlYUlucHV0Q2VsbD5cbiAgKTtcbn0pO1xuXG5leHBvcnQgdHlwZSBHZXREYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsQXJnczxUID0gRGVmYXVsdEFueSwgViA9IERlZmF1bHRBbnk+ID0gT21pdDxcbiAgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbFByb3BzPFQsIFY+LFxuICAnY2VsbCcgfCAnY2hpbGRyZW4nXG4+O1xuXG5leHBvcnQgY29uc3QgZ2V0RGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbCA9IDxULCBWPihcbiAgYXJnczogR2V0RGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbEFyZ3M8VCwgVj5cbik6IENvbHVtbkRlZlRlbXBsYXRlPFQsIFY+ID0+IHtcbiAgcmV0dXJuICh7Y2VsbH0pID0+IHtcbiAgICBjb25zdCBjb250ZW50ID0gKGNlbGwuZ2V0VmFsdWUoKSA/PyBudWxsKSBhcyBSZWFjdE5vZGU7XG5cbiAgICByZXR1cm4gKFxuICAgICAgPERhdGFHcmlkVGV4dEFyZWFJbnB1dENlbGwga2V5PXtjZWxsLmlkfSBjZWxsPXtjZWxsfSB7Li4uYXJnc30+XG4gICAgICAgIHtjb250ZW50fVxuICAgICAgPC9EYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsPlxuICAgICk7XG4gIH07XG59O1xuIl19 */",
-  toString: N
-}), o = /* @__PURE__ */ m("textarea", process.env.NODE_ENV === "production" ? {
+  toString: U
+}), N = /* @__PURE__ */ R("textarea", process.env.NODE_ENV === "production" ? {
   target: "e1dalyc20"
 } : {
   target: "e1dalyc20",
   label: "TextArea"
-})("position:absolute;top:0;left:0;width:100%;height:100%;min-width:10px;padding:0;background-color:transparent;border:none;outline:none;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;resize:none;", J.scroll, " &[data-hidden]{visibility:hidden;pointer-events:none;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGVJbnB1dENlbGwvdGV4dGFyZWEudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdDZ0MiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkL3NyYy9UYWJsZUlucHV0Q2VsbC90ZXh0YXJlYS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCc7XG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHt1c2VFZmZlY3QsIHVzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgYmFzZVRoZW1lLCB7Zm9yd2FyZFJlZn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuXG5pbXBvcnQge1RhYmxlQ2VsbCwgVGFibGVDZWxsQ29udGVudH0gZnJvbSAnLi4vVGFibGVDZWxsJztcblxuaW1wb3J0IHt1c2VEYXRhR3JpZElucHV0Q2VsbCwgdXNlVGFibGVDZWxsVGV4dElucHV0fSBmcm9tICcuL2hvb2snO1xuXG5pbXBvcnQgdHlwZSB7XG4gIENoYW5nZUV2ZW50SGFuZGxlcixcbiAgRm9jdXNFdmVudCxcbiAgRm9jdXNFdmVudEhhbmRsZXIsXG4gIElucHV0SFRNTEF0dHJpYnV0ZXMsXG4gIEtleWJvYXJkRXZlbnRIYW5kbGVyLFxuICBSZWFjdE5vZGUsXG59IGZyb20gJ3JlYWN0JztcbmltcG9ydCB0eXBlIHtDZWxsIGFzIFJlYWN0VGFibGVDZWxsfSBmcm9tICdAdGFuc3RhY2svcmVhY3QtdGFibGUnO1xuaW1wb3J0IHR5cGUge0ZSQywgUHJvcHNXaXRoQ2hpbGRyZW59IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB0eXBlIHtEYXRhR3JpZFRhYmxlQ2VsbFByb3BzLCBUYWJsZUNlbGxQcm9wc30gZnJvbSAnLi4vVGFibGVDZWxsJztcbmltcG9ydCB0eXBlIHtDb2x1bW5EZWZUZW1wbGF0ZX0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IENoaWxkQ29udGVudCA9IHN0eWxlZC5kaXZgXG4gIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICZbZGF0YS1oaWRkZW5dIHtcbiAgICB2aXNpYmlsaXR5OiBoaWRkZW47XG4gICAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gIH1cbmA7XG5cbmNvbnN0IFRleHRBcmVhID0gc3R5bGVkLnRleHRhcmVhYFxuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMDtcbiAgbGVmdDogMDtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogMTAwJTtcbiAgbWluLXdpZHRoOiAxMHB4O1xuICBwYWRkaW5nOiAwO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyOiBub25lO1xuICBvdXRsaW5lOiBub25lO1xuICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgZm9udC1zaXplOiBpbmhlcml0O1xuICBmb250LXdlaWdodDogaW5oZXJpdDtcbiAgbGluZS1oZWlnaHQ6IGluaGVyaXQ7XG4gIHJlc2l6ZTogbm9uZTtcblxuICAke2Jhc2VUaGVtZS5zY3JvbGx9XG5cbiAgJltkYXRhLWhpZGRlbl0ge1xuICAgIHZpc2liaWxpdHk6IGhpZGRlbjtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgfVxuYDtcblxuLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1leHBsaWNpdC1hbnlcbnR5cGUgRGVmYXVsdEFueSA9IGFueTtcblxuZXhwb3J0IHR5cGUgVGV4dEFyZWFJbnB1dFByb3BzID0ge1xuICB2YWx1ZTogc3RyaW5nO1xuICBvbkNoYW5nZTogKG5ld1ZhbHVlOiBzdHJpbmcsIGU6IEZvY3VzRXZlbnQ8SFRNTFRleHRBcmVhRWxlbWVudD4pID0+IHZvaWQ7XG59ICYgT21pdDxJbnB1dEhUTUxBdHRyaWJ1dGVzPEhUTUxUZXh0QXJlYUVsZW1lbnQ+LCAndmFsdWUnIHwgJ29uQ2hhbmdlJz47XG5cbnR5cGUgVFRleHRBcmVhSW5wdXRDZWxsID0gRlJDPFxuICBIVE1MVGFibGVDZWxsRWxlbWVudCxcbiAge1xuICAgIGlucHV0UHJvcHM6IFRleHRBcmVhSW5wdXRQcm9wcztcbiAgfSAmIE9taXQ8VGFibGVDZWxsUHJvcHMsICd2YWx1ZScgfCAnb25DaGFuZ2UnPlxuPjtcblxuZXhwb3J0IGNvbnN0IFRleHRBcmVhSW5wdXRDZWxsOiBUVGV4dEFyZWFJbnB1dENlbGwgPSBmb3J3YXJkUmVmKCh7aW5wdXRQcm9wcywgLi4ucHJvcHN9LCBiYXNlUmVmKSA9PiB7XG4gIGNvbnN0IHtjZWxsUHJvcHMsIHJlZiwgaW5wdXRSZWZ9ID0gdXNlVGFibGVDZWxsVGV4dElucHV0PEhUTUxUZXh0QXJlYUVsZW1lbnQ+KHByb3BzLCBiYXNlUmVmKTtcblxuICBjb25zdCBbdmFsdWUsIHNldFZhbHVlXSA9IHVzZVN0YXRlKGlucHV0UHJvcHMudmFsdWUgPz8gJycpO1xuXG4gIGNvbnN0IG9uQ2hhbmdlOiBDaGFuZ2VFdmVudEhhbmRsZXI8SFRNTFRleHRBcmVhRWxlbWVudD4gPSBlID0+IHtcbiAgICBzZXRWYWx1ZShlLnRhcmdldC52YWx1ZSk7XG4gIH07XG5cbiAgY29uc3Qgb25LZXlEb3duOiBLZXlib2FyZEV2ZW50SGFuZGxlcjxIVE1MVGV4dEFyZWFFbGVtZW50PiA9IGUgPT4ge1xuICAgIGNvbnN0IGlzRW50ZXJDb2RlID0gZS5jb2RlID09PSAnRW50ZXInIHx8IGUuY29kZSA9PT0gJ051bXBhZEVudGVyJztcblxuICAgIGlmIChlLmNvZGUgPT09ICdFc2NhcGUnIHx8IChpc0VudGVyQ29kZSAmJiBlLmN0cmxLZXkpKSB7XG4gICAgICBwcm9wcy5zZXRJc0FjdGl2ZT8uKGZhbHNlKTtcbiAgICAgIGUuY3VycmVudFRhcmdldC5ibHVyKCk7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IG9uQmx1cjogRm9jdXNFdmVudEhhbmRsZXI8SFRNTFRleHRBcmVhRWxlbWVudD4gPSBlID0+IHtcbiAgICBwcm9wcy5zZXRJc0FjdGl2ZT8uKGZhbHNlKTtcblxuICAgIGlucHV0UHJvcHMub25DaGFuZ2UodmFsdWUsIGUpO1xuICAgIGlucHV0UHJvcHMub25CbHVyPy4oZSk7XG4gICAgcmVmLmN1cnJlbnQ/LmJsdXIoKTtcbiAgfTtcblxuICBjb25zdCBpc0NoaWxkSGlkZGVuID0gcHJvcHMuaXNBY3RpdmUgPyB0cnVlIDogdW5kZWZpbmVkO1xuXG4gIGNvbnN0IHJlc3VsdFByb3BzID0ge1xuICAgIC4uLmlucHV0UHJvcHMsXG5cbiAgICB2YWx1ZSxcbiAgICBvbkNoYW5nZSxcbiAgICBvbktleURvd24sXG4gICAgb25CbHVyLFxuXG4gICAgc2l6ZTogMCxcbiAgICAnZGF0YS1oaWRkZW4nOiBwcm9wcy5pc0FjdGl2ZSA/IHVuZGVmaW5lZCA6IHRydWUsXG4gIH07XG5cbiAgY29uc3QgY29udGVudCA9IHByb3BzLmlzQWN0aXZlID8gdmFsdWUgOiBwcm9wcy5jaGlsZHJlbjtcblxuICBjb25zdCBjb250ZW50UHJvcHMgPSB7XG4gICAgaXNNdWx0aWxpbmU6IGNlbGxQcm9wcy5pc011bHRpbGluZSxcbiAgICB3aGl0ZVNwYWNlOiBjZWxsUHJvcHMud2hpdGVTcGFjZSxcbiAgICB3b3JkQnJlYWs6IGNlbGxQcm9wcy53b3JkQnJlYWssXG4gIH07XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBzZXRWYWx1ZShpbnB1dFByb3BzLnZhbHVlKTtcbiAgfSwgW2lucHV0UHJvcHMudmFsdWVdKTtcblxuICByZXR1cm4gKFxuICAgIDxUYWJsZUNlbGwgey4uLmNlbGxQcm9wc30+XG4gICAgICA8VGFibGVDZWxsQ29udGVudCB7Li4uY29udGVudFByb3BzfT5cbiAgICAgICAgPENoaWxkQ29udGVudCBkYXRhLWhpZGRlbj17aXNDaGlsZEhpZGRlbn0+e2NvbnRlbnR9PC9DaGlsZENvbnRlbnQ+XG4gICAgICAgIDxUZXh0QXJlYSByZWY9e2lucHV0UmVmfSB7Li4ucmVzdWx0UHJvcHN9IC8+XG4gICAgICA8L1RhYmxlQ2VsbENvbnRlbnQ+XG4gICAgPC9UYWJsZUNlbGw+XG4gICk7XG59KTtcblxuZXhwb3J0IHR5cGUgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbFByb3BzPFQgPSBEZWZhdWx0QW55LCBWID0gRGVmYXVsdEFueT4gPSB7XG4gIGdldFZhbHVlOiAoY2VsbDogUmVhY3RUYWJsZUNlbGw8VCwgVj4pID0+IHN0cmluZztcbiAgb25DaGFuZ2U6IChjZWxsOiBSZWFjdFRhYmxlQ2VsbDxULCBWPiwgbmV3VmFsdWU6IHN0cmluZywgZTogRm9jdXNFdmVudDxIVE1MVGV4dEFyZWFFbGVtZW50PikgPT4gdm9pZDtcbn0gJiBPbWl0PFRleHRBcmVhSW5wdXRQcm9wcywgJ3ZhbHVlJyB8ICdvbkNoYW5nZSc+ICZcbiAgRGF0YUdyaWRUYWJsZUNlbGxQcm9wczxULCBWPiAmXG4gIFByb3BzV2l0aENoaWxkcmVuO1xuXG50eXBlIFREYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsID0gRlJDPEhUTUxUYWJsZUNlbGxFbGVtZW50LCBEYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsUHJvcHM+O1xuXG5leHBvcnQgY29uc3QgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbDogVERhdGFHcmlkVGV4dEFyZWFJbnB1dENlbGwgPSBmb3J3YXJkUmVmKChwcm9wcywgcmVmKSA9PiB7XG4gIGNvbnN0IHtjZWxsLCBnZXRWYWx1ZSwgb25DaGFuZ2UsIC4uLnJlc3R9ID0gcHJvcHM7XG5cbiAgY29uc3QgY2VsbFByb3BzID0gdXNlRGF0YUdyaWRJbnB1dENlbGwoY2VsbCk7XG5cbiAgY29uc3QgY29udGVudCA9IChjZWxsLmdldFZhbHVlKCkgPz8gbnVsbCkgYXMgUmVhY3ROb2RlO1xuXG4gIGNvbnN0IGlucHV0UHJvcHMgPSByZXN0IGFzIFRleHRBcmVhSW5wdXRQcm9wcztcbiAgaW5wdXRQcm9wcy52YWx1ZSA9IGdldFZhbHVlKGNlbGwpO1xuICBpbnB1dFByb3BzLm9uQ2hhbmdlID0gKG5ld1ZhbHVlLCBlKSA9PiBvbkNoYW5nZShjZWxsLCBuZXdWYWx1ZSwgZSk7XG5cbiAgcmV0dXJuIChcbiAgICA8VGV4dEFyZWFJbnB1dENlbGwgcmVmPXtyZWZ9IHsuLi5jZWxsUHJvcHN9IGlucHV0UHJvcHM9e2lucHV0UHJvcHN9PlxuICAgICAge2NvbnRlbnR9XG4gICAgPC9UZXh0QXJlYUlucHV0Q2VsbD5cbiAgKTtcbn0pO1xuXG5leHBvcnQgdHlwZSBHZXREYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsQXJnczxUID0gRGVmYXVsdEFueSwgViA9IERlZmF1bHRBbnk+ID0gT21pdDxcbiAgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbFByb3BzPFQsIFY+LFxuICAnY2VsbCcgfCAnY2hpbGRyZW4nXG4+O1xuXG5leHBvcnQgY29uc3QgZ2V0RGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbCA9IDxULCBWPihcbiAgYXJnczogR2V0RGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbEFyZ3M8VCwgVj5cbik6IENvbHVtbkRlZlRlbXBsYXRlPFQsIFY+ID0+IHtcbiAgcmV0dXJuICh7Y2VsbH0pID0+IHtcbiAgICBjb25zdCBjb250ZW50ID0gKGNlbGwuZ2V0VmFsdWUoKSA/PyBudWxsKSBhcyBSZWFjdE5vZGU7XG5cbiAgICByZXR1cm4gKFxuICAgICAgPERhdGFHcmlkVGV4dEFyZWFJbnB1dENlbGwga2V5PXtjZWxsLmlkfSBjZWxsPXtjZWxsfSB7Li4uYXJnc30+XG4gICAgICAgIHtjb250ZW50fVxuICAgICAgPC9EYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsPlxuICAgICk7XG4gIH07XG59O1xuIl19 */")), v = i(({
+})("position:absolute;top:0;left:0;width:100%;height:100%;min-width:10px;padding:0;background-color:transparent;border:none;outline:none;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;resize:none;", F.scroll, " &[data-hidden]{visibility:hidden;pointer-events:none;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGVJbnB1dENlbGwvdGV4dGFyZWEudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdDZ0MiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkL3NyYy9UYWJsZUlucHV0Q2VsbC90ZXh0YXJlYS50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCc7XG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHt1c2VFZmZlY3QsIHVzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgYmFzZVRoZW1lLCB7Zm9yd2FyZFJlZn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuXG5pbXBvcnQge1RhYmxlQ2VsbCwgVGFibGVDZWxsQ29udGVudH0gZnJvbSAnLi4vVGFibGVDZWxsJztcblxuaW1wb3J0IHt1c2VEYXRhR3JpZElucHV0Q2VsbCwgdXNlVGFibGVDZWxsVGV4dElucHV0fSBmcm9tICcuL2hvb2snO1xuXG5pbXBvcnQgdHlwZSB7XG4gIENoYW5nZUV2ZW50SGFuZGxlcixcbiAgRm9jdXNFdmVudCxcbiAgRm9jdXNFdmVudEhhbmRsZXIsXG4gIElucHV0SFRNTEF0dHJpYnV0ZXMsXG4gIEtleWJvYXJkRXZlbnRIYW5kbGVyLFxuICBSZWFjdE5vZGUsXG59IGZyb20gJ3JlYWN0JztcbmltcG9ydCB0eXBlIHtDZWxsIGFzIFJlYWN0VGFibGVDZWxsfSBmcm9tICdAdGFuc3RhY2svcmVhY3QtdGFibGUnO1xuaW1wb3J0IHR5cGUge0ZSQywgUHJvcHNXaXRoQ2hpbGRyZW59IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB0eXBlIHtEYXRhR3JpZFRhYmxlQ2VsbFByb3BzLCBUYWJsZUNlbGxQcm9wc30gZnJvbSAnLi4vVGFibGVDZWxsJztcbmltcG9ydCB0eXBlIHtDb2x1bW5EZWZUZW1wbGF0ZX0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IENoaWxkQ29udGVudCA9IHN0eWxlZC5kaXZgXG4gIG1pbi1oZWlnaHQ6IDEwMCU7XG4gICZbZGF0YS1oaWRkZW5dIHtcbiAgICB2aXNpYmlsaXR5OiBoaWRkZW47XG4gICAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gIH1cbmA7XG5cbmNvbnN0IFRleHRBcmVhID0gc3R5bGVkLnRleHRhcmVhYFxuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMDtcbiAgbGVmdDogMDtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogMTAwJTtcbiAgbWluLXdpZHRoOiAxMHB4O1xuICBwYWRkaW5nOiAwO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyOiBub25lO1xuICBvdXRsaW5lOiBub25lO1xuICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgZm9udC1zaXplOiBpbmhlcml0O1xuICBmb250LXdlaWdodDogaW5oZXJpdDtcbiAgbGluZS1oZWlnaHQ6IGluaGVyaXQ7XG4gIHJlc2l6ZTogbm9uZTtcblxuICAke2Jhc2VUaGVtZS5zY3JvbGx9XG5cbiAgJltkYXRhLWhpZGRlbl0ge1xuICAgIHZpc2liaWxpdHk6IGhpZGRlbjtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgfVxuYDtcblxuLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1leHBsaWNpdC1hbnlcbnR5cGUgRGVmYXVsdEFueSA9IGFueTtcblxuZXhwb3J0IHR5cGUgVGV4dEFyZWFJbnB1dFByb3BzID0ge1xuICB2YWx1ZTogc3RyaW5nO1xuICBvbkNoYW5nZTogKG5ld1ZhbHVlOiBzdHJpbmcsIGU6IEZvY3VzRXZlbnQ8SFRNTFRleHRBcmVhRWxlbWVudD4pID0+IHZvaWQ7XG59ICYgT21pdDxJbnB1dEhUTUxBdHRyaWJ1dGVzPEhUTUxUZXh0QXJlYUVsZW1lbnQ+LCAndmFsdWUnIHwgJ29uQ2hhbmdlJz47XG5cbnR5cGUgVFRleHRBcmVhSW5wdXRDZWxsID0gRlJDPFxuICBIVE1MVGFibGVDZWxsRWxlbWVudCxcbiAge1xuICAgIGlucHV0UHJvcHM6IFRleHRBcmVhSW5wdXRQcm9wcztcbiAgfSAmIE9taXQ8VGFibGVDZWxsUHJvcHMsICd2YWx1ZScgfCAnb25DaGFuZ2UnPlxuPjtcblxuZXhwb3J0IGNvbnN0IFRleHRBcmVhSW5wdXRDZWxsOiBUVGV4dEFyZWFJbnB1dENlbGwgPSBmb3J3YXJkUmVmKCh7aW5wdXRQcm9wcywgLi4ucHJvcHN9LCBiYXNlUmVmKSA9PiB7XG4gIGNvbnN0IHtjZWxsUHJvcHMsIHJlZiwgaW5wdXRSZWZ9ID0gdXNlVGFibGVDZWxsVGV4dElucHV0PEhUTUxUZXh0QXJlYUVsZW1lbnQ+KHByb3BzLCBiYXNlUmVmKTtcblxuICBjb25zdCBbdmFsdWUsIHNldFZhbHVlXSA9IHVzZVN0YXRlKGlucHV0UHJvcHMudmFsdWUgPz8gJycpO1xuXG4gIGNvbnN0IG9uQ2hhbmdlOiBDaGFuZ2VFdmVudEhhbmRsZXI8SFRNTFRleHRBcmVhRWxlbWVudD4gPSBlID0+IHtcbiAgICBzZXRWYWx1ZShlLnRhcmdldC52YWx1ZSk7XG4gIH07XG5cbiAgY29uc3Qgb25LZXlEb3duOiBLZXlib2FyZEV2ZW50SGFuZGxlcjxIVE1MVGV4dEFyZWFFbGVtZW50PiA9IGUgPT4ge1xuICAgIGNvbnN0IGlzRW50ZXJDb2RlID0gZS5jb2RlID09PSAnRW50ZXInIHx8IGUuY29kZSA9PT0gJ051bXBhZEVudGVyJztcblxuICAgIGlmIChlLmNvZGUgPT09ICdFc2NhcGUnIHx8IChpc0VudGVyQ29kZSAmJiBlLmN0cmxLZXkpKSB7XG4gICAgICBwcm9wcy5zZXRJc0FjdGl2ZT8uKGZhbHNlKTtcbiAgICAgIGUuY3VycmVudFRhcmdldC5ibHVyKCk7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IG9uQmx1cjogRm9jdXNFdmVudEhhbmRsZXI8SFRNTFRleHRBcmVhRWxlbWVudD4gPSBlID0+IHtcbiAgICBwcm9wcy5zZXRJc0FjdGl2ZT8uKGZhbHNlKTtcblxuICAgIGlucHV0UHJvcHMub25DaGFuZ2UodmFsdWUsIGUpO1xuICAgIGlucHV0UHJvcHMub25CbHVyPy4oZSk7XG4gICAgcmVmLmN1cnJlbnQ/LmJsdXIoKTtcbiAgfTtcblxuICBjb25zdCBpc0NoaWxkSGlkZGVuID0gcHJvcHMuaXNBY3RpdmUgPyB0cnVlIDogdW5kZWZpbmVkO1xuXG4gIGNvbnN0IHJlc3VsdFByb3BzID0ge1xuICAgIC4uLmlucHV0UHJvcHMsXG5cbiAgICB2YWx1ZSxcbiAgICBvbkNoYW5nZSxcbiAgICBvbktleURvd24sXG4gICAgb25CbHVyLFxuXG4gICAgc2l6ZTogMCxcbiAgICAnZGF0YS1oaWRkZW4nOiBwcm9wcy5pc0FjdGl2ZSA/IHVuZGVmaW5lZCA6IHRydWUsXG4gIH07XG5cbiAgY29uc3QgY29udGVudCA9IHByb3BzLmlzQWN0aXZlID8gdmFsdWUgOiBwcm9wcy5jaGlsZHJlbjtcblxuICBjb25zdCBjb250ZW50UHJvcHMgPSB7XG4gICAgaXNNdWx0aWxpbmU6IGNlbGxQcm9wcy5pc011bHRpbGluZSxcbiAgICB3aGl0ZVNwYWNlOiBjZWxsUHJvcHMud2hpdGVTcGFjZSxcbiAgICB3b3JkQnJlYWs6IGNlbGxQcm9wcy53b3JkQnJlYWssXG4gIH07XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBzZXRWYWx1ZShpbnB1dFByb3BzLnZhbHVlKTtcbiAgfSwgW2lucHV0UHJvcHMudmFsdWVdKTtcblxuICByZXR1cm4gKFxuICAgIDxUYWJsZUNlbGwgey4uLmNlbGxQcm9wc30+XG4gICAgICA8VGFibGVDZWxsQ29udGVudCB7Li4uY29udGVudFByb3BzfT5cbiAgICAgICAgPENoaWxkQ29udGVudCBkYXRhLWhpZGRlbj17aXNDaGlsZEhpZGRlbn0+e2NvbnRlbnR9PC9DaGlsZENvbnRlbnQ+XG4gICAgICAgIDxUZXh0QXJlYSByZWY9e2lucHV0UmVmfSB7Li4ucmVzdWx0UHJvcHN9IC8+XG4gICAgICA8L1RhYmxlQ2VsbENvbnRlbnQ+XG4gICAgPC9UYWJsZUNlbGw+XG4gICk7XG59KTtcblxuZXhwb3J0IHR5cGUgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbFByb3BzPFQgPSBEZWZhdWx0QW55LCBWID0gRGVmYXVsdEFueT4gPSB7XG4gIGdldFZhbHVlOiAoY2VsbDogUmVhY3RUYWJsZUNlbGw8VCwgVj4pID0+IHN0cmluZztcbiAgb25DaGFuZ2U6IChjZWxsOiBSZWFjdFRhYmxlQ2VsbDxULCBWPiwgbmV3VmFsdWU6IHN0cmluZywgZTogRm9jdXNFdmVudDxIVE1MVGV4dEFyZWFFbGVtZW50PikgPT4gdm9pZDtcbn0gJiBPbWl0PFRleHRBcmVhSW5wdXRQcm9wcywgJ3ZhbHVlJyB8ICdvbkNoYW5nZSc+ICZcbiAgRGF0YUdyaWRUYWJsZUNlbGxQcm9wczxULCBWPiAmXG4gIFByb3BzV2l0aENoaWxkcmVuO1xuXG50eXBlIFREYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsID0gRlJDPEhUTUxUYWJsZUNlbGxFbGVtZW50LCBEYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsUHJvcHM+O1xuXG5leHBvcnQgY29uc3QgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbDogVERhdGFHcmlkVGV4dEFyZWFJbnB1dENlbGwgPSBmb3J3YXJkUmVmKChwcm9wcywgcmVmKSA9PiB7XG4gIGNvbnN0IHtjZWxsLCBnZXRWYWx1ZSwgb25DaGFuZ2UsIC4uLnJlc3R9ID0gcHJvcHM7XG5cbiAgY29uc3QgY2VsbFByb3BzID0gdXNlRGF0YUdyaWRJbnB1dENlbGwoY2VsbCk7XG5cbiAgY29uc3QgY29udGVudCA9IChjZWxsLmdldFZhbHVlKCkgPz8gbnVsbCkgYXMgUmVhY3ROb2RlO1xuXG4gIGNvbnN0IGlucHV0UHJvcHMgPSByZXN0IGFzIFRleHRBcmVhSW5wdXRQcm9wcztcbiAgaW5wdXRQcm9wcy52YWx1ZSA9IGdldFZhbHVlKGNlbGwpO1xuICBpbnB1dFByb3BzLm9uQ2hhbmdlID0gKG5ld1ZhbHVlLCBlKSA9PiBvbkNoYW5nZShjZWxsLCBuZXdWYWx1ZSwgZSk7XG5cbiAgcmV0dXJuIChcbiAgICA8VGV4dEFyZWFJbnB1dENlbGwgcmVmPXtyZWZ9IHsuLi5jZWxsUHJvcHN9IGlucHV0UHJvcHM9e2lucHV0UHJvcHN9PlxuICAgICAge2NvbnRlbnR9XG4gICAgPC9UZXh0QXJlYUlucHV0Q2VsbD5cbiAgKTtcbn0pO1xuXG5leHBvcnQgdHlwZSBHZXREYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsQXJnczxUID0gRGVmYXVsdEFueSwgViA9IERlZmF1bHRBbnk+ID0gT21pdDxcbiAgRGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbFByb3BzPFQsIFY+LFxuICAnY2VsbCcgfCAnY2hpbGRyZW4nXG4+O1xuXG5leHBvcnQgY29uc3QgZ2V0RGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbCA9IDxULCBWPihcbiAgYXJnczogR2V0RGF0YUdyaWRUZXh0QXJlYUlucHV0Q2VsbEFyZ3M8VCwgVj5cbik6IENvbHVtbkRlZlRlbXBsYXRlPFQsIFY+ID0+IHtcbiAgcmV0dXJuICh7Y2VsbH0pID0+IHtcbiAgICBjb25zdCBjb250ZW50ID0gKGNlbGwuZ2V0VmFsdWUoKSA/PyBudWxsKSBhcyBSZWFjdE5vZGU7XG5cbiAgICByZXR1cm4gKFxuICAgICAgPERhdGFHcmlkVGV4dEFyZWFJbnB1dENlbGwga2V5PXtjZWxsLmlkfSBjZWxsPXtjZWxsfSB7Li4uYXJnc30+XG4gICAgICAgIHtjb250ZW50fVxuICAgICAgPC9EYXRhR3JpZFRleHRBcmVhSW5wdXRDZWxsPlxuICAgICk7XG4gIH07XG59O1xuIl19 */")), o = C(({
   inputProps: c,
   ...b
 }, G) => {
   const {
     cellProps: Z,
-    ref: X,
-    inputRef: R
-  } = U(b, G), [I, W] = F(c.value ?? ""), g = (l) => {
-    W(l.target.value);
+    ref: W,
+    inputRef: u
+  } = A(b, G), [I, V] = e(c.value ?? ""), g = (l) => {
+    V(l.target.value);
+  }, X = (l) => {
+    const H = l.code === "Enter" || l.code === "NumpadEnter";
+    (l.code === "Escape" || H && l.ctrlKey) && (b.setIsActive?.(!1), l.currentTarget.blur());
   }, n = (l) => {
-    var d;
-    const u = l.code === "Enter" || l.code === "NumpadEnter";
-    (l.code === "Escape" || u && l.ctrlKey) && ((d = b.setIsActive) == null || d.call(b, !1), l.currentTarget.blur());
-  }, C = (l) => {
-    var u, d, B;
-    (u = b.setIsActive) == null || u.call(b, !1), c.onChange(I, l), (d = c.onBlur) == null || d.call(c, l), (B = X.current) == null || B.blur();
-  }, H = b.isActive ? !0 : void 0, t = {
+    b.setIsActive?.(!1), c.onChange(I, l), c.onBlur?.(l), W.current?.blur();
+  }, B = b.isActive ? !0 : void 0, m = {
     ...c,
     value: I,
     onChange: g,
-    onKeyDown: n,
-    onBlur: C,
+    onKeyDown: X,
+    onBlur: n,
     size: 0,
     "data-hidden": b.isActive ? void 0 : !0
-  }, x = b.isActive ? I : b.children, e = {
+  }, i = b.isActive ? I : b.children, t = {
     isMultiline: Z.isMultiline,
     whiteSpace: Z.whiteSpace,
     wordBreak: Z.wordBreak
   };
-  return h(() => {
-    W(c.value);
-  }, [c.value]), /* @__PURE__ */ V(A, { ...Z, children: /* @__PURE__ */ s(Y, { ...e, children: [
-    /* @__PURE__ */ V(y, { "data-hidden": H, children: x }),
-    /* @__PURE__ */ V(o, { ref: R, ...t })
+  return s(() => {
+    V(c.value);
+  }, [c.value]), /* @__PURE__ */ d(h, { ...Z, children: /* @__PURE__ */ x(J, { ...t, children: [
+    /* @__PURE__ */ d(a, { "data-hidden": B, children: i }),
+    /* @__PURE__ */ d(N, { ref: u, ...m })
   ] }) });
-}), D = i((c, b) => {
+}), y = C((c, b) => {
   const {
     cell: G,
     getValue: Z,
-    onChange: X,
-    ...R
-  } = c, I = a(G), W = G.getValue() ?? null, g = R;
-  return g.value = Z(G), g.onChange = (n, C) => X(G, n, C), /* @__PURE__ */ V(v, { ref: b, ...I, inputProps: g, children: W });
-}), p = (c) => ({
+    onChange: W,
+    ...u
+  } = c, I = Y(G), V = G.getValue() ?? null, g = u;
+  return g.value = Z(G), g.onChange = (X, n) => W(G, X, n), /* @__PURE__ */ d(o, { ref: b, ...I, inputProps: g, children: V });
+}), E = (c) => ({
   cell: b
 }) => {
   const G = b.getValue() ?? null;
-  return /* @__PURE__ */ V(D, { cell: b, ...c, children: G }, b.id);
+  return /* @__PURE__ */ d(y, { cell: b, ...c, children: G }, b.id);
 };
 export {
-  D as DataGridTextAreaInputCell,
-  v as TextAreaInputCell,
-  p as getDataGridTextAreaInputCell
+  y as DataGridTextAreaInputCell,
+  o as TextAreaInputCell,
+  E as getDataGridTextAreaInputCell
 };
 //# sourceMappingURL=textarea.es.js.map

package/dist/TableInputCell/textarea.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.es.js","sources":["../../src/TableInputCell/textarea.tsx"],"sourcesContent":["'use client';\n\nimport styled from '@emotion/styled';\n\nimport {useEffect, useState} from 'react';\nimport baseTheme, {forwardRef} from '@join-x5/react-theme';\n\nimport {TableCell, TableCellContent} from '../TableCell';\n\nimport {useDataGridInputCell, useTableCellTextInput} from './hook';\n\nimport type {\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  InputHTMLAttributes,\n  KeyboardEventHandler,\n  ReactNode,\n} from 'react';\nimport type {Cell as ReactTableCell} from '@tanstack/react-table';\nimport type {FRC, PropsWithChildren} from '@join-x5/react-theme';\nimport type {DataGridTableCellProps, TableCellProps} from '../TableCell';\nimport type {ColumnDefTemplate} from './types';\n\nconst ChildContent = styled.div`\n  min-height: 100%;\n  &[data-hidden] {\n    visibility: hidden;\n    pointer-events: none;\n  }\n`;\n\nconst TextArea = styled.textarea`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  min-width: 10px;\n  padding: 0;\n  background-color: transparent;\n  border: none;\n  outline: none;\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  line-height: inherit;\n  resize: none;\n\n  ${baseTheme.scroll}\n\n  &[data-hidden] {\n    visibility: hidden;\n    pointer-events: none;\n  }\n`;\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype DefaultAny = any;\n\nexport type TextAreaInputProps = {\n  value: string;\n  onChange: (newValue: string, e: FocusEvent<HTMLTextAreaElement>) => void;\n} & Omit<InputHTMLAttributes<HTMLTextAreaElement>, 'value' | 'onChange'>;\n\ntype TTextAreaInputCell = FRC<\n  HTMLTableCellElement,\n  {\n    inputProps: TextAreaInputProps;\n  } & Omit<TableCellProps, 'value' | 'onChange'>\n>;\n\nexport const TextAreaInputCell: TTextAreaInputCell = forwardRef(({inputProps, ...props}, baseRef) => {\n  const {cellProps, ref, inputRef} = useTableCellTextInput<HTMLTextAreaElement>(props, baseRef);\n\n  const [value, setValue] = useState(inputProps.value ?? '');\n\n  const onChange: ChangeEventHandler<HTMLTextAreaElement> = e => {\n    setValue(e.target.value);\n  };\n\n  const onKeyDown: KeyboardEventHandler<HTMLTextAreaElement> = e => {\n    const isEnterCode = e.code === 'Enter' || e.code === 'NumpadEnter';\n\n    if (e.code === 'Escape' || (isEnterCode && e.ctrlKey)) {\n      props.setIsActive?.(false);\n      e.currentTarget.blur();\n    }\n  };\n\n  const onBlur: FocusEventHandler<HTMLTextAreaElement> = e => {\n    props.setIsActive?.(false);\n\n    inputProps.onChange(value, e);\n    inputProps.onBlur?.(e);\n    ref.current?.blur();\n  };\n\n  const isChildHidden = props.isActive ? true : undefined;\n\n  const resultProps = {\n    ...inputProps,\n\n    value,\n    onChange,\n    onKeyDown,\n    onBlur,\n\n    size: 0,\n    'data-hidden': props.isActive ? undefined : true,\n  };\n\n  const content = props.isActive ? value : props.children;\n\n  const contentProps = {\n    isMultiline: cellProps.isMultiline,\n    whiteSpace: cellProps.whiteSpace,\n    wordBreak: cellProps.wordBreak,\n  };\n\n  useEffect(() => {\n    setValue(inputProps.value);\n  }, [inputProps.value]);\n\n  return (\n    <TableCell {...cellProps}>\n      <TableCellContent {...contentProps}>\n        <ChildContent data-hidden={isChildHidden}>{content}</ChildContent>\n        <TextArea ref={inputRef} {...resultProps} />\n      </TableCellContent>\n    </TableCell>\n  );\n});\n\nexport type DataGridTextAreaInputCellProps<T = DefaultAny, V = DefaultAny> = {\n  getValue: (cell: ReactTableCell<T, V>) => string;\n  onChange: (cell: ReactTableCell<T, V>, newValue: string, e: FocusEvent<HTMLTextAreaElement>) => void;\n} & Omit<TextAreaInputProps, 'value' | 'onChange'> &\n  DataGridTableCellProps<T, V> &\n  PropsWithChildren;\n\ntype TDataGridTextAreaInputCell = FRC<HTMLTableCellElement, DataGridTextAreaInputCellProps>;\n\nexport const DataGridTextAreaInputCell: TDataGridTextAreaInputCell = forwardRef((props, ref) => {\n  const {cell, getValue, onChange, ...rest} = props;\n\n  const cellProps = useDataGridInputCell(cell);\n\n  const content = (cell.getValue() ?? null) as ReactNode;\n\n  const inputProps = rest as TextAreaInputProps;\n  inputProps.value = getValue(cell);\n  inputProps.onChange = (newValue, e) => onChange(cell, newValue, e);\n\n  return (\n    <TextAreaInputCell ref={ref} {...cellProps} inputProps={inputProps}>\n      {content}\n    </TextAreaInputCell>\n  );\n});\n\nexport type GetDataGridTextAreaInputCellArgs<T = DefaultAny, V = DefaultAny> = Omit<\n  DataGridTextAreaInputCellProps<T, V>,\n  'cell' | 'children'\n>;\n\nexport const getDataGridTextAreaInputCell = <T, V>(\n  args: GetDataGridTextAreaInputCellArgs<T, V>\n): ColumnDefTemplate<T, V> => {\n  return ({cell}) => {\n    const content = (cell.getValue() ?? null) as ReactNode;\n\n    return (\n      <DataGridTextAreaInputCell key={cell.id} cell={cell} {...args}>\n        {content}\n      </DataGridTextAreaInputCell>\n    );\n  };\n};\n"],"names":["inputProps","cellProps","ref","inputRef","setValue","blur","props","value","onChange","onKeyDown","onBlur","isMultiline","whiteSpace","wordBreak","useEffect","cell","getValue","rest"],"mappings":";;;;;;;AAAa;AAAA;AAAA;AAwBb;AAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQJ;AAAA;AAAA;AAAA;AAAA;AAwCmD;AAACA;AAAoB;AACpF;AAAM;AAACC;AAAWC;AAAKC;AAKrBC;AAAuB;;AAIvB;AAEA;AAEkBC;;AAKlBC;AAIaD;AAKK;AACfL;AAEHO;AACAC;AACAC;AACAC;AAEM;AACsC;AAKzB;AACIC;AACDC;AACDC;AAGvBC;AACEV;AAAyB;AAMrB;AAAmD;AACV;AAIjD;AAYE;AAAM;AAACW;AAAMC;AAAUR;AAAaS;AAOpCjB;AAQF;AAUU;AAACe;AACP;AAEA;AAKF;;;;;;"}
+{"version":3,"file":"textarea.es.js","sources":["../../src/TableInputCell/textarea.tsx"],"sourcesContent":["'use client';\n\nimport styled from '@emotion/styled';\n\nimport {useEffect, useState} from 'react';\nimport baseTheme, {forwardRef} from '@join-x5/react-theme';\n\nimport {TableCell, TableCellContent} from '../TableCell';\n\nimport {useDataGridInputCell, useTableCellTextInput} from './hook';\n\nimport type {\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  InputHTMLAttributes,\n  KeyboardEventHandler,\n  ReactNode,\n} from 'react';\nimport type {Cell as ReactTableCell} from '@tanstack/react-table';\nimport type {FRC, PropsWithChildren} from '@join-x5/react-theme';\nimport type {DataGridTableCellProps, TableCellProps} from '../TableCell';\nimport type {ColumnDefTemplate} from './types';\n\nconst ChildContent = styled.div`\n  min-height: 100%;\n  &[data-hidden] {\n    visibility: hidden;\n    pointer-events: none;\n  }\n`;\n\nconst TextArea = styled.textarea`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  min-width: 10px;\n  padding: 0;\n  background-color: transparent;\n  border: none;\n  outline: none;\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  line-height: inherit;\n  resize: none;\n\n  ${baseTheme.scroll}\n\n  &[data-hidden] {\n    visibility: hidden;\n    pointer-events: none;\n  }\n`;\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype DefaultAny = any;\n\nexport type TextAreaInputProps = {\n  value: string;\n  onChange: (newValue: string, e: FocusEvent<HTMLTextAreaElement>) => void;\n} & Omit<InputHTMLAttributes<HTMLTextAreaElement>, 'value' | 'onChange'>;\n\ntype TTextAreaInputCell = FRC<\n  HTMLTableCellElement,\n  {\n    inputProps: TextAreaInputProps;\n  } & Omit<TableCellProps, 'value' | 'onChange'>\n>;\n\nexport const TextAreaInputCell: TTextAreaInputCell = forwardRef(({inputProps, ...props}, baseRef) => {\n  const {cellProps, ref, inputRef} = useTableCellTextInput<HTMLTextAreaElement>(props, baseRef);\n\n  const [value, setValue] = useState(inputProps.value ?? '');\n\n  const onChange: ChangeEventHandler<HTMLTextAreaElement> = e => {\n    setValue(e.target.value);\n  };\n\n  const onKeyDown: KeyboardEventHandler<HTMLTextAreaElement> = e => {\n    const isEnterCode = e.code === 'Enter' || e.code === 'NumpadEnter';\n\n    if (e.code === 'Escape' || (isEnterCode && e.ctrlKey)) {\n      props.setIsActive?.(false);\n      e.currentTarget.blur();\n    }\n  };\n\n  const onBlur: FocusEventHandler<HTMLTextAreaElement> = e => {\n    props.setIsActive?.(false);\n\n    inputProps.onChange(value, e);\n    inputProps.onBlur?.(e);\n    ref.current?.blur();\n  };\n\n  const isChildHidden = props.isActive ? true : undefined;\n\n  const resultProps = {\n    ...inputProps,\n\n    value,\n    onChange,\n    onKeyDown,\n    onBlur,\n\n    size: 0,\n    'data-hidden': props.isActive ? undefined : true,\n  };\n\n  const content = props.isActive ? value : props.children;\n\n  const contentProps = {\n    isMultiline: cellProps.isMultiline,\n    whiteSpace: cellProps.whiteSpace,\n    wordBreak: cellProps.wordBreak,\n  };\n\n  useEffect(() => {\n    setValue(inputProps.value);\n  }, [inputProps.value]);\n\n  return (\n    <TableCell {...cellProps}>\n      <TableCellContent {...contentProps}>\n        <ChildContent data-hidden={isChildHidden}>{content}</ChildContent>\n        <TextArea ref={inputRef} {...resultProps} />\n      </TableCellContent>\n    </TableCell>\n  );\n});\n\nexport type DataGridTextAreaInputCellProps<T = DefaultAny, V = DefaultAny> = {\n  getValue: (cell: ReactTableCell<T, V>) => string;\n  onChange: (cell: ReactTableCell<T, V>, newValue: string, e: FocusEvent<HTMLTextAreaElement>) => void;\n} & Omit<TextAreaInputProps, 'value' | 'onChange'> &\n  DataGridTableCellProps<T, V> &\n  PropsWithChildren;\n\ntype TDataGridTextAreaInputCell = FRC<HTMLTableCellElement, DataGridTextAreaInputCellProps>;\n\nexport const DataGridTextAreaInputCell: TDataGridTextAreaInputCell = forwardRef((props, ref) => {\n  const {cell, getValue, onChange, ...rest} = props;\n\n  const cellProps = useDataGridInputCell(cell);\n\n  const content = (cell.getValue() ?? null) as ReactNode;\n\n  const inputProps = rest as TextAreaInputProps;\n  inputProps.value = getValue(cell);\n  inputProps.onChange = (newValue, e) => onChange(cell, newValue, e);\n\n  return (\n    <TextAreaInputCell ref={ref} {...cellProps} inputProps={inputProps}>\n      {content}\n    </TextAreaInputCell>\n  );\n});\n\nexport type GetDataGridTextAreaInputCellArgs<T = DefaultAny, V = DefaultAny> = Omit<\n  DataGridTextAreaInputCellProps<T, V>,\n  'cell' | 'children'\n>;\n\nexport const getDataGridTextAreaInputCell = <T, V>(\n  args: GetDataGridTextAreaInputCellArgs<T, V>\n): ColumnDefTemplate<T, V> => {\n  return ({cell}) => {\n    const content = (cell.getValue() ?? null) as ReactNode;\n\n    return (\n      <DataGridTextAreaInputCell key={cell.id} cell={cell} {...args}>\n        {content}\n      </DataGridTextAreaInputCell>\n    );\n  };\n};\n"],"names":["inputProps","cellProps","ref","inputRef","setValue","blur","props","value","onChange","onKeyDown","onBlur","isMultiline","whiteSpace","wordBreak","useEffect","cell","getValue","rest"],"mappings":";;;;;;;AAAa;AAAA;AAAA;AAwBb;AAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQJ;AAAA;AAAA;AAAA;AAAA;AAwCmD;AAACA;AAAoB;AACpF;AAAM;AAACC;AAAWC;AAAKC;AAKrBC;AAAuB;AAIvB;AAEA;AAEkBC;AAKlBC;AAIaD;AAKK;AACfL;AAEHO;AACAC;AACAC;AACAC;AAEM;AACsC;AAKzB;AACIC;AACDC;AACDC;AAGvBC;AACEV;AAAyB;AAMrB;AAAmD;AACV;AAIjD;AAYE;AAAM;AAACW;AAAMC;AAAUR;AAAaS;AAOpCjB;AAQF;AAUU;AAACe;AACP;AAEA;AAKF;;;;;;"}

package/dist/TableRow/index.d.ts

@@ -1,5 +1,4 @@
-import { FRC } from '@join-x5/react-theme';
+import { HTMLAttributes } from 'react';
 import { GetDataGridTableRow } from '../types';
-import { TableRowProps } from './types';
-export declare const TableRow: FRC<HTMLTableRowElement, TableRowProps>;
+export type TableRowProps = HTMLAttributes<HTMLTableRowElement>;
 export declare const getDataGridTableRow: GetDataGridTableRow;

package/dist/TableRow/index.es.js

@@ -1,25 +1,24 @@
 "use client";
-import { jsx as t } from "@emotion/react/jsx-runtime";
-import G from "@emotion/styled/base";
-import { forwardRef as d } from "@join-x5/react-theme";
-import { getDataGridTableCell as i } from "../TableCell/index.es.js";
-const I = /* @__PURE__ */ G("tr", process.env.NODE_ENV === "production" ? {
+import { jsx as l } from "@emotion/react/jsx-runtime";
+import I from "@emotion/styled/base";
+import { forwardRef as m } from "@join-x5/react-theme";
+import { getDataGridTableCell as Z } from "../TableCell/index.es.js";
+const g = /* @__PURE__ */ I("tr", process.env.NODE_ENV === "production" ? {
   target: "ewtrhmz0"
 } : {
   target: "ewtrhmz0",
-  label: "Container"
-})(":hover [data-cell]{:not([data-focused], [data-active], [data-disabled]) [data-edit-icon]{visibility:visible;}:not([data-focused], [data-active]):not(:focus){", (c) => ({
-  "--background-color": c.theme.colors.grey[10],
-  "--border-color": c.theme.colors.grey[20]
-}), ";}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGVSb3cvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWEyQiIsImZpbGUiOiIvaG9tZS9zYWR5a292c2Qvam9pbi14NS9wYWNrYWdlcy9kYXRhLWdyaWQvc3JjL1RhYmxlUm93L2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIid1c2UgY2xpZW50JztcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQge2ZvcndhcmRSZWZ9IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcblxuaW1wb3J0IHtnZXREYXRhR3JpZFRhYmxlQ2VsbH0gZnJvbSAnVGFibGVDZWxsJztcblxuaW1wb3J0IHR5cGUge0ZSQ30gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuaW1wb3J0IHR5cGUge1Jvd30gZnJvbSAnQHRhbnN0YWNrL3JlYWN0LXRhYmxlJztcbmltcG9ydCB0eXBlIHtHZXREYXRhR3JpZFRhYmxlUm93fSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgdHlwZSB7VGFibGVSb3dQcm9wc30gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC50cmBcbiAgOmhvdmVyIFtkYXRhLWNlbGxdIHtcbiAgICA6bm90KFtkYXRhLWZvY3VzZWRdLCBbZGF0YS1hY3RpdmVdLCBbZGF0YS1kaXNhYmxlZF0pIFtkYXRhLWVkaXQtaWNvbl0ge1xuICAgICAgdmlzaWJpbGl0eTogdmlzaWJsZTtcbiAgICB9XG5cbiAgICA6bm90KFtkYXRhLWZvY3VzZWRdLCBbZGF0YS1hY3RpdmVdKTpub3QoOmZvY3VzKSB7XG4gICAgICAke3Byb3BzID0+ICh7XG4gICAgICAgICctLWJhY2tncm91bmQtY29sb3InOiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF0sXG4gICAgICAgICctLWJvcmRlci1jb2xvcic6IHByb3BzLnRoZW1lLmNvbG9ycy5ncmV5WzIwXSxcbiAgICAgIH0pfVxuICAgIH1cbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IFRhYmxlUm93OiBGUkM8SFRNTFRhYmxlUm93RWxlbWVudCwgVGFibGVSb3dQcm9wcz4gPSBmb3J3YXJkUmVmKChwcm9wcywgcmVmKSA9PiB7XG4gIHJldHVybiA8Q29udGFpbmVyIHJlZj17cmVmfSB7Li4ucHJvcHN9IC8+O1xufSk7XG5cbnR5cGUgRGF0YUdyaWRUYWJsZVJvd1Byb3BzID0ge3JvdzogUm93PHVua25vd24+fSAmIFRhYmxlUm93UHJvcHM7XG5cbmNvbnN0IERhdGFHcmlkVGFibGVSb3c6IFJlYWN0LkZDPERhdGFHcmlkVGFibGVSb3dQcm9wcz4gPSBwcm9wcyA9PiB7XG4gIGNvbnN0IHtyb3csIC4uLnJlc3R9ID0gcHJvcHM7XG5cbiAgY29uc3QgY29udGVudCA9IHJvdy5nZXRWaXNpYmxlQ2VsbHMoKS5tYXAoZ2V0RGF0YUdyaWRUYWJsZUNlbGwpO1xuXG4gIHJldHVybiA8VGFibGVSb3cgey4uLnJlc3R9Pntjb250ZW50fTwvVGFibGVSb3c+O1xufTtcblxuZXhwb3J0IGNvbnN0IGdldERhdGFHcmlkVGFibGVSb3c6IEdldERhdGFHcmlkVGFibGVSb3cgPSByb3cgPT4ge1xuICByZXR1cm4gPERhdGFHcmlkVGFibGVSb3cga2V5PXtyb3cuaWR9IHJvdz17cm93fSAvPjtcbn07XG4iXX0= */")), e = d((c, b) => /* @__PURE__ */ t(I, { ref: b, ...c })), a = (c) => {
+  label: "TableRow"
+})(":hover [data-cell]{:not([data-focused], [data-active], [data-disabled]) [data-edit-icon]{visibility:visible;}:not([data-focused], [data-active]):not(:focus){", (b) => ({
+  "--background-color": b.theme.colors.grey[10],
+  "--border-color": b.theme.colors.grey[20]
+}), ";}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC9zcmMvVGFibGVSb3cvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWMwQiIsImZpbGUiOiIvaG9tZS9zYWR5a292c2Qvam9pbi14NS9wYWNrYWdlcy9kYXRhLWdyaWQvc3JjL1RhYmxlUm93L2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIid1c2UgY2xpZW50JztcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtmb3J3YXJkUmVmfSBmcm9tICdAam9pbi14NS9yZWFjdC10aGVtZSc7XG5cbmltcG9ydCB7Z2V0RGF0YUdyaWRUYWJsZUNlbGx9IGZyb20gJ1RhYmxlQ2VsbCc7XG5cbmltcG9ydCB0eXBlIHtIVE1MQXR0cmlidXRlc30gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHR5cGUge1Jvd30gZnJvbSAnQHRhbnN0YWNrL3JlYWN0LXRhYmxlJztcbmltcG9ydCB0eXBlIHtGUkN9IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB0eXBlIHtHZXREYXRhR3JpZFRhYmxlUm93fSBmcm9tICcuLi90eXBlcyc7XG5cbmV4cG9ydCB0eXBlIFRhYmxlUm93UHJvcHMgPSBIVE1MQXR0cmlidXRlczxIVE1MVGFibGVSb3dFbGVtZW50PjtcblxuY29uc3QgVGFibGVSb3cgPSBzdHlsZWQudHJgXG4gIDpob3ZlciBbZGF0YS1jZWxsXSB7XG4gICAgOm5vdChbZGF0YS1mb2N1c2VkXSwgW2RhdGEtYWN0aXZlXSwgW2RhdGEtZGlzYWJsZWRdKSBbZGF0YS1lZGl0LWljb25dIHtcbiAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgfVxuXG4gICAgOm5vdChbZGF0YS1mb2N1c2VkXSwgW2RhdGEtYWN0aXZlXSk6bm90KDpmb2N1cykge1xuICAgICAgJHtwcm9wcyA9PiAoe1xuICAgICAgICAnLS1iYWNrZ3JvdW5kLWNvbG9yJzogcHJvcHMudGhlbWUuY29sb3JzLmdyZXlbMTBdLFxuICAgICAgICAnLS1ib3JkZXItY29sb3InOiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsyMF0sXG4gICAgICB9KX1cbiAgICB9XG4gIH1cbmA7XG5cbnR5cGUgRGF0YUdyaWRUYWJsZVJvd1Byb3BzID0ge3JvdzogUm93PHVua25vd24+fSAmIFRhYmxlUm93UHJvcHM7XG5cbmNvbnN0IERhdGFHcmlkVGFibGVSb3c6IEZSQzxIVE1MVGFibGVSb3dFbGVtZW50LCBEYXRhR3JpZFRhYmxlUm93UHJvcHM+ID0gZm9yd2FyZFJlZigocHJvcHMsIHJlZikgPT4ge1xuICBjb25zdCB7cm93LCAuLi5yZXN0fSA9IHByb3BzO1xuXG4gIGNvbnN0IGNvbnRlbnQgPSByb3cuZ2V0VmlzaWJsZUNlbGxzKCkubWFwKGdldERhdGFHcmlkVGFibGVDZWxsKTtcblxuICByZXR1cm4gKFxuICAgIDxUYWJsZVJvdyByZWY9e3JlZn0gey4uLnJlc3R9PlxuICAgICAge2NvbnRlbnR9XG4gICAgPC9UYWJsZVJvdz5cbiAgKTtcbn0pO1xuXG5leHBvcnQgY29uc3QgZ2V0RGF0YUdyaWRUYWJsZVJvdzogR2V0RGF0YUdyaWRUYWJsZVJvdyA9IChyb3csIHByb3BzKSA9PiAoXG4gIDxEYXRhR3JpZFRhYmxlUm93IGtleT17cm93LmlkfSByb3c9e3Jvd30gey4uLnByb3BzfSAvPlxuKTtcbiJdfQ== */")), e = m((b, c) => {
   const {
-    row: b,
-    ...l
-  } = c, m = b.getVisibleCells().map(i);
-  return /* @__PURE__ */ t(e, { ...l, children: m });
-}, V = (c) => /* @__PURE__ */ t(a, { row: c }, c.id);
+    row: t,
+    ...d
+  } = b, G = t.getVisibleCells().map(Z);
+  return /* @__PURE__ */ l(g, { ref: c, ...d, children: G });
+}), W = (b, c) => /* @__PURE__ */ l(e, { row: b, ...c }, b.id);
 export {
-  e as TableRow,
-  V as getDataGridTableRow
+  W as getDataGridTableRow
 };
 //# sourceMappingURL=index.es.js.map

package/dist/TableRow/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../src/TableRow/index.tsx"],"sourcesContent":["'use client';\n\nimport styled from '@emotion/styled';\n\nimport {forwardRef} from '@join-x5/react-theme';\n\nimport {getDataGridTableCell} from 'TableCell';\n\nimport type {FRC} from '@join-x5/react-theme';\nimport type {Row} from '@tanstack/react-table';\nimport type {GetDataGridTableRow} from '../types';\nimport type {TableRowProps} from './types';\n\nconst Container = styled.tr`\n  :hover [data-cell] {\n    :not([data-focused], [data-active], [data-disabled]) [data-edit-icon] {\n      visibility: visible;\n    }\n\n    :not([data-focused], [data-active]):not(:focus) {\n      ${props => ({\n        '--background-color': props.theme.colors.grey[10],\n        '--border-color': props.theme.colors.grey[20],\n      })}\n    }\n  }\n`;\n\nexport const TableRow: FRC<HTMLTableRowElement, TableRowProps> = forwardRef((props, ref) => {\n  return <Container ref={ref} {...props} />;\n});\n\ntype DataGridTableRowProps = {row: Row<unknown>} & TableRowProps;\n\nconst DataGridTableRow: React.FC<DataGridTableRowProps> = props => {\n  const {row, ...rest} = props;\n\n  const content = row.getVisibleCells().map(getDataGridTableCell);\n\n  return <TableRow {...rest}>{content}</TableRow>;\n};\n\nexport const getDataGridTableRow: GetDataGridTableRow = row => {\n  return <DataGridTableRow key={row.id} row={row} />;\n};\n"],"names":["row","rest"],"mappings":";;;;;AAaA;AAAe;AAAA;AAAA;AAAA;AAAA;AAOG;AACsC;AAElD;AAYJ;AAAM;AAACA;AAAQC;AAIf;AACF;;;;;"}
+{"version":3,"file":"index.es.js","sources":["../../src/TableRow/index.tsx"],"sourcesContent":["'use client';\n\nimport styled from '@emotion/styled';\nimport {forwardRef} from '@join-x5/react-theme';\n\nimport {getDataGridTableCell} from 'TableCell';\n\nimport type {HTMLAttributes} from 'react';\nimport type {Row} from '@tanstack/react-table';\nimport type {FRC} from '@join-x5/react-theme';\nimport type {GetDataGridTableRow} from '../types';\n\nexport type TableRowProps = HTMLAttributes<HTMLTableRowElement>;\n\nconst TableRow = styled.tr`\n  :hover [data-cell] {\n    :not([data-focused], [data-active], [data-disabled]) [data-edit-icon] {\n      visibility: visible;\n    }\n\n    :not([data-focused], [data-active]):not(:focus) {\n      ${props => ({\n        '--background-color': props.theme.colors.grey[10],\n        '--border-color': props.theme.colors.grey[20],\n      })}\n    }\n  }\n`;\n\ntype DataGridTableRowProps = {row: Row<unknown>} & TableRowProps;\n\nconst DataGridTableRow: FRC<HTMLTableRowElement, DataGridTableRowProps> = forwardRef((props, ref) => {\n  const {row, ...rest} = props;\n\n  const content = row.getVisibleCells().map(getDataGridTableCell);\n\n  return (\n    <TableRow ref={ref} {...rest}>\n      {content}\n    </TableRow>\n  );\n});\n\nexport const getDataGridTableRow: GetDataGridTableRow = (row, props) => (\n  <DataGridTableRow key={row.id} row={row} {...props} />\n);\n"],"names":["row","rest"],"mappings":";;;;;AAcA;AAAc;AAAA;AAAA;AAAA;AAAA;AAOI;AACsC;AAElD;AAQJ;AAAM;AAACA;AAAQC;AAIf;AAKF;;;;"}

package/dist/hook.es.js

@@ -1,23 +1,20 @@
 "use client";
-import { useState as u, useMemo as N } from "react";
-import { useUpdateEffect as V } from "@join-x5/react-theme";
-import { ColumnArea as h } from "@join-x5/react-data-grid-settings";
-const y = (r) => !r || !r.length ? {} : r.reduce((n, i) => (n[i.id] = i.isVisible, n), {}), O = (r) => !r || !r.length ? [] : r.sort((n, i) => n.sort - i.sort).map((n) => String(n.id)), s = (r) => !r || !r.length ? {} : r.reduce((n, i) => {
-  var t, o;
-  return i.area === h.FixedLeft ? (n.left ?? (n.left = []), (t = n.left) == null || t.push(String(i.id))) : i.area === h.FixedRight && (n.right ?? (n.right = []), (o = n.right) == null || o.push(String(i.id))), n;
-}, {}), w = (r, n) => {
-  const [i, t] = u(y(r)), [o, S] = u(O(r)), [f, C] = u(s(r)), l = n == null ? void 0 : n.state, J = N(() => ({
+import { useState as o, useMemo as p } from "react";
+import { useUpdateEffect as C } from "@join-x5/react-theme";
+import { ColumnArea as c } from "@join-x5/react-data-grid-settings";
+const d = (r) => !r || !r.length ? {} : r.reduce((n, i) => (n[i.id] = i.isVisible, n), {}), g = (r) => !r || !r.length ? [] : r.sort((n, i) => n.sort - i.sort).map((n) => String(n.id)), h = (r) => !r || !r.length ? {} : r.reduce((n, i) => (i.area === c.FixedLeft ? (n.left ??= [], n.left?.push(String(i.id))) : i.area === c.FixedRight && (n.right ??= [], n.right?.push(String(i.id))), n), {}), V = (r, n) => {
+  const [i, y] = o(d(r)), [t, O] = o(g(r)), [u, a] = o(h(r)), f = n?.state, S = p(() => ({
     columnVisibility: i,
-    columnOrder: o,
-    columnPinning: f,
-    ...l
-  }), [l, i, o, f]);
-  return V(() => {
-    const m = y(r), d = O(r), g = s(r);
-    t((e) => JSON.stringify(e) === JSON.stringify(m) ? e : m), S((e) => JSON.stringify(e) === JSON.stringify(d) ? e : d), C((e) => JSON.stringify(e) === JSON.stringify(g) ? e : g);
-  }, [r]), J;
+    columnOrder: t,
+    columnPinning: u,
+    ...f
+  }), [f, i, t, u]);
+  return C(() => {
+    const l = d(r), s = g(r), m = h(r);
+    y((e) => JSON.stringify(e) === JSON.stringify(l) ? e : l), O((e) => JSON.stringify(e) === JSON.stringify(s) ? e : s), a((e) => JSON.stringify(e) === JSON.stringify(m) ? e : m);
+  }, [r]), S;
 };
 export {
-  w as useDataGridColumnSettings
+  V as useDataGridColumnSettings
 };
 //# sourceMappingURL=hook.es.js.map

package/dist/hook.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"hook.es.js","sources":["../src/hook.ts"],"sourcesContent":["'use client';\n\nimport {useMemo, useState} from 'react';\n\nimport {useUpdateEffect} from '@join-x5/react-theme';\nimport {ColumnArea} from '@join-x5/react-data-grid-settings';\n\nimport type {ColumnOrderState, ColumnPinningState, TableState, VisibilityState} from '@tanstack/react-table';\nimport type {ColumnItem} from '@join-x5/react-data-grid-settings';\nimport type {DataGridProps} from 'types';\n\nconst convertVisibility = (settings?: ColumnItem[]): VisibilityState => {\n  if (!settings || !settings.length) {\n    return {};\n  }\n\n  return settings.reduce((acc, item) => {\n    acc[item.id] = item.isVisible;\n    return acc;\n  }, {} as VisibilityState);\n};\n\nconst convertOrder = (settings?: ColumnItem[]): ColumnOrderState => {\n  if (!settings || !settings.length) {\n    return [];\n  }\n\n  return settings.sort((a, b) => a.sort - b.sort).map(item => String(item.id));\n};\n\nconst convertPinning = (settings?: ColumnItem[]): ColumnPinningState => {\n  if (!settings || !settings.length) {\n    return {};\n  }\n\n  return settings.reduce((acc, item) => {\n    if (item.area === ColumnArea.FixedLeft) {\n      acc.left ??= [];\n      acc.left?.push(String(item.id));\n    } else if (item.area === ColumnArea.FixedRight) {\n      acc.right ??= [];\n      acc.right?.push(String(item.id));\n    }\n\n    return acc;\n  }, {} as ColumnPinningState);\n};\n\nexport const useDataGridColumnSettings = (\n  settings?: DataGridProps['columnSettings'],\n  tableProps?: DataGridProps['tableProps']\n) => {\n  const [columnVisibility, onColumnVisibilityChange] = useState<VisibilityState>(convertVisibility(settings));\n  const [columnOrder, onColumnOrderChange] = useState<ColumnOrderState>(convertOrder(settings));\n  const [columnPinning, onColumnPinningChange] = useState<ColumnPinningState>(convertPinning(settings));\n\n  const externalState = tableProps?.state;\n\n  const state = useMemo((): Partial<TableState> => {\n    return {columnVisibility, columnOrder, columnPinning, ...externalState};\n  }, [externalState, columnVisibility, columnOrder, columnPinning]);\n\n  useUpdateEffect(() => {\n    const newVisibility = convertVisibility(settings);\n    const newOrder = convertOrder(settings);\n    const newPinning = convertPinning(settings);\n\n    onColumnVisibilityChange(oldState =>\n      JSON.stringify(oldState) === JSON.stringify(newVisibility) ? oldState : newVisibility\n    );\n\n    onColumnOrderChange(oldState => (JSON.stringify(oldState) === JSON.stringify(newOrder) ? oldState : newOrder));\n\n    onColumnPinningChange(oldState =>\n      JSON.stringify(oldState) === JSON.stringify(newPinning) ? oldState : newPinning\n    );\n  }, [settings]);\n\n  return state;\n};\n"],"names":["columnVisibility","columnOrder","columnPinning","externalState","useUpdateEffect","onColumnVisibilityChange"],"mappings":";;;;AAWA;;AAyBI;AASF;AAOA;AAOS;AAACA;AAAkBC;AAAaC;AAAkBC;AAG3DC;AACE;AAIAC;AAQA;AAIJ;;;;"}
+{"version":3,"file":"hook.es.js","sources":["../src/hook.ts"],"sourcesContent":["'use client';\n\nimport {useMemo, useState} from 'react';\n\nimport {useUpdateEffect} from '@join-x5/react-theme';\nimport {ColumnArea} from '@join-x5/react-data-grid-settings';\n\nimport type {ColumnOrderState, ColumnPinningState, TableState, VisibilityState} from '@tanstack/react-table';\nimport type {ColumnItem} from '@join-x5/react-data-grid-settings';\nimport type {DataGridProps} from 'types';\n\nconst convertVisibility = (settings?: ColumnItem[]): VisibilityState => {\n  if (!settings || !settings.length) {\n    return {};\n  }\n\n  return settings.reduce((acc, item) => {\n    acc[item.id] = item.isVisible;\n    return acc;\n  }, {} as VisibilityState);\n};\n\nconst convertOrder = (settings?: ColumnItem[]): ColumnOrderState => {\n  if (!settings || !settings.length) {\n    return [];\n  }\n\n  return settings.sort((a, b) => a.sort - b.sort).map(item => String(item.id));\n};\n\nconst convertPinning = (settings?: ColumnItem[]): ColumnPinningState => {\n  if (!settings || !settings.length) {\n    return {};\n  }\n\n  return settings.reduce((acc, item) => {\n    if (item.area === ColumnArea.FixedLeft) {\n      acc.left ??= [];\n      acc.left?.push(String(item.id));\n    } else if (item.area === ColumnArea.FixedRight) {\n      acc.right ??= [];\n      acc.right?.push(String(item.id));\n    }\n\n    return acc;\n  }, {} as ColumnPinningState);\n};\n\nexport const useDataGridColumnSettings = (\n  settings?: DataGridProps['columnSettings'],\n  tableProps?: DataGridProps['tableProps']\n) => {\n  const [columnVisibility, onColumnVisibilityChange] = useState<VisibilityState>(convertVisibility(settings));\n  const [columnOrder, onColumnOrderChange] = useState<ColumnOrderState>(convertOrder(settings));\n  const [columnPinning, onColumnPinningChange] = useState<ColumnPinningState>(convertPinning(settings));\n\n  const externalState = tableProps?.state;\n\n  const state = useMemo((): Partial<TableState> => {\n    return {columnVisibility, columnOrder, columnPinning, ...externalState};\n  }, [externalState, columnVisibility, columnOrder, columnPinning]);\n\n  useUpdateEffect(() => {\n    const newVisibility = convertVisibility(settings);\n    const newOrder = convertOrder(settings);\n    const newPinning = convertPinning(settings);\n\n    onColumnVisibilityChange(oldState =>\n      JSON.stringify(oldState) === JSON.stringify(newVisibility) ? oldState : newVisibility\n    );\n\n    onColumnOrderChange(oldState => (JSON.stringify(oldState) === JSON.stringify(newOrder) ? oldState : newOrder));\n\n    onColumnPinningChange(oldState =>\n      JSON.stringify(oldState) === JSON.stringify(newPinning) ? oldState : newPinning\n    );\n  }, [settings]);\n\n  return state;\n};\n"],"names":["columnVisibility","columnOrder","columnPinning","externalState","useUpdateEffect","onColumnVisibilityChange"],"mappings":";;;;AAWA;AAyCE;AAOS;AAACA;AAAkBC;AAAaC;AAAkBC;AAG3DC;AACE;AAIAC;AAQA;AAIJ;;;;"}