@brytdesigns/web-component-keen-slider 1.2.3 → 3.1.0

package/dist/main/KeenSlider.js

@@ -1,129 +1,193 @@
-import _KeenSlider from 'keen-slider';
-import { constrain } from './utils';
-
+import { constrain, formatSlideLabel } from "./utils.js";
+import _KeenSlider from "keen-slider";
+//#region src/KeenSlider.ts
 function attachMoreDetails(prevSlide) {
-  return function(slider) {
-    if (slider.track.details.rel != slider.animator.targetIdx) return;
-    slider.direction = slider.track.details.rel > prevSlide ? "forward" : "backward";
-    prevSlide = slider.track.details.rel;
-  };
+	return (slider) => {
+		if (slider.track.details.rel !== slider.animator.targetIdx) return;
+		slider.direction = slider.track.details.rel > prevSlide ? "forward" : "backward";
+		prevSlide = slider.track.details.rel;
+	};
 }
-const attachAriaAttributes = (slider) => {
-  const maxIdx = slider?.track?.details?.maxIdx === Infinity ? slider.track.details.length : slider?.track?.details?.maxIdx || 0;
-  slider.container.setAttribute("role", "listbox");
-  slider.container.setAttribute(
-    "aria-orientation",
-    slider.options?.vertical ? "vertical" : "horizontal"
-  );
-  slider.container.setAttribute("aria-multiselectable", "false");
-  slider.container.setAttribute("aria-label", "Slider");
-  slider.container.setAttribute("tabindex", "0");
-  slider.container.setAttribute("aria-live", "polite");
-  slider.container.setAttribute("aria-atomic", "true");
-  slider.container.setAttribute("aria-live", "polite");
-  slider.container.setAttribute("aria-busy", "false");
-  slider.container.setAttribute("aria-valuemin", "0");
-  slider.container.setAttribute("aria-valuemax", `${maxIdx}`);
-  slider.container.setAttribute(
-    "aria-valuenow",
-    `${slider?.track?.details?.rel || 0}`
-  );
-  function getMaxRel(rel, perView = 1) {
-    return Math.floor(rel + perView - 1);
-  }
-  function slideIsActive(idx) {
-    const perView = slider.options?.slides?.perView || 1, rel = slider.track.details.rel, maxRel = getMaxRel(rel, perView);
-    return rel <= idx && idx <= maxRel;
-  }
-  async function updateTabIndexes(slide, tabindex) {
-    const focusableElements = Array.from(
-      slide.querySelectorAll(
-        "input, a, button:not(:disabled), textarea, select, textarea, [tabindex]"
-      )
-    );
-    focusableElements.forEach((element) => {
-      element.setAttribute("tabindex", tabindex);
-    });
-  }
-  function updateAriaActiveSlide(slide) {
-    slide.setAttribute("aria-selected", "true");
-    slide.setAttribute("aria-hidden", "false");
-    slide.setAttribute("tabindex", "0");
-    updateTabIndexes(slide, "0");
-  }
-  function updateAriaInActiveSlide(slide) {
-    slide.setAttribute("aria-selected", "false");
-    slide.setAttribute("aria-hidden", "true");
-    slide.setAttribute("tabindex", "-1");
-    updateTabIndexes(slide, "-1");
-  }
-  function updateSlideAriaAttributes(slider2) {
-    if (slider2.options?.disabled) {
-      slider2.slides.forEach((slide, i) => {
-        slide.setAttribute("role", "option");
-        updateAriaActiveSlide(slide);
-      });
-      return;
-    }
-    slider2.slides.forEach((slide, i) => {
-      slide.setAttribute("role", "option");
-      if (slideIsActive(i)) updateAriaActiveSlide(slide);
-      else updateAriaInActiveSlide(slide);
-    });
-  }
-  slider.on("slideChanged", updateSlideAriaAttributes);
-  slider.on("created", updateSlideAriaAttributes);
-  slider.on("optionsChanged", updateSlideAriaAttributes);
-  slider.on("updated", updateSlideAriaAttributes);
+/**
+* The `aria-label` this package last wrote on each slide.
+*
+* Module-level because the slider is rebuilt - by every `addPlugin`, by
+* `refresh-on-children-change`, and by a new `config` or `slide-label` - and
+* each rebuild is a fresh plugin with no memory of the last. Without this, a
+* rebuilt slider saw the labels its predecessor had written, took every one
+* for an authored label, and never touched them again: a changed template was
+* ignored, and a slide count that changed left "1 of 3" on a carousel of four.
+*/
+var writtenSlideLabels = /* @__PURE__ */ new WeakMap();
+/**
+* APG's carousel pattern: a labelled group whose role description tells
+* assistive tech what it is, with each slide a group of its own.
+*
+* What this replaces was `role="listbox"` with `role="option"` slides, which
+* told a screen-reader user they were inside a form control they could select
+* from. It also made `aria-valuemin/max/now` invalid — a listbox has no value —
+* and left `aria-required-children` permanently unsatisfiable.
+*
+* The slide attributes used to be applied only from `created`, `slideChanged`,
+* `optionsChanged` and `updated`. `created` fires inside `super()`, before the
+* constructor gets here to subscribe, so on a carousel nobody ever interacted
+* with the slides got no ARIA at all — which is exactly why the container
+* advertised owned `option` children it did not have.
+*
+* `slideLabel` is the `slide-label` template. Each slide's `aria-label` was
+* hard-coded English, so a theme on any other locale could only translate it
+* by authoring a label on every slide by hand.
+*/
+var attachAriaAttributes = (slider, slideLabel) => {
+	const container = slider.container;
+	const authoredContainerLabel = container.hasAttribute("aria-label");
+	const authoredSlideLabels = /* @__PURE__ */ new WeakSet();
+	for (const slide of slider.slides) {
+		const label = slide.getAttribute("aria-label");
+		if (label !== null && label !== writtenSlideLabels.get(slide)) authoredSlideLabels.add(slide);
+	}
+	container.setAttribute("role", "group");
+	container.setAttribute("aria-roledescription", "carousel");
+	if (!authoredContainerLabel) container.setAttribute("aria-label", "Carousel");
+	container.setAttribute("aria-atomic", "false");
+	if (!container.hasAttribute("tabindex")) container.setAttribute("tabindex", "0");
+	for (const attribute of [
+		"aria-multiselectable",
+		"aria-valuemin",
+		"aria-valuemax",
+		"aria-valuenow",
+		"aria-orientation",
+		"aria-busy"
+	]) container.removeAttribute(attribute);
+	/** The fraction of a slide that is in view, 0 when it is fully outside. */
+	function visiblePortion(index) {
+		return slider.track?.details?.slides?.[index]?.portion ?? 0;
+	}
+	function updateTabIndexes(slide, tabindex) {
+		const focusable = Array.from(slide.querySelectorAll("input, a, button:not(:disabled), textarea, select, [tabindex]"));
+		for (const element of focusable) element.setAttribute("tabindex", tabindex);
+	}
+	function updateSlideAriaAttributes(slider) {
+		const total = slider.slides.length;
+		const disabled = Boolean(slider.options?.disabled);
+		slider.slides.forEach((slide, index) => {
+			slide.setAttribute("role", "group");
+			slide.setAttribute("aria-roledescription", "slide");
+			if (!authoredSlideLabels.has(slide)) {
+				const label = formatSlideLabel(slideLabel, index + 1, total);
+				slide.setAttribute("aria-label", label);
+				writtenSlideLabels.set(slide, label);
+			}
+			slide.removeAttribute("aria-selected");
+			slide.removeAttribute("tabindex");
+			const visible = disabled || visiblePortion(index) > 0;
+			slide.setAttribute("data-slide-visible", `${visible}`);
+			const holdsFocus = document.activeElement !== null && slide.contains(document.activeElement);
+			if (!visible && !holdsFocus) slide.setAttribute("aria-hidden", "true");
+			else slide.removeAttribute("aria-hidden");
+			updateTabIndexes(slide, visible ? "0" : "-1");
+		});
+	}
+	slider.on("slideChanged", updateSlideAriaAttributes);
+	slider.on("created", updateSlideAriaAttributes);
+	slider.on("optionsChanged", updateSlideAriaAttributes);
+	slider.on("updated", updateSlideAriaAttributes);
+	updateSlideAriaAttributes(slider);
 };
-class KeenSlider extends _KeenSlider {
-  direction = null;
-  constructor(element, config, plugins = []) {
-    super(element, config, plugins);
-    let prevSlide = 0;
-    this.direction = null;
-    this.on("slideChanged", attachMoreDetails(prevSlide));
-    attachAriaAttributes(this);
-    const _next = this.next, _prev = this.prev;
-    this.next = function() {
-      if (typeof this.options.slides === "number" || typeof this.options.slides === "function")
-        return _next();
-      let amount = 1;
-      if (this.options?.slides && "perScroll" in this.options.slides === true) {
-        amount = this.options?.slides?.perScroll || 1;
-      }
-      if (!this.options.loop) {
-        return this.moveToIdx(
-          constrain(
-            this.track.details.rel + amount,
-            0,
-            this.track.details.maxIdx
-          )
-        );
-      }
-      return this.moveToIdx(constrain(this.track.details.abs + amount), true);
-    };
-    this.prev = function() {
-      if (typeof this.options.slides === "number" || typeof this.options.slides === "function")
-        return _prev();
-      let amount = 1;
-      if (this.options?.slides && "perScroll" in this.options.slides === true) {
-        amount = this.options?.slides?.perScroll || 1;
-      }
-      if (!this.options.loop) {
-        this.moveToIdx(
-          constrain(
-            this.track.details.rel - amount,
-            0,
-            this.track.details.maxIdx
-          )
-        );
-      }
-      return this.moveToIdx(constrain(this.track.details.abs - amount), true);
-    };
-  }
-}
-
+/**
+* Anything that takes typed input. Arrow keys inside one of these belong to
+* the field, not the carousel — without this guard a search box inside a slide
+* cannot be navigated with the keyboard.
+*/
+var TEXT_ENTRY = "input, textarea, select, [contenteditable=\"\"], [contenteditable=\"true\"]";
+/**
+* Arrow-key navigation, and the `aria-live` rule for auto-rotation.
+*
+* The container has carried `tabindex="0"` for as long as the ARIA plugin has
+* existed, with nothing listening — so it took a tab stop and did nothing with
+* it, which is worse than not being focusable. This is the handler that makes
+* the tab stop worth having.
+*
+* `aria-live` was previously hardcoded to `polite` on the container (twice).
+* APG is explicit that a live region on an auto-rotating carousel announces
+* slides the user never asked for, so the announcement is tied to the rotation
+* state instead: silent while rotating, polite once paused and the user is
+* driving.
+*/
+var attachKeyboardNavigation = (slider) => {
+	const container = slider.container;
+	const controller = new AbortController();
+	const isVertical = () => Boolean(slider.options?.vertical);
+	function handleKeydown(event) {
+		if (slider.options?.disabled) return;
+		const target = event.target;
+		if (target instanceof Element && target.closest(TEXT_ENTRY)) return;
+		const back = isVertical() ? "ArrowUp" : "ArrowLeft";
+		const forward = isVertical() ? "ArrowDown" : "ArrowRight";
+		switch (event.key) {
+			case back:
+				event.preventDefault();
+				slider.prev();
+				return;
+			case forward:
+				event.preventDefault();
+				slider.next();
+				return;
+			case "Home":
+				event.preventDefault();
+				slider.moveToIdx(0);
+				return;
+			case "End": {
+				event.preventDefault();
+				const details = slider.track?.details;
+				const last = Number.isFinite(details?.maxIdx) ? details?.maxIdx ?? 0 : slider.slides.length - 1;
+				slider.moveToIdx(last);
+				return;
+			}
+		}
+	}
+	/**
+	* `keen-slider-auto-switch` already dispatches this, and the autoplay
+	* package publishes its pause state the same way, so both drive one code
+	* path here rather than each teaching the carousel about itself.
+	*/
+	function handleRotationChange(event) {
+		const rotating = event.detail?.isPaused === false;
+		container.setAttribute("aria-live", rotating ? "off" : "polite");
+	}
+	container.addEventListener("keydown", handleKeydown, { signal: controller.signal });
+	container.addEventListener("autoswitch:update", handleRotationChange, { signal: controller.signal });
+	container.addEventListener("autoplay:update", handleRotationChange, { signal: controller.signal });
+	if (!container.hasAttribute("aria-live")) container.setAttribute("aria-live", "polite");
+	slider.on("destroyed", () => controller.abort());
+};
+var KeenSlider = class extends _KeenSlider {
+	direction = null;
+	constructor(element, config, plugins = [], accessibility = {}) {
+		super(element, config, plugins);
+		const prevSlide = 0;
+		this.direction = null;
+		this.on("slideChanged", attachMoreDetails(prevSlide));
+		attachAriaAttributes(this, accessibility.slideLabel);
+		attachKeyboardNavigation(this);
+		const _next = this.next, _prev = this.prev;
+		this.next = function() {
+			if (typeof this.options.slides === "number" || typeof this.options.slides === "function") return _next();
+			let amount = 1;
+			if (this.options?.slides && "perScroll" in this.options.slides === true) amount = this.options?.slides?.perScroll || 1;
+			if (!this.options.loop) return this.moveToIdx(constrain(this.track.details.rel + amount, 0, this.track.details.maxIdx));
+			return this.moveToIdx(constrain(this.track.details.abs + amount), true);
+		};
+		this.prev = function() {
+			if (typeof this.options.slides === "number" || typeof this.options.slides === "function") return _prev();
+			let amount = 1;
+			if (this.options?.slides && "perScroll" in this.options.slides === true) amount = this.options?.slides?.perScroll || 1;
+			if (!this.options.loop) this.moveToIdx(constrain(this.track.details.rel - amount, 0, this.track.details.maxIdx));
+			return this.moveToIdx(constrain(this.track.details.abs - amount), true);
+		};
+	}
+};
+//#endregion
 export { KeenSlider as default };
-//# sourceMappingURL=KeenSlider.js.map
+
 //# sourceMappingURL=KeenSlider.js.map

package/dist/main/KeenSlider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/KeenSlider.ts"],"names":["slider"],"mappings":"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","file":"KeenSlider.js","sourcesContent":["import type { ICustomElement } from \"component-register\";\r\n\r\nimport _KeenSlider, {\r\n  type KeenSliderOptions as _KeenSliderOptions,\r\n  type KeenSliderPlugin as _KeenSliderPlugin,\r\n  type KeenSliderInstance as _KeenSliderInstance,\r\n  type KeenSliderHooks as _KeenSliderHooks,\r\n} from \"keen-slider\";\r\n\r\nimport { constrain } from \"./utils\";\r\n\r\nexport type KeenSliderHooks = _KeenSliderHooks;\r\n\r\nexport type KeenSliderInstance<\r\n  O = {},\r\n  P = {},\r\n  H extends _KeenSliderHooks = _KeenSliderHooks,\r\n> = _KeenSliderInstance<O, P, H>;\r\n\r\ntype ExtendedSlidesOption = NonNullable<\r\n  _KeenSliderInstance[\"options\"][\"slides\"]\r\n> & {\r\n  perScroll?: number;\r\n};\r\n\r\ntype ExtendedKeenSliderOptions = Omit<\r\n  _KeenSliderInstance[\"options\"],\r\n  \"slides\"\r\n> & {\r\n  slides?: ExtendedSlidesOption;\r\n};\r\n\r\nexport type KeenSliderOptions<\r\n  O = {},\r\n  P = {},\r\n  H extends _KeenSliderHooks = _KeenSliderHooks,\r\n> = _KeenSliderOptions<O, P, H> & {\r\n  slides: {\r\n    perScroll?: number;\r\n  } & _KeenSliderOptions<O, P, H>[\"slides\"];\r\n};\r\n\r\nexport type KeenSliderPlugin<\r\n  O = {},\r\n  P = {},\r\n  H extends _KeenSliderHooks = _KeenSliderHooks,\r\n> = _KeenSliderPlugin<O, P, H>;\r\n\r\nfunction attachMoreDetails(prevSlide: number) {\r\n  return function (slider: KeenSliderInstance) {\r\n    if (slider.track.details.rel != slider.animator.targetIdx) return;\r\n\r\n    (slider as KeenSlider).direction =\r\n      slider.track.details.rel > prevSlide ? \"forward\" : \"backward\";\r\n\r\n    prevSlide = slider.track.details.rel;\r\n  };\r\n}\r\n\r\nconst attachAriaAttributes: KeenSliderPlugin = (slider) => {\r\n  const maxIdx =\r\n    slider?.track?.details?.maxIdx === Infinity\r\n      ? slider.track.details.length\r\n      : slider?.track?.details?.maxIdx || 0;\r\n  slider.container.setAttribute(\"role\", \"listbox\");\r\n  slider.container.setAttribute(\r\n    \"aria-orientation\",\r\n    slider.options?.vertical ? \"vertical\" : \"horizontal\",\r\n  );\r\n  slider.container.setAttribute(\"aria-multiselectable\", \"false\");\r\n  slider.container.setAttribute(\"aria-label\", \"Slider\");\r\n  slider.container.setAttribute(\"tabindex\", \"0\");\r\n  slider.container.setAttribute(\"aria-live\", \"polite\");\r\n  slider.container.setAttribute(\"aria-atomic\", \"true\");\r\n  slider.container.setAttribute(\"aria-live\", \"polite\");\r\n  slider.container.setAttribute(\"aria-busy\", \"false\");\r\n  slider.container.setAttribute(\"aria-valuemin\", \"0\");\r\n  slider.container.setAttribute(\"aria-valuemax\", `${maxIdx}`);\r\n  slider.container.setAttribute(\r\n    \"aria-valuenow\",\r\n    `${slider?.track?.details?.rel || 0}`,\r\n  );\r\n\r\n  function getMaxRel(rel: number, perView = 1) {\r\n    return Math.floor(rel + perView - 1);\r\n  }\r\n\r\n  function slideIsActive(idx: number) {\r\n    const perView = ((slider.options?.slides as any)?.perView as number) || 1,\r\n      rel = slider.track.details.rel,\r\n      maxRel = getMaxRel(rel, perView);\r\n\r\n    return rel <= idx && idx <= maxRel;\r\n  }\r\n\r\n  async function updateTabIndexes(slide: HTMLElement, tabindex: string) {\r\n    const focusableElements = Array.from(\r\n      slide.querySelectorAll(\r\n        \"input, a, button:not(:disabled), textarea, select, textarea, [tabindex]\",\r\n      ),\r\n    );\r\n    focusableElements.forEach((element) => {\r\n      element.setAttribute(\"tabindex\", tabindex);\r\n    });\r\n  }\r\n\r\n  function updateAriaActiveSlide(slide: HTMLElement) {\r\n    slide.setAttribute(\"aria-selected\", \"true\");\r\n    slide.setAttribute(\"aria-hidden\", \"false\");\r\n    slide.setAttribute(\"tabindex\", \"0\");\r\n    updateTabIndexes(slide, \"0\");\r\n  }\r\n\r\n  function updateAriaInActiveSlide(slide: HTMLElement) {\r\n    slide.setAttribute(\"aria-selected\", \"false\");\r\n    slide.setAttribute(\"aria-hidden\", \"true\");\r\n    slide.setAttribute(\"tabindex\", \"-1\");\r\n    updateTabIndexes(slide, \"-1\");\r\n  }\r\n\r\n  function updateSlideAriaAttributes(slider: _KeenSliderInstance) {\r\n    if (slider.options?.disabled) {\r\n      slider.slides.forEach((slide, i) => {\r\n        slide.setAttribute(\"role\", \"option\");\r\n        updateAriaActiveSlide(slide);\r\n      });\r\n      return;\r\n    }\r\n\r\n    slider.slides.forEach((slide, i) => {\r\n      slide.setAttribute(\"role\", \"option\");\r\n      if (slideIsActive(i)) updateAriaActiveSlide(slide);\r\n      else updateAriaInActiveSlide(slide);\r\n    });\r\n  }\r\n\r\n  slider.on(\"slideChanged\", updateSlideAriaAttributes);\r\n  slider.on(\"created\", updateSlideAriaAttributes);\r\n  slider.on(\"optionsChanged\", updateSlideAriaAttributes);\r\n  slider.on(\"updated\", updateSlideAriaAttributes);\r\n};\r\n\r\nexport default class KeenSlider extends _KeenSlider {\r\n  direction: \"forward\" | \"backward\" | null = null;\r\n  constructor(\r\n    element: ICustomElement & HTMLElement,\r\n    config: KeenSliderOptions,\r\n    plugins: _KeenSliderPlugin[] = [],\r\n  ) {\r\n    super(element, config, plugins);\r\n    let prevSlide = 0;\r\n\r\n    this.direction = null;\r\n    this.on(\"slideChanged\", attachMoreDetails(prevSlide) as any);\r\n\r\n    attachAriaAttributes(this);\r\n\r\n    const _next = this.next,\r\n      _prev = this.prev;\r\n\r\n    this.next = function () {\r\n      if (\r\n        typeof this.options.slides === \"number\" ||\r\n        typeof this.options.slides === \"function\"\r\n      )\r\n        return _next();\r\n      let amount: number = 1;\r\n      if (this.options?.slides && \"perScroll\" in this.options.slides === true) {\r\n        amount = (this.options?.slides?.perScroll as number) || 1;\r\n      }\r\n      if (!this.options.loop) {\r\n        return this.moveToIdx(\r\n          constrain(\r\n            this.track.details.rel + amount,\r\n            0,\r\n            this.track.details.maxIdx,\r\n          ),\r\n        );\r\n      }\r\n      return this.moveToIdx(constrain(this.track.details.abs + amount), true);\r\n    };\r\n\r\n    this.prev = function () {\r\n      if (\r\n        typeof this.options.slides === \"number\" ||\r\n        typeof this.options.slides === \"function\"\r\n      )\r\n        return _prev();\r\n      let amount: number = 1;\r\n      if (this.options?.slides && \"perScroll\" in this.options.slides === true) {\r\n        amount = (this.options?.slides?.perScroll as number) || 1;\r\n      }\r\n      if (!this.options.loop) {\r\n        this.moveToIdx(\r\n          constrain(\r\n            this.track.details.rel - amount,\r\n            0,\r\n            this.track.details.maxIdx,\r\n          ),\r\n        );\r\n      }\r\n      return this.moveToIdx(constrain(this.track.details.abs - amount), true);\r\n    };\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"KeenSlider.js","names":[],"sources":["../../src/KeenSlider.ts"],"sourcesContent":["import type { ICustomElement } from \"component-register\";\n\nimport _KeenSlider, {\n\ttype KeenSliderHooks as _KeenSliderHooks,\n\ttype KeenSliderInstance as _KeenSliderInstance,\n\ttype KeenSliderOptions as _KeenSliderOptions,\n\ttype KeenSliderPlugin as _KeenSliderPlugin,\n} from \"keen-slider\";\n\nimport { constrain, formatSlideLabel } from \"./utils\";\n\nexport type KeenSliderHooks = _KeenSliderHooks;\n\nexport type KeenSliderInstance<\n\tO = {},\n\tP = {},\n\tH extends _KeenSliderHooks = _KeenSliderHooks,\n> = _KeenSliderInstance<O, P, H>;\n\ntype ExtendedSlidesOption = NonNullable<\n\t_KeenSliderInstance[\"options\"][\"slides\"]\n> & {\n\tperScroll?: number;\n};\n\ntype ExtendedKeenSliderOptions = Omit<\n\t_KeenSliderInstance[\"options\"],\n\t\"slides\"\n> & {\n\tslides?: ExtendedSlidesOption;\n};\n\nexport type KeenSliderOptions<\n\tO = {},\n\tP = {},\n\tH extends _KeenSliderHooks = _KeenSliderHooks,\n> = _KeenSliderOptions<O, P, H> & {\n\tslides: {\n\t\tperScroll?: number;\n\t} & _KeenSliderOptions<O, P, H>[\"slides\"];\n};\n\nexport type KeenSliderPlugin<\n\tO = {},\n\tP = {},\n\tH extends _KeenSliderHooks = _KeenSliderHooks,\n> = _KeenSliderPlugin<O, P, H>;\n\nfunction attachMoreDetails(prevSlide: number) {\n\treturn (slider: KeenSliderInstance) => {\n\t\tif (slider.track.details.rel !== slider.animator.targetIdx) return;\n\n\t\t(slider as KeenSlider).direction =\n\t\t\tslider.track.details.rel > prevSlide ? \"forward\" : \"backward\";\n\n\t\tprevSlide = slider.track.details.rel;\n\t};\n}\n\n/**\n * The `aria-label` this package last wrote on each slide.\n *\n * Module-level because the slider is rebuilt - by every `addPlugin`, by\n * `refresh-on-children-change`, and by a new `config` or `slide-label` - and\n * each rebuild is a fresh plugin with no memory of the last. Without this, a\n * rebuilt slider saw the labels its predecessor had written, took every one\n * for an authored label, and never touched them again: a changed template was\n * ignored, and a slide count that changed left \"1 of 3\" on a carousel of four.\n */\nconst writtenSlideLabels = new WeakMap<Element, string>();\n\n/**\n * APG's carousel pattern: a labelled group whose role description tells\n * assistive tech what it is, with each slide a group of its own.\n *\n * What this replaces was `role=\"listbox\"` with `role=\"option\"` slides, which\n * told a screen-reader user they were inside a form control they could select\n * from. It also made `aria-valuemin/max/now` invalid — a listbox has no value —\n * and left `aria-required-children` permanently unsatisfiable.\n *\n * The slide attributes used to be applied only from `created`, `slideChanged`,\n * `optionsChanged` and `updated`. `created` fires inside `super()`, before the\n * constructor gets here to subscribe, so on a carousel nobody ever interacted\n * with the slides got no ARIA at all — which is exactly why the container\n * advertised owned `option` children it did not have.\n *\n * `slideLabel` is the `slide-label` template. Each slide's `aria-label` was\n * hard-coded English, so a theme on any other locale could only translate it\n * by authoring a label on every slide by hand.\n */\nconst attachAriaAttributes = (\n\tslider: KeenSliderInstance,\n\tslideLabel: string | undefined,\n) => {\n\tconst container = slider.container;\n\n\t// Anything the markup already said is the author's. Recorded before the\n\t// first write, and checked against what an earlier instance wrote, because\n\t// otherwise every label this package wrote looks authored.\n\tconst authoredContainerLabel = container.hasAttribute(\"aria-label\");\n\tconst authoredSlideLabels = new WeakSet<Element>();\n\tfor (const slide of slider.slides) {\n\t\tconst label = slide.getAttribute(\"aria-label\");\n\t\tif (label !== null && label !== writtenSlideLabels.get(slide)) {\n\t\t\tauthoredSlideLabels.add(slide);\n\t\t}\n\t}\n\n\tcontainer.setAttribute(\"role\", \"group\");\n\tcontainer.setAttribute(\"aria-roledescription\", \"carousel\");\n\tif (!authoredContainerLabel) {\n\t\tcontainer.setAttribute(\"aria-label\", \"Carousel\");\n\t}\n\t// `false`, so moving a slide announces that slide rather than re-reading\n\t// the whole carousel. `aria-live` itself belongs to the auto-rotation\n\t// handling, which knows whether announcing is wanted at all.\n\tcontainer.setAttribute(\"aria-atomic\", \"false\");\n\tif (!container.hasAttribute(\"tabindex\")) {\n\t\tcontainer.setAttribute(\"tabindex\", \"0\");\n\t}\n\n\t// These were written by the previous version of this plugin and are not\n\t// valid on `group`. A theme has no reason to have set them itself.\n\tfor (const attribute of [\n\t\t\"aria-multiselectable\",\n\t\t\"aria-valuemin\",\n\t\t\"aria-valuemax\",\n\t\t\"aria-valuenow\",\n\t\t\"aria-orientation\",\n\t\t\"aria-busy\",\n\t]) {\n\t\tcontainer.removeAttribute(attribute);\n\t}\n\n\t/** The fraction of a slide that is in view, 0 when it is fully outside. */\n\tfunction visiblePortion(index: number) {\n\t\treturn slider.track?.details?.slides?.[index]?.portion ?? 0;\n\t}\n\n\tfunction updateTabIndexes(slide: HTMLElement, tabindex: string) {\n\t\tconst focusable = Array.from(\n\t\t\tslide.querySelectorAll(\n\t\t\t\t\"input, a, button:not(:disabled), textarea, select, [tabindex]\",\n\t\t\t),\n\t\t);\n\t\tfor (const element of focusable) {\n\t\t\telement.setAttribute(\"tabindex\", tabindex);\n\t\t}\n\t}\n\n\tfunction updateSlideAriaAttributes(slider: _KeenSliderInstance) {\n\t\tconst total = slider.slides.length;\n\t\tconst disabled = Boolean(slider.options?.disabled);\n\n\t\tslider.slides.forEach((slide, index) => {\n\t\t\tslide.setAttribute(\"role\", \"group\");\n\t\t\tslide.setAttribute(\"aria-roledescription\", \"slide\");\n\t\t\tif (!authoredSlideLabels.has(slide)) {\n\t\t\t\tconst label = formatSlideLabel(slideLabel, index + 1, total);\n\t\t\t\tslide.setAttribute(\"aria-label\", label);\n\t\t\t\twrittenSlideLabels.set(slide, label);\n\t\t\t}\n\t\t\t// Carried over from the listbox model; meaningless on a slide.\n\t\t\tslide.removeAttribute(\"aria-selected\");\n\t\t\t// A slide is a group, not a tab stop. Its contents still are.\n\t\t\tslide.removeAttribute(\"tabindex\");\n\n\t\t\tconst visible = disabled || visiblePortion(index) > 0;\n\n\t\t\t// The styling contract. ARIA is not one: keying CSS off `aria-hidden`\n\t\t\t// is what made removing it a silent breaking change for every theme\n\t\t\t// descended from the skeleton.\n\t\t\tslide.setAttribute(\"data-slide-visible\", `${visible}`);\n\n\t\t\t// `aria-hidden` only where the slide is genuinely out of view, and\n\t\t\t// never over the focused element — hiding focused content strands the\n\t\t\t// user, which is what axe's `aria-hidden-focus` rule is about. The\n\t\t\t// old code hid every inactive slide, so in any multi-slide-per-view\n\t\t\t// carousel it hid slides the user could plainly see.\n\t\t\tconst holdsFocus =\n\t\t\t\tdocument.activeElement !== null &&\n\t\t\t\tslide.contains(document.activeElement);\n\t\t\tif (!visible && !holdsFocus) slide.setAttribute(\"aria-hidden\", \"true\");\n\t\t\telse slide.removeAttribute(\"aria-hidden\");\n\n\t\t\tupdateTabIndexes(slide, visible ? \"0\" : \"-1\");\n\t\t});\n\t}\n\n\tslider.on(\"slideChanged\", updateSlideAriaAttributes);\n\tslider.on(\"created\", updateSlideAriaAttributes);\n\tslider.on(\"optionsChanged\", updateSlideAriaAttributes);\n\tslider.on(\"updated\", updateSlideAriaAttributes);\n\n\t// `created` has already fired by the time this plugin is attached, so the\n\t// subscriptions above would otherwise leave the first render unwritten.\n\tupdateSlideAriaAttributes(slider);\n};\n\n/**\n * Anything that takes typed input. Arrow keys inside one of these belong to\n * the field, not the carousel — without this guard a search box inside a slide\n * cannot be navigated with the keyboard.\n */\nconst TEXT_ENTRY =\n\t'input, textarea, select, [contenteditable=\"\"], [contenteditable=\"true\"]';\n\n/**\n * Arrow-key navigation, and the `aria-live` rule for auto-rotation.\n *\n * The container has carried `tabindex=\"0\"` for as long as the ARIA plugin has\n * existed, with nothing listening — so it took a tab stop and did nothing with\n * it, which is worse than not being focusable. This is the handler that makes\n * the tab stop worth having.\n *\n * `aria-live` was previously hardcoded to `polite` on the container (twice).\n * APG is explicit that a live region on an auto-rotating carousel announces\n * slides the user never asked for, so the announcement is tied to the rotation\n * state instead: silent while rotating, polite once paused and the user is\n * driving.\n */\nconst attachKeyboardNavigation: KeenSliderPlugin = (slider) => {\n\tconst container = slider.container;\n\tconst controller = new AbortController();\n\n\tconst isVertical = () => Boolean(slider.options?.vertical);\n\n\tfunction handleKeydown(event: KeyboardEvent) {\n\t\tif (slider.options?.disabled) return;\n\n\t\tconst target = event.target;\n\t\tif (target instanceof Element && target.closest(TEXT_ENTRY)) return;\n\n\t\tconst back = isVertical() ? \"ArrowUp\" : \"ArrowLeft\";\n\t\tconst forward = isVertical() ? \"ArrowDown\" : \"ArrowRight\";\n\n\t\tswitch (event.key) {\n\t\t\tcase back:\n\t\t\t\tevent.preventDefault();\n\t\t\t\tslider.prev();\n\t\t\t\treturn;\n\t\t\tcase forward:\n\t\t\t\tevent.preventDefault();\n\t\t\t\tslider.next();\n\t\t\t\treturn;\n\t\t\tcase \"Home\":\n\t\t\t\tevent.preventDefault();\n\t\t\t\tslider.moveToIdx(0);\n\t\t\t\treturn;\n\t\t\tcase \"End\": {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst details = slider.track?.details;\n\t\t\t\tconst last = Number.isFinite(details?.maxIdx)\n\t\t\t\t\t? (details?.maxIdx ?? 0)\n\t\t\t\t\t: slider.slides.length - 1;\n\t\t\t\tslider.moveToIdx(last);\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * `keen-slider-auto-switch` already dispatches this, and the autoplay\n\t * package publishes its pause state the same way, so both drive one code\n\t * path here rather than each teaching the carousel about itself.\n\t */\n\tfunction handleRotationChange(event: Event) {\n\t\tconst detail = (event as CustomEvent<{ isPaused?: boolean }>).detail;\n\t\tconst rotating = detail?.isPaused === false;\n\t\tcontainer.setAttribute(\"aria-live\", rotating ? \"off\" : \"polite\");\n\t}\n\n\tcontainer.addEventListener(\"keydown\", handleKeydown, {\n\t\tsignal: controller.signal,\n\t});\n\tcontainer.addEventListener(\"autoswitch:update\", handleRotationChange, {\n\t\tsignal: controller.signal,\n\t});\n\tcontainer.addEventListener(\"autoplay:update\", handleRotationChange, {\n\t\tsignal: controller.signal,\n\t});\n\n\t// Nothing is auto-rotating until something says so, and a carousel the user\n\t// drives should announce where they have got to.\n\tif (!container.hasAttribute(\"aria-live\")) {\n\t\tcontainer.setAttribute(\"aria-live\", \"polite\");\n\t}\n\n\tslider.on(\"destroyed\", () => controller.abort());\n};\n\nexport type KeenSliderAccessibilityOptions = {\n\t/** Template for each slide's `aria-label`: `{n}` and `{total}`. */\n\tslideLabel?: string;\n};\n\nexport default class KeenSlider extends _KeenSlider {\n\tdirection: \"forward\" | \"backward\" | null = null;\n\tconstructor(\n\t\telement: ICustomElement & HTMLElement,\n\t\tconfig: KeenSliderOptions,\n\t\tplugins: _KeenSliderPlugin[] = [],\n\t\taccessibility: KeenSliderAccessibilityOptions = {},\n\t) {\n\t\tsuper(element, config, plugins);\n\t\tconst prevSlide = 0;\n\n\t\tthis.direction = null;\n\t\tthis.on(\"slideChanged\", attachMoreDetails(prevSlide) as any);\n\n\t\tattachAriaAttributes(this, accessibility.slideLabel);\n\t\tattachKeyboardNavigation(this);\n\n\t\tconst _next = this.next,\n\t\t\t_prev = this.prev;\n\n\t\tthis.next = function () {\n\t\t\tif (\n\t\t\t\ttypeof this.options.slides === \"number\" ||\n\t\t\t\ttypeof this.options.slides === \"function\"\n\t\t\t)\n\t\t\t\treturn _next();\n\t\t\tlet amount: number = 1;\n\t\t\tif (this.options?.slides && \"perScroll\" in this.options.slides === true) {\n\t\t\t\tamount = (this.options?.slides?.perScroll as number) || 1;\n\t\t\t}\n\t\t\tif (!this.options.loop) {\n\t\t\t\treturn this.moveToIdx(\n\t\t\t\t\tconstrain(\n\t\t\t\t\t\tthis.track.details.rel + amount,\n\t\t\t\t\t\t0,\n\t\t\t\t\t\tthis.track.details.maxIdx,\n\t\t\t\t\t),\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn this.moveToIdx(constrain(this.track.details.abs + amount), true);\n\t\t};\n\n\t\tthis.prev = function () {\n\t\t\tif (\n\t\t\t\ttypeof this.options.slides === \"number\" ||\n\t\t\t\ttypeof this.options.slides === \"function\"\n\t\t\t)\n\t\t\t\treturn _prev();\n\t\t\tlet amount: number = 1;\n\t\t\tif (this.options?.slides && \"perScroll\" in this.options.slides === true) {\n\t\t\t\tamount = (this.options?.slides?.perScroll as number) || 1;\n\t\t\t}\n\t\t\tif (!this.options.loop) {\n\t\t\t\tthis.moveToIdx(\n\t\t\t\t\tconstrain(\n\t\t\t\t\t\tthis.track.details.rel - amount,\n\t\t\t\t\t\t0,\n\t\t\t\t\t\tthis.track.details.maxIdx,\n\t\t\t\t\t),\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn this.moveToIdx(constrain(this.track.details.abs - amount), true);\n\t\t};\n\t}\n}\n"],"mappings":"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"}

