@uploadcare/react-uploader 0.4.0-alpha.0 → 0.4.0-alpha.1

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 (5) hide show
  1. package/dist/libs.css +1 -0
  2. package/dist/react-uploader.cjs +1 -239
  3. package/dist/react-uploader.js +141 -171
  4. package/package.json +1 -1
  5. package/dist/style.css +0 -3
package/dist/react-uploader.js CHANGED
@@ -1,217 +1,187 @@
1
- import React, { Suspense, useState, useEffect, useMemo } from "react";
2
- import * as LR from "@uploadcare/blocks";
3
- import { UploadCtxProvider, defineLocale } from "@uploadcare/blocks";
4
- const P = /* @__PURE__ */ new Set([
1
+ import l, { Suspense as F, useState as y, useEffect as B, useMemo as m } from "react";
2
+ import * as i from "@uploadcare/blocks";
3
+ import { UploadCtxProvider as q, defineLocale as z } from "@uploadcare/blocks";
4
+ const L = /* @__PURE__ */ new Set([
5
5
  "children",
6
6
  "ref",
7
7
  "style",
8
8
  "className"
9
- ]), w = (e = {}) => Object == null ? void 0 : Object.keys(e).reduce((r, s) => {
10
- var t, c;
11
- const o = e == null ? void 0 : e[s], n = `on${(c = (t = o == null ? void 0 : o.split("-")) == null ? void 0 : t.map((i) => i.charAt(0).toUpperCase() + i.slice(1))) == null ? void 0 : c.join("")}`;
12
- return r[n] = o, r;
13
- }, {}), m = /* @__PURE__ */ new WeakMap(), g = (e) => {
14
- let r = m.get(e);
15
- return r === void 0 && (r = /* @__PURE__ */ new Map(), m.set(e, r)), r;
16
- }, E = ({
9
+ ]), R = (e = {}) => Object == null ? void 0 : Object.keys(e).reduce((n, a) => {
10
+ var o, r;
11
+ const t = e == null ? void 0 : e[a], c = `on${(r = (o = t == null ? void 0 : t.split("-")) == null ? void 0 : o.map((s) => s.charAt(0).toUpperCase() + s.slice(1))) == null ? void 0 : r.join("")}`;
12
+ return n[c] = t, n;
13
+ }, {}), M = /* @__PURE__ */ new WeakMap(), k = (e) => {
14
+ let n = M.get(e);
15
+ return n === void 0 && (n = /* @__PURE__ */ new Map(), M.set(e, n)), n;
16
+ }, x = ({
17
17
  node: e,
18
- nameProp: r,
19
- valueProp: s,
18
+ nameProp: n,
19
+ valueProp: a,
20
20
  prevValueProp: o,
21
- event: n
21
+ event: r
22
22
  }) => {
23
- if (n !== void 0) {
24
- if (s !== o) {
25
- const t = g(e), c = t.has(n);
26
- let i = t.get(n);
27
- s !== void 0 ? c ? i.handleEvent = s : (i = { handleEvent: s }, t.set(n, i), e.addEventListener(
28
- n,
29
- (a) => i.handleEvent(a.detail)
30
- )) : c && (t.delete(n), e.removeEventListener(n, i));
23
+ if (r !== void 0) {
24
+ if (a !== o) {
25
+ const t = k(e), c = t.has(r);
26
+ let s = t.get(r);
27
+ a !== void 0 ? c ? s.handleEvent = a : (s = { handleEvent: a }, t.set(r, s), e.addEventListener(
28
+ r,
29
+ (d) => s.handleEvent(d.detail)
30
+ )) : c && (t.delete(r), e.removeEventListener(r, s));
31
31
  }
32
32
  return;
33
33
  }
34
- e[r] = s, s == null && r in HTMLElement.prototype && e.removeAttribute(r);
35
- }, M = (e, r, s) => {
36
- const o = {}, n = {};
34
+ e[n] = a, a == null && n in HTMLElement.prototype && e.removeAttribute(n);
35
+ }, O = (e, n, a) => {
36
+ const o = {}, r = {};
37
37
  return Object.entries(e).forEach(([t, c]) => {
38
- P.has(t) ? o[t === "className" ? "class" : t] = c : r.has(t) || t in s.prototype ? n[t] = c : o[t] = c;
39
- }), { reactProps: o, customElProps: n };
40
- }, b = ({
38
+ L.has(t) ? o[t === "className" ? "class" : t] = c : n.has(t) || t in a.prototype ? r[t] = c : o[t] = c;
39
+ }), { reactProps: o, customElProps: r };
40
+ }, f = ({
41
41
  react: e,
42
42
  // https://react.dev/warnings/invalid-hook-call-warning
43
- tag: r,
44
- elClass: s,
43
+ tag: n,
44
+ elClass: a,
45
45
  schemaEvents: o
46
46
  }) => {
47
- const n = w(o), t = new Set(Object.keys(n ?? {})), c = e.forwardRef(
48
- (i, a) => {
49
- const f = e.useRef(/* @__PURE__ */ new Map()), p = e.useRef(null), { reactProps: h, customElProps: d } = M(i, t, s);
47
+ const r = R(o), t = new Set(Object.keys(r ?? {})), c = e.forwardRef(
48
+ (s, d) => {
49
+ const E = e.useRef(/* @__PURE__ */ new Map()), g = e.useRef(null), { reactProps: I, customElProps: A } = O(s, t, a);
50
50
  return e.useLayoutEffect(() => {
51
- if (p.current === null)
51
+ if (g.current === null)
52
52
  return;
53
- const u = /* @__PURE__ */ new Map();
54
- for (const l in d)
55
- E({
56
- node: p.current,
57
- nameProp: l,
58
- valueProp: d[l],
59
- prevValueProp: f.current.get(l),
60
- event: n[l]
61
- }), f.current.delete(l), u.set(l, i[l]);
62
- for (const [l, v] of f.current)
63
- E({
64
- node: p.current,
65
- nameProp: l,
53
+ const p = /* @__PURE__ */ new Map();
54
+ for (const u in A)
55
+ x({
56
+ node: g.current,
57
+ nameProp: u,
58
+ valueProp: A[u],
59
+ prevValueProp: E.current.get(u),
60
+ event: r[u]
61
+ }), E.current.delete(u), p.set(u, s[u]);
62
+ for (const [u, b] of E.current)
63
+ x({
64
+ node: g.current,
65
+ nameProp: u,
66
66
  valueProp: void 0,
67
- prevValueProp: v,
68
- event: n[l]
67
+ prevValueProp: b,
68
+ event: r[u]
69
69
  });
70
- f.current = u;
71
- }), e.createElement(r ?? s.__tag, {
72
- ...h,
70
+ E.current = p;
71
+ }), e.createElement(n ?? a.__tag, {
72
+ ...I,
73
73
  ref: e.useCallback(
74
- (u) => {
75
- p.current = u, typeof a == "function" ? a(u) : a !== null && (a.current = u);
74
+ (p) => {
75
+ g.current = p, typeof d == "function" ? d(p) : d !== null && (d.current = p);
76
76
  },
77
- [a]
77
+ [d]
78
78
  )
79
79
  });
80
80
  }
81
81
  );
82
- return c.displayName = s.name, c;
83
- };
84
- const AdapterConfig = b({
85
- react: React,
82
+ return c.displayName = a.name, c;
83
+ }, v = f({
84
+ react: l,
86
85
  tag: "lr-config",
87
- elClass: LR.Config
88
- });
89
- const AdapterUploadCtxProvider = b({
90
- react: React,
86
+ elClass: i.Config
87
+ }), P = f({
88
+ react: l,
91
89
  tag: "lr-upload-ctx-provider",
92
- elClass: LR.UploadCtxProvider,
93
- schemaEvents: LR.UploadCtxProvider.EventType
94
- });
95
- const getCalcPropertyOfProps = (props) => {
96
- const eventHandlers = {};
97
- const config = {};
98
- Object.entries(props).forEach(([key, value]) => {
99
- if (key.startsWith("on")) {
100
- eventHandlers[key] = value;
101
- } else {
102
- config[key] = value;
103
- }
104
- });
105
- return {
106
- eventHandlers,
107
- config
90
+ elClass: i.UploadCtxProvider,
91
+ schemaEvents: i.UploadCtxProvider.EventType
92
+ }), C = (e) => {
93
+ const n = {}, a = {};
94
+ return Object.entries(e).forEach(([o, r]) => {
95
+ o.startsWith("on") ? n[o] = r : a[o] = r;
96
+ }), {
97
+ eventHandlers: n,
98
+ config: a
108
99
  };
100
+ }, T = "0.4.0-alpha.1", j = "React-Uploader", U = () => `${j}/${T}`, h = ({ condition: e, fallback: n, children: a, ...o }) => e ? /* @__PURE__ */ l.createElement(F, { fallback: n, ...o }, a) : /* @__PURE__ */ l.createElement(l.Fragment, null, n), w = () => {
101
+ const [e, n] = y(!1);
102
+ return B(() => {
103
+ typeof window < "u" && n(!0);
104
+ }, []), e;
109
105
  };
110
- const version = "0.4.0-alpha.0";
111
- const NAME_EXTENTION = "React-Uploader";
112
- const getUserAgentIntegration = () => {
113
- return `${NAME_EXTENTION}/${version}`;
114
- };
115
- const ConditionalSuspense = ({ condition, fallback, children, ...rest }) => {
116
- return condition ? /* @__PURE__ */ React.createElement(Suspense, { fallback, ...rest }, children) : /* @__PURE__ */ React.createElement(React.Fragment, null, fallback);
117
- };
118
- const useIsBrowser = () => {
119
- const [isBrowser, setIsBrowser] = useState(false);
120
- useEffect(() => {
121
- if (typeof window !== "undefined") {
122
- setIsBrowser(true);
123
- }
124
- }, []);
125
- return isBrowser;
126
- };
127
- LR.registerBlocks(LR);
128
- const AdapterFileUploaderRegular = b({
129
- react: React,
106
+ i.registerBlocks(i);
107
+ const N = f({
108
+ react: l,
130
109
  tag: "lr-file-uploader-regular",
131
- elClass: LR.FileUploaderRegular
132
- });
133
- const FileUploaderRegular = ({
134
- ctxName,
135
- className,
136
- classNameUploader,
137
- apiRef,
138
- ...props
110
+ elClass: i.FileUploaderRegular
111
+ }), X = ({
112
+ ctxName: e,
113
+ className: n,
114
+ classNameUploader: a,
115
+ apiRef: o,
116
+ ...r
139
117
  }) => {
140
- const CTX_NAME = useMemo(() => ctxName ?? LR.UID.generate(), [ctxName]);
141
- const { eventHandlers, config } = useMemo(
142
- () => getCalcPropertyOfProps(props),
143
- [props]
144
- );
145
- const isBrowser = useIsBrowser();
146
- return /* @__PURE__ */ React.createElement(ConditionalSuspense, { condition: isBrowser, fallback: /* @__PURE__ */ React.createElement("h1", null, "Loading ...") }, /* @__PURE__ */ React.createElement("div", { className }, /* @__PURE__ */ React.createElement(AdapterConfig, { userAgentIntegration: getUserAgentIntegration(), "ctx-name": CTX_NAME, ...config }), /* @__PURE__ */ React.createElement(
147
- AdapterUploadCtxProvider,
118
+ const t = m(() => e ?? i.UID.generate(), [e]), { eventHandlers: c, config: s } = m(
119
+ () => C(r),
120
+ [r]
121
+ ), d = w();
122
+ return /* @__PURE__ */ l.createElement(h, { condition: d, fallback: /* @__PURE__ */ l.createElement("h1", null, "Loading ...") }, /* @__PURE__ */ l.createElement("div", { className: n }, /* @__PURE__ */ l.createElement(v, { userAgentIntegration: U(), "ctx-name": t, ...s }), /* @__PURE__ */ l.createElement(
123
+ P,
148
124
  {
149
- ref: apiRef,
150
- "ctx-name": CTX_NAME,
151
- ...eventHandlers
125
+ ref: o,
126
+ "ctx-name": t,
127
+ ...c
152
128
  }
153
- ), /* @__PURE__ */ React.createElement(AdapterFileUploaderRegular, { class: classNameUploader, "ctx-name": CTX_NAME })));
129
+ ), /* @__PURE__ */ l.createElement(N, { class: a, "ctx-name": t })));
154
130
  };
155
- LR.registerBlocks(LR);
156
- const AdapterFileUploaderMinimal = b({
157
- react: React,
131
+ i.registerBlocks(i);
132
+ const _ = f({
133
+ react: l,
158
134
  tag: "lr-file-uploader-minimal",
159
- elClass: LR.FileUploaderMinimal
160
- });
161
- const FileUploaderMinimal = ({
162
- ctxName,
163
- className,
164
- classNameUploader,
165
- apiRef,
166
- ...props
135
+ elClass: i.FileUploaderMinimal
136
+ }), D = ({
137
+ ctxName: e,
138
+ className: n,
139
+ classNameUploader: a,
140
+ apiRef: o,
141
+ ...r
167
142
  }) => {
168
- const CTX_NAME = useMemo(() => ctxName ?? LR.UID.generate(), [ctxName]);
169
- const { eventHandlers, config } = useMemo(
170
- () => getCalcPropertyOfProps(props),
171
- [props]
172
- );
173
- const isBrowser = useIsBrowser();
174
- return /* @__PURE__ */ React.createElement(ConditionalSuspense, { condition: isBrowser, fallback: /* @__PURE__ */ React.createElement("h1", null, "Loading ...") }, /* @__PURE__ */ React.createElement("div", { className }, /* @__PURE__ */ React.createElement(AdapterConfig, { userAgentIntegration: getUserAgentIntegration(), "ctx-name": CTX_NAME, ...config }), /* @__PURE__ */ React.createElement(
175
- AdapterUploadCtxProvider,
143
+ const t = m(() => e ?? i.UID.generate(), [e]), { eventHandlers: c, config: s } = m(
144
+ () => C(r),
145
+ [r]
146
+ ), d = w();
147
+ return /* @__PURE__ */ l.createElement(h, { condition: d, fallback: /* @__PURE__ */ l.createElement("h1", null, "Loading ...") }, /* @__PURE__ */ l.createElement("div", { className: n }, /* @__PURE__ */ l.createElement(v, { userAgentIntegration: U(), "ctx-name": t, ...s }), /* @__PURE__ */ l.createElement(
148
+ P,
176
149
  {
177
- ref: apiRef,
178
- "ctx-name": CTX_NAME,
179
- ...eventHandlers
150
+ ref: o,
151
+ "ctx-name": t,
152
+ ...c
180
153
  }
181
- ), /* @__PURE__ */ React.createElement(AdapterFileUploaderMinimal, { class: classNameUploader, "ctx-name": CTX_NAME })));
154
+ ), /* @__PURE__ */ l.createElement(_, { class: a, "ctx-name": t })));
182
155
  };
183
- LR.registerBlocks(LR);
184
- const AdapterFileUploaderInline = b({
185
- react: React,
156
+ i.registerBlocks(i);
157
+ const H = f({
158
+ react: l,
186
159
  tag: "lr-file-uploader-inline",
187
- elClass: LR.FileUploaderMinimal
188
- });
189
- const FileUploaderInline = ({
190
- ctxName,
191
- className,
192
- classNameUploader,
193
- apiRef,
194
- ...props
160
+ elClass: i.FileUploaderMinimal
161
+ }), V = ({
162
+ ctxName: e,
163
+ className: n,
164
+ classNameUploader: a,
165
+ apiRef: o,
166
+ ...r
195
167
  }) => {
196
- const CTX_NAME = useMemo(() => ctxName ?? LR.UID.generate(), [ctxName]);
197
- const { eventHandlers, config } = useMemo(
198
- () => getCalcPropertyOfProps(props),
199
- [props]
200
- );
201
- const isBrowser = useIsBrowser();
202
- return /* @__PURE__ */ React.createElement(ConditionalSuspense, { condition: isBrowser, fallback: /* @__PURE__ */ React.createElement("h1", null, "Loading ...") }, /* @__PURE__ */ React.createElement("div", { className }, /* @__PURE__ */ React.createElement(AdapterConfig, { userAgentIntegration: getUserAgentIntegration(), "ctx-name": CTX_NAME, ...config }), /* @__PURE__ */ React.createElement(
203
- AdapterUploadCtxProvider,
168
+ const t = m(() => e ?? i.UID.generate(), [e]), { eventHandlers: c, config: s } = m(
169
+ () => C(r),
170
+ [r]
171
+ ), d = w();
172
+ return /* @__PURE__ */ l.createElement(h, { condition: d, fallback: /* @__PURE__ */ l.createElement("h1", null, "Loading ...") }, /* @__PURE__ */ l.createElement("div", { className: n }, /* @__PURE__ */ l.createElement(v, { userAgentIntegration: U(), "ctx-name": t, ...s }), /* @__PURE__ */ l.createElement(
173
+ P,
204
174
  {
205
- ref: apiRef,
206
- "ctx-name": CTX_NAME,
207
- ...eventHandlers
175
+ ref: o,
176
+ "ctx-name": t,
177
+ ...c
208
178
  }
209
- ), /* @__PURE__ */ React.createElement(AdapterFileUploaderInline, { class: classNameUploader, "ctx-name": CTX_NAME })));
179
+ ), /* @__PURE__ */ l.createElement(H, { class: a, "ctx-name": t })));
210
180
  };
211
181
  export {
212
- FileUploaderInline,
213
- FileUploaderMinimal,
214
- FileUploaderRegular,
215
- UploadCtxProvider,
216
- defineLocale
182
+ V as FileUploaderInline,
183
+ D as FileUploaderMinimal,
184
+ X as FileUploaderRegular,
185
+ q as UploadCtxProvider,
186
+ z as defineLocale
217
187
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@uploadcare/react-uploader",
3
3
  "description": "React component for file uploads using Uploadcare",
4
- "version": "0.4.0-alpha.0",
4
+ "version": "0.4.0-alpha.1",
5
5
  "private": false,
6
6
  "type": "module",
7
7
  "files": [