@valbuild/react 0.90.0 → 0.91.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.
@@ -29,7 +29,7 @@ type RichTextNode = StegaOfRichTextSource<RichTextSourceNode<AllRichTextOptions>
29
29
  *
30
30
  * @example
31
31
  * const content = useVal(contentVal);
32
- * return <ValRichText>{content.myRichText}</ValRichText>
32
+ * return <ValRichText content={content.myRichText} />
33
33
  *
34
34
  * @example
35
35
  * const content = useVal(contentVal);
@@ -37,9 +37,9 @@ type RichTextNode = StegaOfRichTextSource<RichTextSourceNode<AllRichTextOptions>
37
37
  * <ValRichText
38
38
  * theme={{
39
39
  * h1: 'text-4xl font-bold',
40
- * }}>
41
- * {content.myRichText}
42
- * </ValRichText>
40
+ * }}
41
+ * content={content.myRichText}
42
+ * />
43
43
  * );
44
44
  *
45
45
  *
@@ -47,6 +47,7 @@ type RichTextNode = StegaOfRichTextSource<RichTextSourceNode<AllRichTextOptions>
47
47
  * const content = useVal(contentVal);
48
48
  * return (
49
49
  * <ValRichText
50
+ * content={content.myRichText}
50
51
  * theme={{
51
52
  * block: {
52
53
  * h1: 'text-4xl font-bold',
@@ -59,19 +60,22 @@ type RichTextNode = StegaOfRichTextSource<RichTextSourceNode<AllRichTextOptions>
59
60
  * if (node.tag === 'img') {
60
61
  * return <Image className={className} src={node.src} alt={node.alt || ""} width={node.metadata?.width} height={node.metadata?.height} />
61
62
  * }
62
- * }}>
63
- * {content.myRichText}
64
- * </ValRichText>
63
+ * }} />
65
64
  * );
66
65
  *
67
- * @param
68
66
  * @returns
69
67
  */
70
- export declare function ValRichText<O extends RichTextOptions>({ children, className, style, theme, transform, }: {
71
- children: RichText<O>;
68
+ export declare function ValRichText<O extends RichTextOptions>({ className, style, theme, transform, ...props }: {
72
69
  className?: string;
73
70
  style?: CSSProperties;
74
71
  theme?: ThemeOptions<O>;
75
72
  transform?: (node: RichTextNode, children: ReactNode | ReactNode[], className?: string) => JSX.Element | string | undefined;
76
- }): import("react/jsx-runtime").JSX.Element;
73
+ } & ({
74
+ /**
75
+ * When using `children` - use the `content` prop instead.
76
+ */
77
+ children: RichText<O>;
78
+ } | {
79
+ content: RichText<O>;
80
+ })): import("react/jsx-runtime").JSX.Element;
77
81
  export {};
@@ -160,7 +160,9 @@ export type StegaOfRichTextSource<T extends Source> = Json extends T ? Json : T
160
160
  /**
161
161
  * RichText is accessible by users (after conversion via useVal / fetchVal)
162
162
  **/
163
- export type RichText<O extends RichTextOptions> = StegaOfRichTextSource<RichTextSource<O>>;
163
+ export type RichText<O extends RichTextOptions> = StegaOfRichTextSource<RichTextSource<O>> & {
164
+ readonly __brand?: "RichText";
165
+ };
164
166
  export type StegaOfSource<T extends Source> = Json extends T ? Json : T extends RichTextSource<infer O> ? RichText<O> : T extends ImageSource ? Image : T extends FileSource<infer M> ? M extends FileMetadata ? File<M> : never : T extends SourceObject ? {
165
167
  [key in keyof T]: StegaOfSource<T[key]>;
166
168
  } : T extends SourceArray ? StegaOfSource<T[number]>[] : T extends RawString ? string : string extends T ? ValEncodedString : T extends JsonPrimitive ? T : never;
@@ -3,12 +3,35 @@ import React from 'react';
3
3
  import { jsx } from 'react/jsx-runtime';
4
4
  import '../../dist/unsupportedIterableToArray-0ac4ac41.browser.esm.js';
5
5
 
