@ttoss/fsl-ui 0.2.4

package/dist/composites/Disclosure/Disclosure.cjs

@@ -0,0 +1,214 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+const require_focusRing = require('../../tokens/focusRing.cjs');
+const require_resolveInteractiveStyle = require('../../tokens/resolveInteractiveStyle.cjs');
+const require_Icon = require('../../components/Icon/Icon.cjs');
+const require_scope = require('../scope.cjs');
+let _ttoss_fsl_theme_vars = require("@ttoss/fsl-theme/vars");
+let react_aria_components = require("react-aria-components");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+react = require_runtime.__toESM(react);
+
+//#region src/composites/Disclosure/Disclosure.tsx
+var disclosureScope = require_scope.createCompositeScope("Disclosure");
+/** Formal semantic identity — Disclosure root (Disclosure entity, single section). */
+var disclosureMeta = {
+  displayName: "Disclosure",
+  entity: "Disclosure",
+  structure: "root"
+};
+/** Formal semantic identity — DisclosureTrigger (header button). */
+var disclosureTriggerMeta = {
+  displayName: "DisclosureTrigger",
+  entity: "Disclosure",
+  structure: "trigger"
+};
+/** Formal semantic identity — DisclosurePanel (collapsible content region). */
+var disclosurePanelMeta = {
+  displayName: "DisclosurePanel",
+  entity: "Disclosure",
+  structure: "content"
+};
+/**
+* A single collapsible section built on React Aria's `Disclosure`.
+*
+* The standalone counterpart of `Accordion` (a `DisclosureGroup`): use
+* `Disclosure` when there is exactly one expandable region with no sibling
+* coordination (a "show more" block, an optional settings section). Entity =
+* Disclosure → reads `vars.colors.navigation.{primary|muted}` and animates
+* with `vars.motion.transition.{enter,exit}`.
+*
+* @example
+* ```tsx
+* <Disclosure>
+*   <DisclosureTrigger>Advanced options</DisclosureTrigger>
+*   <DisclosurePanel>Rarely-needed settings live here.</DisclosurePanel>
+* </Disclosure>
+* ```
+*/
+var Disclosure = ({
+  evaluation = "primary",
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */(0, react_jsx_runtime.jsx)(disclosureScope.Provider, {
+    value: {
+      evaluation
+    },
+    children: /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_aria_components.Disclosure, {
+      ...props,
+      "data-scope": "disclosure",
+      "data-part": "root",
+      "data-evaluation": evaluation,
+      style: {
+        boxSizing: "border-box",
+        display: "flex",
+        flexDirection: "column",
+        borderWidth: _ttoss_fsl_theme_vars.vars.border.outline.control.width,
+        borderStyle: _ttoss_fsl_theme_vars.vars.border.outline.control.style,
+        borderColor: _ttoss_fsl_theme_vars.vars.colors.navigation[evaluation]?.border?.default ?? "transparent",
+        borderRadius: _ttoss_fsl_theme_vars.vars.radii.surface,
+        overflow: "hidden"
+      },
+      children
+    })
+  });
+};
+Disclosure.displayName = disclosureMeta.displayName;
+/**
+* The clickable header of a `Disclosure`. Renders inside a heading element
+* (level via `headingLevel`, default `<h3>`) and exposes `aria-expanded` plus
+* a chevron that rotates when the section is open. Must be used inside a
+* `Disclosure`.
+*/
+var DisclosureTrigger = ({
+  headingLevel = 3,
+  children,
+  ...props
+}) => {
+  const {
+    evaluation
+  } = disclosureScope.use(disclosureTriggerMeta.displayName);
+  const c = _ttoss_fsl_theme_vars.vars.colors.navigation[evaluation];
+  const isExpanded = react.useContext(react_aria_components.DisclosureStateContext)?.isExpanded ?? false;
+  return /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_aria_components.Heading, {
+    level: headingLevel,
+    "data-scope": "disclosure",
+    "data-part": "header",
+    style: {
+      margin: 0
+    },
+    children: /* @__PURE__ */(0, react_jsx_runtime.jsxs)(react_aria_components.Button, {
+      ...props,
+      slot: "trigger",
+      "data-scope": "disclosure",
+      "data-part": "trigger",
+      style: ({
+        isHovered,
+        isPressed,
+        isDisabled,
+        isFocusVisible
+      }) => {
+        const flags = {
+          isHovered,
+          isPressed,
+          isDisabled,
+          isFocusVisible,
+          isExpanded
+        };
+        return {
+          boxSizing: "border-box",
+          width: "100%",
+          display: "inline-flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          gap: _ttoss_fsl_theme_vars.vars.spacing.gap.inline.sm,
+          minHeight: _ttoss_fsl_theme_vars.vars.sizing.hit.base,
+          paddingBlock: _ttoss_fsl_theme_vars.vars.spacing.inset.control.md,
+          paddingInline: _ttoss_fsl_theme_vars.vars.spacing.inset.control.md,
+          border: "none",
+          background: "none",
+          backgroundColor: require_resolveInteractiveStyle.resolveInteractiveStyle(c?.background, flags),
+          color: require_resolveInteractiveStyle.resolveInteractiveStyle(c?.text, flags) ?? c?.text?.default,
+          cursor: isDisabled ? "not-allowed" : "pointer",
+          opacity: isDisabled ? _ttoss_fsl_theme_vars.vars.opacity.disabled : void 0,
+          ..._ttoss_fsl_theme_vars.vars.text.label.md,
+          textAlign: "start",
+          transitionProperty: "background-color, color",
+          transitionDuration: _ttoss_fsl_theme_vars.vars.motion.transition.enter.duration,
+          transitionTimingFunction: _ttoss_fsl_theme_vars.vars.motion.transition.enter.easing,
+          outline: require_focusRing.focusRingOutline(isFocusVisible),
+          outlineOffset: "-2px"
+        };
+      },
+      children: [/* @__PURE__ */(0, react_jsx_runtime.jsx)("span", {
+        "data-scope": "disclosure",
+        "data-part": "label",
+        style: {
+          flex: 1
+        },
+        children
+      }), /* @__PURE__ */(0, react_jsx_runtime.jsx)("span", {
+        "data-scope": "disclosure",
+        "data-part": "indicator",
+        "aria-hidden": true,
+        style: {
+          flexShrink: 0,
+          display: "inline-block",
+          transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)",
+          transitionProperty: "transform",
+          transitionDuration: isExpanded ? _ttoss_fsl_theme_vars.vars.motion.transition.enter.duration : _ttoss_fsl_theme_vars.vars.motion.transition.exit.duration,
+          transitionTimingFunction: isExpanded ? _ttoss_fsl_theme_vars.vars.motion.transition.enter.easing : _ttoss_fsl_theme_vars.vars.motion.transition.exit.easing
+        },
+        children: /* @__PURE__ */(0, react_jsx_runtime.jsx)(require_Icon.Icon, {
+          intent: "disclosure.collapse"
+        })
+      })]
+    })
+  });
+};
+DisclosureTrigger.displayName = disclosureTriggerMeta.displayName;
+/**
+* The collapsible content region of a `Disclosure`. React Aria handles
+* show/hide via the parent Disclosure state; the chrome uses
+* `vars.motion.transition.{enter,exit}` semantics. Must be used inside a
+* `Disclosure`.
+*
+* @example
+* ```tsx
+* <DisclosurePanel>Rarely-needed settings live here.</DisclosurePanel>
+* ```
+*/
+var DisclosurePanel = ({
+  children,
+  ...props
+}) => {
+  const {
+    evaluation
+  } = disclosureScope.use(disclosurePanelMeta.displayName);
+  const c = _ttoss_fsl_theme_vars.vars.colors.navigation[evaluation];
+  return /* @__PURE__ */(0, react_jsx_runtime.jsx)(react_aria_components.DisclosurePanel, {
+    ...props,
+    "data-scope": "disclosure",
+    "data-part": "content",
+    style: {
+      boxSizing: "border-box",
+      paddingBlock: _ttoss_fsl_theme_vars.vars.spacing.inset.control.md,
+      paddingInline: _ttoss_fsl_theme_vars.vars.spacing.inset.control.md,
+      backgroundColor: c?.background?.default,
+      color: c?.text?.default,
+      ..._ttoss_fsl_theme_vars.vars.text.body.md
+    },
+    children
+  });
+};
+DisclosurePanel.displayName = disclosurePanelMeta.displayName;
+
+//#endregion
+exports.Disclosure = Disclosure;
+exports.DisclosurePanel = DisclosurePanel;
+exports.DisclosureTrigger = DisclosureTrigger;
+exports.disclosureMeta = disclosureMeta;
+exports.disclosurePanelMeta = disclosurePanelMeta;
+exports.disclosureTriggerMeta = disclosureTriggerMeta;

