@vchasno/ui-kit 0.3.12 → 0.3.13

package/dist/SelectCreatable/types/components/Datepicker/DatePicker.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { DatePickerProps as ReactDatePickerProps } from 'react-datepicker';
+import type { ReactDatePickerProps } from 'react-datepicker';
 import { MaskedInputProps } from 'react-text-mask';
 import type { ErrorFeedback, LoadingFeedback, WithHint } from '../types';
 import './DatePicker.global.css';
-export type DatePickerProps = {
+export interface DatePickerProps extends ReactDatePickerProps, Partial<LoadingFeedback & WithHint & ErrorFeedback> {
     label?: string;
     className?: string;
     showMask?: boolean;
@@ -11,7 +11,7 @@ export type DatePickerProps = {
     onChange: ReactDatePickerProps['onChange'];
     isClearable: ReactDatePickerProps['isClearable'];
     dateFormat?: ReactDatePickerProps['dateFormat'];
-} & ReactDatePickerProps & Partial<LoadingFeedback & WithHint & ErrorFeedback>;
+}
 /**
  * @see <https://reactdatepicker.com/>
  */

package/dist/Snackbar/index.cjs.js

@@ -509,7 +509,7 @@ Switch.displayName = 'Switch';
 var css_248z$9 = ".vchasno-ui-tabs-wrapper {\n    position: relative;\n    width: 100%;\n    -ms-overflow-style: none;\n    scrollbar-width: none;\n}\n\n.vchasno-ui-tabs-wrapper::-webkit-scrollbar {\n    display: none;\n}\n\n.--h-scroll {\n    overflow: auto;\n}\n\n.vchasno-ui-tabs-wrapper-root {\n    position: relative;\n}\n\n.vchasno-ui-tabs-wrapper-root::after,\n.vchasno-ui-tabs-wrapper-root::before {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    display: block;\n    width: 30px;\n    content: '';\n    pointer-events: none;\n}\n\n.--ping-right::after {\n    right: 0;\n    box-shadow: inset -12px 0 8px -8px rgb(0 0 0 / 8%);\n}\n\n.--ping-left::before {\n    left: 0;\n    box-shadow: inset 12px 0 8px -8px rgb(0 0 0 / 8%);\n}\n\n.vchasno-ui-tabs {\n    --active-color: var(--vchasno-ui-tabs-active-color, #087dc1);\n\n    position: relative;\n    display: flex;\n    font-size: 16px;\n    font-weight: 500;\n}\n\n.vchasno-ui-tabs__indicator {\n    position: absolute;\n    z-index: 1;\n    bottom: -1px;\n    left: 0;\n    display: block;\n    width: 10px;\n    height: 3px;\n    border-radius: 3px;\n    background-color: var(--active-color);\n    transition:\n        width var(--vchasno-ui-transition-duration-sec, 0.3s),\n        left var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.--h-scroll .vchasno-ui-tabs__indicator {\n    display: none;\n}\n\n.vchasno-ui-tabs-wrapper-root.--skip-animation .vchasno-ui-tabs__indicator {\n    transition: none;\n}\n\n.vchasno-ui-tabs__label-item {\n    position: relative;\n    display: inline-flex;\n    height: 50px;\n    flex-grow: 0;\n    flex-shrink: 0;\n    align-items: center;\n    padding: 0 15px;\n    color: #333;\n    cursor: pointer;\n    transition:\n        color var(--vchasno-ui-transition-duration-sec),\n        background-color var(--vchasno-ui-transition-duration-sec);\n    user-select: none;\n}\n\n.vchasno-ui-tabs__label-item::after {\n    position: absolute;\n    z-index: 1;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    display: block;\n    height: 0;\n    border-radius: 3px;\n    background-color: var(--active-color);\n    content: '';\n    transition: height var(--vchasno-ui-transition-duration-sec);\n}\n\n.--h-scroll .vchasno-ui-tabs__label-item.--active::after {\n    height: 3px;\n}\n\n.vchasno-ui-tabs-wrapper:not(.--h-scroll) .vchasno-ui-tabs {\n    border-bottom: 1px solid #dbe5ea;\n}\n\n.vchasno-ui-tabs__label-item.--active {\n    color: var(--active-color);\n}\n\n.vchasno-ui-tabs__label-item:not(.--disabled):hover {\n    color: var(--active-color);\n}\n\n.vchasno-ui-tabs__label-item.--disabled {\n    cursor: not-allowed;\n    opacity: 0.5;\n}\n";
 styleInject(css_248z$9);
 
-var css_248z$8 = ".vchasno-ui-checkbox {\n    display: inline-flex;\n    align-items: center;\n    cursor: pointer;\n    gap: 10px;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox__box {\n    display: inline-flex;\n    width: 16px;\n    height: 16px;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);\n    border-radius: 3px;\n    outline: 2px solid transparent;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        border var(--vchasno-ui-transition-duration-sec, 0.3s),\n        outline var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-bg-color);\n}\n\n.vchasno-ui-checkbox__svg {\n    color: transparent;\n    transform: scale(0) translateZ(0);\n    transition:\n        color var(--vchasno-ui-transition-duration-sec),\n        transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);\n}\n\n.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {\n    display: none;\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {\n    color: var(--vchasno-ui-checkbox-icon-color);\n    transform: scale(1) translateZ(0);\n}\n\n.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    outline: 1.5px solid var(--vchasno-ui-checkbox-outline-color, #ab9eff);\n}\n\n.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {\n    background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-icon-color);\n}\n\n.vchasno-ui-checkbox__label {\n    font-size: var(--vchasno-ui-checkbox-font-size);\n    line-height: 1;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox.--disabled {\n    color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n    cursor: not-allowed;\n}\n";
+var css_248z$8 = ".vchasno-ui-checkbox {\n    display: inline-flex;\n    align-items: center;\n    cursor: pointer;\n    gap: 10px;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox__box {\n    display: inline-flex;\n    width: 16px;\n    height: 16px;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);\n    border-radius: 3px;\n    outline: 2px solid transparent;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        border var(--vchasno-ui-transition-duration-sec, 0.3s),\n        outline var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-bg-color);\n}\n\n.vchasno-ui-checkbox__svg {\n    color: transparent;\n    transform: scale(0) translateZ(0);\n    transition:\n        color var(--vchasno-ui-transition-duration-sec),\n        transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);\n}\n\n.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {\n    display: none;\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {\n    color: var(--vchasno-ui-checkbox-icon-color);\n    transform: scale(1) translateZ(0);\n}\n\n.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    outline: 2px solid var(--vchasno-ui-checkbox-outline-color, #ab9eff);\n}\n\n.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {\n    background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-icon-color);\n}\n\n.vchasno-ui-checkbox__label {\n    font-size: var(--vchasno-ui-checkbox-font-size);\n    line-height: 1;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox.--disabled {\n    color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n    cursor: not-allowed;\n}\n";
 styleInject(css_248z$8);
 
 var Checkbox = React$1.forwardRef(function (_a, ref) {

package/dist/Snackbar/index.js

@@ -487,7 +487,7 @@ Switch.displayName = 'Switch';
 var css_248z$9 = ".vchasno-ui-tabs-wrapper {\n    position: relative;\n    width: 100%;\n    -ms-overflow-style: none;\n    scrollbar-width: none;\n}\n\n.vchasno-ui-tabs-wrapper::-webkit-scrollbar {\n    display: none;\n}\n\n.--h-scroll {\n    overflow: auto;\n}\n\n.vchasno-ui-tabs-wrapper-root {\n    position: relative;\n}\n\n.vchasno-ui-tabs-wrapper-root::after,\n.vchasno-ui-tabs-wrapper-root::before {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    display: block;\n    width: 30px;\n    content: '';\n    pointer-events: none;\n}\n\n.--ping-right::after {\n    right: 0;\n    box-shadow: inset -12px 0 8px -8px rgb(0 0 0 / 8%);\n}\n\n.--ping-left::before {\n    left: 0;\n    box-shadow: inset 12px 0 8px -8px rgb(0 0 0 / 8%);\n}\n\n.vchasno-ui-tabs {\n    --active-color: var(--vchasno-ui-tabs-active-color, #087dc1);\n\n    position: relative;\n    display: flex;\n    font-size: 16px;\n    font-weight: 500;\n}\n\n.vchasno-ui-tabs__indicator {\n    position: absolute;\n    z-index: 1;\n    bottom: -1px;\n    left: 0;\n    display: block;\n    width: 10px;\n    height: 3px;\n    border-radius: 3px;\n    background-color: var(--active-color);\n    transition:\n        width var(--vchasno-ui-transition-duration-sec, 0.3s),\n        left var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.--h-scroll .vchasno-ui-tabs__indicator {\n    display: none;\n}\n\n.vchasno-ui-tabs-wrapper-root.--skip-animation .vchasno-ui-tabs__indicator {\n    transition: none;\n}\n\n.vchasno-ui-tabs__label-item {\n    position: relative;\n    display: inline-flex;\n    height: 50px;\n    flex-grow: 0;\n    flex-shrink: 0;\n    align-items: center;\n    padding: 0 15px;\n    color: #333;\n    cursor: pointer;\n    transition:\n        color var(--vchasno-ui-transition-duration-sec),\n        background-color var(--vchasno-ui-transition-duration-sec);\n    user-select: none;\n}\n\n.vchasno-ui-tabs__label-item::after {\n    position: absolute;\n    z-index: 1;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    display: block;\n    height: 0;\n    border-radius: 3px;\n    background-color: var(--active-color);\n    content: '';\n    transition: height var(--vchasno-ui-transition-duration-sec);\n}\n\n.--h-scroll .vchasno-ui-tabs__label-item.--active::after {\n    height: 3px;\n}\n\n.vchasno-ui-tabs-wrapper:not(.--h-scroll) .vchasno-ui-tabs {\n    border-bottom: 1px solid #dbe5ea;\n}\n\n.vchasno-ui-tabs__label-item.--active {\n    color: var(--active-color);\n}\n\n.vchasno-ui-tabs__label-item:not(.--disabled):hover {\n    color: var(--active-color);\n}\n\n.vchasno-ui-tabs__label-item.--disabled {\n    cursor: not-allowed;\n    opacity: 0.5;\n}\n";
 styleInject(css_248z$9);
 
-var css_248z$8 = ".vchasno-ui-checkbox {\n    display: inline-flex;\n    align-items: center;\n    cursor: pointer;\n    gap: 10px;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox__box {\n    display: inline-flex;\n    width: 16px;\n    height: 16px;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);\n    border-radius: 3px;\n    outline: 2px solid transparent;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        border var(--vchasno-ui-transition-duration-sec, 0.3s),\n        outline var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-bg-color);\n}\n\n.vchasno-ui-checkbox__svg {\n    color: transparent;\n    transform: scale(0) translateZ(0);\n    transition:\n        color var(--vchasno-ui-transition-duration-sec),\n        transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);\n}\n\n.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {\n    display: none;\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {\n    color: var(--vchasno-ui-checkbox-icon-color);\n    transform: scale(1) translateZ(0);\n}\n\n.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    outline: 1.5px solid var(--vchasno-ui-checkbox-outline-color, #ab9eff);\n}\n\n.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {\n    background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-icon-color);\n}\n\n.vchasno-ui-checkbox__label {\n    font-size: var(--vchasno-ui-checkbox-font-size);\n    line-height: 1;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox.--disabled {\n    color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n    cursor: not-allowed;\n}\n";
+var css_248z$8 = ".vchasno-ui-checkbox {\n    display: inline-flex;\n    align-items: center;\n    cursor: pointer;\n    gap: 10px;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox__box {\n    display: inline-flex;\n    width: 16px;\n    height: 16px;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);\n    border-radius: 3px;\n    outline: 2px solid transparent;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        border var(--vchasno-ui-transition-duration-sec, 0.3s),\n        outline var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-bg-color);\n}\n\n.vchasno-ui-checkbox__svg {\n    color: transparent;\n    transform: scale(0) translateZ(0);\n    transition:\n        color var(--vchasno-ui-transition-duration-sec),\n        transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);\n}\n\n.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {\n    display: none;\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {\n    color: var(--vchasno-ui-checkbox-icon-color);\n    transform: scale(1) translateZ(0);\n}\n\n.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    outline: 2px solid var(--vchasno-ui-checkbox-outline-color, #ab9eff);\n}\n\n.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {\n    background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-icon-color);\n}\n\n.vchasno-ui-checkbox__label {\n    font-size: var(--vchasno-ui-checkbox-font-size);\n    line-height: 1;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox.--disabled {\n    color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n    cursor: not-allowed;\n}\n";
 styleInject(css_248z$8);
 
 var Checkbox = React__default.forwardRef(function (_a, ref) {

package/dist/Snackbar/types/components/Datepicker/DatePicker.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { DatePickerProps as ReactDatePickerProps } from 'react-datepicker';
+import type { ReactDatePickerProps } from 'react-datepicker';
 import { MaskedInputProps } from 'react-text-mask';
 import type { ErrorFeedback, LoadingFeedback, WithHint } from '../types';
 import './DatePicker.global.css';
-export type DatePickerProps = {
+export interface DatePickerProps extends ReactDatePickerProps, Partial<LoadingFeedback & WithHint & ErrorFeedback> {
     label?: string;
     className?: string;
     showMask?: boolean;
@@ -11,7 +11,7 @@ export type DatePickerProps = {
     onChange: ReactDatePickerProps['onChange'];
     isClearable: ReactDatePickerProps['isClearable'];
     dateFormat?: ReactDatePickerProps['dateFormat'];
-} & ReactDatePickerProps & Partial<LoadingFeedback & WithHint & ErrorFeedback>;
+}
 /**
  * @see <https://reactdatepicker.com/>
  */

package/dist/index.js

@@ -690,7 +690,7 @@ var Tabs = function (_a) {
             React$1.createElement(Spinner, { color: "var(--vchasno-ui-tabs-active-color, #087dc1)" })))));
 };
 
-var css_248z$6 = ".vchasno-ui-checkbox {\n    display: inline-flex;\n    align-items: center;\n    cursor: pointer;\n    gap: 10px;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox__box {\n    display: inline-flex;\n    width: 16px;\n    height: 16px;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);\n    border-radius: 3px;\n    outline: 2px solid transparent;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        border var(--vchasno-ui-transition-duration-sec, 0.3s),\n        outline var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-bg-color);\n}\n\n.vchasno-ui-checkbox__svg {\n    color: transparent;\n    transform: scale(0) translateZ(0);\n    transition:\n        color var(--vchasno-ui-transition-duration-sec),\n        transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);\n}\n\n.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {\n    display: none;\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {\n    color: var(--vchasno-ui-checkbox-icon-color);\n    transform: scale(1) translateZ(0);\n}\n\n.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    outline: 1.5px solid var(--vchasno-ui-checkbox-outline-color, #ab9eff);\n}\n\n.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {\n    background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-icon-color);\n}\n\n.vchasno-ui-checkbox__label {\n    font-size: var(--vchasno-ui-checkbox-font-size);\n    line-height: 1;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox.--disabled {\n    color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n    cursor: not-allowed;\n}\n";
+var css_248z$6 = ".vchasno-ui-checkbox {\n    display: inline-flex;\n    align-items: center;\n    cursor: pointer;\n    gap: 10px;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox__box {\n    display: inline-flex;\n    width: 16px;\n    height: 16px;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);\n    border-radius: 3px;\n    outline: 2px solid transparent;\n    transition:\n        background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n        border var(--vchasno-ui-transition-duration-sec, 0.3s),\n        outline var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-bg-color);\n}\n\n.vchasno-ui-checkbox__svg {\n    color: transparent;\n    transform: scale(0) translateZ(0);\n    transition:\n        color var(--vchasno-ui-transition-duration-sec),\n        transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);\n}\n\n.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {\n    display: none;\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {\n    color: var(--vchasno-ui-checkbox-icon-color);\n    transform: scale(1) translateZ(0);\n}\n\n.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {\n    border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n    outline: 2px solid var(--vchasno-ui-checkbox-outline-color, #ab9eff);\n}\n\n.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {\n    background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {\n    stroke: var(--vchasno-ui-checkbox-icon-color);\n}\n\n.vchasno-ui-checkbox__label {\n    font-size: var(--vchasno-ui-checkbox-font-size);\n    line-height: 1;\n    user-select: none;\n}\n\n.vchasno-ui-checkbox.--disabled {\n    color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n    cursor: not-allowed;\n}\n";
 styleInject(css_248z$6);
 
 var Checkbox = React$1.forwardRef(function (_a, ref) {

package/dist/types/components/Datepicker/DatePicker.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { DatePickerProps as ReactDatePickerProps } from 'react-datepicker';
+import type { ReactDatePickerProps } from 'react-datepicker';
 import { MaskedInputProps } from 'react-text-mask';
 import type { ErrorFeedback, LoadingFeedback, WithHint } from '../types';
 import './DatePicker.global.css';
-export type DatePickerProps = {
+export interface DatePickerProps extends ReactDatePickerProps, Partial<LoadingFeedback & WithHint & ErrorFeedback> {
     label?: string;
     className?: string;
     showMask?: boolean;
@@ -11,7 +11,7 @@ export type DatePickerProps = {
     onChange: ReactDatePickerProps['onChange'];
     isClearable: ReactDatePickerProps['isClearable'];
     dateFormat?: ReactDatePickerProps['dateFormat'];
-} & ReactDatePickerProps & Partial<LoadingFeedback & WithHint & ErrorFeedback>;
+}
 /**
  * @see <https://reactdatepicker.com/>
  */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@vchasno/ui-kit",
-    "version": "0.3.12",
+    "version": "0.3.13",
     "description": "React UI components for Vchasno applications",
     "main": "dist/index.js",
     "module": "dist/index.js",
@@ -145,10 +145,10 @@
         "@emotion/styled": "11.11.5",
         "@mui/material": "5.15.16",
         "@szhsin/react-menu": "^4.1.0",
-        "@types/react-datepicker": "7.0.0",
+        "@types/react-datepicker": "6.2.0",
         "@types/react-text-mask": "5.4.11",
         "classnames": "2.5.1",
-        "react-datepicker": "7.3.0",
+        "react-datepicker": "6.9.0",
         "react-select": "5.8.0",
         "react-text-mask": "5.5.0",
         "react-textarea-autosize": "8.5.3",