@hyper-elements/react 0.3.0 → 0.3.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/pdf.js CHANGED
@@ -438,7 +438,12 @@ var textStyle = {
438
438
  fontFamily: { kind: fontFamily(), label: "Font", inherited: true, support: { email: { level: "full", source: "outlook-captures" }, web: css } },
439
439
  // Word rounds sizes to half points (13px is 10pt): a fraction of a px.
440
440
  fontSize: { kind: length(["px"], { min: 1 }), label: "Font size", inherited: true, mobile: true, support: { email: { level: "full", source: "outlook-captures" }, web: css } },
441
- fontWeight: { kind: fontWeight(), label: "Font weight", inherited: true, support: { email: { level: "full", source: "caniemail" }, web: css } },
441
+ fontWeight: {
442
+ kind: fontWeight(),
443
+ label: "Font weight",
444
+ inherited: true,
445
+ support: { email: { level: "outlook", values: [100, 200, 300, 500], shows: "normal weight: Word draws only normal and bold (600 and over)", source: "caniemail", feature: "css-font-weight" }, web: css }
446
+ },
442
447
  fontStyle: { kind: enumOf(["normal", "italic"]), label: "Font style", inherited: true, support: { email: { level: "full", source: "caniemail" }, web: css } },
443
448
  // Written in px with mso-line-height-rule: exactly, which Word keeps (it drops unitless ones).
444
449
  lineHeight: { kind: lineHeight(), label: "Line height", inherited: true, mobile: true, support: { email: { level: "full", source: "outlook-captures" }, web: css } },
@@ -450,8 +455,21 @@ var textStyle = {
450
455
  support: { email: { level: "outlook", shows: "normal spacing: Word keeps letter spacing but doesn't draw it", source: "outlook-captures" }, web: css }
451
456
  },
452
457
  textAlign: { kind: enumOf(["left", "center", "right", "justify"]), label: "Alignment", inherited: true, mobile: true, support: { email: { level: "full", source: "caniemail" }, web: css } },
453
- textTransform: { kind: enumOf(["none", "uppercase", "lowercase", "capitalize"]), label: "Letter case", inherited: true, support: { email: { level: "full", source: "assumed" }, web: css } },
454
- textDecoration: { kind: enumOf(["none", "underline", "line-through"]), label: "Decoration", support: { email: { level: "full", source: "caniemail" }, web: css } }
458
+ textTransform: {
459
+ kind: enumOf(["none", "uppercase", "lowercase", "capitalize"]),
460
+ label: "Letter case",
461
+ inherited: true,
462
+ support: { email: { level: "outlook", values: ["lowercase"], shows: "the text as written: Word doesn't lowercase it", source: "caniemail", feature: "css-text-transform" }, web: css }
463
+ },
464
+ textDecoration: {
465
+ kind: enumOf(["none", "underline", "line-through"]),
466
+ label: "Decoration",
467
+ support: {
468
+ // Removed, so "none" leaves a link the client's own underline: said only where a line is asked for.
469
+ email: { level: "partial", values: ["underline", "line-through"], shows: "no line: the client removes it", source: "caniemail", feature: "css-text-decoration", clients: ["gmail-app-other", "protonmail", "orange", "sfr"] },
470
+ web: css
471
+ }
472
+ }
455
473
  };
456
474
  var inheritedTextStyle = (({ textDecoration: _, ...rest }) => rest)(textStyle);
