@rcarls/rc-carousel 0.6.0 → 0.7.0

package/CHANGELOG.md

@@ -1,5 +1,122 @@
 # @rcarls/rc-carousel
 
+## 0.7.0
+
+### Minor Changes
+
+- 54d9ead: Localize every component's built-in text. Button names, role
+  descriptions, announcements, and default labels now resolve per key from
+  the element's `messages` property, then from text registered with
+  `registerMessages(locale, catalog)` in `@rcarls/rc-common`, then from the
+  English defaults. The locale is the element's own `lang`, else
+  `<html lang>`; an ancestor's `lang` is ignored, because it usually marks
+  content rather than the interface. Components re-render when that locale
+  changes or new text is registered. `RcMessageCatalog` types the catalog,
+  and each package adds its scope to it.
+
+  Numbers a component formats as text follow the same locale:
+  `rc-progress`'s default percentage and `rc-splitter`'s `aria-valuetext`
+  use `Intl.NumberFormat`. `TypeaheadController` matches prefixes with an
+  `Intl.Collator`, so case and accents are ignored the way the locale
+  ignores them, and takes a `locale` option. `ItemsCollectionController`'s
+  `setCreateOption(text, label?)` takes the option's visible text from its
+  caller.
+
+  `rc-transfer-list`'s direction arrows are now decorative: screen readers
+  read only the action name, and the arrows turn over in RTL.
+
+  **Breaking:** chrome-text properties are replaced by `messages`. Migrate:
+
+  - `rc-search-bar` `clear-label` / `clearLabel` → `messages.clear`
+  - `rc-adaptive-menu` `overflow-label` / `overflowLabel` → `messages.overflow`
+  - `rc-chip-group` `show-all-label` / `showAllLabel` and `show-less-label` /
+    `showLessLabel` → `messages.showAll` and `messages.showLess`
+  - `rc-select` and `rc-combobox` `dialog-confirm-label` /
+    `dialogConfirmLabel` and `dialog-cancel-label` / `dialogCancelLabel` →
+    `messages.done` and `messages.cancel`
+  - `rc-editor-toolbar` `label` → `messages.toolbar`
+
+  Per-instance names stay attributes, but now default to `undefined` and fall
+  back to a message: `label` on `rc-adaptive-menu`, `rc-chip-group`,
+  `rc-menubar`, and `rc-splitter`; `available-label` and `selected-label`
+  on `rc-transfer-list`; `low-label` and `high-label` on `rc-range-slider`.
+  Read the resolved name from the rendered `aria-label` instead of the
+  property.
+
+### Patch Changes
+
+- 5c006de: Ship component CSS minified. Package builds now run the CSS in Lit `css` styles
+  and light-DOM structural styles through Lightning CSS, removing comments and
+  whitespace while keeping source maps that resolve to each template. Rendered
+  styles are unchanged.
+
+  `@rcarls/rc-common` adds `cssText`, an identity tag that marks a plain CSS
+  string for minification. `rc-chip`, `rc-disclosure`, and `rc-accordion` now
+  depend on `@rcarls/rc-common` for it.
+
+- 011f3c6: Keep combobox chips clear of their trailing toggle, reset native selects inside
+  `rc-field`, keep controlled carousel accessibility state synchronized, and align
+  Material chips, menus, lists, disclosures, nested editors, and bottom-sheet
+  motion with their MD3 defaults.
+- a6553ff: Batch layout sampling into a shared animation-frame read phase so mounting a
+  large component route no longer alternates forced layout reads with component
+  writes. Closed anchored popups now skip placement work until they open, while
+  scroller boundaries, carousel positioning, flow state, and opted-in initial
+  scroll observation settle before the next paint.
+
+  Add `RafScheduler.schedulePhased()`, live `AnchorController.disabled` getters,
+  and the `ScrollObserverController.initialEvaluation` timing option.
+
+- b764a3c: Observe interface locale changes through containing shadow roots and the host's own document.
+  An explicit empty `lang` now means an unknown locale rather than falling back to `<html lang>`.
+  Typeahead compares complete grapheme prefixes, including decomposed accents and collation
+  expansions. Default interpolating messages format numeric positions in the interface locale
+  while translation callbacks continue to receive numbers and can accept an optional locale.
+  Default messages isolate consumer text whose direction is unknown. Textarea content direction
+  uses the native LTR fallback for neutral `dir="auto"` content, recognizes Arabic Letter Mark and
+  isolate controls, and reruns plugins when the native textarea's `lang` or `dir` changes.
+- 98628f7: Resolve the writing direction when a mouse drag starts, before the drag
+  axis is chosen, so a carousel whose writing mode changed since its last
+  scroll drags along its new inline axis on the first try. Touch and pen
+  input keep native scrolling.
+- ca309b6: Scroll, snap, and drag the track along the inline axis in logical terms, so
+  navigation, swipe settling, and mouse dragging work in RTL and in vertical
+  writing modes. Previously every slide index mapped to the wrong scroll
+  position in RTL, where the track's scroll offset runs negative. The
+  built-in previous and next chevrons also mirror in RTL.
+- Updated dependencies [e3dfa59]
+- Updated dependencies [50d5610]
+- Updated dependencies [9ee769c]
+- Updated dependencies [1179f24]
+- Updated dependencies [595fe37]
+- Updated dependencies [38cd00c]
+- Updated dependencies [5c006de]
+- Updated dependencies [a6553ff]
+- Updated dependencies [2205478]
+- Updated dependencies [4341311]
+- Updated dependencies [899bb5e]
+- Updated dependencies [25fcfe0]
+- Updated dependencies [51f6403]
+- Updated dependencies [9caca6b]
+- Updated dependencies [b764a3c]
+- Updated dependencies [54d9ead]
+- Updated dependencies [b9175e9]
+- Updated dependencies [c8b762b]
+- Updated dependencies [55e1e7f]
+- Updated dependencies [f1ca82d]
+- Updated dependencies [b87f27b]
+- Updated dependencies [32ebead]
+- Updated dependencies [bfefedd]
+- Updated dependencies [c130173]
+- Updated dependencies [11680b6]
+- Updated dependencies [223d36c]
+- Updated dependencies [7b91a44]
+- Updated dependencies [aa04ead]
+- Updated dependencies [ac65b5b]
+- Updated dependencies [afcfef8]
+- Updated dependencies [11ef1ad]
+  - @rcarls/rc-common@0.7.0
+
 ## 0.6.0
 
 ### Minor Changes