package/dist/composites/Disclosure/Disclosure.d.cts

@@ -0,0 +1,118 @@
+
+import { EvaluationsFor } from "../../semantics/taxonomy.cjs";
+import * as React from "react";
+import { ButtonProps, DisclosurePanelProps, DisclosureProps } from "react-aria-components";
+
+//#region src/composites/Disclosure/Disclosure.d.ts
+type DisclosureEvaluation = EvaluationsFor<'Disclosure'>;
+/** Formal semantic identity — Disclosure root (Disclosure entity, single section). */
+declare const disclosureMeta: {
+  readonly displayName: "Disclosure";
+  readonly entity: "Disclosure";
+  readonly structure: "root";
+};
+/** Formal semantic identity — DisclosureTrigger (header button). */
+declare const disclosureTriggerMeta: {
+  readonly displayName: "DisclosureTrigger";
+  readonly entity: "Disclosure";
+  readonly structure: "trigger";
+};
+/** Formal semantic identity — DisclosurePanel (collapsible content region). */
+declare const disclosurePanelMeta: {
+  readonly displayName: "DisclosurePanel";
+  readonly entity: "Disclosure";
+  readonly structure: "content";
+};
+/**
+ * Props for the Disclosure component.
+ *
+ * The composite owns its layout; pass `style`/`className` on a wrapping
+ * element rather than on the composite root. See CONTRIBUTING §4.
+ */
+interface DisclosureProps$1 extends Omit<DisclosureProps, 'style' | 'children' | 'className'> {
+  /**
+   * Authorial emphasis. `primary` is the standard disclosure chrome; `muted`
+   * is a subdued variant for sidebars and dense lists.
+   * @default 'primary'
+   */
+  evaluation?: DisclosureEvaluation;
+  /** `DisclosureTrigger` then `DisclosurePanel`, in that order. */
+  children?: React.ReactNode;
+}
+/**
+ * A single collapsible section built on React Aria's `Disclosure`.
+ *
+ * The standalone counterpart of `Accordion` (a `DisclosureGroup`): use
+ * `Disclosure` when there is exactly one expandable region with no sibling
+ * coordination (a "show more" block, an optional settings section). Entity =
+ * Disclosure → reads `vars.colors.navigation.{primary|muted}` and animates
+ * with `vars.motion.transition.{enter,exit}`.
+ *
+ * @example
+ * ```tsx
+ * <Disclosure>
+ *   <DisclosureTrigger>Advanced options</DisclosureTrigger>
+ *   <DisclosurePanel>Rarely-needed settings live here.</DisclosurePanel>
+ * </Disclosure>
+ * ```
+ */
+declare const Disclosure: {
+  ({
+    evaluation,
+    children,
+    ...props
+  }: DisclosureProps$1): import("react/jsx-runtime").JSX.Element;
+  displayName: "Disclosure";
+};
+/**
+ * Props for the DisclosureTrigger component.
+ *
+ * Extends the React Aria `Button` API (minus `style`/`className`/`slot`) so
+ * behavior props — `isDisabled`, `onPress`, `id`, `aria-*` — flow through.
+ */
+interface DisclosureTriggerProps extends Omit<ButtonProps, 'style' | 'className' | 'children' | 'slot'> {
+  /**
+   * HTML heading level of the wrapping heading element. Pick the level that
+   * fits the host page's document outline.
+   * @default 3
+   */
+  headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
+  /** Visible label content of the trigger row. */
+  children?: React.ReactNode;
+}
+/**
+ * The clickable header of a `Disclosure`. Renders inside a heading element
+ * (level via `headingLevel`, default `<h3>`) and exposes `aria-expanded` plus
+ * a chevron that rotates when the section is open. Must be used inside a
+ * `Disclosure`.
+ */
+declare const DisclosureTrigger: {
+  ({
+    headingLevel,
+    children,
+    ...props
+  }: DisclosureTriggerProps): import("react/jsx-runtime").JSX.Element;
+  displayName: "DisclosureTrigger";
+};
+/** Props for the DisclosurePanel component. */
+type DisclosurePanelProps$1 = Omit<DisclosurePanelProps, 'style' | 'className'>;
+/**
+ * The collapsible content region of a `Disclosure`. React Aria handles
+ * show/hide via the parent Disclosure state; the chrome uses
+ * `vars.motion.transition.{enter,exit}` semantics. Must be used inside a
+ * `Disclosure`.
+ *
+ * @example
+ * ```tsx
+ * <DisclosurePanel>Rarely-needed settings live here.</DisclosurePanel>
+ * ```
+ */
+declare const DisclosurePanel: {
+  ({
+    children,
+    ...props
+  }: DisclosurePanelProps$1): import("react/jsx-runtime").JSX.Element;
+  displayName: "DisclosurePanel";
+};
+//#endregion
+export { Disclosure, DisclosurePanel, DisclosurePanelProps$1 as DisclosurePanelProps, DisclosureProps$1 as DisclosureProps, DisclosureTrigger, DisclosureTriggerProps, disclosureMeta, disclosurePanelMeta, disclosureTriggerMeta };

