@semcore/skeleton 5.42.1 → 16.0.0-prerelease.4

package/lib/esm/Skeleton.mjs

@@ -7,66 +7,65 @@ 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 { createComponent as C, sstyled as p, 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 = (
+import D from "@semcore/core/lib/utils/uniqueID";
+import I from "@semcore/core/lib/utils/canUseDOM";
+import O from "@semcore/core/lib/utils/enhances/i18nEnhance";
+import { localizedMessages as U } from "./translations/__intergalactic-dynamic-locales.mjs";
+var N = ["y", "x", "amount", "width", "styles", "forwardRef"], A = (
   /*__reshadow_css_start__*/
-  (D.insert(
+  (p.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_"
+    "@keyframes pulse_1aad7{0%,to{opacity:1}50%{opacity:.4}}.___SSkeleton_1aad7_gg_{animation-name:pulse_1aad7;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:var(--durationAnim_1aad7);will-change:opacity}.___SSkeletonSVG_1aad7_gg_._theme_invert_1aad7_gg_{fill:var(--intergalactic-skeleton-bg, rgba(224, 225, 233, 0.8))}.___SSkeletonSVG_1aad7_gg_._theme_dark_1aad7_gg_{fill:var(--intergalactic-skeleton-bg-invert, rgba(255, 255, 255, 0.3))}.___SText_1aad7_gg_{box-sizing:border-box}@media (prefers-reduced-motion){.___SSkeleton_1aad7_gg_{animation-name:none}}",
+    "1aad7_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_"
+    __SSkeleton: "___SSkeleton_1aad7_gg_",
+    "--durationAnim": "--durationAnim_1aad7",
+    "@pulse": "pulse_1aad7",
+    __SSkeletonSVG: "___SSkeletonSVG_1aad7_gg_",
+    _theme_invert: "_theme_invert_1aad7_gg_",
+    _theme_dark: "_theme_dark_1aad7_gg_",
+    __SText: "___SText_1aad7_gg_"
   })
-), j = {
+), W = {
   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);
+}, v = /* @__PURE__ */ function(a) {
+  R(r, a);
+  var m = P(r);
   function r() {
-    return b(this, r), c.apply(this, arguments);
+    return b(this, r), m.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"),
+      var e = this.asProps, t, n = $, i = this.asProps;
+      i.Children;
+      var l = i.styles, d = i.duration, u = i.hidden, c = i.getI18nText;
+      return i.tag, u ? null : (t = p(l), /* @__PURE__ */ s.createElement(n, t.cn("SSkeleton", g({}, E({
+        durationAnim: "".concat(d, "ms"),
         role: "img",
-        "aria-label": h("loading")
+        "aria-label": c("loading")
       }, e)))));
     }
   }]), r;
 }(w);
-_(d, "displayName", "Skeleton");
-_(d, "style", A);
-_(d, "enhance", [U(N)]);
-_(d, "defaultProps", {
+_(v, "displayName", "Skeleton");
+_(v, "style", A);
+_(v, "enhance", [O(U)]);
+_(v, "defaultProps", {
   width: "100%",
   height: "100%",
   duration: 2e3
 });
-var v = /* @__PURE__ */ function(i) {
-  R(r, i);
-  var c = P(r);
+var h = /* @__PURE__ */ function(a) {
+  R(r, a);
+  var m = 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 b(this, r), e = m.call(this, o), _(y(e), "svgRef", /* @__PURE__ */ s.createRef()), I() && o.observeParentSize && (e.observer = new ResizeObserver(e.handleResize.bind(y(e)))), e;
   }
   return x(r, [{
     key: "componentDidMount",
@@ -91,42 +90,42 @@ var v = /* @__PURE__ */ function(i) {
     value: function() {
       var e = this.asProps.theme;
       return {
-        gradientUrl: j[e]
+        gradientUrl: W[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({
+      var e = this.asProps, t, n = this.asProps, i = n.Children, l = n.styles, d = n.uid, u = n.theme, c = n.duration, S = L;
+      return t = p(l), /* @__PURE__ */ s.createElement(S, t.cn("SSkeletonSVG", g({}, E({
         tag: "svg",
         ref: this.svgRef,
         preserveAspectRatio: "none",
         theme: u,
-        durationAnim: "".concat(h, "ms")
+        durationAnim: "".concat(c, "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", {
+        id: d
+      }), /* @__PURE__ */ s.createElement(i, t.cn("Children", {})))), /* @__PURE__ */ s.createElement("rect", t.cn("rect", {
         x: "0",
         y: "0",
         width: "100%",
         height: "100%",
-        mask: "url(#".concat(m, ")")
+        mask: "url(#".concat(d, ")")
       })));
     }
   }]), r;
 }(w);
-_(v, "displayName", "SkeletonSVG");
-_(v, "enhance", [I()]);
-_(v, "style", A);
-_(v, "defaultProps", {
+_(h, "displayName", "SkeletonSVG");
+_(h, "enhance", [D()]);
+_(h, "style", A);
+_(h, "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) {
+function j(a) {
+  var m = $, r = a.y, o = r === void 0 ? 0 : r, e = a.x, t = e === void 0 ? 0 : e, n = a.amount, i = n === void 0 ? 1 : n, l = a.width, d = l === void 0 ? "100%" : l, u = a.styles, c = a.forwardRef, S = M(a, N), T = Number(i), G = function(f) {
     var k;
-    return k = S(u), /* @__PURE__ */ s.createElement(c, k.cn("SText", g({
+    return k = p(u), /* @__PURE__ */ s.createElement(m, k.cn("SText", g({
       tag: "rect",
       rx: "4",
       ry: "4",
@@ -138,16 +137,16 @@ function L(i) {
       key: f,
       y: o || 20 * f,
       x: t,
-      ref: h,
-      width: m
-    }, p));
+      ref: c,
+      width: d
+    }, S));
   }));
 }
-var q = C(d);
-const _e = C(v, {
-  Text: L
+var L = C(v);
+const ie = C(h, {
+  Text: j
 });
 export {
-  q as Skeleton,
-  _e as default
+  L as Skeleton,
+  ie as default
 };

package/lib/types/index.d.ts

@@ -1,6 +1,6 @@
 import { BoxProps } from '@semcore/flex-box';
 import { Intergalactic, UnknownProperties } from '@semcore/core';
-import { UniqueIDProps } from '@semcore/utils/lib/uniqueID';
+import { UniqueIDProps } from '@semcore/core/lib/utils/uniqueID';
 
 /** @deprecated */
 export interface ISkeletonProps extends SkeletonProps, UnknownProperties {}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/skeleton",
   "description": "Semrush Skeleton Component",
-  "version": "5.42.1",
+  "version": "16.0.0-prerelease.4",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "types": "lib/types/index.d.ts",
@@ -14,13 +14,10 @@
     "types": "./lib/types/index.d.ts"
   },
   "dependencies": {
-    "@semcore/utils": "4.48.1",
-    "@semcore/flex-box": "5.41.1"
+    "@semcore/flex-box": "16.0.0-prerelease.4"
   },
   "peerDependencies": {
-    "@semcore/core": "^2.17.5",
-    "react": "16.8 - 18",
-    "react-dom": "16.8 - 18"
+    "@semcore/base-components": "^16.0.0-prerelease.4"
   },
   "repository": {
     "type": "git",