@design-edito/tools 0.5.12 → 0.5.14

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 dedupe from './dedupe/index.js'
 export * as make from './make/index.js'
-export * as randomPick from './random-pick/index.js'
 export * as shuffle from './shuffle/index.js'
+export * as randomPick from './random-pick/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 dedupe from './dedupe/index.js'
 export * as make from './make/index.js'
-export * as randomPick from './random-pick/index.js'
 export * as shuffle from './shuffle/index.js'
+export * as randomPick from './random-pick/index.js'

package/agnostic/colors/index.d.ts

@@ -8,5 +8,5 @@ export * as lerp from './lerp/index.js'
 export * as luminance from './luminance/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 tidy from './tidy/index.js'

package/agnostic/colors/index.js

@@ -8,5 +8,5 @@ export * as lerp from './lerp/index.js'
 export * as luminance from './luminance/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 tidy from './tidy/index.js'

package/agnostic/css/index.d.ts

@@ -1,6 +1,6 @@
 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 isValidCssClassName from './is-valid-css-class-name/index.js'

package/agnostic/css/index.js

@@ -1,6 +1,6 @@
 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 isValidCssClassName from './is-valid-css-class-name/index.js'

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

@@ -1,52 +1,52 @@
 export * as add from './add/index.js'
-export * as and from './and/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 at from './at/index.js'
-export * as clone from './clone/index.js'
 export * as call from './call/index.js'
+export * as clone from './clone/index.js'
 export * as deleteproperties from './deleteproperties/index.js'
 export * as equals from './equals/index.js'
-export * as getproperties from './getproperties/index.js'
 export * as getattribute from './getattribute/index.js'
 export * as getproperty from './getproperty/index.js'
+export * as getproperties from './getproperties/index.js'
 export * as hjparse from './hjparse/index.js'
 export * as hjstringify from './hjstringify/index.js'
 export * as if from './if/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 initialize from './initialize/index.js'
 export * as map from './map/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 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 print from './print/index.js'
 export * as pusheach from './pusheach/index.js'
 export * as recordtoarray from './recordtoarray/index.js'
 export * as removeattribute from './removeattribute/index.js'
 export * as removeclass from './removeclass/index.js'
 export * as renameproperty from './renameproperty/index.js'
 export * as replace from './replace/index.js'
-export * as select from './select/index.js'
 export * as set from './set/index.js'
-export * as setproperty from './setproperty/index.js'
+export * as select from './select/index.js'
 export * as setattribute from './setattribute/index.js'
+export * as setproperty from './setproperty/index.js'
 export * as split from './split/index.js'
-export * as sorton from './sorton/index.js'
 export * as spread from './spread/index.js'
 export * as toarray from './toarray/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 tonull from './tonull/index.js'
-export * as tonumber from './tonumber/index.js'
+export * as toelement from './toelement/index.js'
 export * as tonodelist from './tonodelist/index.js'
+export * as tonumber from './tonumber/index.js'
+export * as sorton from './sorton/index.js'
+export * as tonull from './tonull/index.js'
 export * as toref from './toref/index.js'
 export * as tostring from './tostring/index.js'
-export * as totext from './totext/index.js'
 export * as transformselected from './transformselected/index.js'
+export * as totext from './totext/index.js'
 export * as trim from './trim/index.js'
 export * as torecord from './torecord/index.js'

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

@@ -1,52 +1,52 @@
 export * as add from './add/index.js'
-export * as and from './and/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 at from './at/index.js'
-export * as clone from './clone/index.js'
 export * as call from './call/index.js'
+export * as clone from './clone/index.js'
 export * as deleteproperties from './deleteproperties/index.js'
 export * as equals from './equals/index.js'
-export * as getproperties from './getproperties/index.js'
 export * as getattribute from './getattribute/index.js'
 export * as getproperty from './getproperty/index.js'
+export * as getproperties from './getproperties/index.js'
 export * as hjparse from './hjparse/index.js'
 export * as hjstringify from './hjstringify/index.js'
 export * as if from './if/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 initialize from './initialize/index.js'
 export * as map from './map/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 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 print from './print/index.js'
 export * as pusheach from './pusheach/index.js'
 export * as recordtoarray from './recordtoarray/index.js'
 export * as removeattribute from './removeattribute/index.js'
 export * as removeclass from './removeclass/index.js'
 export * as renameproperty from './renameproperty/index.js'
 export * as replace from './replace/index.js'
-export * as select from './select/index.js'
 export * as set from './set/index.js'
-export * as setproperty from './setproperty/index.js'
+export * as select from './select/index.js'
 export * as setattribute from './setattribute/index.js'
+export * as setproperty from './setproperty/index.js'
 export * as split from './split/index.js'
-export * as sorton from './sorton/index.js'
 export * as spread from './spread/index.js'
 export * as toarray from './toarray/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 tonull from './tonull/index.js'
-export * as tonumber from './tonumber/index.js'
+export * as toelement from './toelement/index.js'
 export * as tonodelist from './tonodelist/index.js'