6
+ function _objectWithoutPropertiesLoose(r, e) {
7
+ if (null == r) return {};
8
+ var t = {};
9
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
10
+ if (-1 !== e.indexOf(n)) continue;
11
+ t[n] = r[n];
12
+ }
13
+ return t;
14
+ }
15
+
16
+ function _objectWithoutProperties(e, t) {
17
+ if (null == e) return {};
18
+ var o,
19
+ r,
20
+ i = _objectWithoutPropertiesLoose(e, t);
21
+ if (Object.getOwnPropertySymbols) {
22
+ var n = Object.getOwnPropertySymbols(e);
23
+ for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
24
+ }
25
+ return i;
26
+ }
27
+
28
+ var _excluded = ["className", "style", "theme", "transform"];
6
29
  /**
7
30
  * Render RichText using JSX
8
31
  *
9
32
  * @example
10
33
  * const content = useVal(contentVal);
11
- * return <ValRichText>{content.myRichText}</ValRichText>
34
+ * return <ValRichText content={content.myRichText} />
12
35
  *
13
36
  * @example
14
37
  * const content = useVal(contentVal);
@@ -16,9 +39,9 @@ import '../../dist/unsupportedIterableToArray-0ac4ac41.browser.esm.js';
16
39
  * <ValRichText
17
40
  * theme={{
18
41
  * h1: 'text-4xl font-bold',
19
- * }}>
20
- * {content.myRichText}
21
- * </ValRichText>
42
+ * }}
43
+ * content={content.myRichText}
44
+ * />
22
45
  * );
23
46
  *
24
47
  *
@@ -26,6 +49,7 @@ import '../../dist/unsupportedIterableToArray-0ac4ac41.browser.esm.js';
26
49
  * const content = useVal(contentVal);
27
50
  * return (
28
51
  * <ValRichText
52
+ * content={content.myRichText}
29
53
  * theme={{
30
54
  * block: {
31
55
  * h1: 'text-4xl font-bold',
@@ -38,21 +62,18 @@ import '../../dist/unsupportedIterableToArray-0ac4ac41.browser.esm.js';
38
62
  * if (node.tag === 'img') {
39
63
  * return <Image className={className} src={node.src} alt={node.alt || ""} width={node.metadata?.width} height={node.metadata?.height} />
40
64
  * }
41
- * }}>
42
- * {content.myRichText}
43
- * </ValRichText>
65
+ * }} />
44
66
  * );
45
67
  *
46
- * @param
47
68
  * @returns
48
69
  */
49
70
  function ValRichText(_ref) {
50
- var children = _ref.children,
51
- className = _ref.className,
71
+ var className = _ref.className,
52
72
  style = _ref.style,
53
73
  theme = _ref.theme,
54
- transform = _ref.transform;
55
- var root = children;
74
+ transform = _ref.transform,
75
+ props = _objectWithoutProperties(_ref, _excluded);
76
+ var root = "content" in props ? props.content : props.children;
56
77
  function build(child, key) {
57
78
  if (typeof child === "string") {
58
79
  var transformed = transform && transform(child, []);
@@ -11,12 +11,35 @@ function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e };
11
11
 
12
12
  var React__default = /*#__PURE__*/_interopDefault(React);
13
13
 
14
+ function _objectWithoutPropertiesLoose(r, e) {
15
+ if (null == r) return {};
16
+ var t = {};
17
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
18
+ if (-1 !== e.indexOf(n)) continue;
19
+ t[n] = r[n];
20
+ }
21
+ return t;
22
+ }
23
+
24
+ function _objectWithoutProperties(e, t) {
25
+ if (null == e) return {};
26
+ var o,
27
+ r,
28
+ i = _objectWithoutPropertiesLoose(e, t);
29
+ if (Object.getOwnPropertySymbols) {
30
+ var n = Object.getOwnPropertySymbols(e);
31
+ for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
32
+ }
33
+ return i;
34
+ }
35
+
36
+ var _excluded = ["className", "style", "theme", "transform"];
14
37
  /**
15
38
  * Render RichText using JSX
16
39
  *
17
40
  * @example
18
41
  * const content = useVal(contentVal);
19
- * return <ValRichText>{content.myRichText}</ValRichText>
42
+ * return <ValRichText content={content.myRichText} />
20
43
  *
21
44
  * @example
22
45
  * const content = useVal(contentVal);
@@ -24,9 +47,9 @@ var React__default = /*#__PURE__*/_interopDefault(React);
24
47
  * <ValRichText
25
48
  * theme={{
26
49
  * h1: 'text-4xl font-bold',
27
- * }}>
28
- * {content.myRichText}
29
- * </ValRichText>
50
+ * }}
51
+ * content={content.myRichText}
52
+ * />
30
53
  * );
