armtek-uikit-react 1.0.260 → 1.0.265

package/ui/Form/TextArea/TextArea.d.ts

@@ -1,6 +1,12 @@
 import { TextFieldProps } from '../TextField/TextField';
-export type TextAreaProps = {} & TextFieldProps;
+export type TextAreaProps = {
+    minRows?: number;
+    maxRows?: number;
+} & TextFieldProps;
 declare const TextArea: import("react").ForwardRefExoticComponent<{
+    minRows?: number;
+    maxRows?: number;
+} & {
     label?: string;
     size?: Exclude<import("../../../types/theme").SizeType, "extraLarge" | "medium">;
     variant?: import("../../../types/theme").VariantType;

package/ui/Form/TextArea/TextArea.js

@@ -9,24 +9,55 @@ var _react = require("react");
 var _clsx = _interopRequireDefault(require("clsx"));
 var _jsxRuntime = require("react/jsx-runtime");
 const TextArea = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
-  var _textareaRef$current, _textareaRef$current2;
   let {
     className,
+    minRows,
+    maxRows,
+    onInput,
+    style,
     ...restProps
   } = props;
-  let [minHeight, setMinHeight] = (0, _react.useState)(0);
   let textareaRef = (0, _react.useRef)(null);
   (0, _react.useImperativeHandle)(ref, () => {
     return textareaRef.current;
   }, []);
+  const getRowsCount = rows => {
+    if (typeof rows !== 'number' || !Number.isFinite(rows)) return undefined;
+    return Math.max(1, Math.floor(rows));
+  };
+  const getHeightByRows = (rows, textarea) => {
+    const style = window.getComputedStyle(textarea);
+    const parsedLineHeight = parseFloat(style.lineHeight);
+    const lineHeight = Number.isFinite(parsedLineHeight) ? parsedLineHeight : 20;
+    const verticalPadding = (parseFloat(style.paddingTop) || 0) + (parseFloat(style.paddingBottom) || 0);
+    const verticalBorders = (parseFloat(style.borderTopWidth) || 0) + (parseFloat(style.borderBottomWidth) || 0);
+    return lineHeight * rows + verticalPadding + verticalBorders;
+  };
+  const resizeTextarea = () => {
+    if (!textareaRef.current) return;
+    const textarea = textareaRef.current;
+    const minRowsValue = getRowsCount(minRows) || 1;
+    const maxRowsValue = getRowsCount(maxRows);
+    const resolvedMaxRows = maxRowsValue !== undefined ? Math.max(minRowsValue, maxRowsValue) : undefined;
+    const minHeight = getHeightByRows(minRowsValue, textarea);
+    const maxHeight = resolvedMaxRows !== undefined ? getHeightByRows(resolvedMaxRows, textarea) : undefined;
+    textarea.style.height = 'auto';
+    let nextHeight = Math.max(textarea.scrollHeight, minHeight);
+    if (maxHeight !== undefined) nextHeight = Math.min(nextHeight, maxHeight);
+    textarea.style.height = nextHeight + 'px';
+  };
   (0, _react.useEffect)(() => {
-    if (textareaRef.current && 'clientHeight' in textareaRef.current) setMinHeight(textareaRef.current.clientHeight);
-  }, [textareaRef]);
-  let textHeight = (((_textareaRef$current = textareaRef.current) == null ? void 0 : _textareaRef$current.scrollHeight) || 0) < minHeight ? minHeight : (_textareaRef$current2 = textareaRef.current) == null ? void 0 : _textareaRef$current2.scrollHeight;
+    resizeTextarea();
+  }, [minRows, maxRows, props.value, props.defaultValue, props.size]);
+  const handleInput = event => {
+    resizeTextarea();
+    if (onInput) onInput(event);
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
       ref: textareaRef,
       ...restProps,
+      onInput: handleInput,
       className: (0, _clsx.default)('arm-textarea', ['arm-textarea_size_' + restProps.size], className),
       multiline: true,
       classes: {
@@ -34,7 +65,7 @@ const TextArea = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
         ...restProps.classes
       },
       style: {
-        height: textHeight + 'px'
+        ...style
       }
     })
   });

package/ui/Icon/Mi.d.ts

@@ -3,4 +3,20 @@ import { TooltipProps } from '../../ui/Tooltip';
 export type MiProps = {
     tooltipProps?: Omit<TooltipProps, 'text' | 'children'>;
 } & IconProps;
-export declare const Mi: (props: MiProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Mi: import("react").ForwardRefExoticComponent<{
+    tooltipProps?: Omit<TooltipProps, "text" | "children">;
+} & {
+    icon: string;
+    variant?: import("../../types/theme").VariantType;
+    color?: import("../../types/theme").ColorType | import("../../types/theme").ColorStatusType;
+    size?: import("../../types/theme").SizeType;
+    theme?: import("../../types/theme").ThemeType;
+    fs?: number;
+} & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, keyof {
+    icon: string;
+    variant?: import("../../types/theme").VariantType;
+    color?: import("../../types/theme").ColorType | import("../../types/theme").ColorStatusType;
+    size?: import("../../types/theme").SizeType;
+    theme?: import("../../types/theme").ThemeType;
+    fs?: number;
+}> & import("react").RefAttributes<HTMLSpanElement>>;

package/ui/Icon/Mi.js

@@ -5,8 +5,9 @@ exports.__esModule = true;
 exports.Mi = void 0;
 var _Icon = _interopRequireDefault(require("./Icon"));
 var _Tooltip = _interopRequireDefault(require("../Tooltip"));
+var _react = require("react");
 var _jsxRuntime = require("react/jsx-runtime");
-const Mi = props => {
+const Mi = exports.Mi = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
   const {
     tooltipProps,
     title,
@@ -17,13 +18,14 @@ const Mi = props => {
       ...tooltipProps,
       text: title,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+        ref: ref,
         variant: 'outlined',
         ...iconProps
       })
     }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+      ref: ref,
       variant: 'outlined',
       ...iconProps
     })
   });
