@ozen-ui/kit 0.9.0 → 0.9.2

package/__inner__/cjs/components/FieldInput/FieldInput.js

@@ -4,6 +4,7 @@ exports.FieldInput = exports.cnFieldInput = exports.FIELD_INPUT_DEFAULT_TAG = vo
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importStar(require("react"));
 var useControlled_1 = require("../../hooks/useControlled");
+var useIsomorphicEffect_1 = require("../../hooks/useIsomorphicEffect");
 var classname_1 = require("../../utils/classname");
 var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
 var FieldControl_1 = require("../FieldControl");
@@ -31,7 +32,7 @@ exports.FieldInput = (0, polymorphicComponentWithRef_1.polymorphicComponentWithR
             disabled = fieldControl.disabled;
         }
     }
-    (0, react_1.useEffect)(function () {
+    (0, useIsomorphicEffect_1.useIsomorphicEffect)(function () {
         setFieldControl(function (prevState) { return (tslib_1.__assign(tslib_1.__assign({}, prevState), { filled: filled, focused: focused, value: valueState })); });
     }, [filled, focused, valueState]);
     var handleChange = (0, react_1.useCallback)(function (e) {

package/__inner__/cjs/components/FieldLabel/FieldLabel.js

@@ -4,6 +4,7 @@ exports.FieldLabel = exports.cnFieldLabel = exports.FIELD_LABEL_DEFAULT_TAG = vo
 var tslib_1 = require("tslib");
 require("./FieldLabel.css");
 var react_1 = tslib_1.__importStar(require("react"));
+var useIsomorphicEffect_1 = require("../../hooks/useIsomorphicEffect");
 var classname_1 = require("../../utils/classname");
 var FieldControl_1 = require("../FieldControl");
 exports.FIELD_LABEL_DEFAULT_TAG = 'span';
@@ -18,7 +19,7 @@ exports.FieldLabel = (0, react_1.forwardRef)(function (_a, ref) {
     var disabled = disabledProp;
     var focused = focusedProp;
     var filled = filledProp;
-    (0, react_1.useEffect)(function () {
+    (0, useIsomorphicEffect_1.useIsomorphicEffect)(function () {
         setFieldControl(function (prevState) { return (tslib_1.__assign(tslib_1.__assign({}, prevState), { label: children })); });
     }, [children]);
     if (!children) {

package/__inner__/cjs/components/InputNumber/InputNumber.css

@@ -43,6 +43,7 @@
     color: var(--textfield-color);
     box-sizing: border-box;
     block-size: var(--textfield-input-height);
+    font: inherit;
   }
 .InputNumber-Field::placeholder {
       opacity: 1;

package/__inner__/cjs/components/Skeleton/index.d.ts

@@ -1 +1,4 @@
 export * from './Skeleton';
+export { cnSkeletonCircular } from './SkeletonCircular';
+export { cnSkeleton } from './SkeletonRectangular';
+export { cnSkeletonTypography } from './SkeletonTypography';

package/__inner__/cjs/components/Skeleton/index.js

@@ -1,4 +1,11 @@
 "use strict";
 exports.__esModule = true;
+exports.cnSkeletonTypography = exports.cnSkeleton = exports.cnSkeletonCircular = void 0;
 var tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./Skeleton"), exports);
+var SkeletonCircular_1 = require("./SkeletonCircular");
+tslib_1.__createBinding(exports, SkeletonCircular_1, "cnSkeletonCircular");
+var SkeletonRectangular_1 = require("./SkeletonRectangular");
+tslib_1.__createBinding(exports, SkeletonRectangular_1, "cnSkeleton");
+var SkeletonTypography_1 = require("./SkeletonTypography");
+tslib_1.__createBinding(exports, SkeletonTypography_1, "cnSkeletonTypography");

package/__inner__/cjs/components/Tooltip/Tooltip.d.ts

@@ -1,5 +1,4 @@
 import './Tooltip.css';
-import React from 'react';
-import type { TooltipProps } from './types';
+import type { TooltipBaseProps } from './types';
 export declare const cnTooltip: import("@bem-react/classname").ClassNameFormatter;
-export declare const Tooltip: React.ForwardRefExoticComponent<Omit<TooltipProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Tooltip: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<TooltipBaseProps, "div">;

package/__inner__/cjs/components/Tooltip/Tooltip.js

@@ -9,10 +9,11 @@ var useDebounceCallback_1 = require("../../hooks/useDebounceCallback");
 var useMultiRef_1 = require("../../hooks/useMultiRef");
 var useThemeProps_1 = require("../../hooks/useThemeProps");
 var classname_1 = require("../../utils/classname");
+var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
 var Popover_1 = require("../Popover");
 var constants_1 = require("./constants");
 exports.cnTooltip = (0, classname_1.cn)('Tooltip');
-exports.Tooltip = (0, react_1.forwardRef)(function (inProps, ref) {
+exports.Tooltip = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
     var props = (0, useThemeProps_1.useThemeProps)({ props: inProps, name: 'Tooltip' });
     var _a = props.trigger, trigger = _a === void 0 ? constants_1.TOOLTIP_DEFAULT_TRIGGER : _a, _b = props.size, size = _b === void 0 ? constants_1.TOOLTIP_DEFAULT_SIZE : _b, _c = props.variant, variant = _c === void 0 ? constants_1.TOOLTIP_DEFAULT_VARIANT : _c, _d = props.offset, offset = _d === void 0 ? constants_1.TOOLTIP_DEFAULT_OFFSET : _d, _e = props.delayEnter, delayEnter = _e === void 0 ? constants_1.TOOLTIP_DEFAULT_DELAY_ENTER : _e, _f = props.delayLeave, delayLeave = _f === void 0 ? constants_1.TOOLTIP_DEFAULT_DELAY_LEAVE : _f, _g = props.arrow, arrow = _g === void 0 ? constants_1.TOOLTIP_DEFAULT_ARROW : _g, _h = props.shouldWrapChildren, shouldWrapChildren = _h === void 0 ? constants_1.TOOLTIP_DEFAULT_SHOULD_WRAP_CHILDREN : _h, _j = props.disabled, disabled = _j === void 0 ? constants_1.TOOLTIP_DEFAULT_DISABLED : _j, children = props.children, label = props.label, openProp = props.open, placement = props.placement, disableInteractive = props.disableInteractive, className = props.className, onOpen = props.onOpen, onClose = props.onClose, other = tslib_1.__rest(props, ["trigger", "size", "variant", "offset", "delayEnter", "delayLeave", "arrow", "shouldWrapChildren", "disabled", "children", "label", "open", "placement", "disableInteractive", "className", "onOpen", "onClose"]);
     var _k = tslib_1.__read((0, react_1.useState)(), 2), delay = _k[0], setDelay = _k[1];

package/__inner__/cjs/components/Tooltip/types.d.ts

@@ -1,4 +1,5 @@
-import type { Ref, ReactNode, ReactElement, ComponentPropsWithRef } from 'react';
+import type { Ref, ReactNode, ReactElement, ComponentRef, ElementType } from 'react';
+import type { PolymorphicComponentPropsWithRef } from '../../utils/polymorphicComponentWithRef';
 import type { PopoverBaseProps } from '../Popover';
 import type { TOOLTIP_DEFAULT_TAG } from './constants';
 export declare const tooltipSizeVariant: readonly ["xs", "s"];
@@ -7,7 +8,7 @@ export declare const tooltipVariant: readonly ["light", "dark"];
 export type TooltipVariant = (typeof tooltipVariant)[number];
 export declare const tooltipTriggerVariant: readonly ["hover", "focus", "click", "hover&focus"];
 export type TooltipTriggerVariant = (typeof tooltipTriggerVariant)[number];
-export type TooltipProps = {
+export type TooltipBaseProps = {
     /** Признак по которому тултип будет представлен */
     open?: boolean;
     /** Элемент представляющий тултип, здесь может быть иконка, ссылка, кнопка и т.д. */
@@ -40,4 +41,6 @@ export type TooltipProps = {
     'data-testid'?: string;
     /** Дополнительные CSS-классы */
     className?: string;
-} & Pick<PopoverBaseProps, 'offset' | 'placement' | 'arrow' | 'anchorRef' | 'ignoreClickOutsideRefs' | 'disableInteractive' | 'onEnter' | 'onEntered' | 'onExit' | 'onExited' | 'setUpdate'> & ComponentPropsWithRef<typeof TOOLTIP_DEFAULT_TAG>;
+} & Pick<PopoverBaseProps, 'offset' | 'placement' | 'arrow' | 'anchorRef' | 'ignoreClickOutsideRefs' | 'disableInteractive' | 'onEnter' | 'onEntered' | 'onExit' | 'onExited' | 'setUpdate'>;
+export type TooltipRef = ComponentRef<typeof TOOLTIP_DEFAULT_TAG>;
+export type TooltipProps<As extends ElementType = typeof TOOLTIP_DEFAULT_TAG> = PolymorphicComponentPropsWithRef<TooltipBaseProps, As>;

package/__inner__/cjs/utils/polymorphicComponentWithRef.d.ts

@@ -1,4 +1,4 @@
-import type { ComponentPropsWithRef, ElementType, ComponentPropsWithoutRef } from 'react';
+import type { ComponentPropsWithRef, ElementType, ComponentPropsWithoutRef, ReactElement } from 'react';
 declare const defaultElement = "div";
 export type PolymorphicComponentPropsWithRef<Props, As extends ElementType> = Props & {
     as?: As;
@@ -7,10 +7,10 @@ export type PolymorphicComponentPropsWithoutRef<Props, As extends ElementType> =
     as?: As;
 } & Omit<ComponentPropsWithoutRef<As>, keyof Props>;
 export type PolymorphicComponentRef<As extends ElementType> = ComponentPropsWithRef<As>['ref'];
-type ComponentWithAs<Props, DefaultTag extends ElementType = typeof defaultElement> = <As extends ElementType = DefaultTag>(props: PolymorphicComponentPropsWithRef<Props, As>) => React.ReactElement | null;
+type ComponentWithAs<Props, DefaultTag extends ElementType = typeof defaultElement> = <As extends ElementType = DefaultTag>(props: PolymorphicComponentPropsWithRef<Props, As>) => ReactElement | null;
 export type PolymorphicComponentWithRef<Props, As extends ElementType> = ComponentWithAs<Props, As> & {
     displayName?: string | undefined;
 };
-type ForwardRefWithAs<Props> = <As extends ElementType>(props: PolymorphicComponentPropsWithRef<Props, As>, ref: PolymorphicComponentRef<As>) => React.ReactElement | null;
+type ForwardRefWithAs<Props> = <As extends ElementType>(props: PolymorphicComponentPropsWithRef<Props, As>, ref: PolymorphicComponentRef<As>) => ReactElement | null;
 export declare function polymorphicComponentWithRef<Props, As extends ElementType = typeof defaultElement>(baseComponent: ForwardRefWithAs<Props>): PolymorphicComponentWithRef<Props, As>;
 export {};

package/__inner__/esm/components/FieldInput/FieldInput.js

@@ -1,6 +1,7 @@
 import { __assign, __read, __rest } from "tslib";
-import React, { useCallback, useContext, useState, useEffect } from 'react';
+import React, { useCallback, useContext, useState } from 'react';
 import { useControlled } from '../../hooks/useControlled';
+import { useIsomorphicEffect } from '../../hooks/useIsomorphicEffect';
 import { cn } from '../../utils/classname';
 import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
 import { FieldControlContext } from '../FieldControl';
@@ -28,7 +29,7 @@ export var FieldInput = polymorphicComponentWithRef(function (_a, ref) {
             disabled = fieldControl.disabled;
         }
     }
-    useEffect(function () {
+    useIsomorphicEffect(function () {
         setFieldControl(function (prevState) { return (__assign(__assign({}, prevState), { filled: filled, focused: focused, value: valueState })); });
     }, [filled, focused, valueState]);
     var handleChange = useCallback(function (e) {

package/__inner__/esm/components/FieldLabel/FieldLabel.js

@@ -1,6 +1,7 @@
 import { __assign, __read } from "tslib";
 import './FieldLabel.css';
-import React, { forwardRef, useContext, useEffect } from 'react';
+import React, { forwardRef, useContext } from 'react';
+import { useIsomorphicEffect } from '../../hooks/useIsomorphicEffect';
 import { cn } from '../../utils/classname';
 import { FieldControlContext } from '../FieldControl';
 export var FIELD_LABEL_DEFAULT_TAG = 'span';
@@ -15,7 +16,7 @@ export var FieldLabel = forwardRef(function (_a, ref) {
     var disabled = disabledProp;
     var focused = focusedProp;
     var filled = filledProp;
-    useEffect(function () {
+    useIsomorphicEffect(function () {
         setFieldControl(function (prevState) { return (__assign(__assign({}, prevState), { label: children })); });
     }, [children]);
     if (!children) {

package/__inner__/esm/components/InputNumber/InputNumber.css

@@ -43,6 +43,7 @@
     color: var(--textfield-color);
     box-sizing: border-box;
     block-size: var(--textfield-input-height);
+    font: inherit;
   }
 .InputNumber-Field::placeholder {
       opacity: 1;

package/__inner__/esm/components/Skeleton/index.d.ts

@@ -1 +1,4 @@
 export * from './Skeleton';
+export { cnSkeletonCircular } from './SkeletonCircular';
+export { cnSkeleton } from './SkeletonRectangular';
+export { cnSkeletonTypography } from './SkeletonTypography';

package/__inner__/esm/components/Skeleton/index.js

@@ -1 +1,4 @@
 export * from './Skeleton';
+export { cnSkeletonCircular } from './SkeletonCircular';
+export { cnSkeleton } from './SkeletonRectangular';
+export { cnSkeletonTypography } from './SkeletonTypography';

package/__inner__/esm/components/Tooltip/Tooltip.d.ts

@@ -1,5 +1,4 @@
 import './Tooltip.css';
-import React from 'react';
-import type { TooltipProps } from './types';
+import type { TooltipBaseProps } from './types';
 export declare const cnTooltip: import("@bem-react/classname").ClassNameFormatter;
-export declare const Tooltip: React.ForwardRefExoticComponent<Omit<TooltipProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Tooltip: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<TooltipBaseProps, "div">;

package/__inner__/esm/components/Tooltip/Tooltip.js

@@ -1,15 +1,16 @@
 import { __assign, __read, __rest } from "tslib";
 import './Tooltip.css';
-import React, { forwardRef, useRef, useMemo, useState, useEffect } from 'react';
+import React, { useRef, useMemo, useState, useEffect } from 'react';
 import { useControlled } from '../../hooks/useControlled';
 import { useDebounceCallback } from '../../hooks/useDebounceCallback';
 import { useMultiRef } from '../../hooks/useMultiRef';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
+import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
 import { Popover } from '../Popover';
 import { TOOLTIP_DEFAULT_ARROW, TOOLTIP_DEFAULT_DELAY_ENTER, TOOLTIP_DEFAULT_DELAY_LEAVE, TOOLTIP_DEFAULT_DISABLED, TOOLTIP_DEFAULT_OFFSET, TOOLTIP_DEFAULT_SHOULD_WRAP_CHILDREN, TOOLTIP_DEFAULT_SIZE, TOOLTIP_DEFAULT_TAG, TOOLTIP_DEFAULT_TRIGGER, TOOLTIP_DEFAULT_VARIANT, } from './constants';
 export var cnTooltip = cn('Tooltip');
-export var Tooltip = forwardRef(function (inProps, ref) {
+export var Tooltip = polymorphicComponentWithRef(function (inProps, ref) {
     var props = useThemeProps({ props: inProps, name: 'Tooltip' });
     var _a = props.trigger, trigger = _a === void 0 ? TOOLTIP_DEFAULT_TRIGGER : _a, _b = props.size, size = _b === void 0 ? TOOLTIP_DEFAULT_SIZE : _b, _c = props.variant, variant = _c === void 0 ? TOOLTIP_DEFAULT_VARIANT : _c, _d = props.offset, offset = _d === void 0 ? TOOLTIP_DEFAULT_OFFSET : _d, _e = props.delayEnter, delayEnter = _e === void 0 ? TOOLTIP_DEFAULT_DELAY_ENTER : _e, _f = props.delayLeave, delayLeave = _f === void 0 ? TOOLTIP_DEFAULT_DELAY_LEAVE : _f, _g = props.arrow, arrow = _g === void 0 ? TOOLTIP_DEFAULT_ARROW : _g, _h = props.shouldWrapChildren, shouldWrapChildren = _h === void 0 ? TOOLTIP_DEFAULT_SHOULD_WRAP_CHILDREN : _h, _j = props.disabled, disabled = _j === void 0 ? TOOLTIP_DEFAULT_DISABLED : _j, children = props.children, label = props.label, openProp = props.open, placement = props.placement, disableInteractive = props.disableInteractive, className = props.className, onOpen = props.onOpen, onClose = props.onClose, other = __rest(props, ["trigger", "size", "variant", "offset", "delayEnter", "delayLeave", "arrow", "shouldWrapChildren", "disabled", "children", "label", "open", "placement", "disableInteractive", "className", "onOpen", "onClose"]);
     var _k = __read(useState(), 2), delay = _k[0], setDelay = _k[1];

package/__inner__/esm/components/Tooltip/types.d.ts

@@ -1,4 +1,5 @@
-import type { Ref, ReactNode, ReactElement, ComponentPropsWithRef } from 'react';
+import type { Ref, ReactNode, ReactElement, ComponentRef, ElementType } from 'react';
+import type { PolymorphicComponentPropsWithRef } from '../../utils/polymorphicComponentWithRef';
 import type { PopoverBaseProps } from '../Popover';
 import type { TOOLTIP_DEFAULT_TAG } from './constants';
 export declare const tooltipSizeVariant: readonly ["xs", "s"];
@@ -7,7 +8,7 @@ export declare const tooltipVariant: readonly ["light", "dark"];
 export type TooltipVariant = (typeof tooltipVariant)[number];
 export declare const tooltipTriggerVariant: readonly ["hover", "focus", "click", "hover&focus"];
 export type TooltipTriggerVariant = (typeof tooltipTriggerVariant)[number];
-export type TooltipProps = {
+export type TooltipBaseProps = {
     /** Признак по которому тултип будет представлен */
     open?: boolean;
     /** Элемент представляющий тултип, здесь может быть иконка, ссылка, кнопка и т.д. */
@@ -40,4 +41,6 @@ export type TooltipProps = {
     'data-testid'?: string;
     /** Дополнительные CSS-классы */
     className?: string;
-} & Pick<PopoverBaseProps, 'offset' | 'placement' | 'arrow' | 'anchorRef' | 'ignoreClickOutsideRefs' | 'disableInteractive' | 'onEnter' | 'onEntered' | 'onExit' | 'onExited' | 'setUpdate'> & ComponentPropsWithRef<typeof TOOLTIP_DEFAULT_TAG>;
+} & Pick<PopoverBaseProps, 'offset' | 'placement' | 'arrow' | 'anchorRef' | 'ignoreClickOutsideRefs' | 'disableInteractive' | 'onEnter' | 'onEntered' | 'onExit' | 'onExited' | 'setUpdate'>;
+export type TooltipRef = ComponentRef<typeof TOOLTIP_DEFAULT_TAG>;
+export type TooltipProps<As extends ElementType = typeof TOOLTIP_DEFAULT_TAG> = PolymorphicComponentPropsWithRef<TooltipBaseProps, As>;

package/__inner__/esm/utils/polymorphicComponentWithRef.d.ts

@@ -1,4 +1,4 @@
-import type { ComponentPropsWithRef, ElementType, ComponentPropsWithoutRef } from 'react';
+import type { ComponentPropsWithRef, ElementType, ComponentPropsWithoutRef, ReactElement } from 'react';
 declare const defaultElement = "div";
 export type PolymorphicComponentPropsWithRef<Props, As extends ElementType> = Props & {
     as?: As;
@@ -7,10 +7,10 @@ export type PolymorphicComponentPropsWithoutRef<Props, As extends ElementType> =
     as?: As;
 } & Omit<ComponentPropsWithoutRef<As>, keyof Props>;
 export type PolymorphicComponentRef<As extends ElementType> = ComponentPropsWithRef<As>['ref'];
-type ComponentWithAs<Props, DefaultTag extends ElementType = typeof defaultElement> = <As extends ElementType = DefaultTag>(props: PolymorphicComponentPropsWithRef<Props, As>) => React.ReactElement | null;
+type ComponentWithAs<Props, DefaultTag extends ElementType = typeof defaultElement> = <As extends ElementType = DefaultTag>(props: PolymorphicComponentPropsWithRef<Props, As>) => ReactElement | null;
 export type PolymorphicComponentWithRef<Props, As extends ElementType> = ComponentWithAs<Props, As> & {
     displayName?: string | undefined;
 };
-type ForwardRefWithAs<Props> = <As extends ElementType>(props: PolymorphicComponentPropsWithRef<Props, As>, ref: PolymorphicComponentRef<As>) => React.ReactElement | null;
+type ForwardRefWithAs<Props> = <As extends ElementType>(props: PolymorphicComponentPropsWithRef<Props, As>, ref: PolymorphicComponentRef<As>) => ReactElement | null;
 export declare function polymorphicComponentWithRef<Props, As extends ElementType = typeof defaultElement>(baseComponent: ForwardRefWithAs<Props>): PolymorphicComponentWithRef<Props, As>;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ozen-ui/kit",
-  "version": "0.9.0",
+  "version": "0.9.2",
   "description": "React component library",
   "files": [
     "*"