shimmer-from-structure 0.1.0 → 0.2.0

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.
Files changed (3) hide show
  1. package/dist/index.esm +279 -630
  2. package/dist/index.js +9 -17
  3. package/package.json +11 -11
package/dist/index.esm CHANGED
@@ -1,682 +1,331 @@
1
- import I, { useState as dr, useRef as xe, useLayoutEffect as vr } from "react";
2
- var ee = { exports: {} }, L = {};
1
+ import y, { useState as te, useRef as M, useLayoutEffect as ne } from "react";
2
+ var N = { exports: {} }, _ = {};
3
3
  /**
4
4
  * @license React
5
- * react-jsx-runtime.production.min.js
5
+ * react-jsx-runtime.production.js
6
6
  *
7
- * Copyright (c) Facebook, Inc. and its affiliates.
7
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
8
8
  *
9
9
  * This source code is licensed under the MIT license found in the
10
10
  * LICENSE file in the root directory of this source tree.
11
11
  */
12
- var Se;
13
- function pr() {
14
- if (Se) return L;
15
- Se = 1;
16
- var f = I, d = Symbol.for("react.element"), R = Symbol.for("react.fragment"), h = Object.prototype.hasOwnProperty, T = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, S = { key: !0, ref: !0, __self: !0, __source: !0 };
17
- function _(C, v, O) {
18
- var p, b = {}, s = null, w = null;
19
- O !== void 0 && (s = "" + O), v.key !== void 0 && (s = "" + v.key), v.ref !== void 0 && (w = v.ref);
20
- for (p in v) h.call(v, p) && !S.hasOwnProperty(p) && (b[p] = v[p]);
21
- if (C && C.defaultProps) for (p in v = C.defaultProps, v) b[p] === void 0 && (b[p] = v[p]);
22
- return { $$typeof: d, type: C, key: s, ref: w, props: b, _owner: T.current };
12
+ var W;
13
+ function oe() {
14
+ if (W) return _;
15
+ W = 1;
16
+ var t = Symbol.for("react.transitional.element"), s = Symbol.for("react.fragment");
17
+ function f(u, i, c) {
18
+ var d = null;
19
+ if (c !== void 0 && (d = "" + c), i.key !== void 0 && (d = "" + i.key), "key" in i) {
20
+ c = {};
21
+ for (var p in i)
22
+ p !== "key" && (c[p] = i[p]);
23
+ } else c = i;
24
+ return i = c.ref, {
25
+ $$typeof: t,
26
+ type: u,
27
+ key: d,
28
+ ref: i !== void 0 ? i : null,
29
+ props: c
30
+ };
23
31
  }
24
- return L.Fragment = R, L.jsx = _, L.jsxs = _, L;
32
+ return _.Fragment = s, _.jsx = f, _.jsxs = f, _;
25
33
  }
26
- var V = {};
34
+ var T = {};
27
35
  /**
28
36
  * @license React
29
37
  * react-jsx-runtime.development.js
30
38
  *
31
- * Copyright (c) Facebook, Inc. and its affiliates.
39
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
32
40
  *
33
41
  * This source code is licensed under the MIT license found in the
34
42
  * LICENSE file in the root directory of this source tree.
35
43
  */
36
- var Oe;
37
- function hr() {
38
- return Oe || (Oe = 1, process.env.NODE_ENV !== "production" && function() {
39
- var f = I, d = Symbol.for("react.element"), R = Symbol.for("react.portal"), h = Symbol.for("react.fragment"), T = Symbol.for("react.strict_mode"), S = Symbol.for("react.profiler"), _ = Symbol.for("react.provider"), C = Symbol.for("react.context"), v = Symbol.for("react.forward_ref"), O = Symbol.for("react.suspense"), p = Symbol.for("react.suspense_list"), b = Symbol.for("react.memo"), s = Symbol.for("react.lazy"), w = Symbol.for("react.offscreen"), A = Symbol.iterator, J = "@@iterator";
40
- function Pe(e) {
41
- if (e === null || typeof e != "object")
42
- return null;
43
- var r = A && e[A] || e[J];
44
- return typeof r == "function" ? r : null;
45
- }
46
- var D = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
47
- function m(e) {
48
- {
49
- for (var r = arguments.length, t = new Array(r > 1 ? r - 1 : 0), n = 1; n < r; n++)
50
- t[n - 1] = arguments[n];
51
- ke("error", e, t);
52
- }
53
- }
54
- function ke(e, r, t) {
55
- {
56
- var n = D.ReactDebugCurrentFrame, o = n.getStackAddendum();
57
- o !== "" && (r += "%s", t = t.concat([o]));
58
- var u = t.map(function(i) {
59
- return String(i);
60
- });
61
- u.unshift("Warning: " + r), Function.prototype.apply.call(console[e], console, u);
62
- }
63
- }
64
- var Ae = !1, De = !1, Fe = !1, $e = !1, Ie = !1, re;
65
- re = Symbol.for("react.module.reference");
66
- function We(e) {
67
- return !!(typeof e == "string" || typeof e == "function" || e === h || e === S || Ie || e === T || e === O || e === p || $e || e === w || Ae || De || Fe || typeof e == "object" && e !== null && (e.$$typeof === s || e.$$typeof === b || e.$$typeof === _ || e.$$typeof === C || e.$$typeof === v || // This needs to include all possible module reference object
68
- // types supported by any Flight configuration anywhere since
69
- // we don't know which Flight build this will end up being used
70
- // with.
71
- e.$$typeof === re || e.getModuleId !== void 0));
72
- }
73
- function Ye(e, r, t) {
74
- var n = e.displayName;
75
- if (n)
76
- return n;
77
- var o = r.displayName || r.name || "";
78
- return o !== "" ? t + "(" + o + ")" : t;
79
- }
80
- function te(e) {
81
- return e.displayName || "Context";
82
- }
83
- function j(e) {
84
- if (e == null)
85
- return null;
86
- if (typeof e.tag == "number" && m("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
87
- return e.displayName || e.name || null;
88
- if (typeof e == "string")
89
- return e;
44
+ var U;
45
+ function ae() {
46
+ return U || (U = 1, process.env.NODE_ENV !== "production" && function() {
47
+ function t(e) {
48
+ if (e == null) return null;
49
+ if (typeof e == "function")
50
+ return e.$$typeof === K ? null : e.displayName || e.name || null;
51
+ if (typeof e == "string") return e;
90
52
  switch (e) {
91
- case h:
53
+ case A:
92
54
  return "Fragment";
93
- case R:
94
- return "Portal";
95
- case S:
55
+ case X:
96
56
  return "Profiler";
97
- case T:
57
+ case z:
98
58
  return "StrictMode";
99
- case O:
59
+ case B:
100
60
  return "Suspense";
101
- case p:
61
+ case H:
102
62
  return "SuspenseList";
63
+ case Q:
64
+ return "Activity";
103
65
  }
104
66
  if (typeof e == "object")
105
- switch (e.$$typeof) {
106
- case C:
107
- var r = e;
108
- return te(r) + ".Consumer";
109
- case _:
110
- var t = e;
111
- return te(t._context) + ".Provider";
112
- case v:
113
- return Ye(e, e.render, "ForwardRef");
114
- case b:
115
- var n = e.displayName || null;
116
- return n !== null ? n : j(e.type) || "Memo";
117
- case s: {
118
- var o = e, u = o._payload, i = o._init;
67
+ switch (typeof e.tag == "number" && console.error(
68
+ "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
69
+ ), e.$$typeof) {
70
+ case k:
71
+ return "Portal";
72
+ case J:
73
+ return e.displayName || "Context";
74
+ case G:
75
+ return (e._context.displayName || "Context") + ".Consumer";
76
+ case q:
77
+ var r = e.render;
78
+ return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
79
+ case Z:
80
+ return r = e.displayName || null, r !== null ? r : t(e.type) || "Memo";
81
+ case S:
82
+ r = e._payload, e = e._init;
119
83
  try {
120
- return j(i(u));
84
+ return t(e(r));
121
85
  } catch {
122
- return null;
123
86
  }
124
- }
125
87
  }
126
88
  return null;
127
89
  }
128
- var P = Object.assign, W = 0, ne, ae, ie, oe, ue, se, le;
129
- function ce() {
130
- }
131
- ce.__reactDisabledLog = !0;
132
- function Le() {
133
- {
134
- if (W === 0) {
135
- ne = console.log, ae = console.info, ie = console.warn, oe = console.error, ue = console.group, se = console.groupCollapsed, le = console.groupEnd;
136
- var e = {
137
- configurable: !0,
138
- enumerable: !0,
139
- value: ce,
140
- writable: !0
141
- };
142
- Object.defineProperties(console, {
143
- info: e,
144
- log: e,
145
- warn: e,
146
- error: e,
147
- group: e,
148
- groupCollapsed: e,
149
- groupEnd: e
150
- });
151
- }
152
- W++;
153
- }
154
- }
155
- function Ve() {
156
- {
157
- if (W--, W === 0) {
158
- var e = {
159
- configurable: !0,
160
- enumerable: !0,
161
- writable: !0
162
- };
163
- Object.defineProperties(console, {
164
- log: P({}, e, {
165
- value: ne
166
- }),
167
- info: P({}, e, {
168
- value: ae
169
- }),
170
- warn: P({}, e, {
171
- value: ie
172
- }),
173
- error: P({}, e, {
174
- value: oe
175
- }),
176
- group: P({}, e, {
177
- value: ue
178
- }),
179
- groupCollapsed: P({}, e, {
180
- value: se
181
- }),
182
- groupEnd: P({}, e, {
183
- value: le
184
- })
185
- });
186
- }
187
- W < 0 && m("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
188
- }
189
- }
190
- var K = D.ReactCurrentDispatcher, q;
191
- function M(e, r, t) {
192
- {
193
- if (q === void 0)
194
- try {
195
- throw Error();
196
- } catch (o) {
197
- var n = o.stack.trim().match(/\n( *(at )?)/);
198
- q = n && n[1] || "";
199
- }
200
- return `
201
- ` + q + e;
202
- }
203
- }
204
- var X = !1, N;
205
- {
206
- var Me = typeof WeakMap == "function" ? WeakMap : Map;
207
- N = new Me();
90
+ function s(e) {
91
+ return "" + e;
208
92
  }
209
- function fe(e, r) {
210
- if (!e || X)
211
- return "";
212
- {
213
- var t = N.get(e);
214
- if (t !== void 0)
215
- return t;
216
- }
217
- var n;
218
- X = !0;
219
- var o = Error.prepareStackTrace;
220
- Error.prepareStackTrace = void 0;
221
- var u;
222
- u = K.current, K.current = null, Le();
93
+ function f(e) {
223
94
  try {
224
- if (r) {
225
- var i = function() {
226
- throw Error();
227
- };
228
- if (Object.defineProperty(i.prototype, "props", {
229
- set: function() {
230
- throw Error();
231
- }
232
- }), typeof Reflect == "object" && Reflect.construct) {
233
- try {
234
- Reflect.construct(i, []);
235
- } catch (y) {
236
- n = y;
237
- }
238
- Reflect.construct(e, [], i);
239
- } else {
240
- try {
241
- i.call();
242
- } catch (y) {
243
- n = y;
244
- }
245
- e.call(i.prototype);
246
- }
247
- } else {
248
- try {
249
- throw Error();
250
- } catch (y) {
251
- n = y;
252
- }
253
- e();
254
- }
255
- } catch (y) {
256
- if (y && n && typeof y.stack == "string") {
257
- for (var a = y.stack.split(`
258
- `), g = n.stack.split(`
259
- `), l = a.length - 1, c = g.length - 1; l >= 1 && c >= 0 && a[l] !== g[c]; )
260
- c--;
261
- for (; l >= 1 && c >= 0; l--, c--)
262
- if (a[l] !== g[c]) {
263
- if (l !== 1 || c !== 1)
264
- do
265
- if (l--, c--, c < 0 || a[l] !== g[c]) {
266
- var E = `
267
- ` + a[l].replace(" at new ", " at ");
268
- return e.displayName && E.includes("<anonymous>") && (E = E.replace("<anonymous>", e.displayName)), typeof e == "function" && N.set(e, E), E;
269
- }
270
- while (l >= 1 && c >= 0);
271
- break;
272
- }
273
- }
274
- } finally {
275
- X = !1, K.current = u, Ve(), Error.prepareStackTrace = o;
276
- }
277
- var $ = e ? e.displayName || e.name : "", k = $ ? M($) : "";
278
- return typeof e == "function" && N.set(e, k), k;
279
- }
280
- function Ne(e, r, t) {
281
- return fe(e, !1);
282
- }
283
- function Ue(e) {
284
- var r = e.prototype;
285
- return !!(r && r.isReactComponent);
286
- }
287
- function U(e, r, t) {
288
- if (e == null)
289
- return "";
290
- if (typeof e == "function")
291
- return fe(e, Ue(e));
292
- if (typeof e == "string")
293
- return M(e);
294
- switch (e) {
295
- case O:
296
- return M("Suspense");
297
- case p:
298
- return M("SuspenseList");
299
- }
300
- if (typeof e == "object")
301
- switch (e.$$typeof) {
302
- case v:
303
- return Ne(e.render);
304
- case b:
305
- return U(e.type, r, t);
306
- case s: {
307
- var n = e, o = n._payload, u = n._init;
308
- try {
309
- return U(u(o), r, t);
310
- } catch {
311
- }
312
- }
313
- }
314
- return "";
315
- }
316
- var Y = Object.prototype.hasOwnProperty, de = {}, ve = D.ReactDebugCurrentFrame;
317
- function B(e) {
318
- if (e) {
319
- var r = e._owner, t = U(e.type, e._source, r ? r.type : null);
320
- ve.setExtraStackFrame(t);
321
- } else
322
- ve.setExtraStackFrame(null);
323
- }
324
- function Be(e, r, t, n, o) {
325
- {
326
- var u = Function.call.bind(Y);
327
- for (var i in e)
328
- if (u(e, i)) {
329
- var a = void 0;
330
- try {
331
- if (typeof e[i] != "function") {
332
- var g = Error((n || "React class") + ": " + t + " type `" + i + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[i] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
333
- throw g.name = "Invariant Violation", g;
334
- }
335
- a = e[i](r, i, n, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
336
- } catch (l) {
337
- a = l;
338
- }
339
- a && !(a instanceof Error) && (B(o), m("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", n || "React class", t, i, typeof a), B(null)), a instanceof Error && !(a.message in de) && (de[a.message] = !0, B(o), m("Failed %s type: %s", t, a.message), B(null));
340
- }
95
+ s(e);
96
+ var r = !1;
97
+ } catch {
98
+ r = !0;
341
99
  }
342
- }
343
- var Je = Array.isArray;
344
- function G(e) {
345
- return Je(e);
346
- }
347
- function Ke(e) {
348
- {
349
- var r = typeof Symbol == "function" && Symbol.toStringTag, t = r && e[Symbol.toStringTag] || e.constructor.name || "Object";
350
- return t;
100
+ if (r) {
101
+ r = console;
102
+ var n = r.error, o = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
103
+ return n.call(
104
+ r,
105
+ "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
106
+ o
107
+ ), s(e);
351
108
  }
352
109
  }
353
- function qe(e) {
110
+ function u(e) {
111
+ if (e === A) return "<>";
112
+ if (typeof e == "object" && e !== null && e.$$typeof === S)
113
+ return "<...>";
354
114
  try {
355
- return pe(e), !1;
115
+ var r = t(e);
116
+ return r ? "<" + r + ">" : "<...>";
356
117
  } catch {
357
- return !0;
118
+ return "<...>";
358
119
  }
359
120
  }
360
- function pe(e) {
361
- return "" + e;
121
+ function i() {
122
+ var e = j.A;
123
+ return e === null ? null : e.getOwner();
362
124
  }
363
- function he(e) {
364
- if (qe(e))
365
- return m("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Ke(e)), pe(e);
125
+ function c() {
126
+ return Error("react-stack-top-frame");
366
127
  }
367
- var me = D.ReactCurrentOwner, Xe = {
368
- key: !0,
369
- ref: !0,
370
- __self: !0,
371
- __source: !0
372
- }, ge, ye;
373
- function Ge(e) {
374
- if (Y.call(e, "ref")) {
375
- var r = Object.getOwnPropertyDescriptor(e, "ref").get;
376
- if (r && r.isReactWarning)
377
- return !1;
378
- }
379
- return e.ref !== void 0;
380
- }
381
- function ze(e) {
382
- if (Y.call(e, "key")) {
128
+ function d(e) {
129
+ if ($.call(e, "key")) {
383
130
  var r = Object.getOwnPropertyDescriptor(e, "key").get;
384
- if (r && r.isReactWarning)
385
- return !1;
131
+ if (r && r.isReactWarning) return !1;
386
132
  }
387
133
  return e.key !== void 0;
388
134
  }
389
- function He(e, r) {
390
- typeof e.ref == "string" && me.current;
391
- }
392
- function Ze(e, r) {
393
- {
394
- var t = function() {
395
- ge || (ge = !0, m("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
396
- };
397
- t.isReactWarning = !0, Object.defineProperty(e, "key", {
398
- get: t,
399
- configurable: !0
400
- });
401
- }
402
- }
403
- function Qe(e, r) {
404
- {
405
- var t = function() {
406
- ye || (ye = !0, m("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
407
- };
408
- t.isReactWarning = !0, Object.defineProperty(e, "ref", {
409
- get: t,
410
- configurable: !0
411
- });
135
+ function p(e, r) {
136
+ function n() {
137
+ Y || (Y = !0, console.error(
138
+ "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
139
+ r
140
+ ));
412
141
  }
413
- }
414
- var er = function(e, r, t, n, o, u, i) {
415
- var a = {
416
- // This tag allows us to uniquely identify this as a React Element
417
- $$typeof: d,
418
- // Built-in properties that belong on the element
142
+ n.isReactWarning = !0, Object.defineProperty(e, "key", {
143
+ get: n,
144
+ configurable: !0
145
+ });
146
+ }
147
+ function x() {
148
+ var e = t(this.type);
149
+ return I[e] || (I[e] = !0, console.error(
150
+ "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
151
+ )), e = this.props.ref, e !== void 0 ? e : null;
152
+ }
153
+ function w(e, r, n, o, g, P) {
154
+ var a = n.ref;
155
+ return e = {
156
+ $$typeof: b,
419
157
  type: e,
420
158
  key: r,
421
- ref: t,
422
- props: i,
423
- // Record the component responsible for creating this element.
424
- _owner: u
425
- };
426
- return a._store = {}, Object.defineProperty(a._store, "validated", {
159
+ props: n,
160
+ _owner: o
161
+ }, (a !== void 0 ? a : null) !== null ? Object.defineProperty(e, "ref", {
162
+ enumerable: !1,
163
+ get: x
164
+ }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
427
165
  configurable: !1,
428
166
  enumerable: !1,
429
167
  writable: !0,
430
- value: !1
431
- }), Object.defineProperty(a, "_self", {
168
+ value: 0
169
+ }), Object.defineProperty(e, "_debugInfo", {
432
170
  configurable: !1,
433
171
  enumerable: !1,
434
- writable: !1,
435
- value: n
436
- }), Object.defineProperty(a, "_source", {
172
+ writable: !0,
173
+ value: null
174
+ }), Object.defineProperty(e, "_debugStack", {
437
175
  configurable: !1,
438
176
  enumerable: !1,
439
- writable: !1,
440
- value: o
441
- }), Object.freeze && (Object.freeze(a.props), Object.freeze(a)), a;
442
- };
443
- function rr(e, r, t, n, o) {
444
- {
445
- var u, i = {}, a = null, g = null;
446
- t !== void 0 && (he(t), a = "" + t), ze(r) && (he(r.key), a = "" + r.key), Ge(r) && (g = r.ref, He(r, o));
447
- for (u in r)
448
- Y.call(r, u) && !Xe.hasOwnProperty(u) && (i[u] = r[u]);
449
- if (e && e.defaultProps) {
450
- var l = e.defaultProps;
451
- for (u in l)
452
- i[u] === void 0 && (i[u] = l[u]);
453
- }
454
- if (a || g) {
455
- var c = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
456
- a && Ze(i, c), g && Qe(i, c);
457
- }
458
- return er(e, a, g, o, n, me.current, i);
459
- }
460
- }
461
- var z = D.ReactCurrentOwner, be = D.ReactDebugCurrentFrame;
462
- function F(e) {
463
- if (e) {
464
- var r = e._owner, t = U(e.type, e._source, r ? r.type : null);
465
- be.setExtraStackFrame(t);
466
- } else
467
- be.setExtraStackFrame(null);
468
- }
469
- var H;
470
- H = !1;
471
- function Z(e) {
472
- return typeof e == "object" && e !== null && e.$$typeof === d;
473
- }
474
- function Ee() {
475
- {
476
- if (z.current) {
477
- var e = j(z.current.type);
478
- if (e)
479
- return `
480
-
481
- Check the render method of \`` + e + "`.";
482
- }
483
- return "";
484
- }
485
- }
486
- function tr(e) {
487
- return "";
488
- }
489
- var Re = {};
490
- function nr(e) {
491
- {
492
- var r = Ee();
493
- if (!r) {
494
- var t = typeof e == "string" ? e : e.displayName || e.name;
495
- t && (r = `
496
-
497
- Check the top-level render call using <` + t + ">.");
498
- }
499
- return r;
500
- }
501
- }
502
- function _e(e, r) {
503
- {
504
- if (!e._store || e._store.validated || e.key != null)
505
- return;
506
- e._store.validated = !0;
507
- var t = nr(r);
508
- if (Re[t])
509
- return;
510
- Re[t] = !0;
511
- var n = "";
512
- e && e._owner && e._owner !== z.current && (n = " It was passed a child from " + j(e._owner.type) + "."), F(e), m('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', t, n), F(null);
513
- }
514
- }
515
- function we(e, r) {
516
- {
517
- if (typeof e != "object")
518
- return;
519
- if (G(e))
520
- for (var t = 0; t < e.length; t++) {
521
- var n = e[t];
522
- Z(n) && _e(n, r);
523
- }
524
- else if (Z(e))
525
- e._store && (e._store.validated = !0);
526
- else if (e) {
527
- var o = Pe(e);
528
- if (typeof o == "function" && o !== e.entries)
529
- for (var u = o.call(e), i; !(i = u.next()).done; )
530
- Z(i.value) && _e(i.value, r);
531
- }
532
- }
533
- }
534
- function ar(e) {
535
- {
536
- var r = e.type;
537
- if (r == null || typeof r == "string")
538
- return;
539
- var t;
540
- if (typeof r == "function")
541
- t = r.propTypes;
542
- else if (typeof r == "object" && (r.$$typeof === v || // Note: Memo only checks outer props here.
543
- // Inner props are checked in the reconciler.
544
- r.$$typeof === b))
545
- t = r.propTypes;
546
- else
547
- return;
548
- if (t) {
549
- var n = j(r);
550
- Be(t, e.props, "prop", n, e);
551
- } else if (r.PropTypes !== void 0 && !H) {
552
- H = !0;
553
- var o = j(r);
554
- m("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", o || "Unknown");
555
- }
556
- typeof r.getDefaultProps == "function" && !r.getDefaultProps.isReactClassApproved && m("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
557
- }
558
- }
559
- function ir(e) {
560
- {
561
- for (var r = Object.keys(e.props), t = 0; t < r.length; t++) {
562
- var n = r[t];
563
- if (n !== "children" && n !== "key") {
564
- F(e), m("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", n), F(null);
565
- break;
566
- }
567
- }
568
- e.ref !== null && (F(e), m("Invalid attribute `ref` supplied to `React.Fragment`."), F(null));
569
- }
570
- }
571
- var Te = {};
572
- function Ce(e, r, t, n, o, u) {
573
- {
574
- var i = We(e);
575
- if (!i) {
576
- var a = "";
577
- (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (a += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
578
- var g = tr();
579
- g ? a += g : a += Ee();
580
- var l;
581
- e === null ? l = "null" : G(e) ? l = "array" : e !== void 0 && e.$$typeof === d ? (l = "<" + (j(e.type) || "Unknown") + " />", a = " Did you accidentally export a JSX literal instead of a component?") : l = typeof e, m("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", l, a);
582
- }
583
- var c = rr(e, r, t, o, u);
584
- if (c == null)
585
- return c;
586
- if (i) {
587
- var E = r.children;
588
- if (E !== void 0)
589
- if (n)
590
- if (G(E)) {
591
- for (var $ = 0; $ < E.length; $++)
592
- we(E[$], e);
593
- Object.freeze && Object.freeze(E);
594
- } else
595
- m("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
596
- else
597
- we(E, e);
598
- }
599
- if (Y.call(r, "key")) {
600
- var k = j(e), y = Object.keys(r).filter(function(fr) {
601
- return fr !== "key";
602
- }), Q = y.length > 0 ? "{key: someKey, " + y.join(": ..., ") + ": ...}" : "{key: someKey}";
603
- if (!Te[k + Q]) {
604
- var cr = y.length > 0 ? "{" + y.join(": ..., ") + ": ...}" : "{}";
605
- m(`A props object containing a "key" prop is being spread into JSX:
177
+ writable: !0,
178
+ value: g
179
+ }), Object.defineProperty(e, "_debugTask", {
180
+ configurable: !1,
181
+ enumerable: !1,
182
+ writable: !0,
183
+ value: P
184
+ }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
185
+ }
186
+ function h(e, r, n, o, g, P) {
187
+ var a = r.children;
188
+ if (a !== void 0)
189
+ if (o)
190
+ if (ee(a)) {
191
+ for (o = 0; o < a.length; o++)
192
+ R(a[o]);
193
+ Object.freeze && Object.freeze(a);
194
+ } else
195
+ console.error(
196
+ "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
197
+ );
198
+ else R(a);
199
+ if ($.call(r, "key")) {
200
+ a = t(e);
201
+ var v = Object.keys(r).filter(function(re) {
202
+ return re !== "key";
203
+ });
204
+ o = 0 < v.length ? "{key: someKey, " + v.join(": ..., ") + ": ...}" : "{key: someKey}", D[a + o] || (v = 0 < v.length ? "{" + v.join(": ..., ") + ": ...}" : "{}", console.error(
205
+ `A props object containing a "key" prop is being spread into JSX:
606
206
  let props = %s;
607
207
  <%s {...props} />
608
208
  React keys must be passed directly to JSX without using spread:
609
209
  let props = %s;
610
- <%s key={someKey} {...props} />`, Q, k, cr, k), Te[k + Q] = !0;
611
- }
612
- }
613
- return e === h ? ir(c) : ar(c), c;
210
+ <%s key={someKey} {...props} />`,
211
+ o,
212
+ a,
213
+ v,
214
+ a
215
+ ), D[a + o] = !0);
614
216
  }
615
- }
616
- function or(e, r, t) {
617
- return Ce(e, r, t, !0);
618
- }
619
- function ur(e, r, t) {
620
- return Ce(e, r, t, !1);
621
- }
622
- var sr = ur, lr = or;
623
- V.Fragment = h, V.jsx = sr, V.jsxs = lr;
624
- }()), V;
217
+ if (a = null, n !== void 0 && (f(n), a = "" + n), d(r) && (f(r.key), a = "" + r.key), "key" in r) {
218
+ n = {};
219
+ for (var C in r)
220
+ C !== "key" && (n[C] = r[C]);
221
+ } else n = r;
222
+ return a && p(
223
+ n,
224
+ typeof e == "function" ? e.displayName || e.name || "Unknown" : e
225
+ ), w(
226
+ e,
227
+ a,
228
+ n,
229
+ i(),
230
+ g,
231
+ P
232
+ );
233
+ }
234
+ function R(e) {
235
+ l(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === S && (e._payload.status === "fulfilled" ? l(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
236
+ }
237
+ function l(e) {
238
+ return typeof e == "object" && e !== null && e.$$typeof === b;
239
+ }
240
+ var m = y, b = Symbol.for("react.transitional.element"), k = Symbol.for("react.portal"), A = Symbol.for("react.fragment"), z = Symbol.for("react.strict_mode"), X = Symbol.for("react.profiler"), G = Symbol.for("react.consumer"), J = Symbol.for("react.context"), q = Symbol.for("react.forward_ref"), B = Symbol.for("react.suspense"), H = Symbol.for("react.suspense_list"), Z = Symbol.for("react.memo"), S = Symbol.for("react.lazy"), Q = Symbol.for("react.activity"), K = Symbol.for("react.client.reference"), j = m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, $ = Object.prototype.hasOwnProperty, ee = Array.isArray, O = console.createTask ? console.createTask : function() {
241
+ return null;
242
+ };
243
+ m = {
244
+ react_stack_bottom_frame: function(e) {
245
+ return e();
246
+ }
247
+ };
248
+ var Y, I = {}, F = m.react_stack_bottom_frame.bind(
249
+ m,
250
+ c
251
+ )(), L = O(u(c)), D = {};
252
+ T.Fragment = A, T.jsx = function(e, r, n) {
253
+ var o = 1e4 > j.recentlyCreatedOwnerStacks++;
254
+ return h(
255
+ e,
256
+ r,
257
+ n,
258
+ !1,
259
+ o ? Error("react-stack-top-frame") : F,
260
+ o ? O(u(e)) : L
261
+ );
262
+ }, T.jsxs = function(e, r, n) {
263
+ var o = 1e4 > j.recentlyCreatedOwnerStacks++;
264
+ return h(
265
+ e,
266
+ r,
267
+ n,
268
+ !0,
269
+ o ? Error("react-stack-top-frame") : F,
270
+ o ? O(u(e)) : L
271
+ );
272
+ };
273
+ }()), T;
625
274
  }
626
- process.env.NODE_ENV === "production" ? ee.exports = pr() : ee.exports = hr();
627
- var x = ee.exports;
628
- function mr(f) {
629
- const d = f.tagName.toLowerCase();
630
- return !!(["img", "svg", "video", "canvas", "iframe", "input", "textarea", "button"].includes(d) || !(Array.from(f.children).length > 0));
275
+ process.env.NODE_ENV === "production" ? N.exports = oe() : N.exports = ae();
276
+ var E = N.exports;
277
+ function se(t) {
278
+ const s = t.tagName.toLowerCase();
279
+ return !!(["img", "svg", "video", "canvas", "iframe", "input", "textarea", "button"].includes(s) || !(Array.from(t.children).length > 0));
631
280
  }
632
- function je(f, d) {
633
- const R = [], h = f.getBoundingClientRect();
634
- if (h.width === 0 || h.height === 0)
635
- return R;
636
- if (mr(f)) {
637
- const S = window.getComputedStyle(f).borderRadius || "0px", _ = {
638
- x: h.left - d.left,
639
- y: h.top - d.top,
640
- width: h.width,
641
- height: h.height,
642
- tag: f.tagName.toLowerCase(),
643
- borderRadius: S
281
+ function V(t, s) {
282
+ const f = [], u = t.getBoundingClientRect();
283
+ if (u.width === 0 || u.height === 0)
284
+ return f;
285
+ if (se(t)) {
286
+ const c = window.getComputedStyle(t).borderRadius || "0px", d = {
287
+ x: u.left - s.left,
288
+ y: u.top - s.top,
289
+ width: u.width,
290
+ height: u.height,
291
+ tag: t.tagName.toLowerCase(),
292
+ borderRadius: c
644
293
  };
645
- R.push(_);
294
+ f.push(d);
646
295
  } else
647
- Array.from(f.children).forEach((T) => {
648
- R.push(...je(T, d));
296
+ Array.from(t.children).forEach((i) => {
297
+ f.push(...V(i, s));
649
298
  });
650
- return R;
299
+ return f;
651
300
  }
652
- const yr = ({
653
- children: f,
654
- loading: d = !0,
655
- shimmerColor: R = "rgba(255, 255, 255, 0.15)",
656
- backgroundColor: h = "rgba(255, 255, 255, 0.08)",
657
- duration: T = 1.5,
658
- fallbackBorderRadius: S = 4,
659
- templateProps: _
301
+ const le = ({
302
+ children: t,
303
+ loading: s = !0,
304
+ shimmerColor: f = "rgba(255, 255, 255, 0.15)",
305
+ backgroundColor: u = "rgba(255, 255, 255, 0.08)",
306
+ duration: i = 1.5,
307
+ fallbackBorderRadius: c = 4,
308
+ templateProps: d
660
309
  }) => {
661
- const [C, v] = dr([]), O = xe(null), p = xe(null), b = I.useMemo(() => {
662
- if (!d || !_)
663
- return f;
664
- const s = I.Children.toArray(f);
665
- if (s.length === 0)
666
- return f;
667
- const w = s[0];
668
- return I.isValidElement(w) ? [I.cloneElement(w, {
669
- ..._
670
- }), ...s.slice(1)] : f;
671
- }, [f, d, _]);
672
- return vr(() => {
673
- if (!d || !p.current) return;
674
- const s = p.current, w = s.getBoundingClientRect(), A = [];
675
- Array.from(s.children).forEach((J) => {
676
- A.push(...je(J, w));
677
- }), v(A);
678
- }, [d, b]), d ? /* @__PURE__ */ x.jsxs("div", { style: { position: "relative" }, children: [
679
- /* @__PURE__ */ x.jsx("style", { children: `
310
+ const [p, x] = te([]), w = M(null), h = M(null), R = y.useMemo(() => {
311
+ if (!s || !d)
312
+ return t;
313
+ const l = y.Children.toArray(t);
314
+ if (l.length === 0)
315
+ return t;
316
+ const m = l[0];
317
+ return y.isValidElement(m) ? [y.cloneElement(m, {
318
+ ...d
319
+ }), ...l.slice(1)] : t;
320
+ }, [t, s, d]);
321
+ return ne(() => {
322
+ if (!s || !h.current) return;
323
+ const l = h.current, m = l.getBoundingClientRect(), b = [];
324
+ Array.from(l.children).forEach((k) => {
325
+ b.push(...V(k, m));
326
+ }), x(b);
327
+ }, [s, R]), s ? /* @__PURE__ */ E.jsxs("div", { style: { position: "relative" }, children: [
328
+ /* @__PURE__ */ E.jsx("style", { children: `
680
329
  .shimmer-measure-container * {
681
330
  color: transparent !important;
682
331
  border-color: transparent !important;
@@ -687,22 +336,22 @@ const yr = ({
687
336
  opacity: 0;
688
337
  }
689
338
  ` }),
690
- /* @__PURE__ */ x.jsx(
339
+ /* @__PURE__ */ E.jsx(
691
340
  "div",
692
341
  {
693
- ref: p,
342
+ ref: h,
694
343
  className: "shimmer-measure-container",
695
344
  style: {
696
345
  pointerEvents: "none"
697
346
  },
698
347
  "aria-hidden": "true",
699
- children: b
348
+ children: R
700
349
  }
701
350
  ),
702
- /* @__PURE__ */ x.jsxs(
351
+ /* @__PURE__ */ E.jsxs(
703
352
  "div",
704
353
  {
705
- ref: O,
354
+ ref: w,
706
355
  style: {
707
356
  position: "absolute",
708
357
  top: 0,
@@ -712,7 +361,7 @@ const yr = ({
712
361
  overflow: "hidden"
713
362
  },
714
363
  children: [
715
- /* @__PURE__ */ x.jsx("style", { children: `
364
+ /* @__PURE__ */ E.jsx("style", { children: `
716
365
  @keyframes shimmer {
717
366
  0% {
718
367
  transform: translateX(-100%);
@@ -722,20 +371,20 @@ const yr = ({
722
371
  }
723
372
  }
724
373
  ` }),
725
- C.map((s, w) => /* @__PURE__ */ x.jsx(
374
+ p.map((l, m) => /* @__PURE__ */ E.jsx(
726
375
  "div",
727
376
  {
728
377
  style: {
729
378
  position: "absolute",
730
- left: `${s.x}px`,
731
- top: `${s.y}px`,
732
- width: `${s.width}px`,
733
- height: `${s.height}px`,
734
- backgroundColor: h,
735
- borderRadius: s.borderRadius === "0px" ? `${S}px` : s.borderRadius,
379
+ left: `${l.x}px`,
380
+ top: `${l.y}px`,
381
+ width: `${l.width}px`,
382
+ height: `${l.height}px`,
383
+ backgroundColor: u,
384
+ borderRadius: l.borderRadius === "0px" ? `${c}px` : l.borderRadius,
736
385
  overflow: "hidden"
737
386
  },
738
- children: /* @__PURE__ */ x.jsx(
387
+ children: /* @__PURE__ */ E.jsx(
739
388
  "div",
740
389
  {
741
390
  style: {
@@ -744,19 +393,19 @@ const yr = ({
744
393
  left: 0,
745
394
  width: "100%",
746
395
  height: "100%",
747
- background: `linear-gradient(90deg, transparent, ${R}, transparent)`,
748
- animation: `shimmer ${T}s infinite`
396
+ background: `linear-gradient(90deg, transparent, ${f}, transparent)`,
397
+ animation: `shimmer ${i}s infinite`
749
398
  }
750
399
  }
751
400
  )
752
401
  },
753
- w
402
+ m
754
403
  ))
755
404
  ]
756
405
  }
757
406
  )
758
- ] }) : /* @__PURE__ */ x.jsx(x.Fragment, { children: f });
407
+ ] }) : /* @__PURE__ */ E.jsx(E.Fragment, { children: t });
759
408
  };
760
409
  export {
761
- yr as Shimmer
410
+ le as Shimmer
762
411
  };
package/dist/index.js CHANGED
@@ -1,33 +1,25 @@
1
- (function(k,y){typeof exports=="object"&&typeof module<"u"?y(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],y):(k=typeof globalThis<"u"?globalThis:k||self,y(k.ShimmerFromStructure={},k.React))})(this,function(k,y){"use strict";var q={exports:{}},Y={};/**
1
+ (function(E,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],f):(E=typeof globalThis<"u"?globalThis:E||self,f(E.ShimmerFromStructure={},E.React))})(this,function(E,f){"use strict";var w={exports:{}},y={};/**
2
2
  * @license React
3
- * react-jsx-runtime.production.min.js
3
+ * react-jsx-runtime.production.js
4
4
  *
5
- * Copyright (c) Facebook, Inc. and its affiliates.
5
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
6
6
  *
7
7
  * This source code is licensed under the MIT license found in the
8
8
  * LICENSE file in the root directory of this source tree.
9
- */var te;function Pe(){if(te)return Y;te=1;var c=y,d=Symbol.for("react.element"),_=Symbol.for("react.fragment"),h=Object.prototype.hasOwnProperty,x=c.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,O={key:!0,ref:!0,__self:!0,__source:!0};function T(C,v,j){var p,E={},s=null,w=null;j!==void 0&&(s=""+j),v.key!==void 0&&(s=""+v.key),v.ref!==void 0&&(w=v.ref);for(p in v)h.call(v,p)&&!O.hasOwnProperty(p)&&(E[p]=v[p]);if(C&&C.defaultProps)for(p in v=C.defaultProps,v)E[p]===void 0&&(E[p]=v[p]);return{$$typeof:d,type:C,key:s,ref:w,props:E,_owner:x.current}}return Y.Fragment=_,Y.jsx=T,Y.jsxs=T,Y}var L={};/**
9
+ */var Y;function z(){if(Y)return y;Y=1;var t=Symbol.for("react.transitional.element"),s=Symbol.for("react.fragment");function d(l,i,c){var m=null;if(c!==void 0&&(m=""+c),i.key!==void 0&&(m=""+i.key),"key"in i){c={};for(var b in i)b!=="key"&&(c[b]=i[b])}else c=i;return i=c.ref,{$$typeof:t,type:l,key:m,ref:i!==void 0?i:null,props:c}}return y.Fragment=s,y.jsx=d,y.jsxs=d,y}var T={};/**
10
10
  * @license React
11
11
  * react-jsx-runtime.development.js
12
12
  *
13
- * Copyright (c) Facebook, Inc. and its affiliates.
13
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
14
14
  *
15
15
  * This source code is licensed under the MIT license found in the
16
16
  * LICENSE file in the root directory of this source tree.
17
- */var ne;function ke(){return ne||(ne=1,process.env.NODE_ENV!=="production"&&function(){var c=y,d=Symbol.for("react.element"),_=Symbol.for("react.portal"),h=Symbol.for("react.fragment"),x=Symbol.for("react.strict_mode"),O=Symbol.for("react.profiler"),T=Symbol.for("react.provider"),C=Symbol.for("react.context"),v=Symbol.for("react.forward_ref"),j=Symbol.for("react.suspense"),p=Symbol.for("react.suspense_list"),E=Symbol.for("react.memo"),s=Symbol.for("react.lazy"),w=Symbol.for("react.offscreen"),D=Symbol.iterator,K="@@iterator";function De(e){if(e===null||typeof e!="object")return null;var r=D&&e[D]||e[K];return typeof r=="function"?r:null}var $=c.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function m(e){{for(var r=arguments.length,t=new Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];$e("error",e,t)}}function $e(e,r,t){{var n=$.ReactDebugCurrentFrame,o=n.getStackAddendum();o!==""&&(r+="%s",t=t.concat([o]));var u=t.map(function(i){return String(i)});u.unshift("Warning: "+r),Function.prototype.apply.call(console[e],console,u)}}var Ie=!1,We=!1,Ye=!1,Le=!1,Me=!1,ie;ie=Symbol.for("react.module.reference");function Ve(e){return!!(typeof e=="string"||typeof e=="function"||e===h||e===O||Me||e===x||e===j||e===p||Le||e===w||Ie||We||Ye||typeof e=="object"&&e!==null&&(e.$$typeof===s||e.$$typeof===E||e.$$typeof===T||e.$$typeof===C||e.$$typeof===v||e.$$typeof===ie||e.getModuleId!==void 0))}function Ne(e,r,t){var n=e.displayName;if(n)return n;var o=r.displayName||r.name||"";return o!==""?t+"("+o+")":t}function oe(e){return e.displayName||"Context"}function P(e){if(e==null)return null;if(typeof e.tag=="number"&&m("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case h:return"Fragment";case _:return"Portal";case O:return"Profiler";case x:return"StrictMode";case j:return"Suspense";case p:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case C:var r=e;return oe(r)+".Consumer";case T:var t=e;return oe(t._context)+".Provider";case v:return Ne(e,e.render,"ForwardRef");case E:var n=e.displayName||null;return n!==null?n:P(e.type)||"Memo";case s:{var o=e,u=o._payload,i=o._init;try{return P(i(u))}catch{return null}}}return null}var A=Object.assign,M=0,ue,se,le,fe,ce,de,ve;function pe(){}pe.__reactDisabledLog=!0;function Ue(){{if(M===0){ue=console.log,se=console.info,le=console.warn,fe=console.error,ce=console.group,de=console.groupCollapsed,ve=console.groupEnd;var e={configurable:!0,enumerable:!0,value:pe,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}M++}}function Be(){{if(M--,M===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:A({},e,{value:ue}),info:A({},e,{value:se}),warn:A({},e,{value:le}),error:A({},e,{value:fe}),group:A({},e,{value:ce}),groupCollapsed:A({},e,{value:de}),groupEnd:A({},e,{value:ve})})}M<0&&m("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var X=$.ReactCurrentDispatcher,G;function N(e,r,t){{if(G===void 0)try{throw Error()}catch(o){var n=o.stack.trim().match(/\n( *(at )?)/);G=n&&n[1]||""}return`
18
- `+G+e}}var z=!1,U;{var Je=typeof WeakMap=="function"?WeakMap:Map;U=new Je}function he(e,r){if(!e||z)return"";{var t=U.get(e);if(t!==void 0)return t}var n;z=!0;var o=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var u;u=X.current,X.current=null,Ue();try{if(r){var i=function(){throw Error()};if(Object.defineProperty(i.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(i,[])}catch(b){n=b}Reflect.construct(e,[],i)}else{try{i.call()}catch(b){n=b}e.call(i.prototype)}}else{try{throw Error()}catch(b){n=b}e()}}catch(b){if(b&&n&&typeof b.stack=="string"){for(var a=b.stack.split(`
19
- `),g=n.stack.split(`
20
- `),l=a.length-1,f=g.length-1;l>=1&&f>=0&&a[l]!==g[f];)f--;for(;l>=1&&f>=0;l--,f--)if(a[l]!==g[f]){if(l!==1||f!==1)do if(l--,f--,f<0||a[l]!==g[f]){var R=`
21
- `+a[l].replace(" at new "," at ");return e.displayName&&R.includes("<anonymous>")&&(R=R.replace("<anonymous>",e.displayName)),typeof e=="function"&&U.set(e,R),R}while(l>=1&&f>=0);break}}}finally{z=!1,X.current=u,Be(),Error.prepareStackTrace=o}var W=e?e.displayName||e.name:"",F=W?N(W):"";return typeof e=="function"&&U.set(e,F),F}function qe(e,r,t){return he(e,!1)}function Ke(e){var r=e.prototype;return!!(r&&r.isReactComponent)}function B(e,r,t){if(e==null)return"";if(typeof e=="function")return he(e,Ke(e));if(typeof e=="string")return N(e);switch(e){case j:return N("Suspense");case p:return N("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case v:return qe(e.render);case E:return B(e.type,r,t);case s:{var n=e,o=n._payload,u=n._init;try{return B(u(o),r,t)}catch{}}}return""}var V=Object.prototype.hasOwnProperty,me={},ge=$.ReactDebugCurrentFrame;function J(e){if(e){var r=e._owner,t=B(e.type,e._source,r?r.type:null);ge.setExtraStackFrame(t)}else ge.setExtraStackFrame(null)}function Xe(e,r,t,n,o){{var u=Function.call.bind(V);for(var i in e)if(u(e,i)){var a=void 0;try{if(typeof e[i]!="function"){var g=Error((n||"React class")+": "+t+" type `"+i+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[i]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw g.name="Invariant Violation",g}a=e[i](r,i,n,t,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(l){a=l}a&&!(a instanceof Error)&&(J(o),m("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",n||"React class",t,i,typeof a),J(null)),a instanceof Error&&!(a.message in me)&&(me[a.message]=!0,J(o),m("Failed %s type: %s",t,a.message),J(null))}}}var Ge=Array.isArray;function H(e){return Ge(e)}function ze(e){{var r=typeof Symbol=="function"&&Symbol.toStringTag,t=r&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t}}function He(e){try{return ye(e),!1}catch{return!0}}function ye(e){return""+e}function be(e){if(He(e))return m("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",ze(e)),ye(e)}var Ee=$.ReactCurrentOwner,Ze={key:!0,ref:!0,__self:!0,__source:!0},Re,_e;function Qe(e){if(V.call(e,"ref")){var r=Object.getOwnPropertyDescriptor(e,"ref").get;if(r&&r.isReactWarning)return!1}return e.ref!==void 0}function er(e){if(V.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function rr(e,r){typeof e.ref=="string"&&Ee.current}function tr(e,r){{var t=function(){Re||(Re=!0,m("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}}function nr(e,r){{var t=function(){_e||(_e=!0,m("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"ref",{get:t,configurable:!0})}}var ar=function(e,r,t,n,o,u,i){var a={$$typeof:d,type:e,key:r,ref:t,props:i,_owner:u};return a._store={},Object.defineProperty(a._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(a,"_self",{configurable:!1,enumerable:!1,writable:!1,value:n}),Object.defineProperty(a,"_source",{configurable:!1,enumerable:!1,writable:!1,value:o}),Object.freeze&&(Object.freeze(a.props),Object.freeze(a)),a};function ir(e,r,t,n,o){{var u,i={},a=null,g=null;t!==void 0&&(be(t),a=""+t),er(r)&&(be(r.key),a=""+r.key),Qe(r)&&(g=r.ref,rr(r,o));for(u in r)V.call(r,u)&&!Ze.hasOwnProperty(u)&&(i[u]=r[u]);if(e&&e.defaultProps){var l=e.defaultProps;for(u in l)i[u]===void 0&&(i[u]=l[u])}if(a||g){var f=typeof e=="function"?e.displayName||e.name||"Unknown":e;a&&tr(i,f),g&&nr(i,f)}return ar(e,a,g,o,n,Ee.current,i)}}var Z=$.ReactCurrentOwner,Te=$.ReactDebugCurrentFrame;function I(e){if(e){var r=e._owner,t=B(e.type,e._source,r?r.type:null);Te.setExtraStackFrame(t)}else Te.setExtraStackFrame(null)}var Q;Q=!1;function ee(e){return typeof e=="object"&&e!==null&&e.$$typeof===d}function we(){{if(Z.current){var e=P(Z.current.type);if(e)return`
22
-
23
- Check the render method of \``+e+"`."}return""}}function or(e){return""}var Se={};function ur(e){{var r=we();if(!r){var t=typeof e=="string"?e:e.displayName||e.name;t&&(r=`
24
-
25
- Check the top-level render call using <`+t+">.")}return r}}function xe(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var t=ur(r);if(Se[t])return;Se[t]=!0;var n="";e&&e._owner&&e._owner!==Z.current&&(n=" It was passed a child from "+P(e._owner.type)+"."),I(e),m('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',t,n),I(null)}}function Ce(e,r){{if(typeof e!="object")return;if(H(e))for(var t=0;t<e.length;t++){var n=e[t];ee(n)&&xe(n,r)}else if(ee(e))e._store&&(e._store.validated=!0);else if(e){var o=De(e);if(typeof o=="function"&&o!==e.entries)for(var u=o.call(e),i;!(i=u.next()).done;)ee(i.value)&&xe(i.value,r)}}}function sr(e){{var r=e.type;if(r==null||typeof r=="string")return;var t;if(typeof r=="function")t=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===v||r.$$typeof===E))t=r.propTypes;else return;if(t){var n=P(r);Xe(t,e.props,"prop",n,e)}else if(r.PropTypes!==void 0&&!Q){Q=!0;var o=P(r);m("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",o||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&m("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function lr(e){{for(var r=Object.keys(e.props),t=0;t<r.length;t++){var n=r[t];if(n!=="children"&&n!=="key"){I(e),m("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",n),I(null);break}}e.ref!==null&&(I(e),m("Invalid attribute `ref` supplied to `React.Fragment`."),I(null))}}var Oe={};function je(e,r,t,n,o,u){{var i=Ve(e);if(!i){var a="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(a+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var g=or();g?a+=g:a+=we();var l;e===null?l="null":H(e)?l="array":e!==void 0&&e.$$typeof===d?(l="<"+(P(e.type)||"Unknown")+" />",a=" Did you accidentally export a JSX literal instead of a component?"):l=typeof e,m("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",l,a)}var f=ir(e,r,t,o,u);if(f==null)return f;if(i){var R=r.children;if(R!==void 0)if(n)if(H(R)){for(var W=0;W<R.length;W++)Ce(R[W],e);Object.freeze&&Object.freeze(R)}else m("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Ce(R,e)}if(V.call(r,"key")){var F=P(e),b=Object.keys(r).filter(function(hr){return hr!=="key"}),re=b.length>0?"{key: someKey, "+b.join(": ..., ")+": ...}":"{key: someKey}";if(!Oe[F+re]){var pr=b.length>0?"{"+b.join(": ..., ")+": ...}":"{}";m(`A props object containing a "key" prop is being spread into JSX:
17
+ */var I;function X(){return I||(I=1,process.env.NODE_ENV!=="production"&&function(){function t(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===ne?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case j:return"Fragment";case B:return"Profiler";case J:return"StrictMode";case K:return"Suspense";case ee:return"SuspenseList";case te:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case A:return"Portal";case Z:return e.displayName||"Context";case H:return(e._context.displayName||"Context")+".Consumer";case Q:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case re:return r=e.displayName||null,r!==null?r:t(e.type)||"Memo";case O:r=e._payload,e=e._init;try{return t(e(r))}catch{}}return null}function s(e){return""+e}function d(e){try{s(e);var r=!1}catch{r=!0}if(r){r=console;var n=r.error,o=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return n.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",o),s(e)}}function l(e){if(e===j)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===O)return"<...>";try{var r=t(e);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function i(){var e=P.A;return e===null?null:e.getOwner()}function c(){return Error("react-stack-top-frame")}function m(e){if(L.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function b(e,r){function n(){D||(D=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}n.isReactWarning=!0,Object.defineProperty(e,"key",{get:n,configurable:!0})}function S(){var e=t(this.type);return M[e]||(M[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function k(e,r,n,o,x,N){var a=n.ref;return e={$$typeof:_,type:e,key:r,props:n,_owner:o},(a!==void 0?a:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:S}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:x}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:N}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function v(e,r,n,o,x,N){var a=r.children;if(a!==void 0)if(o)if(oe(a)){for(o=0;o<a.length;o++)g(a[o]);Object.freeze&&Object.freeze(a)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else g(a);if(L.call(r,"key")){a=t(e);var R=Object.keys(r).filter(function(ae){return ae!=="key"});o=0<R.length?"{key: someKey, "+R.join(": ..., ")+": ...}":"{key: someKey}",V[a+o]||(R=0<R.length?"{"+R.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
26
18
  let props = %s;
27
19
  <%s {...props} />
28
20
  React keys must be passed directly to JSX without using spread:
29
21
  let props = %s;
30
- <%s key={someKey} {...props} />`,re,F,pr,F),Oe[F+re]=!0}}return e===h?lr(f):sr(f),f}}function fr(e,r,t){return je(e,r,t,!0)}function cr(e,r,t){return je(e,r,t,!1)}var dr=cr,vr=fr;L.Fragment=h,L.jsx=dr,L.jsxs=vr}()),L}process.env.NODE_ENV==="production"?q.exports=Pe():q.exports=ke();var S=q.exports;function Ae(c){const d=c.tagName.toLowerCase();return!!(["img","svg","video","canvas","iframe","input","textarea","button"].includes(d)||!(Array.from(c.children).length>0))}function ae(c,d){const _=[],h=c.getBoundingClientRect();if(h.width===0||h.height===0)return _;if(Ae(c)){const O=window.getComputedStyle(c).borderRadius||"0px",T={x:h.left-d.left,y:h.top-d.top,width:h.width,height:h.height,tag:c.tagName.toLowerCase(),borderRadius:O};_.push(T)}else Array.from(c.children).forEach(x=>{_.push(...ae(x,d))});return _}const Fe=({children:c,loading:d=!0,shimmerColor:_="rgba(255, 255, 255, 0.15)",backgroundColor:h="rgba(255, 255, 255, 0.08)",duration:x=1.5,fallbackBorderRadius:O=4,templateProps:T})=>{const[C,v]=y.useState([]),j=y.useRef(null),p=y.useRef(null),E=y.useMemo(()=>{if(!d||!T)return c;const s=y.Children.toArray(c);if(s.length===0)return c;const w=s[0];return y.isValidElement(w)?[y.cloneElement(w,{...T}),...s.slice(1)]:c},[c,d,T]);return y.useLayoutEffect(()=>{if(!d||!p.current)return;const s=p.current,w=s.getBoundingClientRect(),D=[];Array.from(s.children).forEach(K=>{D.push(...ae(K,w))}),v(D)},[d,E]),d?S.jsxs("div",{style:{position:"relative"},children:[S.jsx("style",{children:`
22
+ <%s key={someKey} {...props} />`,o,a,R,a),V[a+o]=!0)}if(a=null,n!==void 0&&(d(n),a=""+n),m(r)&&(d(r.key),a=""+r.key),"key"in r){n={};for(var $ in r)$!=="key"&&(n[$]=r[$])}else n=r;return a&&b(n,typeof e=="function"?e.displayName||e.name||"Unknown":e),k(e,a,n,i(),x,N)}function g(e){u(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===O&&(e._payload.status==="fulfilled"?u(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function u(e){return typeof e=="object"&&e!==null&&e.$$typeof===_}var p=f,_=Symbol.for("react.transitional.element"),A=Symbol.for("react.portal"),j=Symbol.for("react.fragment"),J=Symbol.for("react.strict_mode"),B=Symbol.for("react.profiler"),H=Symbol.for("react.consumer"),Z=Symbol.for("react.context"),Q=Symbol.for("react.forward_ref"),K=Symbol.for("react.suspense"),ee=Symbol.for("react.suspense_list"),re=Symbol.for("react.memo"),O=Symbol.for("react.lazy"),te=Symbol.for("react.activity"),ne=Symbol.for("react.client.reference"),P=p.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,L=Object.prototype.hasOwnProperty,oe=Array.isArray,C=console.createTask?console.createTask:function(){return null};p={react_stack_bottom_frame:function(e){return e()}};var D,M={},W=p.react_stack_bottom_frame.bind(p,c)(),U=C(l(c)),V={};T.Fragment=j,T.jsx=function(e,r,n){var o=1e4>P.recentlyCreatedOwnerStacks++;return v(e,r,n,!1,o?Error("react-stack-top-frame"):W,o?C(l(e)):U)},T.jsxs=function(e,r,n){var o=1e4>P.recentlyCreatedOwnerStacks++;return v(e,r,n,!0,o?Error("react-stack-top-frame"):W,o?C(l(e)):U)}}()),T}process.env.NODE_ENV==="production"?w.exports=z():w.exports=X();var h=w.exports;function q(t){const s=t.tagName.toLowerCase();return!!(["img","svg","video","canvas","iframe","input","textarea","button"].includes(s)||!(Array.from(t.children).length>0))}function F(t,s){const d=[],l=t.getBoundingClientRect();if(l.width===0||l.height===0)return d;if(q(t)){const c=window.getComputedStyle(t).borderRadius||"0px",m={x:l.left-s.left,y:l.top-s.top,width:l.width,height:l.height,tag:t.tagName.toLowerCase(),borderRadius:c};d.push(m)}else Array.from(t.children).forEach(i=>{d.push(...F(i,s))});return d}const G=({children:t,loading:s=!0,shimmerColor:d="rgba(255, 255, 255, 0.15)",backgroundColor:l="rgba(255, 255, 255, 0.08)",duration:i=1.5,fallbackBorderRadius:c=4,templateProps:m})=>{const[b,S]=f.useState([]),k=f.useRef(null),v=f.useRef(null),g=f.useMemo(()=>{if(!s||!m)return t;const u=f.Children.toArray(t);if(u.length===0)return t;const p=u[0];return f.isValidElement(p)?[f.cloneElement(p,{...m}),...u.slice(1)]:t},[t,s,m]);return f.useLayoutEffect(()=>{if(!s||!v.current)return;const u=v.current,p=u.getBoundingClientRect(),_=[];Array.from(u.children).forEach(A=>{_.push(...F(A,p))}),S(_)},[s,g]),s?h.jsxs("div",{style:{position:"relative"},children:[h.jsx("style",{children:`
31
23
  .shimmer-measure-container * {
32
24
  color: transparent !important;
33
25
  border-color: transparent !important;
@@ -37,7 +29,7 @@ React keys must be passed directly to JSX without using spread:
37
29
  .shimmer-measure-container video {
38
30
  opacity: 0;
39
31
  }
40
- `}),S.jsx("div",{ref:p,className:"shimmer-measure-container",style:{pointerEvents:"none"},"aria-hidden":"true",children:E}),S.jsxs("div",{ref:j,style:{position:"absolute",top:0,left:0,right:0,bottom:0,overflow:"hidden"},children:[S.jsx("style",{children:`
32
+ `}),h.jsx("div",{ref:v,className:"shimmer-measure-container",style:{pointerEvents:"none"},"aria-hidden":"true",children:g}),h.jsxs("div",{ref:k,style:{position:"absolute",top:0,left:0,right:0,bottom:0,overflow:"hidden"},children:[h.jsx("style",{children:`
41
33
  @keyframes shimmer {
42
34
  0% {
43
35
  transform: translateX(-100%);
@@ -46,4 +38,4 @@ React keys must be passed directly to JSX without using spread:
46
38
  transform: translateX(100%);
47
39
  }
48
40
  }
49
- `}),C.map((s,w)=>S.jsx("div",{style:{position:"absolute",left:`${s.x}px`,top:`${s.y}px`,width:`${s.width}px`,height:`${s.height}px`,backgroundColor:h,borderRadius:s.borderRadius==="0px"?`${O}px`:s.borderRadius,overflow:"hidden"},children:S.jsx("div",{style:{position:"absolute",top:0,left:0,width:"100%",height:"100%",background:`linear-gradient(90deg, transparent, ${_}, transparent)`,animation:`shimmer ${x}s infinite`}})},w))]})]}):S.jsx(S.Fragment,{children:c})};k.Shimmer=Fe,Object.defineProperty(k,Symbol.toStringTag,{value:"Module"})});
41
+ `}),b.map((u,p)=>h.jsx("div",{style:{position:"absolute",left:`${u.x}px`,top:`${u.y}px`,width:`${u.width}px`,height:`${u.height}px`,backgroundColor:l,borderRadius:u.borderRadius==="0px"?`${c}px`:u.borderRadius,overflow:"hidden"},children:h.jsx("div",{style:{position:"absolute",top:0,left:0,width:"100%",height:"100%",background:`linear-gradient(90deg, transparent, ${d}, transparent)`,animation:`shimmer ${i}s infinite`}})},p))]})]}):h.jsx(h.Fragment,{children:t})};E.Shimmer=G,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "shimmer-from-structure",
3
- "version": "0.1.0",
3
+ "version": "0.2.0",
4
4
  "description": "A React shimmer/skeleton library that automatically adapts to your component's runtime structure",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",
@@ -22,27 +22,27 @@
22
22
  "placeholder",
23
23
  "runtime"
24
24
  ],
25
- "author": "",
25
+ "author": "Olebogeng Mbedzi",
26
26
  "license": "MIT",
27
27
  "peerDependencies": {
28
- "react": "^18.0.0",
29
- "react-dom": "^18.0.0"
28
+ "react": "^18.0.0 || ^19.0.0",
29
+ "react-dom": "^18.0.0 || ^19.0.0"
30
30
  },
31
31
  "devDependencies": {
32
32
  "@testing-library/jest-dom": "^6.9.1",
33
33
  "@testing-library/react": "^16.3.2",
34
34
  "@types/node": "^25.0.9",
35
- "@types/react": "^18.2.0",
36
- "@types/react-dom": "^18.2.0",
35
+ "@types/react": "^19.2.9",
36
+ "@types/react-dom": "^19.2.3",
37
37
  "@vitejs/plugin-react": "^4.2.1",
38
38
  "@vitest/ui": "^4.0.17",
39
39
  "jsdom": "^27.4.0",
40
- "react": "^18.2.0",
41
- "react-dom": "^18.2.0",
40
+ "react": "^19.2.3",
41
+ "react-dom": "^19.2.3",
42
+ "recharts": "^3.6.0",
42
43
  "typescript": "^5.3.0",
43
44
  "vite": "^5.0.0",
44
45
  "vite-plugin-dts": "^4.5.4",
45
- "vitest": "^4.0.17",
46
- "recharts": "^3.6.0"
46
+ "vitest": "^4.0.17"
47
47
  }
48
- }
48
+ }