@itcase/ui 1.9.41 → 1.9.42

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

@@ -54,7 +54,7 @@ declare const meta: {
         wrap?: import("@itcase/types").WrapProps;
         zeroGap?: boolean;
         zeroPadding?: boolean;
-    } & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    } & Pick<import("../../../hooks/useHoldProgress").UseHoldProgressOptions, "onHoldComplete"> & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
         after?: string;
         appearance?: import("@itcase/types").CompositeAppearanceKey;
         Badge?: import("react").ReactNode;
@@ -67,6 +67,7 @@ declare const meta: {
         href?: import("../../Link/Link.interface").LinkWrapperProps["href"];
         htmlType?: import("../../Link/Link.interface").LinkWrapperProps["type"];
         isDisabled?: import("../../Link/Link.interface").LinkWrapperProps["disabled"];
+        isHolding?: boolean;
         isLoading?: boolean;
         isSkeleton?: boolean;
         label?: string;
@@ -98,3 +99,10 @@ export declare const Skeleton: {
     };
     render: (args: ButtonProps) => import("react/jsx-runtime").JSX.Element;
 };
+export declare const Hold: {
+    args: {
+        isHolding: boolean;
+        onHoldComplete: () => void;
+    };
+    render: (args: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+};

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

@@ -54,7 +54,7 @@ declare const meta: {
         wrap?: import("@itcase/types").WrapProps;
         zeroGap?: boolean;
         zeroPadding?: boolean;
-    } & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    } & Pick<import("../../../hooks/useHoldProgress").UseHoldProgressOptions, "onHoldComplete"> & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
         after?: string;
         appearance?: import("@itcase/types").CompositeAppearanceKey;
         Badge?: import("react").ReactNode;
@@ -67,6 +67,7 @@ declare const meta: {
         href?: import("../../Link/Link.interface").LinkWrapperProps["href"];
         htmlType?: import("../../Link/Link.interface").LinkWrapperProps["type"];
         isDisabled?: import("../../Link/Link.interface").LinkWrapperProps["disabled"];
+        isHolding?: boolean;
         isLoading?: boolean;
         isSkeleton?: boolean;
         label?: string;

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

@@ -54,7 +54,7 @@ declare const meta: {
         wrap?: import("@itcase/types").WrapProps;
         zeroGap?: boolean;
         zeroPadding?: boolean;
-    } & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    } & Pick<import("../../../hooks/useHoldProgress").UseHoldProgressOptions, "onHoldComplete"> & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
         after?: string;
         appearance?: import("@itcase/types").CompositeAppearanceKey;
         Badge?: import("react").ReactNode;
@@ -67,6 +67,7 @@ declare const meta: {
         href?: import("../../Link/Link.interface").LinkWrapperProps["href"];
         htmlType?: import("../../Link/Link.interface").LinkWrapperProps["type"];
         isDisabled?: import("../../Link/Link.interface").LinkWrapperProps["disabled"];
+        isHolding?: boolean;
         isLoading?: boolean;
         isSkeleton?: boolean;
         label?: string;

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

@@ -54,7 +54,7 @@ declare const meta: {
         wrap?: import("@itcase/types").WrapProps;
         zeroGap?: boolean;
         zeroPadding?: boolean;
-    } & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    } & Pick<import("../../../hooks/useHoldProgress").UseHoldProgressOptions, "onHoldComplete"> & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
         after?: string;
         appearance?: import("@itcase/types").CompositeAppearanceKey;
         Badge?: import("react").ReactNode;
@@ -67,6 +67,7 @@ declare const meta: {
         href?: import("../../Link/Link.interface").LinkWrapperProps["href"];
         htmlType?: import("../../Link/Link.interface").LinkWrapperProps["type"];
         isDisabled?: import("../../Link/Link.interface").LinkWrapperProps["disabled"];
+        isHolding?: boolean;
         isLoading?: boolean;
         isSkeleton?: boolean;
         label?: string;

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

@@ -54,7 +54,7 @@ declare const meta: {
         wrap?: import("@itcase/types").WrapProps;
         zeroGap?: boolean;
         zeroPadding?: boolean;
-    } & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    } & Pick<import("../../../hooks/useHoldProgress").UseHoldProgressOptions, "onHoldComplete"> & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
         after?: string;
         appearance?: import("@itcase/types").CompositeAppearanceKey;
         Badge?: import("react").ReactNode;