-};
-exports.Mi = Mi;
+});

package/ui/Icon/Mis.d.ts

@@ -1,2 +1,2 @@
 import { MiProps } from './Mi';
-export declare const Mis: (props: Omit<MiProps, "variant">) => import("react/jsx-runtime").JSX.Element;
+export declare const Mis: import("react").ForwardRefExoticComponent<Omit<MiProps, "variant"> & import("react").RefAttributes<HTMLSpanElement>>;

package/ui/Icon/Mis.js

@@ -3,13 +3,14 @@
 exports.__esModule = true;
 exports.Mis = void 0;
 var _Mi = require("./Mi");
+var _react = require("react");
 var _jsxRuntime = require("react/jsx-runtime");
-const Mis = props => {
+const Mis = exports.Mis = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Mi.Mi, {
       ...props,
+      ref: ref,
       variant: 'contained'
     })
   });
-};
-exports.Mis = Mis;
+});

package/ui/Link/Link.d.ts

@@ -1,4 +1,4 @@
-import { ComponentPropsWithoutRef, ElementType } from 'react';
+import { ComponentPropsWithoutRef, ElementType, ReactElement, RefAttributes } from 'react';
 import { ColorStatusType, ColorType, SizeType, ThemeType } from '../../types/theme';
 type LinkType = 'a';
 type OwnProps<T extends ElementType = LinkType> = {
@@ -11,5 +11,6 @@ type OwnProps<T extends ElementType = LinkType> = {
     disablestyles?: string;
 };
 export type LinkProps<T extends ElementType = LinkType> = OwnProps<T> & Omit<ComponentPropsWithoutRef<T>, keyof OwnProps<T>>;
-declare const Link: <T extends ElementType = LinkType>(props: LinkProps<T>) => import("react/jsx-runtime").JSX.Element;
+type LinkComponent = <T extends ElementType = LinkType>(props: LinkProps<T> & RefAttributes<HTMLElement>) => ReactElement | null;
+declare const Link: LinkComponent;
 export default Link;

package/ui/Link/Link.js

@@ -3,9 +3,10 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
 exports.default = void 0;
+var _react = require("react");
 var _clsx = _interopRequireDefault(require("clsx"));
 var _jsxRuntime = require("react/jsx-runtime");
-const Link = props => {
+const Link = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
   let {
     border,
     children,
@@ -32,12 +33,13 @@ const Link = props => {
   } : {};
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
+      ref: ref,
       ...restProps,
       ...polymorphProps,
       className: !disablestyles ? classNames : className,
       children: children
     })
   });
-};
+});
 var _default = exports.default = Link;
 module.exports = exports.default;

package/ui/Popper/Popper.d.ts

@@ -1,4 +1,4 @@
 import { PopperBaseProps } from './PopperBase';
 export type PopperProps = {} & PopperBaseProps;
-export declare const Popper: (props: PopperProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const Popper: (props: PopperBaseProps & import("react").RefAttributes<HTMLDivElement>) => JSX.Element;
 export default Popper;

package/ui/Popper/Popper.js

@@ -4,17 +4,18 @@ exports.__esModule = true;
 exports.default = exports.Popper = void 0;
 var _reactDom = require("react-dom");
 var _PopperBase = require("./PopperBase");
+var _helpers = require("../../lib/helpers");
 var _jsxRuntime = require("react/jsx-runtime");
 //TODO TESTS
 
-const Popper = props => {
+const Popper = exports.Popper = (0, _helpers.fixedForwardRef)((props, ref) => {
   if (!props.open) return null;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_PopperBase.PopperBase, {
+      ref: ref,
       ...props,
       children: props.children
     }), document.body)
   });
-};
-exports.Popper = Popper;
+});
 var _default = exports.default = Popper;

package/ui/Popper/PopperBase.d.ts

@@ -10,5 +10,5 @@ export type PopperBaseProps = {
     className?: string;
     placement?: 'bottom-end' | 'bottom-start' | 'bottom' | 'left-end' | 'left-start' | 'left' | 'right-end' | 'right-start' | 'right' | 'top-end' | 'top-start' | 'top';
 };
-export declare const PopperBase: (props: PopperBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PopperBase: (props: PopperBaseProps & import("react").RefAttributes<HTMLDivElement>) => JSX.Element;
 export default PopperBase;

package/ui/Popper/PopperBase.js

@@ -7,17 +7,19 @@ exports.default = exports.PopperBase = void 0;
 var _react = require("react");
 var _core = require("@popperjs/core");
 var _clsx = _interopRequireDefault(require("clsx"));
+var _helpers = require("../../lib/helpers");
 var _jsxRuntime = require("react/jsx-runtime");
-const PopperBase = props => {
+const PopperBase = exports.PopperBase = (0, _helpers.fixedForwardRef)((props, ref) => {
   const {
     anchorEl,
     children,
-    placement,
+    placement = 'top',
     className,
     anchorPosition,
     open
   } = props;
   const tooltipRef = (0, _react.useRef)(null);
+  (0, _react.useImperativeHandle)(ref, () => tooltipRef.current, []);
   (0, _react.useEffect)(() => {
     let modifiers = [{
       name: 'offset',
@@ -54,6 +56,5 @@ const PopperBase = props => {
       children: children
     })
   });
-};
-exports.PopperBase = PopperBase;
+});
 var _default = exports.default = PopperBase;