@rcarls/rc-disclosure 0.6.0 → 0.7.0

package/CHANGELOG.md

@@ -1,5 +1,104 @@
 # @rcarls/rc-disclosure
 
+## 0.7.0
+
+### Minor Changes
+
+- 4b9bfe6: Give `rc-disclosure` and `rc-accordion` a public styling contract.
+
+  Both were styled by targeting the native `<details>` element directly, so neither exposed a
+  single `--rc-*` property and no theme could change them without rewriting theme CSS. They now
+  follow the light-DOM base pattern `rc-button` and `rc-listbox` already use: `rc-disclosure`
+  installs one structural stylesheet per containing `Document` or `ShadowRoot`, in `@layer rc-base`
+  behind a `data-rc-light-dom-base` sentinel, reading documented properties with UA-like defaults.
+
+  One recipe covers both supported child forms, a bare `<details>` inside `rc-accordion` and one
+  wrapped in `rc-disclosure`, so neither theme repeats the panel rules. `rc-accordion` owns only
+  `--rc-accordion-gap`.
+
+  Motion is opt-in. `--rc-disclosure-duration` defaults to `0ms`, so a disclosure with no theme keeps
+  the platform's snap-open behavior, and the height animation runs on `::details-content` behind a
+  `@supports selector()` check. This replaces Material's `60rem` `max-block-size` ceiling, which
+  clipped content taller than the guess and made every non-summary child its own animation unit.
+
+  **Fixes a missing expand affordance in the Material theme.** It set `display: grid` on the
+  `<summary>` and then styled `summary::marker`. Any `display` other than `list-item` drops the
+  marker box, so that rule styled nothing and the theme drew no replacement: a Material disclosure
+  had no disclosure triangle at all. The base layer never sets `display` on a summary, so the
+  marker survives. A theme may still change it, as Substrate does, but only alongside a
+  replacement affordance.
+
+- 6e548d9: Several components handle `prefers-reduced-motion: reduce` in their own
+  shadow styles, outside a theme's reach, and refine it the same way the theme
+  layer already does: spatial motion (`translate`, `scale`, `transform`,
+  `inline-size`, `block-size`) goes fully to zero, while effects motion (color,
+  opacity) shortens instead of disappearing.
+
+  `rc-app-bar` zeros its host's hide/show `translate` but shortens the
+  expanded title's fade-in. `rc-disclosure` keeps its panel's expand/collapse
+  zeroed, but its summary/content backstop for a theme-added transition now
+  shortens instead of zeroing it outright. `rc-list-item`'s row and
+  state-layer transition only color and opacity, so the whole sweep shortens.
+  `rc-fab-menu`'s popup mixes `scale` with opacity/overlay/display under one
+  shared duration; reduced motion now zeros the scale and shortens the rest.
+  `rc-switch`'s thumb mixes background-color with inline-size/block-size/
+  transform the same way; the icons and track, which each transition only one
+  kind of property, needed only the zero-or-shorten call. `rc-fab`'s
+  scroll-reveal is opacity/visibility only with no time-based duration to
+  shorten in its scroll-linked path, so reduced motion narrows the scroll
+  window instead of collapsing it to zero; its JS-transition fallback path
+  shortens the same fade rather than removing it. `rc-progress`'s determinate
+  fill transition, previously unguarded under reduced motion, is now zeroed;
+  its indeterminate loop, a continuous sweep with no meaningful shortened
+  form, stays fully stopped rather than shortened.
+
+### Patch Changes
+
+- 5c006de: Ship component CSS minified. Package builds now run the CSS in Lit `css` styles
+  and light-DOM structural styles through Lightning CSS, removing comments and
+  whitespace while keeping source maps that resolve to each template. Rendered
+  styles are unchanged.
+
+  `@rcarls/rc-common` adds `cssText`, an identity tag that marks a plain CSS
+  string for minification. `rc-chip`, `rc-disclosure`, and `rc-accordion` now
+  depend on `@rcarls/rc-common` for it.
+
+- 3f19f57: Disclosure summaries draw their hover layer only for a pointer that can hover, so a tapped
+  summary no longer stays highlighted on touch screens. The Material theme also spaces disclosure
+  content from its summary.
+- Updated dependencies [e3dfa59]
+- Updated dependencies [50d5610]
+- Updated dependencies [9ee769c]
+- Updated dependencies [1179f24]
+- Updated dependencies [595fe37]
+- Updated dependencies [38cd00c]
+- Updated dependencies [5c006de]
+- Updated dependencies [a6553ff]
+- Updated dependencies [2205478]
+- Updated dependencies [4341311]
+- Updated dependencies [899bb5e]
+- Updated dependencies [25fcfe0]
+- Updated dependencies [51f6403]
+- Updated dependencies [9caca6b]
+- Updated dependencies [b764a3c]
+- Updated dependencies [54d9ead]
+- Updated dependencies [b9175e9]
+- Updated dependencies [c8b762b]
+- Updated dependencies [55e1e7f]
+- Updated dependencies [f1ca82d]
+- Updated dependencies [b87f27b]
+- Updated dependencies [32ebead]
+- Updated dependencies [bfefedd]
+- Updated dependencies [c130173]
+- Updated dependencies [11680b6]
+- Updated dependencies [223d36c]
+- Updated dependencies [7b91a44]
+- Updated dependencies [aa04ead]
+- Updated dependencies [ac65b5b]
+- Updated dependencies [afcfef8]
+- Updated dependencies [11ef1ad]
+  - @rcarls/rc-common@0.7.0
+
 ## 0.6.0
 
 ### Minor Changes

package/dist/custom-elements.json