@@ -67,6 +67,7 @@ declare const meta: {
         href?: import("../../Link/Link.interface").LinkWrapperProps["href"];
         htmlType?: import("../../Link/Link.interface").LinkWrapperProps["type"];
         isDisabled?: import("../../Link/Link.interface").LinkWrapperProps["disabled"];
+        isHolding?: boolean;
         isLoading?: boolean;
         isSkeleton?: boolean;
         label?: string;

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

@@ -54,7 +54,7 @@ declare const meta: {
         wrap?: import("@itcase/types").WrapProps;
         zeroGap?: boolean;
         zeroPadding?: boolean;
-    } & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    } & Pick<import("../../../hooks/useHoldProgress").UseHoldProgressOptions, "onHoldComplete"> & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
         after?: string;
         appearance?: import("@itcase/types").CompositeAppearanceKey;
         Badge?: import("react").ReactNode;
@@ -67,6 +67,7 @@ declare const meta: {
         href?: import("../../Link/Link.interface").LinkWrapperProps["href"];
         htmlType?: import("../../Link/Link.interface").LinkWrapperProps["type"];
         isDisabled?: import("../../Link/Link.interface").LinkWrapperProps["disabled"];
+        isHolding?: boolean;
         isLoading?: boolean;
         isSkeleton?: boolean;
         label?: string;

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

@@ -54,7 +54,7 @@ declare const meta: {
         wrap?: import("@itcase/types").WrapProps;
         zeroGap?: boolean;
         zeroPadding?: boolean;
-    } & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    } & Pick<import("../../../hooks/useHoldProgress").UseHoldProgressOptions, "onHoldComplete"> & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
         after?: string;
         appearance?: import("@itcase/types").CompositeAppearanceKey;
         Badge?: import("react").ReactNode;
