react-skeletonify 1.0.0

package/README.md

@@ -0,0 +1,14 @@
+# React Skeletonify
+
+A lightweight and flexible skeleton loading component for React ⚡.  
+Easily add animated skeleton loaders to any UI element.
+
+---
+
+## 🚀 Installation
+
+```bash
+npm install react-skeletonify
+# or
+yarn add react-skeletonify
+```

package/dist/index.css

@@ -0,0 +1,32 @@
+/* src/styles/skeleton.css */
+.Rss-skeleton {
+  animation: Rss-skeleton-loading 1s linear infinite alternate;
+  background-color: hsl(200, 20%, 90%);
+  color: transparent !important;
+  border: none !important;
+  outline: none !important;
+  pointer-events: none !important;
+  border-radius: 8px !important;
+}
+.Rss-skeleton img {
+  opacity: 0;
+}
+.Rss-skeleton a {
+  text-decoration: none !important;
+  color: transparent !important;
+}
+.Rss-skeleton-text {
+  margin-top: 5px !important;
+}
+.Rss-skeleton::placeholder {
+  color: transparent !important;
+}
+@keyframes Rss-skeleton-loading {
+  0% {
+    background-color: hsl(200, 20%, 80%);
+  }
+  100% {
+    background-color: hsl(200, 20%, 95%);
+  }
+}
+/*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/styles/skeleton.css"],"sourcesContent":[".Rss-skeleton {\n  animation: Rss-skeleton-loading 1s linear infinite alternate;\n  background-color: hsl(200, 20%, 90%);\n  color: transparent !important;\n  border: none !important;\n  outline: none !important;\n  pointer-events: none !important;\n  border-radius: 8px !important;\n}\n\n.Rss-skeleton img {\n  opacity: 0;\n}\n\n.Rss-skeleton a {\n  text-decoration: none !important;\n  color: transparent !important;\n}\n\n.Rss-skeleton-text {\n  margin-top: 5px !important;\n}\n\n.Rss-skeleton::placeholder {\n  color: transparent !important;\n}\n\n@keyframes Rss-skeleton-loading {\n  0% {\n    background-color: hsl(200, 20%, 80%);\n  }\n  100% {\n    background-color: hsl(200, 20%, 95%);\n  }\n}\n"],"mappings":";AAAA,CAAC;AACC,aAAW,qBAAqB,GAAG,OAAO,SAAS;AACnD,oBAAkB,IAAI,GAAG,EAAE,GAAG,EAAE;AAChC,SAAO;AACP,UAAQ;AACR,WAAS;AACT,kBAAgB;AAChB,iBAAe;AACjB;AAEA,CAVC,aAUa;AACZ,WAAS;AACX;AAEA,CAdC,aAca;AACZ,mBAAiB;AACjB,SAAO;AACT;AAEA,CAAC;AACC,cAAY;AACd;AAEA,CAvBC,YAuBY;AACX,SAAO;AACT;AAEA,WA1Ba;AA2BX;AACE,sBAAkB,IAAI,GAAG,EAAE,GAAG,EAAE;AAClC;AACA;AACE,sBAAkB,IAAI,GAAG,EAAE,GAAG,EAAE;AAClC;AACF;","names":[]}

package/dist/index.d.mts

@@ -0,0 +1,9 @@
+import React from 'react';
+
+interface SkeletonWrapperProps {
+    loading: boolean;
+    children: React.ReactNode;
+}
+declare const SkeletonWrapper: React.FC<SkeletonWrapperProps>;
+
+export { SkeletonWrapper };

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+
+interface SkeletonWrapperProps {
+    loading: boolean;
+    children: React.ReactNode;
+}
+declare const SkeletonWrapper: React.FC<SkeletonWrapperProps>;
+
+export { SkeletonWrapper };

package/dist/index.js

@@ -0,0 +1,137 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var index_exports = {};
+__export(index_exports, {
+  SkeletonWrapper: () => SkeletonWrapper_default
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/components/SkeletonElement.tsx
+var import_react4 = __toESM(require("react"));
+
+// src/hooks/useAddSkelton.ts
+var import_react3 = __toESM(require("react"));
+
+// src/utils/create-node-wrapper.ts
+var import_react = require("react");
+function createNodeWrapper(node) {
+  var _a;
+  if (!node) return null;
+  return (0, import_react.createElement)(
+    "div",
+    {
+      className: (((_a = node == null ? void 0 : node.props) == null ? void 0 : _a.className) || "") + " Rss-skeleton"
+    },
+    node
+  );
+}
+
+// src/constants/tags.ts
+var TEXT_TAGS = [
+  "p",
+  "span",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "li"
+];
+
+// src/utils/create-leaf-node.ts
+var import_react2 = __toESM(require("react"));
+function createLeafNode(node, className = "") {
+  return import_react2.default.cloneElement(node, {
+    ...node.props,
+    className: (node.props.className || "") + " Rss-skeleton " + className
+  });
+}
+
+// src/hooks/useAddSkelton.ts
+function useAddSkelton() {
+  const addSkeleton = (node) => {
+    if (!import_react3.default.isValidElement(node)) return createNodeWrapper(node);
+    const element = node;
+    const { children } = element.props;
+    const elementType = element.type;
+    const hasChildren = import_react3.default.Children.count(children) > 0;
+    const isValidChildren = typeof children !== "string";
+    if (typeof elementType === "function") {
+      const rendered = elementType(element.props);
+      return addSkeleton(rendered);
+    }
+    if (TEXT_TAGS.includes(elementType)) {
+      return createLeafNode(node, "Rss-skeleton-text");
+    }
+    if (elementType === "img") {
+      return createNodeWrapper(element);
+    }
+    if (hasChildren && isValidChildren) {
+      const childWithSkeletons = import_react3.default.Children.map(children, addSkeleton);
+      return import_react3.default.cloneElement(element, {
+        ...element.props,
+        children: childWithSkeletons
+      });
+    }
+    return createLeafNode(element);
+  };
+  return addSkeleton;
+}
+var useAddSkelton_default = useAddSkelton;
+
+// src/components/SkeletonElement.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var SkeletonElement = ({
+  children
+}) => {
+  const addSkeleton = useAddSkelton_default();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "skeleton-container", children: import_react4.default.Children.map(children, (child) => addSkeleton(child)) });
+};
+var SkeletonElement_default = SkeletonElement;
+
+// src/components/SkeletonWrapper.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var SkeletonWrapper = ({
+  loading,
+  children
+}) => {
+  if (loading) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SkeletonElement_default, { children });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children });
+};
+var SkeletonWrapper_default = SkeletonWrapper;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SkeletonWrapper
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.tsx","../src/components/SkeletonElement.tsx","../src/hooks/useAddSkelton.ts","../src/utils/create-node-wrapper.ts","../src/constants/tags.ts","../src/utils/create-leaf-node.ts","../src/components/SkeletonWrapper.tsx"],"sourcesContent":["import \"./styles/skeleton.css\";\n\nexport { default as SkeletonWrapper } from \"./components/SkeletonWrapper\";\n","import React from \"react\";\nimport useAddSkelton from \"../hooks/useAddSkelton\";\n\nconst SkeletonElement: React.FC<{ children: React.ReactNode }> = ({\n  children,\n}) => {\n  const addSkeleton = useAddSkelton();\n  return (\n    <div className=\"skeleton-container\">\n      {React.Children.map(children, (child) => addSkeleton(child))}\n    </div>\n  );\n};\n\nexport default SkeletonElement;\n","import React from \"react\";\nimport createNodeWrapper from \"../utils/create-node-wrapper\";\nimport { TEXT_TAGS } from \"../constants/tags\";\nimport createLeafNode from \"../utils/create-leaf-node\";\n\nfunction useAddSkelton() {\n  const addSkeleton = (node: React.ReactNode): React.ReactNode => {\n    if (!React.isValidElement(node)) return createNodeWrapper(node as any);\n\n    const element = node as React.ReactElement<any>;\n    const { children } = element.props;\n    const elementType = element.type;\n\n    const hasChildren = React.Children.count(children) > 0;\n    const isValidChildren = typeof children !== \"string\";\n\n    if (typeof elementType === \"function\") {\n      const rendered = (elementType as any)(element.props);\n      return addSkeleton(rendered);\n    }\n\n    if (TEXT_TAGS.includes(elementType)) {\n      return createLeafNode(node, \"Rss-skeleton-text\");\n    }\n\n    if (elementType === \"img\") {\n      return createNodeWrapper(element);\n    }\n\n    if (hasChildren && isValidChildren) {\n      const childWithSkeletons = React.Children.map(children, addSkeleton);\n\n      return React.cloneElement(element, {\n        ...element.props,\n        children: childWithSkeletons,\n      } as typeof element.props);\n    }\n\n    return createLeafNode(element);\n  };\n\n  return addSkeleton;\n}\n\nexport default useAddSkelton;\n","import React, { createElement } from \"react\";\n\nexport default function createNodeWrapper(node: React.ReactElement<any>) {\n  if (!node) return null;\n\n  return createElement(\n    \"div\",\n    {\n      className: (node?.props?.className || \"\") + \" Rss-skeleton\",\n    },\n    node\n  );\n}\n","export const TEXT_TAGS = [\n  \"p\",\n  \"span\",\n  \"h1\",\n  \"h2\",\n  \"h3\",\n  \"h4\",\n  \"h5\",\n  \"h6\",\n  \"li\",\n];\n","import React from \"react\";\n\nexport default function createLeafNode(\n  node: React.ReactElement<any>,\n  className: string = \"\"\n): React.ReactElement {\n  return React.cloneElement(node, {\n    ...node.props,\n    className: (node.props.className || \"\") + \" Rss-skeleton \" + className,\n  } as typeof node.props);\n}\n","import React from \"react\";\nimport SkeletonElement from \"./SkeletonElement\";\n\ninterface SkeletonWrapperProps {\n  loading: boolean;\n  children: React.ReactNode;\n}\n\nconst SkeletonWrapper: React.FC<SkeletonWrapperProps> = ({\n  loading,\n  children,\n}) => {\n  if (loading) {\n    return <SkeletonElement>{children}</SkeletonElement>;\n  }\n  return <>{children}</>;\n};\n\nexport default SkeletonWrapper;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAAkB;;;ACAlB,IAAAC,gBAAkB;;;ACAlB,mBAAqC;AAEtB,SAAR,kBAAmC,MAA+B;AAFzE;AAGE,MAAI,CAAC,KAAM,QAAO;AAElB,aAAO;AAAA,IACL;AAAA,IACA;AAAA,MACE,cAAY,kCAAM,UAAN,mBAAa,cAAa,MAAM;AAAA,IAC9C;AAAA,IACA;AAAA,EACF;AACF;;;ACZO,IAAM,YAAY;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;;;ACVA,IAAAC,gBAAkB;AAEH,SAAR,eACL,MACA,YAAoB,IACA;AACpB,SAAO,cAAAC,QAAM,aAAa,MAAM;AAAA,IAC9B,GAAG,KAAK;AAAA,IACR,YAAY,KAAK,MAAM,aAAa,MAAM,mBAAmB;AAAA,EAC/D,CAAsB;AACxB;;;AHLA,SAAS,gBAAgB;AACvB,QAAM,cAAc,CAAC,SAA2C;AAC9D,QAAI,CAAC,cAAAC,QAAM,eAAe,IAAI,EAAG,QAAO,kBAAkB,IAAW;AAErE,UAAM,UAAU;AAChB,UAAM,EAAE,SAAS,IAAI,QAAQ;AAC7B,UAAM,cAAc,QAAQ;AAE5B,UAAM,cAAc,cAAAA,QAAM,SAAS,MAAM,QAAQ,IAAI;AACrD,UAAM,kBAAkB,OAAO,aAAa;AAE5C,QAAI,OAAO,gBAAgB,YAAY;AACrC,YAAM,WAAY,YAAoB,QAAQ,KAAK;AACnD,aAAO,YAAY,QAAQ;AAAA,IAC7B;AAEA,QAAI,UAAU,SAAS,WAAW,GAAG;AACnC,aAAO,eAAe,MAAM,mBAAmB;AAAA,IACjD;AAEA,QAAI,gBAAgB,OAAO;AACzB,aAAO,kBAAkB,OAAO;AAAA,IAClC;AAEA,QAAI,eAAe,iBAAiB;AAClC,YAAM,qBAAqB,cAAAA,QAAM,SAAS,IAAI,UAAU,WAAW;AAEnE,aAAO,cAAAA,QAAM,aAAa,SAAS;AAAA,QACjC,GAAG,QAAQ;AAAA,QACX,UAAU;AAAA,MACZ,CAAyB;AAAA,IAC3B;AAEA,WAAO,eAAe,OAAO;AAAA,EAC/B;AAEA,SAAO;AACT;AAEA,IAAO,wBAAQ;;;ADpCX;AALJ,IAAM,kBAA2D,CAAC;AAAA,EAChE;AACF,MAAM;AACJ,QAAM,cAAc,sBAAc;AAClC,SACE,4CAAC,SAAI,WAAU,sBACZ,wBAAAC,QAAM,SAAS,IAAI,UAAU,CAAC,UAAU,YAAY,KAAK,CAAC,GAC7D;AAEJ;AAEA,IAAO,0BAAQ;;;AKDJ,IAAAC,sBAAA;AALX,IAAM,kBAAkD,CAAC;AAAA,EACvD;AAAA,EACA;AACF,MAAM;AACJ,MAAI,SAAS;AACX,WAAO,6CAAC,2BAAiB,UAAS;AAAA,EACpC;AACA,SAAO,6EAAG,UAAS;AACrB;AAEA,IAAO,0BAAQ;","names":["import_react","import_react","import_react","React","React","React","import_jsx_runtime"]}

package/dist/index.mjs

@@ -0,0 +1,100 @@
+// src/components/SkeletonElement.tsx
+import React4 from "react";
+
+// src/hooks/useAddSkelton.ts
+import React3 from "react";
+
+// src/utils/create-node-wrapper.ts
+import { createElement } from "react";
+function createNodeWrapper(node) {
+  var _a;
+  if (!node) return null;
+  return createElement(
+    "div",
+    {
+      className: (((_a = node == null ? void 0 : node.props) == null ? void 0 : _a.className) || "") + " Rss-skeleton"
+    },
+    node
+  );
+}
+
+// src/constants/tags.ts
+var TEXT_TAGS = [
+  "p",
+  "span",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "li"
+];
+
+// src/utils/create-leaf-node.ts
+import React2 from "react";
+function createLeafNode(node, className = "") {
+  return React2.cloneElement(node, {
+    ...node.props,
+    className: (node.props.className || "") + " Rss-skeleton " + className
+  });
+}
+
+// src/hooks/useAddSkelton.ts
+function useAddSkelton() {
+  const addSkeleton = (node) => {
+    if (!React3.isValidElement(node)) return createNodeWrapper(node);
+    const element = node;
+    const { children } = element.props;
+    const elementType = element.type;
+    const hasChildren = React3.Children.count(children) > 0;
+    const isValidChildren = typeof children !== "string";
+    if (typeof elementType === "function") {
+      const rendered = elementType(element.props);
+      return addSkeleton(rendered);
+    }
+    if (TEXT_TAGS.includes(elementType)) {
+      return createLeafNode(node, "Rss-skeleton-text");
+    }
+    if (elementType === "img") {
+      return createNodeWrapper(element);
+    }
+    if (hasChildren && isValidChildren) {
+      const childWithSkeletons = React3.Children.map(children, addSkeleton);
+      return React3.cloneElement(element, {
+        ...element.props,
+        children: childWithSkeletons
+      });
+    }
+    return createLeafNode(element);
+  };
+  return addSkeleton;
+}
+var useAddSkelton_default = useAddSkelton;
+
+// src/components/SkeletonElement.tsx
+import { jsx } from "react/jsx-runtime";
+var SkeletonElement = ({
+  children
+}) => {
+  const addSkeleton = useAddSkelton_default();
+  return /* @__PURE__ */ jsx("div", { className: "skeleton-container", children: React4.Children.map(children, (child) => addSkeleton(child)) });
+};
+var SkeletonElement_default = SkeletonElement;
+
+// src/components/SkeletonWrapper.tsx
+import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
+var SkeletonWrapper = ({
+  loading,
+  children
+}) => {
+  if (loading) {
+    return /* @__PURE__ */ jsx2(SkeletonElement_default, { children });
+  }
+  return /* @__PURE__ */ jsx2(Fragment, { children });
+};
+var SkeletonWrapper_default = SkeletonWrapper;
+export {
+  SkeletonWrapper_default as SkeletonWrapper
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SkeletonElement.tsx","../src/hooks/useAddSkelton.ts","../src/utils/create-node-wrapper.ts","../src/constants/tags.ts","../src/utils/create-leaf-node.ts","../src/components/SkeletonWrapper.tsx"],"sourcesContent":["import React from \"react\";\nimport useAddSkelton from \"../hooks/useAddSkelton\";\n\nconst SkeletonElement: React.FC<{ children: React.ReactNode }> = ({\n  children,\n}) => {\n  const addSkeleton = useAddSkelton();\n  return (\n    <div className=\"skeleton-container\">\n      {React.Children.map(children, (child) => addSkeleton(child))}\n    </div>\n  );\n};\n\nexport default SkeletonElement;\n","import React from \"react\";\nimport createNodeWrapper from \"../utils/create-node-wrapper\";\nimport { TEXT_TAGS } from \"../constants/tags\";\nimport createLeafNode from \"../utils/create-leaf-node\";\n\nfunction useAddSkelton() {\n  const addSkeleton = (node: React.ReactNode): React.ReactNode => {\n    if (!React.isValidElement(node)) return createNodeWrapper(node as any);\n\n    const element = node as React.ReactElement<any>;\n    const { children } = element.props;\n    const elementType = element.type;\n\n    const hasChildren = React.Children.count(children) > 0;\n    const isValidChildren = typeof children !== \"string\";\n\n    if (typeof elementType === \"function\") {\n      const rendered = (elementType as any)(element.props);\n      return addSkeleton(rendered);\n    }\n\n    if (TEXT_TAGS.includes(elementType)) {\n      return createLeafNode(node, \"Rss-skeleton-text\");\n    }\n\n    if (elementType === \"img\") {\n      return createNodeWrapper(element);\n    }\n\n    if (hasChildren && isValidChildren) {\n      const childWithSkeletons = React.Children.map(children, addSkeleton);\n\n      return React.cloneElement(element, {\n        ...element.props,\n        children: childWithSkeletons,\n      } as typeof element.props);\n    }\n\n    return createLeafNode(element);\n  };\n\n  return addSkeleton;\n}\n\nexport default useAddSkelton;\n","import React, { createElement } from \"react\";\n\nexport default function createNodeWrapper(node: React.ReactElement<any>) {\n  if (!node) return null;\n\n  return createElement(\n    \"div\",\n    {\n      className: (node?.props?.className || \"\") + \" Rss-skeleton\",\n    },\n    node\n  );\n}\n","export const TEXT_TAGS = [\n  \"p\",\n  \"span\",\n  \"h1\",\n  \"h2\",\n  \"h3\",\n  \"h4\",\n  \"h5\",\n  \"h6\",\n  \"li\",\n];\n","import React from \"react\";\n\nexport default function createLeafNode(\n  node: React.ReactElement<any>,\n  className: string = \"\"\n): React.ReactElement {\n  return React.cloneElement(node, {\n    ...node.props,\n    className: (node.props.className || \"\") + \" Rss-skeleton \" + className,\n  } as typeof node.props);\n}\n","import React from \"react\";\nimport SkeletonElement from \"./SkeletonElement\";\n\ninterface SkeletonWrapperProps {\n  loading: boolean;\n  children: React.ReactNode;\n}\n\nconst SkeletonWrapper: React.FC<SkeletonWrapperProps> = ({\n  loading,\n  children,\n}) => {\n  if (loading) {\n    return <SkeletonElement>{children}</SkeletonElement>;\n  }\n  return <>{children}</>;\n};\n\nexport default SkeletonWrapper;\n"],"mappings":";AAAA,OAAOA,YAAW;;;ACAlB,OAAOC,YAAW;;;ACAlB,SAAgB,qBAAqB;AAEtB,SAAR,kBAAmC,MAA+B;AAFzE;AAGE,MAAI,CAAC,KAAM,QAAO;AAElB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,MACE,cAAY,kCAAM,UAAN,mBAAa,cAAa,MAAM;AAAA,IAC9C;AAAA,IACA;AAAA,EACF;AACF;;;ACZO,IAAM,YAAY;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;;;ACVA,OAAOC,YAAW;AAEH,SAAR,eACL,MACA,YAAoB,IACA;AACpB,SAAOA,OAAM,aAAa,MAAM;AAAA,IAC9B,GAAG,KAAK;AAAA,IACR,YAAY,KAAK,MAAM,aAAa,MAAM,mBAAmB;AAAA,EAC/D,CAAsB;AACxB;;;AHLA,SAAS,gBAAgB;AACvB,QAAM,cAAc,CAAC,SAA2C;AAC9D,QAAI,CAACC,OAAM,eAAe,IAAI,EAAG,QAAO,kBAAkB,IAAW;AAErE,UAAM,UAAU;AAChB,UAAM,EAAE,SAAS,IAAI,QAAQ;AAC7B,UAAM,cAAc,QAAQ;AAE5B,UAAM,cAAcA,OAAM,SAAS,MAAM,QAAQ,IAAI;AACrD,UAAM,kBAAkB,OAAO,aAAa;AAE5C,QAAI,OAAO,gBAAgB,YAAY;AACrC,YAAM,WAAY,YAAoB,QAAQ,KAAK;AACnD,aAAO,YAAY,QAAQ;AAAA,IAC7B;AAEA,QAAI,UAAU,SAAS,WAAW,GAAG;AACnC,aAAO,eAAe,MAAM,mBAAmB;AAAA,IACjD;AAEA,QAAI,gBAAgB,OAAO;AACzB,aAAO,kBAAkB,OAAO;AAAA,IAClC;AAEA,QAAI,eAAe,iBAAiB;AAClC,YAAM,qBAAqBA,OAAM,SAAS,IAAI,UAAU,WAAW;AAEnE,aAAOA,OAAM,aAAa,SAAS;AAAA,QACjC,GAAG,QAAQ;AAAA,QACX,UAAU;AAAA,MACZ,CAAyB;AAAA,IAC3B;AAEA,WAAO,eAAe,OAAO;AAAA,EAC/B;AAEA,SAAO;AACT;AAEA,IAAO,wBAAQ;;;ADpCX;AALJ,IAAM,kBAA2D,CAAC;AAAA,EAChE;AACF,MAAM;AACJ,QAAM,cAAc,sBAAc;AAClC,SACE,oBAAC,SAAI,WAAU,sBACZ,UAAAC,OAAM,SAAS,IAAI,UAAU,CAAC,UAAU,YAAY,KAAK,CAAC,GAC7D;AAEJ;AAEA,IAAO,0BAAQ;;;AKDJ,SAEF,UAFE,OAAAC,YAAA;AALX,IAAM,kBAAkD,CAAC;AAAA,EACvD;AAAA,EACA;AACF,MAAM;AACJ,MAAI,SAAS;AACX,WAAO,gBAAAA,KAAC,2BAAiB,UAAS;AAAA,EACpC;AACA,SAAO,gBAAAA,KAAA,YAAG,UAAS;AACrB;AAEA,IAAO,0BAAQ;","names":["React","React","React","React","React","jsx"]}

package/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "react-skeletonify",
+  "version": "1.0.0",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "clean": "rm -rf dist",
+    "build": "tsup",
+    "prepublishOnly": "npm run clean && npm run build"
+  },
+  "keywords": [
+    "react",
+    "skeleton",
+    "loader",
+    "skeleton-ui",
+    "react-component",
+    "loading-ui"
+  ],
+  "author": "Sinan sinan.m.p333@gmail.com",
+  "license": "MIT",
+  "description": "A lightweight React package to add smart skeleton loaders to any component",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Sinan0333/react-skeletonify"
+  },
+  "homepage": "https://github.com/Sinan0333/react-skeletonify#readme",
+  "bugs": {
+    "url": "https://github.com/Sinan0333/react-skeletonify/issues"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.1.12",
+    "@types/react-dom": "^19.1.8",
+    "tsup": "^8.5.0",
+    "typescript": "^5.9.2",
+    "vite": "^7.1.3",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1"
+  }
+}