@@ -25,6 +25,54 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/disclosureBaseStyles.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "DISCLOSURE_BASE_CSS",
+          "default": "cssText` @layer rc-base { rc-disclosure { display: block; } :is(rc-disclosure, rc-accordion) > details { box-sizing: border-box; border: var(--rc-disclosure-border, 0); border-radius: var(--rc-disclosure-radius, 0); background: var(--rc-disclosure-background, transparent); color: var(--rc-disclosure-color, inherit); } :is(rc-disclosure, rc-accordion) > details[open] { background: var(--rc-disclosure-open-background, var(--rc-disclosure-background, transparent)); box-shadow: var(--rc-disclosure-open-shadow, none); } /* * Deliberately no \\`display\\` here. Setting \\`display: grid\\` on a summary drops * its \\`list-item\\` box, which silently removes the native disclosure marker, * so that choice belongs to whichever theme also supplies a replacement. */ :is(rc-disclosure, rc-accordion) > details > summary { box-sizing: border-box; min-block-size: var(--rc-disclosure-summary-min-block-size, 0); padding-block: var(--rc-disclosure-summary-padding-block, 0); padding-inline: var(--rc-disclosure-summary-padding-inline, 0); gap: var(--rc-disclosure-summary-gap, 0); color: var(--rc-disclosure-summary-color, inherit); font: var(--rc-disclosure-summary-font, inherit); cursor: pointer; } :is(rc-disclosure, rc-accordion) > details > summary::marker { color: var(--rc-disclosure-summary-marker-color, currentColor); } /* * Touch browsers keep :hover on the last tapped element, which would leave * a just-toggled summary looking highlighted, so only a hovering pointer * gets the layer. */ @media (hover: hover) { :is(rc-disclosure, rc-accordion) > details > summary:hover { background: var(--rc-disclosure-summary-hover-background, transparent); } } :is(rc-disclosure, rc-accordion) > details > summary:focus-visible { outline: var(--rc-disclosure-focus-ring, var(--rc-focus-ring, 2px solid Highlight)); outline-offset: var(--rc-disclosure-focus-ring-offset, 0); } :is(rc-disclosure, rc-accordion) > details > :not(summary) { box-sizing: border-box; padding-block: var(--rc-disclosure-content-padding-block, 0); padding-inline: var(--rc-disclosure-content-padding-inline, 0); color: var(--rc-disclosure-content-color, inherit); font: var(--rc-disclosure-content-font, inherit); } /* * Height animation is a feature-detected enhancement on the single * \\`::details-content\\` box, never a max-height ceiling on each child: a ceiling * clips content taller than the guess, and animating every non-summary child * makes each one its own animation unit. Without \\`::details-content\\` the * panel keeps the platform's snap-open behavior. */ @supports selector(::details-content) { :is(rc-disclosure, rc-accordion) > details { interpolate-size: allow-keywords; } :is(rc-disclosure, rc-accordion) > details::details-content { block-size: 0; overflow: clip; content-visibility: hidden; transition: block-size var(--rc-disclosure-duration, 0ms) var(--rc-disclosure-easing, ease), content-visibility var(--rc-disclosure-duration, 0ms) var(--rc-disclosure-easing, ease) allow-discrete; transition-behavior: allow-discrete; } :is(rc-disclosure, rc-accordion) > details[open]::details-content { block-size: auto; content-visibility: visible; } } /* * Split by what actually moves: \\`::details-content\\`'s own transition is the * block-size expand/collapse, which is spatial and goes fully to zero. The * base component sets no transition of its own on the \\`<details>\\`, summary, * or content boxes, but this stays as a backstop for a theme that adds one * there (Material adds background-color/border-color/box-shadow, all * effects motion), shortened rather than zeroed so it does not silently * cancel a theme's own reduced-motion handling. */ @media (prefers-reduced-motion: reduce) { :is(rc-disclosure, rc-accordion) > details, :is(rc-disclosure, rc-accordion) > details > summary, :is(rc-disclosure, rc-accordion) > details > :not(summary) { transition-duration: 50ms; } @supports selector(::details-content) { :is(rc-disclosure, rc-accordion) > details::details-content { transition-duration: 0ms; } } } } `",
+          "description": "Light-DOM base styles for the disclosure panel recipe.\n\n`rc-disclosure` and `rc-accordion` coordinate consumer-authored native\n`<details>` elements that stay in light DOM, so `::slotted()` cannot reach the\n`<summary>`, the marker, the content children, or `::details-content`. This\ninstalls one structural stylesheet per containing `Document` or `ShadowRoot`,\nfollowing the same pattern as `rc-button` and `rc-listbox`.\n\nOne recipe serves both supported child forms: a `<details>` directly inside\n`rc-accordion`, and one wrapped in `rc-disclosure`. Themes map their tokens to\nthese properties rather than re-selecting the native elements.\n\nDefaults stay close to what a user agent would render on its own, so an\nunthemed disclosure keeps native behavior and no theme is required for the\ncomponent to work. In particular `--rc-disclosure-duration` defaults to `0ms`:\na disclosure snaps open the way the platform does until a theme opts into\nmotion."
+        },
+        {
+          "kind": "function",
+          "name": "ensureDisclosureBaseStyles",
+          "return": {
+            "type": {
+              "text": "void"
+            }
+          },
+          "parameters": [
+            {
+              "name": "root",
+              "type": {
+                "text": "Document | ShadowRoot"
+              }
+            }
+          ],
+          "description": "Installs the shared disclosure panel styles once per containing root."
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "DISCLOSURE_BASE_CSS",
+          "declaration": {
+            "name": "DISCLOSURE_BASE_CSS",
+            "module": "src/disclosureBaseStyles.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "ensureDisclosureBaseStyles",
+          "declaration": {
+            "name": "ensureDisclosureBaseStyles",
+            "module": "src/disclosureBaseStyles.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/index.ts",
@@ -37,6 +85,14 @@
             "name": "*",
             "module": "src/rc-disclosure.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "module": "src/disclosureBaseStyles.js"
+          }
         }
       ]
     },
@@ -48,6 +104,117 @@
           "kind": "class",
           "description": "Disclosure wrapper for a native <details>/<summary> pair with controlled and uncontrolled\nopen state,\nfollowing the WAI-ARIA Disclosure pattern.\n\nThe browser keeps ownership of open/close behavior, keyboard support, and\naccessibility. This element mirrors state, emits a consistent custom event,\nand automatically opens when the URL hash matches any id within its subtree.",
           "name": "RCDisclosure",