31
54
  *
32
55
  *
@@ -34,6 +57,7 @@ var React__default = /*#__PURE__*/_interopDefault(React);
34
57
  * const content = useVal(contentVal);
35
58
  * return (
36
59
  * <ValRichText
60
+ * content={content.myRichText}
37
61
  * theme={{
38
62
  * block: {
39
63
  * h1: 'text-4xl font-bold',
@@ -46,21 +70,18 @@ var React__default = /*#__PURE__*/_interopDefault(React);
46
70
  * if (node.tag === 'img') {
47
71
  * return <Image className={className} src={node.src} alt={node.alt || ""} width={node.metadata?.width} height={node.metadata?.height} />
48
72
  * }
49
- * }}>
50
- * {content.myRichText}
51
- * </ValRichText>
73
+ * }} />
52
74
  * );
53
75
  *
54
- * @param
55
76
  * @returns
56
77
  */
57
78
  function ValRichText(_ref) {
58
- var children = _ref.children,
59
- className = _ref.className,
79
+ var className = _ref.className,
60
80
  style = _ref.style,
61
81
  theme = _ref.theme,
62
- transform = _ref.transform;
63
- var root = children;
82
+ transform = _ref.transform,
83
+ props = _objectWithoutProperties(_ref, _excluded);
84
+ var root = "content" in props ? props.content : props.children;
64
85
  function build(child, key) {
65
86
  if (typeof child === "string") {
66
87
  var transformed = transform && transform(child, []);
@@ -11,12 +11,35 @@ function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e };
11
11
 
12
12
  var React__default = /*#__PURE__*/_interopDefault(React);
13
13
 
14
+ function _objectWithoutPropertiesLoose(r, e) {
15
+ if (null == r) return {};
16
+ var t = {};
17
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
18
+ if (-1 !== e.indexOf(n)) continue;
19
+ t[n] = r[n];
20
+ }
21
+ return t;
22
+ }
23
+
24
+ function _objectWithoutProperties(e, t) {
25
+ if (null == e) return {};
26
+ var o,
27
+ r,
28
+ i = _objectWithoutPropertiesLoose(e, t);
29
+ if (Object.getOwnPropertySymbols) {
30
+ var n = Object.getOwnPropertySymbols(e);
31
+ for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
32
+ }
33
+ return i;
34
+ }
35
+
36
+ var _excluded = ["className", "style", "theme", "transform"];
14
37
  /**
15
38
  * Render RichText using JSX
16
39
  *
17
40
  * @example
18
41
  * const content = useVal(contentVal);
19
- * return <ValRichText>{content.myRichText}</ValRichText>
42
+ * return <ValRichText content={content.myRichText} />
20
43
  *
21
44
  * @example
22
45
  * const content = useVal(contentVal);
@@ -24,9 +47,9 @@ var React__default = /*#__PURE__*/_interopDefault(React);
24
47
  * <ValRichText
25
48
  * theme={{
26
49
  * h1: 'text-4xl font-bold',
27
- * }}>
28
- * {content.myRichText}
29
- * </ValRichText>
50
+ * }}
51
+ * content={content.myRichText}
52
+ * />
30
53
  * );
31
54
  *
32
55
  *
@@ -34,6 +57,7 @@ var React__default = /*#__PURE__*/_interopDefault(React);
34
57
  * const content = useVal(contentVal);
