@vchasno/ui-kit 0.3.24 → 0.3.26

package/dist/Snackbar/types/components/Paragraph/Paragraph.d.ts

@@ -5,6 +5,7 @@ import './Paragraph.global.css';
 export interface ParagraphProps extends EllipsisText, TextAlign, HTMLAttributes<HTMLParagraphElement> {
     className?: string;
     children: React.ReactNode;
+    ellipsisLine?: number;
 }
 declare const Paragraph: React.ForwardRefExoticComponent<ParagraphProps & React.RefAttributes<HTMLParagraphElement>>;
 export default Paragraph;

package/dist/Snackbar/types/components/Select/utils.d.ts

@@ -0,0 +1,2 @@
+import { Props as ReactSelectProps } from 'react-select';
+export declare const composeStyles: ReactSelectProps['styles'];

package/dist/Snackbar/types/components/TextAreaInput/TextAreaInput.d.ts

@@ -1,10 +1,11 @@
 import React, { InputHTMLAttributes } from 'react';
-import { TextareaAutosizeProps } from 'react-textarea-autosize';
 import { InputProps } from '../Input';
+import { TextareaAutosizeProps } from '@mui/base/TextareaAutosize';
 import './TextAreaInput.global.css';
 export interface TextAreaInputProps extends TextareaAutosizeProps, Omit<InputProps, 'children'> {
     textareaClassName?: string;
     labelProps?: InputHTMLAttributes<HTMLLabelElement>;
+    title?: string;
 }
-declare const TextAreaInput: React.ForwardRefExoticComponent<TextAreaInputProps & React.RefAttributes<HTMLTextAreaElement>>;
+declare const TextAreaInput: React.ForwardRefExoticComponent<Omit<TextAreaInputProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
 export default TextAreaInput;

package/dist/css/Input.global.css

@@ -24,7 +24,7 @@
 .vchasno-ui-input__wrapper {
     position: relative;
     display: flex;
-    height: 50px;
+    min-height: 50px;
     box-sizing: border-box;
     align-items: center;
     padding-right: 33px;

package/dist/css/LabelText.global.css

@@ -7,6 +7,7 @@
     max-width: calc(100% - 20px);
     align-self: flex-start;
     padding: 0 4px;
+    border-radius: 4px;
     background-color: var(--vchasno-ui-input-bg-color);
     color: var(--vchasno-ui-label-color-default);
     font-size: var(--vchasno-ui-input-font-size);

package/dist/css/Paragraph.global.css

@@ -7,3 +7,11 @@
     text-overflow: ellipsis;
     white-space: nowrap;
 }
+
+.vchasno-ui-paragraph.--ellipsis-line {
+    display: -webkit-box;
+    overflow: hidden;
+    -webkit-box-orient: vertical;
+    text-overflow: ellipsis;
+    white-space: unset;
+}

package/dist/css/Select.global.css

@@ -12,7 +12,7 @@
         transform 0.3s;
 }
 
-.vchasno-ui-select.--with-value .vchasno-ui-label-text,
+.vchasno-ui-select:has(.vchasno-ui-select__value-container--has-value) .vchasno-ui-label-text,
 .vchasno-ui-select:focus-within .vchasno-ui-label-text {
     font-size: 12px;
     transform: translate(0, -42px);

package/dist/css/Text.global.css

@@ -71,3 +71,7 @@
     color: var(--vchasno-ui-text-error-color, #ff5937);
     content: '*';
 }
+
+strong.vchasno-ui-text {
+    font-weight: 700;
+}

package/dist/css/TextAreaInput.global.css

@@ -1,6 +1,5 @@
 .vchasno-ui-textarea-input-container .vchasno-ui-input__wrapper {
     height: auto;
-    min-height: 40px;
     padding-top: 10px;
     padding-bottom: 10px;
 }
@@ -19,11 +18,6 @@
     font-size: var(--vchasno-ui-input-font-size);
     line-height: calc(var(--vchasno-ui-input-font-size) * 1.2);
     transition: color var(--vchasno-ui-transition-duration-sec, 0.3s);
-    visibility: hidden;
-}
-
-.vchasno-ui-textarea-input:focus::placeholder {
-    visibility: visible;
 }
 
 .vchasno-ui-input__wrapper__label {
@@ -31,11 +25,15 @@
 }
 
 .vchasno-ui-textarea-input + .vchasno-ui-label-text {
-    top: 10px;
-    transform: none;
+    top: 0;
+    transform: translateY(10px);
+    transition:
+        transform var(--vchasno-ui-transition-duration-sec, 0.3s),
+        font-size var(--vchasno-ui-transition-duration-sec, 0.3s);
 }
 
 .vchasno-ui-textarea-input:not(:placeholder-shown) + .vchasno-ui-label-text,
 .vchasno-ui-textarea-input:focus:not(.--disabled) + .vchasno-ui-label-text {
-    top: -12px;
+    top: 0;
+    transform: translateY(-12px);
 }

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import React, { HTMLAttributes, ButtonHTMLAttributes, InputHTMLAttributes } from 'react';
 import { MaskedInputProps } from 'react-text-mask';
-import { TextareaAutosizeProps } from 'react-textarea-autosize';
+import { TextareaAutosizeProps } from '@mui/base/TextareaAutosize';
 import * as _emotion_styled from '@emotion/styled';
 import * as _mui_system from '@mui/system';
 import * as _mui_material_styles from '@mui/material/styles';
@@ -122,14 +122,16 @@ declare const Title: React.ForwardRefExoticComponent<TitleProps & React.RefAttri
 interface ParagraphProps extends EllipsisText, TextAlign, HTMLAttributes<HTMLParagraphElement> {
     className?: string;
     children: React.ReactNode;
+    ellipsisLine?: number;
 }
 declare const Paragraph: React.ForwardRefExoticComponent<ParagraphProps & React.RefAttributes<HTMLParagraphElement>>;
 
 interface TextAreaInputProps extends TextareaAutosizeProps, Omit<InputProps, 'children'> {
     textareaClassName?: string;
     labelProps?: InputHTMLAttributes<HTMLLabelElement>;
+    title?: string;
 }
-declare const TextAreaInput: React.ForwardRefExoticComponent<TextAreaInputProps & React.RefAttributes<HTMLTextAreaElement>>;
+declare const TextAreaInput: React.ForwardRefExoticComponent<Omit<TextAreaInputProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
 
 type AlertType = 'error' | 'warning' | 'success' | 'info' | 'config';
 type IconType = 'info' | 'cross' | 'error' | 'warning' | 'success' | 'config';