@inkbrick/react 0.0.0-stage → 0.1.0-alpha.0

package/dist/mathCss-FLPE6QBM.js

@@ -0,0 +1,361 @@
+// src/math/mathCss.ts
+var MATH_CSS = `math {
+  font-family: "Cambria Math", 'STIXTwoMath-Regular', 'NotoSansMath-Regular', math;
+  font-style: normal;
+  font-weight: normal;
+  line-height: normal;
+  font-size-adjust: none;
+  text-indent: 0;
+  text-transform: none;
+  letter-spacing: normal;
+  word-wrap: normal;
+  direction: ltr;
+  /* Prevent Firefox from omitting the dot on i or j. */
+  font-feature-settings: "dtls" off;
+}
+
+math * {
+  border-color: currentColor;
+}
+
+/* display: block is necessary in Firefox and Safari.
+ * Not in Chromium, which recognizes display: "block math" written inline. */
+ math.tml-display {
+  display: block;
+  width: 100%;
+}
+
+*.mathcal {
+  /* NotoSans */
+  font-feature-settings: 'ss01';
+}
+
+math .mathscr {
+  font-family: "Temml";
+}
+
+mo.tml-prime {
+  font-family: Temml;
+}
+
+/* Cramped superscripts in WebKit */
+mfrac > :nth-child(2),
+msqrt,
+mover > :first-child {
+  math-shift: compact
+}
+
+.menclose {
+  display: inline-block;
+  position: relative;
+  padding: 0.5ex 0ex;
+}
+.tml-cancelto {
+  display: inline-block;
+  position: absolute;
+  top: 0;
+  left: 0;
+  padding: 0.5ex 0ex;
+  background-color: currentColor;
+  /* Use the SVG as an alpha mask (painted by background-color) */
+  -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><defs><marker id='a' markerHeight='5' markerUnits='strokeWidth' markerWidth='7' orient='auto' refX='7' refY='2.5'><path fill='black' d='m0 0 7 2.5L0 5z'/></marker></defs><line x2='100%25' y1='100%25' stroke='black' stroke-width='.06em' marker-end='url(%23a)' vector-effect='non-scaling-stroke'/></svg>");
+          mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><defs><marker id='a' markerHeight='5' markerUnits='strokeWidth' markerWidth='7' orient='auto' refX='7' refY='2.5'><path fill='black' d='m0 0 7 2.5L0 5z'/></marker></defs><line x2='100%25' y1='100%25' stroke='black' stroke-width='.06em' marker-end='url(%23a)' vector-effect='non-scaling-stroke'/></svg>");
+  -webkit-mask-repeat: no-repeat;
+          mask-repeat: no-repeat;
+  -webkit-mask-size: 100% 100%;
+          mask-size: 100% 100%;
+  -webkit-mask-position: 0 0;
+          mask-position: 0 0;
+}
+
+@supports (-moz-appearance: none) {
+  /* \\vec w/o italic correction for Firefox */
+  .tml-vec {
+    transform: scale(0.75)
+  }
+  /* Fix \\cancelto in Firefox */
+  .ff-narrow {
+    width: 0em;
+  }
+  .ff-nudge-left {
+    margin-left: -0.2em;
+  }
+  /* Squash hidden mrows in \\bordermatrix. Messes with centering, but necessary to squash. */
+  .ff-squash mtd {
+    display: block;
+    height: 0;
+  }
+}
+
+@supports (not (-moz-appearance: none)) {
+  /* Chromium and WebKit */
+  /* prime vertical alignment */
+  mo.tml-prime {
+    font-family: Temml;
+  }
+  /* Italic correction on superscripts */
+  .tml-sml-pad {
+    padding-left: 0.05em;
+  }
+  .tml-med-pad {
+    padding-left: 0.10em;
+  }
+  .tml-lrg-pad {
+    padding-left: 0.15em;
+  }
+}
+
+@supports (-webkit-backdrop-filter: blur(1px)) {
+  /* WebKit vertical & italic correction on accents */
+  .wbk-acc {
+    /* lower by x-height distance */
+    transform: translate(0em, 0.431em);
+  }
+  .wbk-sml {
+    transform: translate(0.07em, 0);
+  }
+  .wbk-sml-acc {
+    transform: translate(0.07em, 0.431em);
+  }
+  .wbk-sml-vec {
+    transform: scale(0.75) translate(0.07em, 0);
+  }
+  .wbk-med {
+    transform: translate(0.14em, 0);
+  }
+  .wbk-med-acc {
+    transform: translate(0.14em, 0.431em);
+  }
+  .wbk-med-vec {
+    transform: scale(0.75) translate(0.14em, 0);
+  }
+  .wbk-lrg {
+    transform: translate(0.21em, 0);
+  }
+  .wbk-lrg-acc {
+    transform: translate(0.21em, 0.431em);
+  }
+  .wbk-lrg-vec {
+    transform: scale(0.75) translate(0.21em, 0);
+  }
+}
+
+/* \\cancel & \\phase use background images. Get them to print. */
+menclose {
+  -webkit-print-color-adjust: exact;  /* Chrome & Edge */
+          print-color-adjust: exact;
+}
+
+/* Array cell justification in Firefox & WebKit */
+.tml-right {
+  text-align: right;
+}
+.tml-left {
+  text-align: left;
+}
+
+/* For CD labels that grow to the left in Firefox and WebKit */
+.tml-shift-left { margin-left:-200% }
+
+/* Styles for Chromium only */
+@supports (not (-webkit-backdrop-filter: blur(1px))) and (not (-moz-appearance: none)) {
+  /* Italic correction on accents */
+  .chr-sml {
+    transform: translate(0.07em, 0)
+  }
+  .chr-sml-vec {
+    transform: scale(0.75) translate(0.07em, 0)
+  }
+  .chr-med {
+    transform: translate(0.14em, 0)
+  }
+  .chr-med-vec {
+    transform: scale(0.75) translate(0.14em, 0)
+  }
+  .chr-lrg {
+    transform: translate(0.21em, 0)
+  }
+  .chr-lrg-vec {
+    transform: scale(0.75) translate(0.21em, 0)
+  }
+
+  /* For CD labels that grow to the left */
+  .tml-shift-left { margin-left:-100% }
+
+  /* MathML Core & Chromium do not support the MathML 3.0 element <menclose> attributes. */
+  /* So use styles. */
+  menclose {
+    position: relative;
+    padding: 0.5ex 0ex;
+  }
+  
+    .tml-overline {
+    padding: 0.1em 0 0 0;
+    border-top: 0.065em solid;
+  }
+
+  .tml-underline {
+    padding: 0 0 0.1em 0;
+    border-bottom: 0.065em solid;
+  }
+
+  .tml-cancel {
+    display: inline-block;
+    position: absolute;
+    left: 0.5px;
+    bottom: 0;
+    width: 100%;
+    height: 100%;
+    background-color: currentColor;
+  }
+  .upstrike {
+    clip-path: polygon(0.05em 100%, 0em calc(100% - 0.05em), calc(100% - 0.05em) 0em, 100% 0.05em);
+  }
+  .downstrike {
+    clip-path: polygon(0em 0.05em, 0.05em 0em, 100% calc(100% - 0.05em), calc(100% - 0.05em) 100%);
+  }
+  .sout {
+    clip-path: polygon(0em calc(55% + 0.0333em), 0em calc(55% - 0.0333em), 100% calc(55% - 0.0333em), 100% calc(55% + 0.0333em));
+  }
+  .tml-xcancel {
+    clip-path: polygon(0.05em 0em, 0em 0.05em, calc(50% - 0.05em) 50%, 0em calc(100% - 0.05em), 0.05em 100%, 50% calc(50% + 0.05em), calc(100% - 0.05em) 100%, 100% calc(100% - 0.05em), calc(50% + 0.05em) 50%, 100% 0.05em, calc(100% - 0.05em) 0%, 50% calc(50% - 0.05em));
+  }
+
+  .longdiv-top {
+    border-top: 0.067em solid;
+    padding: 0.1em 0.2em 0.2em 0.433em;
+  }
+  .longdiv-arc {
+    position: absolute;
+    top: 0;
+    bottom: 0.1em;
+    left: -0.4em;
+    width: 0.7em;
+    border: 0.067em solid;
+    transform: translateY(-0.067em);
+    border-radius: 70%;
+    clip-path: inset(0 0 0 0.4em);
+    box-sizing: border-box;}
+    .menclose {display: inline-block;
+    text-align: left;
+    position: relative;
+  }
+  
+  .phasor-bottom {
+    border-bottom: 0.067em solid;
+    padding: 0.2em 0.2em 0.1em 0.6em;
+  }
+  .phasor-angle {
+    display: inline-block;
+    position: absolute;
+    left: 0.5px;
+    bottom: -0.04em;
+    height: 100%;
+    aspect-ratio: 0.5;
+    background-color: currentColor;
+    clip-path: polygon(0.05em 100%, 0em calc(100% - 0.05em), calc(100% - 0.05em) 0em, 100% 0.05em);
+  }
+
+  .tml-fbox {
+    padding: 3pt;
+    border: 1px solid;
+  }
+
+  .circle-pad {
+    padding: 0.267em;
+  }
+  .textcircle {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    left: 0;
+    border: 0.067em solid;
+    border-radius: 50%;
+   }
+
+   .actuarial {
+    padding: 0.03889em 0.03889em 0 0.03889em;
+    border-width: 0.08em 0.08em 0em 0em;
+    border-style: solid;
+    margin-right: 0.03889em;
+   }
+
+   /* Stretch \\widetilde */
+  .tml-tilde-2 {
+    transform: scale(2.0, 1.1)
+  }
+  .tml-tilde-3 {
+    transform: scale(3.0, 1.1)
+  }
+  .tml-tilde-4 {
+    transform: scale(4.0, 1.1)
+  }
+  /* Stretch \\widehat */
+  .tml-hat-1 {
+    transform: scale(1.9, 1.0)
+  }
+  .tml-hat-2 {
+    transform: scale(3.9, 1.0)
+  }
+  .tml-hat-3 {
+    transform: scale(5.8, 1.0)
+  }
+  .tml-hat-4 {
+    transform: scale(7.8, 1.0)
+  }
+  
+  /* set array cell justification */
+  .tml-right {
+    text-align: -webkit-right;
+  }
+  .tml-left {
+    text-align: -webkit-left;
+  }
+}
+
+.special-fraction {
+  font-family: 'STIX TWO', 'Times New Roman', Times, Tinos, serif;
+}
+
+/* flex-wrap for line-breaking in Chromium */
+math {
+  display: inline-flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+}
+math > mrow {
+  padding: 0.5ex 0ex;
+}
+
+/* Default mtd top padding is 0.5ex per MathML-Core and user-agent CSS */
+/* We adjust for jot and small */
+mtable.tml-jot > mtr > mtd {
+  padding-top: 0.7ex;
+  padding-bottom: 0.7ex;
+}
+mtable.tml-small mtd {
+  padding-top: 0.35ex;
+  padding-bottom: 0.35ex;
+}
+
+/* Firefox */
+@-moz-document url-prefix() {
+  /* Avoid flex-wrap */
+  math { display: inline; }
+  math > mrow { padding: 0 }
+  /* Adjust Firefox spacing between array rows */
+  mtd, mtable.tml-small mtd { padding-top: 0; padding-bottom: 0; }
+  mtable.tml-jot > mtr > mtd { padding-top: 0.2ex; padding-bottom: 0.2ex; }
+}
+
+/* AMS environment auto-numbering via CSS counter. */
+.tml-eqn::before {
+  counter-increment: tmlEqnNo;
+  content: "(" counter(tmlEqnNo) ")";
+}
+`;
+export {
+  MATH_CSS
+};
+//# sourceMappingURL=mathCss-FLPE6QBM.js.map

