@design-edito/tools 0.5.10 → 0.5.11

package/agnostic/arrays/index.d.ts

@@ -1,6 +1,6 @@
+export * as dedupe from './dedupe/index.js'
 export * as findDuplicates from './find-duplicates/index.js'
 export * as isArrayOf from './is-array-of/index.js'
-export * as randomPick from './random-pick/index.js'
 export * as make from './make/index.js'
-export * as dedupe from './dedupe/index.js'
+export * as randomPick from './random-pick/index.js'
 export * as shuffle from './shuffle/index.js'

package/agnostic/arrays/index.js

@@ -1,6 +1,6 @@
+export * as dedupe from './dedupe/index.js'
 export * as findDuplicates from './find-duplicates/index.js'
 export * as isArrayOf from './is-array-of/index.js'
-export * as randomPick from './random-pick/index.js'
 export * as make from './make/index.js'
-export * as dedupe from './dedupe/index.js'
+export * as randomPick from './random-pick/index.js'
 export * as shuffle from './shuffle/index.js'

package/agnostic/colors/index.d.ts

@@ -1,12 +1,12 @@
-export * as contrast from './contrast/index.js'
-export * as convert from './convert/index.js'
 export * as channels from './channels/index.js'
+export * as convert from './convert/index.js'
+export * as contrast from './contrast/index.js'
 export * as distance from './distance/index.js'
+export * as grayscale from './grayscale/index.js'
 export * as invert from './invert/index.js'
 export * as lerp from './lerp/index.js'
 export * as luminance from './luminance/index.js'
-export * as rotate from './rotate/index.js'
 export * as palette from './palette/index.js'
+export * as rotate from './rotate/index.js'
 export * as tidy from './tidy/index.js'
 export * as typechecks from './typechecks/index.js'
-export * as grayscale from './grayscale/index.js'

package/agnostic/colors/index.js

@@ -1,12 +1,12 @@
-export * as contrast from './contrast/index.js'
-export * as convert from './convert/index.js'
 export * as channels from './channels/index.js'
+export * as convert from './convert/index.js'
+export * as contrast from './contrast/index.js'
 export * as distance from './distance/index.js'
+export * as grayscale from './grayscale/index.js'
 export * as invert from './invert/index.js'
 export * as lerp from './lerp/index.js'
 export * as luminance from './luminance/index.js'
-export * as rotate from './rotate/index.js'
 export * as palette from './palette/index.js'
+export * as rotate from './rotate/index.js'
 export * as tidy from './tidy/index.js'
 export * as typechecks from './typechecks/index.js'
-export * as grayscale from './grayscale/index.js'

package/agnostic/css/index.d.ts

@@ -2,5 +2,5 @@ export * as bem from './bem/index.js'
 export * as clss from './clss/index.js'
 export * as generateNiceColor from './generate-nice-color/index.js'
 export * as isValidCssClassName from './is-valid-css-class-name/index.js'
-export * as scale from './scale/index.js'
 export * as stylesSet from './styles-set/index.js'
+export * as scale from './scale/index.js'

package/agnostic/css/index.js

@@ -2,5 +2,5 @@ export * as bem from './bem/index.js'
 export * as clss from './clss/index.js'
 export * as generateNiceColor from './generate-nice-color/index.js'
 export * as isValidCssClassName from './is-valid-css-class-name/index.js'
-export * as scale from './scale/index.js'
 export * as stylesSet from './styles-set/index.js'
+export * as scale from './scale/index.js'

package/agnostic/errors/index.d.ts

@@ -1,2 +1,2 @@
-export * as register from './register/index.js'
 export * as unknownToString from './unknown-to-string/index.js'
+export * as register from './register/index.js'

package/agnostic/errors/index.js

@@ -1,2 +1,2 @@
-export * as register from './register/index.js'
 export * as unknownToString from './unknown-to-string/index.js'
+export * as register from './register/index.js'

package/agnostic/html/hyper-json/smart-tags/coalesced/index.d.ts

@@ -2,50 +2,50 @@ export * as add from './add/index.js'
 export * as addclass from './addclass/index.js'
 export * as and from './and/index.js'
 export * as append from './append/index.js'
-export * as call from './call/index.js'
 export * as at from './at/index.js'
 export * as clone from './clone/index.js'
+export * as call from './call/index.js'
 export * as deleteproperties from './deleteproperties/index.js'
-export * as getattribute from './getattribute/index.js'
 export * as equals from './equals/index.js'
+export * as getattribute from './getattribute/index.js'
 export * as getproperties from './getproperties/index.js'
 export * as getproperty from './getproperty/index.js'
 export * as hjparse from './hjparse/index.js'
 export * as if from './if/index.js'
 export * as hjstringify from './hjstringify/index.js'
 export * as initialize from './initialize/index.js'
+export * as join from './join/index.js'
 export * as length from './length/index.js'
 export * as map from './map/index.js'
-export * as join from './join/index.js'
 export * as negate from './negate/index.js'
-export * as notrailing from './notrailing/index.js'
 export * as or from './or/index.js'
+export * as notrailing from './notrailing/index.js'
 export * as pickrandom from './pickrandom/index.js'
 export * as populate from './populate/index.js'
 export * as print from './print/index.js'