+export * as tonumber from './tonumber/index.js'
+export * as sorton from './sorton/index.js'
+export * as tonull from './tonull/index.js'
 export * as toref from './toref/index.js'
 export * as tostring from './tostring/index.js'
-export * as totext from './totext/index.js'
 export * as transformselected from './transformselected/index.js'
+export * as totext from './totext/index.js'
 export * as trim from './trim/index.js'
 export * as torecord from './torecord/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 element from './element/index.js'
+export * as boolean from './boolean/index.js'
 export * as guess from './guess/index.js'
 export * as get from './get/index.js'
+export * as element from './element/index.js'
 export * as nodelist from './nodelist/index.js'
+export * as number from './number/index.js'
 export * as null from './null/index.js'
 export * as record from './record/index.js'
+export * as ref from './ref/index.js'
 export * as string from './string/index.js'
 export * as text from './text/index.js'
-export * as ref from './ref/index.js'
-export * as number from './number/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 element from './element/index.js'
+export * as boolean from './boolean/index.js'
 export * as guess from './guess/index.js'
 export * as get from './get/index.js'
+export * as element from './element/index.js'
 export * as nodelist from './nodelist/index.js'
+export * as number from './number/index.js'
 export * as null from './null/index.js'
 export * as record from './record/index.js'
+export * as ref from './ref/index.js'
 export * as string from './string/index.js'
 export * as text from './text/index.js'
-export * as ref from './ref/index.js'
-export * as number from './number/index.js'

package/agnostic/html/index.d.ts

@@ -1,10 +1,10 @@
 export * as deepSelect from './deep-select/index.js'
+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 getNodeAncestors from './get-node-ancestors/index.js'
 export * as insertNode from './insert-node/index.js'
-export * as replaceInElement from './replace-in-element/index.js'
 export * as placeholders from './placeholders/index.js'
-export * as selectorToElement from './selector-to-element/index.js'
+export * as replaceInElement from './replace-in-element/index.js'
 export * as stringToNodes from './string-to-nodes/index.js'
+export * as selectorToElement from './selector-to-element/index.js'
 export * as watchSelection from './watch-selection/index.js'

package/agnostic/html/index.js

@@ -1,10 +1,10 @@
 export * as deepSelect from './deep-select/index.js'
+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 getNodeAncestors from './get-node-ancestors/index.js'
 export * as insertNode from './insert-node/index.js'
-export * as replaceInElement from './replace-in-element/index.js'
 export * as placeholders from './placeholders/index.js'
-export * as selectorToElement from './selector-to-element/index.js'
+export * as replaceInElement from './replace-in-element/index.js'
 export * as stringToNodes from './string-to-nodes/index.js'
+export * as selectorToElement from './selector-to-element/index.js'
 export * as watchSelection from './watch-selection/index.js'

package/agnostic/index.d.ts

@@ -2,16 +2,16 @@ export * as arrays from './arrays/index.js'
 export * as booleans from './booleans/index.js'
 export * as colors from './colors/index.js'
 export * as css from './css/index.js'
-export * as errors from './errors/index.js'
 export * as html from './html/index.js'
+export * as errors from './errors/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 misc from './misc/index.js'
 export * as optim from './optim/index.js'
 export * as random from './random/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 time from './time/index.js'
+export * as subtitles from './subtitles/index.js'
 export * as typescript from './typescript/index.js'

package/agnostic/index.js

@@ -2,16 +2,16 @@ export * as arrays from './arrays/index.js'
 export * as booleans from './booleans/index.js'
 export * as colors from './colors/index.js'
 export * as css from './css/index.js'
-export * as errors from './errors/index.js'
 export * as html from './html/index.js'
+export * as errors from './errors/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 misc from './misc/index.js'
 export * as optim from './optim/index.js'
 export * as random from './random/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 time from './time/index.js'
+export * as subtitles from './subtitles/index.js'
 export * as typescript from './typescript/index.js'

package/agnostic/misc/index.d.ts

@@ -1,11 +1,11 @@
-export * as assert from './assert/index.js'
 export * as cast from './cast/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 assert from './assert/index.js'
 export * as dataSize from './data-size/index.js'
-export * as isConstructorFunction from './is-constructor-function/index.js'
 export * as isNullish from './is-nullish/index.js'
+export * as crossenv from './crossenv/index.js'
+export * as isConstructorFunction from './is-constructor-function/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'

package/agnostic/misc/index.js

@@ -1,11 +1,11 @@
-export * as assert from './assert/index.js'
 export * as cast from './cast/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 assert from './assert/index.js'
 export * as dataSize from './data-size/index.js'
-export * as isConstructorFunction from './is-constructor-function/index.js'
 export * as isNullish from './is-nullish/index.js'
+export * as crossenv from './crossenv/index.js'
+export * as isConstructorFunction from './is-constructor-function/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'

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

@@ -1,3 +1,3 @@
 export * as logger from './logger/index.js'
