@semcore/skeleton 5.42.0-prerelease.9 → 5.42.1-prerelease.0

package/lib/esm/Skeleton.mjs

@@ -0,0 +1,153 @@
+import z from "@babel/runtime/helpers/esm/toConsumableArray";
+import M from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import y from "@babel/runtime/helpers/esm/assertThisInitialized";
+import g from "@babel/runtime/helpers/esm/objectSpread2";
+import b from "@babel/runtime/helpers/esm/classCallCheck";
+import x from "@babel/runtime/helpers/esm/createClass";
+import R from "@babel/runtime/helpers/esm/inherits";
+import P from "@babel/runtime/helpers/esm/createSuper";
+import _ from "@babel/runtime/helpers/esm/defineProperty";
+import { sstyled as D } from "@semcore/utils/lib/core/index";
+import C, { sstyled as S, assignProps as E, Component as w } from "@semcore/core";
+import s from "react";
+import { Box as $ } from "@semcore/flex-box";
+import I from "@semcore/utils/lib/uniqueID";
+import O from "@semcore/utils/lib/canUseDOM";
+import U from "@semcore/utils/lib/enhances/i18nEnhance";
+import { localizedMessages as N } from "./translations/__intergalactic-dynamic-locales.mjs";
+var W = ["y", "x", "amount", "width", "styles", "forwardRef"], A = (
+  /*__reshadow_css_start__*/
+  (D.insert(
+    /*__inner_css_start__*/
+    "@keyframes pulse_1ihc1{0%,to{opacity:1}50%{opacity:.4}}.___SSkeleton_1ihc1_gg_{animation-name:pulse_1ihc1;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:var(--durationAnim_1ihc1);will-change:opacity}.___SSkeletonSVG_1ihc1_gg_._theme_invert_1ihc1_gg_{fill:var(--intergalactic-skeleton-bg, rgba(224, 225, 233, 0.8))}.___SSkeletonSVG_1ihc1_gg_._theme_dark_1ihc1_gg_{fill:var(--intergalactic-skeleton-bg-invert, rgba(255, 255, 255, 0.3))}.___SText_1ihc1_gg_{box-sizing:border-box}@media (prefers-reduced-motion){.___SSkeleton_1ihc1_gg_{animation-name:none}}",
+    "1ihc1_gg_"
+  ), {
+    __SSkeleton: "___SSkeleton_1ihc1_gg_",
+    "--durationAnim": "--durationAnim_1ihc1",
+    "@pulse": "pulse_1ihc1",
+    __SSkeletonSVG: "___SSkeletonSVG_1ihc1_gg_",
+    _theme_invert: "_theme_invert_1ihc1_gg_",
+    _theme_dark: "_theme_dark_1ihc1_gg_",
+    __SText: "___SText_1ihc1_gg_"
+  })
+), j = {
+  dark: "rgba(255, 255, 255, 0.3)",
+  invert: "rgba(224, 225, 233, 0.8)"
+}, d = /* @__PURE__ */ function(i) {
+  R(r, i);
+  var c = P(r);
+  function r() {
+    return b(this, r), c.apply(this, arguments);
+  }
+  return x(r, [{
+    key: "render",
+    value: function() {
+      var e = this.asProps, t, n = $, a = this.asProps;
+      a.Children;
+      var l = a.styles, m = a.duration, u = a.hidden, h = a.getI18nText;
+      return a.tag, u ? null : (t = S(l), /* @__PURE__ */ s.createElement(n, t.cn("SSkeleton", g({}, E({
+        durationAnim: "".concat(m, "ms"),
+        role: "img",
+        "aria-label": h("loading")
+      }, e)))));
+    }
+  }]), r;
+}(w);
+_(d, "displayName", "Skeleton");
+_(d, "style", A);
+_(d, "enhance", [U(N)]);
+_(d, "defaultProps", {
+  width: "100%",
+  height: "100%",
+  duration: 2e3
+});
+var v = /* @__PURE__ */ function(i) {
+  R(r, i);
+  var c = P(r);
+  function r(o) {
+    var e;
+    return b(this, r), e = c.call(this, o), _(y(e), "svgRef", /* @__PURE__ */ s.createRef()), O() && o.observeParentSize && (e.observer = new ResizeObserver(e.handleResize.bind(y(e)))), e;
+  }
+  return x(r, [{
+    key: "componentDidMount",
+    value: function() {
+      var e, t;
+      (e = this.observer) === null || e === void 0 || e.observe((t = this.svgRef.current) === null || t === void 0 ? void 0 : t.parentElement);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function() {
+      var e;
+      (e = this.observer) === null || e === void 0 || e.disconnect();
+    }
+  }, {
+    key: "handleResize",
+    value: function(e) {
+      var t = e[0].target, n = this.svgRef.current;
+      t && n && n.setAttribute("width", "100%");
+    }
+  }, {
+    key: "setContext",
+    value: function() {
+      var e = this.asProps.theme;
+      return {
+        gradientUrl: j[e]
+      };
+    }
+  }, {
+    key: "render",
+    value: function() {
+      var e = this.asProps, t, n = this.asProps, a = n.Children, l = n.styles, m = n.uid, u = n.theme, h = n.duration, p = q;
+      return t = S(l), /* @__PURE__ */ s.createElement(p, t.cn("SSkeletonSVG", g({}, E({
+        tag: "svg",
+        ref: this.svgRef,
+        preserveAspectRatio: "none",
+        theme: u,
+        durationAnim: "".concat(h, "ms")
+      }, e))), /* @__PURE__ */ s.createElement("defs", t.cn("defs", {}), /* @__PURE__ */ s.createElement("mask", t.cn("mask", {
+        id: m
+      }), /* @__PURE__ */ s.createElement(a, t.cn("Children", {})))), /* @__PURE__ */ s.createElement("rect", t.cn("rect", {
+        x: "0",
+        y: "0",
+        width: "100%",
+        height: "100%",
+        mask: "url(#".concat(m, ")")
+      })));
+    }
+  }]), r;
+}(w);
+_(v, "displayName", "SkeletonSVG");
+_(v, "enhance", [I()]);
+_(v, "style", A);
+_(v, "defaultProps", {
+  theme: "invert",
+  duration: 2e3
+});
+function L(i) {
+  var c = $, r = i.y, o = r === void 0 ? 0 : r, e = i.x, t = e === void 0 ? 0 : e, n = i.amount, a = n === void 0 ? 1 : n, l = i.width, m = l === void 0 ? "100%" : l, u = i.styles, h = i.forwardRef, p = M(i, W), T = Number(a), G = function(f) {
+    var k;
+    return k = S(u), /* @__PURE__ */ s.createElement(c, k.cn("SText", g({
+      tag: "rect",
+      rx: "4",
+      ry: "4",
+      height: "8"
+    }, f)));
+  };
+  return /* @__PURE__ */ s.createElement(s.Fragment, null, z(Array(T)).map(function(V, f) {
+    return G(g({
+      key: f,
+      y: o || 20 * f,
+      x: t,
+      ref: h,
+      width: m
+    }, p));
+  }));
+}
+var q = C(d);
+const _e = C(v, {
+  Text: L
+});
+export {
+  q as Skeleton,
+  _e as default
+};

package/lib/esm/index.mjs

@@ -0,0 +1,24 @@
+import { default as a } from "./Skeleton.mjs";
+import { default as o } from "./Charts/Histogram.mjs";
+import { default as f } from "./Charts/Donut.mjs";
+import { default as m } from "./Charts/Bar.mjs";
+import { default as d } from "./Charts/CompactHorizontalBar.mjs";
+import { default as s } from "./Charts/Area.mjs";
+import { default as C } from "./Charts/Line.mjs";
+import { default as h } from "./Charts/Venn.mjs";
+import { default as i } from "./Charts/ScatterPlot.mjs";
+import { default as b } from "./Charts/Bubble.mjs";
+import { default as H } from "./Charts/RadialTree.mjs";
+export {
+  s as AreaChartSkeleton,
+  m as BarChartSkeleton,
+  b as BubbleChartSkeleton,
+  d as CompactHorizontalBarChartSkeleton,
+  f as DonutChartSkeleton,
+  o as HistogramChartSkeleton,
+  C as LineChartSkeleton,
+  H as RadialTreeChartSkeleton,
+  i as ScatterPlotChartSkeleton,
+  h as VennChartSkeleton,
+  a as default
+};

package/lib/esm/translations/__intergalactic-dynamic-locales.mjs

@@ -0,0 +1,33 @@
+import r from "./de.json.mjs";
+import o from "./en.json.mjs";
+import m from "./es.json.mjs";
+import t from "./fr.json.mjs";
+import i from "./it.json.mjs";
+import p from "./ja.json.mjs";
+import f from "./ko.json.mjs";
+import e from "./nl.json.mjs";
+import s from "./pt.json.mjs";
+import a from "./tr.json.mjs";
+import l from "./vi.json.mjs";
+import v from "./zh.json.mjs";
+import d from "./pl.json.mjs";
+import n from "./sv.json.mjs";
+var B = {
+  de: r,
+  en: o,
+  es: m,
+  fr: t,
+  it: i,
+  ja: p,
+  ko: f,
+  nl: e,
+  pt: s,
+  tr: a,
+  vi: l,
+  zh: v,
+  pl: d,
+  sv: n
+};
+export {
+  B as localizedMessages
+};

package/lib/esm/translations/de.json.mjs

@@ -0,0 +1,7 @@
+const d = "Wird geladen …", a = {
+  loading: d
+};
+export {
+  a as default,
+  d as loading
+};

package/lib/esm/translations/en.json.mjs

@@ -0,0 +1,7 @@
+const n = "Loading…", o = {
+  loading: n
+};
+export {
+  o as default,
+  n as loading
+};

package/lib/esm/translations/es.json.mjs

@@ -0,0 +1,7 @@
+const a = "Cargando", o = {
+  loading: a
+};
+export {
+  o as default,
+  a as loading
+};

package/lib/esm/translations/fr.json.mjs

@@ -0,0 +1,7 @@
+const n = "Chargement en cours", o = {
+  loading: n
+};
+export {
+  o as default,
+  n as loading
+};

package/lib/esm/translations/it.json.mjs

@@ -0,0 +1,7 @@
+const a = "Caricamento", o = {
+  loading: a
+};
+export {
+  o as default,
+  a as loading
+};

package/lib/esm/translations/ja.json.mjs

@@ -0,0 +1,7 @@
+const a = "読み込み中", o = {
+  loading: a
+};
+export {
+  o as default,
+  a as loading
+};

package/lib/esm/translations/ko.json.mjs

@@ -0,0 +1,7 @@
+const o = "로딩 중", a = {
+  loading: o
+};
+export {
+  a as default,
+  o as loading
+};

package/lib/esm/translations/nl.json.mjs

@@ -0,0 +1,7 @@
+const n = "Bezig met laden...", a = {
+  loading: n
+};
+export {
+  a as default,
+  n as loading
+};

package/lib/esm/translations/pl.json.mjs

@@ -0,0 +1,7 @@
+const a = "Ładowanie…", o = {
+  loading: a
+};
+export {
+  o as default,
+  a as loading
+};

package/lib/esm/translations/pt.json.mjs

@@ -0,0 +1,7 @@
+const a = "Carregando", o = {
+  loading: a
+};
+export {
+  o as default,
+  a as loading
+};

package/lib/esm/translations/sv.json.mjs

@@ -0,0 +1,7 @@
+const a = "Laddar…", d = {
+  loading: a
+};
+export {
+  d as default,
+  a as loading
+};

package/lib/esm/translations/tr.json.mjs

@@ -0,0 +1,7 @@
+const o = "Yükleniyor", n = {
+  loading: o
+};
+export {
+  n as default,
+  o as loading
+};

package/lib/esm/translations/vi.json.mjs

@@ -0,0 +1,7 @@
+const a = "Đang tải…", n = {
+  loading: a
+};
+export {
+  n as default,
+  a as loading
+};

package/lib/esm/translations/zh.json.mjs

@@ -0,0 +1,7 @@
+const o = "正在加载", a = {
+  loading: o
+};
+export {
+  a as default,
+  o as loading
+};

package/package.json

@@ -1,19 +1,24 @@
 {
   "name": "@semcore/skeleton",
   "description": "Semrush Skeleton Component",
-  "version": "5.42.0-prerelease.9",
+  "version": "5.42.1-prerelease.0",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "types": "lib/types/index.d.ts",
   "sideEffects": false,
   "author": "UI-kit team <ui-kit-team@semrush.com>",
   "license": "MIT",
+  "exports": {
+    "require": "./lib/cjs/index.js",
+    "import": "./lib/esm/index.mjs",
+    "types": "./lib/types/index.d.ts"
+  },
   "dependencies": {
-    "@semcore/utils": "4.47.1-prerelease.9",
-    "@semcore/flex-box": "5.41.0-prerelease.9"
+    "@semcore/utils": "4.48.1-prerelease.0",
+    "@semcore/flex-box": "5.41.1-prerelease.0"
   },
   "peerDependencies": {
-    "@semcore/core": "^2.39.0-prerelease.9",
+    "@semcore/core": "^2.39.1-prerelease.0",
     "react": "16.8 - 18",
     "react-dom": "16.8 - 18"
   },
@@ -27,6 +32,6 @@
     "@semcore/testing-utils": "1.0.0"
   },
   "scripts": {
-    "build": "pnpm semcore-builder --source=js"
+    "build": "pnpm semcore-builder --source=js && pnpm vite build"
   }
 }

package/vite.config.ts

@@ -0,0 +1,17 @@
+import { defineConfig, mergeConfig } from 'vite';
+
+import viteConfig from '../../commonVite.config';
+
+export default mergeConfig(
+  viteConfig,
+  defineConfig({
+    build: {
+      lib: {
+        entry: './src/index.js',
+      },
+      rollupOptions: {
+        external: ['react', 'react-dom', 'react/jsx-runtime', /@babel\/runtime\/*/, /@semcore\/*/],
+      },
+    },
+  }),
+);