armtek-uikit-react 1.0.73 → 1.0.75

package/assets/Dropdown.scss

@@ -0,0 +1,38 @@
+@import "variables";
+
+
+.Dropdown {
+
+  &__ContentWrapper {
+    &Enter {
+      //opacity: 0;
+      overflow: hidden;
+      max-height: 0;
+    }
+
+    &EnterActive {
+      opacity: 1;
+      max-height: var(--content-height);
+      transition: opacity 0.3s, max-height 1s cubic-bezier(0, 1, 0, 1);
+    }
+
+    &Exit {
+      opacity: 1;
+      max-height: var(--content-height);
+    }
+
+    &ExitActive {
+      overflow: hidden;
+      opacity: 0;
+      max-height: 0;
+      transition: opacity 0.3s, max-height 1s cubic-bezier(0, 1, 0, 1);
+    }
+  }
+
+  &__Content {
+    overflow: hidden;
+    transition: all 0.3s;
+  }
+
+
+}

package/assets/Link.scss

@@ -11,6 +11,9 @@
   font-size: 16px;
   font-family: inherit;
 }
+.link_dark{
+  color: #fff;
+}
 .link_disabled{
   opacity: 0.7;
   pointer-events: none;

package/package.json

@@ -1 +1 @@
-{"name":"armtek-uikit-react","version":"1.0.73","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":"*"},"peerDependencies":{"react":"*","react-dom":"*"},"scripts":{"pub":"npm version patch && npm publish"}}
+{"name":"armtek-uikit-react","version":"1.0.75","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/Adornment/Adornment.d.ts

@@ -1,6 +1,8 @@
 import { HTMLAttributes } from 'react';
+import { ThemeType } from '../../types/theme';
 type PropsType = {
     position?: 'start' | 'end';
+    theme?: ThemeType;
 } & HTMLAttributes<HTMLDivElement>;
 declare const Adornment: (props: PropsType) => import("react/jsx-runtime").JSX.Element;
 export declare const AdornmentContainer: (props: PropsType) => import("react/jsx-runtime").JSX.Element;

package/ui/Adornment/Adornment.js

@@ -1,8 +1,9 @@
 import clsx from 'clsx';
 import css from "./Adornment.module.scss";
-// import { getCssPrefix } from 'lib/helpers/helpers'
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
+// import { getCssPrefix } from 'lib/helpers/helpers'
+
 const AdornmentClasses = ['adornmentContainer', 'adornmentContainer_end', 'adornment_start', 'adornment_end'];
 
 // const css = getCssPrefix(AdornmentClasses)

package/ui/Dropdown/Dropdown.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type ChipProps = {
+    expanded?: boolean;
+    unmountOnExit?: boolean;
+} & ComponentPropsWithoutRef<'div'>;
+declare function Dropdown(props: ChipProps): import("react/jsx-runtime").JSX.Element;
+export default Dropdown;

package/ui/Dropdown/Dropdown.js

@@ -0,0 +1,50 @@
+"use client";
+
+import { useEffect, useRef } from 'react';
+import clsx from 'clsx';
+import { CSSTransition } from 'react-transition-group';
+import css from "./Dropdown.module.scss";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+function Dropdown(props) {
+  var _nodeRef$current;
+  const {
+    children,
+    className,
+    expanded,
+    unmountOnExit,
+    ...divProps
+  } = props;
+  const nodeRef = useRef(null);
+  const contentHeight = (_nodeRef$current = nodeRef.current) == null ? void 0 : _nodeRef$current.scrollHeight;
+  const duration = 1000;
+  useEffect(() => {
+    if (nodeRef.current && contentHeight) nodeRef.current.style.setProperty("--content-height", String(contentHeight) + 'px');
+  }, [contentHeight]);
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: /*#__PURE__*/_jsx("div", {
+      ...divProps,
+      className: clsx('Arm-dropdown', css.Dropdown, className),
+      children: /*#__PURE__*/_jsx(CSSTransition, {
+        classNames: {
+          'enter': css.Dropdown__ContentWrapperEnter,
+          'enterActive': css.Dropdown__ContentWrapperEnterActive,
+          'exit': css.Dropdown__ContentWrapperExit,
+          'exitActive': css.Dropdown__ContentWrapperExitActive
+        },
+        in: expanded,
+        nodeRef: nodeRef,
+        timeout: duration,
+        unmountOnExit: unmountOnExit || false,
+        children: /*#__PURE__*/_jsx("div", {
+          ref: nodeRef,
+          children: /*#__PURE__*/_jsx("div", {
+            className: css.Dropdown__Content,
+            children: children
+          })
+        })
+      })
+    })
+  });
+}
+export default Dropdown;