+          "cssProperties": [
+            {
+              "description": "Panel border.",
+              "name": "--rc-disclosure-border",
+              "default": "0"
+            },
+            {
+              "description": "Panel corner radius.",
+              "name": "--rc-disclosure-radius",
+              "default": "0"
+            },
+            {
+              "description": "Panel background while closed.",
+              "name": "--rc-disclosure-background",
+              "default": "transparent"
+            },
+            {
+              "description": "Panel foreground.",
+              "name": "--rc-disclosure-color",
+              "default": "inherit"
+            },
+            {
+              "description": "Panel background while open. Defers to `--rc-disclosure-background` when unset.",
+              "name": "--rc-disclosure-open-background"
+            },
+            {
+              "description": "Panel shadow while open.",
+              "name": "--rc-disclosure-open-shadow",
+              "default": "none"
+            },
+            {
+              "description": "Summary minimum block size. Set this to at least `3rem` for a comfortable touch target.",
+              "name": "--rc-disclosure-summary-min-block-size",
+              "default": "0"
+            },
+            {
+              "description": "Summary block padding.",
+              "name": "--rc-disclosure-summary-padding-block",
+              "default": "0"
+            },
+            {
+              "description": "Summary inline padding.",
+              "name": "--rc-disclosure-summary-padding-inline",
+              "default": "0"
+            },
+            {
+              "description": "Summary gap, for a theme that lays the summary out as a grid or flex container.",
+              "name": "--rc-disclosure-summary-gap",
+              "default": "0"
+            },
+            {
+              "description": "Summary foreground.",
+              "name": "--rc-disclosure-summary-color",
+              "default": "inherit"
+            },
+            {
+              "description": "Summary font shorthand.",
+              "name": "--rc-disclosure-summary-font",
+              "default": "inherit"
+            },
+            {
+              "description": "Native disclosure marker color. A theme that replaces the marker with its own affordance should hide `::marker` itself.",
+              "name": "--rc-disclosure-summary-marker-color",
+              "default": "currentColor"
+            },
+            {
+              "description": "Summary hover background.",
+              "name": "--rc-disclosure-summary-hover-background",
+              "default": "transparent"
+            },
+            {
+              "description": "Summary focus-visible outline.",
+              "name": "--rc-disclosure-focus-ring",
+              "default": "var(--rc-focus-ring, 2px solid Highlight)"
+            },
+            {
+              "description": "Summary focus-visible outline offset.",
+              "name": "--rc-disclosure-focus-ring-offset",
+              "default": "0"
+            },
+            {
+              "description": "Content block padding.",
+              "name": "--rc-disclosure-content-padding-block",
+              "default": "0"
+            },
+            {
+              "description": "Content inline padding.",
+              "name": "--rc-disclosure-content-padding-inline",
+              "default": "0"
+            },
+            {
+              "description": "Content foreground.",
+              "name": "--rc-disclosure-content-color",
+              "default": "inherit"
+            },
+            {
+              "description": "Content font shorthand.",
+              "name": "--rc-disclosure-content-font",
+              "default": "inherit"
+            },
+            {
+              "description": "Open and close transition duration. Zero by default, so the panel snaps the way the platform does until a theme opts into motion. The animation runs on `::details-content` where that is supported and is skipped entirely where it is not.",
+              "name": "--rc-disclosure-duration",
+              "default": "0ms"
+            },
+            {
+              "description": "Open and close transition easing.",
+              "name": "--rc-disclosure-easing",
+              "default": "ease"
+            }
+          ],
           "members": [
             {
               "kind": "field",

package/dist/rc-disclosure-MoC5d7zW.js

@@ -0,0 +1,101 @@
+import { cssText as c } from "@rcarls/rc-common";
+const l = c`@layer rc-base{rc-disclosure{display:block}:is(rc-disclosure,rc-accordion)>details{box-sizing:border-box;border:var(--rc-disclosure-border,0);border-radius:var(--rc-disclosure-radius,0);background:var(--rc-disclosure-background,transparent);color:var(--rc-disclosure-color,inherit)}:is(rc-disclosure,rc-accordion)>details[open]{background:var(--rc-disclosure-open-background,var(--rc-disclosure-background,transparent));box-shadow:var(--rc-disclosure-open-shadow,none)}:is(rc-disclosure,rc-accordion)>details>summary{box-sizing:border-box;min-block-size:var(--rc-disclosure-summary-min-block-size,0);padding-block:var(--rc-disclosure-summary-padding-block,0);padding-inline:var(--rc-disclosure-summary-padding-inline,0);gap:var(--rc-disclosure-summary-gap,0);color:var(--rc-disclosure-summary-color,inherit);font:var(--rc-disclosure-summary-font,inherit);cursor:pointer}:is(rc-disclosure,rc-accordion)>details>summary::marker{color:var(--rc-disclosure-summary-marker-color,currentColor)}@media (hover:hover){:is(rc-disclosure,rc-accordion)>details>summary:hover{background:var(--rc-disclosure-summary-hover-background,transparent)}}:is(rc-disclosure,rc-accordion)>details>summary:focus-visible{outline:var(--rc-disclosure-focus-ring,var(--rc-focus-ring,2px solid Highlight));outline-offset:var(--rc-disclosure-focus-ring-offset,0)}:is(rc-disclosure,rc-accordion)>details>:not(summary){box-sizing:border-box;padding-block:var(--rc-disclosure-content-padding-block,0);padding-inline:var(--rc-disclosure-content-padding-inline,0);color:var(--rc-disclosure-content-color,inherit);font:var(--rc-disclosure-content-font,inherit)}@supports selector(::details-content){:is(rc-disclosure,rc-accordion)>details{interpolate-size:allow-keywords}:is(rc-disclosure,rc-accordion)>details::details-content{content-visibility:hidden;block-size:0;transition:block-size var(--rc-disclosure-duration,0s) var(--rc-disclosure-easing,ease), content-visibility var(--rc-disclosure-duration,0s) var(--rc-disclosure-easing,ease) allow-discrete;transition-behavior:allow-discrete;overflow:clip}:is(rc-disclosure,rc-accordion)>details[open]::details-content{content-visibility:visible;block-size:auto}}@media (prefers-reduced-motion:reduce){:is(rc-disclosure,rc-accordion)>details,:is(rc-disclosure,rc-accordion)>details>summary,:is(rc-disclosure,rc-accordion)>details>:not(summary){transition-duration:50ms}@supports selector(::details-content){:is(rc-disclosure,rc-accordion)>details::details-content{transition-duration:0s}}}}`, i = /* @__PURE__ */ new WeakSet();
+function a(s) {
+  if (i.has(s))
+    return;
+  i.add(s);
+  const e = (s instanceof Document ? s : s.ownerDocument).createElement("style");
+  e.setAttribute("data-rc-light-dom-base", "rc-disclosure"), e.textContent = l, s instanceof Document ? s.head.append(e) : s.append(e);
+}
+const o = "rc-disclosure-toggle", d = ":scope > details", n = ":scope > summary";
+class p extends HTMLElement {
+  constructor() {
+    super(...arguments), this._observer = new MutationObserver(() => this._setupDetails()), this._$details = null, this._scrollFrame = 0, this._defaultOpen = !1, this._defaultOpenInitialized = !1, this._openInitialized = !1, this._reflectingOpen = !1, this._suppressNextToggle = !1, this._onToggle = () => {
+      if (this._suppressNextToggle) {
+        this._suppressNextToggle = !1;
+        return;
+      }
+      const e = this._$details?.open ?? !1;
+      this._controlledOpen === void 0 ? (this._uncontrolledOpen = e, this._reflectOpen(e)) : (this._applyOpen(this._controlledOpen, !0), this._reflectOpen(this._controlledOpen)), this.dispatchEvent(
+        new CustomEvent(o, {
+          bubbles: !0,
+          composed: !0,
+          detail: { open: e }
+        })
+      );
+    }, this._onHashChange = () => {
+      this._openForCurrentHash();
+    };
+  }
+  static get observedAttributes() {
+    return ["open", "default-open"];
+  }
+  /** Current open state. Host writes are silent; assign `undefined` to release control. */
+  get open() {
+    return this._controlledOpen ?? this._uncontrolledOpen ?? this._defaultOpen;
+  }
+  set open(e) {
+    this._controlledOpen = e, this._openInitialized = !0, this._applyOpen(this.open), this._reflectOpen(this.open);
+  }
+  /** Initial open state for uncontrolled usage. */
+  get defaultOpen() {
+    return this._defaultOpen;
+  }
+  set defaultOpen(e) {
+    this._defaultOpen = e, this._defaultOpenInitialized = !0, !this._openInitialized && this._controlledOpen === void 0 && this._uncontrolledOpen === void 0 && (this._applyOpen(e), this._reflectOpen(e));
+  }
+  connectedCallback() {
+    a(this.getRootNode()), this._observer.observe(this, { childList: !0 }), window.addEventListener("hashchange", this._onHashChange), this._setupDetails();
+  }
+  disconnectedCallback() {
+    this._observer.disconnect(), window.removeEventListener("hashchange", this._onHashChange), cancelAnimationFrame(this._scrollFrame), this._teardownDetails();
+  }
+  attributeChangedCallback(e, r, t) {
+    if (r !== t) {
+      if (e === "default-open") {
+        this.defaultOpen = t !== null;
+        return;
+      }
+      this._reflectingOpen || (this.open = t !== null);
+    }
+  }
+  _setupDetails() {
+    const e = this.querySelector(d);
+    if (e === this._$details || (this._teardownDetails(), this._$details = e, !e))
+      return;
+    e.id || (e.id = crypto.randomUUID()), e.querySelector(n)?.setAttribute("aria-controls", e.id), e.addEventListener("toggle", this._onToggle), this._controlledOpen === void 0 && this._uncontrolledOpen === void 0 && (this._uncontrolledOpen = this._defaultOpenInitialized ? this._defaultOpen : e.open), this._applyOpen(this.open, !0), this._reflectOpen(this.open), this._openForCurrentHash();
+  }
+  _teardownDetails() {
+    this._$details?.querySelector(n)?.removeAttribute("aria-controls"), this._$details?.removeEventListener("toggle", this._onToggle), this._$details = null;
+  }
+  _applyOpen(e, r = !0) {
+    const t = this._$details;
+    t && t.open !== e && (this._suppressNextToggle = r, t.open = e);
+  }
+  _reflectOpen(e) {
+    this.hasAttribute("open") !== e && (this._reflectingOpen = !0, this.toggleAttribute("open", e), this._reflectingOpen = !1);
+  }
+  _openForCurrentHash() {
+    if (!location.hash)
+      return;
+    const e = decodeURIComponent(location.hash.slice(1));
+    if (!e || !this.querySelector(`#${CSS.escape(e)}`))
+      return;
+    const t = this.open;
+    this._controlledOpen === void 0 ? (this._uncontrolledOpen = !0, this._applyOpen(!0), this._reflectOpen(!0)) : this.dispatchEvent(
+      new CustomEvent(o, {
+        bubbles: !0,
+        composed: !0,
+        detail: { open: !0 }
+      })
+    ), this.open && (t || (cancelAnimationFrame(this._scrollFrame), this._scrollFrame = requestAnimationFrame(() => {
+      document.getElementById(e)?.scrollIntoView();
+    })));
+  }
+}
+export {
+  l as D,
+  p as R,
+  a as e
+};
+//# sourceMappingURL=rc-disclosure-MoC5d7zW.js.map

package/dist/rc-disclosure-MoC5d7zW.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rc-disclosure-MoC5d7zW.js","sources":["../src/disclosureBaseStyles.ts","../src/rc-disclosure.ts"],"sourcesContent":["import { cssText } from '@rcarls/rc-common';\n\n/**\n * Light-DOM base styles for the disclosure panel recipe.\n *\n * `rc-disclosure` and `rc-accordion` coordinate consumer-authored native\n * `<details>` elements that stay in light DOM, so `::slotted()` cannot reach the\n * `<summary>`, the marker, the content children, or `::details-content`. This\n * installs one structural stylesheet per containing `Document` or `ShadowRoot`,\n * following the same pattern as `rc-button` and `rc-listbox`.\n *\n * One recipe serves both supported child forms: a `<details>` directly inside\n * `rc-accordion`, and one wrapped in `rc-disclosure`. Themes map their tokens to\n * these properties rather than re-selecting the native elements.\n *\n * Defaults stay close to what a user agent would render on its own, so an\n * unthemed disclosure keeps native behavior and no theme is required for the\n * component to work. In particular `--rc-disclosure-duration` defaults to `0ms`:\n * a disclosure snaps open the way the platform does until a theme opts into\n * motion.\n */\nexport const DISCLOSURE_BASE_CSS = cssText`\n@layer rc-base {\n  rc-disclosure {\n    display: block;\n  }\n\n  :is(rc-disclosure, rc-accordion) > details {\n    box-sizing: border-box;\n    border: var(--rc-disclosure-border, 0);\n    border-radius: var(--rc-disclosure-radius, 0);\n    background: var(--rc-disclosure-background, transparent);\n    color: var(--rc-disclosure-color, inherit);\n  }\n\n  :is(rc-disclosure, rc-accordion) > details[open] {\n    background: var(--rc-disclosure-open-background, var(--rc-disclosure-background, transparent));\n    box-shadow: var(--rc-disclosure-open-shadow, none);\n  }\n\n  /*\n   * Deliberately no \\`display\\` here. Setting \\`display: grid\\` on a summary drops\n   * its \\`list-item\\` box, which silently removes the native disclosure marker,\n   * so that choice belongs to whichever theme also supplies a replacement.\n   */\n  :is(rc-disclosure, rc-accordion) > details > summary {\n    box-sizing: border-box;\n    min-block-size: var(--rc-disclosure-summary-min-block-size, 0);\n    padding-block: var(--rc-disclosure-summary-padding-block, 0);\n    padding-inline: var(--rc-disclosure-summary-padding-inline, 0);\n    gap: var(--rc-disclosure-summary-gap, 0);\n    color: var(--rc-disclosure-summary-color, inherit);\n    font: var(--rc-disclosure-summary-font, inherit);\n    cursor: pointer;\n  }\n\n  :is(rc-disclosure, rc-accordion) > details > summary::marker {\n    color: var(--rc-disclosure-summary-marker-color, currentColor);\n  }\n\n  /*\n   * Touch browsers keep :hover on the last tapped element, which would leave\n   * a just-toggled summary looking highlighted, so only a hovering pointer\n   * gets the layer.\n   */\n  @media (hover: hover) {\n    :is(rc-disclosure, rc-accordion) > details > summary:hover {\n      background: var(--rc-disclosure-summary-hover-background, transparent);\n    }\n  }\n\n  :is(rc-disclosure, rc-accordion) > details > summary:focus-visible {\n    outline: var(--rc-disclosure-focus-ring, var(--rc-focus-ring, 2px solid Highlight));\n    outline-offset: var(--rc-disclosure-focus-ring-offset, 0);\n  }\n\n  :is(rc-disclosure, rc-accordion) > details > :not(summary) {\n    box-sizing: border-box;\n    padding-block: var(--rc-disclosure-content-padding-block, 0);\n    padding-inline: var(--rc-disclosure-content-padding-inline, 0);\n    color: var(--rc-disclosure-content-color, inherit);\n    font: var(--rc-disclosure-content-font, inherit);\n  }\n\n  /*\n   * Height animation is a feature-detected enhancement on the single\n   * \\`::details-content\\` box, never a max-height ceiling on each child: a ceiling\n   * clips content taller than the guess, and animating every non-summary child\n   * makes each one its own animation unit. Without \\`::details-content\\` the\n   * panel keeps the platform's snap-open behavior.\n   */\n  @supports selector(::details-content) {\n    :is(rc-disclosure, rc-accordion) > details {\n      interpolate-size: allow-keywords;\n    }\n\n    :is(rc-disclosure, rc-accordion) > details::details-content {\n      block-size: 0;\n      overflow: clip;\n      content-visibility: hidden;\n      transition:\n        block-size var(--rc-disclosure-duration, 0ms) var(--rc-disclosure-easing, ease),\n        content-visibility var(--rc-disclosure-duration, 0ms) var(--rc-disclosure-easing, ease)\n          allow-discrete;\n      transition-behavior: allow-discrete;\n    }\n\n    :is(rc-disclosure, rc-accordion) > details[open]::details-content {\n      block-size: auto;\n      content-visibility: visible;\n    }\n  }\n\n  /*\n   * Split by what actually moves: \\`::details-content\\`'s own transition is the\n   * block-size expand/collapse, which is spatial and goes fully to zero. The\n   * base component sets no transition of its own on the \\`<details>\\`, summary,\n   * or content boxes, but this stays as a backstop for a theme that adds one\n   * there (Material adds background-color/border-color/box-shadow, all\n   * effects motion), shortened rather than zeroed so it does not silently\n   * cancel a theme's own reduced-motion handling.\n   */\n  @media (prefers-reduced-motion: reduce) {\n    :is(rc-disclosure, rc-accordion) > details,\n    :is(rc-disclosure, rc-accordion) > details > summary,\n    :is(rc-disclosure, rc-accordion) > details > :not(summary) {\n      transition-duration: 50ms;\n    }\n\n    @supports selector(::details-content) {\n      :is(rc-disclosure, rc-accordion) > details::details-content {\n        transition-duration: 0ms;\n      }\n    }\n  }\n}\n`;\n\nconst styledRoots = new WeakSet<Document | ShadowRoot>();\n\n/** Installs the shared disclosure panel styles once per containing root. */\nexport function ensureDisclosureBaseStyles(root: Document | ShadowRoot): void {\n  if (styledRoots.has(root)) {\n    return;\n  }\n\n  styledRoots.add(root);\n\n  const $style = (root instanceof Document ? root : root.ownerDocument).createElement('style');\n\n  $style.setAttribute('data-rc-light-dom-base', 'rc-disclosure');\n  $style.textContent = DISCLOSURE_BASE_CSS;\n\n  if (root instanceof Document) {\n    root.head.append($style);\n  } else {\n    root.append($style);\n  }\n}\n","import { ensureDisclosureBaseStyles } from './disclosureBaseStyles.js';\n\nexport interface RCDisclosureToggleEvent {\n  /** Whether the disclosure is now open. */\n  open: boolean;\n}\n\nconst TOGGLE_EVENT = 'rc-disclosure-toggle';\nconst DETAILS_SELECTOR = ':scope > details';\nconst SUMMARY_SELECTOR = ':scope > summary';\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'rc-disclosure': RCDisclosure;\n  }\n}\n\n/**\n * Disclosure wrapper for a native <details>/<summary> pair with controlled and uncontrolled\n * open state,\n * following the WAI-ARIA Disclosure pattern.\n *\n * The browser keeps ownership of open/close behavior, keyboard support, and\n * accessibility. This element mirrors state, emits a consistent custom event,\n * and automatically opens when the URL hash matches any id within its subtree.\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-disclosure rc-disclosure docs}\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/ WAI-ARIA Disclosure pattern}\n *\n * @fires rc-disclosure-toggle - Fires when the child `<details>` toggles.\n *\n * @attr open - Controlled open state mirrored to the child `<details>`.\n * @attr default-open - Initial open state for uncontrolled usage.\n *\n * @cssprop [--rc-disclosure-border=0] - Panel border.\n * @cssprop [--rc-disclosure-radius=0] - Panel corner radius.\n * @cssprop [--rc-disclosure-background=transparent] - Panel background while closed.\n * @cssprop [--rc-disclosure-color=inherit] - Panel foreground.\n * @cssprop [--rc-disclosure-open-background] - Panel background while open. Defers to\n *   `--rc-disclosure-background` when unset.\n * @cssprop [--rc-disclosure-open-shadow=none] - Panel shadow while open.\n * @cssprop [--rc-disclosure-summary-min-block-size=0] - Summary minimum block size. Set this to\n *   at least `3rem` for a comfortable touch target.\n * @cssprop [--rc-disclosure-summary-padding-block=0] - Summary block padding.\n * @cssprop [--rc-disclosure-summary-padding-inline=0] - Summary inline padding.\n * @cssprop [--rc-disclosure-summary-gap=0] - Summary gap, for a theme that lays the summary out\n *   as a grid or flex container.\n * @cssprop [--rc-disclosure-summary-color=inherit] - Summary foreground.\n * @cssprop [--rc-disclosure-summary-font=inherit] - Summary font shorthand.\n * @cssprop [--rc-disclosure-summary-marker-color=currentColor] - Native disclosure marker color.\n *   A theme that replaces the marker with its own affordance should hide `::marker` itself.\n * @cssprop [--rc-disclosure-summary-hover-background=transparent] - Summary hover background.\n * @cssprop [--rc-disclosure-focus-ring=var(--rc-focus-ring, 2px solid Highlight)] - Summary\n *   focus-visible outline.\n * @cssprop [--rc-disclosure-focus-ring-offset=0] - Summary focus-visible outline offset.\n * @cssprop [--rc-disclosure-content-padding-block=0] - Content block padding.\n * @cssprop [--rc-disclosure-content-padding-inline=0] - Content inline padding.\n * @cssprop [--rc-disclosure-content-color=inherit] - Content foreground.\n * @cssprop [--rc-disclosure-content-font=inherit] - Content font shorthand.\n * @cssprop [--rc-disclosure-duration=0ms] - Open and close transition duration. Zero by default,\n *   so the panel snaps the way the platform does until a theme opts into motion. The animation\n *   runs on `::details-content` where that is supported and is skipped entirely where it is not.\n * @cssprop [--rc-disclosure-easing=ease] - Open and close transition easing.\n */\nexport class RCDisclosure extends HTMLElement {\n  private _observer = new MutationObserver(() => this._setupDetails());\n\n  private _$details: HTMLDetailsElement | null = null;\n\n  private _scrollFrame = 0;\n  private _controlledOpen: boolean | undefined;\n  private _defaultOpen = false;\n  private _defaultOpenInitialized = false;\n  private _uncontrolledOpen: boolean | undefined;\n  private _openInitialized = false;\n  private _reflectingOpen = false;\n  private _suppressNextToggle = false;\n\n  static get observedAttributes(): string[] {\n    return ['open', 'default-open'];\n  }\n\n  /** Current open state. Host writes are silent; assign `undefined` to release control. */\n  get open(): boolean {\n    return this._controlledOpen ?? this._uncontrolledOpen ?? this._defaultOpen;\n  }\n\n  set open(value: boolean | undefined) {\n    this._controlledOpen = value;\n    this._openInitialized = true;\n    this._applyOpen(this.open);\n    this._reflectOpen(this.open);\n  }\n\n  /** Initial open state for uncontrolled usage. */\n  get defaultOpen(): boolean {\n    return this._defaultOpen;\n  }\n\n  set defaultOpen(value: boolean) {\n    this._defaultOpen = value;\n    this._defaultOpenInitialized = true;\n\n    if (\n      !this._openInitialized &&\n      this._controlledOpen === undefined &&\n      this._uncontrolledOpen === undefined\n    ) {\n      this._applyOpen(value);\n      this._reflectOpen(value);\n    }\n  }\n\n  connectedCallback(): void {\n    ensureDisclosureBaseStyles(this.getRootNode() as Document | ShadowRoot);\n    this._observer.observe(this, { childList: true });\n    window.addEventListener('hashchange', this._onHashChange);\n    this._setupDetails();\n  }\n\n  disconnectedCallback(): void {\n    this._observer.disconnect();\n    window.removeEventListener('hashchange', this._onHashChange);\n    cancelAnimationFrame(this._scrollFrame);\n    this._teardownDetails();\n  }\n\n  attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void {\n    if (oldValue === newValue) {\n      return;\n    }\n\n    if (name === 'default-open') {\n      this.defaultOpen = newValue !== null;\n\n      return;\n    }\n\n    if (this._reflectingOpen) {\n      return;\n    }\n\n    this.open = newValue === null ? false : true;\n  }\n\n  private _setupDetails(): void {\n    const $details = this.querySelector<HTMLDetailsElement>(DETAILS_SELECTOR);\n\n    if ($details === this._$details) {\n      return;\n    }\n\n    this._teardownDetails();\n    this._$details = $details;\n\n    if (!$details) {\n      if (import.meta.env.DEV) {\n        console.warn(\n          '[rc-disclosure] No direct child <details> found. Place native ' +\n            '<details><summary>...</summary>...</details> inside <rc-disclosure>.',\n          this,\n        );\n      }\n\n      return;\n    }\n\n    if (!$details.id) {\n      $details.id = crypto.randomUUID();\n    }\n\n    const $summary = $details.querySelector<HTMLElement>(SUMMARY_SELECTOR);\n\n    $summary?.setAttribute('aria-controls', $details.id);\n\n    $details.addEventListener('toggle', this._onToggle);\n\n    if (this._controlledOpen === undefined && this._uncontrolledOpen === undefined) {\n      this._uncontrolledOpen = this._defaultOpenInitialized ? this._defaultOpen : $details.open;\n    }\n\n    this._applyOpen(this.open, true);\n    this._reflectOpen(this.open);\n    this._openForCurrentHash();\n  }\n\n  private _teardownDetails(): void {\n    const $summary = this._$details?.querySelector<HTMLElement>(SUMMARY_SELECTOR);\n\n    $summary?.removeAttribute('aria-controls');\n\n    this._$details?.removeEventListener('toggle', this._onToggle);\n    this._$details = null;\n  }\n\n  private _applyOpen(open: boolean, suppressToggle = true): void {\n    const $details = this._$details;\n\n    if (!$details) {\n      return;\n    }\n\n    if ($details.open !== open) {\n      this._suppressNextToggle = suppressToggle;\n      $details.open = open;\n    }\n  }\n\n  private _reflectOpen(value: boolean): void {\n    if (this.hasAttribute('open') === value) {\n      return;\n    }\n\n    this._reflectingOpen = true;\n    this.toggleAttribute('open', value);\n    this._reflectingOpen = false;\n  }\n\n  private _onToggle = (): void => {\n    if (this._suppressNextToggle) {\n      this._suppressNextToggle = false;\n\n      return;\n    }\n\n    const requestedOpen = this._$details?.open ?? false;\n\n    if (this._controlledOpen === undefined) {\n      this._uncontrolledOpen = requestedOpen;\n      this._reflectOpen(requestedOpen);\n    } else {\n      this._applyOpen(this._controlledOpen, true);\n      this._reflectOpen(this._controlledOpen);\n    }\n\n    this.dispatchEvent(\n      new CustomEvent<RCDisclosureToggleEvent>(TOGGLE_EVENT, {\n        bubbles: true,\n        composed: true,\n        detail: { open: requestedOpen },\n      }),\n    );\n  };\n\n  private _onHashChange = (): void => {\n    this._openForCurrentHash();\n  };\n\n  private _openForCurrentHash(): void {\n    if (!location.hash) {\n      return;\n    }\n\n    const targetId = decodeURIComponent(location.hash.slice(1));\n\n    if (!targetId) {\n      return;\n    }\n\n    const $target = this.querySelector(`#${CSS.escape(targetId)}`);\n\n    if (!$target) {\n      return;\n    }\n\n    const wasOpen = this.open;\n\n    if (this._controlledOpen === undefined) {\n      this._uncontrolledOpen = true;\n      this._applyOpen(true);\n      this._reflectOpen(true);\n    } else {\n      this.dispatchEvent(\n        new CustomEvent<RCDisclosureToggleEvent>(TOGGLE_EVENT, {\n          bubbles: true,\n          composed: true,\n          detail: { open: true },\n        }),\n      );\n    }\n\n    if (!this.open) {\n      return;\n    }\n\n    if (wasOpen) {\n      return;\n    }\n\n    cancelAnimationFrame(this._scrollFrame);\n\n    this._scrollFrame = requestAnimationFrame(() => {\n      document.getElementById(targetId)?.scrollIntoView();\n    });\n  }\n}\n\nexport default RCDisclosure;\n"],"names":["DISCLOSURE_BASE_CSS","cssText","styledRoots","ensureDisclosureBaseStyles","root","$style","TOGGLE_EVENT","DETAILS_SELECTOR","SUMMARY_SELECTOR","RCDisclosure","requestedOpen","value","name","oldValue","newValue","$details","open","suppressToggle","targetId","wasOpen"],"mappings":"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"}