package/README.md

@@ -36,3 +36,11 @@ for the complete API, accessibility notes, and live demo.
 Import `@rcarls/rc-carousel` to use the classes without registering them, or
 import `@rcarls/rc-carousel/define` to register `<rc-carousel>` and
 `<rc-carousel-item>`.
+
+## Localization
+
+Built-in text follows the element's own `lang`, else `<html lang>`, and never an
+ancestor's `lang`, which usually marks content. Override it per element with the
+`messages` property, or for every instance with `registerMessages()` from
+`@rcarls/rc-common` under `rc-carousel`. Keys: `carousel`, `slide`, `position`, `previous`, `next`, `picker`, `goToSlide`. See the
+[rc-common Localization section](https://github.com/richardcarls/rc-webcomponents/tree/develop/packages/rc-common#localization).

package/dist/custom-elements.json

@@ -125,6 +125,33 @@
               "default": "''",
               "description": "\"N of M\" position assigned by the parent `rc-carousel`. Internal\nintegration point, not a public API — see the `@attr` note above."
             },
+            {
+              "kind": "field",
+              "name": "roleDescription",
+              "type": {
+                "text": "string"
+              },
+              "default": "'slide'",
+              "description": "`aria-roledescription` assigned by the parent `rc-carousel` in its\nlocale. Internal integration point, not a public API."
+            },
+            {
+              "kind": "field",
+              "name": "_writtenLabel",
+              "type": {
+                "text": "string | null"
+              },
+              "privacy": "private",
+              "default": "null"
+            },
+            {
+              "kind": "field",
+              "name": "_writtenRoleDescription",
+              "type": {
+                "text": "string | null"
+              },
+              "privacy": "private",
+              "default": "null"
+            },
             {
               "kind": "method",
               "name": "_syncDefaultLabel",
@@ -135,6 +162,16 @@
                 }
               }
             },
