@tamagui/dom 3.0.0-beta.924.1 → 3.0.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.
- package/dist/cjs/tables/compatibility.cjs +100 -44
- package/dist/cjs/tables/compatibility.native.cjs +100 -44
- package/dist/cjs/tables/compatibility.native.js +100 -44
- package/dist/cjs/tables/compatibility.native.js.map +1 -1
- package/dist/cjs/tables/tags.cjs +0 -17
- package/dist/cjs/tables/tags.native.cjs +0 -17
- package/dist/cjs/tables/tags.native.js +0 -17
- package/dist/cjs/tables/tags.native.js.map +1 -1
- package/dist/esm/tables/compatibility.mjs +100 -44
- package/dist/esm/tables/compatibility.mjs.map +1 -1
- package/dist/esm/tables/compatibility.native.js +100 -44
- package/dist/esm/tables/compatibility.native.js.map +1 -1
- package/dist/esm/tables/tags.mjs +1 -17
- package/dist/esm/tables/tags.mjs.map +1 -1
- package/dist/esm/tables/tags.native.js +1 -17
- package/dist/esm/tables/tags.native.js.map +1 -1
- package/package.json +4 -3
- package/src/tables/compatibility.ts +111 -45
- package/src/tables/tags.ts +0 -11
- package/types/tables/compatibility.d.ts.map +1 -1
- package/types/tables/tags.d.ts +0 -18
- package/types/tables/tags.d.ts.map +2 -2
|
@@ -143,82 +143,54 @@ export const COMPATIBILITY: readonly CompatibilityRow[] = [
|
|
|
143
143
|
},
|
|
144
144
|
{
|
|
145
145
|
area: 'style',
|
|
146
|
-
subject: 'inline reset
|
|
146
|
+
subject: 'inline reset placement',
|
|
147
147
|
keys: [
|
|
148
|
-
// the
|
|
148
|
+
// the twelve tags RSD gives its inline reset on web
|
|
149
149
|
'web.a.textAlign',
|
|
150
150
|
'web.a.textDecoration',
|
|
151
|
-
'web.a.textDecorationLine',
|
|
152
151
|
'web.b.textAlign',
|
|
153
152
|
'web.b.textDecoration',
|
|
154
|
-
'web.b.textDecorationLine',
|
|
155
153
|
'web.bdi.textAlign',
|
|
156
154
|
'web.bdi.textDecoration',
|
|
157
|
-
'web.bdi.textDecorationLine',
|
|
158
155
|
'web.bdo.textAlign',
|
|
159
156
|
'web.bdo.textDecoration',
|
|
160
|
-
'web.bdo.textDecorationLine',
|
|
161
157
|
'web.code.textAlign',
|
|
162
158
|
'web.code.textDecoration',
|
|
163
|
-
'web.code.textDecorationLine',
|
|
164
159
|
'web.em.textAlign',
|
|
165
160
|
'web.em.textDecoration',
|
|
166
|
-
'web.em.textDecorationLine',
|
|
167
161
|
'web.i.textAlign',
|
|
168
162
|
'web.i.textDecoration',
|
|
169
|
-
'web.i.textDecorationLine',
|
|
170
163
|
'web.label.textAlign',
|
|
171
164
|
'web.label.textDecoration',
|
|
172
|
-
'web.label.textDecorationLine',
|
|
173
165
|
'web.mark.textAlign',
|
|
174
166
|
'web.mark.textDecoration',
|
|
175
|
-
'web.mark.textDecorationLine',
|
|
176
167
|
'web.span.textAlign',
|
|
177
168
|
'web.span.textDecoration',
|
|
178
|
-
'web.span.textDecorationLine',
|
|
179
169
|
'web.strong.textAlign',
|
|
180
170
|
'web.strong.textDecoration',
|
|
181
|
-
'web.strong.textDecorationLine',
|
|
182
171
|
'web.sub.textAlign',
|
|
183
172
|
'web.sub.textDecoration',
|
|
184
|
-
'web.sub.textDecorationLine',
|
|
185
173
|
'web.sup.textAlign',
|
|
186
174
|
'web.sup.textDecoration',
|
|
187
|
-
'web.sup.textDecorationLine',
|
|
188
175
|
],
|
|
189
|
-
rsd: 'resets inline elements with textDecoration: none and textAlign: inherit',
|
|
190
|
-
tamagui:
|
|
176
|
+
rsd: 'resets inline elements per tag with textDecoration: none and textAlign: inherit',
|
|
177
|
+
tamagui:
|
|
178
|
+
'resets text-decoration once in the :where() host reset and leaves textAlign alone',
|
|
191
179
|
reason:
|
|
192
|
-
'
|
|
180
|
+
'the host reset covers every inline tag at zero specificity, and textAlign already inherits, so declaring either per tag changes nothing',
|
|
193
181
|
},
|
|
194
182
|
{
|
|
195
183
|
area: 'style',
|
|
196
184
|
subject: 'element defaults RSD leaves to the browser on web',
|
|
197
185
|
keys: [
|
|
198
|
-
//
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
'web.br.textDecorationLine',
|
|
202
|
-
'web.del.margin',
|
|
203
|
-
'web.del.padding',
|
|
186
|
+
// del, ins, s and u keep only their semantic decoration; the margin and
|
|
187
|
+
// padding reset RSD never declared for br, del, ins, kbd, optgroup,
|
|
188
|
+
// option, s and u moved to the :where() host reset
|
|
204
189
|
'web.del.textDecorationLine',
|
|
205
|
-
'web.ins.margin',
|
|
206
|
-
'web.ins.padding',
|
|
207
190
|
'web.ins.textDecorationLine',
|
|
208
191
|
'web.kbd.fontFamily',
|
|
209
192
|
'web.kbd.fontSize',
|
|
210
|
-
'web.kbd.margin',
|
|
211
|
-
'web.kbd.padding',
|
|
212
|
-
'web.kbd.textDecorationLine',
|
|
213
|
-
'web.optgroup.margin',
|
|
214
|
-
'web.optgroup.padding',
|
|
215
|
-
'web.option.margin',
|
|
216
|
-
'web.option.padding',
|
|
217
|
-
'web.s.margin',
|
|
218
|
-
'web.s.padding',
|
|
219
193
|
'web.s.textDecorationLine',
|
|
220
|
-
'web.u.margin',
|
|
221
|
-
'web.u.padding',
|
|
222
194
|
'web.u.textDecorationLine',
|
|
223
195
|
// and the rest lean on the browser stylesheet for their one decoration
|
|
224
196
|
'web.b.fontWeight',
|
|
@@ -238,6 +210,106 @@ export const COMPATIBILITY: readonly CompatibilityRow[] = [
|
|
|
238
210
|
reason:
|
|
239
211
|
'one source has to render the same on web and native, which it cannot if half the defaults come from a browser stylesheet a css reset is free to remove',
|
|
240
212
|
},
|
|
213
|
+
{
|
|
214
|
+
area: 'style',
|
|
215
|
+
subject: 'browser-stylesheet undo lives in the :where() host reset',
|
|
216
|
+
keys: [
|
|
217
|
+
// margin and padding RSD declares per tag; the tables no longer repeat
|
|
218
|
+
// them because every host carries is_DOM and the generated
|
|
219
|
+
// `:where(.is_DOM)` rule resets them at zero specificity
|
|
220
|
+
'web.a.margin',
|
|
221
|
+
'web.a.padding',
|
|
222
|
+
'web.article.margin',
|
|
223
|
+
'web.article.padding',
|
|
224
|
+
'web.aside.margin',
|
|
225
|
+
'web.aside.padding',
|
|
226
|
+
'web.b.margin',
|
|
227
|
+
'web.b.padding',
|
|
228
|
+
'web.bdi.margin',
|
|
229
|
+
'web.bdi.padding',
|
|
230
|
+
'web.bdo.margin',
|
|
231
|
+
'web.bdo.padding',
|
|
232
|
+
'web.blockquote.margin',
|
|
233
|
+
'web.blockquote.padding',
|
|
234
|
+
'web.button.margin',
|
|
235
|
+
'web.button.padding',
|
|
236
|
+
'web.code.margin',
|
|
237
|
+
'web.code.padding',
|
|
238
|
+
'web.div.margin',
|
|
239
|
+
'web.div.padding',
|
|
240
|
+
'web.em.margin',
|
|
241
|
+
'web.em.padding',
|
|
242
|
+
'web.fieldset.margin',
|
|
243
|
+
'web.fieldset.padding',
|
|
244
|
+
'web.footer.margin',
|
|
245
|
+
'web.footer.padding',
|
|
246
|
+
'web.form.margin',
|
|
247
|
+
'web.form.padding',
|
|
248
|
+
'web.h1.margin',
|
|
249
|
+
'web.h1.padding',
|
|
250
|
+
'web.h2.margin',
|
|
251
|
+
'web.h2.padding',
|
|
252
|
+
'web.h3.margin',
|
|
253
|
+
'web.h3.padding',
|
|
254
|
+
'web.h4.margin',
|
|
255
|
+
'web.h4.padding',
|
|
256
|
+
'web.h5.margin',
|
|
257
|
+
'web.h5.padding',
|
|
258
|
+
'web.h6.margin',
|
|
259
|
+
'web.h6.padding',
|
|
260
|
+
'web.header.margin',
|
|
261
|
+
'web.header.padding',
|
|
262
|
+
'web.hr.margin',
|
|
263
|
+
'web.hr.padding',
|
|
264
|
+
'web.i.margin',
|
|
265
|
+
'web.i.padding',
|
|
266
|
+
'web.input.margin',
|
|
267
|
+
'web.input.padding',
|
|
268
|
+
'web.label.margin',
|
|
269
|
+
'web.label.padding',
|
|
270
|
+
'web.li.margin',
|
|
271
|
+
'web.li.padding',
|
|
272
|
+
'web.main.margin',
|
|
273
|
+
'web.main.padding',
|
|
274
|
+
'web.mark.margin',
|
|
275
|
+
'web.mark.padding',
|
|
276
|
+
'web.nav.margin',
|
|
277
|
+
'web.nav.padding',
|
|
278
|
+
'web.ol.margin',
|
|
279
|
+
'web.ol.padding',
|
|
280
|
+
'web.p.margin',
|
|
281
|
+
'web.p.padding',
|
|
282
|
+
'web.pre.margin',
|
|
283
|
+
'web.pre.padding',
|
|
284
|
+
'web.section.margin',
|
|
285
|
+
'web.section.padding',
|
|
286
|
+
'web.select.margin',
|
|
287
|
+
'web.select.padding',
|
|
288
|
+
'web.span.margin',
|
|
289
|
+
'web.span.padding',
|
|
290
|
+
'web.strong.margin',
|
|
291
|
+
'web.strong.padding',
|
|
292
|
+
'web.sub.margin',
|
|
293
|
+
'web.sub.padding',
|
|
294
|
+
'web.sup.margin',
|
|
295
|
+
'web.sup.padding',
|
|
296
|
+
'web.textarea.margin',
|
|
297
|
+
'web.textarea.padding',
|
|
298
|
+
'web.ul.margin',
|
|
299
|
+
'web.ul.padding',
|
|
300
|
+
// border-style RSD declares on the four inline-block controls; the
|
|
301
|
+
// generated per-display `:where(<tag>.is_DOM)` rule resets it the same way
|
|
302
|
+
'web.button.borderStyle',
|
|
303
|
+
'web.input.borderStyle',
|
|
304
|
+
'web.select.borderStyle',
|
|
305
|
+
'web.textarea.borderStyle',
|
|
306
|
+
],
|
|
307
|
+
rsd: 'declares the margin, padding and control border-style undo per tag',
|
|
308
|
+
tamagui:
|
|
309
|
+
'declares them once in the `:where(.is_DOM)` host reset generated from the tag display table',
|
|
310
|
+
reason:
|
|
311
|
+
'atomic per-tag defaults lose to page CSS while a zero-specificity host rule needs no repeating; the conformance comparison sees only the semantic table defaults, and the generated reset test pins the rules to the display table',
|
|
312
|
+
},
|
|
241
313
|
{
|
|
242
314
|
area: 'style',
|
|
243
315
|
subject: 'html.a default styles',
|
|
@@ -306,16 +378,10 @@ export const COMPATIBILITY: readonly CompatibilityRow[] = [
|
|
|
306
378
|
{
|
|
307
379
|
area: 'style',
|
|
308
380
|
subject: 'html.img sizing',
|
|
309
|
-
keys: [
|
|
310
|
-
'web.img.aspectRatio',
|
|
311
|
-
'web.img.objectFit',
|
|
312
|
-
'web.img.margin',
|
|
313
|
-
'web.img.padding',
|
|
314
|
-
'web.img.textDecorationLine',
|
|
315
|
-
],
|
|
381
|
+
keys: ['web.img.aspectRatio', 'web.img.objectFit'],
|
|
316
382
|
rsd: 'derives the aspect ratio from the width and height attributes with attr(), which only lands in recent chromium, and gives img no inline reset',
|
|
317
383
|
tamagui:
|
|
318
|
-
'sets objectFit,
|
|
384
|
+
'sets objectFit, leaves the inline reset to the :where() host reset like any other inline element, and lets the compiler turn the width and height props into an aspect ratio on native',
|
|
319
385
|
reason:
|
|
320
386
|
'a css feature one engine supports cannot be the cross-platform contract, and the props are known at build time anyway; the inline reset still matters because an img inside an anchor otherwise inherits its underline',
|
|
321
387
|
},
|
package/src/tables/tags.ts
CHANGED
|
@@ -13,17 +13,6 @@ import type { DefaultStyle, TagName, TagRow } from './types'
|
|
|
13
13
|
* web and nothing on native. Differences from RSD are in `compatibility.ts`.
|
|
14
14
|
*/
|
|
15
15
|
|
|
16
|
-
/**
|
|
17
|
-
* Undoes the browser default stylesheet, keyed by `display`, before any tag
|
|
18
|
-
* default. Web only: react native has no default stylesheet to undo, so every
|
|
19
|
-
* key here would be a no-op that still costs a style lookup per element.
|
|
20
|
-
*/
|
|
21
|
-
export const DISPLAY_WEB_RESET: Readonly<Record<TagRow['display'], DefaultStyle>> = {
|
|
22
|
-
block: { margin: 0, padding: 0 },
|
|
23
|
-
inline: { margin: 0, padding: 0, textDecorationLine: 'none' },
|
|
24
|
-
'inline-block': { margin: 0, padding: 0, borderStyle: 'solid' },
|
|
25
|
-
}
|
|
26
|
-
|
|
27
16
|
const MONOSPACE: DefaultStyle = { fontFamily: 'monospace' }
|
|
28
17
|
const HEADING: DefaultStyle = { fontSize: '1.5rem', fontWeight: 'bold' }
|
|
29
18
|
|
|
@@ -6,6 +6,6 @@
|
|
|
6
6
|
],
|
|
7
7
|
"version": 3,
|
|
8
8
|
"sourcesContent": [
|
|
9
|
-
"import type { CompatibilityRow } from './types'\n\n/**\n * Every deliberate difference between the Tamagui DOM contract and the pinned\n * React Strict DOM release.\n *\n * The conformance test walks the RSD snapshot against the tables and requires\n * the keys claimed here to be exactly the differences it finds: an unclaimed\n * difference and a claim that is no longer a difference both fail. So this file\n * cannot drift in either direction, and refreshing the pin\n * (`bun scripts/extract-rsd-snapshot.ts`) surfaces whatever changed as a test\n * failure naming the exact key. Every key is spelled out for the same reason\n * — a pattern would quietly absorb the next element that starts differing.\n *\n * Style keys are `<platform>.<tag>.<property>`. Prop and event keys are the\n * prop name. A key belongs to exactly one row.\n */\n\n/**\n * The pinned reference. The conformance test asserts this matches the snapshot,\n * so refreshing the pin without updating this line fails.\n */\nexport const RSD_REFERENCE: Readonly<{\n version: string\n commit: string\n date: string\n}> = {\n version: '0.0.55',\n commit: 'c877f5c19b141e25c089d993b4cc584e669b6e39',\n date: '2026-06-23',\n}\n\nexport const COMPATIBILITY: readonly CompatibilityRow[] = [\n {\n area: 'tag',\n subject: 'html.select, html.option, html.optgroup',\n keys: [],\n rsd: 'renders a view and text elements on native with no menu behaviour, and documents the tags as unsupported there',\n tamagui: 'native build error naming the tag',\n reason:\n 'an element that renders but cannot open, select or report a value is a silent approximation, which the DOM contract rules out',\n },\n {\n area: 'tag',\n subject: 'html.form, html.fieldset',\n keys: [],\n rsd: 'documents form as unsupported on native',\n tamagui: 'renders as a native container, with no submission, validation or reset',\n reason:\n 'the layout and accessibility of the container are correct on native; only submission is missing, and that is documented per prop',\n },\n {\n area: 'prop',\n subject: 'autoCapitalize, enterKeyHint, inputMode, spellCheck',\n keys: ['autoCapitalize', 'enterKeyHint', 'inputMode', 'spellCheck'],\n rsd: 'declared on every element, forwarded only by the text-entry factory',\n tamagui: 'declared on input and textarea only',\n reason:\n 'they have no effect anywhere else on either platform, so the narrower type is the honest one',\n },\n {\n area: 'prop',\n subject: 'spellCheck on native',\n keys: [],\n rsd: 'documented as unsupported',\n tamagui: 'forwarded to the text-entry control, ios only',\n reason:\n 'react native implements spellCheck on TextInput for ios; the RSD table predates it and its own runtime forwards the prop',\n },\n {\n area: 'prop',\n subject: 'aria-describedby',\n keys: [],\n rsd: 'documented as polyfilled on native, but its runtime does not map it',\n tamagui: 'web only, with a note pointing at aria-label',\n reason:\n 'react native has no described-by relationship, so the table follows the runtime rather than the documentation',\n },\n {\n area: 'prop',\n subject: 'data-*',\n keys: ['data-*'],\n rsd: 'allows any data- prefixed prop at runtime but types none of them',\n tamagui: 'one data-* row, so the generated interfaces admit the whole prefix',\n reason:\n 'the runtime already accepts them; leaving them untyped only means authors reach for a cast',\n },\n {\n area: 'prop',\n subject: 'data-layoutconformance',\n keys: ['data-layoutconformance'],\n rsd: 'opts an element subtree into W3C layout conformance on native',\n tamagui: 'not part of the contract',\n reason:\n 'it is an escape hatch for a specific react native migration, not a DOM prop, and DOM mode targets one layout model',\n },\n {\n area: 'prop',\n subject: 'selected on html.option',\n keys: ['selected'],\n rsd: 'allowlisted, but not declared by its option props type',\n tamagui: 'not part of the contract',\n reason:\n 'react warns on it and steers to value or defaultValue on the select, and select has no native rendering anyway',\n },\n {\n area: 'prop',\n subject: 'children on a void or text-only element',\n keys: [],\n rsd: 'types children as a react node on every element, including br, hr, img, input, textarea and option',\n tamagui:\n 'types it as never on the five void elements and as string or number inside an option, from the content model in the tag table',\n reason:\n 'the compiler already reports this nesting as a build error, and the same rule stated in the types reports it in the editor instead of at build time',\n },\n {\n area: 'event',\n subject: 'onSelectionChange',\n keys: ['onSelectionChange'],\n rsd: 'allowlisted and typed on input and textarea, then warned about as unsupported',\n tamagui:\n 'not part of the contract; the selection cache behind the ref polyfill stays internal',\n reason:\n 'it is not a React DOM prop, so it does nothing on web and warns on native: no platform supports it',\n },\n {\n area: 'event',\n subject: 'onMouseMove',\n keys: [],\n rsd: 'allowed on the strict surface but omitted from the native prop forwarding path',\n tamagui: 'native diagnostic pointing at onPointerMove',\n reason:\n 'a handler that is silently dropped is worse than a build error naming the supported cross-platform spelling; the other mouse events and onScroll match the upstream native host passthrough',\n },\n {\n area: 'event',\n subject: 'onClick on native',\n keys: [],\n rsd: 'documented as unsupported, polyfilled in its runtime through the press event',\n tamagui: 'polyfilled through the press event, documented as a polyfill',\n reason:\n 'the polyfill is real and useful; the payload subset it can fill in is documented instead of denied',\n },\n {\n area: 'style',\n subject: 'inline reset spelling',\n keys: [\n // the thirteen tags RSD gives its inline reset on web\n 'web.a.textAlign',\n 'web.a.textDecoration',\n 'web.a.textDecorationLine',\n 'web.b.textAlign',\n 'web.b.textDecoration',\n 'web.b.textDecorationLine',\n 'web.bdi.textAlign',\n 'web.bdi.textDecoration',\n 'web.bdi.textDecorationLine',\n 'web.bdo.textAlign',\n 'web.bdo.textDecoration',\n 'web.bdo.textDecorationLine',\n 'web.code.textAlign',\n 'web.code.textDecoration',\n 'web.code.textDecorationLine',\n 'web.em.textAlign',\n 'web.em.textDecoration',\n 'web.em.textDecorationLine',\n 'web.i.textAlign',\n 'web.i.textDecoration',\n 'web.i.textDecorationLine',\n 'web.label.textAlign',\n 'web.label.textDecoration',\n 'web.label.textDecorationLine',\n 'web.mark.textAlign',\n 'web.mark.textDecoration',\n 'web.mark.textDecorationLine',\n 'web.span.textAlign',\n 'web.span.textDecoration',\n 'web.span.textDecorationLine',\n 'web.strong.textAlign',\n 'web.strong.textDecoration',\n 'web.strong.textDecorationLine',\n 'web.sub.textAlign',\n 'web.sub.textDecoration',\n 'web.sub.textDecorationLine',\n 'web.sup.textAlign',\n 'web.sup.textDecoration',\n 'web.sup.textDecorationLine',\n ],\n rsd: 'resets inline elements with textDecoration: none and textAlign: inherit',\n tamagui: 'resets with textDecorationLine: none and leaves textAlign alone',\n reason:\n 'textDecorationLine is the one spelling that means the same thing on both platforms, and textAlign already inherits, so declaring it changes nothing',\n },\n {\n area: 'style',\n subject: 'element defaults RSD leaves to the browser on web',\n keys: [\n // br, del, ins, kbd, optgroup, option, s and u get no RSD web styles at all\n 'web.br.margin',\n 'web.br.padding',\n 'web.br.textDecorationLine',\n 'web.del.margin',\n 'web.del.padding',\n 'web.del.textDecorationLine',\n 'web.ins.margin',\n 'web.ins.padding',\n 'web.ins.textDecorationLine',\n 'web.kbd.fontFamily',\n 'web.kbd.fontSize',\n 'web.kbd.margin',\n 'web.kbd.padding',\n 'web.kbd.textDecorationLine',\n 'web.optgroup.margin',\n 'web.optgroup.padding',\n 'web.option.margin',\n 'web.option.padding',\n 'web.s.margin',\n 'web.s.padding',\n 'web.s.textDecorationLine',\n 'web.u.margin',\n 'web.u.padding',\n 'web.u.textDecorationLine',\n // and the rest lean on the browser stylesheet for their one decoration\n 'web.b.fontWeight',\n 'web.em.fontStyle',\n 'web.h1.fontWeight',\n 'web.h2.fontWeight',\n 'web.h3.fontWeight',\n 'web.h4.fontWeight',\n 'web.h5.fontWeight',\n 'web.h6.fontWeight',\n 'web.i.fontStyle',\n 'web.mark.backgroundColor',\n 'web.mark.color',\n ],\n rsd: 'applies no default styles at all to br, del, ins, kbd, optgroup, option, s and u on web, and relies on the browser stylesheet for the bold, italic, monospace, strike, underline and highlight of every other tag',\n tamagui: 'applies the same element defaults on both platforms',\n reason:\n 'one source has to render the same on web and native, which it cannot if half the defaults come from a browser stylesheet a css reset is free to remove',\n },\n {\n area: 'style',\n subject: 'html.a default styles',\n keys: ['native.a.color', 'native.a.textDecorationLine'],\n rsd: 'strips the underline on web and adds blue plus underline on native, so one source renders differently per platform',\n tamagui: 'applies the same inline reset on both platforms and adds no link colour',\n reason:\n 'cross-platform parity is the point of the shared fixture, and a hardcoded link colour cannot follow a theme',\n },\n {\n area: 'style',\n subject: 'monospace font family',\n keys: [\n 'web.code.fontFamily',\n 'web.pre.fontFamily',\n 'native.code.fontFamily',\n 'native.kbd.fontFamily',\n 'native.pre.fontFamily',\n ],\n rsd: 'writes monospace, \"monospace\" on web to cancel the browser size quirk, and picks Menlo on ios',\n tamagui:\n 'writes monospace on both platforms and cancels the size quirk with fontSize: 1em instead',\n reason:\n 'the duplicated family name only exists to defeat the size quirk, which 1em does directly; the font family itself belongs to the theme, not to the tag',\n },\n {\n area: 'style',\n subject: 'overflow on html.code',\n keys: ['web.code.overflow'],\n rsd: 'shares one rule between code and pre, so inline code gets overflow: auto too',\n tamagui: 'scrolls pre only',\n reason: 'overflow does nothing on an inline element',\n },\n {\n area: 'style',\n subject: 'web css properties a Tamagui style prop cannot express',\n keys: [\n 'web.a.wordWrap',\n 'web.b.wordWrap',\n 'web.bdi.wordWrap',\n 'web.bdo.wordWrap',\n 'web.code.wordWrap',\n 'web.em.wordWrap',\n 'web.h1.wordWrap',\n 'web.h2.wordWrap',\n 'web.h3.wordWrap',\n 'web.h4.wordWrap',\n 'web.h5.wordWrap',\n 'web.h6.wordWrap',\n 'web.i.wordWrap',\n 'web.label.wordWrap',\n 'web.mark.wordWrap',\n 'web.span.wordWrap',\n 'web.strong.wordWrap',\n 'web.sub.wordWrap',\n 'web.sup.wordWrap',\n 'web.ol.listStyle',\n 'web.ul.listStyle',\n 'web.textarea.resize',\n ],\n rsd: 'sets overflow-wrap on inline text and headings, list-style: none on ol and ul, and resize: vertical on a textarea, all as plain stylex rules',\n tamagui: 'sets none of the three',\n reason:\n 'Tamagui resolves none of these three property names, and an unresolved style prop does not quietly do nothing — it reaches the element as an attribute, which is a react warning and still no styling. list-style has no visible consequence anyway, because every view-backed element carries `.is_View { display: flex }`, so an li is never display: list-item and no marker is generated. The other two are cosmetic and web-only. Closing this means teaching the style pipeline the three properties, not working around it here',\n },\n {\n area: 'style',\n subject: 'html.img sizing',\n keys: [\n 'web.img.aspectRatio',\n 'web.img.objectFit',\n 'web.img.margin',\n 'web.img.padding',\n 'web.img.textDecorationLine',\n ],\n rsd: 'derives the aspect ratio from the width and height attributes with attr(), which only lands in recent chromium, and gives img no inline reset',\n tamagui:\n 'sets objectFit, resets img like any other inline element, and lets the compiler turn the width and height props into an aspect ratio on native',\n reason:\n 'a css feature one engine supports cannot be the cross-platform contract, and the props are known at build time anyway; the inline reset still matters because an img inside an anchor otherwise inherits its underline',\n },\n {\n area: 'style',\n subject: 'universal native element defaults',\n keys: ['native.br.boxSizing', 'native.br.position', 'native.hr.boxSizing'],\n rsd: 'skips the shared native reset on br, and overrides boxSizing to border-box on hr',\n tamagui: 'applies the same native element defaults to every tag',\n reason:\n 'br is not special, and neither override changes what renders: hr has no border or padding for border-box to measure differently',\n },\n {\n area: 'behavior',\n subject: 'invalid nesting',\n keys: [],\n rsd: 'reports nothing at build time; an invalid tree fails at runtime on native',\n tamagui:\n 'compile diagnostic for statically knowable invalid nesting, from the content model in the tag table',\n reason:\n 'the compiler already classifies every tag, so the error belongs at build time where the source is',\n },\n {\n area: 'behavior',\n subject: 'children as a render function',\n keys: [],\n rsd: 'supports a function child that receives the resolved native props',\n tamagui: 'not part of the contract',\n reason:\n 'it exposes the native prop shape as public api and blocks compile-time literal-text wrapping',\n },\n {\n area: 'ref',\n subject: 'native element ref',\n keys: [],\n rsd: 'wraps every ref-ed host node in an Object.create view adding nodeName, viewport-scaled metrics and the tag polyfills',\n tamagui:\n 'wraps only ref-ed hosts in a stable Object.create facade adding nodeName, tagName, image complete, text-entry selection APIs, bound host methods and viewport-scaled geometry',\n reason:\n 'the compiler supplies the semantic tag only on the ref path, preserving the zero-allocation common path; the viewport provider scales synchronous DOM-shaped lengths and getBoundingClientRect while native measure methods remain bound to the host instance',\n },\n]\n"
|
|
9
|
+
"import type { CompatibilityRow } from './types'\n\n/**\n * Every deliberate difference between the Tamagui DOM contract and the pinned\n * React Strict DOM release.\n *\n * The conformance test walks the RSD snapshot against the tables and requires\n * the keys claimed here to be exactly the differences it finds: an unclaimed\n * difference and a claim that is no longer a difference both fail. So this file\n * cannot drift in either direction, and refreshing the pin\n * (`bun scripts/extract-rsd-snapshot.ts`) surfaces whatever changed as a test\n * failure naming the exact key. Every key is spelled out for the same reason\n * — a pattern would quietly absorb the next element that starts differing.\n *\n * Style keys are `<platform>.<tag>.<property>`. Prop and event keys are the\n * prop name. A key belongs to exactly one row.\n */\n\n/**\n * The pinned reference. The conformance test asserts this matches the snapshot,\n * so refreshing the pin without updating this line fails.\n */\nexport const RSD_REFERENCE: Readonly<{\n version: string\n commit: string\n date: string\n}> = {\n version: '0.0.55',\n commit: 'c877f5c19b141e25c089d993b4cc584e669b6e39',\n date: '2026-06-23',\n}\n\nexport const COMPATIBILITY: readonly CompatibilityRow[] = [\n {\n area: 'tag',\n subject: 'html.select, html.option, html.optgroup',\n keys: [],\n rsd: 'renders a view and text elements on native with no menu behaviour, and documents the tags as unsupported there',\n tamagui: 'native build error naming the tag',\n reason:\n 'an element that renders but cannot open, select or report a value is a silent approximation, which the DOM contract rules out',\n },\n {\n area: 'tag',\n subject: 'html.form, html.fieldset',\n keys: [],\n rsd: 'documents form as unsupported on native',\n tamagui: 'renders as a native container, with no submission, validation or reset',\n reason:\n 'the layout and accessibility of the container are correct on native; only submission is missing, and that is documented per prop',\n },\n {\n area: 'prop',\n subject: 'autoCapitalize, enterKeyHint, inputMode, spellCheck',\n keys: ['autoCapitalize', 'enterKeyHint', 'inputMode', 'spellCheck'],\n rsd: 'declared on every element, forwarded only by the text-entry factory',\n tamagui: 'declared on input and textarea only',\n reason:\n 'they have no effect anywhere else on either platform, so the narrower type is the honest one',\n },\n {\n area: 'prop',\n subject: 'spellCheck on native',\n keys: [],\n rsd: 'documented as unsupported',\n tamagui: 'forwarded to the text-entry control, ios only',\n reason:\n 'react native implements spellCheck on TextInput for ios; the RSD table predates it and its own runtime forwards the prop',\n },\n {\n area: 'prop',\n subject: 'aria-describedby',\n keys: [],\n rsd: 'documented as polyfilled on native, but its runtime does not map it',\n tamagui: 'web only, with a note pointing at aria-label',\n reason:\n 'react native has no described-by relationship, so the table follows the runtime rather than the documentation',\n },\n {\n area: 'prop',\n subject: 'data-*',\n keys: ['data-*'],\n rsd: 'allows any data- prefixed prop at runtime but types none of them',\n tamagui: 'one data-* row, so the generated interfaces admit the whole prefix',\n reason:\n 'the runtime already accepts them; leaving them untyped only means authors reach for a cast',\n },\n {\n area: 'prop',\n subject: 'data-layoutconformance',\n keys: ['data-layoutconformance'],\n rsd: 'opts an element subtree into W3C layout conformance on native',\n tamagui: 'not part of the contract',\n reason:\n 'it is an escape hatch for a specific react native migration, not a DOM prop, and DOM mode targets one layout model',\n },\n {\n area: 'prop',\n subject: 'selected on html.option',\n keys: ['selected'],\n rsd: 'allowlisted, but not declared by its option props type',\n tamagui: 'not part of the contract',\n reason:\n 'react warns on it and steers to value or defaultValue on the select, and select has no native rendering anyway',\n },\n {\n area: 'prop',\n subject: 'children on a void or text-only element',\n keys: [],\n rsd: 'types children as a react node on every element, including br, hr, img, input, textarea and option',\n tamagui:\n 'types it as never on the five void elements and as string or number inside an option, from the content model in the tag table',\n reason:\n 'the compiler already reports this nesting as a build error, and the same rule stated in the types reports it in the editor instead of at build time',\n },\n {\n area: 'event',\n subject: 'onSelectionChange',\n keys: ['onSelectionChange'],\n rsd: 'allowlisted and typed on input and textarea, then warned about as unsupported',\n tamagui:\n 'not part of the contract; the selection cache behind the ref polyfill stays internal',\n reason:\n 'it is not a React DOM prop, so it does nothing on web and warns on native: no platform supports it',\n },\n {\n area: 'event',\n subject: 'onMouseMove',\n keys: [],\n rsd: 'allowed on the strict surface but omitted from the native prop forwarding path',\n tamagui: 'native diagnostic pointing at onPointerMove',\n reason:\n 'a handler that is silently dropped is worse than a build error naming the supported cross-platform spelling; the other mouse events and onScroll match the upstream native host passthrough',\n },\n {\n area: 'event',\n subject: 'onClick on native',\n keys: [],\n rsd: 'documented as unsupported, polyfilled in its runtime through the press event',\n tamagui: 'polyfilled through the press event, documented as a polyfill',\n reason:\n 'the polyfill is real and useful; the payload subset it can fill in is documented instead of denied',\n },\n {\n area: 'style',\n subject: 'inline reset placement',\n keys: [\n // the twelve tags RSD gives its inline reset on web\n 'web.a.textAlign',\n 'web.a.textDecoration',\n 'web.b.textAlign',\n 'web.b.textDecoration',\n 'web.bdi.textAlign',\n 'web.bdi.textDecoration',\n 'web.bdo.textAlign',\n 'web.bdo.textDecoration',\n 'web.code.textAlign',\n 'web.code.textDecoration',\n 'web.em.textAlign',\n 'web.em.textDecoration',\n 'web.i.textAlign',\n 'web.i.textDecoration',\n 'web.label.textAlign',\n 'web.label.textDecoration',\n 'web.mark.textAlign',\n 'web.mark.textDecoration',\n 'web.span.textAlign',\n 'web.span.textDecoration',\n 'web.strong.textAlign',\n 'web.strong.textDecoration',\n 'web.sub.textAlign',\n 'web.sub.textDecoration',\n 'web.sup.textAlign',\n 'web.sup.textDecoration',\n ],\n rsd: 'resets inline elements per tag with textDecoration: none and textAlign: inherit',\n tamagui:\n 'resets text-decoration once in the :where() host reset and leaves textAlign alone',\n reason:\n 'the host reset covers every inline tag at zero specificity, and textAlign already inherits, so declaring either per tag changes nothing',\n },\n {\n area: 'style',\n subject: 'element defaults RSD leaves to the browser on web',\n keys: [\n // del, ins, s and u keep only their semantic decoration; the margin and\n // padding reset RSD never declared for br, del, ins, kbd, optgroup,\n // option, s and u moved to the :where() host reset\n 'web.del.textDecorationLine',\n 'web.ins.textDecorationLine',\n 'web.kbd.fontFamily',\n 'web.kbd.fontSize',\n 'web.s.textDecorationLine',\n 'web.u.textDecorationLine',\n // and the rest lean on the browser stylesheet for their one decoration\n 'web.b.fontWeight',\n 'web.em.fontStyle',\n 'web.h1.fontWeight',\n 'web.h2.fontWeight',\n 'web.h3.fontWeight',\n 'web.h4.fontWeight',\n 'web.h5.fontWeight',\n 'web.h6.fontWeight',\n 'web.i.fontStyle',\n 'web.mark.backgroundColor',\n 'web.mark.color',\n ],\n rsd: 'applies no default styles at all to br, del, ins, kbd, optgroup, option, s and u on web, and relies on the browser stylesheet for the bold, italic, monospace, strike, underline and highlight of every other tag',\n tamagui: 'applies the same element defaults on both platforms',\n reason:\n 'one source has to render the same on web and native, which it cannot if half the defaults come from a browser stylesheet a css reset is free to remove',\n },\n {\n area: 'style',\n subject: 'browser-stylesheet undo lives in the :where() host reset',\n keys: [\n // margin and padding RSD declares per tag; the tables no longer repeat\n // them because every host carries is_DOM and the generated\n // `:where(.is_DOM)` rule resets them at zero specificity\n 'web.a.margin',\n 'web.a.padding',\n 'web.article.margin',\n 'web.article.padding',\n 'web.aside.margin',\n 'web.aside.padding',\n 'web.b.margin',\n 'web.b.padding',\n 'web.bdi.margin',\n 'web.bdi.padding',\n 'web.bdo.margin',\n 'web.bdo.padding',\n 'web.blockquote.margin',\n 'web.blockquote.padding',\n 'web.button.margin',\n 'web.button.padding',\n 'web.code.margin',\n 'web.code.padding',\n 'web.div.margin',\n 'web.div.padding',\n 'web.em.margin',\n 'web.em.padding',\n 'web.fieldset.margin',\n 'web.fieldset.padding',\n 'web.footer.margin',\n 'web.footer.padding',\n 'web.form.margin',\n 'web.form.padding',\n 'web.h1.margin',\n 'web.h1.padding',\n 'web.h2.margin',\n 'web.h2.padding',\n 'web.h3.margin',\n 'web.h3.padding',\n 'web.h4.margin',\n 'web.h4.padding',\n 'web.h5.margin',\n 'web.h5.padding',\n 'web.h6.margin',\n 'web.h6.padding',\n 'web.header.margin',\n 'web.header.padding',\n 'web.hr.margin',\n 'web.hr.padding',\n 'web.i.margin',\n 'web.i.padding',\n 'web.input.margin',\n 'web.input.padding',\n 'web.label.margin',\n 'web.label.padding',\n 'web.li.margin',\n 'web.li.padding',\n 'web.main.margin',\n 'web.main.padding',\n 'web.mark.margin',\n 'web.mark.padding',\n 'web.nav.margin',\n 'web.nav.padding',\n 'web.ol.margin',\n 'web.ol.padding',\n 'web.p.margin',\n 'web.p.padding',\n 'web.pre.margin',\n 'web.pre.padding',\n 'web.section.margin',\n 'web.section.padding',\n 'web.select.margin',\n 'web.select.padding',\n 'web.span.margin',\n 'web.span.padding',\n 'web.strong.margin',\n 'web.strong.padding',\n 'web.sub.margin',\n 'web.sub.padding',\n 'web.sup.margin',\n 'web.sup.padding',\n 'web.textarea.margin',\n 'web.textarea.padding',\n 'web.ul.margin',\n 'web.ul.padding',\n // border-style RSD declares on the four inline-block controls; the\n // generated per-display `:where(<tag>.is_DOM)` rule resets it the same way\n 'web.button.borderStyle',\n 'web.input.borderStyle',\n 'web.select.borderStyle',\n 'web.textarea.borderStyle',\n ],\n rsd: 'declares the margin, padding and control border-style undo per tag',\n tamagui:\n 'declares them once in the `:where(.is_DOM)` host reset generated from the tag display table',\n reason:\n 'atomic per-tag defaults lose to page CSS while a zero-specificity host rule needs no repeating; the conformance comparison sees only the semantic table defaults, and the generated reset test pins the rules to the display table',\n },\n {\n area: 'style',\n subject: 'html.a default styles',\n keys: ['native.a.color', 'native.a.textDecorationLine'],\n rsd: 'strips the underline on web and adds blue plus underline on native, so one source renders differently per platform',\n tamagui: 'applies the same inline reset on both platforms and adds no link colour',\n reason:\n 'cross-platform parity is the point of the shared fixture, and a hardcoded link colour cannot follow a theme',\n },\n {\n area: 'style',\n subject: 'monospace font family',\n keys: [\n 'web.code.fontFamily',\n 'web.pre.fontFamily',\n 'native.code.fontFamily',\n 'native.kbd.fontFamily',\n 'native.pre.fontFamily',\n ],\n rsd: 'writes monospace, \"monospace\" on web to cancel the browser size quirk, and picks Menlo on ios',\n tamagui:\n 'writes monospace on both platforms and cancels the size quirk with fontSize: 1em instead',\n reason:\n 'the duplicated family name only exists to defeat the size quirk, which 1em does directly; the font family itself belongs to the theme, not to the tag',\n },\n {\n area: 'style',\n subject: 'overflow on html.code',\n keys: ['web.code.overflow'],\n rsd: 'shares one rule between code and pre, so inline code gets overflow: auto too',\n tamagui: 'scrolls pre only',\n reason: 'overflow does nothing on an inline element',\n },\n {\n area: 'style',\n subject: 'web css properties a Tamagui style prop cannot express',\n keys: [\n 'web.a.wordWrap',\n 'web.b.wordWrap',\n 'web.bdi.wordWrap',\n 'web.bdo.wordWrap',\n 'web.code.wordWrap',\n 'web.em.wordWrap',\n 'web.h1.wordWrap',\n 'web.h2.wordWrap',\n 'web.h3.wordWrap',\n 'web.h4.wordWrap',\n 'web.h5.wordWrap',\n 'web.h6.wordWrap',\n 'web.i.wordWrap',\n 'web.label.wordWrap',\n 'web.mark.wordWrap',\n 'web.span.wordWrap',\n 'web.strong.wordWrap',\n 'web.sub.wordWrap',\n 'web.sup.wordWrap',\n 'web.ol.listStyle',\n 'web.ul.listStyle',\n 'web.textarea.resize',\n ],\n rsd: 'sets overflow-wrap on inline text and headings, list-style: none on ol and ul, and resize: vertical on a textarea, all as plain stylex rules',\n tamagui: 'sets none of the three',\n reason:\n 'Tamagui resolves none of these three property names, and an unresolved style prop does not quietly do nothing — it reaches the element as an attribute, which is a react warning and still no styling. list-style has no visible consequence anyway, because every view-backed element carries `.is_View { display: flex }`, so an li is never display: list-item and no marker is generated. The other two are cosmetic and web-only. Closing this means teaching the style pipeline the three properties, not working around it here',\n },\n {\n area: 'style',\n subject: 'html.img sizing',\n keys: ['web.img.aspectRatio', 'web.img.objectFit'],\n rsd: 'derives the aspect ratio from the width and height attributes with attr(), which only lands in recent chromium, and gives img no inline reset',\n tamagui:\n 'sets objectFit, leaves the inline reset to the :where() host reset like any other inline element, and lets the compiler turn the width and height props into an aspect ratio on native',\n reason:\n 'a css feature one engine supports cannot be the cross-platform contract, and the props are known at build time anyway; the inline reset still matters because an img inside an anchor otherwise inherits its underline',\n },\n {\n area: 'style',\n subject: 'universal native element defaults',\n keys: ['native.br.boxSizing', 'native.br.position', 'native.hr.boxSizing'],\n rsd: 'skips the shared native reset on br, and overrides boxSizing to border-box on hr',\n tamagui: 'applies the same native element defaults to every tag',\n reason:\n 'br is not special, and neither override changes what renders: hr has no border or padding for border-box to measure differently',\n },\n {\n area: 'behavior',\n subject: 'invalid nesting',\n keys: [],\n rsd: 'reports nothing at build time; an invalid tree fails at runtime on native',\n tamagui:\n 'compile diagnostic for statically knowable invalid nesting, from the content model in the tag table',\n reason:\n 'the compiler already classifies every tag, so the error belongs at build time where the source is',\n },\n {\n area: 'behavior',\n subject: 'children as a render function',\n keys: [],\n rsd: 'supports a function child that receives the resolved native props',\n tamagui: 'not part of the contract',\n reason:\n 'it exposes the native prop shape as public api and blocks compile-time literal-text wrapping',\n },\n {\n area: 'ref',\n subject: 'native element ref',\n keys: [],\n rsd: 'wraps every ref-ed host node in an Object.create view adding nodeName, viewport-scaled metrics and the tag polyfills',\n tamagui:\n 'wraps only ref-ed hosts in a stable Object.create facade adding nodeName, tagName, image complete, text-entry selection APIs, bound host methods and viewport-scaled geometry',\n reason:\n 'the compiler supplies the semantic tag only on the ref path, preserving the zero-allocation common path; the viewport provider scales synchronous DOM-shaped lengths and getBoundingClientRect while native measure methods remain bound to the host instance',\n },\n]\n"
|
|
10
10
|
]
|
|
11
11
|
}
|
package/types/tables/tags.d.ts
CHANGED
|
@@ -1,22 +1,4 @@
|
|
|
1
1
|
import type { DefaultStyle, TagName, TagRow } from "./types";
|
|
2
|
-
/**
|
|
3
|
-
* The tag table: the 49 elements of the Tamagui DOM contract.
|
|
4
|
-
*
|
|
5
|
-
* `display` and `backing` are independent columns. `p` is a block element
|
|
6
|
-
* backed by a native Text, `button` is inline-block backed by a native View.
|
|
7
|
-
* The compiler reads `backing` to inject primitives and `content` to report
|
|
8
|
-
* invalid nesting; the runtime reads the defaults to build each element.
|
|
9
|
-
*
|
|
10
|
-
* Element defaults follow React Strict DOM's resets: an explicit, equal
|
|
11
|
-
* starting point on both platforms instead of the browser default stylesheet on
|
|
12
|
-
* web and nothing on native. Differences from RSD are in `compatibility.ts`.
|
|
13
|
-
*/
|
|
14
|
-
/**
|
|
15
|
-
* Undoes the browser default stylesheet, keyed by `display`, before any tag
|
|
16
|
-
* default. Web only: react native has no default stylesheet to undo, so every
|
|
17
|
-
* key here would be a no-op that still costs a style lookup per element.
|
|
18
|
-
*/
|
|
19
|
-
export declare const DISPLAY_WEB_RESET: Readonly<Record<TagRow["display"], DefaultStyle>>;
|
|
20
2
|
export declare const TAGS: Readonly<Record<TagName, TagRow>>;
|
|
21
3
|
/**
|
|
22
4
|
* Web-only defaults: undoing a browser default, or a property with no
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
{
|
|
2
|
-
"mappings": "AAAA,cAAc,cAAc,SAAS,cAAc
|
|
2
|
+
"mappings": "AAAA,cAAc,cAAc,SAAS,cAAc;AAwBnD,OAAO,cAAM,MAAM,SAAS,OAAO,SAAS;;;;;;;;;;;;;AAigB5C,OAAO,cAAM,kBAAkB,SAAS,QAAQ,OAAO,SAAS;AAQhE,OAAO,cAAM,oBAAoB",
|
|
3
3
|
"names": [],
|
|
4
4
|
"sources": [
|
|
5
5
|
"src/tables/tags.ts"
|
|
6
6
|
],
|
|
7
7
|
"version": 3,
|
|
8
8
|
"sourcesContent": [
|
|
9
|
-
"import type { DefaultStyle, TagName, TagRow } from './types'\n\n/**\n * The tag table: the 49 elements of the Tamagui DOM contract.\n *\n * `display` and `backing` are independent columns. `p` is a block element\n * backed by a native Text, `button` is inline-block backed by a native View.\n * The compiler reads `backing` to inject primitives and `content` to report\n * invalid nesting; the runtime reads the defaults to build each element.\n *\n * Element defaults follow React Strict DOM's resets: an explicit, equal\n * starting point on both platforms instead of the browser default stylesheet on\n * web and nothing on native. Differences from RSD are in `compatibility.ts`.\n */\n\n/**\n * Undoes the browser default stylesheet, keyed by `display`, before any tag\n * default. Web only: react native has no default stylesheet to undo, so every\n * key here would be a no-op that still costs a style lookup per element.\n */\nexport const DISPLAY_WEB_RESET: Readonly<Record<TagRow['display'], DefaultStyle>> = {\n block: { margin: 0, padding: 0 },\n inline: { margin: 0, padding: 0, textDecorationLine: 'none' },\n 'inline-block': { margin: 0, padding: 0, borderStyle: 'solid' },\n}\n\nconst MONOSPACE: DefaultStyle = { fontFamily: 'monospace' }\nconst HEADING: DefaultStyle = { fontSize: '1.5rem', fontWeight: 'bold' }\n\nconst NO_FORM_SUBMISSION =\n 'renders as a container on native; there is no form submission, validation or reset'\n\nconst NO_NATIVE_PICKER =\n 'native has no menu-based select control, so this tag is a native build error'\n\nexport const TAGS: Readonly<Record<TagName, TagRow>> = {\n a: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n role: 'link',\n element: 'HTMLAnchorElement',\n props: 'anchor',\n web: 'host',\n native: 'polyfill',\n note: 'native has no navigation for href, target, rel, download or referrerPolicy',\n },\n article: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n aside: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n b: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { fontWeight: 'bold' },\n web: 'host',\n native: 'polyfill',\n },\n bdi: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: 'native has no bidirectional isolation; the text renders in the inherited direction',\n },\n bdo: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: 'native honours dir as a writing direction but does not override embedded bidi runs',\n },\n blockquote: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLQuoteElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n br: {\n display: 'inline',\n content: 'void',\n backing: 'text',\n element: 'HTMLBRElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n button: {\n display: 'inline-block',\n content: 'flow',\n backing: 'view',\n role: 'button',\n element: 'HTMLButtonElement',\n props: 'button',\n defaults: { borderWidth: 1 },\n web: 'host',\n native: 'polyfill',\n note: 'html restricts button content to phrasing; the native backing is a view, so block children are allowed',\n },\n code: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: MONOSPACE,\n web: 'host',\n native: 'polyfill',\n },\n del: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLModElement',\n props: 'common',\n defaults: { textDecorationLine: 'line-through' },\n web: 'host',\n native: 'polyfill',\n },\n div: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLDivElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n em: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { fontStyle: 'italic' },\n web: 'host',\n native: 'polyfill',\n },\n fieldset: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLFieldSetElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: NO_FORM_SUBMISSION,\n },\n footer: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n form: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLFormElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: NO_FORM_SUBMISSION,\n },\n h1: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h2: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h3: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h4: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h5: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h6: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n header: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n role: 'header',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n hr: {\n display: 'block',\n content: 'void',\n backing: 'view',\n element: 'HTMLHRElement',\n props: 'common',\n defaults: { backgroundColor: 'black', height: 1 },\n web: 'host',\n native: 'polyfill',\n },\n i: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { fontStyle: 'italic' },\n web: 'host',\n native: 'polyfill',\n },\n img: {\n display: 'inline',\n content: 'void',\n backing: 'image',\n element: 'HTMLImageElement',\n props: 'image',\n defaults: { objectFit: 'fill' },\n web: 'host',\n native: 'polyfill',\n note: 'width and height props set an aspect ratio on native, where images have no intrinsic layout size until they load',\n },\n input: {\n display: 'inline-block',\n content: 'void',\n backing: 'textinput',\n element: 'HTMLInputElement',\n props: 'input',\n defaults: { borderWidth: 1 },\n web: 'host',\n native: 'polyfill',\n note: 'native supports the text-like input types only; checkbox, color, date, datetime-local, file, month, radio, range, time and week are a native build error',\n },\n ins: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLModElement',\n props: 'common',\n defaults: { textDecorationLine: 'underline' },\n web: 'host',\n native: 'polyfill',\n },\n kbd: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: MONOSPACE,\n web: 'host',\n native: 'polyfill',\n },\n label: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLLabelElement',\n props: 'label',\n web: 'host',\n native: 'polyfill',\n note: 'native has no label association, so `for` does not focus or activate its control',\n },\n li: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n role: 'listitem',\n element: 'HTMLLIElement',\n props: 'listitem',\n web: 'host',\n native: 'polyfill',\n note: 'list markers and the `value` counter are not rendered on either platform, matching the list-style reset',\n },\n main: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n mark: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { backgroundColor: 'yellow', color: 'black' },\n web: 'host',\n native: 'polyfill',\n },\n nav: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n ol: {\n display: 'block',\n content: 'tags',\n childTags: ['li'],\n backing: 'view',\n role: 'list',\n element: 'HTMLOListElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n optgroup: {\n display: 'block',\n content: 'tags',\n childTags: ['option'],\n backing: 'view',\n element: 'HTMLOptGroupElement',\n props: 'optgroup',\n web: 'host',\n native: 'none',\n note: NO_NATIVE_PICKER,\n },\n option: {\n display: 'block',\n content: 'text',\n backing: 'text',\n element: 'HTMLOptionElement',\n props: 'option',\n web: 'host',\n native: 'none',\n note: NO_NATIVE_PICKER,\n },\n p: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLParagraphElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n pre: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLPreElement',\n props: 'common',\n defaults: MONOSPACE,\n web: 'host',\n native: 'polyfill',\n note: 'native preserves whitespace in text but has no scroll container, so long lines wrap instead of scrolling',\n },\n s: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { textDecorationLine: 'line-through' },\n web: 'host',\n native: 'polyfill',\n },\n section: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n select: {\n display: 'inline-block',\n content: 'tags',\n childTags: ['optgroup', 'option'],\n backing: 'view',\n element: 'HTMLSelectElement',\n props: 'select',\n web: 'host',\n native: 'none',\n note: NO_NATIVE_PICKER,\n },\n span: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLSpanElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n strong: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { fontWeight: 'bold' },\n web: 'host',\n native: 'polyfill',\n },\n sub: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: 'native has no vertical-align, so subscript text sits on the baseline',\n },\n sup: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: 'native has no vertical-align, so superscript text sits on the baseline',\n },\n textarea: {\n display: 'inline-block',\n content: 'void',\n backing: 'textinput',\n element: 'HTMLTextAreaElement',\n props: 'textarea',\n defaults: { borderWidth: 1 },\n nativeDefaults: { verticalAlign: 'top' },\n web: 'host',\n native: 'polyfill',\n note: 'the value comes from value or defaultValue; children are a build error on both platforms',\n },\n u: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { textDecorationLine: 'underline' },\n web: 'host',\n native: 'polyfill',\n },\n ul: {\n display: 'block',\n content: 'tags',\n childTags: ['li'],\n backing: 'view',\n role: 'list',\n element: 'HTMLUListElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n}\n\n/**\n * Web-only defaults: undoing a browser default, or a property with no\n * cross-platform spelling. `fontSize: 1em` cancels the browser's smaller\n * default size for monospace text, which is the whole reason the browser\n * renders `code`, `kbd` and `pre` at a different size from their surroundings.\n *\n * Everything here has to be a style property Tamagui actually resolves. A key\n * Tamagui does not know is not a silent no-op — it falls through to the element\n * as an attribute, which is a react warning and no styling. `list-style`,\n * `resize` and `overflow-wrap` are all in that category today, which is why\n * they are absent and recorded in `compatibility.ts` instead.\n */\nexport const TAG_WEB_DEFAULTS: Readonly<Partial<Record<TagName, DefaultStyle>>> = {\n code: { fontSize: '1em' },\n hr: { borderStyle: 'none', borderWidth: 0, boxSizing: 'border-box' },\n img: { height: 'auto', maxWidth: '100%' },\n kbd: { fontSize: '1em' },\n pre: { fontSize: '1em', overflow: 'auto' },\n}\n\nexport const TAG_NAMES: readonly TagName[] = Object.keys(TAGS) as TagName[]\n"
|
|
9
|
+
"import type { DefaultStyle, TagName, TagRow } from './types'\n\n/**\n * The tag table: the 49 elements of the Tamagui DOM contract.\n *\n * `display` and `backing` are independent columns. `p` is a block element\n * backed by a native Text, `button` is inline-block backed by a native View.\n * The compiler reads `backing` to inject primitives and `content` to report\n * invalid nesting; the runtime reads the defaults to build each element.\n *\n * Element defaults follow React Strict DOM's resets: an explicit, equal\n * starting point on both platforms instead of the browser default stylesheet on\n * web and nothing on native. Differences from RSD are in `compatibility.ts`.\n */\n\nconst MONOSPACE: DefaultStyle = { fontFamily: 'monospace' }\nconst HEADING: DefaultStyle = { fontSize: '1.5rem', fontWeight: 'bold' }\n\nconst NO_FORM_SUBMISSION =\n 'renders as a container on native; there is no form submission, validation or reset'\n\nconst NO_NATIVE_PICKER =\n 'native has no menu-based select control, so this tag is a native build error'\n\nexport const TAGS: Readonly<Record<TagName, TagRow>> = {\n a: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n role: 'link',\n element: 'HTMLAnchorElement',\n props: 'anchor',\n web: 'host',\n native: 'polyfill',\n note: 'native has no navigation for href, target, rel, download or referrerPolicy',\n },\n article: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n aside: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n b: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { fontWeight: 'bold' },\n web: 'host',\n native: 'polyfill',\n },\n bdi: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: 'native has no bidirectional isolation; the text renders in the inherited direction',\n },\n bdo: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: 'native honours dir as a writing direction but does not override embedded bidi runs',\n },\n blockquote: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLQuoteElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n br: {\n display: 'inline',\n content: 'void',\n backing: 'text',\n element: 'HTMLBRElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n button: {\n display: 'inline-block',\n content: 'flow',\n backing: 'view',\n role: 'button',\n element: 'HTMLButtonElement',\n props: 'button',\n defaults: { borderWidth: 1 },\n web: 'host',\n native: 'polyfill',\n note: 'html restricts button content to phrasing; the native backing is a view, so block children are allowed',\n },\n code: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: MONOSPACE,\n web: 'host',\n native: 'polyfill',\n },\n del: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLModElement',\n props: 'common',\n defaults: { textDecorationLine: 'line-through' },\n web: 'host',\n native: 'polyfill',\n },\n div: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLDivElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n em: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { fontStyle: 'italic' },\n web: 'host',\n native: 'polyfill',\n },\n fieldset: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLFieldSetElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: NO_FORM_SUBMISSION,\n },\n footer: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n form: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLFormElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: NO_FORM_SUBMISSION,\n },\n h1: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h2: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h3: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h4: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h5: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n h6: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n role: 'heading',\n element: 'HTMLHeadingElement',\n props: 'common',\n defaults: HEADING,\n web: 'host',\n native: 'polyfill',\n },\n header: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n role: 'header',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n hr: {\n display: 'block',\n content: 'void',\n backing: 'view',\n element: 'HTMLHRElement',\n props: 'common',\n defaults: { backgroundColor: 'black', height: 1 },\n web: 'host',\n native: 'polyfill',\n },\n i: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { fontStyle: 'italic' },\n web: 'host',\n native: 'polyfill',\n },\n img: {\n display: 'inline',\n content: 'void',\n backing: 'image',\n element: 'HTMLImageElement',\n props: 'image',\n defaults: { objectFit: 'fill' },\n web: 'host',\n native: 'polyfill',\n note: 'width and height props set an aspect ratio on native, where images have no intrinsic layout size until they load',\n },\n input: {\n display: 'inline-block',\n content: 'void',\n backing: 'textinput',\n element: 'HTMLInputElement',\n props: 'input',\n defaults: { borderWidth: 1 },\n web: 'host',\n native: 'polyfill',\n note: 'native supports the text-like input types only; checkbox, color, date, datetime-local, file, month, radio, range, time and week are a native build error',\n },\n ins: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLModElement',\n props: 'common',\n defaults: { textDecorationLine: 'underline' },\n web: 'host',\n native: 'polyfill',\n },\n kbd: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: MONOSPACE,\n web: 'host',\n native: 'polyfill',\n },\n label: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLLabelElement',\n props: 'label',\n web: 'host',\n native: 'polyfill',\n note: 'native has no label association, so `for` does not focus or activate its control',\n },\n li: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n role: 'listitem',\n element: 'HTMLLIElement',\n props: 'listitem',\n web: 'host',\n native: 'polyfill',\n note: 'list markers and the `value` counter are not rendered on either platform, matching the list-style reset',\n },\n main: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n mark: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { backgroundColor: 'yellow', color: 'black' },\n web: 'host',\n native: 'polyfill',\n },\n nav: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n ol: {\n display: 'block',\n content: 'tags',\n childTags: ['li'],\n backing: 'view',\n role: 'list',\n element: 'HTMLOListElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n optgroup: {\n display: 'block',\n content: 'tags',\n childTags: ['option'],\n backing: 'view',\n element: 'HTMLOptGroupElement',\n props: 'optgroup',\n web: 'host',\n native: 'none',\n note: NO_NATIVE_PICKER,\n },\n option: {\n display: 'block',\n content: 'text',\n backing: 'text',\n element: 'HTMLOptionElement',\n props: 'option',\n web: 'host',\n native: 'none',\n note: NO_NATIVE_PICKER,\n },\n p: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLParagraphElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n pre: {\n display: 'block',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLPreElement',\n props: 'common',\n defaults: MONOSPACE,\n web: 'host',\n native: 'polyfill',\n note: 'native preserves whitespace in text but has no scroll container, so long lines wrap instead of scrolling',\n },\n s: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { textDecorationLine: 'line-through' },\n web: 'host',\n native: 'polyfill',\n },\n section: {\n display: 'block',\n content: 'flow',\n backing: 'view',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n select: {\n display: 'inline-block',\n content: 'tags',\n childTags: ['optgroup', 'option'],\n backing: 'view',\n element: 'HTMLSelectElement',\n props: 'select',\n web: 'host',\n native: 'none',\n note: NO_NATIVE_PICKER,\n },\n span: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLSpanElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n strong: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { fontWeight: 'bold' },\n web: 'host',\n native: 'polyfill',\n },\n sub: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: 'native has no vertical-align, so subscript text sits on the baseline',\n },\n sup: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n note: 'native has no vertical-align, so superscript text sits on the baseline',\n },\n textarea: {\n display: 'inline-block',\n content: 'void',\n backing: 'textinput',\n element: 'HTMLTextAreaElement',\n props: 'textarea',\n defaults: { borderWidth: 1 },\n nativeDefaults: { verticalAlign: 'top' },\n web: 'host',\n native: 'polyfill',\n note: 'the value comes from value or defaultValue; children are a build error on both platforms',\n },\n u: {\n display: 'inline',\n content: 'phrasing',\n backing: 'text',\n element: 'HTMLElement',\n props: 'common',\n defaults: { textDecorationLine: 'underline' },\n web: 'host',\n native: 'polyfill',\n },\n ul: {\n display: 'block',\n content: 'tags',\n childTags: ['li'],\n backing: 'view',\n role: 'list',\n element: 'HTMLUListElement',\n props: 'common',\n web: 'host',\n native: 'polyfill',\n },\n}\n\n/**\n * Web-only defaults: undoing a browser default, or a property with no\n * cross-platform spelling. `fontSize: 1em` cancels the browser's smaller\n * default size for monospace text, which is the whole reason the browser\n * renders `code`, `kbd` and `pre` at a different size from their surroundings.\n *\n * Everything here has to be a style property Tamagui actually resolves. A key\n * Tamagui does not know is not a silent no-op — it falls through to the element\n * as an attribute, which is a react warning and no styling. `list-style`,\n * `resize` and `overflow-wrap` are all in that category today, which is why\n * they are absent and recorded in `compatibility.ts` instead.\n */\nexport const TAG_WEB_DEFAULTS: Readonly<Partial<Record<TagName, DefaultStyle>>> = {\n code: { fontSize: '1em' },\n hr: { borderStyle: 'none', borderWidth: 0, boxSizing: 'border-box' },\n img: { height: 'auto', maxWidth: '100%' },\n kbd: { fontSize: '1em' },\n pre: { fontSize: '1em', overflow: 'auto' },\n}\n\nexport const TAG_NAMES: readonly TagName[] = Object.keys(TAGS) as TagName[]\n"
|
|
10
10
|
]
|
|
11
11
|
}
|