package/ui/Dropdown/Dropdown.module.scss

@@ -0,0 +1 @@
+@import "./../../assets/Dropdown.scss";

package/ui/Dropdown/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Dropdown';
+export * from './Dropdown';

package/ui/Dropdown/index.js

@@ -0,0 +1,2 @@
+export { default } from "./Dropdown";
+export * from "./Dropdown";

package/ui/Form/Checkbox/Checkbox.d.ts

@@ -1,9 +1,10 @@
 import { InputHTMLAttributes, ReactNode } from 'react';
-import { ColorType, SizeType, VariantType } from '../../../types/theme';
+import { ColorType, SizeType, ThemeType, VariantType } from '../../../types/theme';
 type BaseCheckboxPropsType = {
     label?: string | ReactNode;
     size?: Exclude<SizeType, 'extraLarge'>;
     color?: ColorType;
+    theme?: ThemeType;
     variant?: Exclude<VariantType, 'transparent'>;
     intermediate?: boolean;
 };

package/ui/Link/Link.d.ts

@@ -1,9 +1,11 @@
 import { ComponentPropsWithoutRef, ElementType } from 'react';
+import { ThemeType } from '../../types/theme';
 type LinkType = 'a';
 type OwnProps<T extends ElementType = LinkType> = {
     border?: 'solid' | 'dotted' | 'dashed';
     as?: T;
     disabled?: boolean;
+    theme?: ThemeType;
 };
 export type LinkProps<T extends ElementType = LinkType> = OwnProps<T> & Omit<ComponentPropsWithoutRef<T>, keyof OwnProps<T>>;
 declare const Link: <T extends ElementType = "a">(props: LinkProps<T>) => import("react/jsx-runtime").JSX.Element;

package/ui/Link/Link.js

@@ -4,10 +4,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 const Link = props => {
   let {
-    border = 'solid',
+    border,
     children,
     disabled,
     className,
+    theme,
     as,
     ...restProps
   } = props;
@@ -17,7 +18,8 @@ const Link = props => {
       ...restProps,
       className: clsx('Arm-link', css.link, {
         [css.link_border]: !!border,
-        [css.link_disabled]: !!disabled
+        [css.link_disabled]: !!disabled,
+        [css.link_dark]: theme === 'dark'
       }, css['link_border_' + border], className),
       children: children
     })

package/ui/List/ListItem.js

@@ -40,12 +40,14 @@ function ListItem(props) {
         children: [checked !== undefined && /*#__PURE__*/_jsx(Adornment, {
           position: 'start',
           children: /*#__PURE__*/_jsx(Checkbox, {
+            theme: theme,
             disabled: restProps.disabled,
             checked: checked,
             readOnly: true,
             size: 'small'
           })
         }), !!startAdornment && /*#__PURE__*/_jsx(Adornment, {
+          theme: theme,
           position: 'start',
           children: startAdornment
         })]
@@ -63,6 +65,7 @@ function ListItem(props) {
       }), !!endAdornment && /*#__PURE__*/_jsx(AdornmentContainer, {
         position: 'end',
         children: /*#__PURE__*/_jsx(Adornment, {
+          theme: theme,
           position: 'end',
           children: endAdornment
         })