From ef6043b9d32b240262f6a29b719c02a7f61a5066 Mon Sep 17 00:00:00 2001 From: Estelle Weyl Date: Wed, 8 Jul 2026 17:08:37 +0200 Subject: [PATCH 1/5] CSS overflow property description (#44340) * rejig overflow * rejig overflow * rejig overflow * make overlay non-standard * add content after examples * Apply suggestions from code review Co-authored-by: Vadim Makeev * Apply suggestions from code review Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Apply suggestions from code review Co-authored-by: Vadim Makeev * Update files/en-us/web/css/reference/properties/overflow/index.md Co-authored-by: Vadim Makeev * Apply suggestions from code review Co-authored-by: Vadim Makeev --------- Co-authored-by: Vadim Makeev Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .../reference/properties/overflow/index.md | 309 ++++++++++++++++-- 1 file changed, 290 insertions(+), 19 deletions(-) diff --git a/files/en-us/web/css/reference/properties/overflow/index.md b/files/en-us/web/css/reference/properties/overflow/index.md index a20556dfb5956b1..eaf1c0638c3c7a9 100644 --- a/files/en-us/web/css/reference/properties/overflow/index.md +++ b/files/en-us/web/css/reference/properties/overflow/index.md @@ -67,6 +67,8 @@ overflow: hidden; overflow: clip; overflow: scroll; overflow: auto; + +/* Two-value syntax: horizontal | vertical */ overflow: hidden visible; /* Global values */ @@ -77,37 +79,306 @@ overflow: revert-layer; overflow: unset; ``` -The `overflow` property is specified as one or two {{CSSXref("overflow_value", "<overflow>")}} keyword values. If only one keyword is specified, both `overflow-x` and `overflow-y` are set to the same value. If two keywords are specified, the first value applies to `overflow-x` in the horizontal direction and the second one applies to `overflow-y` in the vertical direction. +The `overflow` property is specified as one or two {{CSSXref("overflow_value", "<overflow>")}} keyword values. ### Values - `visible` - - : Overflow content is not clipped and may be visible outside the element's padding box. The element box is not a {{glossary("scroll container")}}. This is the default value of the `overflow` property. + - : Overflow content is not clipped and may be visible outside the element's padding box. The element box is not a {{glossary("scroll container")}}. This is the default value. - `hidden` - - : Overflow content is clipped at the element's padding box. There are no scroll bars, and the clipped content is not visible (i.e., clipped content is hidden), but the content still exists. User agents do not add scroll bars and also do not allow users to view the content outside the clipped region by actions such as dragging on a touch screen or using the scroll wheel on a mouse. The content _can_ be scrolled programmatically (for example, by linking to anchor text, by tabbing to a hidden yet focusable element, or by setting the value of the {{domxref("Element.scrollLeft", "scrollLeft")}} property or the {{domxref("Element.scrollTo", "scrollTo()")}} method), in which case the element box is a scroll container. + - : Overflow content is clipped at the element's padding box, hiding the clipped content. When overflowing, the element box is a {{glossary("scroll container")}} with no scroll bars; scrolling is still possible via other methods including tabbing to hidden focusable elements, properties such as {{domxref("Element.scrollLeft", "scrollLeft")}} property, and methods like {{domxref("Element.scrollTo", "scrollTo()")}}. - `clip` - - : Overflow content is clipped at the element's _overflow clip edge_ that is defined using the {{cssxref("overflow-clip-margin")}} property. As a result, content overflows the element's padding box by the {{cssxref("<length>")}} value of `overflow-clip-margin` or by `0px` if not set. Overflow content outside the clipped region is not visible, user agents do not add a scroll bar, and programmatic scrolling is also not supported. No new [formatting context](/en-US/docs/Web/CSS/Guides/Display/Block_formatting_context) is created. To establish a formatting context, use `overflow: clip` along with {{cssxref("display", "display: flow-root", "#flow-root")}}. The element box is not a scroll container. + - : Overflow content is clipped at the element's _overflow clip edge_ defined by the {{cssxref("overflow-clip-margin")}} property. The element box is not a scroll container, clipped content is not visible, and programmatic scrolling is not supported. - `scroll` - - : Overflow content is clipped at the element's padding box, and overflow content can be scrolled into view using scroll bars. User agents display scroll bars whether or not any content is overflowing, so in the horizontal and vertical directions if the value applies to both directions. The use of this keyword, therefore, can prevent scroll bars from appearing and disappearing as content changes. Printers may still print overflow content. The element box is a scroll container. + - : Overflow content is clipped at the element's padding box. Whether overflowing or not, the element box is always a scroll container displaying scroll bars. - `auto` - - : Overflow content is clipped at the element's padding box, and overflow content can be scrolled into view using scroll bars. Unlike `scroll`, user agents display scroll bars _only if_ the content is overflowing. If content fits inside the element's padding box, it looks the same as with `visible` but still establishes a new formatting context. The element box is a scroll container. + - : Overflow content is clipped at the element's padding box. When overflowing, the element box is a scroll container displaying scroll bars. + +#### Non-standard values + +Some non-standard values are also supported in some browsers: -> [!NOTE] -> The keyword value `overlay` is a legacy value alias for `auto`. With `overlay`, the scroll bars are drawn on top of the content instead of taking up space. +- `overlay` + - : A legacy alias for `auto`, defined in the specification for web compatibility. Originally implemented as a non-standard value to render scrollbars on top of content rather than taking up space. Its use in new code is discouraged. ## Description +By default, block-level elements grow to fit their content. If the size of a container is constrained, the content will overflow. The `overflow` property determines how a container handles content that overflows its edges. + +The `overflow` property is shorthand for the horizontal {{cssxref("overflow-x")}} and vertical {{cssxref("overflow-y")}} properties. If only one keyword is specified, both `overflow-x` and `overflow-y` are set to the same value. If two keywords are specified, the first value applies to `overflow-x` in the horizontal direction and the second one applies to `overflow-y` in the vertical direction. + Overflow options include hiding overflow content, enabling scroll bars to view overflow content or displaying the content flowing out of an element box into the surrounding area, and combinations there of. -The following nuances should be kept in mind while using the various keywords for `overflow`: +All values, except `visible` and `clip`, create a new [block formatting context](/en-US/docs/Web/CSS/Guides/Display/Block_formatting_context). The new block formatting context is necessary for scroll containers because if a float were to intersect with a scrolling element, it would forcibly rewrap the content after each scroll step, leading to a slow scrolling experience. + +### What creates overflow + +Overflow occurs when a block-level element has content that overflows its constrained space. The allotted space may be constrained by a height ({{cssxref("height")}} or {{cssxref("max-height")}}) for vertical overflow, a width ({{cssxref("width")}} or {{cssxref("max-width")}}) for horizontal overflow, a block-size ({{cssxref("block-size")}} or {{cssxref("max-block-size")}}) for block direction overflow, or an inline-size ({{cssxref("inline-size")}}, {{cssxref("max-inline-size")}}, or {{cssxref("white-space")}} set to `nowrap`) for inline direction overflow. + +The following CSS limits the size of the container, defining [box model](/en-US/docs/Web/CSS/Guides/Box_model) property values that limit the container's size. +A background color, clipped to the `content-box`, is also added to help demonstrate how overflowing content overflows the content box in the explanations that follow. + +```css +div { + height: 10em; + width: 15em; + border: 3px solid; + padding: 10px; + + background-color: #ededed; + background-clip: content-box; +} +``` + +### Understanding overflow values + +The different `overflow` values define whether an element has scrollbars, whether it is user and programmatically scrollable, and whether it is a scroll container (which creates a new [block formatting context](/en-US/docs/Web/CSS/Guides/Display/Block_formatting_context)) when that element's contents overflow and, in the case of `scroll`, even when they don't. + +#### The `visible` value + +The default value is `visible`. By default, if content overflows a container's constraints, the contents are not contained to the container. An element that defaults or is explicitly set to `visible` doesn't have scrollbars, is not user or programmatically scrollable, and is not a {{glossary("scroll container")}}. This value does not create a new block formatting context. + +```css live-sample___visible +div { + overflow: visible; +} +``` + +{{EmbedLiveSample("visible", "", "300px")}} + +```html hidden live-sample___visible +
+

overflow: visible;

+
+
+

+ The overflow property in this example is set to + visible. No scroll container is created; the content just + overflows the container. +

+
+``` + +With `visible`, no clipping occurs, so the overflowing content is visible outside the element's padding box, potentially overlapping adjacent content. + +#### The `scroll` value + +With `scroll`, content is clipped at the element's padding box and can be scrolled into view. User agents display scroll bars in both directions, whether or not any content is overflowing, which prevents scroll bars from appearing and disappearing as content changes. Printers may still print overflow content. + +The element is always a {{glossary("scroll container")}} — even when there is no overflowing content — and is both user-scrollable and programmatically scrollable. + +```css live-sample___scroll +div { + overflow: scroll; +} +``` + +{{EmbedLiveSample("scroll", "", "300px")}} + +```html hidden live-sample___scroll +
+

overflow: scroll;

+
+
+

+ The overflow property in this example is set to + scroll. A scroll container is created; a scrollbar is always + visible, even if not needed. +

+
+``` + +In the first example, even though the content is not overflowing, a scroll container is still created. In the second example, the content is clipped to the padding box, with a scroll bar enabling scrolling to the overflowing content. + +#### The `auto` value + +With `auto`, whether the element has scrollbars and is a scroll container depends on whether the element has overflowing content. When the element contains overflowing content, it behaves like `scroll`: the overflowing content is clipped at the element's padding box, and overflow content can be scrolled into view using scroll bars. Unlike `scroll`, user agents display scroll bars _only if_ the content is overflowing. If content fits inside the element's padding box, it looks the same as with `visible`, but still establishes a new formatting context. The element box is a scroll container only when there is overflowing content. + +```css live-sample___auto +div { + overflow: auto; +} +``` + +{{EmbedLiveSample("auto", "", "300px")}} + +```html hidden live-sample___auto +
+

overflow: auto;

+
+
+

+ The overflow property in this example is set to + auto. Because there is overflowing content, a scroll container + is created. The content is clipped to the padding box and a scroll bar + enables scrolling to the overflowing content. +

+
+``` + +When using the two value syntax, if one value is set to `visible`, that `visible` overflow direction will behave as `auto` if the other value is not `visible` or `clip`. + +#### The `hidden` value + +With `hidden`, overflowing content is clipped at the element's padding box. There are no scroll bars and the clipped content is not visible (i.e., it's "hidden"). + +If there is overflowing content, the element is a scroll container. While there are no scroll bars and the user cannot view the content outside the clipped region by actions such as dragging on a touch screen or using the scroll wheel on a mouse, the hidden overflow content can be scrolled into view. + +If the content contains focusable elements, tabbing brings the currently focused element into view. Content can also be scrolled to programmatically. Setting a value for the {{domxref("Element.scrollLeft", "scrollLeft")}} or {{domxref("Element.scrollTop", "scrollTop")}} property scrolls that distance from the left or top edge, respectively. You can also scroll using the {{domxref("Element.scrollTo", "scrollTo()")}} method. -- Specifying a value other than `visible` (the default) or `clip` for `overflow` creates a new [block formatting context](/en-US/docs/Web/CSS/Guides/Display/Block_formatting_context). This is necessary for technical reasons; if a float intersects with a scrolling element, it would forcibly rewrap the content after each scroll step, leading to a slow scrolling experience. -- For an `overflow` setting to create the desired effect, the block-level element must have either a set height ({{cssxref("height")}} or {{cssxref("max-height")}}) if the overflow is in the vertical direction, a set width ({{cssxref("width")}} or {{cssxref("max-width")}}) if the overflow is in the horizontal direction, a set block-size (({{cssxref("block-size")}} or {{cssxref("max-block-size")}}) if the overflow is in the block direction, or a set inline-size (({{cssxref("inline-size")}} or {{cssxref("max-inline-size")}}) or {{cssxref("white-space")}} set to `nowrap` if the overflow is in the inline direction. -- Setting overflow to `visible` in one direction (i.e., `overflow-x` or `overflow-y`) when it isn't set to `visible` or `clip` in the other direction results in the `visible` value behaving as `auto`. -- Setting overflow to `clip` in one direction when it isn't set to `visible` or `clip` in the other direction results in the `clip` value behaving as `hidden`. -- The JavaScript {{domxref("Element.scrollTop")}} property may be used to scroll through content in a scroll container, except when `overflow` is set to `clip`. -- Setting `overflow` on images and other {{glossary("replaced elements")}} works as expected in browsers that support CSS Overflow Module Level 4; in previous versions of the specification, replaced elements were always clipped to the bounding container. - See [Browser compatibility](#browser_compatibility) for supporting browsers. +```css live-sample___hidden +div { + overflow: hidden; +} +``` + +{{EmbedLiveSample("hidden", "", "300px")}} + +```html hidden live-sample___hidden +
+

overflow: hidden;

+
+
+

+ The overflow property in this example is set to + hidden. While hidden, + interactive content + can be scrolled into view when focused. Because content overflows, the + element is a scroll container, even though no scroll bars are present. + Tabbing will give this + focus and scroll it into + view. This content is also programmatically scrollable. +

+
+``` + +The first example does not have overflowing content and is not a scroll container. The second example has overflowing content that is clipped to the padding box. Even though there is no scroll bar enabling scrolling to the overflowing content, the content can be scrolled into view, such as by tabbing to the {{htmlelement("input")}} in the hidden content. The second example is a scroll container. + +#### The `clip` value + +With `clip`, content that overflows is by default hidden, there are no scroll bars, and programmatic scrolling is not possible. The element is not a scroll container and no new [formatting context](/en-US/docs/Web/CSS/Guides/Display/Block_formatting_context) is created. If the clipped content includes interactive content, hidden focusable content still receives keyboard focus, but that content will not scroll into view, making it inaccessible to keyboard users. + +With `clip`, overflow content is clipped at the element's _overflow clip edge_ that is defined using the {{cssxref("overflow-clip-margin")}} property. The clipped content overflows the element's padding box by the {{cssxref("<length>")}} value of `overflow-clip-margin`, which defaults to `0px`. + +```css live-sample___clip +div { + overflow: clip; +} +``` + +{{EmbedLiveSample("clip", "", "350")}} + +```html hidden live-sample___clip +
+

overflow: clip;

+
+
+

+ The overflow property in this example is set to + clip. When hidden, + interactive content + can NOT be scrolled into view when focused. Overflowing content is clipped + to the container. No scroll container is created. Tabbing will give this + focus but will not scroll + it into view. Keyboard users will not be able to reach this content. This + content is also not programmatically scrollable. +

+
+
+ Select a overflow-clip-margin value +
    +
  • + +
  • +
  • + +
  • +
+
+``` + +The second example's overflowing content is clipped. Tabbing to the {{htmlelement("input")}} in the hidden content gives the element focus, but does not scroll it into view, making that content inaccessible to keyboard users. + +When using the two value syntax, if one value is set to `clip`, that `clip` overflow direction will behave as `hidden` if the other value is not set to `visible` or `clip`. + +```css hidden live-sample___clip +ul { + list-style-type: none; +} +label { + font-family: monospace; +} +:has([value="0"]:checked) div { + overflow-clip-margin: 0; +} +:has([value="3em"]:checked) div { + overflow-clip-margin: 3em; +} + +@supports not (overflow-clip-margin: 0) { + body::before { + content: "Your browser doesn't support overflow-clip-margin yet."; + background-color: wheat; + display: block; + text-align: center; + padding: 1rem 0; + + width: 100%; + } +} +``` + +#### With scroll-driven animations + +When creating [scroll-driven animations](/en-US/docs/Web/CSS/Guides/Scroll-driven_animations) using the {{cssxref("animation-timeline/scroll", "scroll()")}} function, consider using `clip` instead of `hidden` if there is no interactive content within the clipped area, unless you explicitly want to create a scroll container. + +With both `hidden` and `clip`, the overflow gets clipped, but `overflow: clip` doesn't create a scroll container, so clipped elements are skipped when the user agent goes up the DOM tree looking for the nearest ancestor scroll container. + +Because `overflow: hidden` creates a scroll container when there is overflowing content, you might accidentally create a scrolling-ancestor that doesn't scroll. But only use `clip` if you are certain you won't clip any interactive content. + +```css hidden live-sample___visible live-sample___scroll live-sample___auto live-sample___clip live-sample___hidden +div { + height: 10em; + width: 15em; + border: 3px solid; + padding: 10px; + background-color: #ededed; + background-clip: content-box; +} +p { + font-size: 1.5rem; + line-height: 1.6; + font-family: sans-serif; +} +h2 { + font-family: monospace; +} +body { + height: 98vh; + overflow: clip; + display: flex; + flex-flow: row wrap; + gap: 3em; +} +``` + +### Overflowing replaced elements + +Setting `overflow` on images and other {{glossary("replaced elements")}} works as expected in browsers that support CSS Overflow Module Level 4; in previous versions of the specification, replaced elements were always clipped to the bounding container. + +See the [browser compatibility](#browser_compatibility) chart for current browser support information. ## Formal definition @@ -119,9 +390,7 @@ The following nuances should be kept in mind while using the various keywords fo ## Accessibility -A scrolling content area is not keyboard-focusable, so it cannot be scrolled by a keyboard-only user. Firefox and Chrome 132 and later are exceptions; they make scroll containers focusable by default. - -For other browsers, to enable keyboard-only users to scroll the container, you will need to assign a [`tabindex`](/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex) to the container using `tabindex="0"`. Unfortunately, when a screen reader encounters this tab-stop, it may have no context about the container and could likely announce entire contents of the container. To mitigate this, give the container an appropriate [WAI-ARIA role](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles) (`role="region"`, for example) and an accessible name (via [`aria-label`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label) or [`aria-labelledby`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-labelledby)). +In some browsers, scrolling content areas are not keyboard-focusable, so they cannot be scrolled by a keyboard-only user. To ensure all keyboard-only users can scroll the container, enable the element to receive focus by setting [`tabindex="0"`](/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex) on the container. To give screen reader users context when the container receives focus, set an appropriate [WAI-ARIA role](/en-US/docs/Web/Accessibility/ARIA/Reference/Roles) on the container, such as `role="region"`, and an accessible name using the [`aria-label`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label) or [`aria-labelledby`](/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-labelledby) attribute. ## Examples @@ -257,5 +526,7 @@ p.overlay { - {{Cssxref("overflow-block")}}, {{Cssxref("overflow-clip-margin")}}, {{Cssxref("overflow-inline")}} - {{Cssxref("clip")}}, {{Cssxref("display")}}, {{cssxref("text-overflow")}}, {{cssxref("white-space")}} - SVG {{SVGAttr("overflow")}} attribute +- [Scroll progress timelines](/en-US/docs/Web/CSS/Guides/Scroll-driven_animations/Timelines#scroll_progress_timelines) - [CSS overflow](/en-US/docs/Web/CSS/Guides/Overflow) module +- [CSS scroll-driven animations](/en-US/docs/Web/CSS/Guides/Scroll-driven_animations) module - [Keyboard-only scrolling areas](https://adrianroselli.com/2022/06/keyboard-only-scrolling-areas.html) on adrianroselli.com (2022) From b0a05c1384211e0eff34e9917c84086eedf9e909 Mon Sep 17 00:00:00 2001 From: Basheer AL-Jarrah Date: Wed, 8 Jul 2026 18:16:53 +0300 Subject: [PATCH 2/5] Fix whitespace rendering inside element example (#44664) Remove whitespace inside example so no space renders within quotation marks --- files/en-us/web/html/reference/elements/q/index.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/files/en-us/web/html/reference/elements/q/index.md b/files/en-us/web/html/reference/elements/q/index.md index 816c66ca6aeb6ba..b253c660a392b75 100644 --- a/files/en-us/web/html/reference/elements/q/index.md +++ b/files/en-us/web/html/reference/elements/q/index.md @@ -39,9 +39,9 @@ This element includes the [global attributes](/en-US/docs/Web/HTML/Reference/Glo ```html

According to Mozilla's website, - - Firefox 1.0 was released in 2004 and became a big success. - + Firefox 1.0 was released in 2004 and became a big success.

``` From b25b4a98b757fbd05ce1fb74b1b78f3fcf917729 Mon Sep 17 00:00:00 2001 From: sb3nder Date: Wed, 8 Jul 2026 18:02:33 +0200 Subject: [PATCH 3/5] add `Snap a length as a line width` (#44194) * add `Snap a length as a line width` * remove link, move to Sintax, add example * Make lint happy * Apply suggestions Co-authored-by: Dipika Bhattacharya * Fix, Lint * Make lint happy Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Make lint more happy * lint, again --------- Co-authored-by: Dipika Bhattacharya Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- files/en-us/web/css/reference/values/length/index.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/files/en-us/web/css/reference/values/length/index.md b/files/en-us/web/css/reference/values/length/index.md index 3a18b73c544f85d..f435d0cc7bf9fe8 100644 --- a/files/en-us/web/css/reference/values/length/index.md +++ b/files/en-us/web/css/reference/values/length/index.md @@ -19,8 +19,19 @@ The `` data type consists of a {{cssxref("<number>")}} followed by > [!NOTE] > Some properties allow negative `` values, while others do not. +### Specified vs. computed values + The [specified value](/en-US/docs/Web/CSS/Guides/Cascade/Property_value_processing#specified_value) of a length (_specified length_) is represented by its quantity and unit. The [computed value](/en-US/docs/Web/CSS/Guides/Cascade/Property_value_processing#computed_value) of a length (_computed length_) is the specified length resolved to an absolute length, and its unit is not distinguished. +For some properties, such as `border-width`, `outline-width`, `column-rule-width`, and `outline-offset`, the computed `` values are rounded to an integer number of {{glossary("device pixel", "device pixels")}} to ensure reasonable visual display: + +- A non-zero value less than 1 device pixel is rounded up. +- A value greater than 1 device pixel is rounded down to the nearest whole device pixel. + +For example, on a screen with a {{domxref("Window.devicePixelRatio", "devicePixelRatio")}} of 3, `border-width: 1.5px` computes to approximately `1.33px` (rounded down from 4.5 to 4 device pixels), and `outline-width: 0.2px` computes to approximately `0.33px` (rounded up from 0.6 to 1 device pixel). + +### Relative vs. absolute lengths + The `` units can be relative or absolute. Relative lengths represent a measurement in terms of some other distance. Depending on the unit, this distance can be the size of a specific character, the [line height](/en-US/docs/Web/CSS/Reference/Properties/line-height), or the size of the {{Glossary("viewport")}}. Style sheets that use relative length units can more easily scale from one output environment to another. > [!NOTE] From 6dd46d38ac550f9eeb3b0224b1b46857c9b0f580 Mon Sep 17 00:00:00 2001 From: Stephen Wade Date: Wed, 8 Jul 2026 12:52:02 -0400 Subject: [PATCH 4/5] Update description of how to set `offsetNanoseconds` (#44668) --- .../temporal/zoneddatetime/offsetnanoseconds/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/en-us/web/javascript/reference/global_objects/temporal/zoneddatetime/offsetnanoseconds/index.md b/files/en-us/web/javascript/reference/global_objects/temporal/zoneddatetime/offsetnanoseconds/index.md index 15c0118455d37d7..140ce6d391c17be 100644 --- a/files/en-us/web/javascript/reference/global_objects/temporal/zoneddatetime/offsetnanoseconds/index.md +++ b/files/en-us/web/javascript/reference/global_objects/temporal/zoneddatetime/offsetnanoseconds/index.md @@ -9,7 +9,7 @@ sidebar: jsref The **`offsetNanoseconds`** accessor property of {{jsxref("Temporal.ZonedDateTime")}} instances returns an integer representing the [offset](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Temporal/ZonedDateTime#time_zones_and_offsets) used to interpret the internal instant, as a number of nanoseconds (positive or negative). The value is a safe integer because it's less than a day, which is 8.64e15 nanoseconds. -The set accessor of `offsetNanoseconds` is `undefined`. You cannot change this property directly. Change {{jsxref("Temporal/ZonedDateTime/offset", "offset")}} to change this property too. +The set accessor of `offsetNanoseconds` is `undefined`. You cannot change this property directly. Use the {{jsxref("Temporal/ZonedDateTime/with", "with()")}} method to create a new `Temporal.ZonedDateTime` object with the desired new {{jsxref("Temporal/ZonedDateTime/offset", "offset")}} value (which will change this property too), or use the {{jsxref("Temporal/ZonedDateTime/withTimeZone", "withTimeZone()")}} method to create a new `Temporal.ZonedDateTime` object in another time zone. ## Examples From 41b22116b7a11c17669ecf9cabda2ceb19610744 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 8 Jul 2026 18:59:01 +0200 Subject: [PATCH 5/5] ci(deps-dev): bump lefthook from 2.1.9 to 2.1.10 (#44666) Bumps [lefthook](https://github.com/evilmartians/lefthook) from 2.1.9 to 2.1.10. - [Release notes](https://github.com/evilmartians/lefthook/releases) - [Changelog](https://github.com/evilmartians/lefthook/blob/master/CHANGELOG.md) - [Commits](https://github.com/evilmartians/lefthook/compare/v2.1.9...v2.1.10) --- updated-dependencies: - dependency-name: lefthook dependency-version: 2.1.10 dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package-lock.json | 88 +++++++++++++++++++++++------------------------ package.json | 2 +- 2 files changed, 45 insertions(+), 45 deletions(-) diff --git a/package-lock.json b/package-lock.json index 754879d1ab9e769..d3492e5aca6fcb2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -31,7 +31,7 @@ "imagemin-pngquant": "^10.0.0", "imagemin-svgo": "^12.0.0", "is-svg": "^6.1.0", - "lefthook": "^2.1.9", + "lefthook": "^2.1.10", "markdownlint-cli2": "0.23.0", "markdownlint-rule-search-replace": "1.2.0", "node-html-parser": "^9.0.0", @@ -6097,9 +6097,9 @@ } }, "node_modules/lefthook": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook/-/lefthook-2.1.9.tgz", - "integrity": "sha512-bwDaIOViTktE8kJLf9jP0p+H2/RDTlFFlc43Am2YgUsX22hI6Sq4RbzsrecwzY5y+MHTipOH7WsmWSEniePHWQ==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook/-/lefthook-2.1.10.tgz", + "integrity": "sha512-K7mM4WoqMwqfXYK11EHy+lSH1uW8XHni3Yn/bSqyerPkUPygGdf3xn18JoV5HyA06xuQL3ofGAOjG01QX9oJ4w==", "dev": true, "hasInstallScript": true, "license": "MIT", @@ -6107,22 +6107,22 @@ "lefthook": "bin/index.js" }, "optionalDependencies": { - "lefthook-darwin-arm64": "2.1.9", - "lefthook-darwin-x64": "2.1.9", - "lefthook-freebsd-arm64": "2.1.9", - "lefthook-freebsd-x64": "2.1.9", - "lefthook-linux-arm64": "2.1.9", - "lefthook-linux-x64": "2.1.9", - "lefthook-openbsd-arm64": "2.1.9", - "lefthook-openbsd-x64": "2.1.9", - "lefthook-windows-arm64": "2.1.9", - "lefthook-windows-x64": "2.1.9" + "lefthook-darwin-arm64": "2.1.10", + "lefthook-darwin-x64": "2.1.10", + "lefthook-freebsd-arm64": "2.1.10", + "lefthook-freebsd-x64": "2.1.10", + "lefthook-linux-arm64": "2.1.10", + "lefthook-linux-x64": "2.1.10", + "lefthook-openbsd-arm64": "2.1.10", + "lefthook-openbsd-x64": "2.1.10", + "lefthook-windows-arm64": "2.1.10", + "lefthook-windows-x64": "2.1.10" } }, "node_modules/lefthook-darwin-arm64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-darwin-arm64/-/lefthook-darwin-arm64-2.1.9.tgz", - "integrity": "sha512-119HryNcvr4nqn0wUIrNPgpMEPn9yMQzEcW/lezRsnb56PCJriJB92+MCySPVcWDxJnZef7o0T3jdnPNiSH7Qg==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-darwin-arm64/-/lefthook-darwin-arm64-2.1.10.tgz", + "integrity": "sha512-nw+X8wRNDoUUV6WSteyKBbcLySq+fsmZt5WV/s50ZJpysmsDKJOUMln6SllNfP+60dzUahAO7REco/2633BsLg==", "cpu": [ "arm64" ], @@ -6134,9 +6134,9 @@ ] }, "node_modules/lefthook-darwin-x64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-darwin-x64/-/lefthook-darwin-x64-2.1.9.tgz", - "integrity": "sha512-dwo5Tke2XcQCM56DGHgFKBfRbJIL6xs2wZ0zG1TUVZgl4t4mQUt6LiZ4V/ZQfYHTZF9qywvXoIlR5N35qOaiVQ==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-darwin-x64/-/lefthook-darwin-x64-2.1.10.tgz", + "integrity": "sha512-KQ/bHmvpkFdHMn4pZnUdTf+GuSC+aBBgBTxZT4GW+6cSf+qbErKZBhK7cH6BmILsvx43+VzEArvHYY7YOfRFOQ==", "cpu": [ "x64" ], @@ -6148,9 +6148,9 @@ ] }, "node_modules/lefthook-freebsd-arm64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-freebsd-arm64/-/lefthook-freebsd-arm64-2.1.9.tgz", - "integrity": "sha512-+09PVap6nl6xsaHch5JLtq7WvIR++U1Q2MzA2ai0M4uB/VP3AqrvKqHw6+9hjyKnIH+HHL83uqi77EAY+LaxLA==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-freebsd-arm64/-/lefthook-freebsd-arm64-2.1.10.tgz", + "integrity": "sha512-8su6DwydP7+pv7kG0zCtjphqsw4ouOnfexRUErapy5GTxYBoUOhYz3RSHTSWNRsK6W4jva7FPUh2Lp5/PSn30w==", "cpu": [ "arm64" ], @@ -6162,9 +6162,9 @@ ] }, "node_modules/lefthook-freebsd-x64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-freebsd-x64/-/lefthook-freebsd-x64-2.1.9.tgz", - "integrity": "sha512-8XresjKIYpkE9ARgCtBEZgJZxAU3T4MIqzj4zNy15XRT59I1Us+QdqXTNm+pkZ41Yd2X/nxs2Pkvbq3NWWlIGw==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-freebsd-x64/-/lefthook-freebsd-x64-2.1.10.tgz", + "integrity": "sha512-GeAJEFxko3Lk+AsnS3NleAFrpyMLFUKOlgJvPKuU0xHwVEI/z+ZoCcmuO0BX+4CS0NLbZhC/YQAvBASqDvvVdQ==", "cpu": [ "x64" ], @@ -6176,9 +6176,9 @@ ] }, "node_modules/lefthook-linux-arm64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-linux-arm64/-/lefthook-linux-arm64-2.1.9.tgz", - "integrity": "sha512-1oNIQfwrPe6rgU2KcDM3aF6+hpZDCKx1TmawQKpXUY5gVsbZ7MqX0Sk/1lnnWxqPm+kQQ5f6J2dpFWd+4xH8jg==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-linux-arm64/-/lefthook-linux-arm64-2.1.10.tgz", + "integrity": "sha512-1sHTCmpTWjVMs+yKPBLRNT1kuuIr1yjietlk7rCB6wFPVOS6Ph3o2zPFH2AvW1UymHlqwyHXzBr9EtDpQ7j1mQ==", "cpu": [ "arm64" ], @@ -6190,9 +6190,9 @@ ] }, "node_modules/lefthook-linux-x64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-linux-x64/-/lefthook-linux-x64-2.1.9.tgz", - "integrity": "sha512-fT+7Q+BJyGp+CslFQkNXmdFRgyVXsPHPi9NAsDX0a6QOyNnoORByAsvx6zeAKuF5rL3BBgNfho1/v2RuGxGy9w==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-linux-x64/-/lefthook-linux-x64-2.1.10.tgz", + "integrity": "sha512-z/VlRB3bh6mBvW3r1rwnJ5vP8z+Krx5gJzkZ4veDXh+6FlRTx8wtd3g3fllOv/yZMxkgmL3fQoFXv05Esa7vBQ==", "cpu": [ "x64" ], @@ -6204,9 +6204,9 @@ ] }, "node_modules/lefthook-openbsd-arm64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-openbsd-arm64/-/lefthook-openbsd-arm64-2.1.9.tgz", - "integrity": "sha512-4bVuafBk3dddVNo0+3hMbjcJs4mqYAstxpPMmX2ufkudSTYFNIhWoqwuGVQV/SS/xdcOKJAldW4qayAzed2ysw==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-openbsd-arm64/-/lefthook-openbsd-arm64-2.1.10.tgz", + "integrity": "sha512-430zL8sSIKw5P0YXGG6PB+eAhHa06n0PXuaERaAQE4Ss3odfqwnl5Mq9hQmkEnOS1EGiQEKkd0UHv/i4PtMNIQ==", "cpu": [ "arm64" ], @@ -6218,9 +6218,9 @@ ] }, "node_modules/lefthook-openbsd-x64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-openbsd-x64/-/lefthook-openbsd-x64-2.1.9.tgz", - "integrity": "sha512-PmPoMmLP/wQQWcQ9u2YH86bTZ3UCfBsxuEmVTEyPU2U8R1qSTp5r/Gs3G8cN5Mxo91XB9oBERtF1n+xD3W6aVA==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-openbsd-x64/-/lefthook-openbsd-x64-2.1.10.tgz", + "integrity": "sha512-bgkO8PphGZVDhQgCJ524aYYPI5491pVmCiLPGjBIo1AvOSlIyw4N1Y+1C3QfqwEmechzw+Aq16SNc8pqv6UuXg==", "cpu": [ "x64" ], @@ -6232,9 +6232,9 @@ ] }, "node_modules/lefthook-windows-arm64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-windows-arm64/-/lefthook-windows-arm64-2.1.9.tgz", - "integrity": "sha512-KphfkBKmwBnmolyrdhIl3lrBaOyTcCgXBT2AB/9OHnEXhOLvv5uTCUkrD4YRAxXPtFKq6UvnapIeoL3GZq0bdA==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-windows-arm64/-/lefthook-windows-arm64-2.1.10.tgz", + "integrity": "sha512-5Q6etF0Fla2DDA4ilDySrdNgiR5+W7cJZwnZ69Je3kvWCaWm4wnkuc8FEdjp3kiL2x3ZXipdI00f5vpO8aWmog==", "cpu": [ "arm64" ], @@ -6246,9 +6246,9 @@ ] }, "node_modules/lefthook-windows-x64": { - "version": "2.1.9", - "resolved": "https://registry.npmjs.org/lefthook-windows-x64/-/lefthook-windows-x64-2.1.9.tgz", - "integrity": "sha512-2qlUtkJHZ3MyUxgV5XTEmcrIoNZA07iwaquoswAcqv/1MeBFXlD+O+koFRfrzWng2O5WYEbpJnd8tvaYnV8fTA==", + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/lefthook-windows-x64/-/lefthook-windows-x64-2.1.10.tgz", + "integrity": "sha512-c/XH8YZtylG4XaxzqFfXluvq2LXq2W/p54Bnzn3+Z7E5X2Fk3JlFJAibulMbIt2+w8T7UI/r97ok5GqE4kGaeA==", "cpu": [ "x64" ], diff --git a/package.json b/package.json index 4f8a22c92fd4a93..fb59e6fdf61fd15 100644 --- a/package.json +++ b/package.json @@ -71,7 +71,7 @@ "imagemin-pngquant": "^10.0.0", "imagemin-svgo": "^12.0.0", "is-svg": "^6.1.0", - "lefthook": "^2.1.9", + "lefthook": "^2.1.10", "markdownlint-cli2": "0.23.0", "markdownlint-rule-search-replace": "1.2.0", "node-html-parser": "^9.0.0",