package/dist/composites/Disclosure/Disclosure.d.mts

@@ -0,0 +1,118 @@
+
+import { EvaluationsFor } from "../../semantics/taxonomy.mjs";
+import { ButtonProps, DisclosurePanelProps, DisclosureProps } from "react-aria-components";
+import * as React from "react";
+
+//#region src/composites/Disclosure/Disclosure.d.ts
+type DisclosureEvaluation = EvaluationsFor<'Disclosure'>;
+/** Formal semantic identity — Disclosure root (Disclosure entity, single section). */
+declare const disclosureMeta: {
+  readonly displayName: "Disclosure";
+  readonly entity: "Disclosure";
+  readonly structure: "root";
+};
+/** Formal semantic identity — DisclosureTrigger (header button). */
+declare const disclosureTriggerMeta: {
+  readonly displayName: "DisclosureTrigger";
+  readonly entity: "Disclosure";
+  readonly structure: "trigger";
+};
+/** Formal semantic identity — DisclosurePanel (collapsible content region). */
+declare const disclosurePanelMeta: {
+  readonly displayName: "DisclosurePanel";
+  readonly entity: "Disclosure";
+  readonly structure: "content";
+};
+/**
+ * Props for the Disclosure component.
+ *
+ * The composite owns its layout; pass `style`/`className` on a wrapping
+ * element rather than on the composite root. See CONTRIBUTING §4.
+ */
+interface DisclosureProps$1 extends Omit<DisclosureProps, 'style' | 'children' | 'className'> {
+  /**
+   * Authorial emphasis. `primary` is the standard disclosure chrome; `muted`
+   * is a subdued variant for sidebars and dense lists.
+   * @default 'primary'
+   */
+  evaluation?: DisclosureEvaluation;
+  /** `DisclosureTrigger` then `DisclosurePanel`, in that order. */
+  children?: React.ReactNode;
+}
+/**
+ * A single collapsible section built on React Aria's `Disclosure`.
+ *
+ * The standalone counterpart of `Accordion` (a `DisclosureGroup`): use
+ * `Disclosure` when there is exactly one expandable region with no sibling
+ * coordination (a "show more" block, an optional settings section). Entity =
+ * Disclosure → reads `vars.colors.navigation.{primary|muted}` and animates
+ * with `vars.motion.transition.{enter,exit}`.
+ *
+ * @example
+ * ```tsx
+ * <Disclosure>
+ *   <DisclosureTrigger>Advanced options</DisclosureTrigger>
+ *   <DisclosurePanel>Rarely-needed settings live here.</DisclosurePanel>
+ * </Disclosure>
+ * ```
+ */
+declare const Disclosure$1: {
+  ({
+    evaluation,
+    children,
+    ...props
+  }: DisclosureProps$1): import("react/jsx-runtime").JSX.Element;
+  displayName: "Disclosure";
+};
+/**
+ * Props for the DisclosureTrigger component.
+ *
+ * Extends the React Aria `Button` API (minus `style`/`className`/`slot`) so
+ * behavior props — `isDisabled`, `onPress`, `id`, `aria-*` — flow through.
+ */
+interface DisclosureTriggerProps extends Omit<ButtonProps, 'style' | 'className' | 'children' | 'slot'> {
+  /**
+   * HTML heading level of the wrapping heading element. Pick the level that
+   * fits the host page's document outline.
+   * @default 3
+   */
+  headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
+  /** Visible label content of the trigger row. */
+  children?: React.ReactNode;
+}
+/**
+ * The clickable header of a `Disclosure`. Renders inside a heading element
+ * (level via `headingLevel`, default `<h3>`) and exposes `aria-expanded` plus
+ * a chevron that rotates when the section is open. Must be used inside a
+ * `Disclosure`.
+ */
+declare const DisclosureTrigger: {
+  ({
+    headingLevel,
+    children,
+    ...props
+  }: DisclosureTriggerProps): import("react/jsx-runtime").JSX.Element;
+  displayName: "DisclosureTrigger";
+};
+/** Props for the DisclosurePanel component. */
+type DisclosurePanelProps$1 = Omit<DisclosurePanelProps, 'style' | 'className'>;
+/**
+ * The collapsible content region of a `Disclosure`. React Aria handles
+ * show/hide via the parent Disclosure state; the chrome uses
+ * `vars.motion.transition.{enter,exit}` semantics. Must be used inside a
+ * `Disclosure`.
+ *
+ * @example
+ * ```tsx
+ * <DisclosurePanel>Rarely-needed settings live here.</DisclosurePanel>
+ * ```
+ */
+declare const DisclosurePanel$1: {
+  ({
+    children,
+    ...props
+  }: DisclosurePanelProps$1): import("react/jsx-runtime").JSX.Element;
+  displayName: "DisclosurePanel";
+};
+//#endregion
+export { Disclosure$1 as Disclosure, DisclosurePanel$1 as DisclosurePanel, DisclosurePanelProps$1 as DisclosurePanelProps, DisclosureProps$1 as DisclosureProps, DisclosureTrigger, DisclosureTriggerProps, disclosureMeta, disclosurePanelMeta, disclosureTriggerMeta };