package/dist/mathCss-FLPE6QBM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/math/mathCss.ts"],"sourcesContent":["// Стили MathML-вывода Temml (https://temml.org, лицензия MIT, © Ron Kok) — файл dist/Temml-Local.css без @font-face.\n// Файл сгенерирован из пакета temml; не правьте вручную. Лицензия — в `LICENSE` пакета temml.\nexport const MATH_CSS: string =\n  \"math {\\n  font-family: \\\"Cambria Math\\\", 'STIXTwoMath-Regular', 'NotoSansMath-Regular', math;\\n  font-style: normal;\\n  font-weight: normal;\\n  line-height: normal;\\n  font-size-adjust: none;\\n  text-indent: 0;\\n  text-transform: none;\\n  letter-spacing: normal;\\n  word-wrap: normal;\\n  direction: ltr;\\n  /* Prevent Firefox from omitting the dot on i or j. */\\n  font-feature-settings: \\\"dtls\\\" off;\\n}\\n\\nmath * {\\n  border-color: currentColor;\\n}\\n\\n/* display: block is necessary in Firefox and Safari.\\n * Not in Chromium, which recognizes display: \\\"block math\\\" written inline. */\\n math.tml-display {\\n  display: block;\\n  width: 100%;\\n}\\n\\n*.mathcal {\\n  /* NotoSans */\\n  font-feature-settings: 'ss01';\\n}\\n\\nmath .mathscr {\\n  font-family: \\\"Temml\\\";\\n}\\n\\nmo.tml-prime {\\n  font-family: Temml;\\n}\\n\\n/* Cramped superscripts in WebKit */\\nmfrac > :nth-child(2),\\nmsqrt,\\nmover > :first-child {\\n  math-shift: compact\\n}\\n\\n.menclose {\\n  display: inline-block;\\n  position: relative;\\n  padding: 0.5ex 0ex;\\n}\\n.tml-cancelto {\\n  display: inline-block;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  padding: 0.5ex 0ex;\\n  background-color: currentColor;\\n  /* Use the SVG as an alpha mask (painted by background-color) */\\n  -webkit-mask-image: url(\\\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><defs><marker id='a' markerHeight='5' markerUnits='strokeWidth' markerWidth='7' orient='auto' refX='7' refY='2.5'><path fill='black' d='m0 0 7 2.5L0 5z'/></marker></defs><line x2='100%25' y1='100%25' stroke='black' stroke-width='.06em' marker-end='url(%23a)' vector-effect='non-scaling-stroke'/></svg>\\\");\\n          mask-image: url(\\\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><defs><marker id='a' markerHeight='5' markerUnits='strokeWidth' markerWidth='7' orient='auto' refX='7' refY='2.5'><path fill='black' d='m0 0 7 2.5L0 5z'/></marker></defs><line x2='100%25' y1='100%25' stroke='black' stroke-width='.06em' marker-end='url(%23a)' vector-effect='non-scaling-stroke'/></svg>\\\");\\n  -webkit-mask-repeat: no-repeat;\\n          mask-repeat: no-repeat;\\n  -webkit-mask-size: 100% 100%;\\n          mask-size: 100% 100%;\\n  -webkit-mask-position: 0 0;\\n          mask-position: 0 0;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  /* \\\\vec w/o italic correction for Firefox */\\n  .tml-vec {\\n    transform: scale(0.75)\\n  }\\n  /* Fix \\\\cancelto in Firefox */\\n  .ff-narrow {\\n    width: 0em;\\n  }\\n  .ff-nudge-left {\\n    margin-left: -0.2em;\\n  }\\n  /* Squash hidden mrows in \\\\bordermatrix. Messes with centering, but necessary to squash. */\\n  .ff-squash mtd {\\n    display: block;\\n    height: 0;\\n  }\\n}\\n\\n@supports (not (-moz-appearance: none)) {\\n  /* Chromium and WebKit */\\n  /* prime vertical alignment */\\n  mo.tml-prime {\\n    font-family: Temml;\\n  }\\n  /* Italic correction on superscripts */\\n  .tml-sml-pad {\\n    padding-left: 0.05em;\\n  }\\n  .tml-med-pad {\\n    padding-left: 0.10em;\\n  }\\n  .tml-lrg-pad {\\n    padding-left: 0.15em;\\n  }\\n}\\n\\n@supports (-webkit-backdrop-filter: blur(1px)) {\\n  /* WebKit vertical & italic correction on accents */\\n  .wbk-acc {\\n    /* lower by x-height distance */\\n    transform: translate(0em, 0.431em);\\n  }\\n  .wbk-sml {\\n    transform: translate(0.07em, 0);\\n  }\\n  .wbk-sml-acc {\\n    transform: translate(0.07em, 0.431em);\\n  }\\n  .wbk-sml-vec {\\n    transform: scale(0.75) translate(0.07em, 0);\\n  }\\n  .wbk-med {\\n    transform: translate(0.14em, 0);\\n  }\\n  .wbk-med-acc {\\n    transform: translate(0.14em, 0.431em);\\n  }\\n  .wbk-med-vec {\\n    transform: scale(0.75) translate(0.14em, 0);\\n  }\\n  .wbk-lrg {\\n    transform: translate(0.21em, 0);\\n  }\\n  .wbk-lrg-acc {\\n    transform: translate(0.21em, 0.431em);\\n  }\\n  .wbk-lrg-vec {\\n    transform: scale(0.75) translate(0.21em, 0);\\n  }\\n}\\n\\n/* \\\\cancel & \\\\phase use background images. Get them to print. */\\nmenclose {\\n  -webkit-print-color-adjust: exact;  /* Chrome & Edge */\\n          print-color-adjust: exact;\\n}\\n\\n/* Array cell justification in Firefox & WebKit */\\n.tml-right {\\n  text-align: right;\\n}\\n.tml-left {\\n  text-align: left;\\n}\\n\\n/* For CD labels that grow to the left in Firefox and WebKit */\\n.tml-shift-left { margin-left:-200% }\\n\\n/* Styles for Chromium only */\\n@supports (not (-webkit-backdrop-filter: blur(1px))) and (not (-moz-appearance: none)) {\\n  /* Italic correction on accents */\\n  .chr-sml {\\n    transform: translate(0.07em, 0)\\n  }\\n  .chr-sml-vec {\\n    transform: scale(0.75) translate(0.07em, 0)\\n  }\\n  .chr-med {\\n    transform: translate(0.14em, 0)\\n  }\\n  .chr-med-vec {\\n    transform: scale(0.75) translate(0.14em, 0)\\n  }\\n  .chr-lrg {\\n    transform: translate(0.21em, 0)\\n  }\\n  .chr-lrg-vec {\\n    transform: scale(0.75) translate(0.21em, 0)\\n  }\\n\\n  /* For CD labels that grow to the left */\\n  .tml-shift-left { margin-left:-100% }\\n\\n  /* MathML Core & Chromium do not support the MathML 3.0 element <menclose> attributes. */\\n  /* So use styles. */\\n  menclose {\\n    position: relative;\\n    padding: 0.5ex 0ex;\\n  }\\n  \\n    .tml-overline {\\n    padding: 0.1em 0 0 0;\\n    border-top: 0.065em solid;\\n  }\\n\\n  .tml-underline {\\n    padding: 0 0 0.1em 0;\\n    border-bottom: 0.065em solid;\\n  }\\n\\n  .tml-cancel {\\n    display: inline-block;\\n    position: absolute;\\n    left: 0.5px;\\n    bottom: 0;\\n    width: 100%;\\n    height: 100%;\\n    background-color: currentColor;\\n  }\\n  .upstrike {\\n    clip-path: polygon(0.05em 100%, 0em calc(100% - 0.05em), calc(100% - 0.05em) 0em, 100% 0.05em);\\n  }\\n  .downstrike {\\n    clip-path: polygon(0em 0.05em, 0.05em 0em, 100% calc(100% - 0.05em), calc(100% - 0.05em) 100%);\\n  }\\n  .sout {\\n    clip-path: polygon(0em calc(55% + 0.0333em), 0em calc(55% - 0.0333em), 100% calc(55% - 0.0333em), 100% calc(55% + 0.0333em));\\n  }\\n  .tml-xcancel {\\n    clip-path: polygon(0.05em 0em, 0em 0.05em, calc(50% - 0.05em) 50%, 0em calc(100% - 0.05em), 0.05em 100%, 50% calc(50% + 0.05em), calc(100% - 0.05em) 100%, 100% calc(100% - 0.05em), calc(50% + 0.05em) 50%, 100% 0.05em, calc(100% - 0.05em) 0%, 50% calc(50% - 0.05em));\\n  }\\n\\n  .longdiv-top {\\n    border-top: 0.067em solid;\\n    padding: 0.1em 0.2em 0.2em 0.433em;\\n  }\\n  .longdiv-arc {\\n    position: absolute;\\n    top: 0;\\n    bottom: 0.1em;\\n    left: -0.4em;\\n    width: 0.7em;\\n    border: 0.067em solid;\\n    transform: translateY(-0.067em);\\n    border-radius: 70%;\\n    clip-path: inset(0 0 0 0.4em);\\n    box-sizing: border-box;}\\n    .menclose {display: inline-block;\\n    text-align: left;\\n    position: relative;\\n  }\\n  \\n  .phasor-bottom {\\n    border-bottom: 0.067em solid;\\n    padding: 0.2em 0.2em 0.1em 0.6em;\\n  }\\n  .phasor-angle {\\n    display: inline-block;\\n    position: absolute;\\n    left: 0.5px;\\n    bottom: -0.04em;\\n    height: 100%;\\n    aspect-ratio: 0.5;\\n    background-color: currentColor;\\n    clip-path: polygon(0.05em 100%, 0em calc(100% - 0.05em), calc(100% - 0.05em) 0em, 100% 0.05em);\\n  }\\n\\n  .tml-fbox {\\n    padding: 3pt;\\n    border: 1px solid;\\n  }\\n\\n  .circle-pad {\\n    padding: 0.267em;\\n  }\\n  .textcircle {\\n    position: absolute;\\n    top: 0;\\n    bottom: 0;\\n    right: 0;\\n    left: 0;\\n    border: 0.067em solid;\\n    border-radius: 50%;\\n   }\\n\\n   .actuarial {\\n    padding: 0.03889em 0.03889em 0 0.03889em;\\n    border-width: 0.08em 0.08em 0em 0em;\\n    border-style: solid;\\n    margin-right: 0.03889em;\\n   }\\n\\n   /* Stretch \\\\widetilde */\\n  .tml-tilde-2 {\\n    transform: scale(2.0, 1.1)\\n  }\\n  .tml-tilde-3 {\\n    transform: scale(3.0, 1.1)\\n  }\\n  .tml-tilde-4 {\\n    transform: scale(4.0, 1.1)\\n  }\\n  /* Stretch \\\\widehat */\\n  .tml-hat-1 {\\n    transform: scale(1.9, 1.0)\\n  }\\n  .tml-hat-2 {\\n    transform: scale(3.9, 1.0)\\n  }\\n  .tml-hat-3 {\\n    transform: scale(5.8, 1.0)\\n  }\\n  .tml-hat-4 {\\n    transform: scale(7.8, 1.0)\\n  }\\n  \\n  /* set array cell justification */\\n  .tml-right {\\n    text-align: -webkit-right;\\n  }\\n  .tml-left {\\n    text-align: -webkit-left;\\n  }\\n}\\n\\n.special-fraction {\\n  font-family: 'STIX TWO', 'Times New Roman', Times, Tinos, serif;\\n}\\n\\n/* flex-wrap for line-breaking in Chromium */\\nmath {\\n  display: inline-flex;\\n  flex-wrap: wrap;\\n  align-items: baseline;\\n}\\nmath > mrow {\\n  padding: 0.5ex 0ex;\\n}\\n\\n/* Default mtd top padding is 0.5ex per MathML-Core and user-agent CSS */\\n/* We adjust for jot and small */\\nmtable.tml-jot > mtr > mtd {\\n  padding-top: 0.7ex;\\n  padding-bottom: 0.7ex;\\n}\\nmtable.tml-small mtd {\\n  padding-top: 0.35ex;\\n  padding-bottom: 0.35ex;\\n}\\n\\n/* Firefox */\\n@-moz-document url-prefix() {\\n  /* Avoid flex-wrap */\\n  math { display: inline; }\\n  math > mrow { padding: 0 }\\n  /* Adjust Firefox spacing between array rows */\\n  mtd, mtable.tml-small mtd { padding-top: 0; padding-bottom: 0; }\\n  mtable.tml-jot > mtr > mtd { padding-top: 0.2ex; padding-bottom: 0.2ex; }\\n}\\n\\n/* AMS environment auto-numbering via CSS counter. */\\n.tml-eqn::before {\\n  counter-increment: tmlEqnNo;\\n  content: \\\"(\\\" counter(tmlEqnNo) \\\")\\\";\\n}\\n\";\n"],"mappings":";AAEO,IAAM,WACX;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}