package/dist/rc-disclosure-define.js

@@ -1,6 +1,9 @@
-import { RCDisclosure as e } from "./rc-disclosure.js";
+import { R as e } from "./rc-disclosure-MoC5d7zW.js";
+import { D as t, e as c } from "./rc-disclosure-MoC5d7zW.js";
 customElements.get("rc-disclosure") || customElements.define("rc-disclosure", e);
 export {
-  e as RCDisclosure
+  t as DISCLOSURE_BASE_CSS,
+  e as RCDisclosure,
+  c as ensureDisclosureBaseStyles
 };
 //# sourceMappingURL=rc-disclosure-define.js.map

package/dist/rc-disclosure-define.js.map

@@ -1 +1 @@
-{"version":3,"file":"rc-disclosure-define.js","sources":["../src/define.ts"],"sourcesContent":["import { RCDisclosure } from './index.js';\n\nif (!customElements.get('rc-disclosure')) {\n  customElements.define('rc-disclosure', RCDisclosure);\n}\n\nexport * from './index.js';\n"],"names":["RCDisclosure"],"mappings":";AAEK,eAAe,IAAI,eAAe,KACrC,eAAe,OAAO,iBAAiBA,CAAY;"}
+{"version":3,"file":"rc-disclosure-define.js","sources":["../src/define.ts"],"sourcesContent":["import { RCDisclosure } from './index.js';\n\nif (!customElements.get('rc-disclosure')) {\n  customElements.define('rc-disclosure', RCDisclosure);\n}\n\nexport * from './index.js';\n"],"names":["RCDisclosure"],"mappings":";;AAEK,eAAe,IAAI,eAAe,KACrC,eAAe,OAAO,iBAAiBA,CAAY;"}