package/dist/composites/Disclosure/Disclosure.mjs

@@ -0,0 +1,207 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+import { focusRingOutline } from "../../tokens/focusRing.mjs";
+import { resolveInteractiveStyle } from "../../tokens/resolveInteractiveStyle.mjs";
+import { Icon } from "../../components/Icon/Icon.mjs";
+import { createCompositeScope } from "../scope.mjs";
+import { vars } from "@ttoss/fsl-theme/vars";
+import { Button, Disclosure, DisclosurePanel, DisclosureStateContext, Heading } from "react-aria-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+
+//#region src/composites/Disclosure/Disclosure.tsx
+var disclosureScope = createCompositeScope("Disclosure");
+/** Formal semantic identity — Disclosure root (Disclosure entity, single section). */
+var disclosureMeta = {
+  displayName: "Disclosure",
+  entity: "Disclosure",
+  structure: "root"
+};
+/** Formal semantic identity — DisclosureTrigger (header button). */
+var disclosureTriggerMeta = {
+  displayName: "DisclosureTrigger",
+  entity: "Disclosure",
+  structure: "trigger"
+};
+/** Formal semantic identity — DisclosurePanel (collapsible content region). */
+var disclosurePanelMeta = {
+  displayName: "DisclosurePanel",
+  entity: "Disclosure",
+  structure: "content"
+};
+/**
+* A single collapsible section built on React Aria's `Disclosure`.
+*
+* The standalone counterpart of `Accordion` (a `DisclosureGroup`): use
+* `Disclosure` when there is exactly one expandable region with no sibling
+* coordination (a "show more" block, an optional settings section). Entity =
+* Disclosure → reads `vars.colors.navigation.{primary|muted}` and animates
+* with `vars.motion.transition.{enter,exit}`.
+*
+* @example
+* ```tsx
+* <Disclosure>
+*   <DisclosureTrigger>Advanced options</DisclosureTrigger>
+*   <DisclosurePanel>Rarely-needed settings live here.</DisclosurePanel>
+* </Disclosure>
+* ```
+*/
+var Disclosure$1 = ({
+  evaluation = "primary",
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */jsx(disclosureScope.Provider, {
+    value: {
+      evaluation
+    },
+    children: /* @__PURE__ */jsx(Disclosure, {
+      ...props,
+      "data-scope": "disclosure",
+      "data-part": "root",
+      "data-evaluation": evaluation,
+      style: {
+        boxSizing: "border-box",
+        display: "flex",
+        flexDirection: "column",
+        borderWidth: vars.border.outline.control.width,
+        borderStyle: vars.border.outline.control.style,
+        borderColor: vars.colors.navigation[evaluation]?.border?.default ?? "transparent",
+        borderRadius: vars.radii.surface,
+        overflow: "hidden"
+      },
+      children
+    })
+  });
+};
+Disclosure$1.displayName = disclosureMeta.displayName;
+/**
+* The clickable header of a `Disclosure`. Renders inside a heading element
+* (level via `headingLevel`, default `<h3>`) and exposes `aria-expanded` plus
+* a chevron that rotates when the section is open. Must be used inside a
+* `Disclosure`.
+*/
+var DisclosureTrigger = ({
+  headingLevel = 3,
+  children,
+  ...props
+}) => {
+  const {
+    evaluation
+  } = disclosureScope.use(disclosureTriggerMeta.displayName);
+  const c = vars.colors.navigation[evaluation];
+  const isExpanded = React.useContext(DisclosureStateContext)?.isExpanded ?? false;
+  return /* @__PURE__ */jsx(Heading, {
+    level: headingLevel,
+    "data-scope": "disclosure",
+    "data-part": "header",
+    style: {
+      margin: 0
+    },
+    children: /* @__PURE__ */jsxs(Button, {
+      ...props,
+      slot: "trigger",
+      "data-scope": "disclosure",
+      "data-part": "trigger",
+      style: ({
+        isHovered,
+        isPressed,
+        isDisabled,
+        isFocusVisible
+      }) => {
+        const flags = {
+          isHovered,
+          isPressed,
+          isDisabled,
+          isFocusVisible,
+          isExpanded
+        };
+        return {
+          boxSizing: "border-box",
+          width: "100%",
+          display: "inline-flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          gap: vars.spacing.gap.inline.sm,
+          minHeight: vars.sizing.hit.base,
+          paddingBlock: vars.spacing.inset.control.md,
+          paddingInline: vars.spacing.inset.control.md,
+          border: "none",
+          background: "none",
+          backgroundColor: resolveInteractiveStyle(c?.background, flags),
+          color: resolveInteractiveStyle(c?.text, flags) ?? c?.text?.default,
+          cursor: isDisabled ? "not-allowed" : "pointer",
+          opacity: isDisabled ? vars.opacity.disabled : void 0,
+          ...vars.text.label.md,
+          textAlign: "start",
+          transitionProperty: "background-color, color",
+          transitionDuration: vars.motion.transition.enter.duration,
+          transitionTimingFunction: vars.motion.transition.enter.easing,
+          outline: focusRingOutline(isFocusVisible),
+          outlineOffset: "-2px"
+        };
+      },
+      children: [/* @__PURE__ */jsx("span", {
+        "data-scope": "disclosure",
+        "data-part": "label",
+        style: {
+          flex: 1
+        },
+        children
+      }), /* @__PURE__ */jsx("span", {
+        "data-scope": "disclosure",
+        "data-part": "indicator",
+        "aria-hidden": true,
+        style: {
+          flexShrink: 0,
+          display: "inline-block",
+          transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)",
+          transitionProperty: "transform",
+          transitionDuration: isExpanded ? vars.motion.transition.enter.duration : vars.motion.transition.exit.duration,
+          transitionTimingFunction: isExpanded ? vars.motion.transition.enter.easing : vars.motion.transition.exit.easing
+        },
+        children: /* @__PURE__ */jsx(Icon, {
+          intent: "disclosure.collapse"
+        })
+      })]
+    })
+  });
+};
+DisclosureTrigger.displayName = disclosureTriggerMeta.displayName;
+/**
+* The collapsible content region of a `Disclosure`. React Aria handles
+* show/hide via the parent Disclosure state; the chrome uses
+* `vars.motion.transition.{enter,exit}` semantics. Must be used inside a
+* `Disclosure`.
+*
+* @example
+* ```tsx
+* <DisclosurePanel>Rarely-needed settings live here.</DisclosurePanel>
+* ```
+*/
+var DisclosurePanel$1 = ({
+  children,
+  ...props
+}) => {
+  const {
+    evaluation
+  } = disclosureScope.use(disclosurePanelMeta.displayName);
+  const c = vars.colors.navigation[evaluation];
+  return /* @__PURE__ */jsx(DisclosurePanel, {
+    ...props,
+    "data-scope": "disclosure",
+    "data-part": "content",
+    style: {
+      boxSizing: "border-box",
+      paddingBlock: vars.spacing.inset.control.md,
+      paddingInline: vars.spacing.inset.control.md,
+      backgroundColor: c?.background?.default,
+      color: c?.text?.default,
+      ...vars.text.body.md
+    },
+    children
+  });
+};
+DisclosurePanel$1.displayName = disclosurePanelMeta.displayName;
+
+//#endregion
+export { Disclosure$1 as Disclosure, DisclosurePanel$1 as DisclosurePanel, DisclosureTrigger, disclosureMeta, disclosurePanelMeta, disclosureTriggerMeta };