-export * as styles from './styles/index.js'
 export * as makeTextBlock from './make-text-block/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 styles from './styles/index.js'
 export * as makeTextBlock from './make-text-block/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 interpolate from './interpolate/index.js'
+export * as approximateRational from './approximate-rational/index.js'
 export * as geometricProgressions from './geometric-progressions/index.js'
 export * as round from './round/index.js'
+export * as interpolate from './interpolate/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 interpolate from './interpolate/index.js'
+export * as approximateRational from './approximate-rational/index.js'
 export * as geometricProgressions from './geometric-progressions/index.js'
 export * as round from './round/index.js'
+export * as interpolate from './interpolate/index.js'

package/agnostic/objects/index.d.ts

@@ -2,8 +2,8 @@ export * as deepGetProperty from './deep-get-property/index.js'
 export * as enums from './enums/index.js'
 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 recordMap from './record-map/index.js'
 export * as sortKeys from './sort-keys/index.js'
 export * as validation from './validation/index.js'
+export * as isRecord from './is-record/index.js'

package/agnostic/objects/index.js

@@ -2,8 +2,8 @@ export * as deepGetProperty from './deep-get-property/index.js'
 export * as enums from './enums/index.js'
 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 recordMap from './record-map/index.js'
 export * as sortKeys from './sort-keys/index.js'
 export * as validation from './validation/index.js'
+export * as isRecord from './is-record/index.js'

package/agnostic/random/index.d.ts

@@ -1,3 +1,3 @@
-export * as hexChar from './hex-char/index.js'
 export * as random from './random/index.js'
 export * as uuid from './uuid/index.js'
+export * as hexChar from './hex-char/index.js'

package/agnostic/random/index.js

@@ -1,3 +1,3 @@
-export * as hexChar from './hex-char/index.js'
 export * as random from './random/index.js'
 export * as uuid from './uuid/index.js'
+export * as hexChar from './hex-char/index.js'

package/agnostic/strings/index.d.ts

@@ -3,6 +3,6 @@ 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 splitTrim from './split-trim/index.js'
 export * as trim from './trim/index.js'

package/agnostic/strings/index.js

@@ -3,6 +3,6 @@ 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 splitTrim from './split-trim/index.js'
 export * as trim from './trim/index.js'

package/agnostic/subtitles/index.d.ts

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

package/agnostic/subtitles/index.js

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

package/agnostic/time/index.d.ts

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

package/agnostic/time/index.js

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

package/components/Video/index.controlled.d.ts

