@foxford/ui 2.108.1 → 2.109.0

package/components/Textarea/Textarea.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.mjs","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useImperativeHandle,\n  useLayoutEffect,\n  useEffect,\n  useRef,\n  useState,\n  useMemo,\n  useCallback,\n} from 'react'\nimport { useTheme } from 'styled-components'\nimport { nanoid } from 'nanoid'\nimport { ResizeHandle } from '@foxford/icon-pack'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { InputLabel } from 'components/InputLabel'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useResizable } from 'hooks/useResizable'\nimport { createThrottledCallback } from 'shared/utils/misc'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { SIZES as SIZES_FORM_INPUT } from 'components/FormInput'\nimport { SIZES } from './sizes'\nimport * as Styled from './style'\nimport type { TextareaProps } from './types'\n\nconst COMPONENT_NAME = 'Textarea'\n\n/**\n *\n * Компонент для приема многострочного ввода.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<textarea\\> элемента.\n */\nconst Textarea: React.ForwardRefExoticComponent<TextareaProps> = withMergedProps<TextareaProps, HTMLTextAreaElement>(\n  forwardRef<HTMLTextAreaElement, MergedProps<TextareaProps>>((props, forwardedRef) => {\n    const theme = useTheme()\n\n    const {\n      size = 'm',\n      rows = 2,\n      maxRows = 30,\n      labelPosition = 'dynamic',\n      primary = true,\n      width = theme.defaultInputControlsWidth,\n      autosize = true,\n      rounded = true,\n      color = 'mineShaft',\n      placeholderColor = 'silver',\n      autoRows,\n      resize,\n      contrast,\n      inline,\n      secondary,\n      success,\n      error,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      sizes,\n      sizeUnits,\n      margin,\n      marginXXS,\n      marginXS,\n      marginS,\n      marginM,\n      marginL,\n      marginXL,\n      marginTop,\n      marginTopXXS,\n      marginTopXS,\n      marginTopS,\n      marginTopM,\n      marginTopL,\n      marginTopXL,\n      marginRight,\n      marginRightXXS,\n      marginRightXS,\n      marginRightS,\n      marginRightM,\n      marginRightL,\n      marginRightXL,\n      marginBottom,\n      marginBottomXXS,\n      marginBottomXS,\n      marginBottomS,\n      marginBottomM,\n      marginBottomL,\n      marginBottomXL,\n      marginLeft,\n      marginLeftXXS,\n      marginLeftXS,\n      marginLeftS,\n      marginLeftM,\n      marginLeftL,\n      marginLeftXL,\n      widthXXS,\n      widthXS,\n      widthS,\n      widthM,\n      widthL,\n      widthXL,\n      preset,\n      palette,\n      label,\n      fluid,\n      className,\n      style,\n      disabled,\n      ...textareaProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const textareaRef = useRef<HTMLTextAreaElement>(null)\n\n    const textareaMimicRef = useRef<HTMLTextAreaElement>(null)\n\n    const formInputLabelRef = useRef<HTMLDivElement>(null)\n\n    useImperativeHandle(forwardedRef, () => textareaRef.current as HTMLTextAreaElement, [])\n\n    const [resizing, handleResizeStart, handleResizeOnNudge] = useResizable<HTMLDivElement, HTMLSpanElement>({\n      target: formInputLabelRef,\n      direction: resize,\n    })\n\n    const labelId = useMemo(() => nanoid(), [])\n\n    const [active, setActive] = useState(() => {\n      const valueInit = textareaProps.value ?? textareaProps.defaultValue\n\n      return typeof valueInit === 'string' && valueInit.length > 0\n    })\n\n    const [autoRowsCount, setAutoRowsCount] = useState(() => Math.min(rows, maxRows))\n\n    const rowsVisible =\n      (preset === 'brand' && autoRows) || (preset !== 'brand' && autosize) ? autoRowsCount : Math.min(rows, maxRows)\n\n    const cursorResize = resize === 'horizontal' ? 'ew-resize' : resize === 'vertical' ? 'ns-resize' : 'nwse-resize'\n\n    const updateAutoRowsCount = useCallback(() => {\n      if (!textareaRef.current) return\n\n      if (preset === 'brand') {\n        if (!textareaMimicRef.current) return\n\n        textareaMimicRef.current.value = textareaRef.current.value\n\n        const nextRows = Math.max(\n          Math.round(textareaMimicRef.current.scrollHeight / textareaMimicRef.current.clientHeight),\n          rows\n        )\n\n        setAutoRowsCount(Math.min(nextRows, maxRows))\n\n        return\n      }\n\n      const styles = getComputedStyle(textareaRef.current)\n\n      const lineHeight = parseFloat(styles.lineHeight)\n\n      const nextRows = Math.max(\n        Math.round(\n          (textareaRef.current.scrollHeight - parseFloat(styles.paddingTop) - parseFloat(styles.paddingBottom)) /\n            (Number.isNaN(lineHeight) ? parseFloat(styles.fontSize) * 1.2 : lineHeight)\n        ),\n        rows\n      )\n\n      setAutoRowsCount((prevRows) => {\n        if (nextRows > prevRows) return Math.min(nextRows, maxRows)\n        if (textareaRef.current && !textareaRef.current.value) return rows\n\n        return prevRows\n      })\n    }, [preset, rows, maxRows])\n\n    useLayoutEffect(() => {\n      if (\n        preset === 'brand' &&\n        typeof textareaProps.value === 'string' &&\n        textareaRef.current &&\n        textareaRef.current !== document.activeElement\n      ) {\n        setActive(textareaProps.value.length > 0)\n      }\n    }, [preset, textareaProps.value])\n\n    useEffect(() => {\n      const handleResize = createThrottledCallback<UIEvent>(updateAutoRowsCount, 200)\n\n      if ((preset === 'brand' && autoRows) || (preset !== 'brand' && autosize)) {\n        updateAutoRowsCount()\n        window.addEventListener('resize', handleResize)\n      }\n\n      return () => {\n        window.removeEventListener('resize', handleResize)\n      }\n    }, [preset, autoRows, autosize, updateAutoRowsCount])\n\n    if (preset !== 'brand') {\n      return (\n        <Styled.Root\n          {...textareaProps}\n          ref={textareaRef}\n          className={className}\n          style={style}\n          onChange={(evt) => {\n            if (autosize) updateAutoRowsCount()\n            if (textareaProps.onChange) textareaProps.onChange(evt)\n          }}\n          rows={rowsVisible}\n          color={color}\n          rounded={rounded}\n          placeholderColor={placeholderColor}\n          disabled={disabled}\n          error={error}\n          fluid={fluid}\n          width={width}\n          widthXXS={widthXXS}\n          widthXS={widthXS}\n          widthS={widthS}\n          widthM={widthM}\n          widthL={widthL}\n          widthXL={widthXL}\n        />\n      )\n    }\n\n    return (\n      <FormInputLabel\n        {...sizeProps}\n        ref={formInputLabelRef}\n        sizes={sizes}\n        sizeUnits={sizeUnits}\n        margin={margin}\n        marginXXS={marginXXS}\n        marginXS={marginXS}\n        marginS={marginS}\n        marginM={marginM}\n        marginL={marginL}\n        marginXL={marginXL}\n        marginTop={marginTop}\n        marginTopXXS={marginTopXXS}\n        marginTopXS={marginTopXS}\n        marginTopS={marginTopS}\n        marginTopM={marginTopM}\n        marginTopL={marginTopL}\n        marginTopXL={marginTopXL}\n        marginRight={marginRight}\n        marginRightXXS={marginRightXXS}\n        marginRightXS={marginRightXS}\n        marginRightS={marginRightS}\n        marginRightM={marginRightM}\n        marginRightL={marginRightL}\n        marginRightXL={marginRightXL}\n        marginBottom={marginBottom}\n        marginBottomXXS={marginBottomXXS}\n        marginBottomXS={marginBottomXS}\n        marginBottomS={marginBottomS}\n        marginBottomM={marginBottomM}\n        marginBottomL={marginBottomL}\n        marginBottomXL={marginBottomXL}\n        marginLeft={marginLeft}\n        marginLeftXXS={marginLeftXXS}\n        marginLeftXS={marginLeftXS}\n        marginLeftS={marginLeftS}\n        marginLeftM={marginLeftM}\n        marginLeftL={marginLeftL}\n        marginLeftXL={marginLeftXL}\n        className={className}\n        style={style}\n        contrast={contrast}\n        error={error}\n        inline={inline}\n        disabled={disabled}\n        primary={primary}\n        secondary={secondary}\n        success={success}\n        palette={{\n          color: disabled ? palette.colorDisabled : palette.color,\n          backgroundColor: disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n          backgroundColorHover: disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n          borderColor: disabled ? palette.borderColorDisabled : palette.borderColor,\n        }}\n        onClick={() => {\n          if (textareaRef.current) {\n            textareaRef.current.focus()\n          }\n        }}\n        onFocus={() => {\n          setActive(true)\n        }}\n        onPointerDown={(evt) => {\n          if (evt.target === textareaRef.current || !(evt.target instanceof Node)) {\n            return\n          }\n          evt.preventDefault()\n        }}\n        onBlur={(evt) => {\n          if (textareaRef.current && !evt.currentTarget.contains(evt.relatedTarget)) {\n            setActive(Boolean(textareaRef.current.value))\n          }\n        }}\n        overflow='hidden'\n        input={\n          <InputLabel\n            {...sizeProps}\n            sizes={SIZES_FORM_INPUT}\n            active={active}\n            label={label}\n            labelId={labelId}\n            labelPosition={labelPosition}\n          >\n            {autoRows ? <Styled.TextareaMimic ref={textareaMimicRef} rows={1} /> : null}\n            <Styled.Textarea\n              {...textareaProps}\n              ref={textareaRef}\n              aria-labelledby={label ? labelId : undefined}\n              disabled={disabled}\n              onChange={(evt) => {\n                if (autoRows) updateAutoRowsCount()\n                if (textareaProps.onChange) textareaProps.onChange(evt)\n              }}\n              rows={rowsVisible}\n              palette={{\n                color: palette.color,\n                colorDisabled: palette.colorDisabled,\n                placeholderColor: palette.placeholderColor,\n                placeholderColorDisabled: palette.placeholderColorDisabled,\n              }}\n            />\n          </InputLabel>\n        }\n        addonRight={\n          resize ? (\n            <>\n              {resizing ? <Styled.ResizeGlobals cursor={cursorResize} /> : null}\n              <Styled.ResizeIcon\n                size='l'\n                icon={<ResizeHandle />}\n                color='border-onmain-default-small'\n                tabIndex={0}\n                onPointerDown={handleResizeStart}\n                onKeyDown={handleResizeOnNudge}\n                cursor={cursorResize}\n              />\n            </>\n          ) : null\n        }\n      />\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: SIZES,\n  }\n)\n\nexport { Textarea, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Textarea","withMergedProps","forwardRef","props","forwardedRef","theme","useTheme","size","rows","maxRows","labelPosition","primary","width","defaultInputControlsWidth","autosize","rounded","color","placeholderColor","autoRows","resize","contrast","inline","secondary","success","error","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizes","sizeUnits","margin","marginXXS","marginXS","marginS","marginM","marginL","marginXL","marginTop","marginTopXXS","marginTopXS","marginTopS","marginTopM","marginTopL","marginTopXL","marginRight","marginRightXXS","marginRightXS","marginRightS","marginRightM","marginRightL","marginRightXL","marginBottom","marginBottomXXS","marginBottomXS","marginBottomS","marginBottomM","marginBottomL","marginBottomXL","marginLeft","marginLeftXXS","marginLeftXS","marginLeftS","marginLeftM","marginLeftL","marginLeftXL","widthXXS","widthXS","widthS","widthM","widthL","widthXL","preset","palette","label","fluid","className","style","disabled","textareaProps","sizeProps","textareaRef","useRef","textareaMimicRef","formInputLabelRef","useImperativeHandle","current","resizing","handleResizeStart","handleResizeOnNudge","useResizable","target","direction","labelId","useMemo","nanoid","active","setActive","useState","valueInit","value","defaultValue","length","autoRowsCount","setAutoRowsCount","Math","min","rowsVisible","cursorResize","updateAutoRowsCount","useCallback","nextRows","max","round","scrollHeight","clientHeight","styles","getComputedStyle","lineHeight","parseFloat","paddingTop","paddingBottom","Number","isNaN","fontSize","prevRows","useLayoutEffect","document","activeElement","useEffect","handleResize","createThrottledCallback","window","addEventListener","removeEventListener","_jsx","Styled","ref","onChange","evt","FormInputLabel","colorDisabled","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","focus","onFocus","onPointerDown","Node","preventDefault","onBlur","currentTarget","contains","relatedTarget","Boolean","overflow","input","_jsxs","InputLabel","SIZES_FORM_INPUT","children","undefined","placeholderColorDisabled","addonRight","_Fragment","cursor","icon","ResizeHandle","tabIndex","onKeyDown","displayName","SIZES"],"mappings":"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"}
+{"version":3,"file":"Textarea.mjs","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useImperativeHandle,\n  useLayoutEffect,\n  useEffect,\n  useRef,\n  useState,\n  useMemo,\n  useCallback,\n} from 'react'\nimport { useTheme } from 'styled-components'\nimport { nanoid } from 'nanoid'\nimport { ResizeHandle } from '@foxford/icon-pack'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { InputLabel } from 'components/InputLabel'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useResizable } from 'hooks/useResizable'\nimport { createThrottledCallback } from 'shared/utils/misc'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { SIZES as SIZES_FORM_INPUT } from 'components/FormInput'\nimport { SIZES } from './sizes'\nimport * as Styled from './style'\nimport type { TextareaProps } from './types'\n\nconst COMPONENT_NAME = 'Textarea'\n\n/**\n *\n * Компонент для приема многострочного ввода.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<textarea\\> элемента.\n */\nconst Textarea: React.ForwardRefExoticComponent<TextareaProps> = withMergedProps<TextareaProps, HTMLTextAreaElement>(\n  forwardRef<HTMLTextAreaElement, MergedProps<TextareaProps>>((props, forwardedRef) => {\n    const theme = useTheme()\n\n    const {\n      size = 'm',\n      rows = 2,\n      maxRows = 30,\n      labelPosition = 'dynamic',\n      primary = true,\n      width = theme.defaultInputControlsWidth,\n      autosize = true,\n      rounded = true,\n      color = 'mineShaft',\n      placeholderColor = 'silver',\n      autoRows,\n      resize,\n      contrast,\n      inline,\n      secondary,\n      success,\n      error,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      sizes,\n      sizeUnits,\n      margin,\n      marginXXS,\n      marginXS,\n      marginS,\n      marginM,\n      marginL,\n      marginXL,\n      marginTop,\n      marginTopXXS,\n      marginTopXS,\n      marginTopS,\n      marginTopM,\n      marginTopL,\n      marginTopXL,\n      marginRight,\n      marginRightXXS,\n      marginRightXS,\n      marginRightS,\n      marginRightM,\n      marginRightL,\n      marginRightXL,\n      marginBottom,\n      marginBottomXXS,\n      marginBottomXS,\n      marginBottomS,\n      marginBottomM,\n      marginBottomL,\n      marginBottomXL,\n      marginLeft,\n      marginLeftXXS,\n      marginLeftXS,\n      marginLeftS,\n      marginLeftM,\n      marginLeftL,\n      marginLeftXL,\n      widthXXS,\n      widthXS,\n      widthS,\n      widthM,\n      widthL,\n      widthXL,\n      preset,\n      palette,\n      label,\n      fluid,\n      className,\n      style,\n      disabled,\n      ...textareaProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const textareaRef = useRef<HTMLTextAreaElement>(null)\n\n    const textareaMimicRef = useRef<HTMLTextAreaElement>(null)\n\n    const formInputLabelRef = useRef<HTMLDivElement>(null)\n\n    useImperativeHandle(forwardedRef, () => textareaRef.current as HTMLTextAreaElement, [])\n\n    const [resizing, handleResizeStart, handleResizeOnNudge] = useResizable<HTMLDivElement, HTMLSpanElement>({\n      target: formInputLabelRef,\n      direction: resize,\n    })\n\n    const labelId = useMemo(() => nanoid(), [])\n\n    const [active, setActive] = useState(() => {\n      const valueInit = textareaProps.value ?? textareaProps.defaultValue\n\n      return typeof valueInit === 'string' && valueInit.length > 0\n    })\n\n    const [autoRowsCount, setAutoRowsCount] = useState(() => Math.min(rows, maxRows))\n\n    const rowsVisible =\n      (preset === 'brand' && autoRows) || (preset !== 'brand' && autosize) ? autoRowsCount : Math.min(rows, maxRows)\n\n    const cursorResize = resize === 'horizontal' ? 'ew-resize' : resize === 'vertical' ? 'ns-resize' : 'nwse-resize'\n\n    const updateAutoRowsCount = useCallback(() => {\n      if (!textareaRef.current) return\n\n      if (preset === 'brand') {\n        if (!textareaMimicRef.current) return\n\n        textareaMimicRef.current.value = textareaRef.current.value\n\n        const nextRows = Math.max(\n          Math.round(textareaMimicRef.current.scrollHeight / textareaMimicRef.current.clientHeight),\n          rows\n        )\n\n        setAutoRowsCount(Math.min(nextRows, maxRows))\n\n        return\n      }\n\n      const styles = getComputedStyle(textareaRef.current)\n\n      const lineHeight = parseFloat(styles.lineHeight)\n\n      const nextRows = Math.max(\n        Math.round(\n          (textareaRef.current.scrollHeight - parseFloat(styles.paddingTop) - parseFloat(styles.paddingBottom)) /\n            (Number.isNaN(lineHeight) ? parseFloat(styles.fontSize) * 1.2 : lineHeight)\n        ),\n        rows\n      )\n\n      setAutoRowsCount((prevRows) => {\n        if (nextRows > prevRows) return Math.min(nextRows, maxRows)\n        if (textareaRef.current && !textareaRef.current.value) return rows\n\n        return prevRows\n      })\n    }, [preset, rows, maxRows])\n\n    useLayoutEffect(() => {\n      if (\n        preset === 'brand' &&\n        typeof textareaProps.value === 'string' &&\n        textareaRef.current &&\n        textareaRef.current !== document.activeElement\n      ) {\n        setActive(textareaProps.value.length > 0)\n      }\n    }, [preset, textareaProps.value])\n\n    useEffect(() => {\n      const handleResize = createThrottledCallback<UIEvent>(updateAutoRowsCount, 200)\n\n      if ((preset === 'brand' && autoRows) || (preset !== 'brand' && autosize)) {\n        updateAutoRowsCount()\n        window.addEventListener('resize', handleResize)\n      }\n\n      return () => {\n        window.removeEventListener('resize', handleResize)\n      }\n    }, [preset, autoRows, autosize, updateAutoRowsCount])\n\n    if (preset !== 'brand') {\n      return (\n        <Styled.Root\n          {...textareaProps}\n          ref={textareaRef}\n          className={className}\n          style={style}\n          onChange={(evt) => {\n            if (autosize) updateAutoRowsCount()\n            if (textareaProps.onChange) textareaProps.onChange(evt)\n          }}\n          rows={rowsVisible}\n          color={color}\n          rounded={rounded}\n          placeholderColor={placeholderColor}\n          disabled={disabled}\n          error={error}\n          fluid={fluid}\n          width={width}\n          widthXXS={widthXXS}\n          widthXS={widthXS}\n          widthS={widthS}\n          widthM={widthM}\n          widthL={widthL}\n          widthXL={widthXL}\n        />\n      )\n    }\n\n    return (\n      <FormInputLabel\n        {...sizeProps}\n        ref={formInputLabelRef}\n        sizes={sizes}\n        sizeUnits={sizeUnits}\n        margin={margin}\n        marginXXS={marginXXS}\n        marginXS={marginXS}\n        marginS={marginS}\n        marginM={marginM}\n        marginL={marginL}\n        marginXL={marginXL}\n        marginTop={marginTop}\n        marginTopXXS={marginTopXXS}\n        marginTopXS={marginTopXS}\n        marginTopS={marginTopS}\n        marginTopM={marginTopM}\n        marginTopL={marginTopL}\n        marginTopXL={marginTopXL}\n        marginRight={marginRight}\n        marginRightXXS={marginRightXXS}\n        marginRightXS={marginRightXS}\n        marginRightS={marginRightS}\n        marginRightM={marginRightM}\n        marginRightL={marginRightL}\n        marginRightXL={marginRightXL}\n        marginBottom={marginBottom}\n        marginBottomXXS={marginBottomXXS}\n        marginBottomXS={marginBottomXS}\n        marginBottomS={marginBottomS}\n        marginBottomM={marginBottomM}\n        marginBottomL={marginBottomL}\n        marginBottomXL={marginBottomXL}\n        marginLeft={marginLeft}\n        marginLeftXXS={marginLeftXXS}\n        marginLeftXS={marginLeftXS}\n        marginLeftS={marginLeftS}\n        marginLeftM={marginLeftM}\n        marginLeftL={marginLeftL}\n        marginLeftXL={marginLeftXL}\n        className={className}\n        style={style}\n        contrast={contrast}\n        error={error}\n        inline={inline}\n        disabled={disabled}\n        primary={primary}\n        secondary={secondary}\n        success={success}\n        palette={{\n          color: disabled ? palette.colorDisabled : palette.color,\n          backgroundColor: disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n          backgroundColorHover: disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n          borderColor: disabled ? palette.borderColorDisabled : palette.borderColor,\n        }}\n        onClick={() => {\n          if (textareaRef.current) {\n            textareaRef.current.focus()\n          }\n        }}\n        onFocus={() => {\n          setActive(true)\n        }}\n        onPointerDown={(evt) => {\n          if (evt.target === textareaRef.current || !(evt.target instanceof Node)) {\n            return\n          }\n          evt.preventDefault()\n        }}\n        onBlur={(evt) => {\n          if (textareaRef.current && !evt.currentTarget.contains(evt.relatedTarget)) {\n            setActive(Boolean(textareaRef.current.value))\n          }\n        }}\n        overflow='hidden'\n        input={\n          <InputLabel\n            {...sizeProps}\n            sizes={SIZES_FORM_INPUT}\n            active={active}\n            label={label}\n            labelId={labelId}\n            labelPosition={labelPosition}\n          >\n            {autoRows ? <Styled.TextareaMimic ref={textareaMimicRef} rows={1} /> : null}\n            <Styled.Textarea\n              {...textareaProps}\n              ref={textareaRef}\n              aria-labelledby={label ? labelId : undefined}\n              disabled={disabled}\n              onChange={(evt) => {\n                if (autoRows) updateAutoRowsCount()\n                if (textareaProps.onChange) textareaProps.onChange(evt)\n              }}\n              rows={rowsVisible}\n              palette={{\n                color: palette.color,\n                colorDisabled: palette.colorDisabled,\n                placeholderColor: palette.placeholderColor,\n                placeholderColorDisabled: palette.placeholderColorDisabled,\n              }}\n            />\n          </InputLabel>\n        }\n        floats={\n          resize ? (\n            <>\n              {resizing ? <Styled.ResizeGlobals cursor={cursorResize} /> : null}\n              <Styled.ResizeIcon\n                size='l'\n                icon={<ResizeHandle />}\n                color='border-onmain-default-small'\n                tabIndex={0}\n                onPointerDown={handleResizeStart}\n                onKeyDown={handleResizeOnNudge}\n                cursor={cursorResize}\n              />\n            </>\n          ) : undefined\n        }\n      />\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: SIZES,\n  }\n)\n\nexport { Textarea, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Textarea","withMergedProps","forwardRef","props","forwardedRef","theme","useTheme","size","rows","maxRows","labelPosition","primary","width","defaultInputControlsWidth","autosize","rounded","color","placeholderColor","autoRows","resize","contrast","inline","secondary","success","error","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizes","sizeUnits","margin","marginXXS","marginXS","marginS","marginM","marginL","marginXL","marginTop","marginTopXXS","marginTopXS","marginTopS","marginTopM","marginTopL","marginTopXL","marginRight","marginRightXXS","marginRightXS","marginRightS","marginRightM","marginRightL","marginRightXL","marginBottom","marginBottomXXS","marginBottomXS","marginBottomS","marginBottomM","marginBottomL","marginBottomXL","marginLeft","marginLeftXXS","marginLeftXS","marginLeftS","marginLeftM","marginLeftL","marginLeftXL","widthXXS","widthXS","widthS","widthM","widthL","widthXL","preset","palette","label","fluid","className","style","disabled","textareaProps","sizeProps","textareaRef","useRef","textareaMimicRef","formInputLabelRef","useImperativeHandle","current","resizing","handleResizeStart","handleResizeOnNudge","useResizable","target","direction","labelId","useMemo","nanoid","active","setActive","useState","valueInit","value","defaultValue","length","autoRowsCount","setAutoRowsCount","Math","min","rowsVisible","cursorResize","updateAutoRowsCount","useCallback","nextRows","max","round","scrollHeight","clientHeight","styles","getComputedStyle","lineHeight","parseFloat","paddingTop","paddingBottom","Number","isNaN","fontSize","prevRows","useLayoutEffect","document","activeElement","useEffect","handleResize","createThrottledCallback","window","addEventListener","removeEventListener","_jsx","Styled","ref","onChange","evt","FormInputLabel","colorDisabled","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","focus","onFocus","onPointerDown","Node","preventDefault","onBlur","currentTarget","contains","relatedTarget","Boolean","overflow","input","_jsxs","InputLabel","SIZES_FORM_INPUT","children","undefined","placeholderColorDisabled","floats","_Fragment","cursor","icon","ResizeHandle","tabIndex","onKeyDown","displayName","SIZES"],"mappings":"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"}

package/components/Textarea/sizes.js

@@ -1,2 +1,2 @@
-'use strict';var sizes=require('../FormInputLabel/sizes.js');const SIZES={l:{...sizes.SIZES.l,paddingRight:sizes.SIZES.l.paddingLeft,paddingBottom:8,height:'auto'},m:{...sizes.SIZES.m,paddingRight:sizes.SIZES.m.paddingLeft,paddingBottom:7,height:'auto'},s:{...sizes.SIZES.s,paddingRight:sizes.SIZES.s.paddingLeft,paddingBottom:6,height:'auto'},xs:{...sizes.SIZES.xs,paddingRight:sizes.SIZES.xs.paddingLeft,paddingBottom:5,height:'auto'}};exports.SIZES=SIZES;
+'use strict';var sizes=require('../FormInputLabel/sizes.js');const SIZES={l:{...sizes.SIZES.l,height:'auto'},m:{...sizes.SIZES.m,height:'auto'},s:{...sizes.SIZES.s,height:'auto'},xs:{...sizes.SIZES.xs,height:'auto'}};exports.SIZES=SIZES;
 //# sourceMappingURL=sizes.js.map

package/components/Textarea/sizes.js.map

@@ -1 +1 @@
-{"version":3,"file":"sizes.js","sources":["../../../../src/components/Textarea/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_FORM_INPUT_LABEL } from 'components/FormInputLabel'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    ...SIZES_FORM_INPUT_LABEL.l,\n    paddingRight: SIZES_FORM_INPUT_LABEL.l.paddingLeft,\n    paddingBottom: 8,\n    height: 'auto',\n  },\n  m: {\n    ...SIZES_FORM_INPUT_LABEL.m,\n    paddingRight: SIZES_FORM_INPUT_LABEL.m.paddingLeft,\n    paddingBottom: 7,\n    height: 'auto',\n  },\n  s: {\n    ...SIZES_FORM_INPUT_LABEL.s,\n    paddingRight: SIZES_FORM_INPUT_LABEL.s.paddingLeft,\n    paddingBottom: 6,\n    height: 'auto',\n  },\n  xs: {\n    ...SIZES_FORM_INPUT_LABEL.xs,\n    paddingRight: SIZES_FORM_INPUT_LABEL.xs.paddingLeft,\n    paddingBottom: 5,\n    height: 'auto',\n  },\n}\n"],"names":["SIZES","l","SIZES_FORM_INPUT_LABEL","paddingRight","paddingLeft","paddingBottom","height","m","s","xs"],"mappings":"6DAIO,MAAMA,MAAqC,CAChDC,EAAG,IACEC,MAAAA,MAAuBD,EAC1BE,aAAcD,MAAAA,MAAuBD,EAAEG,YACvCC,cAAe,EACfC,OAAQ,QAEVC,EAAG,IACEL,MAAAA,MAAuBK,EAC1BJ,aAAcD,MAAAA,MAAuBK,EAAEH,YACvCC,cAAe,EACfC,OAAQ,QAEVE,EAAG,IACEN,MAAAA,MAAuBM,EAC1BL,aAAcD,MAAAA,MAAuBM,EAAEJ,YACvCC,cAAe,EACfC,OAAQ,QAEVG,GAAI,IACCP,MAAAA,MAAuBO,GAC1BN,aAAcD,MAAAA,MAAuBO,GAAGL,YACxCC,cAAe,EACfC,OAAQ"}
+{"version":3,"file":"sizes.js","sources":["../../../../src/components/Textarea/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_FORM_INPUT_LABEL } from 'components/FormInputLabel'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    ...SIZES_FORM_INPUT_LABEL.l,\n    height: 'auto',\n  },\n  m: {\n    ...SIZES_FORM_INPUT_LABEL.m,\n    height: 'auto',\n  },\n  s: {\n    ...SIZES_FORM_INPUT_LABEL.s,\n    height: 'auto',\n  },\n  xs: {\n    ...SIZES_FORM_INPUT_LABEL.xs,\n    height: 'auto',\n  },\n}\n"],"names":["SIZES","l","SIZES_FORM_INPUT_LABEL","height","m","s","xs"],"mappings":"6DAIO,MAAMA,MAAqC,CAChDC,EAAG,IACEC,MAAAA,MAAuBD,EAC1BE,OAAQ,QAEVC,EAAG,IACEF,MAAAA,MAAuBE,EAC1BD,OAAQ,QAEVE,EAAG,IACEH,MAAAA,MAAuBG,EAC1BF,OAAQ,QAEVG,GAAI,IACCJ,MAAAA,MAAuBI,GAC1BH,OAAQ"}

package/components/Textarea/sizes.mjs

@@ -1,2 +1,2 @@
-import{SIZES as SIZES$1}from'../FormInputLabel/sizes.mjs';const SIZES={l:{...SIZES$1.l,paddingRight:SIZES$1.l.paddingLeft,paddingBottom:8,height:'auto'},m:{...SIZES$1.m,paddingRight:SIZES$1.m.paddingLeft,paddingBottom:7,height:'auto'},s:{...SIZES$1.s,paddingRight:SIZES$1.s.paddingLeft,paddingBottom:6,height:'auto'},xs:{...SIZES$1.xs,paddingRight:SIZES$1.xs.paddingLeft,paddingBottom:5,height:'auto'}};export{SIZES};
+import{SIZES as SIZES$1}from'../FormInputLabel/sizes.mjs';const SIZES={l:{...SIZES$1.l,height:'auto'},m:{...SIZES$1.m,height:'auto'},s:{...SIZES$1.s,height:'auto'},xs:{...SIZES$1.xs,height:'auto'}};export{SIZES};
 //# sourceMappingURL=sizes.mjs.map

package/components/Textarea/sizes.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"sizes.mjs","sources":["../../../../src/components/Textarea/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_FORM_INPUT_LABEL } from 'components/FormInputLabel'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    ...SIZES_FORM_INPUT_LABEL.l,\n    paddingRight: SIZES_FORM_INPUT_LABEL.l.paddingLeft,\n    paddingBottom: 8,\n    height: 'auto',\n  },\n  m: {\n    ...SIZES_FORM_INPUT_LABEL.m,\n    paddingRight: SIZES_FORM_INPUT_LABEL.m.paddingLeft,\n    paddingBottom: 7,\n    height: 'auto',\n  },\n  s: {\n    ...SIZES_FORM_INPUT_LABEL.s,\n    paddingRight: SIZES_FORM_INPUT_LABEL.s.paddingLeft,\n    paddingBottom: 6,\n    height: 'auto',\n  },\n  xs: {\n    ...SIZES_FORM_INPUT_LABEL.xs,\n    paddingRight: SIZES_FORM_INPUT_LABEL.xs.paddingLeft,\n    paddingBottom: 5,\n    height: 'auto',\n  },\n}\n"],"names":["SIZES","l","SIZES_FORM_INPUT_LABEL","paddingRight","paddingLeft","paddingBottom","height","m","s","xs"],"mappings":"0DAIO,MAAMA,MAAqC,CAChDC,EAAG,IACEC,QAAuBD,EAC1BE,aAAcD,QAAuBD,EAAEG,YACvCC,cAAe,EACfC,OAAQ,QAEVC,EAAG,IACEL,QAAuBK,EAC1BJ,aAAcD,QAAuBK,EAAEH,YACvCC,cAAe,EACfC,OAAQ,QAEVE,EAAG,IACEN,QAAuBM,EAC1BL,aAAcD,QAAuBM,EAAEJ,YACvCC,cAAe,EACfC,OAAQ,QAEVG,GAAI,IACCP,QAAuBO,GAC1BN,aAAcD,QAAuBO,GAAGL,YACxCC,cAAe,EACfC,OAAQ"}
+{"version":3,"file":"sizes.mjs","sources":["../../../../src/components/Textarea/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_FORM_INPUT_LABEL } from 'components/FormInputLabel'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    ...SIZES_FORM_INPUT_LABEL.l,\n    height: 'auto',\n  },\n  m: {\n    ...SIZES_FORM_INPUT_LABEL.m,\n    height: 'auto',\n  },\n  s: {\n    ...SIZES_FORM_INPUT_LABEL.s,\n    height: 'auto',\n  },\n  xs: {\n    ...SIZES_FORM_INPUT_LABEL.xs,\n    height: 'auto',\n  },\n}\n"],"names":["SIZES","l","SIZES_FORM_INPUT_LABEL","height","m","s","xs"],"mappings":"0DAIO,MAAMA,MAAqC,CAChDC,EAAG,IACEC,QAAuBD,EAC1BE,OAAQ,QAEVC,EAAG,IACEF,QAAuBE,EAC1BD,OAAQ,QAEVE,EAAG,IACEH,QAAuBG,EAC1BF,OAAQ,QAEVG,GAAI,IACCJ,QAAuBI,GAC1BH,OAAQ"}

package/dts/index.d.ts

@@ -9342,13 +9342,6 @@ ColorProperty,
 ColorProperty<'placeholderColor'>, 
 /** @deprecated */
 ResponsiveNamedProperty<'width', 'auto' | keyof typeof SizeInput | number> {
-    /**
-     * Пропсы для дополнительной кнопки с правого края.
-     *
-     * Для рендера контрола нужно передать addonButtonProps.icon и addonButtonProps.onClick
-     *
-     * @default {} */
-    addonButtonProps?: Partial<IconButtonProps>;
     /**
      * Отображение маски при пустом инпуте, который не имеет фокуса.
      *
@@ -9383,16 +9376,6 @@ ResponsiveNamedProperty<'width', 'auto' | keyof typeof SizeInput | number> {
      * @mask
      * @default undefined */
     formatChars?: Record<string, string>;
-    /**
-     * Иконки для отображения с левого и правого края.
-     *
-     * @default undefined */
-    icon?: JSX.Element | IconName | [Nullable<JSX.Element | IconName>, Nullable<JSX.Element | IconName>];
-    /**
-     * Пропсы для компонентов иконок.
-     *
-     * @default {} */
-    iconProps?: IconProps;
     /**
      * Отображать компонент на одной линии с другими.
      *
@@ -9501,6 +9484,24 @@ ResponsiveNamedProperty<'width', 'auto' | keyof typeof SizeInput | number> {
      * @general
      * @default undefined */
     value?: string;
+    /**
+     * Дополнительные элементы слева.
+     *
+     * @slot
+     * @default undefined */
+    addonLeft?: React.ReactElement | ((props: {
+        iconProps: IconProps;
+        iconButtonProps: Omit<IconButtonProps, 'icon'>;
+    }) => React.ReactNode);
+    /**
+     * Дополнительные элементы справа.
+     *
+     * @slot
+     * @default undefined */
+    addonRight?: React.ReactElement | ((props: {
+        iconProps: IconProps;
+        iconButtonProps: Omit<IconButtonProps, 'icon'>;
+    }) => React.ReactNode);
     /**
      * Размер.
      *
@@ -9588,6 +9589,12 @@ ResponsiveNamedProperty<'width', 'auto' | keyof typeof SizeInput | number> {
     /** @ignore */
     rounded?: boolean;
     /** @ignore @deprecated */
+    addonButtonProps?: Partial<IconButtonProps>;
+    /** @ignore @deprecated */
+    icon?: JSX.Element | IconName | [Nullable<JSX.Element | IconName>, Nullable<JSX.Element | IconName>];
+    /** @ignore @deprecated */
+    iconProps?: IconProps;
+    /** @ignore @deprecated */
     onColored?: boolean;
     /** @ignore @deprecated */
     controls?: {
@@ -9610,7 +9617,9 @@ type StyledBaseInputProps = React.ComponentPropsWithoutRef<'input'> & Pick<Input
 
 /**
  *
- * Компонент для приема однострочного ввода.
+ * *v1.0.0*
+ *
+ * Контрол для приема однострочного ввода.
  *
  * Поддерживается "ref" и все нативные атрибуты \<input\> элемента.
  */
@@ -10454,7 +10463,7 @@ interface DropdownBaseProps extends ResponsiveSizeProps<Size$1>, ResponsiveMargi
      *
      * @slot
      * @default undefined */
-    addonLeft?: React.ReactNode | ((addonLeftProps: {
+    addonLeft?: React.ReactElement | ((addonLeftProps: {
         iconProps: IconProps;
     }) => React.ReactNode);
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@foxford/ui",
-  "version": "2.108.1",
+  "version": "2.109.0",
   "description": "UI components and utilities",
   "bugs": {
     "url": "https://github.com/foxford/ui/issues"
@@ -63,6 +63,6 @@
     "shared",
     "theme"
   ],
-  "sha": "4ad497a",
+  "sha": "7902d42",
   "scripts": {}
 }