@vchasno/ui-kit 0.3.21 → 0.3.23

package/dist/SelectCreatable/types/components/Select/Label.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 interface LabelProps {
-    isFloating: boolean;
-    label: string;
+    label?: string;
 }
 declare const Label: React.FC<React.PropsWithChildren<LabelProps>>;
 export default Label;

package/dist/SelectCreatable/types/components/Select/customComponents.d.ts

@@ -1,11 +1,9 @@
 import React from 'react';
 import { ClearIndicatorProps, DropdownIndicatorProps } from 'react-select';
-import { CustomControlProps } from './types';
 declare const _default: {
     DropdownIndicator: (props: DropdownIndicatorProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
     LoadingIndicator: () => React.JSX.Element;
     IndicatorSeparator: () => null;
     ClearIndicator: (props: ClearIndicatorProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
-    Control: (props: CustomControlProps) => React.JSX.Element;
 };
 export default _default;

package/dist/Snackbar/index.cjs.js

@@ -240,7 +240,7 @@ var Spinner = function (_a) {
             React$1.createElement("circle", { className: "vchasno-ui-spinner__svg__circle", cx: "50", cy: "50", r: "20", fill: "none", stroke: color, strokeWidth: "2", strokeMiterlimit: "10" }))));
 };
 
-var css_248z$n = ".vchasno-ui-button {\n    display: inline-flex;\n    min-height: 40px;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    border-radius: 8px;\n    background-color: var(--vchasno-ui-btn-default-bg);\n    color: var(--vchasno-ui-btn-default-color);\n    font-size: var(--vchasno-ui-btn-font-size);\n    font-weight: 700;\n    gap: 5px;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        color var(--vchasno-ui-transition-duration-sec, 0.3s);\n    user-select: none;\n}\n\n.vchasno-ui-button:disabled {\n    cursor: not-allowed;\n    opacity: 0.8;\n}\n\n.vchasno-ui-button:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-default-hover-bg);\n    color: var(--vchasno-ui-btn-default-hover-color);\n    cursor: pointer;\n}\n\n.vchasno-ui-button.--sm {\n    min-width: 40px;\n    padding: 0 15px;\n}\n\n.vchasno-ui-button.--md {\n    min-width: 145px;\n    padding: 0 20px;\n}\n\n.vchasno-ui-button.--lg {\n    min-width: 200px;\n    min-height: 50px;\n    padding: 0 20px;\n}\n\n.vchasno-ui-button.--wide {\n    width: 100%;\n}\n\n.vchasno-ui-button.--primary {\n    border: 1px solid transparent;\n    background-color: var(--vchasno-ui-btn-primary-bg);\n    box-shadow: inset 0 -2px 0 rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary {\n    background-color: var(--vchasno-ui-btn-secondary-bg);\n    box-shadow: inset 0 -2px 0 rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button:disabled.--primary,\n.vchasno-ui-button:disabled.--secondary {\n    border-color: #b6cadb;\n    background-color: #b6cadb;\n    box-shadow: inset 0 -2px 0 rgb(139 163 182 / 50%);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-primary-hover-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: var(--vchasno-ui-btn-default-hover-bg);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary.--outline {\n    border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--secondary:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-secondary-hover-bg);\n    color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button.--secondary.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n    background-color: rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--pink {\n    background-color: var(--vchasno-ui-btn-pink-bg);\n    box-shadow: inset 0 -2px 0 rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline {\n    border: 1px solid var(--vchasno-ui-btn-pink-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--pink:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-pink-hover-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-pink-bg);\n    background-color: transparent;\n    color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--danger {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: var(--vchasno-ui-btn-danger-bg, rgb(239 101 98 / 20%));\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--danger.--outline {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button:disabled.--danger {\n    border: 1px solid #b6cadb;\n    background-color: rgb(182 202 219 / 20%);\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--danger:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-danger-hover-bg, #ef6562);\n    color: var(--vchasno-ui-btn-danger-hover-color, #fff);\n}\n\n.vchasno-ui-button.--danger.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-btn-default-color);\n    transition: stroke var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-btn-default-hover-color);\n}\n\n.vchasno-ui-button:disabled.--transparent {\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--light {\n    border: 1px solid transparent;\n    background-color: var(--vchasno-ui-btn-light-bg, #fff);\n    box-shadow: 0 2px 4px rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-light-color);\n}\n\n.vchasno-ui-button:disabled.--light {\n    border: none;\n    background-color: rgb(182 202 219 / 20%);\n    box-shadow: 0 2px 4px rgb(0 0 0 / 10%);\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--light.--outline {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: var(--vchasno-ui-btn-primary-color);\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--light:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-light-hover-bg);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n";
+var css_248z$n = ".vchasno-ui-button {\n    display: inline-flex;\n    min-height: 40px;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    border-radius: 8px;\n    background-color: var(--vchasno-ui-btn-default-bg);\n    color: var(--vchasno-ui-btn-default-color);\n    font-size: var(--vchasno-ui-btn-font-size);\n    font-weight: 700;\n    gap: 5px;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        color var(--vchasno-ui-transition-duration-sec, 0.3s);\n    user-select: none;\n}\n\n.vchasno-ui-button:disabled {\n    cursor: not-allowed;\n    opacity: 0.8;\n}\n\n.vchasno-ui-button:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-default-hover-bg);\n    color: var(--vchasno-ui-btn-default-hover-color);\n    cursor: pointer;\n}\n\n.vchasno-ui-button.--sm {\n    min-width: 40px;\n    padding: 0 15px;\n}\n\n.vchasno-ui-button.--md {\n    min-width: 145px;\n    padding: 0 20px;\n}\n\n.vchasno-ui-button.--lg {\n    min-width: 200px;\n    min-height: 50px;\n    padding: 0 20px;\n}\n\n.vchasno-ui-button.--wide {\n    width: 100%;\n}\n\n.vchasno-ui-button.--primary {\n    border: 1px solid transparent;\n    background-color: var(--vchasno-ui-btn-primary-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary {\n    background-color: var(--vchasno-ui-btn-secondary-bg);\n    color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button:disabled.--primary,\n.vchasno-ui-button:disabled.--secondary {\n    border-color: #b6cadb;\n    background-color: #b6cadb;\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-primary-hover-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: var(--vchasno-ui-btn-default-hover-bg);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary.--outline {\n    border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--secondary:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-secondary-hover-bg);\n    color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button.--secondary.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n    background-color: rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--pink {\n    background-color: var(--vchasno-ui-btn-pink-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline {\n    border: 1px solid var(--vchasno-ui-btn-pink-bg);\n    background-color: transparent;\n    color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--pink:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-pink-hover-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-pink-bg);\n    background-color: transparent;\n    color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--danger {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: var(--vchasno-ui-btn-danger-bg, rgb(239 101 98 / 20%));\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--danger.--outline {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: transparent;\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button:disabled.--danger {\n    border: 1px solid #b6cadb;\n    background-color: rgb(182 202 219 / 20%);\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--danger:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-danger-hover-bg, #ef6562);\n    color: var(--vchasno-ui-btn-danger-hover-color, #fff);\n}\n\n.vchasno-ui-button.--danger.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-btn-default-color);\n    transition: stroke var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-btn-default-hover-color);\n}\n\n.vchasno-ui-button:disabled.--transparent {\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--light {\n    border: 1px solid transparent;\n    background-color: var(--vchasno-ui-btn-light-bg, #fff);\n    color: var(--vchasno-ui-btn-light-color);\n}\n\n.vchasno-ui-button:disabled.--light {\n    border: none;\n    background-color: rgb(182 202 219 / 20%);\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--light.--outline {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: var(--vchasno-ui-btn-primary-color);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--light:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-light-hover-bg);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n";
 styleInject(css_248z$n);
 
 var Button = React$1.forwardRef(function (_a, ref) {

package/dist/Snackbar/index.js

@@ -218,7 +218,7 @@ var Spinner = function (_a) {
             React__default.createElement("circle", { className: "vchasno-ui-spinner__svg__circle", cx: "50", cy: "50", r: "20", fill: "none", stroke: color, strokeWidth: "2", strokeMiterlimit: "10" }))));
 };
 
