@shmidko61/lc-ui-kit 0.12.0 → 0.15.0

package/dist/tooltip-CWnHAfbI.js

@@ -0,0 +1,166 @@
+"use client";
+import { jsxs as Y, jsx as G } from "react/jsx-runtime";
+import { useState as g, useId as J, useRef as b, useEffect as N, isValidElement as Q, cloneElement as U } from "react";
+import { Flex as Z } from "./flex.js";
+import { Box as K } from "./box.js";
+function v(o) {
+  const [e, s] = o.split("-"), m = e === "top" || e === "bottom", n = s === "start", t = s === "end";
+  return { box: m ? {
+    left: n ? "0" : t ? "auto" : "50%",
+    right: t ? "0" : "auto",
+    top: e === "bottom" ? "calc(100% + 6px)" : "auto",
+    bottom: e === "top" ? "calc(100% + 6px)" : "auto",
+    transform: n || t ? "none" : "translateX(-50%)"
+  } : {
+    top: n ? "0" : t ? "auto" : "50%",
+    bottom: t ? "0" : "auto",
+    left: e === "right" ? "calc(100% + 6px)" : "auto",
+    right: e === "left" ? "calc(100% + 6px)" : "auto",
+    transform: n || t ? "none" : "translateY(-50%)"
+  }, arrow: m ? {
+    left: n ? "12px" : t ? "auto" : "50%",
+    right: t ? "12px" : "auto",
+    top: e === "bottom" ? "-4px" : "auto",
+    bottom: e === "top" ? "-4px" : "auto",
+    transform: "translateX(-50%) rotate(45deg)"
+  } : {
+    top: n ? "12px" : t ? "auto" : "50%",
+    bottom: t ? "12px" : "auto",
+    left: e === "right" ? "-4px" : "auto",
+    right: e === "left" ? "-4px" : "auto",
+    transform: "translateY(-50%) rotate(45deg)"
+  } };
+}
+function i(o) {
+  return {
+    position: {
+      type: "absolute",
+      top: o.top,
+      bottom: o.bottom,
+      left: o.left,
+      right: o.right
+    },
+    transform: o.transform
+  };
+}
+function tt({
+  children: o,
+  content: e,
+  placement: s = "top",
+  responsive: m,
+  md: n,
+  lg: t,
+  xl: h,
+  open: x,
+  defaultOpen: L = !1,
+  onOpenChange: y,
+  delay: E = 0,
+  showArrow: O = !0,
+  disabled: d = !1,
+  contentProps: r
+}) {
+  const [V, W] = g(L), [B, R] = g(!1), [j, z] = g(!1), [F, w] = g(!1), I = J(), f = !d && (x ?? V), p = b(!1), M = b(x), k = b(f);
+  M.current = x, k.current = f;
+  const D = b(y);
+  D.current = y, N(() => {
+    if (!p.current && !d) return;
+    const a = !d && !F && (B || j);
+    if (a === k.current) return;
+    const A = setTimeout(
+      () => {
+        M.current === void 0 && W(a), D.current?.(a);
+      },
+      a ? Math.max(0, E) : 0
+    );
+    return () => clearTimeout(A);
+  }, [B, j, d, F, E]);
+  const q = Q(o) ? U(o, {
+    "aria-describedby": [o.props["aria-describedby"], f ? I : void 0].filter(Boolean).join(" ") || void 0
+  }) : o, T = v(s), H = n?.placement !== void 0 ? n.placement ?? s : m?.md, l = H ? v(H) : void 0, S = t?.placement !== void 0 ? t.placement ?? s : m?.lg, u = S ? v(S) : void 0, X = h?.placement !== void 0 ? h.placement ?? s : m?.xl, c = X ? v(X) : void 0;
+  return /* @__PURE__ */ Y(
+    Z,
+    {
+      as: "span",
+      inline: !0,
+      position: { type: "relative" },
+      onMouseEnter: () => {
+        p.current = !0, w(!1), R(!0);
+      },
+      onMouseLeave: () => {
+        p.current = !0, R(!1);
+      },
+      onFocus: () => {
+        p.current = !0, w(!1), z(!0);
+      },
+      onBlur: (a) => {
+        a.currentTarget.contains(a.relatedTarget) || (p.current = !0, z(!1));
+      },
+      onKeyDown: (a) => {
+        a.key === "Escape" && (p.current = !0, w(!0));
+      },
+      children: [
+        q,
+        f && /* @__PURE__ */ Y(
+          K,
+          {
+            role: "tooltip",
+            id: I,
+            bg: "--color-background-default",
+            color: "--color-text-primary",
+            p: { px: 8, py: 6 },
+            border: { radius: "4px" },
+            width: "max-content",
+            maxWidth: "min(280px, calc(100vw - 24px))",
+            ...i(T.box),
+            ...r,
+            position: { ...i(T.box).position, ...r?.position },
+            md: l || r?.md ? {
+              ...l ? i(l.box) : {},
+              ...r?.md,
+              position: {
+                ...l ? i(l.box).position : {},
+                ...r?.md?.position
+              }
+            } : void 0,
+            lg: u || r?.lg ? {
+              ...u ? i(u.box) : {},
+              ...r?.lg,
+              position: {
+                ...u ? i(u.box).position : {},
+                ...r?.lg?.position
+              }
+            } : void 0,
+            xl: c || r?.xl ? {
+              ...c ? i(c.box) : {},
+              ...r?.xl,
+              position: {
+                ...c ? i(c.box).position : {},
+                ...r?.xl?.position
+              }
+            } : void 0,
+            style: { fontSize: "12px", lineHeight: "14px", zIndex: 1e3, ...r?.style },
+            children: [
+              O && /* @__PURE__ */ G(
+                K,
+                {
+                  "aria-hidden": "true",
+                  width: 8,
+                  height: 8,
+                  bg: "inherit",
+                  ...i(T.arrow),
+                  md: l ? i(l.arrow) : void 0,
+                  lg: u ? i(u.arrow) : void 0,
+                  xl: c ? i(c.arrow) : void 0
+                }
+              ),
+              e
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  tt as T
+};

package/dist/tooltip.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./tooltip-0RbTCYn_.cjs");exports.Tooltip=o.Tooltip;

package/dist/tooltip.js

@@ -0,0 +1,4 @@
+import { T as r } from "./tooltip-CWnHAfbI.js";
+export {
+  r as Tooltip
+};

package/dist/types/animation.types.d.ts

@@ -0,0 +1,35 @@
+import { CSSProperties } from 'react';
+/** Параметры одной CSS-анимации. Частичные объекты наследуются по base/md/lg/xl. */
+export type UiKitAnimation = {
+    /** Кадры Web Animations API; null удаляет наследуемые кадры и возвращает выбранный preset. */
+    keyframes?: Array<Keyframe> | null;
+    /** Настройка reduced motion для keyframes и spin: disable (по умолчанию) или keep. */
+    reducedMotion?: 'disable' | 'keep';
+    /** Синоним timingFunction в стиле Web Animations; ближайшее заданное значение побеждает. */
+    easing?: string;
+    /** Синоним iterationCount: число или Infinity; ближайшее заданное значение побеждает. */
+    iterations?: number;
+    /** Готовый набор spin (Web Animations) или имя пользовательского CSS @keyframes; по умолчанию none. */
+    preset?: 'spin' | (string & {});
+    /** Продолжительность CSS, например 800ms или 1.5s; число — миллисекунды, по умолчанию 1s. */
+    duration?: string | number;
+    /** Функция скорости CSS; по умолчанию linear. */
+    timingFunction?: CSSProperties['animationTimingFunction'];
+    /** Количество повторов или infinite; по умолчанию infinite. */
+    iterationCount?: number | 'infinite';
+    /** Задержка CSS, например 0ms; число — миллисекунды, по умолчанию 0ms. */
+    delay?: string | number;
+    /** Направление проигрывания; по умолчанию normal. */
+    direction?: 'normal' | 'reverse' | 'alternate' | 'alternate-reverse';
+    /** Применение кадров до и после анимации; по умолчанию none. */
+    fillMode?: 'none' | 'forwards' | 'backwards' | 'both';
+    /** Состояние воспроизведения; по умолчанию running. */
+    playState?: 'running' | 'paused';
+};
+/** Анимация: объект параметров, готовый spin или none для полного сброса. */
+export type UiKitAnimationValue = UiKitAnimation | 'spin' | 'none';
+/** Базовая и responsive-настройка анимации Box; явный style приоритетнее. */
+export type UiKitAnimationProps = {
+    /** Анимация. На md/lg/xl объекты наследуют свойства; none сбрасывает накопленные значения. */
+    animation?: UiKitAnimationValue;
+};

package/dist/types/index.d.ts

@@ -1,3 +1,4 @@
+export type * from './animation.types';
 export type * from './flex.types';
 export type * from './interaction.types';
 export type * from './layout.types';

package/dist/typography/index.d.ts

@@ -0,0 +1 @@
+export * from './typography';

package/dist/typography/typography.helpers.d.ts

@@ -1,7 +1,7 @@
 import { CSSProperties } from 'react';
 import { UiKitTypographyToken } from '../design-tokens/typography.tokens';
 import { CssVariableMap, ResponsiveStyleBreakpoint, ResponsiveUiKitStyleProps } from '../shared/responsive-style/responsive-style.types';
-import { UiKitTypographyProps } from '../types';
+import { UiKitTypographyProps } from '../types/index';
 /**
  * Токены размера шрифта, которые Typography может подключить к внутренним CSS-переменным.
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shmidko61/lc-ui-kit",
-  "version": "0.12.0",
+  "version": "0.15.0",
   "type": "module",
   "files": [
     "dist"
@@ -69,6 +69,27 @@
       ],
       "ui-kit-provider": [
         "dist/ui-kit-provider/ui-kit-provider.d.ts"
+      ],
+      "alert": [
+        "dist/alert/index.d.ts"
+      ],
+      "toast": [
+        "dist/toast/index.d.ts"
+      ],
+      "notification-provider": [
+        "dist/notification-provider/index.d.ts"
+      ],
+      "tooltip": [
+        "dist/tooltip/tooltip.d.ts"
+      ],
+      "loader": [
+        "dist/loader/index.d.ts"
+      ],
+      "progress-bar": [
+        "dist/progress-bar/index.d.ts"
+      ],
+      "tabs": [
+        "dist/tabs/index.d.ts"
       ]
     }
   },
@@ -173,6 +194,41 @@
       "types": "./dist/ui-kit-provider/ui-kit-provider.d.ts",
       "import": "./dist/ui-kit-provider.js",
       "require": "./dist/ui-kit-provider.cjs"
+    },
+    "./alert": {
+      "types": "./dist/alert/index.d.ts",
+      "import": "./dist/alert.js",
+      "require": "./dist/alert.cjs"
+    },
+    "./toast": {
+      "types": "./dist/toast/index.d.ts",
+      "import": "./dist/toast.js",
+      "require": "./dist/toast.cjs"
+    },
+    "./notification-provider": {
+      "types": "./dist/notification-provider/index.d.ts",
+      "import": "./dist/notification-provider.js",
+      "require": "./dist/notification-provider.cjs"
+    },
+    "./tooltip": {
+      "types": "./dist/tooltip/tooltip.d.ts",
+      "import": "./dist/tooltip.js",
+      "require": "./dist/tooltip.cjs"
+    },
+    "./loader": {
+      "types": "./dist/loader/index.d.ts",
+      "import": "./dist/loader.js",
+      "require": "./dist/loader.cjs"
+    },
+    "./progress-bar": {
+      "types": "./dist/progress-bar/index.d.ts",
+      "import": "./dist/progress-bar.js",
+      "require": "./dist/progress-bar.cjs"
+    },
+    "./tabs": {
+      "types": "./dist/tabs/index.d.ts",
+      "import": "./dist/tabs.js",
+      "require": "./dist/tabs.cjs"
     }
   },
   "sideEffects": [
@@ -207,20 +263,28 @@
     "vite-plugin-svgr": "^5.2.0"
   },
   "scripts": {
-    "verify:package": "pnpm typecheck && pnpm lint && pnpm format:check && pnpm build && pnpm typecheck:package && pnpm test:checks && pnpm test:package && pnpm test:hover && pnpm test:states && pnpm pack:check && pnpm storybook:build",
+    "verify:package": "pnpm typecheck && pnpm lint && pnpm format:check && pnpm build && pnpm typecheck:package && pnpm test:checks && pnpm test:package && pnpm test:hover && pnpm test:states && pnpm test:animation && pnpm test:progress-bar && pnpm test:tabs && pnpm pack:check && pnpm storybook:build",
     "build": "vite build && tailwindcss -i src/styles.css -o dist/styles.css --minify",
     "lint": "eslint src .storybook vite.config.ts --max-warnings=0",
     "lint:fix": "eslint src .storybook vite.config.ts --fix",
     "format": "prettier src .storybook scripts type-tests README.md CHANGELOG.md postcss.config.cjs tailwind.config.cjs tsconfig*.json vite.config.ts package.json --write",
     "format:check": "prettier src .storybook scripts type-tests README.md CHANGELOG.md postcss.config.cjs tailwind.config.cjs tsconfig*.json vite.config.ts package.json --check",
     "storybook": "storybook dev -p 6006 --host 127.0.0.1",
-    "storybook:build": "storybook build",
+    "storybook:build": "node --max-old-space-size=8192 ./node_modules/storybook/dist/bin/dispatcher.js build",
     "typecheck": "tsc --noEmit",
     "test:hover": "node scripts/check-hover.mjs",
     "test:states": "node scripts/check-states.mjs",
     "test:package": "node scripts/check-package.mjs",
     "test:checks": "node --test scripts/package-checks.test.mjs",
     "pack:check": "node scripts/check-tarball.mjs",
-    "typecheck:package": "tsc -p tsconfig.package-test.json"
+    "typecheck:package": "tsc -p tsconfig.package-test.json",
+    "test:notifications": "node scripts/check-notifications-browser.mjs",
+    "test:compatibility": "node scripts/check-compatibility.mjs",
+    "test:animation": "node scripts/check-animation.mjs",
+    "test:animation:browser": "node scripts/check-animation-browser.mjs",
+    "test:progress-bar": "node scripts/check-progress-bar.mjs",
+    "test:progress-bar:browser": "node scripts/check-progress-bar-browser.mjs",
+    "test:tabs:browser": "node scripts/check-tabs-browser.mjs",
+    "test:tabs": "node scripts/check-tabs.mjs"
   }
 }