virtual-ui-lib 1.0.32 → 1.0.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -42,6 +42,7 @@ __export(index_exports, {
42
42
  GridLayout: () => GridLayout,
43
43
  ImageUploadPreview: () => ImageUploadPreview,
44
44
  Loader: () => Loader,
45
+ LoadingSkeleton: () => LoadingSkeleton,
45
46
  MultiStepProgress: () => MultiStepProgress,
46
47
  Navbar: () => Navbar,
47
48
  OTPInput: () => OTPInput,
@@ -999,6 +1000,25 @@ var DateRangePicker = ({
999
1000
  fontSize: "14px"
1000
1001
  } }, date.getDate()))));
1001
1002
  };
1003
+
1004
+ // src/components/LoadingSkeleton/LoadingSkeleton.jsx
1005
+ var import_react20 = __toESM(require("react"));
1006
+ var LoadingSkeleton = ({
1007
+ type = "card",
1008
+ width = "300px",
1009
+ height = "200px",
1010
+ bg = "#334155",
1011
+ shimmerColor = "#7c3aed",
1012
+ radius = "12px",
1013
+ speed = "1.5s"
1014
+ }) => {
1015
+ const shimmer = {
1016
+ background: `linear-gradient(90deg, ${shimmerColor} 25%, rgba(255, 255, 255, 0.2) 50%, ${shimmerColor} 75%)`,
1017
+ backgroundSize: "200% 100%",
1018
+ animation: `shimmer ${speed} infinite`
1019
+ };
1020
+ return /* @__PURE__ */ import_react20.default.createElement("div", { style: { width, height, borderRadius: radius, position: "relative", overflow: "hidden", background: bg } }, /* @__PURE__ */ import_react20.default.createElement("div", { style: { width: "100%", height: "100%", ...shimmer } }), /* @__PURE__ */ import_react20.default.createElement("style", null, `@keyframes shimmer { 0% { background-position: 200% 0%; } 100% { background-position: 0% 0%; } }`));
1021
+ };
1002
1022
  // Annotate the CommonJS export names for ESM import in node:
1003
1023
  0 && (module.exports = {
1004
1024
  AlertBanner,
@@ -1014,6 +1034,7 @@ var DateRangePicker = ({
1014
1034
  GridLayout,
1015
1035
  ImageUploadPreview,
1016
1036
  Loader,
1037
+ LoadingSkeleton,
1017
1038
  MultiStepProgress,
1018
1039
  Navbar,
1019
1040
  OTPInput,
package/dist/index.mjs CHANGED
@@ -946,6 +946,25 @@ var DateRangePicker = ({
946
946
  fontSize: "14px"
947
947
  } }, date.getDate()))));
948
948
  };
949
+
950
+ // src/components/LoadingSkeleton/LoadingSkeleton.jsx
951
+ import React20 from "react";
952
+ var LoadingSkeleton = ({
953
+ type = "card",
954
+ width = "300px",
955
+ height = "200px",
956
+ bg = "#334155",
957
+ shimmerColor = "#7c3aed",
958
+ radius = "12px",
959
+ speed = "1.5s"
960
+ }) => {
961
+ const shimmer = {
962
+ background: `linear-gradient(90deg, ${shimmerColor} 25%, rgba(255, 255, 255, 0.2) 50%, ${shimmerColor} 75%)`,
963
+ backgroundSize: "200% 100%",
964
+ animation: `shimmer ${speed} infinite`
965
+ };
966
+ return /* @__PURE__ */ React20.createElement("div", { style: { width, height, borderRadius: radius, position: "relative", overflow: "hidden", background: bg } }, /* @__PURE__ */ React20.createElement("div", { style: { width: "100%", height: "100%", ...shimmer } }), /* @__PURE__ */ React20.createElement("style", null, `@keyframes shimmer { 0% { background-position: 200% 0%; } 100% { background-position: 0% 0%; } }`));
967
+ };
949
968
  export {
950
969
  AlertBanner,
951
970
  AnimatedProgressBar,
@@ -960,6 +979,7 @@ export {
960
979
  GridLayout,
961
980
  ImageUploadPreview,
962
981
  Loader,
982
+ LoadingSkeleton,
963
983
  MultiStepProgress,
964
984
  Navbar,
965
985
  OTPInput,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "virtual-ui-lib",
3
- "version": "1.0.32",
3
+ "version": "1.0.33",
4
4
  "description": "Virtual UI React Component Library",
5
5
  "author": "Ankush",
6
6
  "license": "ISC",