+            {
+              "kind": "method",
+              "name": "_syncRoleDescription",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
             {
               "kind": "method",
               "name": "_observeIntersection",
@@ -178,6 +215,13 @@
       "kind": "javascript-module",
       "path": "src/rc-carousel.ts",
       "declarations": [
+        {
+          "kind": "variable",
+          "name": "DEFAULT_CAROUSEL_MESSAGES",
+          "type": {
+            "text": "Readonly<RCCarouselMessages>"
+          }
+        },
         {
           "kind": "class",
           "description": "WAI-ARIA APG carousel pattern built on native CSS scroll-snap. One\n`rc-carousel-item` per slide, swiped or paged between; the track's own\nnative scroll-snap settling (not a hand-rolled drag simulation) is the\nprimary interaction, per this monorepo's \"build on native browser\nbehavior\" principle.\n\n`activeIndex` is a controlled/uncontrolled property, mirroring\n`rc-adaptive-menu`'s `open`/`defaultOpen` pair: leave it unset for\nuncontrolled usage (`default-active-index` seeds the initial slide),\nor set it directly to drive the carousel externally — a settle from\nswipe, a keyboard action, or the imperative API all report back through\n`rc-carousel-change` rather than silently self-correcting a controlled\nvalue out from under the consumer.\n\nPrevious/next navigation and a slide picker are both opt-in\n(`navigation`/`pagination`), following the WAI-ARIA APG carousel\npattern's \"grouped\" (non-tab) picker style deliberately: the tabbed\n`role=\"tabpanel\"` variant requires cross-references between light-DOM\nslides and shadow-DOM tab buttons that, in comparable shadow-DOM\ncarousels, has hit real accessibility-tooling failures across the\nshadow boundary (including non-recognition by some screen readers\nentirely). `loop` wraps seamlessly via cloned lead/trail slides rather\nthan a discontinuous jump back to the other end.",
@@ -361,6 +405,37 @@
               },
               "privacy": "private"
             },
+            {
+              "kind": "field",
+              "name": "_initialPosition",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new RafScheduler(this)"
+            },
+            {
+              "kind": "field",
+              "name": "_writtenRoleDescription",
+              "type": {
+                "text": "string | null"
+              },
+              "privacy": "private",
+              "default": "null"
+            },
+            {
+              "kind": "field",
+              "name": "_messages",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new MessagesController( this, 'rc-carousel', DEFAULT_CAROUSEL_MESSAGES, { overrides: () => this.messages, }, )"
+            },
+            {
+              "kind": "field",
+              "name": "messages",
+              "type": {
+                "text": "Partial<RCCarouselMessages> | undefined"
+              },
+              "description": "Built-in text overrides; unset keys fall back to registered text, then English."
+            },
             {
               "kind": "field",
               "name": "loop",
@@ -416,12 +491,32 @@
             },
             {
               "kind": "field",
-              "name": "_dragStartLeft",
+              "name": "_dragStartOffset",
               "type": {
                 "text": "number"
               },
               "privacy": "private",
-              "default": "0"
+              "default": "0",
+              "description": "Logical inline scroll offset of the track when the current drag began."
+            },
+            {
+              "kind": "field",
+              "name": "_flow",
+              "type": {
+                "text": "Flow"
+              },
+              "privacy": "private",
+              "default": "HORIZONTAL_LTR_FLOW",
+              "description": "Track flow, re-resolved at the start of each drag or scroll operation."
+            },
+            {
+              "kind": "field",
+              "name": "_dragAxis",
+              "type": {
+                "text": "'x' | 'y'"
+              },
+              "privacy": "private",
+              "default": "'x'"
             },
             {
               "kind": "field",
@@ -437,8 +532,8 @@
               "name": "_dragController",
               "privacy": "protected",
               "readonly": true,
-              "default": "new DragGestureController(this, { target: () => this._trackEl ?? null, axis: 'x', activation: 'axis', canStart: (event) => this.mouseDragging && event.pointerType === 'mouse', onStart: () => { this._dragging = true; this._dragStartLeft = this._trackEl?.scrollLeft ?? 0; this._suppressNextClick = true; // Imperative, not reactive-class-driven: this must land before // onMove's very first scrollLeft write below, and a Lit re-render // (triggered by _dragging above) is a whole render pass too late for // that — with scroll-snap-type still active, the browser eagerly // resnaps a plain scrollLeft assignment straight back to the // nearest snap point, same as it would any other programmatic // scroll with no notion this is \"mid-gesture\". if (this._trackEl) { this._trackEl.style.scrollSnapType = 'none'; } }, onMove: (detail) => { if (this._trackEl) { this._trackEl.scrollLeft = this._dragStartLeft - detail.deltaX; } }, onEnd: (detail) => this._endDrag(detail), onCancel: (detail) => this._endDrag(detail), })",
-              "description": "Drives `scrollLeft` directly from pointer deltas while `mouseDragging`\nis on. `activation: 'axis'` (not `'immediate'`) means a plain click\nnever activates a drag at all — it requires clearing\n`activationDistance` (8px) of movement first — but a *real* drag still\nends in a native `click` on release, on whatever's under the pointer,\nwhich `_suppressNextClick` swallows so dragging across an unrelated\nlink or button inside a slide doesn't activate it (the same edge case\nShoelace's own `sl-carousel` handles for exactly this reason)."
+              "default": "new DragGestureController(this, { target: () => this._trackEl ?? null, axis: 'x', activation: 'axis', canStart: (event) => { if (!this.mouseDragging || event.pointerType !== 'mouse') { return false; } // Resolve on pointerdown, before the controller picks the drag axis // from the first moves; the flow then holds for the whole gesture. this._resolveFlow(); return true; }, onStart: () => { this._dragging = true; this._dragStartOffset = this._trackOffset(); this._suppressNextClick = true; // Imperative, not reactive-class-driven: this must land before // onMove's very first scroll offset write below, and a Lit re-render // (triggered by _dragging above) is a whole render pass too late for // that — with scroll-snap-type still active, the browser eagerly // resnaps a plain scroll offset assignment straight back to the // nearest snap point, same as it would any other programmatic // scroll with no notion this is \"mid-gesture\". if (this._trackEl) { this._trackEl.style.scrollSnapType = 'none'; } }, onMove: (detail) => { // Dragging toward the inline end drags content with it, which scrolls // back toward the start, hence the subtraction. Projecting through the // flow makes that hold in RTL and in vertical writing modes. this._setTrackOffset( this._dragStartOffset - logicalDelta({ dx: detail.deltaX, dy: detail.deltaY }, 'inline', this._flow), ); }, onEnd: (detail) => this._endDrag(detail), onCancel: (detail) => this._endDrag(detail), })",
+              "description": "Drives the track's scroll offset directly from pointer deltas while `mouseDragging`\nis on. `activation: 'axis'` (not `'immediate'`) means a plain click\nnever activates a drag at all — it requires clearing\n`activationDistance` (8px) of movement first — but a *real* drag still\nends in a native `click` on release, on whatever's under the pointer,\nwhich `_suppressNextClick` swallows so dragging across an unrelated\nlink or button inside a slide doesn't activate it (the same edge case\nShoelace's own `sl-carousel` handles for exactly this reason)."
             },
             {
               "kind": "field",
@@ -633,6 +728,12 @@
                   "text": "{ point: number; index: number; isClone: boolean }[]"
                 }
               },
+              "parameters": [
+                {
+                  "name": "step",
+                  "default": "this._itemStep()"
+                }
+              ],
               "description": "Every scrollable track position in rendered order, including cloned\nlead/trail slides when `loop` is on — `[lastClone, item0, ..., itemN-1,\nfirstClone]`. Each slot reports which real slide index it represents\n(a clone mirrors the real slide it duplicates), so both scrolling to\nan index and reading back a settled scroll position can stay in terms\nof real indices while the clones do the seamless-wrap work."
             },
             {
@@ -645,6 +746,81 @@
                 }
               }
             },
