@wix/origami-system-components 1.10.7 → 1.10.8

package/README.md

@@ -156,11 +156,12 @@ goes in Page's `viewportLayer` array, in its saved relative order. The layer ren
 after the footer, only when the array is non-empty.
 
 Both are fixed, screen-covering one-cell grids with `pointer-events: none`. The child
-docks with its own `align-self`, `justify-self`, margins and size. Both give their
-direct children `grid-area: 1 / 1` and `pointer-events: auto` at zero specificity, so
-a child's own values still win. A child's `<interact-element>` and a comp's
-`.wix-presets-wrapper` are `display: contents`, so the element inside them (either or
-both) gets the rule instead. The z-index depends only on the slot:
+docks with its own `align-self`, `justify-self`, margins and size, and sits in the one
+cell through `grid-row: 1 / 2; grid-column: 1 / 2` in its layout.css, which the JSX
+converter writes for every pinned element. Both give their direct children
+`pointer-events: auto` at zero specificity, so a child's own value still wins; it
+inherits through a child's `display: contents` `<interact-element>` and
+`.wix-presets-wrapper`. The z-index depends only on the slot:
 header wrapper and viewport layer 52, footer wrapper 49, Section wrappers `auto`. Content z-indexes
 must stay at 51 or below. Only direct page children can be pinned, on every breakpoint
 or on none.

package/dist/layout/PinnedToScreen.css

@@ -10,15 +10,12 @@
     z-index: var(--pin-z-index, 52);
 }
 
-/* Each child sits in the one cell, so several children overlap instead of stacking
-   in implicit rows, and turns clicks back on. Zero specificity, so a child's own
-   grid-area and pointer-events win, and direct children only, so intentional `none`
-   deeper in a component is kept. A child's interactions boundary and a comp's presets
-   wrapper are `display: contents`, so the element inside them is the grid item and gets
-   the same rule. */
-:where(.origami-pinned-to-screen, .origami-page__viewport-layer) > *,
-:where(.origami-pinned-to-screen, .origami-page__viewport-layer) > :where(interact-element, .wix-presets-wrapper) > *,
-:where(.origami-pinned-to-screen, .origami-page__viewport-layer) > :where(interact-element) > :where(.wix-presets-wrapper) > * {
-    grid-area: 1 / 1;
+/* Turns clicks back on for the direct children. Zero specificity, so a child's own
+   pointer-events wins, and direct children only, so an intentional `none` deeper in a
+   component is kept. It inherits through a child's `display: contents` interactions
+   boundary and presets wrapper. The child's placement in the one cell is structural
+   layout.css the converter writes, not this rule's: no selector here reliably reaches
+   the grid item through those wrappers. */
+:where(.origami-pinned-to-screen, .origami-page__viewport-layer) > * {
     pointer-events: auto;
 }

package/dist/layout/PinnedToScreen.d.ts

@@ -8,7 +8,8 @@ export interface PinnedToScreenProps {
  * Experimental screen-pinned wrapper for a page's Section, header or footer, rendered
  * in place in its Page slot. It always covers the screen and lets clicks through;
  * the child gets clicks back from PinnedToScreen.css and docks itself in the single
- * grid cell with its own alignment, margins and size. The stacking order comes from the
+ * grid cell with its own alignment, margins and size. Its placement in that cell comes
+ * from its layout.css, which the JSX converter writes. The stacking order comes from the
  * slot (see Page.css).
  * Wrap outside the child's interactions boundary, so an entrance transform cannot
  * become the fixed element's containing block. Other pinned comps go in Page's viewportLayer.

package/dist/layout/PinnedToScreen.js

@@ -5,7 +5,8 @@ import './PinnedToScreen.css';
  * Experimental screen-pinned wrapper for a page's Section, header or footer, rendered
  * in place in its Page slot. It always covers the screen and lets clicks through;
  * the child gets clicks back from PinnedToScreen.css and docks itself in the single
- * grid cell with its own alignment, margins and size. The stacking order comes from the
+ * grid cell with its own alignment, margins and size. Its placement in that cell comes
+ * from its layout.css, which the JSX converter writes. The stacking order comes from the
  * slot (see Page.css).
  * Wrap outside the child's interactions boundary, so an entrance transform cannot
  * become the fixed element's containing block. Other pinned comps go in Page's viewportLayer.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/origami-system-components",
-  "version": "1.10.7",
+  "version": "1.10.8",
   "description": "Editor structural and system components for standalone Origami sites",
   "sideEffects": [
     "**/*.css"
@@ -132,5 +132,5 @@
     "@wix/builder-state": "^1.49.3",
     "@wix/editor-components": "^1.16.0"
   },
-  "falconPackageHash": "48530f45cf02030c472beb10f31a0861ee155004ae5753a20b0a2a8a"
+  "falconPackageHash": "411984e75a931f6a742ab4fd846eb1484b9d602c1591a1b880bbf9df"
 }