armtek-uikit-react 1.0.145 → 1.0.147

package/assets/fonts.scss

@@ -4,14 +4,14 @@
   font-family: 'Material Symbols Outlined';
   font-style: normal;
   font-weight: 400;
-  font-display: swap;
+  font-display: block;
   src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v133/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzaxHMPdY43zj-jCxv3fzvRNU22ZXGJpEpjC_1v-p_4MrImHCIJIZrDCvHOej.woff2) format('woff2');
 }
 
 @font-face {
   font-family: 'Material Symbols Outlined';
   font-style: normal;
-  font-display: swap;
+  font-display: block;
   font-weight: 700;
   src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v134/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzazHD_dY43zj-jCxv3fzvRNU22ZXGJpEpjC_1p-p_4MrImHCIJIZrDBIG-ej.woff2) format('woff2');
 }

package/package.json

@@ -1 +1 @@
-{"name":"armtek-uikit-react","version":"1.0.145","description":"Armtek UIKit for React","repository":{"type":"git","url":"ssh://git@gl.corp:10022/int/uikit/uikit_react.git"},"author":"","license":"ISC","dependencies":{"build":"^0.1.4","clsx":"^2.0.0","rc-slider":"^10.2.1","react":"*","react-datepicker":"^4.16.0","react-dom":"*","react-transition-group":"^4.4.5"},"peerDependencies":{"react":"*","react-dom":"*"},"scripts":{"pub":"npm version patch && npm publish"}}
+{"name":"armtek-uikit-react","version":"1.0.147","description":"Armtek UIKit for React","repository":{"type":"git","url":"ssh://git@gl.corp:10022/int/uikit/uikit_react.git"},"author":"","license":"ISC","dependencies":{"build":"^0.1.4","clsx":"^2.0.0","rc-slider":"^10.2.1","react":"*","react-datepicker":"^4.16.0","react-dom":"*","react-transition-group":"^4.4.5"},"peerDependencies":{"react":"*","react-dom":"*"},"scripts":{"pub":"npm version patch && npm publish"}}

package/ui/Form/Select/Select.d.ts

@@ -1,6 +1,6 @@
 import { OptionType } from '../../../types/theme';
 import { TextFieldProps } from '../TextField/TextField';