+export * as push from './push/index.js'
 export * as pusheach from './pusheach/index.js'
 export * as recordtoarray from './recordtoarray/index.js'
-export * as push from './push/index.js'
-export * as removeclass from './removeclass/index.js'
 export * as removeattribute from './removeattribute/index.js'
-export * as renameproperty from './renameproperty/index.js'
+export * as removeclass from './removeclass/index.js'
 export * as replace from './replace/index.js'
-export * as select from './select/index.js'
+export * as renameproperty from './renameproperty/index.js'
 export * as set from './set/index.js'
 export * as setattribute from './setattribute/index.js'
+export * as select from './select/index.js'
 export * as setproperty from './setproperty/index.js'
 export * as sorton from './sorton/index.js'
 export * as split from './split/index.js'
+export * as spread from './spread/index.js'
 export * as toarray from './toarray/index.js'
-export * as toelement from './toelement/index.js'
 export * as toboolean from './toboolean/index.js'
+export * as toelement from './toelement/index.js'
 export * as toggleclass from './toggleclass/index.js'
 export * as tonodelist from './tonodelist/index.js'
+export * as tonumber from './tonumber/index.js'
 export * as tonull from './tonull/index.js'
 export * as torecord from './torecord/index.js'
-export * as tonumber from './tonumber/index.js'
 export * as toref from './toref/index.js'
-export * as spread from './spread/index.js'
 export * as tostring from './tostring/index.js'
 export * as totext from './totext/index.js'
 export * as transformselected from './transformselected/index.js'

package/agnostic/html/hyper-json/smart-tags/coalesced/index.js

@@ -2,50 +2,50 @@ export * as add from './add/index.js'
 export * as addclass from './addclass/index.js'
 export * as and from './and/index.js'
 export * as append from './append/index.js'
-export * as call from './call/index.js'
 export * as at from './at/index.js'
 export * as clone from './clone/index.js'
+export * as call from './call/index.js'
 export * as deleteproperties from './deleteproperties/index.js'
-export * as getattribute from './getattribute/index.js'
 export * as equals from './equals/index.js'
+export * as getattribute from './getattribute/index.js'
 export * as getproperties from './getproperties/index.js'
 export * as getproperty from './getproperty/index.js'
 export * as hjparse from './hjparse/index.js'
 export * as if from './if/index.js'
 export * as hjstringify from './hjstringify/index.js'
 export * as initialize from './initialize/index.js'
+export * as join from './join/index.js'
 export * as length from './length/index.js'
 export * as map from './map/index.js'
-export * as join from './join/index.js'
 export * as negate from './negate/index.js'
-export * as notrailing from './notrailing/index.js'
 export * as or from './or/index.js'
+export * as notrailing from './notrailing/index.js'
 export * as pickrandom from './pickrandom/index.js'
 export * as populate from './populate/index.js'
 export * as print from './print/index.js'
+export * as push from './push/index.js'
 export * as pusheach from './pusheach/index.js'
 export * as recordtoarray from './recordtoarray/index.js'
-export * as push from './push/index.js'
-export * as removeclass from './removeclass/index.js'
 export * as removeattribute from './removeattribute/index.js'
-export * as renameproperty from './renameproperty/index.js'
+export * as removeclass from './removeclass/index.js'
 export * as replace from './replace/index.js'
-export * as select from './select/index.js'
+export * as renameproperty from './renameproperty/index.js'
 export * as set from './set/index.js'
 export * as setattribute from './setattribute/index.js'
+export * as select from './select/index.js'
 export * as setproperty from './setproperty/index.js'
 export * as sorton from './sorton/index.js'
 export * as split from './split/index.js'
+export * as spread from './spread/index.js'
 export * as toarray from './toarray/index.js'
-export * as toelement from './toelement/index.js'
 export * as toboolean from './toboolean/index.js'
+export * as toelement from './toelement/index.js'
 export * as toggleclass from './toggleclass/index.js'
 export * as tonodelist from './tonodelist/index.js'
+export * as tonumber from './tonumber/index.js'
 export * as tonull from './tonull/index.js'
 export * as torecord from './torecord/index.js'
-export * as tonumber from './tonumber/index.js'
 export * as toref from './toref/index.js'
-export * as spread from './spread/index.js'
 export * as tostring from './tostring/index.js'
 export * as totext from './totext/index.js'
 export * as transformselected from './transformselected/index.js'

package/agnostic/html/hyper-json/smart-tags/isolated/index.d.ts

@@ -1,13 +1,13 @@
 export * as any from './any/index.js'
-export * as boolean from './boolean/index.js'
 export * as array from './array/index.js'
+export * as boolean from './boolean/index.js'
 export * as element from './element/index.js'
 export * as get from './get/index.js'
 export * as guess from './guess/index.js'
 export * as nodelist from './nodelist/index.js'
 export * as null from './null/index.js'
-export * as number from './number/index.js'
 export * as record from './record/index.js'
-export * as string from './string/index.js'
 export * as ref from './ref/index.js'
+export * as number from './number/index.js'
+export * as string from './string/index.js'
 export * as text from './text/index.js'

package/agnostic/html/hyper-json/smart-tags/isolated/index.js

@@ -1,13 +1,13 @@
 export * as any from './any/index.js'