@@ -67,6 +67,7 @@ declare const meta: {
         href?: import("../../Link/Link.interface").LinkWrapperProps["href"];
         htmlType?: import("../../Link/Link.interface").LinkWrapperProps["type"];
         isDisabled?: import("../../Link/Link.interface").LinkWrapperProps["disabled"];
+        isHolding?: boolean;
         isLoading?: boolean;
         isSkeleton?: boolean;
         label?: string;

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

@@ -54,7 +54,7 @@ declare const meta: {
         wrap?: import("@itcase/types").WrapProps;
         zeroGap?: boolean;
         zeroPadding?: boolean;
-    } & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
+    } & Pick<import("../../../hooks/useHoldProgress").UseHoldProgressOptions, "onHoldComplete"> & import("../../../hooks/useStyles/styleAttributes.interface").StyleAttributes & {
         after?: string;
         appearance?: import("@itcase/types").CompositeAppearanceKey;
         Badge?: import("react").ReactNode;
@@ -67,6 +67,7 @@ declare const meta: {
         href?: import("../../Link/Link.interface").LinkWrapperProps["href"];
         htmlType?: import("../../Link/Link.interface").LinkWrapperProps["type"];
         isDisabled?: import("../../Link/Link.interface").LinkWrapperProps["disabled"];
+        isHolding?: boolean;
         isLoading?: boolean;
         isSkeleton?: boolean;
         label?: string;

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

@@ -1,4 +1,3 @@
-import { MouseEvent } from 'react';
 declare const Image: import("react").ForwardRefExoticComponent<Omit<{
     borderColor?: import("@itcase/types").BorderColorProps;
     borderColorImage?: string;
@@ -29,10 +28,10 @@ declare const Image: import("react").ForwardRefExoticComponent<Omit<{
     isSkeleton?: boolean;
     mode?: string;
     onClick?: () => void;
-    onError?: (event: MouseEvent<HTMLImageElement>) => void;
+    onError?: (event: React.SyntheticEvent<HTMLImageElement>) => void;
     overlay?: import("react").ReactNode;
     placeholderUrl?: string;
-    src: string;
+    src: string | undefined | null;
     style?: import("react").CSSProperties;
     title?: string;
     type?: string;

package/dist/types/components/Image/Image.interface.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties, MouseEvent, ReactNode } from 'react';
+import { CSSProperties, ReactNode } from 'react';
 import { AlignProps, BorderColorProps, BorderTypeProps, BorderWidthProps, FillHoverProps, FillProps, ShapeProps, WidthProps } from '@itcase/types';
 import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 type ImageAppearanceProps = {
@@ -32,10 +32,10 @@ type ImageProps = ImageAppearanceProps & StyleAttributes & {
     isSkeleton?: boolean;
     mode?: string;
     onClick?: () => void;
-    onError?: (event: MouseEvent<HTMLImageElement>) => void;
+    onError?: (event: React.SyntheticEvent<HTMLImageElement>) => void;
     overlay?: ReactNode;
     placeholderUrl?: string;
-    src: string;
+    src: string | undefined | null;
     style?: CSSProperties;
     title?: string;
     type?: string;

package/dist/types/components/Image/stories/Image.stories.d.ts

@@ -31,10 +31,10 @@ declare const meta: {
         isSkeleton?: boolean;
         mode?: string;
         onClick?: () => void;
-        onError?: (event: import("react").MouseEvent<HTMLImageElement>) => void;
+        onError?: (event: React.SyntheticEvent<HTMLImageElement>) => void;
         overlay?: import("react").ReactNode;
         placeholderUrl?: string;
-        src: string;
+        src: string | undefined | null;
         style?: import("react").CSSProperties;
         title?: string;
         type?: string;
@@ -42,10 +42,11 @@ declare const meta: {
     args: {
         width: number;
         height: number;
-        fill: string;
+        fill: "surfaceTertiary";
         src: string;
-        resizeMode: string;
+        resizeMode: "contain";
         alt: string;
+        placeholderUrl: string;
     };
 };
 export default meta;

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

@@ -1,5 +1,5 @@
 import { CSSProperties, MouseEvent, ReactNode } from 'react';
-import { AlignProps, AppearanceKeysDefault, AppearanceShapeKey, AppearanceSizeKey, AppearanceStyleKey, BorderColorProps, BorderTypeProps, CompositeAppearanceKey, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, WrapProps } from '@itcase/types';
+import { AlignProps, AppearanceKeysDefault, AppearanceShapeKey, AppearanceSizeKey, AppearanceStyleKey, BorderColorProps, BorderTypeProps, CompositeAppearanceKey, FillGradientProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, WrapProps } from '@itcase/types';
 import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
 import { IconProps } from '../Icon/Icon.interface';
 import { TextProps } from '../Text/Text.interface';
@@ -8,7 +8,7 @@ type LabelAppearanceProps = {
     align?: AlignProps;
     borderColor?: BorderColorProps;
     borderType?: BorderTypeProps;
-    fill?: FillProps;
+    fill?: FillProps | FillGradientProps;
     fillHover?: FillHoverProps;
     iconAfter?: IconProps['SvgImage'];
     iconAfterFill?: IconProps['fill'];

package/dist/types/components/Link/Link.interface.d.ts

@@ -55,6 +55,10 @@ type LinkProps = LinkAppearanceProps & StyleAttributes & {
     LinkComponent?: ElementType;
     onClick?: () => void;
     onMouseDown?: () => void;
+    onPointerCancel?: (event: React.PointerEvent) => void;
+    onPointerDown?: (event: React.PointerEvent) => void;
+    onPointerLeave?: (event: React.PointerEvent) => void;
+    onPointerUp?: (event: React.PointerEvent) => void;
     rel?: string;
     style?: CSSProperties;
     target?: string;
@@ -74,6 +78,10 @@ type LinkWrapperProps = LinkAppearanceProps & StyleAttributes & {
     target?: string;
     title?: string;
     type?: ElementType;
+    onPointerCancel?: (event: React.PointerEvent) => void;
+    onPointerDown?: (event: React.PointerEvent) => void;
+    onPointerLeave?: (event: React.PointerEvent) => void;
+    onPointerUp?: (event: React.PointerEvent) => void;
 };
 type AppearanceKeys = AppearanceSizeKey | AppearanceStyleKey | (AppearanceKeysDefault | AppearanceStateKeysDefault);
 type LinkAppearance = {

package/dist/types/components/Pagination/Pagination.interface.d.ts

@@ -87,9 +87,15 @@ type PaginationProps = PaginationAppearanceProps & StyleAttributes & {
     isPageCountDropdownReversed?: boolean;
     isPageLabelBuilder?: (page: number) => ReactNode;
     isSkeleton?: boolean;
-    onChangePage?: () => void;
-    onChangePerPageCount?: (perPageCount: number) => void;
-    onPageChange?: () => void;
+    onChangePage: (arg: {
+        selected: number;
+    }) => void;
+    onChangePerPageCount: (perPageCount: number) => void;
+    /** @deprecated Use `onChangePage` instead */
+    onPageChange?: (arg: {
+        selected: number;
+    }) => void;
+    /** @deprecated Use `onChangePerPageCount` instead */
     onPerPageCountChange?: (perPageCount: number) => void;
     pageCountDesc?: string;
     pageCountDropdownItemDividerDirection?: DirectionProps;

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

@@ -1,17 +1,13 @@
 import type { ReactNode } from 'react';
 import { GroupBase, PropsValue } from 'react-select';
 import { Props } from 'react-select/base';
-import { AppearanceShapeKey, AppearanceSizeKey, AppearanceStateKeysDefault, AppearanceStyleKey, BorderColorHoverProps, BorderColorProps, BorderTypeProps, CompositeAppearanceKey, DirectionProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, WidthProps } from '@itcase/types';
+import { AppearanceShapeKey, AppearanceSizeKey, AppearanceStateKeysDefault, AppearanceStyleKey, BorderColorHoverProps, BorderColorProps, BorderTypeProps, CompositeAppearanceKey, DirectionProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, WidthProps, Option as SelectOption } from '@itcase/types';
 import { BadgeProps } from '../Badge/Badge.interface';
 import { DividerProps } from '../Divider/Divider.interface';
 import { DropdownProps } from '../Dropdown/Dropdown.interface';
 import { IconProps } from '../Icon/Icon.interface';
 import { LoaderProps } from '../Loader/Loader.interface';
 import { TextProps } from '../Text/Text.interface';
-type SelectOption = {
-    label: string;
-    value: string;
-};
 type SelectAppearanceProps<Option = SelectOption> = {
     after?: React.ReactNode;
     appearance?: CompositeAppearanceKey;
@@ -138,4 +134,4 @@ type SelectConfig = {
 };
 type SelectProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = Partial<Pick<Props<Option, IsMulti, Group>, 'className' | 'closeMenuOnSelect' | 'filterOption' | 'hideSelectedOptions' | 'hideValueContainer' | 'instanceId' | 'isClearable' | 'isDisabled' | 'isLoading' | 'isMulti' | 'isSearchable' | 'loadingMessage' | 'onChange' | 'onInputChange' | 'openMenuOnClick' | 'options' | 'value'>> & SelectAppearanceProps<Option> & SelectPropsCustom<Option> & {};
 type SelectPropsCustom<Option> = SelectAppearanceProps<Option> & {};
-export type { SelectAppearance, SelectAppearanceProps, SelectConfig, SelectOption, SelectProps, SelectPropsCustom, };
+export type { SelectAppearance, SelectAppearanceProps, SelectConfig, SelectProps, SelectPropsCustom, };

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

@@ -1,4 +1,4 @@
 import { GroupBase, MultiValueProps } from 'react-select';
-import { SelectOption } from './Select.interface';
+import { Option as SelectOption } from '@itcase/types';
 declare const SelectMultiValue: <Option extends SelectOption, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MultiValueProps<Option, IsMulti, Group>) => import("react/jsx-runtime").JSX.Element | null;
 export { SelectMultiValue };

package/dist/types/components/Tile/Tile.interface.d.ts

@@ -55,6 +55,7 @@ type TileProps = StyleAttributes & TileAppearanceProps & {
     desc?: string;
     direction?: DirectionProps;
     icon?: string;
+    iconClick?: IconProps['onClick'];
     iconSrc?: string;
     isSkeleton?: boolean;
     onClick?: () => void;

package/dist/types/hooks/useHoldProgress.d.ts

@@ -0,0 +1,16 @@
+import type React from 'react';
+declare const HOLD_STATE: {
+    readonly HOLDING: "holding";
+    readonly IDLE: "idle";
+};
+type HoldStates = (typeof HOLD_STATE)[keyof typeof HOLD_STATE];
+type UseHoldProgressOptions = {
+    holdDurationMs?: number;
+    onHoldComplete?: () => void;
+};
+declare function useHoldProgress(options: UseHoldProgressOptions): {
+    holdState: HoldStates;
+    onHoldEnd: (_event?: React.PointerEvent) => void;
+    onHoldStart: (event: React.PointerEvent) => void;
+};
+export { useHoldProgress, type UseHoldProgressOptions };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.9.41",
+  "version": "1.9.42",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -10,6 +10,7 @@
   ],
   "license": "MIT",
   "private": false,
+  "type": "module",
   "types": "dist/types/types/index.d.ts",
   "typesVersions": {
     "*": {
@@ -105,17 +106,17 @@
     "@emotion/is-prop-valid": "^1.4.0",
     "@itcase/common": "^1.2.36",
     "@itcase/icons": "^1.2.28",
-    "@itcase/storybook-config": "^1.2.33",
+    "@itcase/storybook-config": "^1.2.35",
     "@itcase/tokens-am": "^1.1.45",
     "@itcase/tokens-baikal": "^1.1.41",
     "@itcase/tokens-palette": "^1.1.41",
     "clsx": "^2.1.1",
     "date-fns": "^4.1.0",
-    "framer-motion": "^12.26.2",
+    "framer-motion": "^12.27.5",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",
     "luxon": "^3.7.2",
-    "motion": "^12.26.2",
+    "motion": "^12.27.5",
     "rc-slider": "^11.1.9",
     "react": "^18.3.1",
     "react-dadata": "^2.27.4",
@@ -140,8 +141,8 @@
     "@babel/preset-react": "^7.28.5",
     "@commitlint/cli": "^20.3.1",
     "@commitlint/config-conventional": "^20.3.1",
-    "@itcase/config": "^1.6.26",
-    "@itcase/lint": "^1.1.78",
+    "@itcase/config": "^1.6.42",
+    "@itcase/lint": "^1.1.92",
     "@itcase/types": "^1.1.19",
     "@rollup/plugin-alias": "^6.0.0",
     "@rollup/plugin-babel": "^6.1.0",
@@ -151,9 +152,6 @@
     "@rollup/plugin-node-resolve": "^16.0.3",
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-typescript": "^12.3.0",
-    "@semantic-release/changelog": "^6.0.3",
-    "@semantic-release/git": "^10.0.1",
-    "@semantic-release/release-notes-generator": "14.1.0",
     "@types/js-cookie": "^3.0.6",
     "@types/lodash": "^4.17.23",
     "@types/luxon": "^3.7.1",
@@ -169,7 +167,7 @@
     "husky": "^9.1.7",
     "lint-staged": "^16.2.7",
     "prettier": "^3.8.0",
-    "rollup": "4.55.1",
+    "rollup": "4.55.2",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.3.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",