-import { MouseEvent } from 'react';
+import { MouseEvent, ReactNode } from 'react';
 type SelectBaseProps = {
     options: OptionType[];
     inline?: boolean;
@@ -15,6 +15,8 @@ type SelectBaseProps = {
     defaultQuery?: string;
     query?: string;
     optionControls?: boolean;
+    afterList?: string | ReactNode;
+    beforeList?: string | ReactNode;
 };
 type MultipleType<M extends boolean = false> = {
     multiple?: M;
@@ -42,7 +44,9 @@ export type SelectOptionsType<T extends boolean> = {
     onSubmit?: () => void;
     disabled?: boolean;
     optionControls?: boolean;
+    afterList?: string | ReactNode;
+    beforeList?: string | ReactNode;
 };
 export declare const SelectOptions: import("react").ForwardRefExoticComponent<SelectOptionsType<boolean> & import("react").RefAttributes<unknown>>;
-declare const _default: <M extends boolean = false>(props: SelectBaseProps & MultipleType<M> & Omit<TextFieldProps, keyof SelectBaseProps | keyof MultipleType<M_1>> & import("react").RefAttributes<HTMLInputElement>) => import("react").ReactNode;
+declare const _default: <M extends boolean = false>(props: SelectBaseProps & MultipleType<M> & Omit<TextFieldProps, keyof SelectBaseProps | keyof MultipleType<M_1>> & import("react").RefAttributes<HTMLInputElement>) => ReactNode;
 export default _default;

package/ui/Form/Select/Select.js

@@ -3,13 +3,14 @@
 import TextField from "../TextField/TextField";
 import { forwardRef, useMemo, useRef, useState } from 'react';
 import clsx from 'clsx';
-import ListItem from "../../List/ListItem";
 import useClickOutside from "../../../lib/hooks/useClickOutside";
 import ButtonIcon from "../../ButtonIcon";
 import Adornment from "../../Adornment";
 import { SelectSummary, SelectSummaryChips } from "./SelectSummary";
 import Popover from "../../Popover/Popover";
 import { fixedForwardRef } from "../../../lib/helpers";
+import { SelectOptionsContainer } from "./SelectOptionsContainer";
+import { SelectOptionList } from "./SelectOptionList";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -38,6 +39,8 @@ function Select(props, ref) {
     clear,
     onSelectAll,
     defaultQuery,
+    afterList,
+    beforeList,
     query,
     ...inputProps
   } = props;
@@ -203,6 +206,8 @@ function Select(props, ref) {
           multiple: multiple,
           value: realValue,
           inline: inline,
+          afterList: afterList,
+          beforeList: beforeList,
           listStyle: listStyle,
           onClick: handleSelect,
           onClear: handleResetAll,
@@ -217,6 +222,8 @@ function Select(props, ref) {
           multiple: multiple,
           value: realValue,
           inline: inline,
+          afterList: afterList,
+          beforeList: beforeList,
           listStyle: listStyle,
           onClick: handleSelect,
           onClear: handleResetAll,
@@ -237,30 +244,23 @@ export const SelectOptions = /*#__PURE__*/forwardRef((props, ref) => {
     listStyle,
     disabled,
     optionControls,
+    beforeList,
+    afterList,
     ...callbacks
   } = props;
   if (multiple && optionControls === undefined) optionControls = true;
   return /*#__PURE__*/_jsx(_Fragment, {
-    children: /*#__PURE__*/_jsxs("div", {
+    children: /*#__PURE__*/_jsxs(SelectOptionsContainer, {
       ref: ref,
-      className: clsx('arm-options', {
-        'arm-options_inline': !!inline
-      }),
-      children: [/*#__PURE__*/_jsx("div", {
-        className: "arm-options__list",
-        children: options.map((item, index) => {
-          let optValue = getOptionValue(item);
-          let active = multiple === true && value ? value.includes(optValue) : optValue === value;
-          let checked = listStyle === 'checkbox' && !!multiple ? active : undefined;
-          return /*#__PURE__*/_jsx(ListItem, {
-            disabled: disabled || !!item.disabled,
-            checked: checked,
-            active: active,
-            onClick: e => onClick(e, item),
-            children: item.text
-          }, index);
-        })
-      }), !!optionControls && !!multiple && /*#__PURE__*/_jsx("div", {
+      inline: !!inline,
+      children: [beforeList, /*#__PURE__*/_jsx(SelectOptionList, {
+        options: options,
+        multiple: multiple,
+        value: value,
+        listStyle: listStyle,
+        disabled: disabled,
+        onChange: onClick
+      }), afterList, !!optionControls && !!multiple && /*#__PURE__*/_jsx("div", {
         className: 'arm-selectSummary__wrapper',
         children: /*#__PURE__*/_jsx(SelectSummary, {
           options: options,

package/ui/Form/Select/SelectOptionList.d.ts

@@ -0,0 +1,13 @@
+import { ComponentPropsWithoutRef, MouseEvent } from 'react';
+import { OptionType } from '../../../types/theme';
+type OwnProps = {
+    options: OptionType[];
+    multiple?: boolean;
+    value?: string | string[];
+    listStyle?: 'checkbox' | 'default';
+    disabled?: boolean;
+    onChange: (e: MouseEvent<HTMLButtonElement>, option: OptionType) => void;
+};
+export type SelectOptionListProps = OwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof OwnProps>;
+export declare const SelectOptionList: (props: OwnProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof OwnProps> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+export {};

package/ui/Form/Select/SelectOptionList.js

@@ -0,0 +1,31 @@
+import ListItem from "../../List";
+import { getOptionValue } from "./Select";
+import { fixedForwardRef } from "../../../lib/helpers";
+import { jsx as _jsx } from "react/jsx-runtime";
+function SelectOptionListBase(props, ref) {
+  const {
+    options,
+    multiple,
+    value,
+    listStyle,
+    disabled,
+    onChange
+  } = props;
+  return /*#__PURE__*/_jsx("div", {
+    ref: ref,
+    className: "arm-options__list",
+    children: options.map((item, index) => {
+      let optValue = getOptionValue(item);
+      let active = multiple === true && value ? value.includes(optValue) : optValue === value;
+      let checked = listStyle === 'checkbox' && !!multiple ? active : undefined;
+      return /*#__PURE__*/_jsx(ListItem, {
+        disabled: disabled || !!item.disabled,
+        checked: checked,
+        active: active,
+        onClick: e => onChange(e, item),
+        children: item.text
+      }, index);
+    })
+  });
+}
+export const SelectOptionList = fixedForwardRef(SelectOptionListBase);

package/ui/Form/Select/SelectOptionsContainer.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef } from 'react';
+type OwnProps = {
+    inline?: boolean;
+};
+export type SelectOptionsContainerProps = OwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof OwnProps>;
+export declare const SelectOptionsContainer: import("react").ForwardRefExoticComponent<OwnProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "inline"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};

package/ui/Form/Select/SelectOptionsContainer.js

@@ -0,0 +1,15 @@
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const SelectOptionsContainer = /*#__PURE__*/forwardRef(({
+  inline,
+  children
+}, ref) => {
+  return /*#__PURE__*/_jsx("div", {
+    ref: ref,
+    className: clsx('arm-options', {
+      'arm-options_inline': !!inline
+    }),
+    children: children
+  });
+});

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

@@ -1,4 +1,21 @@
 import { TextFieldProps } from '../TextField/TextField';
 export type TextAreaProps = {} & TextFieldProps;
-declare const TextArea: (props: TextAreaProps) => import("react/jsx-runtime").JSX.Element;
+declare const TextArea: import("react").ForwardRefExoticComponent<{
+    label?: string | undefined;
+    size?: "large" | "small" | undefined;
+    variant?: import("../../../types/theme").VariantType | undefined;
+    error?: boolean | undefined;
+    success?: boolean | undefined;
+    helperText?: import("react").ReactNode;
+    endAdornment?: import("react").ReactNode;
+    multiline?: boolean | undefined;
+    focused?: boolean | undefined;
+    editable?: boolean | undefined;
+    classes?: Partial<{
+        input: string;
+        root: string;
+        wrapper: string;
+    }> | undefined;
+    WrapperProps?: Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> | undefined;
+} & Omit<import("react").InputHTMLAttributes<any>, "size"> & import("react").RefAttributes<HTMLTextAreaElement>>;
 export default TextArea;

package/ui/Form/TextArea/TextArea.js

@@ -1,11 +1,11 @@
 "use client";
 
 import TextField from "../TextField/TextField";
-import { useEffect, useRef, useState } from 'react';
+import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import clsx from 'clsx';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
-const TextArea = props => {
+const TextArea = /*#__PURE__*/forwardRef((props, ref) => {
   var _textareaRef$current, _textareaRef$current2;
   let {
     onChange,
@@ -15,6 +15,9 @@ const TextArea = props => {
   let [value, setValue] = useState('');
   let [minHeight, setMinHeight] = useState(0);
   let textareaRef = useRef();
+  useImperativeHandle(ref, () => {
+    return textareaRef.current;
+  }, []);
   const handleChange = e => {
     setValue(e.target.value);
     if (onChange) onChange(e);
@@ -40,5 +43,5 @@ const TextArea = props => {
       }
     })
   });
-};
+});
 export default TextArea;