@vchasno/ui-kit 0.2.14 → 0.3.2

package/dist/types/components/Button/Button.d.ts

@@ -1,7 +1,7 @@
-import React, { ButtonHTMLAttributes } from "react";
-import type { LoadingFeedback, Sizable } from "../types";
-import "./Button.global.css";
-type ButtonTheme = "primary" | "secondary" | "transparent" | "light" | "danger";
+import React, { ButtonHTMLAttributes } from 'react';
+import { LoadingFeedback, Sizable } from '../types';
+import './Button.global.css';
+type ButtonTheme = 'primary' | 'secondary' | 'transparent' | 'light' | 'danger';
 export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, Partial<Sizable>, Partial<LoadingFeedback> {
     className?: string;
     theme?: ButtonTheme;

package/dist/types/components/Menu/Menu.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { MenuProps as ReactMenuProps } from '@szhsin/react-menu';
+import './Menu.global.css';
+export interface MenuProps extends ReactMenuProps {
+}
+export declare const Menu: React.ForwardRefExoticComponent<Omit<MenuProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const _default: React.ForwardRefExoticComponent<Omit<MenuProps, "ref"> & React.RefAttributes<HTMLDivElement>> & {
+    Button: React.ForwardRefExoticComponent<Omit<import("../MenuButton").MenuButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Item: React.ForwardRefExoticComponent<Omit<import("../MenuItem").MenuItemProps, "ref"> & React.RefAttributes<HTMLUListElement>>;
+};
+export default _default;

package/dist/types/components/Menu/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Menu';
+export type { MenuProps } from './Menu';

package/dist/types/components/MenuButton/MenuButton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { MenuButtonProps as ReactMenuButtonProps } from '@szhsin/react-menu';
+import './MenuButton.global.css';
+export interface MenuButtonProps extends ReactMenuButtonProps {
+}
+export declare const MenuButton: React.ForwardRefExoticComponent<Omit<MenuButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export default MenuButton;

package/dist/types/components/MenuButton/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './MenuButton';
+export type { MenuButtonProps } from './MenuButton';

package/dist/types/components/MenuItem/MenuItem.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { MenuItemProps as ReactMenuItemProps } from '@szhsin/react-menu';
+import './MenuItem.global.css';
+export interface MenuItemProps extends ReactMenuItemProps {
+}
+export declare const MenuItem: React.ForwardRefExoticComponent<Omit<MenuItemProps, "ref"> & React.RefAttributes<HTMLUListElement>>;
+export default MenuItem;

package/dist/types/components/MenuItem/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './MenuItem';
+export type { MenuItemProps } from './MenuItem';

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

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

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

@@ -1,39 +1,40 @@
 import React from 'react';
 import { Props as ReactSelectProps } from 'react-select';
+import type { GroupBase } from 'react-select/dist/declarations/src/types';
 import type { ErrorFeedback, LoadingFeedback, WithHint, WithLabel } from '../types';
 import { Option } from './types';
 import './Select.global.css';
 export type SelectOption = Option;
-export interface SelectProps extends ReactSelectProps, Partial<WithLabel & WithHint & LoadingFeedback & ErrorFeedback> {
+export interface SelectProps extends ReactSelectProps<Option, false | true, GroupBase<Option>>, Partial<WithLabel & WithHint & LoadingFeedback & ErrorFeedback> {
     wide?: boolean;
     dataQa?: string;
 }
 declare const Select: React.FC<SelectProps>;
 export declare const SelectComponents: {
-    ClearIndicator: <Option, IsMulti extends boolean, Group extends import("react-select").GroupBase<Option>>(props: import("react-select").ClearIndicatorProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element;
-    Control: <Option_1, IsMulti_1 extends boolean, Group_1 extends import("react-select").GroupBase<Option_1>>(props: import("react-select").ControlProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
-    DropdownIndicator: <Option_2, IsMulti_2 extends boolean, Group_2 extends import("react-select").GroupBase<Option_2>>(props: import("react-select").DropdownIndicatorProps<Option_2, IsMulti_2, Group_2>) => import("@emotion/react").jsx.JSX.Element;
+    ClearIndicator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: import("react-select").ClearIndicatorProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element;
+    Control: <Option_1, IsMulti_1 extends boolean, Group_1 extends GroupBase<Option_1>>(props: import("react-select").ControlProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
+    DropdownIndicator: <Option_2, IsMulti_2 extends boolean, Group_2 extends GroupBase<Option_2>>(props: import("react-select").DropdownIndicatorProps<Option_2, IsMulti_2, Group_2>) => import("@emotion/react").jsx.JSX.Element;
     DownChevron: (props: import("react-select/dist/declarations/src/components/indicators").DownChevronProps) => import("@emotion/react").jsx.JSX.Element;
     CrossIcon: (props: import("react-select/dist/declarations/src/components/indicators").CrossIconProps) => import("@emotion/react").jsx.JSX.Element;
-    Group: <Option_3, IsMulti_3 extends boolean, Group_3 extends import("react-select").GroupBase<Option_3>>(props: import("react-select").GroupProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;
-    GroupHeading: <Option_4, IsMulti_4 extends boolean, Group_4 extends import("react-select").GroupBase<Option_4>>(props: import("react-select").GroupHeadingProps<Option_4, IsMulti_4, Group_4>) => import("@emotion/react").jsx.JSX.Element;
-    IndicatorsContainer: <Option_5, IsMulti_5 extends boolean, Group_5 extends import("react-select").GroupBase<Option_5>>(props: import("react-select").IndicatorsContainerProps<Option_5, IsMulti_5, Group_5>) => import("@emotion/react").jsx.JSX.Element;
-    IndicatorSeparator: <Option_6, IsMulti_6 extends boolean, Group_6 extends import("react-select").GroupBase<Option_6>>(props: import("react-select").IndicatorSeparatorProps<Option_6, IsMulti_6, Group_6>) => import("@emotion/react").jsx.JSX.Element;
-    Input: <Option_7, IsMulti_7 extends boolean, Group_7 extends import("react-select").GroupBase<Option_7>>(props: import("react-select").InputProps<Option_7, IsMulti_7, Group_7>) => import("@emotion/react").jsx.JSX.Element;
-    LoadingIndicator: <Option_8, IsMulti_8 extends boolean, Group_8 extends import("react-select").GroupBase<Option_8>>({ innerProps, isRtl, size, ...restProps }: import("react-select").LoadingIndicatorProps<Option_8, IsMulti_8, Group_8>) => import("@emotion/react").jsx.JSX.Element;
-    Menu: <Option_9, IsMulti_9 extends boolean, Group_9 extends import("react-select").GroupBase<Option_9>>(props: import("react-select").MenuProps<Option_9, IsMulti_9, Group_9>) => import("@emotion/react").jsx.JSX.Element;
-    MenuList: <Option_10, IsMulti_10 extends boolean, Group_10 extends import("react-select").GroupBase<Option_10>>(props: import("react-select").MenuListProps<Option_10, IsMulti_10, Group_10>) => import("@emotion/react").jsx.JSX.Element;
-    MenuPortal: <Option_11, IsMulti_11 extends boolean, Group_11 extends import("react-select").GroupBase<Option_11>>(props: import("react-select/dist/declarations/src/components/Menu").MenuPortalProps<Option_11, IsMulti_11, Group_11>) => import("@emotion/react").jsx.JSX.Element | null;
-    LoadingMessage: <Option_12, IsMulti_12 extends boolean, Group_12 extends import("react-select").GroupBase<Option_12>>({ children, innerProps, ...restProps }: import("react-select").NoticeProps<Option_12, IsMulti_12, Group_12>) => import("@emotion/react").jsx.JSX.Element;
-    NoOptionsMessage: <Option_13, IsMulti_13 extends boolean, Group_13 extends import("react-select").GroupBase<Option_13>>({ children, innerProps, ...restProps }: import("react-select").NoticeProps<Option_13, IsMulti_13, Group_13>) => import("@emotion/react").jsx.JSX.Element;
-    MultiValue: <Option_14, IsMulti_14 extends boolean, Group_14 extends import("react-select").GroupBase<Option_14>>(props: import("react-select").MultiValueProps<Option_14, IsMulti_14, Group_14>) => import("@emotion/react").jsx.JSX.Element;
-    MultiValueContainer: <Option_15, IsMulti_15 extends boolean, Group_15 extends import("react-select").GroupBase<Option_15>>({ children, innerProps, }: import("react-select").MultiValueGenericProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
-    MultiValueLabel: <Option_15_1, IsMulti_15_1 extends boolean, Group_15_1 extends import("react-select").GroupBase<Option_15_1>>({ children, innerProps, }: import("react-select").MultiValueGenericProps<Option_15_1, IsMulti_15_1, Group_15_1>) => import("@emotion/react").jsx.JSX.Element;
+    Group: <Option_3, IsMulti_3 extends boolean, Group_3 extends GroupBase<Option_3>>(props: import("react-select").GroupProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;
+    GroupHeading: <Option_4, IsMulti_4 extends boolean, Group_4 extends GroupBase<Option_4>>(props: import("react-select").GroupHeadingProps<Option_4, IsMulti_4, Group_4>) => import("@emotion/react").jsx.JSX.Element;
+    IndicatorsContainer: <Option_5, IsMulti_5 extends boolean, Group_5 extends GroupBase<Option_5>>(props: import("react-select").IndicatorsContainerProps<Option_5, IsMulti_5, Group_5>) => import("@emotion/react").jsx.JSX.Element;
+    IndicatorSeparator: <Option_6, IsMulti_6 extends boolean, Group_6 extends GroupBase<Option_6>>(props: import("react-select").IndicatorSeparatorProps<Option_6, IsMulti_6, Group_6>) => import("@emotion/react").jsx.JSX.Element;
+    Input: <Option_7, IsMulti_7 extends boolean, Group_7 extends GroupBase<Option_7>>(props: import("react-select").InputProps<Option_7, IsMulti_7, Group_7>) => import("@emotion/react").jsx.JSX.Element;
+    LoadingIndicator: <Option_8, IsMulti_8 extends boolean, Group_8 extends GroupBase<Option_8>>({ innerProps, isRtl, size, ...restProps }: import("react-select").LoadingIndicatorProps<Option_8, IsMulti_8, Group_8>) => import("@emotion/react").jsx.JSX.Element;
+    Menu: <Option_9, IsMulti_9 extends boolean, Group_9 extends GroupBase<Option_9>>(props: import("react-select").MenuProps<Option_9, IsMulti_9, Group_9>) => import("@emotion/react").jsx.JSX.Element;
+    MenuList: <Option_10, IsMulti_10 extends boolean, Group_10 extends GroupBase<Option_10>>(props: import("react-select").MenuListProps<Option_10, IsMulti_10, Group_10>) => import("@emotion/react").jsx.JSX.Element;
+    MenuPortal: <Option_11, IsMulti_11 extends boolean, Group_11 extends GroupBase<Option_11>>(props: import("react-select/dist/declarations/src/components/Menu").MenuPortalProps<Option_11, IsMulti_11, Group_11>) => import("@emotion/react").jsx.JSX.Element | null;
+    LoadingMessage: <Option_12, IsMulti_12 extends boolean, Group_12 extends GroupBase<Option_12>>({ children, innerProps, ...restProps }: import("react-select").NoticeProps<Option_12, IsMulti_12, Group_12>) => import("@emotion/react").jsx.JSX.Element;
+    NoOptionsMessage: <Option_13, IsMulti_13 extends boolean, Group_13 extends GroupBase<Option_13>>({ children, innerProps, ...restProps }: import("react-select").NoticeProps<Option_13, IsMulti_13, Group_13>) => import("@emotion/react").jsx.JSX.Element;
+    MultiValue: <Option_14, IsMulti_14 extends boolean, Group_14 extends GroupBase<Option_14>>(props: import("react-select").MultiValueProps<Option_14, IsMulti_14, Group_14>) => import("@emotion/react").jsx.JSX.Element;
+    MultiValueContainer: <Option_15, IsMulti_15 extends boolean, Group_15 extends GroupBase<Option_15>>({ children, innerProps, }: import("react-select").MultiValueGenericProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
+    MultiValueLabel: <Option_15_1, IsMulti_15_1 extends boolean, Group_15_1 extends GroupBase<Option_15_1>>({ children, innerProps, }: import("react-select").MultiValueGenericProps<Option_15_1, IsMulti_15_1, Group_15_1>) => import("@emotion/react").jsx.JSX.Element;
     MultiValueRemove: typeof import("react-select/dist/declarations/src/components/MultiValue").MultiValueRemove;
-    Option: <Option_16, IsMulti_16 extends boolean, Group_16 extends import("react-select").GroupBase<Option_16>>(props: import("react-select").OptionProps<Option_16, IsMulti_16, Group_16>) => import("@emotion/react").jsx.JSX.Element;
-    Placeholder: <Option_17, IsMulti_17 extends boolean, Group_17 extends import("react-select").GroupBase<Option_17>>(props: import("react-select").PlaceholderProps<Option_17, IsMulti_17, Group_17>) => import("@emotion/react").jsx.JSX.Element;
-    SelectContainer: <Option_18, IsMulti_18 extends boolean, Group_18 extends import("react-select").GroupBase<Option_18>>(props: import("react-select").ContainerProps<Option_18, IsMulti_18, Group_18>) => import("@emotion/react").jsx.JSX.Element;
-    SingleValue: <Option_19, IsMulti_19 extends boolean, Group_19 extends import("react-select").GroupBase<Option_19>>(props: import("react-select").SingleValueProps<Option_19, IsMulti_19, Group_19>) => import("@emotion/react").jsx.JSX.Element;
-    ValueContainer: <Option_20, IsMulti_20 extends boolean, Group_20 extends import("react-select").GroupBase<Option_20>>(props: import("react-select").ValueContainerProps<Option_20, IsMulti_20, Group_20>) => import("@emotion/react").jsx.JSX.Element;
+    Option: <Option_16, IsMulti_16 extends boolean, Group_16 extends GroupBase<Option_16>>(props: import("react-select").OptionProps<Option_16, IsMulti_16, Group_16>) => import("@emotion/react").jsx.JSX.Element;
+    Placeholder: <Option_17, IsMulti_17 extends boolean, Group_17 extends GroupBase<Option_17>>(props: import("react-select").PlaceholderProps<Option_17, IsMulti_17, Group_17>) => import("@emotion/react").jsx.JSX.Element;
+    SelectContainer: <Option_18, IsMulti_18 extends boolean, Group_18 extends GroupBase<Option_18>>(props: import("react-select").ContainerProps<Option_18, IsMulti_18, Group_18>) => import("@emotion/react").jsx.JSX.Element;
+    SingleValue: <Option_19, IsMulti_19 extends boolean, Group_19 extends GroupBase<Option_19>>(props: import("react-select").SingleValueProps<Option_19, IsMulti_19, Group_19>) => import("@emotion/react").jsx.JSX.Element;
+    ValueContainer: <Option_20, IsMulti_20 extends boolean, Group_20 extends GroupBase<Option_20>>(props: import("react-select").ValueContainerProps<Option_20, IsMulti_20, Group_20>) => import("@emotion/react").jsx.JSX.Element;
 };
 export default Select;

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

@@ -1,9 +1,11 @@
 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/types/components/Select/index.d.ts

@@ -2,4 +2,4 @@ export { default, SelectComponents } from './Select';
 export type { SelectProps } from './Select';
 export { default as SelectCreatable } from './SelectCreatable';
 export type { SelectCreatableProps } from './SelectCreatable';
-export type { Option } from './types';
+export type { Option, CustomControlProps } from './types';

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

@@ -1,4 +1,9 @@
+import { ControlProps } from 'react-select';
+import type { GroupBase } from 'react-select/dist/declarations/src/types';
 export interface Option {
     readonly label: string;
     readonly value: string;
 }
+export interface CustomControlProps extends ControlProps<Option, boolean, GroupBase<Option>> {
+    label?: string;
+}

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

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface ActionButtonProps {
+    onClick: () => void;
+}
+declare const ActionButton: React.FC<React.PropsWithChildren<ActionButtonProps>>;
+export default ActionButton;

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

@@ -0,0 +1,15 @@
+import React from 'react';
+import { IconProps as ReactToastifyIconProps, ToastContainerProps, toast } from 'react-toastify';
+import 'react-toastify/dist/ReactToastify.css';
+import './Snackbar.global.css';
+import './overrideToastifyVars.css';
+export interface SnackbarProps extends ToastContainerProps {
+}
+export interface SnackbarIconProps extends ReactToastifyIconProps {
+}
+export declare const snackbarToast: typeof toast;
+declare const _default: React.FC<SnackbarProps> & {
+    ActionButton: React.FC<React.PropsWithChildren<import("./ActionButton").ActionButtonProps>>;
+    WithAction: React.FC<{}>;
+};
+export default _default;

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

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const WithAction: React.FC;
+export default WithAction;

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

@@ -0,0 +1,2 @@
+export { default, snackbarToast } from './Snackbar';
+export type { SnackbarProps, SnackbarIconProps } from './Snackbar';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@vchasno/ui-kit",
-    "version": "0.2.14",
+    "version": "0.3.2",
     "description": "React UI components for Vchasno applications",
     "main": "dist/index.js",
     "module": "dist/index.js",
@@ -34,6 +34,18 @@
             "import": "./dist/SelectCreatable/index.js",
             "default": "./dist/SelectCreatable/index.js"
         },
+        "./Menu": {
+            "types": "./dist/Menu/index.d.ts",
+            "require": "./dist/Menu/index.cjs.js",
+            "import": "./dist/Menu/index.js",
+            "default": "./dist/Menu/index.js"
+        },
+        "./Snackbar": {
+            "types": "./dist/Snackbar/index.d.ts",
+            "require": "./dist/Snackbar/index.cjs.js",
+            "import": "./dist/Snackbar/index.js",
+            "default": "./dist/Snackbar/index.js"
+        },
         "./ProjectsPopover": {
             "types": "./dist/ProjectsPopover/index.d.ts",
             "require": "./dist/ProjectsPopover/index.cjs.js",
@@ -72,9 +84,9 @@
         "@vchasno:registry": "https://registry.npmjs.org/"
     },
     "devDependencies": {
-        "@babel/preset-env": "7.24.4",
-        "@babel/preset-react": "7.24.1",
-        "@babel/preset-typescript": "7.24.1",
+        "@babel/preset-env": "^7.24.4",
+        "@babel/preset-react": "^7.24.1",
+        "@babel/preset-typescript": "^7.24.1",
         "@jest/globals": "29.7.0",
         "@rollup/plugin-commonjs": "25.0.7",
         "@rollup/plugin-node-resolve": "15.2.3",
@@ -93,11 +105,11 @@
         "@trivago/prettier-plugin-sort-imports": "4.3.0",
         "@types/jest": "29.5.12",
         "@types/react": "~17.0.25",
-        "@types/react-dom": "~17.0.25",
         "@types/react-datepicker": "6.2.0",
+        "@types/react-dom": "~17.0.25",
         "@types/react-text-mask": "^5.4.11",
-        "@typescript-eslint/eslint-plugin": "~7.7.1",
-        "@typescript-eslint/parser": "~7.7.1",
+        "@typescript-eslint/eslint-plugin": "^7.7.1",
+        "@typescript-eslint/parser": "^7.7.1",
         "date-fns": "^3.6.0",
         "eslint": "8.56",
         "eslint-config-prettier": "~9.1.0",
@@ -133,10 +145,12 @@
     "dependencies": {
         "@emotion/styled": "11.11.5",
         "@mui/material": "5.15.16",
+        "@szhsin/react-menu": "^4.1.0",
         "classnames": "2.5.1",
         "react-datepicker": "6.9.0",
         "react-select": "5.8.0",
         "react-text-mask": "5.5.0",
-        "react-textarea-autosize": "8.5.3"
+        "react-textarea-autosize": "8.5.3",
+        "react-toastify": "10.0.5"
     }
 }