+            {
+              "kind": "method",
+              "name": "_measureTrack",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "TrackMeasurement | null"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "_applyFlow",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "flow",
+                  "type": {
+                    "text": "Flow"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_resolveFlow",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "Flow"
+                }
+              },
+              "description": "Re-reads the track's writing mode and direction. Called at the start of\neach scroll operation and on each drag's pointerdown rather than cached\nfor the element's life, since neither a `dir` nor a writing-mode change\non an ancestor fires an event. The drag gesture's physical axis follows,\nso a carousel in vertical text drags vertically."
+            },
+            {
+              "kind": "method",
+              "name": "_trackOffset",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "number"
+                }
+              },
+              "description": "Scroll distance from the track's logical start, never negative."
+            },
+            {
+              "kind": "method",
+              "name": "_setTrackOffset",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "offset",
+                  "type": {
+                    "text": "number"
+                  }
+                },
+                {
+                  "name": "behavior",
+                  "default": "'auto'",
+                  "type": {
+                    "text": "ScrollBehavior"
+                  }
+                }
+              ]
+            },
             {
               "kind": "method",
               "name": "_setActiveIndex",
@@ -693,6 +869,63 @@
                 }
               ]
             },
+            {
+              "kind": "method",
+              "name": "_queueInitialPosition",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "_sampleInitialPosition",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "InitialPositionSample | null"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "_applyInitialPosition",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "sample",
+                  "type": {
+                    "text": "InitialPositionSample | null"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_syncActiveItemAccessibility",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "index",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ],
+              "description": "Keep the authored active slide available to assistive technology even\nbefore a programmatic scroll produces its next intersection callback.\nIntersectionObserver still takes over during direct manipulation, where\nthe visually dominant slide can change before scroll settling updates the\npublic active index."
+            },
             {
               "kind": "field",
               "name": "_onSlotChange",
@@ -718,6 +951,17 @@
                 }
               }
             },