457
475
  var boxStyle = {
@@ -464,7 +482,17 @@ var boxStyle = {
464
482
  padding: { kind: insets(), label: "Padding", mobile: true, support: { email: { level: "full", source: "outlook-captures" }, web: css } },
465
483
  backgroundColor: { kind: color(), label: "Background color", support: { email: writer, web: css } },
466
484
  border: { kind: border(), label: "Border", mobile: true, support: { email: { level: "full", source: "caniemail" }, web: css } },
467
- borderRadius: { kind: radius(), label: "Corner radius", support: { email: { level: "outlook", shows: "square corners", source: "caniemail" }, web: css } },
485
+ borderRadius: {
486
+ kind: radius(),
487
+ label: "Corner radius",
488
+ support: {
489
+ email: [
490
+ { level: "outlook", shows: "square corners", source: "caniemail", feature: "css-border-radius" },
491
+ { level: "partial", shows: "square corners", source: "caniemail", feature: "css-border-radius", clients: ["gmx", "web-de", "orange"] }
492
+ ],
493
+ web: css
494
+ }
495
+ },
468
496
  overflow: {
469
497
  kind: enumOf(["visible", "hidden"]),
470
498
  label: "Overflow",
@@ -492,13 +520,27 @@ function pick(group, ...keys) {
492
520
  return Object.fromEntries(keys.map((key) => [key, group[key]]));
493
521
  }
494
522
  var WRITTEN = { email: { level: "full", source: "writer" }, web: { level: "full", source: "writer" } };
523
+ var NO_WEB_FONTS = ["outlook", "outlook-com", "outlook-mac", "outlook-app", "gmail", "gmail-app", "gmail-app-other", "yahoo", "aol", "protonmail", "fastmail", "gmx", "web-de", "orange", "sfr", "laposte", "mail-ru", "ionos"];
495
524
  var ROOT_PROPS = {
496
525
  title: prop(text(), { support: WRITTEN, label: "Title", description: "The document's title (shown in a browser tab, and by some email clients)." }),
497
- lang: prop(text({ maxLength: 35 }), { support: WRITTEN, label: "Language", description: 'Its language, as a BCP 47 tag ("en", "ar").' }),
498
- dir: prop(enumOf(["ltr", "rtl", "auto"]), { support: WRITTEN, label: "Text direction" }),
526
+ lang: prop(text({ maxLength: 35 }), {
527
+ support: {
528
+ ...WRITTEN,
529
+ email: { level: "partial", shows: "no language: the client removes it, and a screen reader reads the email in its own", source: "caniemail", feature: "html-lang", clients: ["hey", "gmx", "web-de", "orange", "ionos"] }
530
+ },
531
+ label: "Language",
532
+ description: 'Its language, as a BCP 47 tag ("en", "ar").'
533
+ }),
534
+ dir: prop(enumOf(["ltr", "rtl", "auto"]), {
535
+ support: {
536
+ ...WRITTEN,
537
+ email: { level: "partial", values: ["rtl", "auto"], shows: "left to right: the client removes the direction", source: "caniemail", feature: "html-dir", clients: ["gmx", "web-de"] }
538
+ },
539
+ label: "Text direction"
540
+ }),
499
541
  fonts: prop(fontFaces(), {
500
542
  support: {
501
- email: { level: "partial", shows: "Apple Mail and iOS Mail load web fonts; Gmail and classic Outlook don't, and show the next font in each stack", source: "caniemail" },
543
+ email: { level: "partial", shows: "no web font loads: the next font in each stack shows", source: "caniemail", feature: "css-at-font-face", clients: NO_WEB_FONTS },
502
544
  web: { level: "full", source: "writer" }
503
545
  },
504
546
  label: "Web fonts",
@@ -590,7 +632,10 @@ defineComponent({
590
632
  style: {},
591
633
  children: {},
592
634
  sizing: "none",
593
- targets: { web: {} }
635
+ targets: { web: {} },
636
+ // A Page's or a Canvas's text has no page to number.
637
+ roots: ["Document"],
638
+ notAllowed: { code: "document/page-number", message: (root) => `A PageNumber is a page's number in a Document; this ${root} has no pages` }
594
639
  });
595
640
  function documentPages(root) {
596
641
  const pages = [];
@@ -709,7 +754,7 @@ var flex2 = (value) => typeof value === "string" ? FLEX[value] : void 0;
709
754
  function alignSelf(child, stack) {
710
755
  const sized = child.style.width !== void 0 || child.style.maxWidth !== void 0;
711
756
  if (child.type === "Divider" || child.definition.sizing !== "shrink" && !sized) return void 0;
712
- const align = stack.style.alignItems;
757
+ const align = child.style.alignSelf ?? stack.style.alignItems;
713
758
  if (align === "stretch") return void 0;
714
759
  if (align) return flex2(align);
715
760
  return { left: "flex-start", justify: "flex-start", center: "center", right: "flex-end" }[stack.text.textAlign];