package/dist/main/components/index.js

@@ -1,4 +1 @@
-import * as keenSlider_js from './keen-slider.js';
-export { keenSlider_js as KeenSlider };
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map
+import "./keen-slider.js";

package/dist/main/components/keen-slider.js

@@ -1,28 +1,27 @@
-import { observable } from 'solid-js';
-import '../KeenSlider.js';
-import { provideKeenSliderContext, useKeenSliderContext } from '../hooks/index.js';
-
-const Name = `keen-slider`;
-const Component = (props, { element }) => {
-  const context = provideKeenSliderContext(props, element);
-  const [slider, methods] = useKeenSliderContext(context);
-  const observer = observable(slider);
-  Object.assign(element, {
-    subscribe(callback = (_) => null) {
-      function listen(slider2) {
-        const cleanup = callback(slider2);
-        slider2.on(
-          "destroyed",
-          typeof cleanup === "function" ? cleanup : () => null
-        );
-      }
-      return observer.subscribe(listen).unsubscribe;
-    }
-  });
-  Object.assign(element, { slider });
-  Object.assign(element, { addPlugin: methods.addPlugin });
+import "../KeenSlider.js";
+import { provideKeenSliderContext, useKeenSliderContext } from "../hooks/useKeenSlider.js";
+import "../hooks/index.js";
+import { createGuardedEffect } from "@brytdesigns/web-component-core/utils";
+import { createRoot } from "solid-js";
+//#region src/components/keen-slider.ts
+var Name = `keen-slider`;
+var Component = (props, { element }) => {
+	const context = provideKeenSliderContext(props, element);
+	const [slider, methods] = useKeenSliderContext(context);
+	Object.assign(element, { subscribe(callback = (_) => null) {
+		function listen(slider) {
+			const cleanup = callback(slider);
+			slider.on("destroyed", typeof cleanup === "function" ? cleanup : () => null);
+		}
+		return createRoot((dispose) => {
+			createGuardedEffect(slider, listen);
+			return dispose;
+		});
+	} });
+	Object.assign(element, { slider });
+	Object.assign(element, { addPlugin: methods.addPlugin });
 };
-
+//#endregion
 export { Component, Name };
-//# sourceMappingURL=keen-slider.js.map
+
 //# sourceMappingURL=keen-slider.js.map

package/dist/main/components/keen-slider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/keen-slider.ts"],"names":["slider"],"mappings":";;;;AAmBO,MAAM,IAAO,GAAA,CAAA,WAAA;AAEb,MAAM,SAAyC,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC5E,EAAM,MAAA,OAAA,GAAU,wBAAyB,CAAA,KAAA,EAAO,OAAO,CAAA;AACvD,EAAA,MAAM,CAAC,MAAA,EAAQ,OAAO,CAAA,GAAI,qBAAqB,OAAO,CAAA;AAEtD,EAAM,MAAA,QAAA,GAAW,WAAW,MAAM,CAAA;AAElC,EAAA,MAAA,CAAO,OAAO,OAAS,EAAA;AAAA,IACrB,SAAU,CAAA,QAAA,GAAW,CAAC,CAAA,KAA0B,IAAM,EAAA;AACpD,MAAA,SAAS,OAAOA,OAA4B,EAAA;AAC1C,QAAM,MAAA,OAAA,GAAU,SAASA,OAAM,CAAA;AAC/B,QAAAA,OAAO,CAAA,EAAA;AAAA,UACL,WAAA;AAAA,UACA,OAAO,OAAA,KAAY,UAAa,GAAA,OAAA,GAAU,MAAM;AAAA,SAClD;AAAA;AAEF,MAAO,OAAA,QAAA,CAAS,SAAU,CAAA,MAAM,CAAE,CAAA,WAAA;AAAA;AACpC,GACD,CAAA;AAED,EAAA,MAAA,CAAO,MAAO,CAAA,OAAA,EAAS,EAAE,MAAA,EAAQ,CAAA;AACjC,EAAA,MAAA,CAAO,OAAO,OAAS,EAAA,EAAE,SAAW,EAAA,OAAA,CAAQ,WAAW,CAAA;AACzD","file":"keen-slider.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\r\n\r\nimport { observable } from \"solid-js\";\r\nimport _KeenSlider, {\r\n  type KeenSliderInstance,\r\n  type KeenSliderOptions,\r\n} from \"../KeenSlider.js\";\r\n\r\nimport {\r\n  provideKeenSliderContext,\r\n  useKeenSliderContext,\r\n} from \"../hooks/index.js\";\r\n\r\nexport type Props = {\r\n  config?: KeenSliderOptions;\r\n  centerSlides: boolean;\r\n  refreshOnChildrenChange: boolean;\r\n};\r\n\r\nexport const Name = `keen-slider`;\r\n\r\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\r\n  const context = provideKeenSliderContext(props, element);\r\n  const [slider, methods] = useKeenSliderContext(context);\r\n\r\n  const observer = observable(slider);\r\n\r\n  Object.assign(element, {\r\n    subscribe(callback = (_: KeenSliderInstance) => null) {\r\n      function listen(slider: KeenSliderInstance) {\r\n        const cleanup = callback(slider);\r\n        slider.on(\r\n          \"destroyed\",\r\n          typeof cleanup === \"function\" ? cleanup : () => null,\r\n        );\r\n      }\r\n      return observer.subscribe(listen).unsubscribe;\r\n    },\r\n  });\r\n\r\n  Object.assign(element, { slider });\r\n  Object.assign(element, { addPlugin: methods.addPlugin });\r\n};\r\n"]}
+{"version":3,"file":"keen-slider.js","names":[],"sources":["../../../src/components/keen-slider.ts"],"sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport { createGuardedEffect } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createRoot } from \"solid-js\";\nimport {\n\tprovideKeenSliderContext,\n\tuseKeenSliderContext,\n} from \"../hooks/index.js\";\nimport _KeenSlider, {\n\ttype KeenSliderInstance,\n\ttype KeenSliderOptions,\n} from \"../KeenSlider.js\";\n\nexport type Props = {\n\tconfig?: KeenSliderOptions;\n\tcenterSlides: boolean;\n\trefreshOnChildrenChange: boolean;\n\t/**\n\t * Each slide's `aria-label`. `{n}` is replaced with the slide number and\n\t * `{total}` with the slide count. Translate it rather than reaching in from\n\t * a theme. Slides that already carry an `aria-label` keep their own.\n\t */\n\tslideLabel: string;\n};\n\nexport const Name = `keen-slider`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n\tconst context = provideKeenSliderContext(props, element);\n\tconst [slider, methods] = useKeenSliderContext(context);\n\n\tObject.assign(element, {\n\t\t// `observable` is gone in v2; pushing a signal out to an external\n\t\t// subscriber is now an effect inside its own root, so the returned\n\t\t// disposer is the unsubscribe. The public signature is unchanged.\n\t\tsubscribe(callback = (_: KeenSliderInstance) => null) {\n\t\t\tfunction listen(slider: KeenSliderInstance) {\n\t\t\t\tconst cleanup = callback(slider);\n\t\t\t\tslider.on(\n\t\t\t\t\t\"destroyed\",\n\t\t\t\t\ttypeof cleanup === \"function\" ? cleanup : () => null,\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn createRoot((dispose) => {\n\t\t\t\tcreateGuardedEffect(slider, listen);\n\t\t\t\treturn dispose;\n\t\t\t});\n\t\t},\n\t});\n\n\tObject.assign(element, { slider });\n\tObject.assign(element, { addPlugin: methods.addPlugin });\n};\n"],"mappings":";;;;;;AAyBA,IAAa,OAAO;AAEpB,IAAa,aAA0C,OAAO,EAAE,cAAc;CAC7E,MAAM,UAAU,yBAAyB,OAAO,OAAO;CACvD,MAAM,CAAC,QAAQ,WAAW,qBAAqB,OAAO;CAEtD,OAAO,OAAO,SAAS,EAItB,UAAU,YAAY,MAA0B,MAAM;EACrD,SAAS,OAAO,QAA4B;GAC3C,MAAM,UAAU,SAAS,MAAM;GAC/B,OAAO,GACN,aACA,OAAO,YAAY,aAAa,gBAAgB,IACjD;EACD;EACA,OAAO,YAAY,YAAY;GAC9B,oBAAoB,QAAQ,MAAM;GAClC,OAAO;EACR,CAAC;CACF,EACD,CAAC;CAED,OAAO,OAAO,SAAS,EAAE,OAAO,CAAC;CACjC,OAAO,OAAO,SAAS,EAAE,WAAW,QAAQ,UAAU,CAAC;AACxD"}

package/dist/main/hooks/index.js

@@ -1,3 +1,2 @@
-export * from './useKeenSlider.js';
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map
+import { addPlugin, getKeenSliderContext, provideKeenSliderContext, useKeenSlider, useKeenSliderAt, useKeenSliderContext } from "./useKeenSlider.js";
+export { addPlugin, getKeenSliderContext, provideKeenSliderContext, useKeenSlider, useKeenSliderAt, useKeenSliderContext };