-export * as boolean from './boolean/index.js'
 export * as array from './array/index.js'
+export * as boolean from './boolean/index.js'
 export * as element from './element/index.js'
 export * as get from './get/index.js'
 export * as guess from './guess/index.js'
 export * as nodelist from './nodelist/index.js'
 export * as null from './null/index.js'
-export * as number from './number/index.js'
 export * as record from './record/index.js'
-export * as string from './string/index.js'
 export * as ref from './ref/index.js'
+export * as number from './number/index.js'
+export * as string from './string/index.js'
 export * as text from './text/index.js'

package/agnostic/html/index.d.ts

@@ -3,8 +3,8 @@ export * as getNodeAncestors from './get-node-ancestors/index.js'
 export * as getPositionInsideParent from './get-position-inside-parent/index.js'
 export * as hyperJson from './hyper-json/index.js'
 export * as insertNode from './insert-node/index.js'
-export * as placeholders from './placeholders/index.js'
 export * as replaceInElement from './replace-in-element/index.js'
 export * as selectorToElement from './selector-to-element/index.js'
 export * as stringToNodes from './string-to-nodes/index.js'
 export * as watchSelection from './watch-selection/index.js'
+export * as placeholders from './placeholders/index.js'

package/agnostic/html/index.js

@@ -3,8 +3,8 @@ export * as getNodeAncestors from './get-node-ancestors/index.js'
 export * as getPositionInsideParent from './get-position-inside-parent/index.js'
 export * as hyperJson from './hyper-json/index.js'
 export * as insertNode from './insert-node/index.js'
-export * as placeholders from './placeholders/index.js'
 export * as replaceInElement from './replace-in-element/index.js'
 export * as selectorToElement from './selector-to-element/index.js'
 export * as stringToNodes from './string-to-nodes/index.js'
 export * as watchSelection from './watch-selection/index.js'
+export * as placeholders from './placeholders/index.js'

package/agnostic/index.d.ts

@@ -7,11 +7,11 @@ export * as html from './html/index.js'
 export * as misc from './misc/index.js'
 export * as numbers from './numbers/index.js'
 export * as objects from './objects/index.js'
-export * as random from './random/index.js'
 export * as optim from './optim/index.js'
 export * as regexps from './regexps/index.js'
 export * as sanitization from './sanitization/index.js'
 export * as strings from './strings/index.js'
-export * as subtitles from './subtitles/index.js'
+export * as random from './random/index.js'
 export * as time from './time/index.js'
 export * as typescript from './typescript/index.js'
+export * as subtitles from './subtitles/index.js'

package/agnostic/index.js

@@ -7,11 +7,11 @@ export * as html from './html/index.js'
 export * as misc from './misc/index.js'
 export * as numbers from './numbers/index.js'
 export * as objects from './objects/index.js'
-export * as random from './random/index.js'
 export * as optim from './optim/index.js'
 export * as regexps from './regexps/index.js'
 export * as sanitization from './sanitization/index.js'
 export * as strings from './strings/index.js'
-export * as subtitles from './subtitles/index.js'
+export * as random from './random/index.js'
 export * as time from './time/index.js'
 export * as typescript from './typescript/index.js'
+export * as subtitles from './subtitles/index.js'

package/agnostic/misc/index.d.ts

@@ -1,12 +1,12 @@
 export * as cast from './cast/index.js'
+export * as assert from './assert/index.js'
 export * as connection from './connection/index.js'
 export * as crawler from './crawler/index.js'
 export * as crossenv from './crossenv/index.js'
-export * as dataSize from './data-size/index.js'
 export * as isConstructorFunction from './is-constructor-function/index.js'
-export * as assert from './assert/index.js'
+export * as dataSize from './data-size/index.js'
 export * as isNullish from './is-nullish/index.js'
 export * as logs from './logs/index.js'
 export * as loremIpsum from './lorem-ipsum/index.js'
-export * as normalizeExtension from './normalize-extension/index.js'
 export * as outcome from './outcome/index.js'
+export * as normalizeExtension from './normalize-extension/index.js'

package/agnostic/misc/index.js

@@ -1,12 +1,12 @@
 export * as cast from './cast/index.js'
+export * as assert from './assert/index.js'
 export * as connection from './connection/index.js'
 export * as crawler from './crawler/index.js'
 export * as crossenv from './crossenv/index.js'
-export * as dataSize from './data-size/index.js'
 export * as isConstructorFunction from './is-constructor-function/index.js'
-export * as assert from './assert/index.js'
+export * as dataSize from './data-size/index.js'
 export * as isNullish from './is-nullish/index.js'
 export * as logs from './logs/index.js'
 export * as loremIpsum from './lorem-ipsum/index.js'
-export * as normalizeExtension from './normalize-extension/index.js'
 export * as outcome from './outcome/index.js'
+export * as normalizeExtension from './normalize-extension/index.js'

package/agnostic/misc/logs/index.d.ts

@@ -1,3 +1,3 @@
-export * as logger from './logger/index.js'
 export * as makeTextBlock from './make-text-block/index.js'
+export * as logger from './logger/index.js'
 export * as styles from './styles/index.js'

package/agnostic/misc/logs/index.js