package/package.json

@@ -1,6 +1,49 @@
 {
   "name": "@inkbrick/react",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.1.0-alpha.0",
+  "description": "React bindings and the default UI for the Inkbrick block editor.",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "sideEffects": false,
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
+  "dependencies": {
+    "temml": "^0.14.0",
+    "@inkbrick/document": "0.1.0-alpha.0",
+    "@inkbrick/engine": "0.1.0-alpha.0"
+  },
+  "devDependencies": {
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/react": "^16.3.2",
+    "jsdom": "^29.1.1",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/CyberWizard6090/Inkbrick.git",
+    "directory": "packages/react"
+  },
+  "scripts": {
+    "build": "tsup"
+  },
+  "module": "./dist/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  }
 }

package/src/block-handle/BlockHandleController.ts

@@ -0,0 +1,93 @@
+export type DropPosition = 'before' | 'after';
+
+export interface BlockAnchor {
+  readonly blockId: string;
+  readonly x: number;
+  readonly y: number;
+}
+
+export interface DropIndicatorRect {
+  readonly left: number;
+  readonly top: number;
+  readonly width: number;
+}
+
+export interface DragState {
+  readonly blockId: string;
+  readonly targetId: string | null;
+  readonly position: DropPosition | null;
+  readonly indicator: DropIndicatorRect | null;
+}
+
+export interface BlockHandleState {
+  readonly hover: BlockAnchor | null;
+  readonly menu: BlockAnchor | null;
+  readonly drag: DragState | null;
+}
+
+const IDLE: BlockHandleState = Object.freeze({ hover: null, menu: null, drag: null });
+
+const sameAnchor = (a: BlockAnchor | null, b: BlockAnchor | null) =>
+  a === b || (!!a && !!b && a.blockId === b.blockId && a.x === b.x && a.y === b.y);
+
+export class BlockHandleController {
+  private state: BlockHandleState = IDLE;
+
+  private readonly listeners = new Set<() => void>();
+
+  getState = (): BlockHandleState => this.state;
+
+  subscribe = (listener: () => void): (() => void) => {
+    this.listeners.add(listener);
+
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+
+  setHover(hover: BlockAnchor | null): void {
+    if (!sameAnchor(this.state.hover, hover)) this.set({ ...this.state, hover });
+  }
+
+  openMenu(menu: BlockAnchor): void {
+    this.set({ ...this.state, menu });
+  }
+
+  closeMenu(): void {
+    if (this.state.menu) this.set({ ...this.state, menu: null });
+  }
+
+  startDrag(blockId: string): void {
+    this.set({
+      ...this.state,
+      menu: null,
+      drag: { blockId, targetId: null, position: null, indicator: null },
+    });
+  }
+
+  updateDrag(patch: Partial<Omit<DragState, 'blockId'>>): void {
+    const drag = this.state.drag;
+
+    if (!drag) return;
+
+    const next = { ...drag, ...patch };
+    const same =
+      next.targetId === drag.targetId &&
+      next.position === drag.position &&
+      next.indicator?.left === drag.indicator?.left &&
+      next.indicator?.top === drag.indicator?.top &&
+      next.indicator?.width === drag.indicator?.width;
+
+    if (!same) this.set({ ...this.state, drag: next });
+  }
+
+  endDrag(): void {
+    if (this.state.drag) this.set({ ...this.state, drag: null });
+  }
+
+  private set(state: BlockHandleState): void {
+    this.state = state;
+
+    for (const listener of [...this.listeners]) listener();
+  }
+}

package/src/block-handle/BlockHandleHost.tsx

@@ -0,0 +1,108 @@
+import { useEffect, useRef, useSyncExternalStore } from 'react';
+import { createPortal } from 'react-dom';
+
+import { useEditor } from '../hooks/useEditor';
+import { useEditorView } from '../hooks/useEditorView';
+import { useReadOnly } from '../hooks/useReadOnly';
+import { useEditorUI } from '../ui/EditorUIContext';
+import { addBlockBelow, buildBlockActions } from './actions';
+import { DefaultBlockHandle } from './DefaultBlockHandle';
+import { DefaultBlockMenu } from './DefaultBlockMenu';
+import { startGripGesture } from './gripGesture';
+import type { GripProps } from './types';
+import { useBlockDrag } from './useBlockDrag';
+
+const GRIP_STYLE = Object.freeze({ touchAction: 'none' as const });
+
+/**
+ * Ручка блока и меню действий. `slots.BlockHandle = null` отключает их вместе со встроенным перетаскиванием;
+ * линию вставки рисует DropIndicatorHost, поэтому свой DnD через `useBlockDrag` работает и без ручек.
+ */
+export function BlockHandleHost() {
+  const editor = useEditor();
+  const view = useEditorView();
+  const drag = useBlockDrag();
+  const { slots, slashItems, t } = useEditorUI();
+  const readOnly = useReadOnly();
+  const state = useSyncExternalStore(
+    view.blocks.subscribe,
+    view.blocks.getState,
+    view.blocks.getState,
+  );
+  const cleanup = useRef<(() => void) | null>(null);
+
+  // Не оставляем слушателей, если компонент исчез посреди перетаскивания.
+  useEffect(() => () => cleanup.current?.(), []);
+
+  if (slots.BlockHandle === null || readOnly || typeof document === 'undefined') return null;
+
+  const { hover, menu } = state;
+  const dragging = state.drag;
+
+  const openMenuFor = (blockId: string) => {
+    const anchor = view.blocks.getState().hover ?? hover;
+
+    if (anchor) view.blocks.openMenu({ blockId, x: anchor.x, y: anchor.y + 30 });
+  };
+
+  const gripPropsFor = (blockId: string): GripProps => ({
+    onPointerDown: (event) => {
+      if (event.button !== 0) return;
+
+      event.preventDefault();
+      cleanup.current?.();
+
+      const anchor = hover;
+      const cancel = startGripGesture(drag, blockId, event.nativeEvent, {
+        onTap: () => {
+          cleanup.current = null;
+          if (anchor) view.blocks.openMenu({ blockId, x: anchor.x, y: anchor.y + 30 });
+        },
+      });
+
+      cleanup.current = cancel;
+    },
+    onContextMenu: (event) => event.preventDefault(),
+    style: GRIP_STYLE,
+    'data-inkbrick-grip': '',
+  });
+
+  const Handle = slots.BlockHandle ?? DefaultBlockHandle;
+  const Menu = slots.BlockMenu ?? DefaultBlockMenu;
+  const activeId = dragging?.blockId ?? hover?.blockId;
+
+  const menuBlock = menu ? editor.store.getBlock(menu.blockId) : undefined;
+  const menuContent =
+    menu && menuBlock ? buildBlockActions(editor, view, menu.blockId, slashItems, t) : null;
+
+  return createPortal(
+    <>
+      {hover && activeId && (
+        <Handle
+          blockId={activeId}
+          position={{ x: hover.x, y: hover.y }}
+          canAdd={editor.can('insertBlock', { flavour: 'block:paragraph', afterId: activeId })}
+          dragging={!!dragging}
+          menuOpen={!!menu}
+          onAdd={() => addBlockBelow(editor, view, activeId, slashItems)}
+          onOpenMenu={() => openMenuFor(activeId)}
+          gripProps={gripPropsFor(activeId)}
+        />
+      )}
+
+      {menu && menuBlock && menuContent && (
+        <Menu
+          block={menuBlock}
+          position={{ x: menu.x, y: menu.y }}
+          actions={menuContent.actions}
+          turnInto={menuContent.turnInto}
+          onClose={() => {
+            view.blocks.closeMenu();
+            view.getRoot()?.focus({ preventScroll: true });
+          }}
+        />
+      )}
+    </>,
+    document.body,
+  );
+}