package/dist/rc-disclosure.js

@@ -1,90 +1,7 @@
-const n = "rc-disclosure-toggle", r = ":scope > details", i = ":scope > summary";
-class l extends HTMLElement {
-  constructor() {
-    super(...arguments), this._observer = new MutationObserver(() => this._setupDetails()), this._$details = null, this._scrollFrame = 0, this._defaultOpen = !1, this._defaultOpenInitialized = !1, this._openInitialized = !1, this._reflectingOpen = !1, this._suppressNextToggle = !1, this._onToggle = () => {
-      if (this._suppressNextToggle) {
-        this._suppressNextToggle = !1;
-        return;
-      }
-      const e = this._$details?.open ?? !1;
-      this._controlledOpen === void 0 ? (this._uncontrolledOpen = e, this._reflectOpen(e)) : (this._applyOpen(this._controlledOpen, !0), this._reflectOpen(this._controlledOpen)), this.dispatchEvent(
-        new CustomEvent(n, {
-          bubbles: !0,
-          composed: !0,
-          detail: { open: e }
-        })
-      );
-    }, this._onHashChange = () => {
-      this._openForCurrentHash();
-    };
-  }
-  static get observedAttributes() {
-    return ["open", "default-open"];
-  }
-  /** Current open state. Host writes are silent; assign `undefined` to release control. */
-  get open() {
-    return this._controlledOpen ?? this._uncontrolledOpen ?? this._defaultOpen;
-  }
-  set open(e) {
-    this._controlledOpen = e, this._openInitialized = !0, this._applyOpen(this.open), this._reflectOpen(this.open);
-  }
-  /** Initial open state for uncontrolled usage. */
-  get defaultOpen() {
-    return this._defaultOpen;
-  }
-  set defaultOpen(e) {
-    this._defaultOpen = e, this._defaultOpenInitialized = !0, !this._openInitialized && this._controlledOpen === void 0 && this._uncontrolledOpen === void 0 && (this._applyOpen(e), this._reflectOpen(e));
-  }
-  connectedCallback() {
-    this._observer.observe(this, { childList: !0 }), window.addEventListener("hashchange", this._onHashChange), this._setupDetails();
-  }
-  disconnectedCallback() {
-    this._observer.disconnect(), window.removeEventListener("hashchange", this._onHashChange), cancelAnimationFrame(this._scrollFrame), this._teardownDetails();
-  }
-  attributeChangedCallback(e, s, t) {
-    if (s !== t) {
-      if (e === "default-open") {
-        this.defaultOpen = t !== null;
-        return;
-      }
-      this._reflectingOpen || (this.open = t !== null);
-    }
-  }
-  _setupDetails() {
-    const e = this.querySelector(r);
-    if (e === this._$details || (this._teardownDetails(), this._$details = e, !e))
-      return;
-    e.id || (e.id = crypto.randomUUID()), e.querySelector(i)?.setAttribute("aria-controls", e.id), e.addEventListener("toggle", this._onToggle), this._controlledOpen === void 0 && this._uncontrolledOpen === void 0 && (this._uncontrolledOpen = this._defaultOpenInitialized ? this._defaultOpen : e.open), this._applyOpen(this.open, !0), this._reflectOpen(this.open), this._openForCurrentHash();
-  }
-  _teardownDetails() {
-    this._$details?.querySelector(i)?.removeAttribute("aria-controls"), this._$details?.removeEventListener("toggle", this._onToggle), this._$details = null;
-  }
-  _applyOpen(e, s = !0) {
-    const t = this._$details;
-    t && t.open !== e && (this._suppressNextToggle = s, t.open = e);
-  }
-  _reflectOpen(e) {
-    this.hasAttribute("open") !== e && (this._reflectingOpen = !0, this.toggleAttribute("open", e), this._reflectingOpen = !1);
-  }
-  _openForCurrentHash() {
-    if (!location.hash)
-      return;
-    const e = decodeURIComponent(location.hash.slice(1));
-    if (!e || !this.querySelector(`#${CSS.escape(e)}`))
-      return;
-    const t = this.open;
-    this._controlledOpen === void 0 ? (this._uncontrolledOpen = !0, this._applyOpen(!0), this._reflectOpen(!0)) : this.dispatchEvent(
-      new CustomEvent(n, {
-        bubbles: !0,
-        composed: !0,
-        detail: { open: !0 }
-      })
-    ), this.open && (t || (cancelAnimationFrame(this._scrollFrame), this._scrollFrame = requestAnimationFrame(() => {
-      document.getElementById(e)?.scrollIntoView();
-    })));
-  }
-}
+import { D as S, R as r, e as a } from "./rc-disclosure-MoC5d7zW.js";
 export {
-  l as RCDisclosure
+  S as DISCLOSURE_BASE_CSS,
+  r as RCDisclosure,
+  a as ensureDisclosureBaseStyles
 };
 //# sourceMappingURL=rc-disclosure.js.map