@@ -1,3 +1,3 @@
-export * as logger from './logger/index.js'
 export * as makeTextBlock from './make-text-block/index.js'
+export * as logger from './logger/index.js'
 export * as styles from './styles/index.js'

package/agnostic/numbers/index.d.ts

@@ -1,6 +1,6 @@
 export * as absoluteModulo from './absolute-modulo/index.js'
 export * as approximateRational from './approximate-rational/index.js'
-export * as clamp from './clamp/index.js'
+export * as geometricProgressions from './geometric-progressions/index.js'
 export * as interpolate from './interpolate/index.js'
+export * as clamp from './clamp/index.js'
 export * as round from './round/index.js'
-export * as geometricProgressions from './geometric-progressions/index.js'

package/agnostic/numbers/index.js

@@ -1,6 +1,6 @@
 export * as absoluteModulo from './absolute-modulo/index.js'
 export * as approximateRational from './approximate-rational/index.js'
-export * as clamp from './clamp/index.js'
+export * as geometricProgressions from './geometric-progressions/index.js'
 export * as interpolate from './interpolate/index.js'
+export * as clamp from './clamp/index.js'
 export * as round from './round/index.js'
-export * as geometricProgressions from './geometric-progressions/index.js'

package/agnostic/objects/index.d.ts

@@ -4,6 +4,6 @@ export * as flattenGetters from './flatten-getters/index.js'
 export * as isObject from './is-object/index.js'
 export * as isRecord from './is-record/index.js'
 export * as recordFormat from './record-format/index.js'
+export * as sortKeys from './sort-keys/index.js'
 export * as recordMap from './record-map/index.js'
 export * as validation from './validation/index.js'
-export * as sortKeys from './sort-keys/index.js'

package/agnostic/objects/index.js

@@ -4,6 +4,6 @@ export * as flattenGetters from './flatten-getters/index.js'
 export * as isObject from './is-object/index.js'
 export * as isRecord from './is-record/index.js'
 export * as recordFormat from './record-format/index.js'
+export * as sortKeys from './sort-keys/index.js'
 export * as recordMap from './record-map/index.js'
 export * as validation from './validation/index.js'
-export * as sortKeys from './sort-keys/index.js'

package/agnostic/optim/index.d.ts

@@ -1,2 +1,2 @@
-export * as memoize from './memoize/index.js'
 export * as throttleDebounce from './throttle-debounce/index.js'
+export * as memoize from './memoize/index.js'

package/agnostic/optim/index.js

@@ -1,2 +1,2 @@
-export * as memoize from './memoize/index.js'
 export * as throttleDebounce from './throttle-debounce/index.js'
+export * as memoize from './memoize/index.js'

package/agnostic/strings/index.d.ts

@@ -1,8 +1,8 @@
 export * as charCodes from './char-codes/index.js'
 export * as matches from './matches/index.js'
 export * as normalizeIndent from './normalize-indent/index.js'
+export * as parseTable from './parse-table/index.js'
 export * as replaceAll from './replace-all/index.js'
-export * as splitTrim from './split-trim/index.js'
 export * as toAlphanum from './to-alphanum/index.js'
 export * as trim from './trim/index.js'
-export * as parseTable from './parse-table/index.js'
+export * as splitTrim from './split-trim/index.js'

package/agnostic/strings/index.js

@@ -1,8 +1,8 @@
 export * as charCodes from './char-codes/index.js'
 export * as matches from './matches/index.js'
 export * as normalizeIndent from './normalize-indent/index.js'
+export * as parseTable from './parse-table/index.js'
 export * as replaceAll from './replace-all/index.js'
-export * as splitTrim from './split-trim/index.js'
 export * as toAlphanum from './to-alphanum/index.js'
 export * as trim from './trim/index.js'
-export * as parseTable from './parse-table/index.js'
+export * as splitTrim from './split-trim/index.js'

package/agnostic/subtitles/index.d.ts

@@ -1,2 +1,2 @@
-export * as srtTimecodeToMs from './srt-timecode-to-ms/index.js'
 export * as parseSrt from './parse-srt/index.js'
+export * as srtTimecodeToMs from './srt-timecode-to-ms/index.js'

package/agnostic/subtitles/index.js

@@ -1,2 +1,2 @@
-export * as srtTimecodeToMs from './srt-timecode-to-ms/index.js'
 export * as parseSrt from './parse-srt/index.js'
+export * as srtTimecodeToMs from './srt-timecode-to-ms/index.js'

package/agnostic/time/index.d.ts

@@ -1,5 +1,5 @@
-export * as duration from './duration/index.js'
 export * as dates from './dates/index.js'
+export * as duration from './duration/index.js'
 export * as timeout from './timeout/index.js'
 export * as transitions from './transitions/index.js'
 export * as wait from './wait/index.js'

package/agnostic/time/index.js

@@ -1,5 +1,5 @@
-export * as duration from './duration/index.js'
 export * as dates from './dates/index.js'
+export * as duration from './duration/index.js'
 export * as timeout from './timeout/index.js'
 export * as transitions from './transitions/index.js'
 export * as wait from './wait/index.js'

package/components/Lightbox/index.d.ts