+            {
+              "kind": "method",
+              "name": "_syncText",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Re-applies text written outside the template, for a new locale or `messages`."
+            },
             {
               "kind": "method",
               "name": "_syncItems",
@@ -786,7 +1030,7 @@
                   }
                 }
               ],
-              "description": "On release, a fast enough flick pre-nudges `scrollLeft` to the next\nsnap point in the drag direction (a \"decisive swipe\" — mirroring\n`rc-bottom-sheet`'s own velocity-vs-nearest-point settle heuristic,\nadapted from \"jump to the extreme end\" for a 2-point sheet to \"advance\none further point\" for a carousel that can have many). Either way,\nthis hands off to the same debounced settle path a native swipe\nalready goes through — our own `scrollLeft` writes during the drag\nalready fired real `scroll` events, so `_onScroll` just needs to run\nits usual timer to pick up wherever things ended."
+              "description": "On release, a fast enough flick pre-nudges the scroll offset to the next\nsnap point in the drag direction (a \"decisive swipe\" — mirroring\n`rc-bottom-sheet`'s own velocity-vs-nearest-point settle heuristic,\nadapted from \"jump to the extreme end\" for a 2-point sheet to \"advance\none further point\" for a carousel that can have many). Either way,\nthis hands off to the same debounced settle path a native swipe\nalready goes through — our own scroll offset writes during the drag\nalready fired real `scroll` events, so `_onScroll` just needs to run\nits usual timer to pick up wherever things ended."
             },
             {
               "kind": "field",
@@ -923,6 +1167,14 @@
         }
       ],
       "exports": [
+        {
+          "kind": "js",
+          "name": "DEFAULT_CAROUSEL_MESSAGES",
+          "declaration": {
+            "name": "DEFAULT_CAROUSEL_MESSAGES",
+            "module": "src/rc-carousel.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "RCCarousel",