@primer/react-brand 0.80.0-rc.e1dc6447 → 0.80.0

package/esm/TestimonialGroup/TestimonialGroup.js

@@ -0,0 +1,190 @@
+import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
+import { useProvidedRefOrCreate as t } from "../hooks/useRef.js";
+import n from "../hooks/useIsomorphicLayoutEffect.js";
+import { useReducedMotion as r } from "../hooks/useReducedMotion.js";
+import { Testimonial as i } from "../Testimonial/Testimonial.js";
+import { CarouselPagination as a } from "../CarouselPagination/CarouselPagination.js";
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/testimonial-group/base-Cq-doRpg.css';/* empty css                                                                                                  */
+import o from "./TestimonialGroup.module.js";
+import { Children as s, cloneElement as c, forwardRef as l, isValidElement as u, useEffect as d, useMemo as f, useRef as p, useState as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region src/TestimonialGroup/TestimonialGroup.tsx
+var _ = { root: "TestimonialGroup" }, v = l(({ children: l, className: v, defaultActiveIndex: y = 0, onChange: b, labels: { carousel: x = "Testimonials", controlsPrev: S = "Previous testimonial", controlsNext: C = "Next testimonial", controlsNavigation: w = "{carousel} navigation", carouselRoleDescription: T = "carousel", slideRoleDescription: E = "slide", indicator: D = "Go to testimonial {current}", slide: O = "Testimonial {current} of {total}", announcement: k = "Testimonial {current} of {total}: {author}" } = {}, "aria-label": A = x, "data-testid": j, ...M }, N) => {
+	let P = f(() => s.toArray(l).filter((e) => u(e) && e.type === i), [l]), F = Math.max(0, Math.min(Number.isInteger(y) ? y : 0, P.length - 1)), [I, L] = m({
+		index: F,
+		targetIndex: F,
+		phase: "idle"
+	}), R = p(I), z = t(N), B = p(null), V = p(null), H = p(b), [U, W] = m(null), G = r(), K = p(null), q = (e, t) => e.replace(/\{(current|total|author|carousel)\}/g, (e, n) => String(t[n] ?? e));
+	if (n(() => {
+		H.current = b;
+	}, [b]), n(() => {
+		let e = B.current;
+		if (!e) return;
+		let t = () => {
+			let t = e.querySelectorAll(`.${o.TestimonialGroup__slide}`), n = Math.max(0, ...Array.from(t, (e) => e.getBoundingClientRect().height));
+			e.style.minHeight = `${Math.ceil(n)}px`;
+			let r = V.current;
+			if (!r) return;
+			let i = P[I.index]?.props.variant === "expressive" ? t[I.index].querySelector(`.${o.TestimonialGroup__quoteMark}`) : null, a = 0;
+			if (i) {
+				let t = e.getBoundingClientRect(), n = i.getBoundingClientRect();
+				a = getComputedStyle(e).direction === "rtl" ? t.right - n.right : n.left - t.left;
+			}
+			r.style.marginInlineStart = `${Math.max(0, a)}px`;
+		};
+		t();
+		let n = new ResizeObserver(t);
+		n.observe(e);
+		for (let t of e.children) n.observe(t);
+		return () => n.disconnect();
+	}, [P, I.index]), d(() => {
+		let e = B.current?.children;
+		if (e) for (let [t, n] of Array.from(e).entries()) n.toggleAttribute("inert", t !== I.index);
+	}, [P, I.index]), d(() => {
+		if (!z.current || P.length === 0) return;
+		let e = !1, t = R.current, n = P.length, r = (e) => {
+			t = e, R.current = e, L(e);
+		}, i = () => {
+			let n = t.targetIndex, i = n !== t.index;
+			r({
+				...t,
+				index: n,
+				phase: G ? "idle" : "in"
+			}), e && W(n), e = !1, i && H.current?.(n);
+		};
+		return K.current = {
+			changeTo: (a) => {
+				if (a < 0 || a >= n) return;
+				if (a === t.index && t.phase !== "out") {
+					W(a);
+					return;
+				}
+				e = !0;
+				let o = t.phase === "out";
+				if (r({
+					...t,
+					targetIndex: a
+				}), G) {
+					i();
+					return;
+				}
+				if (o) {
+					a === t.index && (r({
+						...t,
+						phase: "in"
+					}), W(t.index), e = !1);
+					return;
+				}
+				r({
+					...t,
+					phase: "out"
+				});
+			},
+			finishPhase: () => {
+				t.phase === "out" ? i() : t.phase === "in" && r({
+					...t,
+					phase: "idle"
+				});
+			}
+		}, t.index >= n || t.targetIndex >= n ? r({
+			index: n - 1,
+			targetIndex: n - 1,
+			phase: "idle"
+		}) : t.phase !== "idle" && i(), () => {
+			K.current = null;
+		};
+	}, [
+		G,
+		P.length,
+		z
+	]), d(() => {
+		if (I.phase === "idle" || G) return;
+		let e = B.current?.children[I.index];
+		if (!e) return;
+		let t = (e) => {
+			let t = Number.parseFloat(e);
+			return Number.isFinite(t) ? t * (e.trim().endsWith("ms") ? 1 : 1e3) : 0;
+		}, n = 0, r = e.querySelectorAll([
+			o.TestimonialGroup__quoteMark,
+			o.TestimonialGroup__quote,
+			o.TestimonialGroup__media
+		].map((e) => `.${e}`).join(","));
+		for (let e of r) {
+			let r = getComputedStyle(e), i = r.transitionDuration.split(",").map(t), a = r.transitionDelay.split(",").map(t);
+			for (let [e, t] of r.transitionProperty.split(",").entries()) t.trim() !== "opacity" && t.trim() !== "all" || (n = Math.max(n, i[e % i.length] + a[e % a.length]));
+		}
+		let i = setTimeout(() => K.current?.finishPhase(), n);
+		return () => clearTimeout(i);
+	}, [
+		G,
+		I.index,
+		I.phase
+	]), P.length === 0) return null;
+	let J = U === null ? void 0 : P[U], Y = J && s.toArray(J.props.children).find((e) => u(e) && e.type === i.Name)?.props.children, X = typeof Y == "string" && Y.trim().length > 0;
+	return /* @__PURE__ */ g("div", {
+		...M,
+		ref: z,
+		role: "region",
+		"aria-roledescription": T,
+		"aria-label": A,
+		"data-testid": j || _.root,
+		className: e(o.TestimonialGroup, v),
+		children: [/* @__PURE__ */ g("div", {
+			className: e(o.TestimonialGroup__content, P.some((e) => e.props.variant === "expressive") && o["TestimonialGroup__content--expressive"]),
+			children: [P.length > 1 && /* @__PURE__ */ h("div", {
+				ref: V,
+				className: o.TestimonialGroup__controls,
+				children: /* @__PURE__ */ h(a, {
+					loop: !0,
+					itemCount: P.length,
+					activeIndex: I.targetIndex,
+					"aria-label": q(w, { carousel: A }),
+					labels: {
+						previous: S,
+						next: C
+					},
+					itemAttributesBuilder: (e) => ({ "aria-label": q(D, {
+						current: e + 1,
+						total: P.length
+					}) }),
+					onChange: (e) => K.current?.changeTo(e)
+				})
+			}), /* @__PURE__ */ h("div", {
+				ref: B,
+				className: o.TestimonialGroup__slides,
+				children: P.map((t, n) => /* @__PURE__ */ h("div", {
+					className: e(o.TestimonialGroup__slide, n === I.index && o["TestimonialGroup__slide--active"]),
+					role: "group",
+					"aria-roledescription": E,
+					"aria-label": q(O, {
+						current: n + 1,
+						total: P.length
+					}),
+					"aria-hidden": n !== I.index || void 0,
+					children: c(t, {
+						variant: t.props.variant ?? "minimal",
+						animate: void 0,
+						quoteMarkClassName: e(t.props.quoteMarkClassName, o.TestimonialGroup__quoteMark),
+						mediaClassName: e(t.props.mediaClassName, o.TestimonialGroup__media),
+						children: s.map(t.props.children, (n) => u(n) ? n.type === i.Quote ? c(n, { className: e(n.props.className, o.TestimonialGroup__quote) }) : n.type === i.Avatar ? c(n, { className: e(n.props.className, o.TestimonialGroup__avatar, t.props.size === "large" && o["TestimonialGroup__avatar--size-large"]) }) : n : n),
+						className: e(t.props.className, o[`TestimonialGroup__testimonial--${n === I.index ? I.phase : "out"}`])
+					})
+				}, t.key))
+			})]
+		}), /* @__PURE__ */ h("span", {
+			className: o.TestimonialGroup__announcement,
+			role: "status",
+			"aria-live": "polite",
+			"aria-atomic": "true",
+			children: U !== null && J && q(X ? k : O, {
+				current: U + 1,
+				total: P.length,
+				author: X ? Y : void 0
+			})
+		})]
+	});
+}), y = Object.assign(v, { testIds: _ });
+//#endregion
+export { y as TestimonialGroup };
+
+//# sourceMappingURL=TestimonialGroup.js.map

package/esm/TestimonialGroup/TestimonialGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TestimonialGroup.js","names":[],"sources":["../../src/TestimonialGroup/TestimonialGroup.tsx"],"sourcesContent":["import React, {Children, cloneElement, forwardRef, isValidElement, useEffect, useMemo, useRef, useState} from 'react'\nimport {clsx} from 'clsx'\nimport {Testimonial, type TestimonialProps} from '../Testimonial'\nimport {CarouselPagination} from '../CarouselPagination'\nimport {useReducedMotion} from '../hooks/useReducedMotion'\nimport {useProvidedRefOrCreate} from '../hooks/useRef'\nimport useIsomorphicLayoutEffect from '../hooks/useIsomorphicLayoutEffect'\nimport type {BaseProps} from '../component-helpers'\n\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/testimonial-group/base.css'\nimport styles from './TestimonialGroup.module.css'\n\nconst testIds = {\n  root: 'TestimonialGroup',\n}\n\nexport type TestimonialGroupProps = BaseProps<HTMLDivElement> &\n  Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> & {\n    'data-testid'?: string\n    /** Initial testimonial: 0 for the first, 1 for the second. */\n    defaultActiveIndex?: number\n    /** Called after a testimonial changes, with its index (first is 0). */\n    onChange?: (activeIndex: number) => void\n    /** Overrides accessible control labels and slide announcements. */\n    labels?: {\n      carousel?: string\n      controlsPrev?: string\n      controlsNext?: string\n      controlsNavigation?: string\n      carouselRoleDescription?: string\n      slideRoleDescription?: string\n      /** Complete selector label using {current} and {total}. */\n      indicator?: string\n      /** Complete slide label using {current} and {total}. */\n      slide?: string\n      /** Complete announcement using {current}, {total}, and {author}. */\n      announcement?: string\n    }\n  }\n\ntype TestimonialGroupView = {index: number; targetIndex: number; phase: 'idle' | 'out' | 'in'}\n\nconst Root = forwardRef<HTMLDivElement, TestimonialGroupProps>(\n  (\n    {\n      children,\n      className,\n      defaultActiveIndex = 0,\n      onChange,\n      labels: {\n        carousel = 'Testimonials',\n        controlsPrev = 'Previous testimonial',\n        controlsNext = 'Next testimonial',\n        controlsNavigation = '{carousel} navigation',\n        carouselRoleDescription = 'carousel',\n        slideRoleDescription = 'slide',\n        indicator = 'Go to testimonial {current}',\n        slide: slideLabel = 'Testimonial {current} of {total}',\n        announcement: announcementLabel = 'Testimonial {current} of {total}: {author}',\n      } = {},\n      'aria-label': ariaLabel = carousel,\n      'data-testid': testId,\n      ...props\n    },\n    forwardedRef,\n  ) => {\n    const testimonials = useMemo(\n      () =>\n        Children.toArray(children).filter(\n          (child): child is React.ReactElement<TestimonialProps> =>\n            isValidElement<TestimonialProps>(child) && child.type === Testimonial,\n        ),\n      [children],\n    )\n    const initialIndex = Math.max(\n      0,\n      Math.min(Number.isInteger(defaultActiveIndex) ? defaultActiveIndex : 0, testimonials.length - 1),\n    )\n    const [view, setView] = useState<TestimonialGroupView>({\n      index: initialIndex,\n      targetIndex: initialIndex,\n      phase: 'idle',\n    })\n    const viewRef = useRef(view)\n    const rootRef = useProvidedRefOrCreate<HTMLDivElement | null>(forwardedRef)\n    const slidesRef = useRef<HTMLDivElement>(null)\n    const controlsRef = useRef<HTMLDivElement>(null)\n    const onChangeRef = useRef(onChange)\n    const [announcementIndex, setAnnouncementIndex] = useState<number | null>(null)\n    const prefersReducedMotion = useReducedMotion()\n    const controller = useRef<{\n      changeTo: (index: number) => void\n      finishPhase: () => void\n    } | null>(null)\n    const formatLabel = (\n      template: string,\n      values: {current?: number; total?: number; author?: string; carousel?: string},\n    ) =>\n      template.replace(/\\{(current|total|author|carousel)\\}/g, (placeholder, name: keyof typeof values) =>\n        String(values[name] ?? placeholder),\n      )\n\n    useIsomorphicLayoutEffect(() => {\n      onChangeRef.current = onChange\n    }, [onChange])\n\n    useIsomorphicLayoutEffect(() => {\n      const slidesContainer = slidesRef.current\n      if (!slidesContainer) return\n\n      const measureLayout = () => {\n        const slides = slidesContainer.querySelectorAll<HTMLElement>(`.${styles.TestimonialGroup__slide}`)\n        const tallest = Math.max(0, ...Array.from(slides, slide => slide.getBoundingClientRect().height))\n        slidesContainer.style.minHeight = `${Math.ceil(tallest)}px`\n\n        const controls = controlsRef.current\n        if (!controls) return\n        const quoteMark =\n          testimonials[view.index]?.props.variant === 'expressive'\n            ? slides[view.index].querySelector<HTMLElement>(`.${styles.TestimonialGroup__quoteMark}`)\n            : null\n        let inlineInset = 0\n        if (quoteMark) {\n          const slidesBounds = slidesContainer.getBoundingClientRect()\n          const quoteBounds = quoteMark.getBoundingClientRect()\n          inlineInset =\n            getComputedStyle(slidesContainer).direction === 'rtl'\n              ? slidesBounds.right - quoteBounds.right\n              : quoteBounds.left - slidesBounds.left\n        }\n        controls.style.marginInlineStart = `${Math.max(0, inlineInset)}px`\n      }\n      measureLayout()\n      const observer = new ResizeObserver(measureLayout)\n      observer.observe(slidesContainer)\n      for (const slide of slidesContainer.children) {\n        observer.observe(slide)\n      }\n      return () => observer.disconnect()\n    }, [testimonials, view.index])\n\n    useEffect(() => {\n      const slides = slidesRef.current?.children\n      if (!slides) return\n\n      for (const [index, slide] of Array.from(slides).entries()) {\n        // Workaround to avoid React 18 / 19 type and rendering mismatches with the `inert` attribute.\n        // TODO: Move back to JSX when React 19 is fully adopted in Dotcom.\n        slide.toggleAttribute('inert', index !== view.index)\n      }\n    }, [testimonials, view.index])\n\n    useEffect(() => {\n      const root = rootRef.current\n      if (!root || testimonials.length === 0) return\n      let announceOnCommit = false\n      let current = viewRef.current\n      const count = testimonials.length\n      const updateView = (nextView: TestimonialGroupView) => {\n        current = nextView\n        viewRef.current = nextView\n        setView(nextView)\n      }\n      const commit = () => {\n        const nextIndex = current.targetIndex\n        const changed = nextIndex !== current.index\n        updateView({...current, index: nextIndex, phase: prefersReducedMotion ? 'idle' : 'in'})\n        if (announceOnCommit) setAnnouncementIndex(nextIndex)\n        announceOnCommit = false\n        if (changed) onChangeRef.current?.(nextIndex)\n      }\n      const changeTo = (nextIndex: number) => {\n        if (nextIndex < 0 || nextIndex >= count) return\n        if (nextIndex === current.index && current.phase !== 'out') {\n          setAnnouncementIndex(nextIndex)\n          return\n        }\n        announceOnCommit = true\n        const wasOutgoing = current.phase === 'out'\n        updateView({...current, targetIndex: nextIndex})\n        if (prefersReducedMotion) {\n          commit()\n          return\n        }\n        if (wasOutgoing) {\n          if (nextIndex === current.index) {\n            updateView({...current, phase: 'in'})\n            setAnnouncementIndex(current.index)\n            announceOnCommit = false\n          }\n          return\n        }\n        updateView({...current, phase: 'out'})\n      }\n      controller.current = {\n        changeTo,\n        finishPhase: () => {\n          if (current.phase === 'out') commit()\n          else if (current.phase === 'in') updateView({...current, phase: 'idle'})\n        },\n      }\n      if (current.index >= count || current.targetIndex >= count) {\n        updateView({index: count - 1, targetIndex: count - 1, phase: 'idle'})\n      } else if (current.phase !== 'idle') {\n        commit()\n      }\n      return () => {\n        controller.current = null\n      }\n    }, [prefersReducedMotion, testimonials.length, rootRef])\n\n    useEffect(() => {\n      if (view.phase === 'idle' || prefersReducedMotion) return\n      const activeSlide = slidesRef.current?.children[view.index]\n      if (!activeSlide) return\n      const toMilliseconds = (value: string) => {\n        const duration = Number.parseFloat(value)\n        return Number.isFinite(duration) ? duration * (value.trim().endsWith('ms') ? 1 : 1000) : 0\n      }\n      let completionTime = 0\n      const parts = activeSlide.querySelectorAll<HTMLElement>(\n        [styles.TestimonialGroup__quoteMark, styles.TestimonialGroup__quote, styles.TestimonialGroup__media]\n          .map(partClassName => `.${partClassName}`)\n          .join(','),\n      )\n      for (const part of parts) {\n        const computedStyle = getComputedStyle(part)\n        const durations = computedStyle.transitionDuration.split(',').map(toMilliseconds)\n        const delays = computedStyle.transitionDelay.split(',').map(toMilliseconds)\n        for (const [index, property] of computedStyle.transitionProperty.split(',').entries()) {\n          if (property.trim() !== 'opacity' && property.trim() !== 'all') continue\n          completionTime = Math.max(completionTime, durations[index % durations.length] + delays[index % delays.length])\n        }\n      }\n      const transitionTimer = setTimeout(() => controller.current?.finishPhase(), completionTime)\n      return () => clearTimeout(transitionTimer)\n    }, [prefersReducedMotion, view.index, view.phase])\n\n    if (testimonials.length === 0) return null\n\n    const announcedTestimonial = announcementIndex === null ? undefined : testimonials[announcementIndex]\n    const announcedName =\n      announcedTestimonial &&\n      Children.toArray(announcedTestimonial.props.children).find(\n        (child): child is React.ReactElement<{children?: React.ReactNode}> =>\n          isValidElement(child) && child.type === Testimonial.Name,\n      )?.props.children\n    const hasAnnouncedName = typeof announcedName === 'string' && announcedName.trim().length > 0\n\n    return (\n      <div\n        {...props}\n        ref={rootRef}\n        role=\"region\"\n        aria-roledescription={carouselRoleDescription}\n        aria-label={ariaLabel}\n        data-testid={testId || testIds.root}\n        className={clsx(styles.TestimonialGroup, className)}\n      >\n        <div\n          className={clsx(\n            styles.TestimonialGroup__content,\n            testimonials.some(testimonial => testimonial.props.variant === 'expressive') &&\n              styles['TestimonialGroup__content--expressive'],\n          )}\n        >\n          {testimonials.length > 1 && (\n            <div ref={controlsRef} className={styles.TestimonialGroup__controls}>\n              <CarouselPagination\n                loop\n                itemCount={testimonials.length}\n                activeIndex={view.targetIndex}\n                aria-label={formatLabel(controlsNavigation, {carousel: ariaLabel})}\n                labels={{\n                  previous: controlsPrev,\n                  next: controlsNext,\n                }}\n                itemAttributesBuilder={index => ({\n                  'aria-label': formatLabel(indicator, {current: index + 1, total: testimonials.length}),\n                })}\n                onChange={index => controller.current?.changeTo(index)}\n              />\n            </div>\n          )}\n          <div ref={slidesRef} className={styles.TestimonialGroup__slides}>\n            {testimonials.map((testimonial, index) => (\n              <div\n                key={testimonial.key}\n                className={clsx(\n                  styles.TestimonialGroup__slide,\n                  index === view.index && styles['TestimonialGroup__slide--active'],\n                )}\n                role=\"group\"\n                aria-roledescription={slideRoleDescription}\n                aria-label={formatLabel(slideLabel, {current: index + 1, total: testimonials.length})}\n                aria-hidden={index !== view.index || undefined}\n              >\n                {cloneElement(testimonial, {\n                  variant: testimonial.props.variant ?? 'minimal',\n                  animate: undefined,\n                  quoteMarkClassName: clsx(testimonial.props.quoteMarkClassName, styles.TestimonialGroup__quoteMark),\n                  mediaClassName: clsx(testimonial.props.mediaClassName, styles.TestimonialGroup__media),\n                  children: Children.map(testimonial.props.children, child => {\n                    if (!isValidElement<{className?: string}>(child)) return child\n                    if (child.type === Testimonial.Quote) {\n                      return cloneElement(child, {\n                        className: clsx(child.props.className, styles.TestimonialGroup__quote),\n                      })\n                    }\n                    if (child.type === Testimonial.Avatar) {\n                      return cloneElement(child, {\n                        className: clsx(\n                          child.props.className,\n                          styles.TestimonialGroup__avatar,\n                          testimonial.props.size === 'large' && styles['TestimonialGroup__avatar--size-large'],\n                        ),\n                      })\n                    }\n                    return child\n                  }),\n                  className: clsx(\n                    testimonial.props.className,\n                    styles[`TestimonialGroup__testimonial--${index === view.index ? view.phase : 'out'}`],\n                  ),\n                })}\n              </div>\n            ))}\n          </div>\n        </div>\n        <span className={styles.TestimonialGroup__announcement} role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">\n          {announcementIndex !== null &&\n            announcedTestimonial &&\n            formatLabel(hasAnnouncedName ? announcementLabel : slideLabel, {\n              current: announcementIndex + 1,\n              total: testimonials.length,\n              author: hasAnnouncedName ? announcedName : undefined,\n            })}\n        </span>\n      </div>\n    )\n  },\n)\n\n/**\n * Use TestimonialGroup to display a collection of testimonials in a carousel format.\n * @see https://primer.style/brand/components/TestimonialGroup/\n */\nexport const TestimonialGroup = Object.assign(Root, {testIds})\n"],"mappings":"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"}

package/esm/TestimonialGroup/TestimonialGroup.module-kFxPa1k1.css

@@ -0,0 +1 @@
+.Primer_Brand__TestimonialGroup-module__TestimonialGroup___WSHAX{width:100%;min-width:0;padding-block:calc(var(--base-size-48) + var(--base-size-8));padding-inline:var(--base-size-32)}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__content____OwRq{flex-direction:column;width:100%;display:flex}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__slides___bujxD{flex-direction:column;justify-content:center;width:100%;display:flex;position:relative}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__slide___BQN5P{visibility:hidden;pointer-events:none;width:100%;position:absolute}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__slide--active___Po_Ui{visibility:visible;pointer-events:auto;position:relative}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar___g6C4c{border:var(--base-size-2) solid var(--brand-Testimonial-quoteMarkColor-green);border-radius:50%;flex:none}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar___g6C4c.Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar--size-large___RDqmT{width:var(--base-size-48);height:var(--base-size-48)}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__quoteMark___kFAR6,.Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF,.Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m{transition:opacity var(--brand-TestimonialGroup-fadeInDuration) ease-in-out}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--out___3J8b7 .Primer_Brand__TestimonialGroup-module__TestimonialGroup__quoteMark___kFAR6{opacity:0;transition:opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out .12s}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--out___3J8b7 .Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF{opacity:0;transition:opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 80ms}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--out___3J8b7 .Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m{opacity:0;transition:opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 40ms}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--in___oPvYa .Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF{transition-delay:.1s}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--in___oPvYa .Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m{transition-delay:var(--brand-animation-duration-faster)}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__controls___S4ca5{flex:none;order:1;align-items:center;margin-block-start:var(--base-size-32);padding-block-start:var(--base-size-16);display:flex}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__content--expressive___Ff_H7 .Primer_Brand__TestimonialGroup-module__TestimonialGroup__controls___S4ca5{margin-block-start:0}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__announcement___mOAht{width:var(--brand-borderWidth-thin);height:var(--brand-borderWidth-thin);clip-path:inset(50%);white-space:nowrap;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){.Primer_Brand__TestimonialGroup-module__TestimonialGroup__quoteMark___kFAR6,.Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF,.Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m{transition:none}}@media screen and (width>=63.25rem){.Primer_Brand__TestimonialGroup-module__TestimonialGroup___WSHAX{padding-block:var(--base-size-60);padding-inline:var(--base-size-60)}}

package/esm/TestimonialGroup/TestimonialGroup.module.js

@@ -0,0 +1,22 @@
+import './TestimonialGroup.module-kFxPa1k1.css';//#region src/TestimonialGroup/TestimonialGroup.module.css
+var e = "Primer_Brand__TestimonialGroup-module__TestimonialGroup___WSHAX", t = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__content____OwRq", n = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__slides___bujxD", r = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__slide___BQN5P", i = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar___g6C4c", a = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__quoteMark___kFAR6", o = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF", s = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m", c = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__controls___S4ca5", l = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__announcement___mOAht", u = {
+	TestimonialGroup: e,
+	TestimonialGroup__content: t,
+	TestimonialGroup__slides: n,
+	TestimonialGroup__slide: r,
+	"TestimonialGroup__slide--active": "Primer_Brand__TestimonialGroup-module__TestimonialGroup__slide--active___Po_Ui",
+	TestimonialGroup__avatar: i,
+	"TestimonialGroup__avatar--size-large": "Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar--size-large___RDqmT",
+	TestimonialGroup__quoteMark: a,
+	TestimonialGroup__quote: o,
+	TestimonialGroup__media: s,
+	"TestimonialGroup__testimonial--out": "Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--out___3J8b7",
+	"TestimonialGroup__testimonial--in": "Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--in___oPvYa",
+	TestimonialGroup__controls: c,
+	"TestimonialGroup__content--expressive": "Primer_Brand__TestimonialGroup-module__TestimonialGroup__content--expressive___Ff_H7",
+	TestimonialGroup__announcement: l
+};
+//#endregion
+export { e as TestimonialGroup, l as TestimonialGroup__announcement, i as TestimonialGroup__avatar, t as TestimonialGroup__content, c as TestimonialGroup__controls, s as TestimonialGroup__media, o as TestimonialGroup__quote, a as TestimonialGroup__quoteMark, r as TestimonialGroup__slide, n as TestimonialGroup__slides, u as default };
+
+//# sourceMappingURL=TestimonialGroup.module.js.map