@@ -85,6 +85,12 @@ type TrackData = {
  * fullscreen on its own — pressing Escape, typically — with the new state. This is
  * the signal a parent needs to update its `fullscreen` prop, and it is distinct
  * from `onIsFullscreenChanged`, which merely echoes that prop back once changed.
+ * @property timeFormat - How the two clocks are written, as a {@link formatTime}
+ * pattern. Tokens go in `{{…}}` and the rest is literal, so `'{{m}} min {{ss}}'` is a
+ * valid answer. Defaults to `'{{mm}}:{{ss}}:{{ms}}'` — milliseconds included, which is
+ * what a cutting room wants and almost never what an article does: `'{{mm}}:{{ss}}'` is
+ * the usual one. Frames (`{{frame}}`, `{{f}}`) are derived at 25 fps, not configurable
+ * here.
  * @property className - Additional CSS class for the root element.
  * @property children - React content inserted into the <video> tag (fallback, etc).
  *
@@ -105,6 +111,7 @@ export type Props = PropsWithChildren<WithClassName<{
     mute?: boolean;
     playbackRate?: number;
     currentTimeMs?: number;
+    timeFormat?: string;
     onPlayButtonClicked?: (e: React.MouseEvent<HTMLButtonElement>, isPlaying: boolean, video: HTMLVideoElement | null) => void;
     onPauseButtonClicked?: (e: React.MouseEvent<HTMLButtonElement>, isPlaying: boolean, video: HTMLVideoElement | null) => void;
     onLoudButtonClicked?: (e: React.MouseEvent<HTMLButtonElement>, isLoud: boolean, video: HTMLVideoElement | null) => void;

package/components/Video/index.controlled.js

@@ -49,7 +49,11 @@ import { forceExitFullscreen, forceFullscreen, forceLoud, forceMute, forcePause,
  * @returns A `<figure>` element containing the video, its controls, optional
  * subtitles.
  */
-export const ControlledVideo = ({ sources, tracks, subtitles, playBtnContent, pauseBtnContent, loudBtnContent, muteBtnContent, fullscreenBtnContent, play, fullscreen, mute, muted, volume = 1, playbackRate = 1, currentTimeMs: givenCurrentTimeMs, onPlayButtonClicked, onPauseButtonClicked, onLoudButtonClicked, onMuteButtonClicked, onVolumeRangeChanged, onRateRangeChanged, onFullscreenButtonClicked, onTimelineClicked, onIsPlayingChanged, onIsFullscreenChanged, onIsLoudChanged, onIsEndedChanged, onVolumeChanged, onPlaybackRateChanged, onCurrentTimeMsChanged, onFullscreenChange, children, className, ...intrinsicVideoAttributes }) => {
+export const ControlledVideo = ({ sources, tracks, subtitles, playBtnContent, pauseBtnContent, loudBtnContent, muteBtnContent, fullscreenBtnContent, play, fullscreen, mute, muted, volume = 1, playbackRate = 1, currentTimeMs: givenCurrentTimeMs, 
+// Milliseconds by default, which is what this component has always rendered — a
+// default that changes under a consumer is a change nobody asked for. An article
+// usually wants `'{{mm}}:{{ss}}'` and says so.
+timeFormat = '{{mm}}:{{ss}}:{{ms}}', onPlayButtonClicked, onPauseButtonClicked, onLoudButtonClicked, onMuteButtonClicked, onVolumeRangeChanged, onRateRangeChanged, onFullscreenButtonClicked, onTimelineClicked, onIsPlayingChanged, onIsFullscreenChanged, onIsLoudChanged, onIsEndedChanged, onVolumeChanged, onPlaybackRateChanged, onCurrentTimeMsChanged, onFullscreenChange, children, className, ...intrinsicVideoAttributes }) => {
     const videoRef = useRef(null);
     const [totalTime, setTotalTime] = useState(0);
     const totalTimeMs = useMemo(() => secondsToMs(totalTime), [totalTime]);
@@ -302,5 +306,5 @@ export const ControlledVideo = ({ sources, tracks, subtitles, playBtnContent, pa
                         ? _jsx("source", { src: source }, index)
                         : _jsx("source", { src: source.src, type: source.type }, index)), parsedTracks.map((track, index) => typeof track === 'string'
                         ? _jsx("track", { src: track }, index)
-                        : _jsx("track", { src: track.src, kind: track.kind, srcLang: track.srclang, label: track.label, default: track.default }, index)), children] }), _jsxs("div", { className: videoControlsClss, children: [_jsx("button", { className: playBtnClss, onClick: handlePlayButtonClick, children: playBtnContent }), _jsx("button", { className: pauseBtnClss, onClick: handlePauseButtonClick, children: pauseBtnContent }), _jsx("button", { className: loudBtnClss, onClick: handleLoudButtonClick, children: loudBtnContent }), _jsx("button", { className: muteBtnClss, onClick: handleMuteButtonClick, children: muteBtnContent }), _jsx("input", { type: 'range', className: volumeRangeClss, value: volumePercent, onChange: handleVolumeRangeChange, min: 0, max: 100, step: 1 }), _jsx("span", { className: volumePcntClss, children: Math.round(volumePercent) }), _jsx("button", { className: fullscreenBtnClss, onClick: handleFullscreenButtonClick, children: fullscreenBtnContent }), _jsx("input", { type: 'range', className: playbackRateRangeClss, value: playbackRate, onChange: handleRateRangeChange, min: 0.25, max: 4, step: 0.25 }), _jsx("span", { className: playbackRateClss, children: playbackRate })] }), _jsxs("div", { className: timeControlsClss, children: [_jsx("span", { className: currentTimeClss, children: formatTime(currentTimeMs, 'mm:ss:ms') }), _jsx("span", { className: totalTimeClss, children: formatTime(totalTimeMs, 'mm:ss:ms') }), _jsx("div", { className: timelineClss, onClick: handleTimelineClick })] }), subtitles !== undefined && _jsx(Subtitles, { ...subtitles, timecodeMs: currentTimeMs, isEnded: isEnded })] });
+                        : _jsx("track", { src: track.src, kind: track.kind, srcLang: track.srclang, label: track.label, default: track.default }, index)), children] }), _jsxs("div", { className: videoControlsClss, children: [_jsx("button", { className: playBtnClss, onClick: handlePlayButtonClick, children: playBtnContent }), _jsx("button", { className: pauseBtnClss, onClick: handlePauseButtonClick, children: pauseBtnContent }), _jsx("button", { className: loudBtnClss, onClick: handleLoudButtonClick, children: loudBtnContent }), _jsx("button", { className: muteBtnClss, onClick: handleMuteButtonClick, children: muteBtnContent }), _jsx("input", { type: 'range', className: volumeRangeClss, value: volumePercent, onChange: handleVolumeRangeChange, min: 0, max: 100, step: 1 }), _jsx("span", { className: volumePcntClss, children: Math.round(volumePercent) }), _jsx("button", { className: fullscreenBtnClss, onClick: handleFullscreenButtonClick, children: fullscreenBtnContent }), _jsx("input", { type: 'range', className: playbackRateRangeClss, value: playbackRate, onChange: handleRateRangeChange, min: 0.25, max: 4, step: 0.25 }), _jsx("span", { className: playbackRateClss, children: playbackRate })] }), _jsxs("div", { className: timeControlsClss, children: [_jsx("span", { className: currentTimeClss, children: formatTime(currentTimeMs, timeFormat) }), _jsx("span", { className: totalTimeClss, children: formatTime(totalTimeMs, timeFormat) }), _jsx("div", { className: timelineClss, onClick: handleTimelineClick })] }), subtitles !== undefined && _jsx(Subtitles, { ...subtitles, timecodeMs: currentTimeMs, isEnded: isEnded })] });
 };

