@vchasno/ui-kit 0.3.28 → 0.3.29
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/dist/Datepicker/index.cjs.js +11 -5
- package/dist/Datepicker/index.cjs.js.map +1 -1
- package/dist/Datepicker/index.js +11 -5
- package/dist/Datepicker/index.js.map +1 -1
- package/dist/Datepicker/types/components/Select/customComponents.d.ts +2 -1
- package/dist/Datepicker/types/components/Title/Title.d.ts +1 -0
- package/dist/Menu/types/components/Select/customComponents.d.ts +2 -1
- package/dist/Menu/types/components/Title/Title.d.ts +1 -0
- package/dist/ProjectsPopover/types/components/Select/customComponents.d.ts +2 -1
- package/dist/ProjectsPopover/types/components/Title/Title.d.ts +1 -0
- package/dist/Select/index.cjs.js +16 -7
- package/dist/Select/index.cjs.js.map +1 -1
- package/dist/Select/index.js +16 -7
- package/dist/Select/index.js.map +1 -1
- package/dist/Select/types/components/Select/customComponents.d.ts +2 -1
- package/dist/Select/types/components/Title/Title.d.ts +1 -0
- package/dist/SelectCreatable/index.cjs.js +16 -7
- package/dist/SelectCreatable/index.cjs.js.map +1 -1
- package/dist/SelectCreatable/index.js +16 -7
- package/dist/SelectCreatable/index.js.map +1 -1
- package/dist/SelectCreatable/types/components/Select/customComponents.d.ts +2 -1
- package/dist/SelectCreatable/types/components/Title/Title.d.ts +1 -0
- package/dist/Snackbar/index.cjs.js +5 -5
- package/dist/Snackbar/index.cjs.js.map +1 -1
- package/dist/Snackbar/index.js +5 -5
- package/dist/Snackbar/index.js.map +1 -1
- package/dist/Snackbar/types/components/Select/customComponents.d.ts +2 -1
- package/dist/Snackbar/types/components/Title/Title.d.ts +1 -0
- package/dist/css/DatePicker.global.css +54 -29
- package/dist/css/Input.global.css +1 -0
- package/dist/css/Select.global.css +11 -19
- package/dist/css/Title.global.css +4 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +5 -5
- package/dist/index.js.map +1 -1
- package/dist/types/components/Select/customComponents.d.ts +2 -1
- package/dist/types/components/Title/Title.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ClearIndicatorProps, DropdownIndicatorProps } from 'react-select';
|
|
2
|
+
import { ClearIndicatorProps, DropdownIndicatorProps, MultiValueRemoveProps } from 'react-select';
|
|
3
3
|
declare const _default: {
|
|
4
|
+
MultiValueRemove: (props: MultiValueRemoveProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
|
|
4
5
|
DropdownIndicator: (props: DropdownIndicatorProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
|
|
5
6
|
LoadingIndicator: () => React.JSX.Element;
|
|
6
7
|
IndicatorSeparator: () => null;
|
|
@@ -5,6 +5,7 @@ import './Title.global.css';
|
|
|
5
5
|
export interface TitleProps extends EllipsisText, TextAlign, HTMLAttributes<HTMLHeadingElement> {
|
|
6
6
|
level?: 1 | 2 | 3 | 4 | 5;
|
|
7
7
|
className?: string;
|
|
8
|
+
pretty?: boolean;
|
|
8
9
|
}
|
|
9
10
|
export declare const Title: React.ForwardRefExoticComponent<TitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
10
11
|
export default Title;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ClearIndicatorProps, DropdownIndicatorProps } from 'react-select';
|
|
2
|
+
import { ClearIndicatorProps, DropdownIndicatorProps, MultiValueRemoveProps } from 'react-select';
|
|
3
3
|
declare const _default: {
|
|
4
|
+
MultiValueRemove: (props: MultiValueRemoveProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
|
|
4
5
|
DropdownIndicator: (props: DropdownIndicatorProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
|
|
5
6
|
LoadingIndicator: () => React.JSX.Element;
|
|
6
7
|
IndicatorSeparator: () => null;
|
|
@@ -5,6 +5,7 @@ import './Title.global.css';
|
|
|
5
5
|
export interface TitleProps extends EllipsisText, TextAlign, HTMLAttributes<HTMLHeadingElement> {
|
|
6
6
|
level?: 1 | 2 | 3 | 4 | 5;
|
|
7
7
|
className?: string;
|
|
8
|
+
pretty?: boolean;
|
|
8
9
|
}
|
|
9
10
|
export declare const Title: React.ForwardRefExoticComponent<TitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
10
11
|
export default Title;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ClearIndicatorProps, DropdownIndicatorProps } from 'react-select';
|
|
2
|
+
import { ClearIndicatorProps, DropdownIndicatorProps, MultiValueRemoveProps } from 'react-select';
|
|
3
3
|
declare const _default: {
|
|
4
|
+
MultiValueRemove: (props: MultiValueRemoveProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
|
|
4
5
|
DropdownIndicator: (props: DropdownIndicatorProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
|
|
5
6
|
LoadingIndicator: () => React.JSX.Element;
|
|
6
7
|
IndicatorSeparator: () => null;
|
|
@@ -5,6 +5,7 @@ import './Title.global.css';
|
|
|
5
5
|
export interface TitleProps extends EllipsisText, TextAlign, HTMLAttributes<HTMLHeadingElement> {
|
|
6
6
|
level?: 1 | 2 | 3 | 4 | 5;
|
|
7
7
|
className?: string;
|
|
8
|
+
pretty?: boolean;
|
|
8
9
|
}
|
|
9
10
|
export declare const Title: React.ForwardRefExoticComponent<TitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
10
11
|
export default Title;
|
package/dist/Select/index.cjs.js
CHANGED
|
@@ -4829,7 +4829,7 @@ var MultiValueGeneric = function MultiValueGeneric(_ref4) {
|
|
|
4829
4829
|
};
|
|
4830
4830
|
var MultiValueContainer = MultiValueGeneric;
|
|
4831
4831
|
var MultiValueLabel = MultiValueGeneric;
|
|
4832
|
-
function MultiValueRemove(_ref5) {
|
|
4832
|
+
function MultiValueRemove$1(_ref5) {
|
|
4833
4833
|
var children = _ref5.children,
|
|
4834
4834
|
innerProps = _ref5.innerProps;
|
|
4835
4835
|
return jsx("div", _extends({
|
|
@@ -4989,7 +4989,7 @@ var components = {
|
|
|
4989
4989
|
MultiValue: MultiValue$1,
|
|
4990
4990
|
MultiValueContainer: MultiValueContainer,
|
|
4991
4991
|
MultiValueLabel: MultiValueLabel,
|
|
4992
|
-
MultiValueRemove: MultiValueRemove,
|
|
4992
|
+
MultiValueRemove: MultiValueRemove$1,
|
|
4993
4993
|
Option: Option$1,
|
|
4994
4994
|
Placeholder: Placeholder$1,
|
|
4995
4995
|
SelectContainer: SelectContainer,
|
|
@@ -7747,19 +7747,28 @@ var Spinner = function (_a) {
|
|
|
7747
7747
|
React.createElement("circle", { className: "vchasno-ui-spinner__svg__circle", cx: "50", cy: "50", r: "20", fill: "none", stroke: color, strokeWidth: "2", strokeMiterlimit: "10" }))));
|
|
7748
7748
|
};
|
|
7749
7749
|
|
|
7750
|
+
var closeSvg = (React.createElement("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
7751
|
+
React.createElement("path", { d: "M11.4 10L14.7 6.7C15.1 6.3 15.1 5.7 14.7 5.3C14.3 4.9 13.7 4.9 13.3 5.3L10 8.6L6.7 5.3C6.3 4.9 5.7 4.9 5.3 5.3C4.9 5.7 4.9 6.3 5.3 6.7L8.6 10L5.3 13.3C4.9 13.7 4.9 14.3 5.3 14.7C5.5 14.9 5.7 15 6 15C6.3 15 6.5 14.9 6.7 14.7L10 11.4L13.3 14.7C13.5 14.9 13.7 15 14 15C14.3 15 14.5 14.9 14.7 14.7C15.1 14.3 15.1 13.7 14.7 13.3L11.4 10Z", fill: "currentColor" })));
|
|
7750
7752
|
var IndicatorSeparator = function () { return null; };
|
|
7751
7753
|
var LoadingIndicator = function () { return React.createElement(Spinner, { height: "18px" }); };
|
|
7754
|
+
var MultiValueRemove = function (props) {
|
|
7755
|
+
return React.createElement(components.MultiValueRemove, __assign({}, props), closeSvg);
|
|
7756
|
+
};
|
|
7752
7757
|
var DropdownIndicator = function (props) {
|
|
7753
7758
|
return (React.createElement(components.DropdownIndicator, __assign({}, props),
|
|
7754
7759
|
React.createElement("svg", { width: "10", height: "7", viewBox: "0 0 10 7", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
7755
7760
|
React.createElement("path", { d: "M5.0025 6.0025C4.7425 6.0025 4.4825 5.9025 4.2925 5.7125L0.2925 1.7125C-0.0975 1.3225 -0.0975 0.6825 0.2925 0.2925C0.6825 -0.0975 1.3225 -0.0975 1.7125 0.2925L5.0025 3.5825L8.2825 0.3025C8.6725 -0.0875 9.3125 -0.0875 9.7025 0.3025C10.0925 0.6925 10.0925 1.3325 9.7025 1.7225L5.7125 5.7125C5.5125 5.9025 5.2525 6.0025 5.0025 6.0025Z", fill: "currentColor" }))));
|
|
7756
7761
|
};
|
|
7757
7762
|
var ClearIndicator = function (props) {
|
|
7758
|
-
return
|
|
7759
|
-
|
|
7760
|
-
|
|
7763
|
+
return React.createElement(components.ClearIndicator, __assign({}, props), closeSvg);
|
|
7764
|
+
};
|
|
7765
|
+
var CustomComponents = {
|
|
7766
|
+
MultiValueRemove: MultiValueRemove,
|
|
7767
|
+
DropdownIndicator: DropdownIndicator,
|
|
7768
|
+
LoadingIndicator: LoadingIndicator,
|
|
7769
|
+
IndicatorSeparator: IndicatorSeparator,
|
|
7770
|
+
ClearIndicator: ClearIndicator,
|
|
7761
7771
|
};
|
|
7762
|
-
var CustomComponents = { DropdownIndicator: DropdownIndicator, LoadingIndicator: LoadingIndicator, IndicatorSeparator: IndicatorSeparator, ClearIndicator: ClearIndicator };
|
|
7763
7772
|
|
|
7764
7773
|
var noOptionsMessageDefault = function () { return React.createElement("span", null, "\u041D\u0435 \u043C\u0430\u0454 \u043E\u043F\u0446\u0456\u0439"); };
|
|
7765
7774
|
var loadingMessageDefault = function () { return React.createElement("span", null, "\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F..."); };
|
|
@@ -7772,7 +7781,7 @@ var composeStyles = {
|
|
|
7772
7781
|
},
|
|
7773
7782
|
};
|
|
7774
7783
|
|
|
7775
|
-
var css_248z = ".vchasno-ui-select {\n position: relative;\n display: inline-flex;\n flex-direction: column;\n gap: 5px;\n}\n\n.vchasno-ui-select .vchasno-ui-label-text {\n transform: translate(0, -18px);\n transition:\n font-size 0.3s,\n transform 0.3s;\n}\n\n.vchasno-ui-select:has(.vchasno-ui-select__value-container--has-value) .vchasno-ui-label-text,\n.vchasno-ui-select:focus-within .vchasno-ui-label-text {\n font-size: 12px;\n transform: translate(0, -42px);\n}\n\n.vchasno-ui-select.--wide {\n width: 100%;\n}\n\n.vchasno-ui-select .vchasno-ui-select__control {\n min-width: 200px;\n min-height: 50px;\n border-color: var(--vchasno-ui-input-border-color-default);\n border-radius: 8px;\n font-family: Roboto, Arial, Tahoma, Helvetica, 'Liberation Sans', sans-serif;\n outline: solid 3px transparent;\n}\n\n.vchasno-ui-select.--disabled .vchasno-ui-select__control {\n border: 1px solid var(--vchasno-ui-input-border-color-default);\n background-color: #f3f6f8;\n}\n\n.vchasno-ui-select .vchasno-ui-select__control.vchasno-ui-select__control--is-disabled {\n opacity: 0.8;\n}\n\n.vchasno-ui-select .vchasno-ui-select__option {\n transition:\n opacity var(--vchasno-ui-transition-duration-sec, 0.3s),\n background-color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-select.--disabled .vchasno-ui-select__option {\n background-color: #f3f6f8;\n opacity: 0.8;\n pointer-events: none;\n}\n\n.vchasno-ui-select .vchasno-ui-select__menu {\n z-index: 100;\n border: 1px solid var(--vchasno-ui-input-border-color-default);\n border-radius: 8px;\n margin-top: 4px;\n margin-bottom: 6px;\n box-shadow: none;\n transition: border var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-select .vchasno-ui-select__control--menu-is-open {\n border-color: var(--vchasno-ui-select-menu-border-color, #6b5fff);\n outline-color: var(--vchasno-ui-input-outline-color-focused);\n}\n\n.vchasno-ui-select.--error .vchasno-ui-select__control,\n.vchasno-ui-select.--error:hover .vchasno-ui-select__control--menu-is-open {\n border: 1px solid #ff5937;\n outline-color: var(--vchasno-ui-input-outline-color-error);\n}\n\n.vchasno-ui-select .vchasno-ui-select__control:hover {\n border-color: var(--vchasno-ui-input-border-color-focused);\n}\n\n.vchasno-ui-select .vchasno-ui-select__dropdown-indicator {\n color: var(--vchasno-ui-input-font-color);\n}\n\n.vchasno-ui-select.--error .vchasno-ui-select__control:hover {\n border-color: #ff5937;\n}\n\n.vchasno-ui-select\n .vchasno-ui-select__control--menu-is-open\n .vchasno-ui-select__dropdown-indicator {\n color: var(--vchasno-ui-
|
|
7784
|
+
var css_248z = ".vchasno-ui-select {\n position: relative;\n display: inline-flex;\n flex-direction: column;\n gap: 5px;\n}\n\n.vchasno-ui-select .vchasno-ui-label-text {\n transform: translate(0, -18px);\n transition:\n font-size 0.3s,\n transform 0.3s;\n}\n\n.vchasno-ui-select:has(.vchasno-ui-select__value-container--has-value) .vchasno-ui-label-text,\n.vchasno-ui-select:focus-within .vchasno-ui-label-text {\n font-size: 12px;\n transform: translate(0, -42px);\n}\n\n.vchasno-ui-select.--wide {\n width: 100%;\n}\n\n.vchasno-ui-select .vchasno-ui-select__control {\n min-width: 200px;\n min-height: 50px;\n border-color: var(--vchasno-ui-input-border-color-default);\n border-radius: 8px;\n font-family: Roboto, Arial, Tahoma, Helvetica, 'Liberation Sans', sans-serif;\n outline: solid 3px transparent;\n}\n\n.vchasno-ui-select.--disabled .vchasno-ui-select__control {\n border: 1px solid var(--vchasno-ui-input-border-color-default);\n background-color: #f3f6f8;\n}\n\n.vchasno-ui-select .vchasno-ui-select__control.vchasno-ui-select__control--is-disabled {\n opacity: 0.8;\n}\n\n.vchasno-ui-select .vchasno-ui-select__option {\n transition:\n opacity var(--vchasno-ui-transition-duration-sec, 0.3s),\n background-color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-select.--disabled .vchasno-ui-select__option {\n background-color: #f3f6f8;\n opacity: 0.8;\n pointer-events: none;\n}\n\n.vchasno-ui-select .vchasno-ui-select__menu {\n z-index: 100;\n border: 1px solid var(--vchasno-ui-input-border-color-default);\n border-radius: 8px;\n margin-top: 4px;\n margin-bottom: 6px;\n box-shadow: none;\n transition: border var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-select .vchasno-ui-select__control--menu-is-open {\n border-color: var(--vchasno-ui-select-menu-border-color, #6b5fff);\n outline-color: var(--vchasno-ui-input-outline-color-focused);\n}\n\n.vchasno-ui-select.--error .vchasno-ui-select__control,\n.vchasno-ui-select.--error:hover .vchasno-ui-select__control--menu-is-open {\n border: 1px solid #ff5937;\n outline-color: var(--vchasno-ui-input-outline-color-error);\n}\n\n.vchasno-ui-select .vchasno-ui-select__control:hover {\n border-color: var(--vchasno-ui-input-border-color-focused);\n}\n\n.vchasno-ui-select .vchasno-ui-select__dropdown-indicator {\n color: var(--vchasno-ui-input-font-color);\n}\n\n.vchasno-ui-select.--error .vchasno-ui-select__control:hover {\n border-color: #ff5937;\n}\n\n.vchasno-ui-select\n .vchasno-ui-select__control--menu-is-open\n .vchasno-ui-select__dropdown-indicator {\n color: var(--vchasno-ui-input-border-color-focused, #6b5fff);\n transition:\n background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-select.--error .vchasno-ui-select__dropdown-indicator {\n color: #ff5937;\n}\n\n.vchasno-ui-select.--error\n .vchasno-ui-select__control--menu-is-open\n .vchasno-ui-select__dropdown-indicator {\n color: #ff5937;\n transition:\n background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-select.--error .vchasno-ui-select__dropdown-indicator:hover,\n.vchasno-ui-select.--error\n .vchasno-ui-select__control:hover\n .vchasno-ui-select__dropdown-indicator {\n color: #ff5937;\n}\n\n.vchasno-ui-select.--error .vchasno-ui-select__control.vchasno-ui-select__control--menu-is-open,\n.vchasno-ui-select.--error .vchasno-ui-select__control--menu-is-open + .vchasno-ui-select__menu {\n border: 1px solid #ff5937;\n}\n\n.vchasno-ui-select .vchasno-ui-select__control.vchasno-ui-select__control--is-focused {\n border-color: var(--vchasno-ui-input-border-color-focused);\n box-shadow: none;\n outline-color: var(--vchasno-ui-input-outline-color-focused);\n}\n\n.vchasno-ui-select .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-input-border-color-focused);\n}\n\n.vchasno-ui-select .vchasno-ui-select__placeholder {\n color: var(--vchasno-ui-input-border-color-default);\n font-size: var(--vchasno-ui-input-font-size);\n font-weight: 400;\n}\n\n.vchasno-ui-select .vchasno-ui-select__clear-indicator {\n padding: 0;\n border-radius: 4px;\n color: var(--vchasno-ui-input-font-color);\n}\n\n.vchasno-ui-select .vchasno-ui-select__clear-indicator:hover {\n cursor: pointer;\n}\n\n.vchasno-ui-select .vchasno-ui-select__option--is-selected,\n.vchasno-ui-select .vchasno-ui-select__option--is-focused,\n.vchasno-ui-select .vchasno-ui-select__option:hover {\n background-color: var(--vchasno-ui-select-option-bg-selected);\n color: var(--vchasno-ui-select-option-color-selected);\n}\n\n.vchasno-ui-select .vchasno-ui-select__option:hover {\n cursor: pointer;\n}\n\n.vchasno-ui-select.--disabled {\n cursor: not-allowed;\n}\n\n.vchasno-ui-select .vchasno-ui-select__multi-value {\n border-radius: 8px;\n background-color: var(--vchasno-ui-select-option-bg-selected);\n outline: 1px solid var(--vchasno-ui-select-menu-border-color, transparent);\n}\n\n.vchasno-ui-select .vchasno-ui-select__multi-value__remove {\n padding: 0;\n padding-right: 3px;\n background-color: transparent;\n color: var(--vchasno-ui-label-color-default);\n transition: color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-select .vchasno-ui-select__multi-value__remove:hover {\n background-color: transparent;\n color: var(--vchasno-ui-input-color-error);\n cursor: pointer;\n}\n\n.vchasno-ui-select .vchasno-ui-select__multi-value__remove svg {\n width: 20px;\n height: 20px;\n}\n\n.vchasno-ui-select .vchasno-ui-select__indicators {\n padding-right: 5px;\n}\n\n.vchasno-ui-select .vchasno-ui-select__value-container {\n padding: 5px 14px;\n}\n\n.vchasno-ui-select .vchasno-ui-select__multi-value__label {\n padding: 6px 0 6px 6px;\n font-size: 14px;\n}\n\n.vchasno-ui-select .vchasno-ui-select .vchasno-ui-select__multi-value__remove {\n padding: 6px;\n font-size: 14px;\n}\n";
|
|
7776
7785
|
styleInject(css_248z);
|
|
7777
7786
|
|
|
7778
7787
|
var Select = function (_a) {
|