package/dist/rc-disclosure.js.map

@@ -1 +1 @@
-{"version":3,"file":"rc-disclosure.js","sources":["../src/rc-disclosure.ts"],"sourcesContent":["export interface RCDisclosureToggleEvent {\n  /** Whether the disclosure is now open. */\n  open: boolean;\n}\n\nconst TOGGLE_EVENT = 'rc-disclosure-toggle';\nconst DETAILS_SELECTOR = ':scope > details';\nconst SUMMARY_SELECTOR = ':scope > summary';\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'rc-disclosure': RCDisclosure;\n  }\n}\n\n/**\n * Disclosure wrapper for a native <details>/<summary> pair with controlled and uncontrolled\n * open state,\n * following the WAI-ARIA Disclosure pattern.\n *\n * The browser keeps ownership of open/close behavior, keyboard support, and\n * accessibility. This element mirrors state, emits a consistent custom event,\n * and automatically opens when the URL hash matches any id within its subtree.\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-disclosure rc-disclosure docs}\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/ WAI-ARIA Disclosure pattern}\n *\n * @fires rc-disclosure-toggle - Fires when the child `<details>` toggles.\n *\n * @attr open - Controlled open state mirrored to the child `<details>`.\n * @attr default-open - Initial open state for uncontrolled usage.\n */\nexport class RCDisclosure extends HTMLElement {\n  private _observer = new MutationObserver(() => this._setupDetails());\n\n  private _$details: HTMLDetailsElement | null = null;\n\n  private _scrollFrame = 0;\n  private _controlledOpen: boolean | undefined;\n  private _defaultOpen = false;\n  private _defaultOpenInitialized = false;\n  private _uncontrolledOpen: boolean | undefined;\n  private _openInitialized = false;\n  private _reflectingOpen = false;\n  private _suppressNextToggle = false;\n\n  static get observedAttributes(): string[] {\n    return ['open', 'default-open'];\n  }\n\n  /** Current open state. Host writes are silent; assign `undefined` to release control. */\n  get open(): boolean {\n    return this._controlledOpen ?? this._uncontrolledOpen ?? this._defaultOpen;\n  }\n\n  set open(value: boolean | undefined) {\n    this._controlledOpen = value;\n    this._openInitialized = true;\n    this._applyOpen(this.open);\n    this._reflectOpen(this.open);\n  }\n\n  /** Initial open state for uncontrolled usage. */\n  get defaultOpen(): boolean {\n    return this._defaultOpen;\n  }\n\n  set defaultOpen(value: boolean) {\n    this._defaultOpen = value;\n    this._defaultOpenInitialized = true;\n\n    if (\n      !this._openInitialized &&\n      this._controlledOpen === undefined &&\n      this._uncontrolledOpen === undefined\n    ) {\n      this._applyOpen(value);\n      this._reflectOpen(value);\n    }\n  }\n\n  connectedCallback(): void {\n    this._observer.observe(this, { childList: true });\n    window.addEventListener('hashchange', this._onHashChange);\n    this._setupDetails();\n  }\n\n  disconnectedCallback(): void {\n    this._observer.disconnect();\n    window.removeEventListener('hashchange', this._onHashChange);\n    cancelAnimationFrame(this._scrollFrame);\n    this._teardownDetails();\n  }\n\n  attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void {\n    if (oldValue === newValue) {\n      return;\n    }\n\n    if (name === 'default-open') {\n      this.defaultOpen = newValue !== null;\n\n      return;\n    }\n\n    if (this._reflectingOpen) {\n      return;\n    }\n\n    this.open = newValue === null ? false : true;\n  }\n\n  private _setupDetails(): void {\n    const $details = this.querySelector<HTMLDetailsElement>(DETAILS_SELECTOR);\n\n    if ($details === this._$details) {\n      return;\n    }\n\n    this._teardownDetails();\n    this._$details = $details;\n\n    if (!$details) {\n      if (import.meta.env.DEV) {\n        console.warn(\n          '[rc-disclosure] No direct child <details> found. Place native ' +\n            '<details><summary>...</summary>...</details> inside <rc-disclosure>.',\n          this,\n        );\n      }\n\n      return;\n    }\n\n    if (!$details.id) {\n      $details.id = crypto.randomUUID();\n    }\n\n    const $summary = $details.querySelector<HTMLElement>(SUMMARY_SELECTOR);\n\n    $summary?.setAttribute('aria-controls', $details.id);\n\n    $details.addEventListener('toggle', this._onToggle);\n\n    if (this._controlledOpen === undefined && this._uncontrolledOpen === undefined) {\n      this._uncontrolledOpen = this._defaultOpenInitialized ? this._defaultOpen : $details.open;\n    }\n\n    this._applyOpen(this.open, true);\n    this._reflectOpen(this.open);\n    this._openForCurrentHash();\n  }\n\n  private _teardownDetails(): void {\n    const $summary = this._$details?.querySelector<HTMLElement>(SUMMARY_SELECTOR);\n\n    $summary?.removeAttribute('aria-controls');\n\n    this._$details?.removeEventListener('toggle', this._onToggle);\n    this._$details = null;\n  }\n\n  private _applyOpen(open: boolean, suppressToggle = true): void {\n    const $details = this._$details;\n\n    if (!$details) {\n      return;\n    }\n\n    if ($details.open !== open) {\n      this._suppressNextToggle = suppressToggle;\n      $details.open = open;\n    }\n  }\n\n  private _reflectOpen(value: boolean): void {\n    if (this.hasAttribute('open') === value) {\n      return;\n    }\n\n    this._reflectingOpen = true;\n    this.toggleAttribute('open', value);\n    this._reflectingOpen = false;\n  }\n\n  private _onToggle = (): void => {\n    if (this._suppressNextToggle) {\n      this._suppressNextToggle = false;\n\n      return;\n    }\n\n    const requestedOpen = this._$details?.open ?? false;\n\n    if (this._controlledOpen === undefined) {\n      this._uncontrolledOpen = requestedOpen;\n      this._reflectOpen(requestedOpen);\n    } else {\n      this._applyOpen(this._controlledOpen, true);\n      this._reflectOpen(this._controlledOpen);\n    }\n\n    this.dispatchEvent(\n      new CustomEvent<RCDisclosureToggleEvent>(TOGGLE_EVENT, {\n        bubbles: true,\n        composed: true,\n        detail: { open: requestedOpen },\n      }),\n    );\n  };\n\n  private _onHashChange = (): void => {\n    this._openForCurrentHash();\n  };\n\n  private _openForCurrentHash(): void {\n    if (!location.hash) {\n      return;\n    }\n\n    const targetId = decodeURIComponent(location.hash.slice(1));\n\n    if (!targetId) {\n      return;\n    }\n\n    const $target = this.querySelector(`#${CSS.escape(targetId)}`);\n\n    if (!$target) {\n      return;\n    }\n\n    const wasOpen = this.open;\n\n    if (this._controlledOpen === undefined) {\n      this._uncontrolledOpen = true;\n      this._applyOpen(true);\n      this._reflectOpen(true);\n    } else {\n      this.dispatchEvent(\n        new CustomEvent<RCDisclosureToggleEvent>(TOGGLE_EVENT, {\n          bubbles: true,\n          composed: true,\n          detail: { open: true },\n        }),\n      );\n    }\n\n    if (!this.open) {\n      return;\n    }\n\n    if (wasOpen) {\n      return;\n    }\n\n    cancelAnimationFrame(this._scrollFrame);\n\n    this._scrollFrame = requestAnimationFrame(() => {\n      document.getElementById(targetId)?.scrollIntoView();\n    });\n  }\n}\n\nexport default RCDisclosure;\n"],"names":["TOGGLE_EVENT","DETAILS_SELECTOR","SUMMARY_SELECTOR","RCDisclosure","requestedOpen","value","name","oldValue","newValue","$details","open","suppressToggle","targetId","wasOpen"],"mappings":"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"}
+{"version":3,"file":"rc-disclosure.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/types/packages/rc-disclosure/src/disclosureBaseStyles.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Light-DOM base styles for the disclosure panel recipe.
+ *
+ * `rc-disclosure` and `rc-accordion` coordinate consumer-authored native
+ * `<details>` elements that stay in light DOM, so `::slotted()` cannot reach the
+ * `<summary>`, the marker, the content children, or `::details-content`. This
+ * installs one structural stylesheet per containing `Document` or `ShadowRoot`,
+ * following the same pattern as `rc-button` and `rc-listbox`.
+ *
+ * One recipe serves both supported child forms: a `<details>` directly inside
+ * `rc-accordion`, and one wrapped in `rc-disclosure`. Themes map their tokens to
+ * these properties rather than re-selecting the native elements.
+ *
+ * Defaults stay close to what a user agent would render on its own, so an
+ * unthemed disclosure keeps native behavior and no theme is required for the
+ * component to work. In particular `--rc-disclosure-duration` defaults to `0ms`:
+ * a disclosure snaps open the way the platform does until a theme opts into
+ * motion.
+ */
+export declare const DISCLOSURE_BASE_CSS: string;
+/** Installs the shared disclosure panel styles once per containing root. */
+export declare function ensureDisclosureBaseStyles(root: Document | ShadowRoot): void;

package/dist/types/packages/rc-disclosure/src/index.d.ts

@@ -1 +1,2 @@
 export * from './rc-disclosure.js';
+export * from './disclosureBaseStyles.js';

package/dist/types/packages/rc-disclosure/src/rc-disclosure.d.ts

@@ -23,6 +23,36 @@ declare global {
  *
  * @attr open - Controlled open state mirrored to the child `<details>`.
  * @attr default-open - Initial open state for uncontrolled usage.
+ *
+ * @cssprop [--rc-disclosure-border=0] - Panel border.
+ * @cssprop [--rc-disclosure-radius=0] - Panel corner radius.
+ * @cssprop [--rc-disclosure-background=transparent] - Panel background while closed.
+ * @cssprop [--rc-disclosure-color=inherit] - Panel foreground.
+ * @cssprop [--rc-disclosure-open-background] - Panel background while open. Defers to
+ *   `--rc-disclosure-background` when unset.
+ * @cssprop [--rc-disclosure-open-shadow=none] - Panel shadow while open.
+ * @cssprop [--rc-disclosure-summary-min-block-size=0] - Summary minimum block size. Set this to
+ *   at least `3rem` for a comfortable touch target.
+ * @cssprop [--rc-disclosure-summary-padding-block=0] - Summary block padding.
+ * @cssprop [--rc-disclosure-summary-padding-inline=0] - Summary inline padding.
+ * @cssprop [--rc-disclosure-summary-gap=0] - Summary gap, for a theme that lays the summary out
+ *   as a grid or flex container.
+ * @cssprop [--rc-disclosure-summary-color=inherit] - Summary foreground.
+ * @cssprop [--rc-disclosure-summary-font=inherit] - Summary font shorthand.
+ * @cssprop [--rc-disclosure-summary-marker-color=currentColor] - Native disclosure marker color.
+ *   A theme that replaces the marker with its own affordance should hide `::marker` itself.
+ * @cssprop [--rc-disclosure-summary-hover-background=transparent] - Summary hover background.
+ * @cssprop [--rc-disclosure-focus-ring=var(--rc-focus-ring, 2px solid Highlight)] - Summary
+ *   focus-visible outline.
+ * @cssprop [--rc-disclosure-focus-ring-offset=0] - Summary focus-visible outline offset.
+ * @cssprop [--rc-disclosure-content-padding-block=0] - Content block padding.
+ * @cssprop [--rc-disclosure-content-padding-inline=0] - Content inline padding.
+ * @cssprop [--rc-disclosure-content-color=inherit] - Content foreground.
+ * @cssprop [--rc-disclosure-content-font=inherit] - Content font shorthand.
+ * @cssprop [--rc-disclosure-duration=0ms] - Open and close transition duration. Zero by default,
+ *   so the panel snaps the way the platform does until a theme opts into motion. The animation
+ *   runs on `::details-content` where that is supported and is skipped entirely where it is not.
+ * @cssprop [--rc-disclosure-easing=ease] - Open and close transition easing.
  */
 export declare class RCDisclosure extends HTMLElement {
     private _observer;

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "Disclosure wrapper for a native <details>/<summary> pair with controlled open state.",
   "repository": {
     "type": "git",
@@ -43,6 +43,9 @@
     "test:browser:chrome": "vitest --run --project=chromium",
     "test:browser:firefox": "vitest --run --project=firefox"
   },
+  "dependencies": {
+    "@rcarls/rc-common": "0.7.0"
+  },
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "0.11.0",
     "@vitest/browser-playwright": "4.1.5",