package/components/Video/utils.d.ts

@@ -20,33 +20,35 @@ export declare const forceFullscreen: (video: HTMLVideoElement | null) => Promis
 export declare const forceExitFullscreen: (video: HTMLVideoElement | null) => Promise<boolean>;
 export declare function secondsToMs(seconds: number): number;
 export declare function msToSeconds(ms: number): number;
+/** The fields {@link formatTime} knows how to render. */
+export type TimeToken = 'hh' | 'mm' | 'ss' | 'ms' | 'frame' | 'h' | 'm' | 's' | 'f';
 /**
  * Renders a duration into a caller-defined pattern.
  *
- * The pattern is a free-form string in which the following tokens are replaced,
- * longest first, so that `mm` is consumed before `m`:
+ * Tokens are wrapped in `{{…}}` and everything outside them is literal, so a pattern
+ * may carry words: `'{{m}} min {{ss}}'` renders as `'1 min 05'`.
  *
- * - `hh`, `mm`, `ss` — hours, minutes and seconds, zero-padded to two digits.
- * - `ms` — the remaining milliseconds, zero-padded to three digits.
- * - `frame` — the remaining milliseconds expressed in frames, zero-padded to two
- *   digits.
- * - `h`, `m`, `s`, `f` — the same four values, unpadded.
+ * - `{{hh}}`, `{{mm}}`, `{{ss}}` — hours, minutes and seconds, zero-padded to two digits.
+ * - `{{ms}}` — the remaining milliseconds, zero-padded to three digits.
+ * - `{{frame}}` — those milliseconds expressed in frames, zero-padded to two digits.
+ * - `{{h}}`, `{{m}}`, `{{s}}`, `{{f}}` — the same four values, unpadded.
  *
  * @param ms - The duration, in milliseconds.
- * @param format - The pattern to fill, e.g. `'mm:ss:ms'`.
+ * @param format - The pattern to fill, e.g. `'{{mm}}:{{ss}}'`.
  * @param fps - Frame rate used to derive the `frame` and `f` tokens. Defaults to `25`.
- * @returns The formatted duration.
+ * @returns The formatted duration. An unknown token is left as written, braces
+ *   included, rather than silently blanked — a typo has to be visible.
  *
  * @remarks
- * Every field is a remainder of the one above it, never a total: at one hour and
- * a half, `mm` is `30`, not `90`. A pattern that omits `hh` therefore loses the
- * hours rather than folding them into the minutes.
+ * Every field is a remainder of the one above it, never a total: at one hour and a half,
+ * `{{mm}}` is `30`, not `90`. A pattern that omits `{{hh}}` therefore loses the hours
+ * rather than folding them into the minutes.
  *
- * Since `h`, `m`, `s` and `f` are tokens on their own, **every** occurrence of
- * those letters is substituted, wherever it sits: `'mm min ss'` renders as
- * `'01 1in 01'`. Separate the fields with punctuation. This is what
- * `agnostic/time/dates/format-date` avoids by delimiting its tokens with
- * `{{…}}` — worth aligning on the day this one is made public.
+ * **The delimiters are what make the pattern free-form.** Until they existed, `h`, `m`,
+ * `s` and `f` were tokens on their own and every occurrence of those letters was
+ * substituted wherever it sat — `'mm min ss'` rendered as `'01 1in 01'`, so a pattern
+ * could only ever separate its fields with punctuation. That is why the format could not
+ * be exposed as a prop: doing so would have published the trap.
  */
 export declare function formatTime(ms: number, format: string, fps?: number): string;
 /**

package/components/Video/utils.js

@@ -107,33 +107,37 @@ export function secondsToMs(seconds) {
 export function msToSeconds(ms) {
     return ms / 1000;
 }
+// Alternation is ordered and the first branch that fits wins, so the longest tokens
+// come first — the same regexp shape, and the same reason, as
+// `agnostic/time/dates/format-date`.
+const timeTokenRegexp = /\{\{(frame|hh|mm|ss|ms|h|m|s|f)\}\}/gv;
 /**
  * Renders a duration into a caller-defined pattern.
  *
- * The pattern is a free-form string in which the following tokens are replaced,
- * longest first, so that `mm` is consumed before `m`:
+ * Tokens are wrapped in `{{…}}` and everything outside them is literal, so a pattern
+ * may carry words: `'{{m}} min {{ss}}'` renders as `'1 min 05'`.
  *
- * - `hh`, `mm`, `ss` — hours, minutes and seconds, zero-padded to two digits.
- * - `ms` — the remaining milliseconds, zero-padded to three digits.
- * - `frame` — the remaining milliseconds expressed in frames, zero-padded to two
- *   digits.
- * - `h`, `m`, `s`, `f` — the same four values, unpadded.
+ * - `{{hh}}`, `{{mm}}`, `{{ss}}` — hours, minutes and seconds, zero-padded to two digits.
+ * - `{{ms}}` — the remaining milliseconds, zero-padded to three digits.
+ * - `{{frame}}` — those milliseconds expressed in frames, zero-padded to two digits.
+ * - `{{h}}`, `{{m}}`, `{{s}}`, `{{f}}` — the same four values, unpadded.
  *
  * @param ms - The duration, in milliseconds.
- * @param format - The pattern to fill, e.g. `'mm:ss:ms'`.
+ * @param format - The pattern to fill, e.g. `'{{mm}}:{{ss}}'`.
  * @param fps - Frame rate used to derive the `frame` and `f` tokens. Defaults to `25`.
- * @returns The formatted duration.
+ * @returns The formatted duration. An unknown token is left as written, braces
+ *   included, rather than silently blanked — a typo has to be visible.
  *
  * @remarks
- * Every field is a remainder of the one above it, never a total: at one hour and
- * a half, `mm` is `30`, not `90`. A pattern that omits `hh` therefore loses the
- * hours rather than folding them into the minutes.
+ * Every field is a remainder of the one above it, never a total: at one hour and a half,
+ * `{{mm}}` is `30`, not `90`. A pattern that omits `{{hh}}` therefore loses the hours
+ * rather than folding them into the minutes.
  *
- * Since `h`, `m`, `s` and `f` are tokens on their own, **every** occurrence of
- * those letters is substituted, wherever it sits: `'mm min ss'` renders as
- * `'01 1in 01'`. Separate the fields with punctuation. This is what
- * `agnostic/time/dates/format-date` avoids by delimiting its tokens with
- * `{{…}}` — worth aligning on the day this one is made public.
+ * **The delimiters are what make the pattern free-form.** Until they existed, `h`, `m`,
+ * `s` and `f` were tokens on their own and every occurrence of those letters was
+ * substituted wherever it sat — `'mm min ss'` rendered as `'01 1in 01'`, so a pattern
+ * could only ever separate its fields with punctuation. That is why the format could not
+ * be exposed as a prop: doing so would have published the trap.
  */
 export function formatTime(ms, format, fps = 25) {
     const totalSeconds = Math.floor(ms / 1000);
@@ -142,21 +146,24 @@ export function formatTime(ms, format, fps = 25) {
     const seconds = Math.floor(totalSeconds % 60);
     const frames = Math.floor(((ms % 1000) / 1000) * fps);
     const msRest = Math.floor(ms % 1000);
+    // Typed by {@link TimeToken} so the table and the regexp above cannot fall out of step,
+    // then read through a widened view: the capture is a `string` as far as the compiler
+    // knows, and widening is what lets it be looked up without asserting it back.
     const tokens = {
         hh: String(hours).padStart(2, '0'),
         mm: String(minutes).padStart(2, '0'),
         ss: String(seconds).padStart(2, '0'),
         frame: String(frames).padStart(2, '0'),
         ms: String(msRest).padStart(3, '0'),
-        h: hours,
-        m: minutes,
-        s: seconds,
-        f: frames
+        h: String(hours),
+        m: String(minutes),
+        s: String(seconds),
+        f: String(frames)
     };
-    return Object
-        .keys(tokens)
-        .sort((a, b) => b.length - a.length)
-        .reduce((acc, t) => acc.replace(new RegExp(t, 'gv'), String(tokens[t])), format);
+    const byName = tokens;
+    // One pass, so a rendered value can never be re-read as a token by a later pass — the
+    // reason the old implementation had to sort its keys by length.
+    return format.replace(timeTokenRegexp, (whole, token) => byName[token] ?? whole);
 }
 /**
  * Where along the timeline a click landed.

package/components/index.d.ts

@@ -10,12 +10,12 @@ export * as image from './Image/index.js'
 export * as input from './Input/index.js'
 export * as intersectionObserver from './IntersectionObserver/index.js'
 export * as jsonEditor from './JsonEditor/index.js'
-export * as listLoader from './ListLoader/index.js'
 export * as lightbox from './Lightbox/index.js'
+export * as listLoader from './ListLoader/index.js'
 export * as overlayer from './Overlayer/index.js'
-export * as scrllgngn from './Scrllgngn/index.js'
 export * as paginator from './Paginator/index.js'
 export * as resizeObserver from './ResizeObserver/index.js'
+export * as scrllgngn from './Scrllgngn/index.js'
 export * as scrollListener from './ScrollListener/index.js'
 export * as select from './Select/index.js'
 export * as sequencer from './Sequencer/index.js'

package/components/index.js

@@ -10,12 +10,12 @@ export * as image from './Image/index.js'
 export * as input from './Input/index.js'
 export * as intersectionObserver from './IntersectionObserver/index.js'
 export * as jsonEditor from './JsonEditor/index.js'
-export * as listLoader from './ListLoader/index.js'
 export * as lightbox from './Lightbox/index.js'
+export * as listLoader from './ListLoader/index.js'
 export * as overlayer from './Overlayer/index.js'
-export * as scrllgngn from './Scrllgngn/index.js'
 export * as paginator from './Paginator/index.js'
 export * as resizeObserver from './ResizeObserver/index.js'
+export * as scrllgngn from './Scrllgngn/index.js'
 export * as scrollListener from './ScrollListener/index.js'
 export * as select from './Select/index.js'
 export * as sequencer from './Sequencer/index.js'

package/node/@aws-s3/storage/file/index.d.ts

@@ -1,7 +1,7 @@
 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 remove from './remove/index.js'
+export * as move from './move/index.js'
 export * as stat from './stat/index.js'
 export * as upload from './upload/index.js'

package/node/@aws-s3/storage/file/index.js

@@ -1,7 +1,7 @@
 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 remove from './remove/index.js'
+export * as move from './move/index.js'
 export * as stat from './stat/index.js'
 export * as upload from './upload/index.js'

package/node/@google-cloud/storage/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/@google-cloud/storage/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/@google-cloud/storage/file/index.d.ts

@@ -2,11 +2,11 @@ export * as copy from './copy/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 getMetadata from './get-metadata/index.js'
 export * as remove from './remove/index.js'
-export * as revokeSignedUrls from './revoke-signed-urls/index.js'
+export * as move from './move/index.js'
 export * as stat from './stat/index.js'
-export * as updateMetadata from './update-metadata/index.js'
+export * as revokeSignedUrls from './revoke-signed-urls/index.js'
 export * as upload from './upload/index.js'
+export * as updateMetadata from './update-metadata/index.js'

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

@@ -2,11 +2,11 @@ export * as copy from './copy/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 getMetadata from './get-metadata/index.js'
 export * as remove from './remove/index.js'
-export * as revokeSignedUrls from './revoke-signed-urls/index.js'
+export * as move from './move/index.js'
 export * as stat from './stat/index.js'
-export * as updateMetadata from './update-metadata/index.js'
+export * as revokeSignedUrls from './revoke-signed-urls/index.js'
 export * as upload from './upload/index.js'
+export * as updateMetadata from './update-metadata/index.js'

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

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

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

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

package/node/encryption/@aes-256-gcm/index.d.ts

@@ -1,2 +1,2 @@
-export * as buffer from './buffer/index.js'
 export * as uint8Array from './uint8-array/index.js'
+export * as buffer from './buffer/index.js'

package/node/encryption/@aes-256-gcm/index.js

@@ -1,2 +1,2 @@
-export * as buffer from './buffer/index.js'
 export * as uint8Array from './uint8-array/index.js'
+export * as buffer from './buffer/index.js'

package/node/process/index.d.ts

@@ -1,3 +1,3 @@
-export * as onExit from './on-exit/index.js'
 export * as promptContinue from './prompt-continue/index.js'
+export * as onExit from './on-exit/index.js'
 export * as spawner from './spawner/index.js'

package/node/process/index.js

@@ -1,3 +1,3 @@
-export * as onExit from './on-exit/index.js'
 export * as promptContinue from './prompt-continue/index.js'
+export * as onExit from './on-exit/index.js'
 export * as spawner from './spawner/index.js'

package/node/process/spawner/index.d.ts

@@ -5,9 +5,33 @@ type Output = {
     stderr: string;
     err: unknown;
 };
+/**
+ * How much a spawned command says about itself.
+ *
+ * Three levels rather than a boolean, because three are genuinely useful in a
+ * deployment script:
+ *
+ * - `'full'` — the label, the echoed command line, and the child's own output as it
+ *   streams. The default, and what to use for anything whose output is news: a build
+ *   log, an rsync diff.
+ * - `'command'` — the label and the echoed command line, without the child's output.
+ *   **The level for a probe** — `gcloud projects list`, `npm config get registry` —
+ *   whose `stdout` is parsed rather than read, and whose two hundred lines of table
+ *   would bury the narration around it. The echo stays: it is the audit trail, and
+ *   the last thing worth losing.
+ * - `'silent'` — nothing at all. Only for a call already narrated by whatever step
+ *   contains it.
+ *
+ * Nothing here is read from the environment on purpose. A deployment that can be run
+ * quietly is a deployment whose log you do not have when it breaks, so the choice is
+ * made per call, in the source, by whoever knows what that call prints.
+ */
+export type Verbosity = 'full' | 'command' | 'silent';
 type ThisOptions = {
     argsPrintFormat?: (args: string[]) => string[];
     throwOnError?: boolean;
+    /** How much to print. Defaults to `'full'`. See {@link Verbosity}. */
+    verbosity?: Verbosity;
 };
 /**
  * Options for the asynchronous `spawner` function.
@@ -18,6 +42,7 @@ type ThisOptions = {
  *   before they are printed to the console (does not affect execution).
  * - `throwOnError`: If `true`, the function throws when the spawned process exits
  *   with a non-zero status instead of returning a failure outcome.
+ * - `verbosity`: How much to print — see {@link Verbosity}. Defaults to `'full'`.
  */
 export type Options = SpawnOptions & ThisOptions;
 /**
@@ -29,6 +54,7 @@ export type Options = SpawnOptions & ThisOptions;
  *   before they are printed to the console (does not affect execution).
  * - `throwOnError`: If `true`, the function throws when the spawned process exits
  *   with a non-zero status instead of returning a failure outcome.
+ * - `verbosity`: How much to print — see {@link Verbosity}. Defaults to `'full'`.
  */
 export type SyncOptions = SpawnSyncOptions & ThisOptions;
 /**

package/node/process/spawner/index.js

@@ -22,13 +22,17 @@ import { unknownToString } from '../../../agnostic/errors/unknown-to-string/inde
  *   - failure: `{ stdout, stderr, err }` when the command exits with a non-zero code
  */
 export async function spawner(label, command, args, options) {
+    const verbosity = options?.verbosity ?? 'full';
+    const printsCommand = verbosity !== 'silent';
+    const printsOutput = verbosity === 'full';
     return await new Promise((resolve, reject) => {
-        if (label !== null)
+        if (label !== null && printsCommand)
             console.log(`\n${styles.info(label)}\n`);
         const printableArgs = options?.argsPrintFormat !== undefined
             ? options.argsPrintFormat(args)
             : args;
-        console.log(styles.light(`> ${command} ${printableArgs.join(' ')}\n`));
+        if (printsCommand)
+            console.log(styles.light(`> ${command} ${printableArgs.join(' ')}\n`));
         const prcss = spawn(command, args, { stdio: 'pipe', ...options });
         let stdout = '';
         let stderr = '';
@@ -36,13 +40,17 @@ export async function spawner(label, command, args, options) {
         prcss.stdout?.on('data', data => {
             const strData = unknownToString(data);
             stdout += strData;
-            console.log(styles.light(strData.replace(ansiRegex(), '').trim()));
+            if (printsOutput)
+                console.log(styles.light(strData.replace(ansiRegex(), '').trim()));
         });
         prcss.stderr?.on('data', data => {
             const strData = unknownToString(data);
             stderr += strData;
-            console.log(styles.warning(strData.replace(ansiRegex(), '').trim()));
+            if (printsOutput)
+                console.log(styles.warning(strData.replace(ansiRegex(), '').trim()));
         });
+        // An error is always printed, whatever the verbosity: a command that could not be
+        // spawned at all is never the noise the caller asked to be spared.
         prcss.on('error', e => {
             err = e;
             console.log(styles.error(unknownToString(err).replace(ansiRegex(), '').trim()));
@@ -75,27 +83,32 @@ export async function spawner(label, command, args, options) {
  * @throws Error if `throwOnError` is `true` and the process exits with a non-zero status
  */
 export function spawnerSync(label, command, args, options) {
-    if (label !== null)
+    const verbosity = options?.verbosity ?? 'full';
+    const printsCommand = verbosity !== 'silent';
+    const printsOutput = verbosity === 'full';
+    if (label !== null && printsCommand)
         console.log(`\n${styles.info(label)}\n}`);
     const printableArgs = options?.argsPrintFormat !== undefined
         ? options.argsPrintFormat(args)
         : args;
-    console.log(styles.light(`> ${command} ${printableArgs.join(' ')}\n`));
+    if (printsCommand)
+        console.log(styles.light(`> ${command} ${printableArgs.join(' ')}\n`));
     const result = spawnSync(command, args, { stdio: 'pipe', encoding: 'utf8', ...options });
     const stderr = result.stderr.toString().trim();
     const stdout = result.stdout.toString().trim();
     const err = result.error;
+    // Always printed, whatever the verbosity — see the async twin.
     if (err !== undefined) {
         console.log(styles.light(chalk.italic('err:\n')));
         console.log(styles.error(unknownToString(err).replace(ansiRegex(), '')));
         console.log('');
     }
-    if (stderr !== '') {
+    if (stderr !== '' && printsOutput) {
         console.log(styles.light(chalk.italic('stderr:\n')));
         console.log(styles.warning(stderr.replace(ansiRegex(), '')));
         console.log('');
     }
-    if (stdout !== '') {
+    if (stdout !== '' && printsOutput) {
         console.log(styles.light(chalk.italic('stdout:\n')));
         console.log(styles.light(stdout.replace(ansiRegex(), '')));
         console.log('');

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

@@ -1,7 +1,7 @@
 export * as copy from './copy/index.js'
 export * as download from './download/index.js'
-export * as move from './move/index.js'
 export * as exists from './exists/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 upload from './upload/index.js'

package/node/sftp/file/index.js

@@ -1,7 +1,7 @@
 export * as copy from './copy/index.js'
 export * as download from './download/index.js'
-export * as move from './move/index.js'
 export * as exists from './exists/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 upload from './upload/index.js'

package/package.json

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