@@ -8,7 +8,8 @@ import type { WithClassName } from '../utils/types.js';
  * one a click on this member opens; the others only matter when another member opens
  * them. Declaring none makes it a group of its own.
  * @property closeBtnContent - Content rendered inside the close button.
- * @property openBtnContent - Content rendered inside the open button.
+ * @property openBtnContent - Content rendered inside the open button. No content, no
+ * button: the lightbox is then opened by whatever the consumer wires up.
  * @property prevBtnContent - Content rendered inside the previous button, shown only
  * when the open group holds more than one member.
  * @property nextBtnContent - Content rendered inside the next button, same condition.
@@ -61,8 +62,8 @@ export type Props = PropsWithChildren<WithClassName<{
     onIsOnChanged?: (isOn: boolean) => void;
 }>>;
 /**
- * Lightbox component. Holds content in place until opened, then moves it into an
- * overlay covering the page.
+ * Lightbox component. Holds content in a box that a stylesheet lifts over the page
+ * when opened.
  *
  * ### CSS modifiers
  * - `on` - this member is open.
@@ -70,35 +71,37 @@ export type Props = PropsWithChildren<WithClassName<{
  * - `grouped` - it belongs to a group it did not invent, so navigation is possible.
  *
  * ### CSS elements
- * - `placeholder` - holds the content's last measured size while it is away.
- * - `backdrop` - the overlay, portalled to `document.body`, mounted only while open.
- * - `content` - wraps the moved content inside the lightbox.
+ * - `placeholder` - holds the content's last measured size while it is out of flow.
+ * - `backdrop` - the box the content always lives in; a stylesheet takes it out of
+ *   flow and over the page while the root carries `--on`.
+ * - `content` - wraps the content inside the backdrop.
  * - `open-btn`, `close-btn`, `prev-btn`, `next-btn`
  *
  * @param props - Component properties.
  * @see {@link Props}
- * @returns A root `<div>` holding the content or its placeholder, plus, while open, a
- * lightbox portalled to the end of `document.body`.
+ * @returns A root `<div>` holding a placeholder, the backdrop the content lives in,
+ * and the controls.
  *
  * @remarks
- * - **[WIP]** Moving a `<video>` keeps it playing on desktop browsers; iOS has been
- *   known to pause on a DOM move. Not worth guarding against for now.
- * - **The content is moved, not copied.** A portal relocates the DOM node without
- *   changing the element's place in the React tree, so the instance is never
- *   unmounted: a playing video keeps playing, at its timecode, and lands back where it
- *   was on close. Rendering `children` twice would mount a second, fresh instance and
- *   leave the first one running behind the lightbox.
- * - **The lightbox is portalled to `document.body`.** A `position: fixed` overlay left in
- *   the article would be trapped by the first ancestor carrying a `transform`, a
- *   `filter` or a `contain`, which becomes its containing block.
+ * - **The content never moves.** It stays in the same box, at the same place in the
+ *   React tree, open or closed; only the box's positioning changes, and that is a
+ *   stylesheet's business. Nothing is unmounted, so a playing video keeps playing at
+ *   its timecode. Rendering `children` in two branches - one in place, one on a stage
+ *   - would mount a fresh instance on every flip, React reconciling by position.
+ * - **Nothing leaves the component's own subtree.** No portal, no `document.body`: a
+ *   component has no business writing outside the scope it was handed.
  * - **A placeholder keeps the layout still.** Its size is the content's last measured
- *   one, read while closed; without it the article would collapse around the hole the
- *   content leaves.
+ *   one, read while closed; without it the article would collapse around the hole left
+ *   once the backdrop goes out of flow.
+ * - **[WIP]** A `position: fixed` backdrop is trapped by the first ancestor carrying a
+ *   `transform`, a `filter` or a `contain`, which becomes its containing block. Inside
+ *   a slot, that ancestor is the consumer's own to avoid.
  * - **Groups are held outside React**, in `./store.ts`: a consumer may render each
  *   component in a root of its own, in which case members of a group share no tree
  *   and a context could not reach from one to the other.
- * - The lightbox is rendered by whichever member is on it, so navigating hands it over.
- *   None of the content is remounted in the process.
+ * - Every member holds its own backdrop; only the open one is lifted over the page.
+ *   Navigating a group therefore lowers one and lifts another, and neither one's
+ *   content is touched.
  * - This component ships **no appearance**: covering the page, the backdrop and the
  *   buttons are the consumer stylesheet's business. Without one, the content is moved
  *   to the end of the document and nothing looks like a lightbox.

package/components/Lightbox/index.js

@@ -1,14 +1,14 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useId, useLayoutEffect, useRef, useState, useSyncExternalStore } from 'react';
-import { createPortal } from 'react-dom';
 import { clss } from '../../agnostic/css/clss/index.js';
+import { isNotNullish } from '../../agnostic/misc/is-nullish/index.js';
 import { mergeClassNames, useChangeDispatch } from '../utils/index.js';
 import { lightbox as publicClassName } from '../public-classnames.js';
 import { close as closeLightbox, getState, membersOf, open as openLightbox, register, soloGroupOf, step, subscribe, unregister } from './store.js';
 import cssModule from './styles.module.css';
 /**
- * Lightbox component. Holds content in place until opened, then moves it into an
- * overlay covering the page.
+ * Lightbox component. Holds content in a box that a stylesheet lifts over the page
+ * when opened.
  *
  * ### CSS modifiers
  * - `on` - this member is open.
@@ -16,35 +16,37 @@ import cssModule from './styles.module.css';
  * - `grouped` - it belongs to a group it did not invent, so navigation is possible.
  *
  * ### CSS elements
- * - `placeholder` - holds the content's last measured size while it is away.
- * - `backdrop` - the overlay, portalled to `document.body`, mounted only while open.
- * - `content` - wraps the moved content inside the lightbox.
+ * - `placeholder` - holds the content's last measured size while it is out of flow.
+ * - `backdrop` - the box the content always lives in; a stylesheet takes it out of
+ *   flow and over the page while the root carries `--on`.
+ * - `content` - wraps the content inside the backdrop.
  * - `open-btn`, `close-btn`, `prev-btn`, `next-btn`
  *
  * @param props - Component properties.
  * @see {@link Props}
- * @returns A root `<div>` holding the content or its placeholder, plus, while open, a
- * lightbox portalled to the end of `document.body`.
+ * @returns A root `<div>` holding a placeholder, the backdrop the content lives in,
+ * and the controls.
  *
  * @remarks
- * - **[WIP]** Moving a `<video>` keeps it playing on desktop browsers; iOS has been
- *   known to pause on a DOM move. Not worth guarding against for now.
- * - **The content is moved, not copied.** A portal relocates the DOM node without
- *   changing the element's place in the React tree, so the instance is never
- *   unmounted: a playing video keeps playing, at its timecode, and lands back where it
- *   was on close. Rendering `children` twice would mount a second, fresh instance and
- *   leave the first one running behind the lightbox.
- * - **The lightbox is portalled to `document.body`.** A `position: fixed` overlay left in
- *   the article would be trapped by the first ancestor carrying a `transform`, a
- *   `filter` or a `contain`, which becomes its containing block.
+ * - **The content never moves.** It stays in the same box, at the same place in the
+ *   React tree, open or closed; only the box's positioning changes, and that is a
+ *   stylesheet's business. Nothing is unmounted, so a playing video keeps playing at
+ *   its timecode. Rendering `children` in two branches - one in place, one on a stage
+ *   - would mount a fresh instance on every flip, React reconciling by position.
+ * - **Nothing leaves the component's own subtree.** No portal, no `document.body`: a
+ *   component has no business writing outside the scope it was handed.
  * - **A placeholder keeps the layout still.** Its size is the content's last measured
- *   one, read while closed; without it the article would collapse around the hole the
- *   content leaves.
+ *   one, read while closed; without it the article would collapse around the hole left
+ *   once the backdrop goes out of flow.
+ * - **[WIP]** A `position: fixed` backdrop is trapped by the first ancestor carrying a
+ *   `transform`, a `filter` or a `contain`, which becomes its containing block. Inside
+ *   a slot, that ancestor is the consumer's own to avoid.
  * - **Groups are held outside React**, in `./store.ts`: a consumer may render each
  *   component in a root of its own, in which case members of a group share no tree
  *   and a context could not reach from one to the other.
- * - The lightbox is rendered by whichever member is on it, so navigating hands it over.
- *   None of the content is remounted in the process.
+ * - Every member holds its own backdrop; only the open one is lifted over the page.
+ *   Navigating a group therefore lowers one and lifts another, and neither one's
+ *   content is touched.
  * - This component ships **no appearance**: covering the page, the backdrop and the
  *   buttons are the consumer stylesheet's business. Without one, the content is moved
  *   to the end of the document and nothing looks like a lightbox.
@@ -182,10 +184,10 @@ export const Lightbox = ({ group, closeBtnContent, openBtnContent, prevBtnConten
         grouped: isGrouped
     }), className);
     const size = sizeRef.current;
-    const overlay = isOn
-        ? createPortal(_jsxs("div", { className: c('backdrop'), onClick: handleBackdropClick, ref: backdropRef, children: [_jsx("div", { className: c('content'), children: children }), _jsx("button", { type: 'button', className: c('close-btn'), onClick: handleCloseButtonClick, children: closeBtnContent }), siblingsCount > 1 && _jsxs(_Fragment, { children: [_jsx("button", { type: 'button', className: c('prev-btn'), onClick: handlePrevButtonClick, children: prevBtnContent }), _jsx("button", { type: 'button', className: c('next-btn'), onClick: handleNextButtonClick, children: nextBtnContent })] })] }), document.body)
-        : null;
-    return _jsxs("div", { className: rootClss, ref: rootRef, children: [isOn
-                ? _jsx("div", { className: c('placeholder'), style: size === null ? undefined : { width: size.width, height: size.height } })
-                : children, _jsx("button", { type: 'button', className: c('open-btn'), onClick: handleOpenButtonClick, children: openBtnContent }), overlay] });
+    // Every child keeps its position in the tree whatever the state: the placeholder and
+    // the backdrop are always rendered, and the buttons come after the content rather
+    // than around it. React reconciles by position, so moving `children` from one branch
+    // to another would unmount and remount them - the very thing this component exists
+    // to avoid.
+    return _jsxs("div", { className: rootClss, ref: rootRef, children: [_jsx("div", { className: c('placeholder'), style: isOn && size !== null ? { width: size.width, height: size.height } : undefined }), _jsxs("div", { className: c('backdrop'), onClick: handleBackdropClick, ref: backdropRef, children: [_jsx("div", { className: c('content'), children: children }), isOn && _jsxs(_Fragment, { children: [_jsx("button", { type: 'button', className: c('close-btn'), onClick: handleCloseButtonClick, children: closeBtnContent }), siblingsCount > 1 && _jsxs(_Fragment, { children: [_jsx("button", { type: 'button', className: c('prev-btn'), onClick: handlePrevButtonClick, children: prevBtnContent }), _jsx("button", { type: 'button', className: c('next-btn'), onClick: handleNextButtonClick, children: nextBtnContent })] })] })] }), !isOn && isNotNullish(openBtnContent) && _jsx("button", { type: 'button', className: c('open-btn'), onClick: handleOpenButtonClick, children: openBtnContent })] });
 };

package/node/@google-cloud/storage/directory/index.d.ts

@@ -1,4 +1,4 @@
 export * as copyDir from './copy-dir/index.js'
-export * as removeDir from './remove-dir/index.js'
 export * as list from './list/index.js'
 export * as moveDir from './move-dir/index.js'
+export * as removeDir from './remove-dir/index.js'

package/node/@google-cloud/storage/directory/index.js

@@ -1,4 +1,4 @@
 export * as copyDir from './copy-dir/index.js'
-export * as removeDir from './remove-dir/index.js'
 export * as list from './list/index.js'
 export * as moveDir from './move-dir/index.js'
+export * as removeDir from './remove-dir/index.js'

package/node/@google-cloud/storage/file/index.d.ts

@@ -1,12 +1,12 @@
 export * as copy from './copy/index.js'
-export * as generateSignedUrl from './generate-signed-url/index.js'
 export * as download from './download/index.js'
+export * as exists from './exists/index.js'
+export * as generateSignedUrl from './generate-signed-url/index.js'
 export * as getMetadata from './get-metadata/index.js'
 export * as getPermissions from './get-permissions/index.js'
 export * as move from './move/index.js'
 export * as remove from './remove/index.js'
-export * as stat from './stat/index.js'
 export * as revokeSignedUrls from './revoke-signed-urls/index.js'
-export * as exists from './exists/index.js'
+export * as stat from './stat/index.js'
 export * as updateMetadata from './update-metadata/index.js'
 export * as upload from './upload/index.js'

package/node/@google-cloud/storage/file/index.js

@@ -1,12 +1,12 @@
 export * as copy from './copy/index.js'
-export * as generateSignedUrl from './generate-signed-url/index.js'
 export * as download from './download/index.js'
+export * as exists from './exists/index.js'
+export * as generateSignedUrl from './generate-signed-url/index.js'
 export * as getMetadata from './get-metadata/index.js'
 export * as getPermissions from './get-permissions/index.js'
 export * as move from './move/index.js'
 export * as remove from './remove/index.js'
-export * as stat from './stat/index.js'
 export * as revokeSignedUrls from './revoke-signed-urls/index.js'
-export * as exists from './exists/index.js'
+export * as stat from './stat/index.js'
 export * as updateMetadata from './update-metadata/index.js'
 export * as upload from './upload/index.js'

package/node/@google-cloud/storage/index.d.ts

@@ -1,3 +1,3 @@
 export * as bucket from './bucket/index.js'
-export * as file from './file/index.js'
 export * as directory from './directory/index.js'
+export * as file from './file/index.js'

package/node/@google-cloud/storage/index.js

@@ -1,3 +1,3 @@
 export * as bucket from './bucket/index.js'
-export * as file from './file/index.js'
 export * as directory from './directory/index.js'
+export * as file from './file/index.js'

package/node/cloud-storage/operations/index.d.ts

@@ -1,6 +1,6 @@
 export * as copyDir from './copy-dir/index.js'
-export * as copyFile from './copy-file/index.js'
 export * as downloadFile from './download-file/index.js'
+export * as copyFile from './copy-file/index.js'
 export * as existsFile from './exists-file/index.js'
 export * as listDir from './list-dir/index.js'
 export * as moveDir from './move-dir/index.js'

package/node/cloud-storage/operations/index.js

@@ -1,6 +1,6 @@
 export * as copyDir from './copy-dir/index.js'
-export * as copyFile from './copy-file/index.js'
 export * as downloadFile from './download-file/index.js'
+export * as copyFile from './copy-file/index.js'
 export * as existsFile from './exists-file/index.js'
 export * as listDir from './list-dir/index.js'
 export * as moveDir from './move-dir/index.js'

package/node/ftps/directory/index.d.ts

@@ -1,4 +1,4 @@
 export * as copyDir from './copy-dir/index.js'
 export * as list from './list/index.js'
-export * as moveDir from './move-dir/index.js'
 export * as removeDir from './remove-dir/index.js'
+export * as moveDir from './move-dir/index.js'

package/node/ftps/directory/index.js

@@ -1,4 +1,4 @@
 export * as copyDir from './copy-dir/index.js'
 export * as list from './list/index.js'
-export * as moveDir from './move-dir/index.js'
 export * as removeDir from './remove-dir/index.js'
+export * as moveDir from './move-dir/index.js'

package/node/images/index.d.ts

@@ -1,5 +1,5 @@
 export * as create from './create/index.js'
 export * as format from './format/index.js'
-export * as transform from './transform/index.js'
 export * as metadata from './metadata/index.js'
+export * as transform from './transform/index.js'
 export * as utils from './utils/index.js'

package/node/images/index.js

@@ -1,5 +1,5 @@
 export * as create from './create/index.js'
 export * as format from './format/index.js'
-export * as transform from './transform/index.js'
 export * as metadata from './metadata/index.js'
+export * as transform from './transform/index.js'
 export * as utils from './utils/index.js'

package/node/images/transform/operations/index.d.ts

@@ -4,12 +4,12 @@ export * as extend from './extend/index.js'
 export * as extract from './extract/index.js'
 export * as flatten from './flatten/index.js'
 export * as flip from './flip/index.js'
+export * as flop from './flop/index.js'
 export * as hue from './hue/index.js'
 export * as level from './level/index.js'
 export * as lighten from './lighten/index.js'
 export * as normalize from './normalize/index.js'
 export * as overlay from './overlay/index.js'
 export * as resize from './resize/index.js'
-export * as flop from './flop/index.js'
 export * as rotate from './rotate/index.js'
 export * as saturate from './saturate/index.js'

package/node/images/transform/operations/index.js

@@ -4,12 +4,12 @@ export * as extend from './extend/index.js'
 export * as extract from './extract/index.js'
 export * as flatten from './flatten/index.js'
 export * as flip from './flip/index.js'
+export * as flop from './flop/index.js'
 export * as hue from './hue/index.js'
 export * as level from './level/index.js'
 export * as lighten from './lighten/index.js'
 export * as normalize from './normalize/index.js'
 export * as overlay from './overlay/index.js'
 export * as resize from './resize/index.js'
-export * as flop from './flop/index.js'
 export * as rotate from './rotate/index.js'
 export * as saturate from './saturate/index.js'

package/node/index.d.ts

@@ -2,10 +2,10 @@ export * as awsS3 from './@aws-s3/index.js'
 export * as designEdito from './@design-edito/index.js'
 export * as express from './@express/index.js'
 export * as googleCloud from './@google-cloud/index.js'
-export * as cloudStorage from './cloud-storage/index.js'
 export * as encryption from './encryption/index.js'
 export * as files from './files/index.js'
 export * as ftps from './ftps/index.js'
+export * as cloudStorage from './cloud-storage/index.js'
 export * as images from './images/index.js'
 export * as process from './process/index.js'
 export * as sftp from './sftp/index.js'

package/node/index.js

@@ -2,10 +2,10 @@ export * as awsS3 from './@aws-s3/index.js'
 export * as designEdito from './@design-edito/index.js'
 export * as express from './@express/index.js'
 export * as googleCloud from './@google-cloud/index.js'
-export * as cloudStorage from './cloud-storage/index.js'
 export * as encryption from './encryption/index.js'
 export * as files from './files/index.js'
 export * as ftps from './ftps/index.js'
+export * as cloudStorage from './cloud-storage/index.js'
 export * as images from './images/index.js'
 export * as process from './process/index.js'
 export * as sftp from './sftp/index.js'

package/node/sftp/directory/index.d.ts

@@ -1,4 +1,4 @@
-export * as list from './list/index.js'
 export * as copyDir from './copy-dir/index.js'
+export * as list from './list/index.js'
 export * as moveDir from './move-dir/index.js'
 export * as removeDir from './remove-dir/index.js'

package/node/sftp/directory/index.js

@@ -1,4 +1,4 @@
-export * as list from './list/index.js'
 export * as copyDir from './copy-dir/index.js'
+export * as list from './list/index.js'
 export * as moveDir from './move-dir/index.js'
 export * as removeDir from './remove-dir/index.js'

package/node/sftp/file/index.d.ts

@@ -2,6 +2,6 @@ export * as copy from './copy/index.js'
 export * as download from './download/index.js'
 export * as exists from './exists/index.js'
 export * as move from './move/index.js'
-export * as stat from './stat/index.js'
 export * as remove from './remove/index.js'
+export * as stat from './stat/index.js'
 export * as upload from './upload/index.js'

package/node/sftp/file/index.js

@@ -2,6 +2,6 @@ export * as copy from './copy/index.js'
 export * as download from './download/index.js'
 export * as exists from './exists/index.js'
 export * as move from './move/index.js'
-export * as stat from './stat/index.js'
 export * as remove from './remove/index.js'
+export * as stat from './stat/index.js'
 export * as upload from './upload/index.js'

package/node/sftp/index.d.ts

@@ -1,2 +1,2 @@
-export * as directory from './directory/index.js'
 export * as file from './file/index.js'
+export * as directory from './directory/index.js'

package/node/sftp/index.js

@@ -1,2 +1,2 @@
-export * as directory from './directory/index.js'
 export * as file from './file/index.js'
+export * as directory from './directory/index.js'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@design-edito/tools",
-  "version": "0.5.10",
+  "version": "0.5.11",
   "description": "",
   "author": "Maxime Fabas",
   "license": "ISC",