35
58
  * return (
36
59
  * <ValRichText
60
+ * content={content.myRichText}
37
61
  * theme={{
38
62
  * block: {
39
63
  * h1: 'text-4xl font-bold',
@@ -46,21 +70,18 @@ var React__default = /*#__PURE__*/_interopDefault(React);
46
70
  * if (node.tag === 'img') {
47
71
  * return <Image className={className} src={node.src} alt={node.alt || ""} width={node.metadata?.width} height={node.metadata?.height} />
48
72
  * }
49
- * }}>
50
- * {content.myRichText}
51
- * </ValRichText>
73
+ * }} />
52
74
  * );
53
75
  *
54
- * @param
55
76
  * @returns
56
77
  */
57
78
  function ValRichText(_ref) {
58
- var children = _ref.children,
59
- className = _ref.className,
79
+ var className = _ref.className,
60
80
  style = _ref.style,
61
81
  theme = _ref.theme,
62
- transform = _ref.transform;
63
- var root = children;
82
+ transform = _ref.transform,
83
+ props = _objectWithoutProperties(_ref, _excluded);
84
+ var root = "content" in props ? props.content : props.children;
64
85
  function build(child, key) {
65
86
  if (typeof child === "string") {
66
87
  var transformed = transform && transform(child, []);
@@ -3,12 +3,35 @@ import React from 'react';
3
3
  import { jsx } from 'react/jsx-runtime';
4
4
  import '../../dist/unsupportedIterableToArray-f57eb659.esm.js';
5
5
 
6
+ function _objectWithoutPropertiesLoose(r, e) {
7
+ if (null == r) return {};
8
+ var t = {};
9
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
10
+ if (-1 !== e.indexOf(n)) continue;
11
+ t[n] = r[n];
12
+ }
13
+ return t;
14
+ }
15
+
16
+ function _objectWithoutProperties(e, t) {
17
+ if (null == e) return {};
18
+ var o,
19
+ r,
20
+ i = _objectWithoutPropertiesLoose(e, t);
21
+ if (Object.getOwnPropertySymbols) {
22
+ var n = Object.getOwnPropertySymbols(e);
23
+ for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
24
+ }
25
+ return i;
26
+ }
27
+
28
+ var _excluded = ["className", "style", "theme", "transform"];
6
29
  /**
7
30
  * Render RichText using JSX
8
31
  *
9
32
  * @example
10
33
  * const content = useVal(contentVal);
11
- * return <ValRichText>{content.myRichText}</ValRichText>
34
+ * return <ValRichText content={content.myRichText} />
12
35
  *
13
36
  * @example
14
37
  * const content = useVal(contentVal);
@@ -16,9 +39,9 @@ import '../../dist/unsupportedIterableToArray-f57eb659.esm.js';
16
39
  * <ValRichText
17
40
  * theme={{
18
41
  * h1: 'text-4xl font-bold',
19
- * }}>
20
- * {content.myRichText}
21
- * </ValRichText>
42
+ * }}
43
+ * content={content.myRichText}
44
+ * />
22
45
  * );
23
46
  *
24
47
  *
@@ -26,6 +49,7 @@ import '../../dist/unsupportedIterableToArray-f57eb659.esm.js';
26
49
  * const content = useVal(contentVal);
27
50
  * return (
28
51
  * <ValRichText
52
+ * content={content.myRichText}
29
53
  * theme={{
30
54
  * block: {
31
55
  * h1: 'text-4xl font-bold',
@@ -38,21 +62,18 @@ import '../../dist/unsupportedIterableToArray-f57eb659.esm.js';
38
62
  * if (node.tag === 'img') {
39
63
  * return <Image className={className} src={node.src} alt={node.alt || ""} width={node.metadata?.width} height={node.metadata?.height} />
40
64
  * }
41
- * }}>
42
- * {content.myRichText}
43
- * </ValRichText>
65
+ * }} />
44
66
  * );
45
67
  *
46
- * @param
47
68
  * @returns
48
69
  */
49
70
  function ValRichText(_ref) {
50
- var children = _ref.children,
51
- className = _ref.className,
71
+ var className = _ref.className,
52
72
  style = _ref.style,
53
73
  theme = _ref.theme,
54
- transform = _ref.transform;
55
- var root = children;
74
+ transform = _ref.transform,
75
+ props = _objectWithoutProperties(_ref, _excluded);
76
+ var root = "content" in props ? props.content : props.children;
56
77
  function build(child, key) {
57
78
  if (typeof child === "string") {
58
79
  var transformed = transform && transform(child, []);
@@ -3,12 +3,35 @@ import React from 'react';
3
3
  import { jsx } from 'react/jsx-runtime';
4
4
  import '../../dist/unsupportedIterableToArray-10eaf95e.worker.esm.js';
5
5
 
6
+ function _objectWithoutPropertiesLoose(r, e) {
7
+ if (null == r) return {};
8
+ var t = {};
9
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
10
+ if (-1 !== e.indexOf(n)) continue;
11
+ t[n] = r[n];
12
+ }
13
+ return t;
14
+ }
15
+
16
+ function _objectWithoutProperties(e, t) {
17
+ if (null == e) return {};
18
+ var o,
19
+ r,
20
+ i = _objectWithoutPropertiesLoose(e, t);
21
+ if (Object.getOwnPropertySymbols) {
22
+ var n = Object.getOwnPropertySymbols(e);
23
+ for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
24
+ }
25
+ return i;
26
+ }
27
+
28
+ var _excluded = ["className", "style", "theme", "transform"];
6
29
  /**
7
30
  * Render RichText using JSX
8
31
  *
9
32
  * @example
10
33
  * const content = useVal(contentVal);
11
- * return <ValRichText>{content.myRichText}</ValRichText>
34
+ * return <ValRichText content={content.myRichText} />
12
35
  *
13
36
  * @example
14
37
  * const content = useVal(contentVal);
@@ -16,9 +39,9 @@ import '../../dist/unsupportedIterableToArray-10eaf95e.worker.esm.js';
16
39
  * <ValRichText
17
40
  * theme={{
18
41
  * h1: 'text-4xl font-bold',
19
- * }}>
20
- * {content.myRichText}
21
- * </ValRichText>
42
+ * }}
43
+ * content={content.myRichText}
44
+ * />
22
45
  * );
23
46
  *
24
47
  *
@@ -26,6 +49,7 @@ import '../../dist/unsupportedIterableToArray-10eaf95e.worker.esm.js';
26
49
  * const content = useVal(contentVal);
27
50
  * return (
28
51
  * <ValRichText
52
+ * content={content.myRichText}
29
53
  * theme={{
30
54
  * block: {
31
55
  * h1: 'text-4xl font-bold',
@@ -38,21 +62,18 @@ import '../../dist/unsupportedIterableToArray-10eaf95e.worker.esm.js';
38
62
  * if (node.tag === 'img') {
39
63
  * return <Image className={className} src={node.src} alt={node.alt || ""} width={node.metadata?.width} height={node.metadata?.height} />
40
64
  * }
41
- * }}>
42
- * {content.myRichText}
43
- * </ValRichText>
65
+ * }} />
44
66
  * );
45
67
  *
46
- * @param
47
68
  * @returns
48
69
  */
49
70
  function ValRichText(_ref) {
50
- var children = _ref.children,
51
- className = _ref.className,
71
+ var className = _ref.className,
52
72
  style = _ref.style,
53
73
  theme = _ref.theme,
54
- transform = _ref.transform;
55
- var root = children;
74
+ transform = _ref.transform,
75
+ props = _objectWithoutProperties(_ref, _excluded);
76
+ var root = "content" in props ? props.content : props.children;
56
77
  function build(child, key) {
57
78
  if (typeof child === "string") {
58
79
  var transformed = transform && transform(child, []);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@valbuild/react",
3
- "version": "0.90.0",
3
+ "version": "0.91.1",
4
4
  "private": false,
5
5
  "description": "Val - React internal helpers",
6
6
  "repository": {
@@ -13,9 +13,9 @@
13
13
  "test": "jest"
14
14
  },
15
15
  "dependencies": {
16
- "@valbuild/core": "~0.90.0",
17
- "@valbuild/shared": "~0.90.0",
18
- "@valbuild/ui": "~0.90.0",
16
+ "@valbuild/core": "~0.91.1",
17
+ "@valbuild/shared": "~0.91.1",
18
+ "@valbuild/ui": "~0.91.1",
19
19
  "@vercel/stega": "^0.1.0",
20
20
  "base64-arraybuffer": "^1.0.2"
21
21
  },