@arthurzakharov/ui-kit 1.0.21 → 1.0.22

package/dist/components/animation/animation.component.js

@@ -0,0 +1,9 @@
+import { FadeScale as o } from "./fade-scale/fade-scale.component.js";
+import { FadeSlide as e } from "./fade-slide/fade-slide.component.js";
+const r = {
+  FadeScale: o,
+  FadeSlide: e
+};
+export {
+  r as Animation
+};

package/dist/components/animation/fade-scale/fade-scale.component.d.ts

@@ -0,0 +1,13 @@
+import { PropsWithChildren } from 'react';
+import { AnimationGeneratorType, Easing } from 'motion';
+interface FadeScaleProps extends PropsWithChildren {
+    name: string;
+    condition: boolean;
+    className?: string;
+    type?: AnimationGeneratorType;
+    ease?: Easing | Easing[];
+    duration?: number;
+    delay?: number;
+}
+export declare const FadeScale: (props: FadeScaleProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/animation/fade-scale/fade-scale.component.js

@@ -0,0 +1,28 @@
+import { jsx as l } from "react/jsx-runtime";
+import { m } from "../../../proxy-BfgGIllg.js";
+const u = (e) => {
+  const {
+    children: t,
+    name: a,
+    condition: i,
+    ease: n = "easeInOut",
+    type: o = "tween",
+    className: r = "",
+    duration: s = 0.125,
+    delay: c = 0
+  } = e;
+  return i ? /* @__PURE__ */ l(
+    m.div,
+    {
+      initial: { opacity: 0, scale: 0.95 },
+      animate: { opacity: 1, scale: 1 },
+      transition: { ease: n, duration: s, delay: c, type: o },
+      className: r,
+      children: t
+    },
+    a
+  ) : null;
+};
+export {
+  u as FadeScale
+};

package/dist/components/animation/fade-slide/fade-slide.component.d.ts

@@ -0,0 +1,14 @@
+import { PropsWithChildren } from 'react';
+import { AnimationGeneratorType, Easing } from 'motion';
+interface FadeSlideProps extends PropsWithChildren {
+    name: string;
+    condition: boolean;
+    direction?: 'ltr' | 'rtl';
+    className?: string;
+    type?: AnimationGeneratorType;
+    ease?: Easing | Easing[];
+    duration?: number;
+    delay?: number;
+}
+export declare const FadeSlide: (props: FadeSlideProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/animation/fade-slide/fade-slide.component.js

@@ -0,0 +1,29 @@
+import { jsx as i } from "react/jsx-runtime";
+import { m } from "../../../proxy-BfgGIllg.js";
+const y = (t) => {
+  const {
+    children: e,
+    name: n,
+    condition: o,
+    direction: r = "ltr",
+    ease: a = "easeInOut",
+    type: d = "tween",
+    className: l = "",
+    duration: s = 0.125,
+    delay: c = 0
+  } = t;
+  return o ? /* @__PURE__ */ i("div", { style: { overflow: "hidden" }, children: /* @__PURE__ */ i(
+    m.div,
+    {
+      initial: { x: r === "ltr" ? "-100%" : "100%", opacity: 0 },
+      animate: { x: 0, opacity: 1 },
+      transition: { ease: a, duration: s, delay: c, type: d },
+      className: l,
+      children: e
+    },
+    n
+  ) }) : null;
+};
+export {
+  y as FadeSlide
+};

package/dist/components/info-panel/info-panel.component.d.ts

@@ -2,4 +2,4 @@ export interface InfoPanelProps {
     data: [string, string][];
     notVisibleAfter?: number;
 }
-export declare const InfoPanel: (props: InfoPanelProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const InfoPanel: (props: InfoPanelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/info-panel/info-panel.component.js

@@ -1,18 +1,19 @@
-import { jsx as e, jsxs as c } from "react/jsx-runtime";
+import { jsx as n, jsxs as c } from "react/jsx-runtime";
 import { useWindowSize as f } from "usehooks-ts";
-import '../../assets/info-panel-DQN2uPs8.css';const i = "_InfoPanel_1tthc_1", P = "_InfoPanelList_1tthc_27", r = "_InfoPanelItem_1tthc_41", _ = "_InfoPanelKey_1tthc_48", m = "_InfoPanelValue_1tthc_55", n = {
-  InfoPanel: i,
-  InfoPanelList: P,
+import { Animation as I } from "../animation/animation.component.js";
+import '../../assets/info-panel-DQN2uPs8.css';const P = "_InfoPanel_1tthc_1", m = "_InfoPanelList_1tthc_27", r = "_InfoPanelItem_1tthc_41", _ = "_InfoPanelKey_1tthc_48", d = "_InfoPanelValue_1tthc_55", e = {
+  InfoPanel: P,
+  InfoPanelList: m,
   InfoPanelItem: r,
   InfoPanelKey: _,
-  InfoPanelValue: m
-}, d = (l) => {
-  const { data: t = [], notVisibleAfter: o = 1024 } = l, { width: s } = f({ initializeWithValue: !0, debounceDelay: 200 });
-  return s >= o ? null : /* @__PURE__ */ e("div", { className: n.InfoPanel, children: /* @__PURE__ */ e("ul", { className: n.InfoPanelList, children: t.map(([a, I]) => /* @__PURE__ */ c("li", { className: n.InfoPanelItem, children: [
-    /* @__PURE__ */ e("span", { className: n.InfoPanelKey, children: a }),
-    /* @__PURE__ */ e("span", { className: n.InfoPanelValue, dangerouslySetInnerHTML: { __html: I } })
-  ] }, a)) }) });
+  InfoPanelValue: d
+}, V = (l) => {
+  const { data: o = [], notVisibleAfter: t = 1024 } = l, { width: s } = f({ initializeWithValue: !0, debounceDelay: 100 });
+  return /* @__PURE__ */ n(I.FadeScale, { name: "info-panel", condition: s < t, children: /* @__PURE__ */ n("div", { className: e.InfoPanel, children: /* @__PURE__ */ n("ul", { className: e.InfoPanelList, children: o.map(([a, i]) => /* @__PURE__ */ c("li", { className: e.InfoPanelItem, children: [
+    /* @__PURE__ */ n("span", { className: e.InfoPanelKey, children: a }),
+    /* @__PURE__ */ n("span", { className: e.InfoPanelValue, dangerouslySetInnerHTML: { __html: i } })
+  ] }, a)) }) }) });
 };
 export {
-  d as InfoPanel
+  V as InfoPanel
 };

package/dist/main.d.ts

@@ -1,3 +1,4 @@
+export { Animation } from './components/animation/animation.component';
 export { Certifications, type CertificationsProps, type CertificationsIcon, } from './components/certifications/certifications.component';
 export { Control } from './components/control/control.component';
 export { Footer, type FooterProps } from './components/footer/footer.component';

package/dist/main.js

@@ -1,16 +1,18 @@
-import { Certifications as e } from "./components/certifications/certifications.component.js";
-import { Control as f } from "./components/control/control.component.js";
-import { Footer as m } from "./components/footer/footer.component.js";
-import { Header as a } from "./components/header/header.component.js";
-import { InfoPanel as i } from "./components/info-panel/info-panel.component.js";
-import { Layout as C } from "./components/layout/layout.component.js";
-import { Text as d } from "./components/text/text.component.js";
+import { Animation as t } from "./components/animation/animation.component.js";
+import { Certifications as f } from "./components/certifications/certifications.component.js";
+import { Control as x } from "./components/control/control.component.js";
+import { Footer as n } from "./components/footer/footer.component.js";
+import { Header as i } from "./components/header/header.component.js";
+import { InfoPanel as C } from "./components/info-panel/info-panel.component.js";
+import { Layout as d } from "./components/layout/layout.component.js";
+import { Text as u } from "./components/text/text.component.js";
 import './assets/main-2dYBPRqY.css';export {
-  e as Certifications,
-  f as Control,
-  m as Footer,
-  a as Header,
-  i as InfoPanel,
-  C as Layout,
-  d as Text
+  t as Animation,
+  f as Certifications,
+  x as Control,
+  n as Footer,
+  i as Header,
+  C as InfoPanel,
+  d as Layout,
+  u as Text
 };