-var css_248z$n = ".vchasno-ui-button {\n    display: inline-flex;\n    min-height: 40px;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    border-radius: 8px;\n    background-color: var(--vchasno-ui-btn-default-bg);\n    color: var(--vchasno-ui-btn-default-color);\n    font-size: var(--vchasno-ui-btn-font-size);\n    font-weight: 700;\n    gap: 5px;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        color var(--vchasno-ui-transition-duration-sec, 0.3s);\n    user-select: none;\n}\n\n.vchasno-ui-button:disabled {\n    cursor: not-allowed;\n    opacity: 0.8;\n}\n\n.vchasno-ui-button:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-default-hover-bg);\n    color: var(--vchasno-ui-btn-default-hover-color);\n    cursor: pointer;\n}\n\n.vchasno-ui-button.--sm {\n    min-width: 40px;\n    padding: 0 15px;\n}\n\n.vchasno-ui-button.--md {\n    min-width: 145px;\n    padding: 0 20px;\n}\n\n.vchasno-ui-button.--lg {\n    min-width: 200px;\n    min-height: 50px;\n    padding: 0 20px;\n}\n\n.vchasno-ui-button.--wide {\n    width: 100%;\n}\n\n.vchasno-ui-button.--primary {\n    border: 1px solid transparent;\n    background-color: var(--vchasno-ui-btn-primary-bg);\n    box-shadow: inset 0 -2px 0 rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary {\n    background-color: var(--vchasno-ui-btn-secondary-bg);\n    box-shadow: inset 0 -2px 0 rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button:disabled.--primary,\n.vchasno-ui-button:disabled.--secondary {\n    border-color: #b6cadb;\n    background-color: #b6cadb;\n    box-shadow: inset 0 -2px 0 rgb(139 163 182 / 50%);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-primary-hover-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: var(--vchasno-ui-btn-default-hover-bg);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary.--outline {\n    border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--secondary:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-secondary-hover-bg);\n    color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button.--secondary.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n    background-color: rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--pink {\n    background-color: var(--vchasno-ui-btn-pink-bg);\n    box-shadow: inset 0 -2px 0 rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline {\n    border: 1px solid var(--vchasno-ui-btn-pink-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--pink:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-pink-hover-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-pink-bg);\n    background-color: transparent;\n    color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--danger {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: var(--vchasno-ui-btn-danger-bg, rgb(239 101 98 / 20%));\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--danger.--outline {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button:disabled.--danger {\n    border: 1px solid #b6cadb;\n    background-color: rgb(182 202 219 / 20%);\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--danger:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-danger-hover-bg, #ef6562);\n    color: var(--vchasno-ui-btn-danger-hover-color, #fff);\n}\n\n.vchasno-ui-button.--danger.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-btn-default-color);\n    transition: stroke var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-btn-default-hover-color);\n}\n\n.vchasno-ui-button:disabled.--transparent {\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--light {\n    border: 1px solid transparent;\n    background-color: var(--vchasno-ui-btn-light-bg, #fff);\n    box-shadow: 0 2px 4px rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-light-color);\n}\n\n.vchasno-ui-button:disabled.--light {\n    border: none;\n    background-color: rgb(182 202 219 / 20%);\n    box-shadow: 0 2px 4px rgb(0 0 0 / 10%);\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--light.--outline {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: var(--vchasno-ui-btn-primary-color);\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--light:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-light-hover-bg);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n";
+var css_248z$n = ".vchasno-ui-button {\n    display: inline-flex;\n    min-height: 40px;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    border-radius: 8px;\n    background-color: var(--vchasno-ui-btn-default-bg);\n    color: var(--vchasno-ui-btn-default-color);\n    font-size: var(--vchasno-ui-btn-font-size);\n    font-weight: 700;\n    gap: 5px;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        color var(--vchasno-ui-transition-duration-sec, 0.3s);\n    user-select: none;\n}\n\n.vchasno-ui-button:disabled {\n    cursor: not-allowed;\n    opacity: 0.8;\n}\n\n.vchasno-ui-button:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-default-hover-bg);\n    color: var(--vchasno-ui-btn-default-hover-color);\n    cursor: pointer;\n}\n\n.vchasno-ui-button.--sm {\n    min-width: 40px;\n    padding: 0 15px;\n}\n\n.vchasno-ui-button.--md {\n    min-width: 145px;\n    padding: 0 20px;\n}\n\n.vchasno-ui-button.--lg {\n    min-width: 200px;\n    min-height: 50px;\n    padding: 0 20px;\n}\n\n.vchasno-ui-button.--wide {\n    width: 100%;\n}\n\n.vchasno-ui-button.--primary {\n    border: 1px solid transparent;\n    background-color: var(--vchasno-ui-btn-primary-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary {\n    background-color: var(--vchasno-ui-btn-secondary-bg);\n    color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button:disabled.--primary,\n.vchasno-ui-button:disabled.--secondary {\n    border-color: #b6cadb;\n    background-color: #b6cadb;\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-primary-hover-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: var(--vchasno-ui-btn-default-hover-bg);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary.--outline {\n    border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n    background-color: transparent;\n    box-shadow: none;\n    color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--secondary:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-secondary-hover-bg);\n    color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button.--secondary.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n    background-color: rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--pink {\n    background-color: var(--vchasno-ui-btn-pink-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline {\n    border: 1px solid var(--vchasno-ui-btn-pink-bg);\n    background-color: transparent;\n    color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--pink:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-pink-hover-bg);\n    color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-pink-bg);\n    background-color: transparent;\n    color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--danger {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: var(--vchasno-ui-btn-danger-bg, rgb(239 101 98 / 20%));\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--danger.--outline {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: transparent;\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button:disabled.--danger {\n    border: 1px solid #b6cadb;\n    background-color: rgb(182 202 219 / 20%);\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--danger:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-danger-hover-bg, #ef6562);\n    color: var(--vchasno-ui-btn-danger-hover-color, #fff);\n}\n\n.vchasno-ui-button.--danger.--outline:not(:disabled):hover {\n    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n    background-color: rgb(0 0 0 / 10%);\n    color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-btn-default-color);\n    transition: stroke var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-btn-default-hover-color);\n}\n\n.vchasno-ui-button:disabled.--transparent {\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--light {\n    border: 1px solid transparent;\n    background-color: var(--vchasno-ui-btn-light-bg, #fff);\n    color: var(--vchasno-ui-btn-light-color);\n}\n\n.vchasno-ui-button:disabled.--light {\n    border: none;\n    background-color: rgb(182 202 219 / 20%);\n    color: #b6cadb;\n}\n\n.vchasno-ui-button.--light.--outline {\n    border: 1px solid var(--vchasno-ui-btn-primary-bg);\n    background-color: var(--vchasno-ui-btn-primary-color);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--light:not(:disabled):hover {\n    background-color: var(--vchasno-ui-btn-light-hover-bg);\n    color: var(--vchasno-ui-btn-primary-bg);\n}\n";
 styleInject(css_248z$n);
 
 var Button = React__default.forwardRef(function (_a, ref) {

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

@@ -1,7 +1,6 @@
 import React from 'react';
 interface LabelProps {
-    isFloating: boolean;
-    label: string;
+    label?: string;
 }
 declare const Label: React.FC<React.PropsWithChildren<LabelProps>>;
 export default Label;

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

@@ -1,11 +1,9 @@
 import React from 'react';
 import { ClearIndicatorProps, DropdownIndicatorProps } from 'react-select';
-import { CustomControlProps } from './types';
 declare const _default: {
     DropdownIndicator: (props: DropdownIndicatorProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
     LoadingIndicator: () => React.JSX.Element;
     IndicatorSeparator: () => null;
     ClearIndicator: (props: ClearIndicatorProps<unknown, boolean, import("react-select").GroupBase<unknown>>) => React.JSX.Element;
-    Control: (props: CustomControlProps) => React.JSX.Element;
 };
 export default _default;

package/dist/css/Alert.global.css

@@ -0,0 +1,79 @@
+.vchasno-ui-alert {
+    display: inline-flex;
+    min-height: 40px;
+    box-sizing: border-box;
+    flex-shrink: 0;
+    align-items: center;
+    padding: 12px 16px;
+    border-radius: 4px;
+    border-left: 3px solid transparent;
+    font-size: 14px;
+    gap: 12px;
+    line-height: 20px;
+}
+
+.vchasno-ui-alert strong,
+.vchasno-ui-alert b {
+    font-weight: 700;
+}
+
+.vchasno-ui-alert.--wide {
+    width: 100%;
+}
+
+.vchasno-ui-alert.--left-border {
+    border-left-width: 4px;
+}
+
+.vchasno-ui-alert__icon-wrapper,
+.vchasno-ui-alert__close-icon {
+    display: flex;
+    width: 20px;
+    height: 20px;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+    font-size: 20px;
+    line-height: 20px;
+}
+
+.vchasno-ui-alert.--info {
+    border-color: var(--vchasno-ui-alert-info-color, #006be9);
+    background-color: var(--vchasno-ui-alert-info-bg, #ecf4ff);
+}
+
+.vchasno-ui-alert.--warning {
+    border-color: var(--vchasno-ui-alert-warning-color, #ffb200);
+    background-color: var(--vchasno-ui-alert-warning-bg, #fff2d6);
+}
+
+.vchasno-ui-alert.--error {
+    border-color: var(--vchasno-ui-alert-error-color, #e73434);
+    background-color: var(--vchasno-ui-alert-error-bg, #ffeded);
+}
+
+.vchasno-ui-alert.--success {
+    border-color: var(--vchasno-ui-alert-success-color, #00b700);
+    background-color: var(--vchasno-ui-alert-success-bg, #e7f3d9);
+}
+
+.vchasno-ui-alert.--config {
+    border-color: var(--vchasno-ui-alert-config-color, #006be9);
+    background-color: var(--vchasno-ui-alert-config-bg, #f3f6f8);
+}
+
+.vchasno-ui-alert__close-icon {
+    width: 30px;
+    height: 30px;
+    border-radius: 4px;
+    transition: background-color var(--vchasno-ui-transition-duration-sec, 0.3s);
+}
+
+.vchasno-ui-alert__close-icon:hover {
+    background-color: rgb(255 255 255 / 50%);
+    cursor: pointer;
+}
+
+.vchasno-ui-alert.--close {
+    display: none;
+}

package/dist/css/BubbleBox.global.css

@@ -0,0 +1,47 @@
+.vchasno-ui-BubbleBox {
+    --vchasno-ui-bubble-height: 40px;
+    --vchasno-ui-bubble-width: 40px;
+    --vchasno-ui-bubble-shadow: 2px 4px 6px rgb(0 0 0 / 20%);
+
+    position: relative;
+    min-height: calc(var(--vchasno-ui-bubble-height) * 2);
+    box-sizing: border-box;
+    transition: var(--vchasno-ui-transition-duration-sec);
+}
+
+.vchasno-ui-BubbleBox__svg {
+    position: absolute;
+    z-index: -1;
+    top: 0;
+    left: 0;
+    overflow: visible;
+    pointer-events: none;
+    transform: translateZ(0);
+    transition: var(--vchasno-ui-transition-duration-sec);
+}
+
+.vchasno-ui-BubbleBox__svg path {
+    transition: var(--vchasno-ui-transition-duration-sec);
+}
+
+.vchasno-ui-BubbleBox__svg.vchasno-ui-BubbleBox__shadow {
+    filter: drop-shadow(var(--vchasno-ui-bubble-shadow));
+}
+
+.vchasno-ui-BubbleBox__bubble {
+    position: absolute;
+    z-index: 1;
+    right: 0;
+    bottom: 0;
+    display: flex;
+    width: var(--vchasno-ui-bubble-width);
+    height: var(--vchasno-ui-bubble-height);
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    border: 0;
+    border-radius: var(--vchasno-ui-bubble-width);
+    margin: 0;
+    cursor: pointer;
+    transition: var(--vchasno-ui-transition-duration-sec);
+}

package/dist/css/Button.global.css

@@ -0,0 +1,189 @@
+.vchasno-ui-button {
+    display: inline-flex;
+    min-height: 40px;
+    align-items: center;
+    justify-content: center;
+    border: 0;
+    border-radius: 8px;
+    background-color: var(--vchasno-ui-btn-default-bg);
+    color: var(--vchasno-ui-btn-default-color);
+    font-size: var(--vchasno-ui-btn-font-size);
+    font-weight: 700;
+    gap: 5px;
+    transition:
+        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),
+        color var(--vchasno-ui-transition-duration-sec, 0.3s);
+    user-select: none;
+}
+
+.vchasno-ui-button:disabled {
+    cursor: not-allowed;
+    opacity: 0.8;
+}
+
+.vchasno-ui-button:not(:disabled):hover {
+    background-color: var(--vchasno-ui-btn-default-hover-bg);
+    color: var(--vchasno-ui-btn-default-hover-color);
+    cursor: pointer;
+}
+
+.vchasno-ui-button.--sm {
+    min-width: 40px;
+    padding: 0 15px;
+}
+
+.vchasno-ui-button.--md {
+    min-width: 145px;
+    padding: 0 20px;
+}
+
+.vchasno-ui-button.--lg {
+    min-width: 200px;
+    min-height: 50px;
+    padding: 0 20px;
+}
+
+.vchasno-ui-button.--wide {
+    width: 100%;
+}
+
+.vchasno-ui-button.--primary {
+    border: 1px solid transparent;
+    background-color: var(--vchasno-ui-btn-primary-bg);
+    color: var(--vchasno-ui-btn-primary-color);
+}
+
+.vchasno-ui-button.--primary.--outline {
+    border: 1px solid var(--vchasno-ui-btn-primary-bg);
+    background-color: transparent;
+    box-shadow: none;
+    color: var(--vchasno-ui-btn-primary-bg);
+}
+
+.vchasno-ui-button.--secondary {
+    background-color: var(--vchasno-ui-btn-secondary-bg);
+    color: var(--vchasno-ui-btn-secondary-color);
+}
+
+.vchasno-ui-button:disabled.--primary,
+.vchasno-ui-button:disabled.--secondary {
+    border-color: #b6cadb;
+    background-color: #b6cadb;
+    color: var(--vchasno-ui-btn-primary-color);
+}
+
+.vchasno-ui-button.--primary:not(:disabled):hover {
+    background-color: var(--vchasno-ui-btn-primary-hover-bg);
+    color: var(--vchasno-ui-btn-primary-color);
+}
+
+.vchasno-ui-button.--primary.--outline:not(:disabled):hover {
+    border: 1px solid var(--vchasno-ui-btn-primary-bg);
+    background-color: var(--vchasno-ui-btn-default-hover-bg);
+    color: var(--vchasno-ui-btn-primary-bg);
+}
+
+.vchasno-ui-button.--secondary.--outline {
+    border: 1px solid var(--vchasno-ui-btn-secondary-bg);
+    background-color: transparent;
+    box-shadow: none;
+    color: var(--vchasno-ui-btn-secondary-bg);
+}
+
+.vchasno-ui-button.--secondary:not(:disabled):hover {
+    background-color: var(--vchasno-ui-btn-secondary-hover-bg);
+    color: var(--vchasno-ui-btn-secondary-color);
+}
+
+.vchasno-ui-button.--secondary.--outline:not(:disabled):hover {
+    border: 1px solid var(--vchasno-ui-btn-secondary-bg);
+    background-color: rgb(0 0 0 / 10%);
+    color: var(--vchasno-ui-btn-secondary-bg);
+}
+
+.vchasno-ui-button.--pink {
+    background-color: var(--vchasno-ui-btn-pink-bg);
+    color: var(--vchasno-ui-btn-primary-color);
+}
+
+.vchasno-ui-button.--pink.--outline {
+    border: 1px solid var(--vchasno-ui-btn-pink-bg);
+    background-color: transparent;
+    color: var(--vchasno-ui-btn-pink-bg);
+}
+
+.vchasno-ui-button.--pink:not(:disabled):hover {
+    background-color: var(--vchasno-ui-btn-pink-hover-bg);
+    color: var(--vchasno-ui-btn-primary-color);
+}
+
+.vchasno-ui-button.--pink.--outline:not(:disabled):hover {
+    border: 1px solid var(--vchasno-ui-btn-pink-bg);
+    background-color: transparent;
+    color: var(--vchasno-ui-btn-pink-bg);
+}
+
+.vchasno-ui-button.--danger {
+    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);
+    background-color: var(--vchasno-ui-btn-danger-bg, rgb(239 101 98 / 20%));
+    color: var(--vchasno-ui-btn-danger-color, #ef6562);
+}
+
+.vchasno-ui-button.--danger.--outline {
+    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);
+    background-color: transparent;
+    color: var(--vchasno-ui-btn-danger-color, #ef6562);
+}
+
+.vchasno-ui-button:disabled.--danger {
+    border: 1px solid #b6cadb;
+    background-color: rgb(182 202 219 / 20%);
+    color: #b6cadb;
+}
+
+.vchasno-ui-button.--danger:not(:disabled):hover {
+    background-color: var(--vchasno-ui-btn-danger-hover-bg, #ef6562);
+    color: var(--vchasno-ui-btn-danger-hover-color, #fff);
+}
+
+.vchasno-ui-button.--danger.--outline:not(:disabled):hover {
+    border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);
+    background-color: rgb(0 0 0 / 10%);
+    color: var(--vchasno-ui-btn-danger-color, #ef6562);
+}
+
+.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle {
+    stroke: var(--vchasno-ui-btn-default-color);
+    transition: stroke var(--vchasno-ui-transition-duration-sec, 0.3s);
+}
+
+.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle {
+    stroke: var(--vchasno-ui-btn-default-hover-color);
+}
+
+.vchasno-ui-button:disabled.--transparent {
+    color: #b6cadb;
+}
+
+.vchasno-ui-button.--light {
+    border: 1px solid transparent;
+    background-color: var(--vchasno-ui-btn-light-bg, #fff);
+    color: var(--vchasno-ui-btn-light-color);
+}
+
+.vchasno-ui-button:disabled.--light {
+    border: none;
+    background-color: rgb(182 202 219 / 20%);
+    color: #b6cadb;
+}
+
+.vchasno-ui-button.--light.--outline {
+    border: 1px solid var(--vchasno-ui-btn-primary-bg);
+    background-color: var(--vchasno-ui-btn-primary-color);
+    color: var(--vchasno-ui-btn-primary-bg);
+}
+
+.vchasno-ui-button.--light:not(:disabled):hover {
+    background-color: var(--vchasno-ui-btn-light-hover-bg);
+    color: var(--vchasno-ui-btn-primary-bg);
+}

package/dist/css/Checkbox.global.css

@@ -0,0 +1,74 @@
+.vchasno-ui-checkbox {
+    display: inline-flex;
+    align-items: center;
+    cursor: pointer;
+    gap: 10px;
+    user-select: none;
+}
+
+.vchasno-ui-checkbox__box {
+    display: inline-flex;
+    width: 16px;
+    height: 16px;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+    border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);
+    border-radius: 3px;
+    outline: 2px solid transparent;
+    transition:
+        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),
+        border var(--vchasno-ui-transition-duration-sec, 0.3s),
+        outline var(--vchasno-ui-transition-duration-sec, 0.3s);
+}
+
+.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {
+    stroke: var(--vchasno-ui-checkbox-bg-color);
+}
+
+.vchasno-ui-checkbox__svg {
+    color: transparent;
+    transform: scale(0) translateZ(0);
+    transition:
+        color var(--vchasno-ui-transition-duration-sec),
+        transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);
+}
+
+.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {
+    display: none;
+}
+
+.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {
+    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);
+    background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);
+}
+
+.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {
+    color: var(--vchasno-ui-checkbox-icon-color);
+    transform: scale(1) translateZ(0);
+}
+
+.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,
+.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {
+    border-color: var(--vchasno-ui-checkbox-bg-color, #3069fe);
+    outline: 2px solid var(--vchasno-ui-checkbox-outline-color, #d9eaff);
+}
+
+.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {
+    background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);
+}
+
+.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {
+    stroke: var(--vchasno-ui-checkbox-icon-color);
+}
+
+.vchasno-ui-checkbox__label {
+    font-size: var(--vchasno-ui-checkbox-font-size);
+    line-height: 1;
+    user-select: none;
+}
+
+.vchasno-ui-checkbox.--disabled {
+    color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);
+    cursor: not-allowed;
+}