package/esm/TestimonialGroup/TestimonialGroup.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TestimonialGroup.module.js","names":[],"sources":["../../src/TestimonialGroup/TestimonialGroup.module.css"],"sourcesContent":[".TestimonialGroup {\n  width: 100%;\n  min-width: 0;\n  padding-block: calc(var(--base-size-48) + var(--base-size-8));\n  padding-inline: var(--base-size-32);\n}\n\n.TestimonialGroup__content {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n.TestimonialGroup__slides {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  width: 100%;\n}\n\n.TestimonialGroup__slide {\n  position: absolute;\n  width: 100%;\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.TestimonialGroup__slide--active {\n  position: relative;\n  visibility: visible;\n  pointer-events: auto;\n}\n\n.TestimonialGroup__avatar {\n  flex: none;\n  border: var(--base-size-2) solid var(--brand-Testimonial-quoteMarkColor-green);\n  border-radius: 50%;\n}\n\n.TestimonialGroup__avatar.TestimonialGroup__avatar--size-large {\n  width: var(--base-size-48);\n  height: var(--base-size-48);\n}\n\n.TestimonialGroup__quoteMark,\n.TestimonialGroup__quote,\n.TestimonialGroup__media {\n  transition: opacity var(--brand-TestimonialGroup-fadeInDuration) ease-in-out;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__quoteMark {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 120ms;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__quote {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 80ms;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__media {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 40ms;\n}\n\n.TestimonialGroup__testimonial--in .TestimonialGroup__quote {\n  transition-delay: 100ms;\n}\n\n.TestimonialGroup__testimonial--in .TestimonialGroup__media {\n  transition-delay: var(--brand-animation-duration-faster);\n}\n\n.TestimonialGroup__controls {\n  display: flex;\n  flex: none;\n  order: 1;\n  align-items: center;\n  margin-block-start: var(--base-size-32);\n  padding-block-start: var(--base-size-16);\n}\n\n.TestimonialGroup__content--expressive .TestimonialGroup__controls {\n  margin-block-start: 0;\n}\n\n.TestimonialGroup__announcement {\n  position: absolute;\n  width: var(--brand-borderWidth-thin);\n  height: var(--brand-borderWidth-thin);\n  padding: 0;\n  overflow: hidden;\n  clip-path: inset(50%);\n  white-space: nowrap;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .TestimonialGroup__quoteMark,\n  .TestimonialGroup__quote,\n  .TestimonialGroup__media {\n    transition: none;\n  }\n}\n\n@media screen and (min-width: 63.25rem) {\n  .TestimonialGroup {\n    padding-block: var(--base-size-60);\n    padding-inline: var(--base-size-60);\n  }\n}\n"],"mappings":""}

package/esm/TestimonialGroup/index.d.ts

@@ -0,0 +1,2 @@
+export * from './TestimonialGroup';
+//# sourceMappingURL=index.d.ts.map

package/esm/TestimonialGroup/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/TestimonialGroup/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA"}

package/esm/Text/Text.module-Bf-3ooDP.css

@@ -0,0 +1 @@
+.Primer_Brand__Text-module__Text___XeGJJ{font-family:var(--brand-body-fontFamily)}[data-color-mode=dark] .Primer_Brand__Text-module__Text--antialiased___TYoXS{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:auto}@media (prefers-color-scheme:dark){[data-color-mode=auto] .Primer_Brand__Text-module__Text--antialiased___TYoXS{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:auto}}.Primer_Brand__Text-module__Text--default___GhPh_{color:var(--brand-color-text-default)}.Primer_Brand__Text-module__Text--muted___rE6mh{color:var(--brand-color-text-muted)}.Primer_Brand__Text-module__Text-font--mona-sans___a8XJD{font-family:var(--brand-body-fontFamily)}.Primer_Brand__Text-module__Text-font--hubot-sans___ugBUt{font-family:var(--brand-body-fontFamilyAlt)}.Primer_Brand__Text-module__Text-font--monospace___QXHDQ{font-family:var(--brand-fontStack-monospace)}.Primer_Brand__Text-module__Text--1000___tukKR{font-weight:var(--brand-text-weight-1000);font-size:var(--brand-text-size-1000);line-height:var(--brand-text-lineHeight-1000);letter-spacing:var(--brand-text-letterSpacing-1000)}.Primer_Brand__Text-module__Text--900___32GJV{font-weight:var(--brand-text-weight-900);font-size:var(--brand-text-size-900);line-height:var(--brand-text-lineHeight-900);letter-spacing:var(--brand-text-letterSpacing-900)}.Primer_Brand__Text-module__Text--800___fyc1I{font-weight:var(--brand-text-weight-800);font-size:var(--brand-text-size-800);line-height:var(--brand-text-lineHeight-800);letter-spacing:var(--brand-text-letterSpacing-800)}.Primer_Brand__Text-module__Text--700___d10Sw{font-weight:var(--brand-text-weight-700);font-size:var(--brand-text-size-700);line-height:var(--brand-text-lineHeight-700);letter-spacing:var(--brand-text-letterSpacing-700)}.Primer_Brand__Text-module__Text--600___4BFh8{font-weight:var(--brand-text-weight-600);font-size:var(--brand-text-size-600);line-height:var(--brand-text-lineHeight-600)}.Primer_Brand__Text-module__Text--500___PC29z{font-weight:var(--brand-text-weight-500);font-size:var(--brand-text-size-500);line-height:var(--brand-text-lineHeight-500)}.Primer_Brand__Text-module__Text--400___6gPcS{font-weight:var(--brand-text-weight-400);font-size:var(--brand-text-size-400);line-height:var(--brand-text-lineHeight-400);letter-spacing:var(--brand-text-letterSpacing-400)}.Primer_Brand__Text-module__Text--350___3wtcG{font-weight:var(--brand-text-weight-350);font-size:var(--brand-text-size-350);line-height:var(--brand-text-lineHeight-350);letter-spacing:var(--brand-text-letterSpacing-350)}.Primer_Brand__Text-module__Text--300___6_Yx4{font-weight:var(--brand-text-weight-300);font-size:var(--brand-text-size-300);line-height:var(--brand-text-lineHeight-300);letter-spacing:var(--brand-text-letterSpacing-300)}.Primer_Brand__Text-module__Text--200____P1wy{font-weight:var(--brand-text-weight-200);font-size:var(--brand-text-size-200);line-height:var(--brand-text-lineHeight-200);letter-spacing:var(--brand-text-letterSpacing-200)}.Primer_Brand__Text-module__Text--100___B2ueX{font-weight:var(--brand-text-weight-100);font-size:var(--brand-text-size-100);line-height:var(--brand-text-lineHeight-100);letter-spacing:var(--brand-text-letterSpacing-100)}.Primer_Brand__Text-module__Text--weight-heavy___QCeKv,.Primer_Brand__Text-module__Text-narrow--weight-heavy___24MXE{font-weight:var(--base-text-weight-heavy)}.Primer_Brand__Text-module__Text--weight-extrabold___VQOAJ,.Primer_Brand__Text-module__Text-narrow--weight-extrabold___EYii_{font-weight:var(--base-text-weight-extrabold)}.Primer_Brand__Text-module__Text--weight-bold___6UQaB,.Primer_Brand__Text-module__Text-narrow--weight-bold___yldzx{font-weight:var(--base-text-weight-bold)}.Primer_Brand__Text-module__Text--weight-semibold___RwHEI,.Primer_Brand__Text-module__Text-narrow--weight-semibold___WHElR{font-weight:var(--base-text-weight-semibold)}.Primer_Brand__Text-module__Text--weight-medium___qJKf_,.Primer_Brand__Text-module__Text-narrow--weight-medium___rrr6b{font-weight:var(--base-text-weight-medium)}.Primer_Brand__Text-module__Text--weight-normal___8EPr2,.Primer_Brand__Text-module__Text-narrow--weight-normal___2bidj{font-weight:var(--base-text-weight-normal)}.Primer_Brand__Text-module__Text--weight-light___6OYNB,.Primer_Brand__Text-module__Text-narrow--weight-light___LpqTO{font-weight:var(--base-text-weight-light)}.Primer_Brand__Text-module__Text--weight-extralight___C_7HK,.Primer_Brand__Text-module__Text-narrow--weight-extralight___4x_ZL{font-weight:var(--base-text-weight-extralight)}@media screen and (width>=48rem){.Primer_Brand__Text-module__Text-regular--weight-heavy___C6cCn{font-weight:var(--base-text-weight-heavy)}.Primer_Brand__Text-module__Text-regular--weight-extrabold___o622g{font-weight:var(--base-text-weight-extrabold)}.Primer_Brand__Text-module__Text-regular--weight-bold___EIEc7{font-weight:var(--base-text-weight-bold)}.Primer_Brand__Text-module__Text-regular--weight-semibold___5kMg1{font-weight:var(--base-text-weight-semibold)}.Primer_Brand__Text-module__Text-regular--weight-medium___OkZWd{font-weight:var(--base-text-weight-medium)}.Primer_Brand__Text-module__Text-regular--weight-normal___uxTUt{font-weight:var(--base-text-weight-normal)}.Primer_Brand__Text-module__Text-regular--weight-light___aTMvp{font-weight:var(--base-text-weight-light)}.Primer_Brand__Text-module__Text-regular--weight-extralight___GcMAT{font-weight:var(--base-text-weight-extralight)}}@media screen and (width>=80rem){.Primer_Brand__Text-module__Text-wide--weight-heavy___2TsqG{font-weight:var(--base-text-weight-heavy)}.Primer_Brand__Text-module__Text-wide--weight-extrabold___aGeMc{font-weight:var(--base-text-weight-extrabold)}.Primer_Brand__Text-module__Text-wide--weight-bold___nnBEA{font-weight:var(--base-text-weight-bold)}.Primer_Brand__Text-module__Text-wide--weight-semibold___Qz6Ns{font-weight:var(--base-text-weight-semibold)}.Primer_Brand__Text-module__Text-wide--weight-medium___azsiu{font-weight:var(--base-text-weight-medium)}.Primer_Brand__Text-module__Text-wide--weight-normal___qsXEg{font-weight:var(--base-text-weight-normal)}.Primer_Brand__Text-module__Text-wide--weight-light___bYqfS{font-weight:var(--base-text-weight-light)}.Primer_Brand__Text-module__Text-wide--weight-extralight___5n89w{font-weight:var(--base-text-weight-extralight)}}.Primer_Brand__Text-module__Text-align--start___hayyq{text-align:start}.Primer_Brand__Text-module__Text-align--end____rbX8{text-align:end}.Primer_Brand__Text-module__Text-align--center___NERb4{text-align:center}

package/esm/Text/Text.module.js

@@ -1,4 +1,4 @@
-import './Text.module-D0UHZ0pq.css';//#region src/Text/Text.module.css
+import './Text.module-Bf-3ooDP.css';//#region src/Text/Text.module.css
 var e = "Primer_Brand__Text-module__Text___XeGJJ", t = {
 	Text: e,
 	"Text--antialiased": "Primer_Brand__Text-module__Text--antialiased___TYoXS",

package/esm/Text/Text.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.module.js","names":[],"sources":["../../src/Text/Text.module.css"],"sourcesContent":[".Text {\n  font-family: var(--brand-body-fontFamily);\n}\n\n[data-color-mode='dark'] .Text--antialiased {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: auto;\n}\n\n.Text--default {\n  color: var(--brand-color-text-default);\n}\n\n.Text--muted {\n  color: var(--brand-color-text-muted);\n}\n\n.Text-font--mona-sans {\n  font-family: var(--brand-body-fontFamily);\n}\n\n.Text-font--hubot-sans {\n  font-family: var(--brand-body-fontFamilyAlt);\n}\n\n.Text-font--monospace {\n  font-family: var(--brand-fontStack-monospace);\n}\n\n.Text--1000 {\n  font-weight: var(--brand-text-weight-1000);\n  font-size: var(--brand-text-size-1000);\n  line-height: var(--brand-text-lineHeight-1000);\n  letter-spacing: var(--brand-text-letterSpacing-1000);\n}\n\n.Text--900 {\n  font-weight: var(--brand-text-weight-900);\n  font-size: var(--brand-text-size-900);\n  line-height: var(--brand-text-lineHeight-900);\n  letter-spacing: var(--brand-text-letterSpacing-900);\n}\n\n.Text--800 {\n  font-weight: var(--brand-text-weight-800);\n  font-size: var(--brand-text-size-800);\n  line-height: var(--brand-text-lineHeight-800);\n  letter-spacing: var(--brand-text-letterSpacing-800);\n}\n\n.Text--700 {\n  font-weight: var(--brand-text-weight-700);\n  font-size: var(--brand-text-size-700);\n  line-height: var(--brand-text-lineHeight-700);\n  letter-spacing: var(--brand-text-letterSpacing-700);\n}\n\n.Text--600 {\n  font-weight: var(--brand-text-weight-600);\n  font-size: var(--brand-text-size-600);\n  line-height: var(--brand-text-lineHeight-600);\n}\n\n.Text--500 {\n  font-weight: var(--brand-text-weight-500);\n  font-size: var(--brand-text-size-500);\n  line-height: var(--brand-text-lineHeight-500);\n}\n\n.Text--400 {\n  font-weight: var(--brand-text-weight-400);\n  font-size: var(--brand-text-size-400);\n  line-height: var(--brand-text-lineHeight-400);\n  letter-spacing: var(--brand-text-letterSpacing-400);\n}\n\n.Text--350 {\n  font-weight: var(--brand-text-weight-350);\n  font-size: var(--brand-text-size-350);\n  line-height: var(--brand-text-lineHeight-350);\n  letter-spacing: var(--brand-text-letterSpacing-350);\n}\n\n.Text--300 {\n  font-weight: var(--brand-text-weight-300);\n  font-size: var(--brand-text-size-300);\n  line-height: var(--brand-text-lineHeight-300);\n  letter-spacing: var(--brand-text-letterSpacing-300);\n}\n\n.Text--200 {\n  font-weight: var(--brand-text-weight-200);\n  font-size: var(--brand-text-size-200);\n  line-height: var(--brand-text-lineHeight-200);\n  letter-spacing: var(--brand-text-letterSpacing-200);\n}\n\n.Text--100 {\n  font-weight: var(--brand-text-weight-100);\n  font-size: var(--brand-text-size-100);\n  line-height: var(--brand-text-lineHeight-100);\n  letter-spacing: var(--brand-text-letterSpacing-100);\n}\n\n.Text--weight-heavy,\n.Text-narrow--weight-heavy {\n  font-weight: var(--base-text-weight-heavy);\n}\n\n.Text--weight-extrabold,\n.Text-narrow--weight-extrabold {\n  font-weight: var(--base-text-weight-extrabold);\n}\n\n.Text--weight-bold,\n.Text-narrow--weight-bold {\n  font-weight: var(--base-text-weight-bold);\n}\n\n.Text--weight-semibold,\n.Text-narrow--weight-semibold {\n  font-weight: var(--base-text-weight-semibold);\n}\n\n.Text--weight-medium,\n.Text-narrow--weight-medium {\n  font-weight: var(--base-text-weight-medium);\n}\n\n.Text--weight-normal,\n.Text-narrow--weight-normal {\n  font-weight: var(--base-text-weight-normal);\n}\n\n.Text--weight-light,\n.Text-narrow--weight-light {\n  font-weight: var(--base-text-weight-light);\n}\n\n.Text--weight-extralight,\n.Text-narrow--weight-extralight {\n  font-weight: var(--base-text-weight-extralight);\n}\n\n@media screen and (min-width: 48rem) {\n  .Text-regular--weight-heavy {\n    font-weight: var(--base-text-weight-heavy);\n  }\n\n  .Text-regular--weight-extrabold {\n    font-weight: var(--base-text-weight-extrabold);\n  }\n\n  .Text-regular--weight-bold {\n    font-weight: var(--base-text-weight-bold);\n  }\n\n  .Text-regular--weight-semibold {\n    font-weight: var(--base-text-weight-semibold);\n  }\n\n  .Text-regular--weight-medium {\n    font-weight: var(--base-text-weight-medium);\n  }\n\n  .Text-regular--weight-normal {\n    font-weight: var(--base-text-weight-normal);\n  }\n\n  .Text-regular--weight-light {\n    font-weight: var(--base-text-weight-light);\n  }\n\n  .Text-regular--weight-extralight {\n    font-weight: var(--base-text-weight-extralight);\n  }\n}\n\n@media screen and (min-width: 80rem) {\n  .Text-wide--weight-heavy {\n    font-weight: var(--base-text-weight-heavy);\n  }\n\n  .Text-wide--weight-extrabold {\n    font-weight: var(--base-text-weight-extrabold);\n  }\n\n  .Text-wide--weight-bold {\n    font-weight: var(--base-text-weight-bold);\n  }\n\n  .Text-wide--weight-semibold {\n    font-weight: var(--base-text-weight-semibold);\n  }\n\n  .Text-wide--weight-medium {\n    font-weight: var(--base-text-weight-medium);\n  }\n\n  .Text-wide--weight-normal {\n    font-weight: var(--base-text-weight-normal);\n  }\n\n  .Text-wide--weight-light {\n    font-weight: var(--base-text-weight-light);\n  }\n\n  .Text-wide--weight-extralight {\n    font-weight: var(--base-text-weight-extralight);\n  }\n}\n\n.Text-align--start {\n  text-align: start;\n}\n\n.Text-align--end {\n  text-align: end;\n}\n\n.Text-align--center {\n  text-align: center;\n}\n"],"mappings":""}
+{"version":3,"file":"Text.module.js","names":[],"sources":["../../src/Text/Text.module.css"],"sourcesContent":[".Text {\n  font-family: var(--brand-body-fontFamily);\n}\n\n[data-color-mode='dark'] .Text--antialiased {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: auto;\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-color-mode='auto'] .Text--antialiased {\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: auto;\n  }\n}\n\n.Text--default {\n  color: var(--brand-color-text-default);\n}\n\n.Text--muted {\n  color: var(--brand-color-text-muted);\n}\n\n.Text-font--mona-sans {\n  font-family: var(--brand-body-fontFamily);\n}\n\n.Text-font--hubot-sans {\n  font-family: var(--brand-body-fontFamilyAlt);\n}\n\n.Text-font--monospace {\n  font-family: var(--brand-fontStack-monospace);\n}\n\n.Text--1000 {\n  font-weight: var(--brand-text-weight-1000);\n  font-size: var(--brand-text-size-1000);\n  line-height: var(--brand-text-lineHeight-1000);\n  letter-spacing: var(--brand-text-letterSpacing-1000);\n}\n\n.Text--900 {\n  font-weight: var(--brand-text-weight-900);\n  font-size: var(--brand-text-size-900);\n  line-height: var(--brand-text-lineHeight-900);\n  letter-spacing: var(--brand-text-letterSpacing-900);\n}\n\n.Text--800 {\n  font-weight: var(--brand-text-weight-800);\n  font-size: var(--brand-text-size-800);\n  line-height: var(--brand-text-lineHeight-800);\n  letter-spacing: var(--brand-text-letterSpacing-800);\n}\n\n.Text--700 {\n  font-weight: var(--brand-text-weight-700);\n  font-size: var(--brand-text-size-700);\n  line-height: var(--brand-text-lineHeight-700);\n  letter-spacing: var(--brand-text-letterSpacing-700);\n}\n\n.Text--600 {\n  font-weight: var(--brand-text-weight-600);\n  font-size: var(--brand-text-size-600);\n  line-height: var(--brand-text-lineHeight-600);\n}\n\n.Text--500 {\n  font-weight: var(--brand-text-weight-500);\n  font-size: var(--brand-text-size-500);\n  line-height: var(--brand-text-lineHeight-500);\n}\n\n.Text--400 {\n  font-weight: var(--brand-text-weight-400);\n  font-size: var(--brand-text-size-400);\n  line-height: var(--brand-text-lineHeight-400);\n  letter-spacing: var(--brand-text-letterSpacing-400);\n}\n\n.Text--350 {\n  font-weight: var(--brand-text-weight-350);\n  font-size: var(--brand-text-size-350);\n  line-height: var(--brand-text-lineHeight-350);\n  letter-spacing: var(--brand-text-letterSpacing-350);\n}\n\n.Text--300 {\n  font-weight: var(--brand-text-weight-300);\n  font-size: var(--brand-text-size-300);\n  line-height: var(--brand-text-lineHeight-300);\n  letter-spacing: var(--brand-text-letterSpacing-300);\n}\n\n.Text--200 {\n  font-weight: var(--brand-text-weight-200);\n  font-size: var(--brand-text-size-200);\n  line-height: var(--brand-text-lineHeight-200);\n  letter-spacing: var(--brand-text-letterSpacing-200);\n}\n\n.Text--100 {\n  font-weight: var(--brand-text-weight-100);\n  font-size: var(--brand-text-size-100);\n  line-height: var(--brand-text-lineHeight-100);\n  letter-spacing: var(--brand-text-letterSpacing-100);\n}\n\n.Text--weight-heavy,\n.Text-narrow--weight-heavy {\n  font-weight: var(--base-text-weight-heavy);\n}\n\n.Text--weight-extrabold,\n.Text-narrow--weight-extrabold {\n  font-weight: var(--base-text-weight-extrabold);\n}\n\n.Text--weight-bold,\n.Text-narrow--weight-bold {\n  font-weight: var(--base-text-weight-bold);\n}\n\n.Text--weight-semibold,\n.Text-narrow--weight-semibold {\n  font-weight: var(--base-text-weight-semibold);\n}\n\n.Text--weight-medium,\n.Text-narrow--weight-medium {\n  font-weight: var(--base-text-weight-medium);\n}\n\n.Text--weight-normal,\n.Text-narrow--weight-normal {\n  font-weight: var(--base-text-weight-normal);\n}\n\n.Text--weight-light,\n.Text-narrow--weight-light {\n  font-weight: var(--base-text-weight-light);\n}\n\n.Text--weight-extralight,\n.Text-narrow--weight-extralight {\n  font-weight: var(--base-text-weight-extralight);\n}\n\n@media screen and (min-width: 48rem) {\n  .Text-regular--weight-heavy {\n    font-weight: var(--base-text-weight-heavy);\n  }\n\n  .Text-regular--weight-extrabold {\n    font-weight: var(--base-text-weight-extrabold);\n  }\n\n  .Text-regular--weight-bold {\n    font-weight: var(--base-text-weight-bold);\n  }\n\n  .Text-regular--weight-semibold {\n    font-weight: var(--base-text-weight-semibold);\n  }\n\n  .Text-regular--weight-medium {\n    font-weight: var(--base-text-weight-medium);\n  }\n\n  .Text-regular--weight-normal {\n    font-weight: var(--base-text-weight-normal);\n  }\n\n  .Text-regular--weight-light {\n    font-weight: var(--base-text-weight-light);\n  }\n\n  .Text-regular--weight-extralight {\n    font-weight: var(--base-text-weight-extralight);\n  }\n}\n\n@media screen and (min-width: 80rem) {\n  .Text-wide--weight-heavy {\n    font-weight: var(--base-text-weight-heavy);\n  }\n\n  .Text-wide--weight-extrabold {\n    font-weight: var(--base-text-weight-extrabold);\n  }\n\n  .Text-wide--weight-bold {\n    font-weight: var(--base-text-weight-bold);\n  }\n\n  .Text-wide--weight-semibold {\n    font-weight: var(--base-text-weight-semibold);\n  }\n\n  .Text-wide--weight-medium {\n    font-weight: var(--base-text-weight-medium);\n  }\n\n  .Text-wide--weight-normal {\n    font-weight: var(--base-text-weight-normal);\n  }\n\n  .Text-wide--weight-light {\n    font-weight: var(--base-text-weight-light);\n  }\n\n  .Text-wide--weight-extralight {\n    font-weight: var(--base-text-weight-extralight);\n  }\n}\n\n.Text-align--start {\n  text-align: start;\n}\n\n.Text-align--end {\n  text-align: end;\n}\n\n.Text-align--center {\n  text-align: center;\n}\n"],"mappings":""}

package/esm/TextCursorAnimation/TextCursorAnimation.js

@@ -1,7 +1,7 @@
 import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
 import { useCursorAnimation as t } from "../hooks/useCursorAnimation.js";
 import { EyebrowText as n } from "../EyebrowText/EyebrowText.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/colors-with-modes-BucKYl1n.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/base-DKbXhPKv.css';/* empty css                                                                                                      */
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/colors-with-modes-wctZLA5X.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/base-DKbXhPKv.css';/* empty css                                                                                                      */
 /* empty css                                                                                                                   */
 import r from "./TextCursorAnimation.module.js";
 import { useRef as i } from "react";

package/esm/ThemeProvider/ThemeProvider.d.ts

@@ -8,6 +8,7 @@ export type ColorMode = `${ColorModesEnum}` | (string & {});
 export type ResolvedColorMode = ColorModesEnum.LIGHT | ColorModesEnum.DARK;
 export type ThemeContextProps = {
     colorMode: ResolvedColorMode;
+    originalColorMode?: ColorMode;
     availableColorModes: ColorModesEnum[];
 };
 export type ThemeProviderProps = {

package/esm/ThemeProvider/ThemeProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/ThemeProvider/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAmC,cAAc,EAAE,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAGhG,oBAAY,cAAc;IACxB,KAAK,UAAU;IACf,IAAI,SAAS;IACb,IAAI,SAAS;CACd;AAED,MAAM,MAAM,SAAS,GAAG,GAAG,cAAc,EAAE,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAA;AAC3D,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,KAAK,GAAG,cAAc,CAAC,IAAI,CAAA;AAW1E,MAAM,MAAM,iBAAiB,GAAG;IAI9B,SAAS,EAAE,iBAAiB,CAAA;IAK5B,mBAAmB,EAAE,cAAc,EAAE,CAAA;CACtC,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAA;AAGlC,eAAO,MAAM,YAAY,kCAGvB,CAAA;AAEF;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAAC,SAAuB,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAC,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,qBAmBhH"}
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/ThemeProvider/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAmC,cAAc,EAAE,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAGhG,oBAAY,cAAc;IACxB,KAAK,UAAU;IACf,IAAI,SAAS;IACb,IAAI,SAAS;CACd;AAED,MAAM,MAAM,SAAS,GAAG,GAAG,cAAc,EAAE,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAA;AAC3D,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,KAAK,GAAG,cAAc,CAAC,IAAI,CAAA;AAW1E,MAAM,MAAM,iBAAiB,GAAG;IAI9B,SAAS,EAAE,iBAAiB,CAAA;IAK5B,iBAAiB,CAAC,EAAE,SAAS,CAAA;IAK7B,mBAAmB,EAAE,cAAc,EAAE,CAAA;CACtC,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAA;AAGlC,eAAO,MAAM,YAAY,kCAIvB,CAAA;AAEF;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAAC,SAAuB,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAC,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,qBAyBhH"}

package/esm/ThemeProvider/ThemeProvider.js

@@ -10,28 +10,30 @@ function o(e) {
 }
 var s = "light", c = t({
 	colorMode: s,
+	originalColorMode: s,
 	availableColorModes: Object.values(a)
 });
 function l({ colorMode: t = s, children: l, ...u }) {
-	let [p, m] = r(s), h = t === "auto" ? p : o(t), g = n(() => Object.values(a), []);
+	let [d, f] = r(s), p = t === "auto" ? d : o(t), m = n(() => Object.values(a), []);
 	return e(() => {
-		if (t === "auto") return m(d()), f(m);
+		if (t !== "auto" || typeof window.matchMedia != "function") return;
+		let e = window.matchMedia("(prefers-color-scheme: dark)"), n = (e) => {
+			f(e.matches ? "dark" : "light");
+		};
+		return e.addEventListener("change", n), f(e.matches ? "dark" : "light"), () => e.removeEventListener("change", n);
 	}, [t]), /* @__PURE__ */ i(c.Provider, {
 		value: {
-			colorMode: h,
-			availableColorModes: g
+			colorMode: p,
+			originalColorMode: t,
+			availableColorModes: m
 		},
 		children: /* @__PURE__ */ i("div", {
-			"data-color-mode": h,
+			"data-color-mode": t === "auto" ? "auto" : p,
 			...u,
 			children: l
 		})
 	});
 }
-var u = () => window.matchMedia("(prefers-color-scheme: dark)"), d = () => u().matches ? "dark" : "light", f = (e) => {
-	let t = u(), n = (t) => e(t.matches ? "dark" : "light");
-	return t.addEventListener("change", n), () => t.removeEventListener("change", n);
-};
 //#endregion
 export { a as ColorModesEnum, c as ThemeContext, l as ThemeProvider };
 

package/esm/ThemeProvider/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","names":[],"sources":["../../src/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import React, {useState, useMemo, createContext, HTMLAttributes, PropsWithChildren} from 'react'\nimport useIsomorphicLayoutEffect from '../hooks/useIsomorphicLayoutEffect'\n\nexport enum ColorModesEnum {\n  LIGHT = 'light',\n  DARK = 'dark',\n  AUTO = 'auto',\n}\n\nexport type ColorMode = `${ColorModesEnum}` | (string & {})\nexport type ResolvedColorMode = ColorModesEnum.LIGHT | ColorModesEnum.DARK\n\n/**\n * Resolves a color mode to the light or dark theme it should use.\n */\nfunction resolveColorMode(mode: string): ResolvedColorMode {\n  return mode === ColorModesEnum.DARK || mode.startsWith(`${ColorModesEnum.DARK}_`)\n    ? ColorModesEnum.DARK\n    : ColorModesEnum.LIGHT\n}\n\nexport type ThemeContextProps = {\n  /*\n   * The active color mode of the parent ThemeProvider.\n   */\n  colorMode: ResolvedColorMode\n\n  /*\n   * List of available color modes.\n   */\n  availableColorModes: ColorModesEnum[]\n}\n\nexport type ThemeProviderProps = {\n  colorMode?: ColorMode\n} & HTMLAttributes<HTMLDivElement>\n\nconst defaultMode = ColorModesEnum.LIGHT\nexport const ThemeContext = createContext<ThemeContextProps>({\n  colorMode: defaultMode,\n  availableColorModes: Object.values(ColorModesEnum),\n})\n\n/**\n * ThemeProvider is used to provide theme-related context to its child components.\n */\nexport function ThemeProvider({colorMode = defaultMode, children, ...rest}: PropsWithChildren<ThemeProviderProps>) {\n  const [autoMode, setAutoMode] = useState<ResolvedColorMode>(defaultMode)\n  const activeMode = colorMode === ColorModesEnum.AUTO ? autoMode : resolveColorMode(colorMode)\n  const availableColorModes = useMemo(() => Object.values(ColorModesEnum), [])\n\n  useIsomorphicLayoutEffect(() => {\n    if (colorMode !== ColorModesEnum.AUTO) return\n\n    setAutoMode(getActiveAutoMode())\n    return handleSystemPreferenceChange(setAutoMode)\n  }, [colorMode])\n\n  return (\n    <ThemeContext.Provider value={{colorMode: activeMode, availableColorModes}}>\n      <div data-color-mode={activeMode} {...rest}>\n        {children}\n      </div>\n    </ThemeContext.Provider>\n  )\n}\n\nconst queryBrowserPreference = () => window.matchMedia(`(prefers-color-scheme: ${ColorModesEnum.DARK})`)\n\nconst getActiveAutoMode = (): ResolvedColorMode => {\n  const mediaQueryList: MediaQueryList = queryBrowserPreference()\n  return mediaQueryList.matches ? ColorModesEnum.DARK : ColorModesEnum.LIGHT\n}\n\nconst handleSystemPreferenceChange = (callback: (mode: ResolvedColorMode) => void) => {\n  const mediaQueryList = queryBrowserPreference()\n  const changeHandler = (event: MediaQueryListEvent) =>\n    callback(event.matches ? ColorModesEnum.DARK : ColorModesEnum.LIGHT)\n  mediaQueryList.addEventListener('change', changeHandler)\n  return () => mediaQueryList.removeEventListener('change', changeHandler)\n}\n"],"mappings":";;;;AAGA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,QAAA,SACA,EAAA,OAAA,QACA,EAAA,OAAA;AACF,EAAA,CAAA,CAAA;AAQA,SAAS,EAAiB,GAAiC;CACzD,OAAO,MAAA,UAAgC,EAAK,WAAW,OAAyB,IAAA,SAAA;AAGlF;AAkBA,IAAM,IAAA,SACO,IAAe,EAAiC;CAC3D,WAAW;CACX,qBAAqB,OAAO,OAAO,CAAc;AACnD,CAAC;AAKD,SAAgB,EAAc,EAAC,eAAY,GAAa,aAAU,GAAG,KAA8C;CACjH,IAAM,CAAC,GAAU,KAAe,EAA4B,CAAW,GACjE,IAAa,MAAA,SAAoC,IAAW,EAAiB,CAAS,GACtF,IAAsB,QAAc,OAAO,OAAO,CAAc,GAAG,CAAC,CAAC;CAS3E,OAPA,QAAgC;EAC1B,UAAA,QAGJ,OADA,EAAY,EAAkB,CAAC,GACxB,EAA6B,CAAW;CACjD,GAAG,CAAC,CAAS,CAAC,GAGZ,kBAAC,EAAa,UAAd;EAAuB,OAAO;GAAC,WAAW;GAAY;EAAmB;YACvE,kBAAC,OAAD;GAAK,mBAAiB;GAAY,GAAI;GACnC;EACE,CAAA;CACgB,CAAA;AAE3B;AAEA,IAAM,UAA+B,OAAO,WAAW,8BAAgD,GAEjG,UACmC,EAChC,CAAA,CAAe,UAAA,SAAA,SAGlB,KAAgC,MAAgD;CACpF,IAAM,IAAiB,EAAuB,GACxC,KAAiB,MACrB,EAAS,EAAM,UAAA,SAAA,OAAoD;CAErE,OADA,EAAe,iBAAiB,UAAU,CAAa,SAC1C,EAAe,oBAAoB,UAAU,CAAa;AACzE"}
+{"version":3,"file":"ThemeProvider.js","names":[],"sources":["../../src/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import React, {useState, useMemo, createContext, HTMLAttributes, PropsWithChildren} from 'react'\nimport useIsomorphicLayoutEffect from '../hooks/useIsomorphicLayoutEffect'\n\nexport enum ColorModesEnum {\n  LIGHT = 'light',\n  DARK = 'dark',\n  AUTO = 'auto',\n}\n\nexport type ColorMode = `${ColorModesEnum}` | (string & {})\nexport type ResolvedColorMode = ColorModesEnum.LIGHT | ColorModesEnum.DARK\n\n/**\n * Resolves a color mode to the light or dark theme it should use.\n */\nfunction resolveColorMode(mode: string): ResolvedColorMode {\n  return mode === ColorModesEnum.DARK || mode.startsWith(`${ColorModesEnum.DARK}_`)\n    ? ColorModesEnum.DARK\n    : ColorModesEnum.LIGHT\n}\n\nexport type ThemeContextProps = {\n  /*\n   * The active color mode of the parent ThemeProvider.\n   */\n  colorMode: ResolvedColorMode\n\n  /*\n   * The colorMode prop before its resolved to a valid theme.\n   */\n  originalColorMode?: ColorMode\n\n  /*\n   * List of available color modes.\n   */\n  availableColorModes: ColorModesEnum[]\n}\n\nexport type ThemeProviderProps = {\n  colorMode?: ColorMode\n} & HTMLAttributes<HTMLDivElement>\n\nconst defaultMode = ColorModesEnum.LIGHT\nexport const ThemeContext = createContext<ThemeContextProps>({\n  colorMode: defaultMode,\n  originalColorMode: defaultMode,\n  availableColorModes: Object.values(ColorModesEnum),\n})\n\n/**\n * ThemeProvider is used to provide theme-related context to its child components.\n */\nexport function ThemeProvider({colorMode = defaultMode, children, ...rest}: PropsWithChildren<ThemeProviderProps>) {\n  const [autoMode, setAutoMode] = useState<ResolvedColorMode>(defaultMode)\n  const activeMode = colorMode === ColorModesEnum.AUTO ? autoMode : resolveColorMode(colorMode)\n  const availableColorModes = useMemo(() => Object.values(ColorModesEnum), [])\n\n  useIsomorphicLayoutEffect(() => {\n    if (colorMode !== ColorModesEnum.AUTO || typeof window.matchMedia !== 'function') return\n\n    const preference = window.matchMedia(`(prefers-color-scheme: ${ColorModesEnum.DARK})`)\n    const handlePreferenceChange = (event: MediaQueryListEvent) => {\n      setAutoMode(event.matches ? ColorModesEnum.DARK : ColorModesEnum.LIGHT)\n    }\n\n    preference.addEventListener('change', handlePreferenceChange)\n    setAutoMode(preference.matches ? ColorModesEnum.DARK : ColorModesEnum.LIGHT)\n    return () => preference.removeEventListener('change', handlePreferenceChange)\n  }, [colorMode])\n\n  return (\n    <ThemeContext.Provider value={{colorMode: activeMode, originalColorMode: colorMode, availableColorModes}}>\n      <div data-color-mode={colorMode === ColorModesEnum.AUTO ? ColorModesEnum.AUTO : activeMode} {...rest}>\n        {children}\n      </div>\n    </ThemeContext.Provider>\n  )\n}\n"],"mappings":";;;;AAGA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,QAAA,SACA,EAAA,OAAA,QACA,EAAA,OAAA;AACF,EAAA,CAAA,CAAA;AAQA,SAAS,EAAiB,GAAiC;CACzD,OAAO,MAAA,UAAgC,EAAK,WAAW,OAAyB,IAAA,SAAA;AAGlF;AAuBA,IAAM,IAAA,SACO,IAAe,EAAiC;CAC3D,WAAW;CACX,mBAAmB;CACnB,qBAAqB,OAAO,OAAO,CAAc;AACnD,CAAC;AAKD,SAAgB,EAAc,EAAC,eAAY,GAAa,aAAU,GAAG,KAA8C;CACjH,IAAM,CAAC,GAAU,KAAe,EAA4B,CAAW,GACjE,IAAa,MAAA,SAAoC,IAAW,EAAiB,CAAS,GACtF,IAAsB,QAAc,OAAO,OAAO,CAAc,GAAG,CAAC,CAAC;CAe3E,OAbA,QAAgC;EAC9B,IAAI,MAAA,UAAqC,OAAO,OAAO,cAAe,YAAY;EAElF,IAAM,IAAa,OAAO,WAAW,8BAAgD,GAC/E,KAA0B,MAA+B;GAC7D,EAAY,EAAM,UAAA,SAAA,OAAoD;EACxE;EAIA,OAFA,EAAW,iBAAiB,UAAU,CAAsB,GAC5D,EAAY,EAAW,UAAA,SAAA,OAAoD,SAC9D,EAAW,oBAAoB,UAAU,CAAsB;CAC9E,GAAG,CAAC,CAAS,CAAC,GAGZ,kBAAC,EAAa,UAAd;EAAuB,OAAO;GAAC,WAAW;GAAY,mBAAmB;GAAW;EAAmB;YACrG,kBAAC,OAAD;GAAK,mBAAiB,MAAA,SAAA,SAA0D;GAAY,GAAI;GAC7F;EACE,CAAA;CACgB,CAAA;AAE3B"}

package/esm/Tiles/Tiles.js

@@ -3,7 +3,7 @@ import { Text as t } from "../Text/Text.js";
 import { ArrowUpRightIcon as n } from "../node_modules/@primer/octicons-react/dist/icons/ArrowUpRightIcon.js";
 import r from "../component-helpers/shared.module.js";
 import { isFragmentElement as i } from "../utils/isFragmentElement.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tiles/colors-with-modes-DTTqGOfy.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tiles/base-CX1T1tsR.css';/* empty css                                                                                      */
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tiles/colors-with-modes-BLWCqYua.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tiles/base-CX1T1tsR.css';/* empty css                                                                                      */
 /* empty css                                                                                                   */
 import a from "./Tiles.module.js";
 import o, { createContext as s, forwardRef as c, useContext as l } from "react";

package/esm/Timeline/Timeline.js

@@ -2,7 +2,7 @@ import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
 import { useAnimation as t } from "../animation/useAnimation.js";
 import { Text as n } from "../Text/Text.js";
 import r from "./Timeline.module.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/timeline/base-CXOJfjx4.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/timeline/colors-with-modes-DDIdeMJX.css';/* empty css                                                                                                      */
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/timeline/base-CXOJfjx4.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/timeline/colors-with-modes-DNNJvx8C.css';/* empty css                                                                                                      */
 /* empty css                                                                                         */
 import i, { useCallback as a, useMemo as o } from "react";
 import { jsx as s } from "react/jsx-runtime";

package/esm/Token/Token.js

@@ -1,7 +1,7 @@
 import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
 import { useAnimation as t } from "../animation/useAnimation.js";
 import { Text as n } from "../Text/Text.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/token/colors-with-modes-5VT1x9eF.css';/* empty css                                                                                                   */
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/token/colors-with-modes-CzvPUrZu.css';/* empty css                                                                                                   */
 import r from "./Token.module.js";
 import i, { forwardRef as a } from "react";
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";

package/esm/Token/Token.module-Di856FbT.css

@@ -0,0 +1 @@
+.Primer_Brand__Token-module__Token___nJxhW{border:var(--brand-borderWidth-thin) solid transparent;border-radius:var(--brand-borderRadius-small);align-items:center;gap:var(--base-size-8);min-width:0;max-width:100%;padding-inline:var(--base-size-8);padding-block:var(--base-size-6);vertical-align:middle;padding-block-end:var(--base-size-6);display:inline-flex}.Primer_Brand__Token-module__Token--hasLeadingVisual___Erv8L{padding-inline:calc((var(--base-size-4) + var(--base-size-8)) / 2);padding-block:calc((var(--base-size-4) + var(--base-size-8)) / 2)}.Primer_Brand__Token-module__Token--interactive___ZpgTX{cursor:pointer;-webkit-text-decoration:none;text-decoration:none}.Primer_Brand__Token-module__Token--interactive___ZpgTX:focus-visible{outline:var(--base-size-4) solid var(--brand-color-focus);outline-offset:var(--base-size-2)}[data-color-mode=dark] .Primer_Brand__Token-module__Token___nJxhW{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:auto}@media (prefers-color-scheme:dark){[data-color-mode=auto] .Primer_Brand__Token-module__Token___nJxhW{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:auto}}.Primer_Brand__Token-module__Token--variant-default___eMkcM{background-color:var(--brand-Token-bgColor-default);color:var(--brand-Token-fgColor-default)}.Primer_Brand__Token-module__Token--interactive___ZpgTX.Primer_Brand__Token-module__Token--variant-default___eMkcM:hover{background-color:var(--brand-Token-bgColor-hover-default)}.Primer_Brand__Token-module__Token--variant-accent___fSxf7{background-color:var(--brand-Token-bgColor-accent);color:var(--brand-Token-fgColor-accent)}.Primer_Brand__Token-module__Token--interactive___ZpgTX.Primer_Brand__Token-module__Token--variant-accent___fSxf7:hover{background-color:var(--brand-Token-bgColor-hover-accent)}.Primer_Brand__Token-module__Token--variant-outline___GTmIy{background-color:var(--brand-Token-bgColor-outline);border-color:var(--brand-Token-border-outline);color:var(--brand-Token-fgColor-outline)}.Primer_Brand__Token-module__Token--interactive___ZpgTX.Primer_Brand__Token-module__Token--variant-outline___GTmIy:hover{background-color:var(--brand-Token-bgColor-hover-outline)}.Primer_Brand__Token-module__Token--variant-invisible___IR7Ki{color:var(--brand-Token-fgColor-invisible);background-color:#0000}.Primer_Brand__Token-module__Token--interactive___ZpgTX.Primer_Brand__Token-module__Token--variant-invisible___IR7Ki:hover{background-color:var(--brand-Token-bgColor-hover-invisible)}.Primer_Brand__Token-module__Token__label___e3Cx3{text-overflow:ellipsis;min-width:0;font-weight:var(--base-text-weight-normal);line-height:var(--brand-text-lineHeight-100);white-space:nowrap;letter-spacing:var(--brand-text-letterSpacing-100);flex:auto;display:block;overflow:hidden}.Primer_Brand__Token-module__Token___nJxhW>.Primer_Brand__Token-module__Token__label___e3Cx3{color:inherit}.Primer_Brand__Token-module__Token__leading-visual____uvYs{width:calc((var(--base-size-16) + var(--base-size-20)) / 2);height:calc((var(--base-size-16) + var(--base-size-20)) / 2);flex-shrink:0;justify-content:center;align-items:center;display:flex}.Primer_Brand__Token-module__Token__visual___Nlxfv{display:block}.Primer_Brand__Token-module__Token__leading-visual____uvYs>.Primer_Brand__Token-module__Token__visual___Nlxfv{width:calc((var(--base-size-16) + var(--base-size-20)) / 2);height:calc((var(--base-size-16) + var(--base-size-20)) / 2);max-width:calc((var(--base-size-16) + var(--base-size-20)) / 2);max-height:calc((var(--base-size-16) + var(--base-size-20)) / 2);border-radius:2px}.Primer_Brand__Token-module__Token__leading-visual____uvYs>.Primer_Brand__Token-module__Token__visual___Nlxfv svg,.Primer_Brand__Token-module__Token__leading-visual____uvYs>.Primer_Brand__Token-module__Token__visual___Nlxfv img{width:100%;height:100%}@media (forced-colors:active){.Primer_Brand__Token-module__Token___nJxhW{outline:var(--brand-borderWidth-thin) solid transparent}.Primer_Brand__Token-module__Token--interactive___ZpgTX:focus-visible{outline-color:highlight}}

package/esm/Token/Token.module.js

@@ -1,4 +1,4 @@
-import './Token.module-DtWE9IPI.css';//#region src/Token/Token.module.css
+import './Token.module-Di856FbT.css';//#region src/Token/Token.module.css
 var e = "Primer_Brand__Token-module__Token___nJxhW", t = "Primer_Brand__Token-module__Token__label___e3Cx3", n = "Primer_Brand__Token-module__Token__visual___Nlxfv", r = {
 	Token: e,
 	"Token--hasLeadingVisual": "Primer_Brand__Token-module__Token--hasLeadingVisual___Erv8L",

package/esm/Token/Token.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"Token.module.js","names":[],"sources":["../../src/Token/Token.module.css"],"sourcesContent":[".Token {\n  align-items: center;\n  border: var(--brand-borderWidth-thin) solid transparent;\n  border-radius: var(--brand-borderRadius-small);\n  display: inline-flex;\n  gap: var(--base-size-8);\n  min-width: 0;\n  max-width: 100%;\n  padding-inline: var(--base-size-8);\n  padding-block: var(--base-size-6);\n  padding-block-end: var(--base-size-6);\n  vertical-align: middle;\n}\n\n.Token--hasLeadingVisual {\n  padding-inline: calc((var(--base-size-4) + var(--base-size-8)) / 2);\n  padding-block: calc((var(--base-size-4) + var(--base-size-8)) / 2);\n}\n\n.Token--interactive {\n  cursor: pointer;\n  text-decoration: none;\n}\n\n.Token--interactive:focus-visible {\n  outline: var(--base-size-4) solid var(--brand-color-focus);\n  outline-offset: var(--base-size-2);\n}\n\n[data-color-mode='dark'] .Token {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: auto;\n}\n\n.Token--variant-default {\n  background-color: var(--brand-Token-bgColor-default);\n  color: var(--brand-Token-fgColor-default);\n}\n\n.Token--interactive.Token--variant-default:hover {\n  background-color: var(--brand-Token-bgColor-hover-default);\n}\n\n.Token--variant-accent {\n  background-color: var(--brand-Token-bgColor-accent);\n  color: var(--brand-Token-fgColor-accent);\n}\n\n.Token--interactive.Token--variant-accent:hover {\n  background-color: var(--brand-Token-bgColor-hover-accent);\n}\n\n.Token--variant-outline {\n  background-color: var(--brand-Token-bgColor-outline);\n  border-color: var(--brand-Token-border-outline);\n  color: var(--brand-Token-fgColor-outline);\n}\n\n.Token--interactive.Token--variant-outline:hover {\n  background-color: var(--brand-Token-bgColor-hover-outline);\n}\n\n.Token--variant-invisible {\n  background-color: transparent;\n  color: var(--brand-Token-fgColor-invisible);\n}\n\n.Token--interactive.Token--variant-invisible:hover {\n  background-color: var(--brand-Token-bgColor-hover-invisible);\n}\n\n.Token__label {\n  display: block;\n  flex: 1 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-weight: var(--base-text-weight-normal);\n  line-height: var(--brand-text-lineHeight-100);\n  white-space: nowrap;\n  letter-spacing: var(--brand-text-letterSpacing-100);\n}\n\n.Token > .Token__label {\n  color: inherit;\n}\n\n.Token__leading-visual {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  width: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  height: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n}\n\n.Token__visual {\n  display: block;\n}\n\n/* Keep leading visuals inside a fixed 18x18 slot so larger children like Avatar dont increase Token height. */\n.Token__leading-visual > .Token__visual {\n  width: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  height: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  max-width: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  max-height: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  border-radius: 2px;\n}\n\n.Token__leading-visual > .Token__visual svg,\n.Token__leading-visual > .Token__visual img {\n  width: 100%;\n  height: 100%;\n}\n\n@media (forced-colors: active) {\n  .Token {\n    outline: var(--brand-borderWidth-thin) solid transparent;\n  }\n\n  .Token--interactive:focus-visible {\n    outline-color: Highlight;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"Token.module.js","names":[],"sources":["../../src/Token/Token.module.css"],"sourcesContent":[".Token {\n  align-items: center;\n  border: var(--brand-borderWidth-thin) solid transparent;\n  border-radius: var(--brand-borderRadius-small);\n  display: inline-flex;\n  gap: var(--base-size-8);\n  min-width: 0;\n  max-width: 100%;\n  padding-inline: var(--base-size-8);\n  padding-block: var(--base-size-6);\n  padding-block-end: var(--base-size-6);\n  vertical-align: middle;\n}\n\n.Token--hasLeadingVisual {\n  padding-inline: calc((var(--base-size-4) + var(--base-size-8)) / 2);\n  padding-block: calc((var(--base-size-4) + var(--base-size-8)) / 2);\n}\n\n.Token--interactive {\n  cursor: pointer;\n  text-decoration: none;\n}\n\n.Token--interactive:focus-visible {\n  outline: var(--base-size-4) solid var(--brand-color-focus);\n  outline-offset: var(--base-size-2);\n}\n\n[data-color-mode='dark'] .Token {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: auto;\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-color-mode='auto'] .Token {\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: auto;\n  }\n}\n\n.Token--variant-default {\n  background-color: var(--brand-Token-bgColor-default);\n  color: var(--brand-Token-fgColor-default);\n}\n\n.Token--interactive.Token--variant-default:hover {\n  background-color: var(--brand-Token-bgColor-hover-default);\n}\n\n.Token--variant-accent {\n  background-color: var(--brand-Token-bgColor-accent);\n  color: var(--brand-Token-fgColor-accent);\n}\n\n.Token--interactive.Token--variant-accent:hover {\n  background-color: var(--brand-Token-bgColor-hover-accent);\n}\n\n.Token--variant-outline {\n  background-color: var(--brand-Token-bgColor-outline);\n  border-color: var(--brand-Token-border-outline);\n  color: var(--brand-Token-fgColor-outline);\n}\n\n.Token--interactive.Token--variant-outline:hover {\n  background-color: var(--brand-Token-bgColor-hover-outline);\n}\n\n.Token--variant-invisible {\n  background-color: transparent;\n  color: var(--brand-Token-fgColor-invisible);\n}\n\n.Token--interactive.Token--variant-invisible:hover {\n  background-color: var(--brand-Token-bgColor-hover-invisible);\n}\n\n.Token__label {\n  display: block;\n  flex: 1 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-weight: var(--base-text-weight-normal);\n  line-height: var(--brand-text-lineHeight-100);\n  white-space: nowrap;\n  letter-spacing: var(--brand-text-letterSpacing-100);\n}\n\n.Token > .Token__label {\n  color: inherit;\n}\n\n.Token__leading-visual {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  width: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  height: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n}\n\n.Token__visual {\n  display: block;\n}\n\n/* Keep leading visuals inside a fixed 18x18 slot so larger children like Avatar dont increase Token height. */\n.Token__leading-visual > .Token__visual {\n  width: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  height: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  max-width: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  max-height: calc((var(--base-size-16) + var(--base-size-20)) / 2);\n  border-radius: 2px;\n}\n\n.Token__leading-visual > .Token__visual svg,\n.Token__leading-visual > .Token__visual img {\n  width: 100%;\n  height: 100%;\n}\n\n@media (forced-colors: active) {\n  .Token {\n    outline: var(--brand-borderWidth-thin) solid transparent;\n  }\n\n  .Token--interactive:focus-visible {\n    outline-color: Highlight;\n  }\n}\n"],"mappings":""}

package/esm/Tooltip/Tooltip.js

@@ -2,7 +2,7 @@ import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
 import { useId as t } from "../hooks/useId.js";
 import { useProvidedRefOrCreate as n } from "../hooks/useRef.js";
 import r from "./Tooltip.module.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tooltip/colors-with-modes-BrRCxJ2E.css';/* empty css                                                                                                     */
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tooltip/colors-with-modes-CjEAA-Ic.css';/* empty css                                                                                                     */
 import i, { Children as a, useEffect as o, useRef as s, useState as c } from "react";
 import { jsx as l, jsxs as u } from "react/jsx-runtime";
 import { getAnchoredPosition as d } from "@primer/behaviors";

package/esm/VideoPlayer/VideoPlayer.js

@@ -14,7 +14,7 @@ import { MuteButton as m } from "./components/MuteButton/MuteButton.js";
 import { PlayPauseButton as h } from "./components/PlayPauseButton/PlayPauseButton.js";
 import { SeekControl as g } from "./components/SeekControl/SeekControl.js";
 import { VolumeControl as _ } from "./components/VolumeControl/VolumeControl.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/video-player/colors-with-modes-CTkp-z-l.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/video-player/base-Bs0Tq22P.css';/* empty css                                                                                             */
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/video-player/colors-with-modes-M9ib_BKQ.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/video-player/base-Bs0Tq22P.css';/* empty css                                                                                             */
 /* empty css                                                                                                          */
 import { forwardRef as v, useCallback as y, useContext as b } from "react";
 import { jsx as x, jsxs as S } from "react/jsx-runtime";

package/esm/css/stylesheets.js

@@ -1,4 +1,4 @@
-import './utilities-BivJncWo.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/colors/global-with-modes-Bdet_nBw.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/border-B0NqqX5b.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/breakpoints-DV9ZFHGu.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/typography/typography-responsive-D6GwCHec.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/size-SXubYfUg.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/animation/base-BIr7u5g8.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/typography/typography-CAC6sGQ3.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/size/size-6EfgMG7y.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes-BVk7bh0Y.css';import './reset-CbGp2YkS.css';/* empty css      */
+import './utilities-BivJncWo.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/colors/global-with-modes-CjksF091.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/border-B0NqqX5b.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/breakpoints-DV9ZFHGu.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/typography/typography-responsive-D6GwCHec.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/size-SXubYfUg.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/animation/base-BIr7u5g8.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/typography/typography-CAC6sGQ3.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/size/size-6EfgMG7y.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes-CBE7L2wV.css';import './reset-CbGp2YkS.css';/* empty css      */
 /* empty css                                                                                         */
 /* empty css                                                                    */
 /* empty css                                                                                */

package/esm/forms/Checkbox/Checkbox.js

@@ -2,7 +2,7 @@ import { clsx as e } from "../../node_modules/clsx/dist/clsx.js";
 import { useId as t } from "../../hooks/useId.js";
 import { useProvidedRefOrCreate as n } from "../../hooks/useRef.js";
 import r from "../../hooks/useIsomorphicLayoutEffect.js";
-import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-ChBPnVuN.css';/* empty css                                                                                                        */
+import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-DKA7xAYz.css';/* empty css                                                                                                        */
 import i from "./Checkbox.module.js";
 import { forwardRef as a, useCallback as o } from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";

package/esm/forms/FormControl/FormControl.js

@@ -4,7 +4,7 @@ import { Text as n } from "../../Text/Text.js";
 import { Spinner as r } from "../../Spinner/Spinner.js";
 import { AlertFillIcon as i } from "../../node_modules/@primer/octicons-react/dist/icons/AlertFillIcon.js";
 import { CheckCircleFillIcon as a } from "../../node_modules/@primer/octicons-react/dist/icons/CheckCircleFillIcon.js";
-import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-ChBPnVuN.css';/* empty css                                                                                                        */
+import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-DKA7xAYz.css';/* empty css                                                                                                        */
 import { Checkbox as o } from "../Checkbox/Checkbox.js";
 import { Textarea as s } from "../Textarea/Textarea.js";
 import { TextInput as c } from "../TextInput/TextInput.js";

package/esm/forms/Radio/Radio.js

@@ -1,7 +1,7 @@
 import { clsx as e } from "../../node_modules/clsx/dist/clsx.js";
 import { useId as t } from "../../hooks/useId.js";
 import { useProvidedRefOrCreate as n } from "../../hooks/useRef.js";
-import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-ChBPnVuN.css';/* empty css                                                                                                        */
+import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-DKA7xAYz.css';/* empty css                                                                                                        */
 import r from "./Radio.module.js";
 import { forwardRef as i, useCallback as a } from "react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";

package/esm/forms/Select/Select.js

@@ -1,5 +1,5 @@
 import { clsx as e } from "../../node_modules/clsx/dist/clsx.js";
-import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-ChBPnVuN.css';/* empty css                                                                                                        */
+import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-DKA7xAYz.css';/* empty css                                                                                                        */
 import t from "./Select.module.js";
 import { forwardRef as n } from "react";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";

package/esm/forms/TextInput/TextInput.js

@@ -1,7 +1,7 @@
 import { clsx as e } from "../../node_modules/clsx/dist/clsx.js";
 import { useId as t } from "../../hooks/useId.js";
 import { Text as n } from "../../Text/Text.js";
-import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-ChBPnVuN.css';/* empty css                                                                                                        */
+import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-DKA7xAYz.css';/* empty css                                                                                                        */
 import r from "./TextInput.module.js";
 import i, { forwardRef as a, useMemo as o } from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";