@madebywild/sanity-richtext-field 0.1.10 → 0.1.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +163 -163
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -7
- package/dist/index.d.ts +2 -7
- package/dist/index.js +162 -163
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/input.tsx +3 -3
- package/src/parts/styles/index.tsx +0 -6
- package/src/types.tsx +2 -5
package/dist/index.cjs
CHANGED
|
@@ -16,7 +16,168 @@ function _interopNamespaceCompat(e) {
|
|
|
16
16
|
}
|
|
17
17
|
}), n.default = e, Object.freeze(n);
|
|
18
18
|
}
|
|
19
|
-
var o__namespace = /* @__PURE__ */ _interopNamespaceCompat(o)
|
|
19
|
+
var o__namespace = /* @__PURE__ */ _interopNamespaceCompat(o);
|
|
20
|
+
const presets = {
|
|
21
|
+
basic: {
|
|
22
|
+
size: "sm",
|
|
23
|
+
initiallyActive: !0,
|
|
24
|
+
whitelist: ["em", "strong", "link"]
|
|
25
|
+
},
|
|
26
|
+
full: {
|
|
27
|
+
size: "lg",
|
|
28
|
+
initiallyActive: !1,
|
|
29
|
+
// Empty blacklist means "enable all".
|
|
30
|
+
blacklist: []
|
|
31
|
+
}
|
|
32
|
+
};
|
|
33
|
+
function handleListKind(entry, findNeedle) {
|
|
34
|
+
const list = entry.type?.options?.list;
|
|
35
|
+
if (!list) return entry;
|
|
36
|
+
const filteredList = list.filter((s) => findNeedle(s.value));
|
|
37
|
+
return {
|
|
38
|
+
...entry,
|
|
39
|
+
type: {
|
|
40
|
+
...entry.type,
|
|
41
|
+
options: {
|
|
42
|
+
...entry.type.options,
|
|
43
|
+
list: filteredList
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
}
|
|
48
|
+
function handleOfKind(entry, findNeedle) {
|
|
49
|
+
const list = entry.type?.of;
|
|
50
|
+
if (!list) return entry;
|
|
51
|
+
const filteredOf = list.filter((a) => findNeedle(a.name));
|
|
52
|
+
return {
|
|
53
|
+
...entry,
|
|
54
|
+
type: {
|
|
55
|
+
...entry.type,
|
|
56
|
+
of: filteredOf
|
|
57
|
+
}
|
|
58
|
+
};
|
|
59
|
+
}
|
|
60
|
+
const sizeToHeightMap = {
|
|
61
|
+
sm: "10rem",
|
|
62
|
+
lg: "50vh"
|
|
63
|
+
};
|
|
64
|
+
function RichtextInput({
|
|
65
|
+
richtextConfig,
|
|
66
|
+
...props
|
|
67
|
+
}) {
|
|
68
|
+
const schemaOptions = props.schemaType.options, presetOptions = schemaOptions?.preset ? presets[schemaOptions.preset] : {}, options = o__namespace.useMemo(() => {
|
|
69
|
+
const {
|
|
70
|
+
preset: _2,
|
|
71
|
+
...mainOptions
|
|
72
|
+
} = schemaOptions ?? {};
|
|
73
|
+
return tsDeepmerge.merge(presetOptions, mainOptions);
|
|
74
|
+
}, [schemaOptions, presetOptions]), initiallyActive = options?.initiallyActive ?? !1, height = options?.size ? sizeToHeightMap[options.size] : sizeToHeightMap.sm, whitelist = options?.whitelist, blacklist = options?.blacklist;
|
|
75
|
+
whitelist && blacklist && console.warn("Wild Sanity Rich Text Field: Both whitelist and blacklist are set. Whitelist will take precedence.");
|
|
76
|
+
const filterPartsBy = o__namespace.useCallback((parts2, findNeedle) => parts2?.filter((b) => {
|
|
77
|
+
const needle = findNeedle(b);
|
|
78
|
+
return needle ? whitelist ? whitelist.includes(needle) : blacklist ? !blacklist.includes(needle) : !1 : !0;
|
|
79
|
+
}), [whitelist, blacklist]), enabledParts = o__namespace.useMemo(() => {
|
|
80
|
+
const blocks2 = filterPartsBy(richtextConfig.blocks, (s) => s.name), spans2 = filterPartsBy(richtextConfig.spans, (s_0) => s_0.name), lists2 = filterPartsBy(richtextConfig.lists, (s_1) => s_1.value), annotations2 = filterPartsBy(richtextConfig.annotations, (s_2) => s_2.name), decorators2 = filterPartsBy(richtextConfig.decorators, (s_3) => s_3.value), styles2 = filterPartsBy(richtextConfig.styles, (s_4) => s_4.value), normalizedStyles = [{
|
|
81
|
+
value: "normal",
|
|
82
|
+
title: "Normal"
|
|
83
|
+
}, ...styles2];
|
|
84
|
+
return {
|
|
85
|
+
blocks: blocks2,
|
|
86
|
+
spans: spans2,
|
|
87
|
+
lists: lists2,
|
|
88
|
+
annotations: annotations2,
|
|
89
|
+
decorators: decorators2,
|
|
90
|
+
styles: normalizedStyles
|
|
91
|
+
};
|
|
92
|
+
}, [filterPartsBy]), reshapeSchemaTypes = o__namespace.useCallback((schema) => schema.name !== "block" ? schema : {
|
|
93
|
+
...schema,
|
|
94
|
+
fields: schema.fields?.map((f2) => {
|
|
95
|
+
const field = f2;
|
|
96
|
+
switch (field.name) {
|
|
97
|
+
// Headings, Normal, Quote, etc.
|
|
98
|
+
case "style":
|
|
99
|
+
return handleListKind(field, (__3) => enabledParts.styles.some((b_5) => b_5.value === __3));
|
|
100
|
+
// Ul, Ol, etc.
|
|
101
|
+
case "listItem":
|
|
102
|
+
return handleListKind(field, (__2) => enabledParts.lists.some((b_4) => b_4.value === __2));
|
|
103
|
+
// Links, Colors, etc.
|
|
104
|
+
case "markDefs":
|
|
105
|
+
return handleOfKind(field, (__1) => enabledParts.annotations.some((b_3) => b_3.name === __1));
|
|
106
|
+
// Text content.
|
|
107
|
+
case "children": {
|
|
108
|
+
const spans_0 = [...enabledParts.spans, {
|
|
109
|
+
name: "span"
|
|
110
|
+
}], filtered_0 = handleOfKind(field, (__0) => spans_0.some((b_0) => b_0.name === __0));
|
|
111
|
+
return {
|
|
112
|
+
...filtered_0,
|
|
113
|
+
type: {
|
|
114
|
+
...filtered_0.type,
|
|
115
|
+
// Inline markers within the text content.
|
|
116
|
+
of: filtered_0.type.of?.map((t) => {
|
|
117
|
+
if (t.name !== "span") return t;
|
|
118
|
+
const span = t, annotations_0 = span.annotations?.filter((a) => enabledParts.annotations.some((b_1) => b_1.name === a.name)), decorators_0 = span.decorators?.filter((d) => enabledParts.decorators.some((b_2) => b_2.value === d.value));
|
|
119
|
+
return {
|
|
120
|
+
...t,
|
|
121
|
+
annotations: annotations_0,
|
|
122
|
+
decorators: decorators_0
|
|
123
|
+
};
|
|
124
|
+
})
|
|
125
|
+
}
|
|
126
|
+
};
|
|
127
|
+
}
|
|
128
|
+
default:
|
|
129
|
+
return field;
|
|
130
|
+
}
|
|
131
|
+
})
|
|
132
|
+
}, [enabledParts]), patchedSchemaType = o__namespace.useMemo(() => {
|
|
133
|
+
const of = props.schemaType?.of;
|
|
134
|
+
if (!Array.isArray(of)) return props.schemaType;
|
|
135
|
+
try {
|
|
136
|
+
const filtered_1 = of.filter((s_5) => s_5.name === "block" || enabledParts.blocks.some((b_6) => b_6.name === s_5.name));
|
|
137
|
+
return {
|
|
138
|
+
...props.schemaType,
|
|
139
|
+
of: filtered_1.map((s_6) => reshapeSchemaTypes(s_6))
|
|
140
|
+
};
|
|
141
|
+
} catch (e) {
|
|
142
|
+
return console.error("Wild Sanity Rich Text Field: Error while reshaping schema types.", e), props.schemaType;
|
|
143
|
+
}
|
|
144
|
+
}, [props.schemaType, enabledParts.blocks, reshapeSchemaTypes]), enabledPartsCount = o__namespace.useMemo(() => Object.values(enabledParts).reduce((acc, curr) => acc + curr.length, 0), [enabledParts]);
|
|
145
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
146
|
+
/* @__PURE__ */ jsxRuntime.jsx("style", { children: `
|
|
147
|
+
[data-wild-richtext-field] [data-testid="pt-editor"][data-fullscreen="false"] {
|
|
148
|
+
height: var(--pt-editor-height, initial);
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
[data-wild-richtext-field] .pt-list-item [data-list-item="wild.richtext.list.bullet"] [data-list-prefix] > span::before,
|
|
152
|
+
[data-wild-richtext-field] .pt-list-item [data-list-item="wild.richtext.list.number"] [data-list-prefix] > span::before {
|
|
153
|
+
font-size: 1.0em;
|
|
154
|
+
display: inline-block;
|
|
155
|
+
padding-top: 2px;
|
|
156
|
+
color: inherit;
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
[data-wild-richtext-field] .pt-list-item [data-list-item="wild.richtext.list.bullet"] [data-list-prefix] > span::before {
|
|
160
|
+
content: "\u2022";
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
[data-wild-richtext-field] .pt-list-item [data-list-item="wild.richtext.list.number"] [data-list-prefix] > span::before {
|
|
164
|
+
content: counter(list-level-1) ". ";
|
|
165
|
+
}
|
|
166
|
+
` }),
|
|
167
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { "data-wild-richtext-field": !0, style: {
|
|
168
|
+
"--pt-editor-height": height
|
|
169
|
+
}, children: props.renderDefault({
|
|
170
|
+
...props,
|
|
171
|
+
initialActive: initiallyActive,
|
|
172
|
+
displayInlineChanges: !1,
|
|
173
|
+
// If the only enabled part is a style part, its the default "Normal" style. No need to show the toolbar.
|
|
174
|
+
hideToolbar: enabledPartsCount === 0 || enabledPartsCount === 1 && enabledParts.styles.length === 1,
|
|
175
|
+
// @ts-expect-error: schemaType.of is too narrow. The runtime type is valid.
|
|
176
|
+
schemaType: patchedSchemaType
|
|
177
|
+
}) })
|
|
178
|
+
] });
|
|
179
|
+
}
|
|
180
|
+
var __assign = function() {
|
|
20
181
|
return __assign = Object.assign || function(t) {
|
|
21
182
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
22
183
|
s = arguments[i];
|
|
@@ -1451,9 +1612,6 @@ const typeName = "wild.richtext", ColorText = dt.span`
|
|
|
1451
1612
|
}), spans = {
|
|
1452
1613
|
icon,
|
|
1453
1614
|
media
|
|
1454
|
-
}, normal = {
|
|
1455
|
-
title: "Normal",
|
|
1456
|
-
value: `${typeName}.style.normal`
|
|
1457
1615
|
}, h2 = {
|
|
1458
1616
|
title: "Heading 2",
|
|
1459
1617
|
value: `${typeName}.style.h2`,
|
|
@@ -1485,7 +1643,6 @@ const typeName = "wild.richtext", ColorText = dt.span`
|
|
|
1485
1643
|
lineHeight: "calc(29 / 21)"
|
|
1486
1644
|
}, children })
|
|
1487
1645
|
}, styles = {
|
|
1488
|
-
normal,
|
|
1489
1646
|
h2,
|
|
1490
1647
|
h3,
|
|
1491
1648
|
h4
|
|
@@ -1496,164 +1653,7 @@ const typeName = "wild.richtext", ColorText = dt.span`
|
|
|
1496
1653
|
lists,
|
|
1497
1654
|
spans,
|
|
1498
1655
|
styles
|
|
1499
|
-
},
|
|
1500
|
-
basic: {
|
|
1501
|
-
size: "sm",
|
|
1502
|
-
initiallyActive: !0,
|
|
1503
|
-
whitelist: ["em", "strong", "link"]
|
|
1504
|
-
},
|
|
1505
|
-
full: {
|
|
1506
|
-
size: "lg",
|
|
1507
|
-
initiallyActive: !1,
|
|
1508
|
-
// Empty blacklist means "enable all".
|
|
1509
|
-
blacklist: []
|
|
1510
|
-
}
|
|
1511
|
-
};
|
|
1512
|
-
function handleListKind(entry, findNeedle) {
|
|
1513
|
-
const list = entry.type?.options?.list;
|
|
1514
|
-
if (!list) return entry;
|
|
1515
|
-
const filteredList = list.filter((s) => findNeedle(s.value));
|
|
1516
|
-
return {
|
|
1517
|
-
...entry,
|
|
1518
|
-
type: {
|
|
1519
|
-
...entry.type,
|
|
1520
|
-
options: {
|
|
1521
|
-
...entry.type.options,
|
|
1522
|
-
list: filteredList
|
|
1523
|
-
}
|
|
1524
|
-
}
|
|
1525
|
-
};
|
|
1526
|
-
}
|
|
1527
|
-
function handleOfKind(entry, findNeedle) {
|
|
1528
|
-
const list = entry.type?.of;
|
|
1529
|
-
if (!list) return entry;
|
|
1530
|
-
const filteredOf = list.filter((a) => findNeedle(a.name));
|
|
1531
|
-
return {
|
|
1532
|
-
...entry,
|
|
1533
|
-
type: {
|
|
1534
|
-
...entry.type,
|
|
1535
|
-
of: filteredOf
|
|
1536
|
-
}
|
|
1537
|
-
};
|
|
1538
|
-
}
|
|
1539
|
-
const sizeToHeightMap = {
|
|
1540
|
-
sm: "10rem",
|
|
1541
|
-
lg: "50vh"
|
|
1542
|
-
};
|
|
1543
|
-
function RichtextInput({
|
|
1544
|
-
richtextConfig,
|
|
1545
|
-
...props
|
|
1546
|
-
}) {
|
|
1547
|
-
const schemaOptions = props.schemaType.options, presetOptions = schemaOptions?.preset ? presets[schemaOptions.preset] : {}, options = o__namespace.useMemo(() => {
|
|
1548
|
-
const {
|
|
1549
|
-
preset: _2,
|
|
1550
|
-
...mainOptions
|
|
1551
|
-
} = schemaOptions ?? {};
|
|
1552
|
-
return tsDeepmerge.merge(presetOptions, mainOptions);
|
|
1553
|
-
}, [schemaOptions, presetOptions]), initiallyActive = options?.initiallyActive ?? !1, height = options?.size ? sizeToHeightMap[options.size] : sizeToHeightMap.sm, whitelist = options?.whitelist, blacklist = options?.blacklist;
|
|
1554
|
-
whitelist && blacklist && console.warn("Wild Sanity Rich Text Field: Both whitelist and blacklist are set. Whitelist will take precedence.");
|
|
1555
|
-
const filterPartsBy = o__namespace.useCallback((parts2, findNeedle) => parts2?.filter((b) => {
|
|
1556
|
-
const needle = findNeedle(b);
|
|
1557
|
-
return needle ? whitelist ? whitelist.includes(needle) : blacklist ? !blacklist.includes(needle) : !1 : !0;
|
|
1558
|
-
}), [whitelist, blacklist]), enabledParts = o__namespace.useMemo(() => {
|
|
1559
|
-
const blocks2 = filterPartsBy(richtextConfig.blocks, (s) => s.name), spans2 = filterPartsBy(richtextConfig.spans, (s_0) => s_0.name), lists2 = filterPartsBy(richtextConfig.lists, (s_1) => s_1.value), annotations2 = filterPartsBy(richtextConfig.annotations, (s_2) => s_2.name), decorators2 = filterPartsBy(richtextConfig.decorators, (s_3) => s_3.value), styles2 = filterPartsBy(richtextConfig.styles, (s_4) => s_4.value), normalizedStyles = styles2.length === 0 ? [...styles2, parts.styles.normal] : styles2;
|
|
1560
|
-
return {
|
|
1561
|
-
blocks: blocks2,
|
|
1562
|
-
spans: spans2,
|
|
1563
|
-
lists: lists2,
|
|
1564
|
-
annotations: annotations2,
|
|
1565
|
-
decorators: decorators2,
|
|
1566
|
-
styles: normalizedStyles
|
|
1567
|
-
};
|
|
1568
|
-
}, [filterPartsBy]), reshapeSchemaTypes = o__namespace.useCallback((schema) => schema.name !== "block" ? schema : {
|
|
1569
|
-
...schema,
|
|
1570
|
-
fields: schema.fields?.map((f2) => {
|
|
1571
|
-
const field = f2;
|
|
1572
|
-
switch (field.name) {
|
|
1573
|
-
// Headings, Normal, Quote, etc.
|
|
1574
|
-
case "style":
|
|
1575
|
-
return handleListKind(field, (__3) => enabledParts.styles.some((b_5) => b_5.value === __3));
|
|
1576
|
-
// Ul, Ol, etc.
|
|
1577
|
-
case "listItem":
|
|
1578
|
-
return handleListKind(field, (__2) => enabledParts.lists.some((b_4) => b_4.value === __2));
|
|
1579
|
-
// Links, Colors, etc.
|
|
1580
|
-
case "markDefs":
|
|
1581
|
-
return handleOfKind(field, (__1) => enabledParts.annotations.some((b_3) => b_3.name === __1));
|
|
1582
|
-
// Text content.
|
|
1583
|
-
case "children": {
|
|
1584
|
-
const spans_0 = [...enabledParts.spans, {
|
|
1585
|
-
name: "span"
|
|
1586
|
-
}], filtered_0 = handleOfKind(field, (__0) => spans_0.some((b_0) => b_0.name === __0));
|
|
1587
|
-
return {
|
|
1588
|
-
...filtered_0,
|
|
1589
|
-
type: {
|
|
1590
|
-
...filtered_0.type,
|
|
1591
|
-
// Inline markers within the text content.
|
|
1592
|
-
of: filtered_0.type.of?.map((t) => {
|
|
1593
|
-
if (t.name !== "span") return t;
|
|
1594
|
-
const span = t, annotations_0 = span.annotations?.filter((a) => enabledParts.annotations.some((b_1) => b_1.name === a.name)), decorators_0 = span.decorators?.filter((d) => enabledParts.decorators.some((b_2) => b_2.value === d.value));
|
|
1595
|
-
return {
|
|
1596
|
-
...t,
|
|
1597
|
-
annotations: annotations_0,
|
|
1598
|
-
decorators: decorators_0
|
|
1599
|
-
};
|
|
1600
|
-
})
|
|
1601
|
-
}
|
|
1602
|
-
};
|
|
1603
|
-
}
|
|
1604
|
-
default:
|
|
1605
|
-
return field;
|
|
1606
|
-
}
|
|
1607
|
-
})
|
|
1608
|
-
}, [enabledParts]), patchedSchemaType = o__namespace.useMemo(() => {
|
|
1609
|
-
const of = props.schemaType?.of;
|
|
1610
|
-
if (!Array.isArray(of)) return props.schemaType;
|
|
1611
|
-
try {
|
|
1612
|
-
const filtered_1 = of.filter((s_5) => s_5.name === "block" || enabledParts.blocks.some((b_6) => b_6.name === s_5.name));
|
|
1613
|
-
return {
|
|
1614
|
-
...props.schemaType,
|
|
1615
|
-
of: filtered_1.map((s_6) => reshapeSchemaTypes(s_6))
|
|
1616
|
-
};
|
|
1617
|
-
} catch (e) {
|
|
1618
|
-
return console.error("Wild Sanity Rich Text Field: Error while reshaping schema types.", e), props.schemaType;
|
|
1619
|
-
}
|
|
1620
|
-
}, [props.schemaType, enabledParts.blocks, reshapeSchemaTypes]), enabledPartsCount = o__namespace.useMemo(() => Object.values(enabledParts).reduce((acc, curr) => acc + curr.length, 0), [enabledParts]);
|
|
1621
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1622
|
-
/* @__PURE__ */ jsxRuntime.jsx("style", { children: `
|
|
1623
|
-
[data-wild-richtext-field] [data-testid="pt-editor"][data-fullscreen="false"] {
|
|
1624
|
-
height: var(--pt-editor-height, initial);
|
|
1625
|
-
}
|
|
1626
|
-
|
|
1627
|
-
[data-wild-richtext-field] .pt-list-item [data-list-item="wild.richtext.list.bullet"] [data-list-prefix] > span::before,
|
|
1628
|
-
[data-wild-richtext-field] .pt-list-item [data-list-item="wild.richtext.list.number"] [data-list-prefix] > span::before {
|
|
1629
|
-
font-size: 1.0em;
|
|
1630
|
-
display: inline-block;
|
|
1631
|
-
padding-top: 2px;
|
|
1632
|
-
color: inherit;
|
|
1633
|
-
}
|
|
1634
|
-
|
|
1635
|
-
[data-wild-richtext-field] .pt-list-item [data-list-item="wild.richtext.list.bullet"] [data-list-prefix] > span::before {
|
|
1636
|
-
content: "\u2022";
|
|
1637
|
-
}
|
|
1638
|
-
|
|
1639
|
-
[data-wild-richtext-field] .pt-list-item [data-list-item="wild.richtext.list.number"] [data-list-prefix] > span::before {
|
|
1640
|
-
content: counter(list-level-1) ". ";
|
|
1641
|
-
}
|
|
1642
|
-
` }),
|
|
1643
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { "data-wild-richtext-field": !0, style: {
|
|
1644
|
-
"--pt-editor-height": height
|
|
1645
|
-
}, children: props.renderDefault({
|
|
1646
|
-
...props,
|
|
1647
|
-
initialActive: initiallyActive,
|
|
1648
|
-
displayInlineChanges: !1,
|
|
1649
|
-
// If the only enabled part is a style part, its the default "Normal" style. No need to show the toolbar.
|
|
1650
|
-
hideToolbar: enabledPartsCount === 0 || enabledPartsCount === 1 && enabledParts.styles.length === 1,
|
|
1651
|
-
// @ts-expect-error: schemaType.of is too narrow. The runtime type is valid.
|
|
1652
|
-
schemaType: patchedSchemaType
|
|
1653
|
-
}) })
|
|
1654
|
-
] });
|
|
1655
|
-
}
|
|
1656
|
-
const wildSanityRichtextFieldPlugin = sanity.definePlugin((config) => {
|
|
1656
|
+
}, wildSanityRichtextFieldPlugin = sanity.definePlugin((config) => {
|
|
1657
1657
|
const userSpans = config?.spans ?? [], userLists = config?.lists ?? [], userBlocks = config?.blocks ?? [], userStyles = config?.styles ?? [], userDecorators = config?.decorators ?? [], userAnnotations = config?.annotations ?? [], richtextConfig = {
|
|
1658
1658
|
blocks: [...userBlocks, ...Object.values(parts.blocks)],
|
|
1659
1659
|
spans: [...userSpans, ...Object.values(parts.spans)],
|