@stealthscale/component-disclosure 0.2.3 → 0.2.4

package/dist/pages/hover-card/hover-card.js

@@ -0,0 +1,552 @@
+import { t as __exportAll } from "../../rolldown-runtime-D7D4PA-g.js";
+import { d as recipe } from "../../recipes-95yCB2V3.js";
+import { Ct as Root, Dt as ArrowTip, Et as Arrow, St as Trigger, Tt as Content, wt as Positioner } from "../../shared-Cfsikh3X.js";
+import { c } from "react/compiler-runtime";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Portal } from "@stealthscale/component-primitives";
+import { Matrix, Sample, scenesOf, specimen, useWords } from "@stealthscale/specimen";
+import { CircleDotIcon, ClockIcon } from "lucide-react";
+import { Stack } from "@stealthscale/component-layout";
+import { Icon, Span, Strong } from "@stealthscale/component-typography";
+import { Avatar } from "@stealthscale/component-media";
+import { DataList } from "@stealthscale/component-collections";
+import { Badge } from "@stealthscale/component-data";
+//#region src/hover-card/examples/issue.example.tsx
+var issue_example_exports = /* @__PURE__ */ __exportAll({
+	Issue: () => Issue,
+	source: () => source$2
+});
+function Issue() {
+	const $ = c(37);
+	const { t } = useWords("hover-card");
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = { placement: "bottom-start" };
+		$[0] = t0;
+	} else t0 = $[0];
+	let t1;
+	if ($[1] !== t) {
+		t1 = t("issue.reference");
+		$[1] = t;
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Trigger, {
+			href: "#issue-1204",
+			children: t1
+		});
+		$[3] = t1;
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] !== t) {
+		t3 = t("issue.repository");
+		$[5] = t;
+		$[6] = t3;
+	} else t3 = $[6];
+	let t4;
+	if ($[7] !== t3) {
+		t4 = /* @__PURE__ */ jsx(Span, {
+			tone: "muted",
+			children: t3
+		});
+		$[7] = t3;
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__PURE__ */ jsx(Icon, {
+			as: CircleDotIcon,
+			tone: "success"
+		});
+		$[9] = t5;
+	} else t5 = $[9];
+	let t6;
+	if ($[10] !== t) {
+		t6 = t("issue.heading");
+		$[10] = t;
+		$[11] = t6;
+	} else t6 = $[11];
+	let t7;
+	if ($[12] !== t6) {
+		t7 = /* @__PURE__ */ jsxs(Strong, { children: [
+			t5,
+			" ",
+			t6
+		] });
+		$[12] = t6;
+		$[13] = t7;
+	} else t7 = $[13];
+	let t8;
+	if ($[14] !== t) {
+		t8 = t("issue.summary");
+		$[14] = t;
+		$[15] = t8;
+	} else t8 = $[15];
+	let t9;
+	if ($[16] !== t8) {
+		t9 = /* @__PURE__ */ jsx(Span, {
+			as: "p",
+			children: t8
+		});
+		$[16] = t8;
+		$[17] = t9;
+	} else t9 = $[17];
+	let t10;
+	if ($[18] !== t) {
+		t10 = t("issue.state");
+		$[18] = t;
+		$[19] = t10;
+	} else t10 = $[19];
+	let t11;
+	if ($[20] !== t10) {
+		t11 = /* @__PURE__ */ jsx(Badge, {
+			palette: "success",
+			children: t10
+		});
+		$[20] = t10;
+		$[21] = t11;
+	} else t11 = $[21];
+	let t12;
+	if ($[22] !== t) {
+		t12 = t("issue.opened");
+		$[22] = t;
+		$[23] = t12;
+	} else t12 = $[23];
+	let t13;
+	if ($[24] !== t12) {
+		t13 = /* @__PURE__ */ jsx(Span, {
+			tone: "muted",
+			children: t12
+		});
+		$[24] = t12;
+		$[25] = t13;
+	} else t13 = $[25];
+	let t14;
+	if ($[26] !== t11 || $[27] !== t13) {
+		t14 = /* @__PURE__ */ jsxs(Stack, {
+			direction: "row",
+			gap: "sm",
+			children: [t11, t13]
+		});
+		$[26] = t11;
+		$[27] = t13;
+		$[28] = t14;
+	} else t14 = $[28];
+	let t15;
+	if ($[29] !== t14 || $[30] !== t4 || $[31] !== t7 || $[32] !== t9) {
+		t15 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsxs(Stack, {
+			gap: "sm",
+			children: [
+				t4,
+				t7,
+				t9,
+				t14
+			]
+		}) }) }) });
+		$[29] = t14;
+		$[30] = t4;
+		$[31] = t7;
+		$[32] = t9;
+		$[33] = t15;
+	} else t15 = $[33];
+	let t16;
+	if ($[34] !== t15 || $[35] !== t2) {
+		t16 = /* @__PURE__ */ jsxs(Root, {
+			positioning: t0,
+			children: [t2, t15]
+		});
+		$[34] = t15;
+		$[35] = t2;
+		$[36] = t16;
+	} else t16 = $[36];
+	return t16;
+}
+const source$2 = "import { type ReactElement } from \"react\";\n\nimport { CircleDotIcon } from \"lucide-react\";\n\nimport { Badge } from \"@stealthscale/component-data\";\nimport { Stack } from \"@stealthscale/component-layout\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { Icon, Span, Strong } from \"@stealthscale/component-typography\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { HoverCard } from \"@stealthscale/component-disclosure\";\n\nexport function Issue(): ReactElement {\n  const { t } = useWords(\"hover-card\");\n\n  return (\n    <HoverCard.Root positioning={{ placement: \"bottom-start\" }}>\n      <HoverCard.Trigger href=\"#issue-1204\">{t(\"issue.reference\")}</HoverCard.Trigger>\n      <Portal>\n        <HoverCard.Positioner>\n          <HoverCard.Content>\n            <Stack gap=\"sm\">\n              <Span tone=\"muted\">{t(\"issue.repository\")}</Span>\n              <Strong>\n                <Icon as={CircleDotIcon} tone=\"success\" /> {t(\"issue.heading\")}\n              </Strong>\n              <Span as=\"p\">{t(\"issue.summary\")}</Span>\n              <Stack direction=\"row\" gap=\"sm\">\n                <Badge palette=\"success\">{t(\"issue.state\")}</Badge>\n                <Span tone=\"muted\">{t(\"issue.opened\")}</Span>\n              </Stack>\n            </Stack>\n          </HoverCard.Content>\n        </HoverCard.Positioner>\n      </Portal>\n    </HoverCard.Root>\n  );\n}\n";
+//#endregion
+//#region src/hover-card/examples/profile.example.tsx
+var profile_example_exports = /* @__PURE__ */ __exportAll({
+	Profile: () => Profile,
+	source: () => source$1
+});
+function Profile(props) {
+	const $ = c(41);
+	const { t } = useWords("hover-card");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("profile.handle");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] !== t0) {
+		t1 = /* @__PURE__ */ jsx(Trigger, {
+			href: "#people-ada",
+			children: t0
+		});
+		$[2] = t0;
+		$[3] = t1;
+	} else t1 = $[3];
+	let t2;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(Arrow, { children: /* @__PURE__ */ jsx(ArrowTip, {}) });
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] !== t) {
+		t3 = t("profile.name");
+		$[5] = t;
+		$[6] = t3;
+	} else t3 = $[6];
+	let t4;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(Avatar.Fallback, {});
+		$[7] = t4;
+	} else t4 = $[7];
+	let t5;
+	if ($[8] !== t3) {
+		t5 = /* @__PURE__ */ jsx(Avatar.Root, {
+			"aria-hidden": true,
+			name: t3,
+			children: t4
+		});
+		$[8] = t3;
+		$[9] = t5;
+	} else t5 = $[9];
+	let t6;
+	if ($[10] !== t) {
+		t6 = t("profile.name");
+		$[10] = t;
+		$[11] = t6;
+	} else t6 = $[11];
+	let t7;
+	if ($[12] !== t6) {
+		t7 = /* @__PURE__ */ jsx(Strong, { children: t6 });
+		$[12] = t6;
+		$[13] = t7;
+	} else t7 = $[13];
+	let t8;
+	if ($[14] !== t) {
+		t8 = t("profile.role");
+		$[14] = t;
+		$[15] = t8;
+	} else t8 = $[15];
+	let t9;
+	if ($[16] !== t8) {
+		t9 = /* @__PURE__ */ jsx(Span, {
+			tone: "muted",
+			children: t8
+		});
+		$[16] = t8;
+		$[17] = t9;
+	} else t9 = $[17];
+	let t10;
+	if ($[18] !== t7 || $[19] !== t9) {
+		t10 = /* @__PURE__ */ jsxs(Stack, {
+			gap: "xs",
+			children: [t7, t9]
+		});
+		$[18] = t7;
+		$[19] = t9;
+		$[20] = t10;
+	} else t10 = $[20];
+	let t11;
+	if ($[21] !== t10 || $[22] !== t5) {
+		t11 = /* @__PURE__ */ jsxs(Stack, {
+			direction: "row",
+			gap: "sm",
+			children: [t5, t10]
+		});
+		$[21] = t10;
+		$[22] = t5;
+		$[23] = t11;
+	} else t11 = $[23];
+	let t12;
+	if ($[24] !== t) {
+		t12 = t("profile.bio");
+		$[24] = t;
+		$[25] = t12;
+	} else t12 = $[25];
+	let t13;
+	if ($[26] !== t12) {
+		t13 = /* @__PURE__ */ jsx(Span, {
+			as: "p",
+			children: t12
+		});
+		$[26] = t12;
+		$[27] = t13;
+	} else t13 = $[27];
+	let t14;
+	if ($[28] === Symbol.for("react.memo_cache_sentinel")) {
+		t14 = /* @__PURE__ */ jsx(Icon, { as: ClockIcon });
+		$[28] = t14;
+	} else t14 = $[28];
+	let t15;
+	if ($[29] !== t) {
+		t15 = t("profile.time");
+		$[29] = t;
+		$[30] = t15;
+	} else t15 = $[30];
+	let t16;
+	if ($[31] !== t15) {
+		t16 = /* @__PURE__ */ jsxs(Span, {
+			tone: "muted",
+			children: [
+				t14,
+				" ",
+				t15
+			]
+		});
+		$[31] = t15;
+		$[32] = t16;
+	} else t16 = $[32];
+	let t17;
+	if ($[33] !== t11 || $[34] !== t13 || $[35] !== t16) {
+		t17 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, { children: [t2, /* @__PURE__ */ jsxs(Stack, {
+			gap: "sm",
+			children: [
+				t11,
+				t13,
+				t16
+			]
+		})] }) }) });
+		$[33] = t11;
+		$[34] = t13;
+		$[35] = t16;
+		$[36] = t17;
+	} else t17 = $[36];
+	let t18;
+	if ($[37] !== props || $[38] !== t1 || $[39] !== t17) {
+		t18 = /* @__PURE__ */ jsxs(Root, {
+			...props,
+			children: [t1, t17]
+		});
+		$[37] = props;
+		$[38] = t1;
+		$[39] = t17;
+		$[40] = t18;
+	} else t18 = $[40];
+	return t18;
+}
+const source$1 = "import { type ReactElement } from \"react\";\n\nimport { ClockIcon } from \"lucide-react\";\n\nimport { Stack } from \"@stealthscale/component-layout\";\nimport { Avatar } from \"@stealthscale/component-media\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { Icon, Span, Strong } from \"@stealthscale/component-typography\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { HoverCard } from \"@stealthscale/component-disclosure\";\n\nexport function Profile(props: HoverCard.RootProps): ReactElement {\n  const { t } = useWords(\"hover-card\");\n\n  return (\n    <HoverCard.Root {...props}>\n      <HoverCard.Trigger href=\"#people-ada\">{t(\"profile.handle\")}</HoverCard.Trigger>\n      <Portal>\n        <HoverCard.Positioner>\n          <HoverCard.Content>\n            <HoverCard.Arrow>\n              <HoverCard.ArrowTip />\n            </HoverCard.Arrow>\n            <Stack gap=\"sm\">\n              <Stack direction=\"row\" gap=\"sm\">\n                <Avatar.Root aria-hidden name={t(\"profile.name\")}>\n                  <Avatar.Fallback />\n                </Avatar.Root>\n                <Stack gap=\"xs\">\n                  <Strong>{t(\"profile.name\")}</Strong>\n                  <Span tone=\"muted\">{t(\"profile.role\")}</Span>\n                </Stack>\n              </Stack>\n              <Span as=\"p\">{t(\"profile.bio\")}</Span>\n              <Span tone=\"muted\">\n                <Icon as={ClockIcon} /> {t(\"profile.time\")}\n              </Span>\n            </Stack>\n          </HoverCard.Content>\n        </HoverCard.Positioner>\n      </Portal>\n    </HoverCard.Root>\n  );\n}\n";
+//#endregion
+//#region src/hover-card/examples/reviewers.example.tsx
+var reviewers_example_exports = /* @__PURE__ */ __exportAll({
+	Reviewers: () => Reviewers,
+	source: () => source
+});
+const REVIEWS = [
+	["ada", "success"],
+	["grace", "warning"],
+	["alan", "neutral"]
+];
+function Reviewers() {
+	const $ = c(15);
+	const { t } = useWords("hover-card");
+	const [person, setPerson] = useState(null);
+	let t0;
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = (t2) => {
+			const { value } = t2;
+			setPerson(REVIEWS.find((t3) => {
+				const [id] = t3;
+				return id === value;
+			})?.[0] ?? null);
+		};
+		t1 = {
+			flip: ["bottom-start"],
+			placement: "right"
+		};
+		$[0] = t0;
+		$[1] = t1;
+	} else {
+		t0 = $[0];
+		t1 = $[1];
+	}
+	let t2;
+	if ($[2] !== t) {
+		t2 = REVIEWS.map((t3) => {
+			const [id_0, palette] = t3;
+			return /* @__PURE__ */ jsxs(DataList.Item, { children: [/* @__PURE__ */ jsx(DataList.ItemLabel, { children: /* @__PURE__ */ jsx(Trigger, {
+				href: `#people-${id_0}`,
+				value: id_0,
+				children: t(`people.${id_0}.name`)
+			}) }), /* @__PURE__ */ jsx(DataList.ItemValue, { children: /* @__PURE__ */ jsx(Badge, {
+				palette,
+				children: t(`people.${id_0}.verdict`)
+			}) })] }, id_0);
+		});
+		$[2] = t;
+		$[3] = t2;
+	} else t2 = $[3];
+	let t3;
+	if ($[4] !== t2) {
+		t3 = /* @__PURE__ */ jsx(DataList.Root, {
+			orientation: "horizontal",
+			children: t2
+		});
+		$[4] = t2;
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(Arrow, { children: /* @__PURE__ */ jsx(ArrowTip, {}) });
+		$[6] = t4;
+	} else t4 = $[6];
+	let t5;
+	if ($[7] !== person || $[8] !== t) {
+		t5 = person === null ? null : /* @__PURE__ */ jsxs(Stack, {
+			direction: "row",
+			gap: "sm",
+			children: [/* @__PURE__ */ jsx(Avatar.Root, {
+				"aria-hidden": true,
+				name: t(`people.${person}.name`),
+				children: /* @__PURE__ */ jsx(Avatar.Fallback, {})
+			}), /* @__PURE__ */ jsxs(Stack, {
+				gap: "xs",
+				children: [/* @__PURE__ */ jsx(Strong, { children: t(`people.${person}.name`) }), /* @__PURE__ */ jsx(Span, {
+					tone: "muted",
+					children: t(`people.${person}.role`)
+				})]
+			})]
+		});
+		$[7] = person;
+		$[8] = t;
+		$[9] = t5;
+	} else t5 = $[9];
+	let t6;
+	if ($[10] !== t5) {
+		t6 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, { children: [t4, t5] }) }) });
+		$[10] = t5;
+		$[11] = t6;
+	} else t6 = $[11];
+	let t7;
+	if ($[12] !== t3 || $[13] !== t6) {
+		t7 = /* @__PURE__ */ jsxs(Root, {
+			as: "div",
+			onTriggerValueChange: t0,
+			positioning: t1,
+			children: [t3, t6]
+		});
+		$[12] = t3;
+		$[13] = t6;
+		$[14] = t7;
+	} else t7 = $[14];
+	return t7;
+}
+const source = "import { type ReactElement, useState } from \"react\";\n\nimport { DataList } from \"@stealthscale/component-collections\";\nimport { Badge } from \"@stealthscale/component-data\";\nimport { Stack } from \"@stealthscale/component-layout\";\nimport { Avatar } from \"@stealthscale/component-media\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { Span, Strong } from \"@stealthscale/component-typography\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { HoverCard } from \"@stealthscale/component-disclosure\";\n\nconst REVIEWS = [\n  [\"ada\", \"success\"],\n  [\"grace\", \"warning\"],\n  [\"alan\", \"neutral\"],\n] as const;\n\ntype Person = (typeof REVIEWS)[number][0];\n\nexport function Reviewers(): ReactElement {\n  const { t } = useWords(\"hover-card\");\n  const [person, setPerson] = useState<null | Person>(null);\n\n  return (\n    <HoverCard.Root\n      as=\"div\"\n      onTriggerValueChange={({ value }) => {\n        setPerson(REVIEWS.find(([id]) => id === value)?.[0] ?? null);\n      }}\n      positioning={{ flip: [\"bottom-start\"], placement: \"right\" }}\n    >\n      <DataList.Root orientation=\"horizontal\">\n        {REVIEWS.map(([id, palette]) => (\n          <DataList.Item key={id}>\n            <DataList.ItemLabel>\n              <HoverCard.Trigger href={`#people-${id}`} value={id}>\n                {t(`people.${id}.name`)}\n              </HoverCard.Trigger>\n            </DataList.ItemLabel>\n            <DataList.ItemValue>\n              <Badge palette={palette}>{t(`people.${id}.verdict`)}</Badge>\n            </DataList.ItemValue>\n          </DataList.Item>\n        ))}\n      </DataList.Root>\n      <Portal>\n        <HoverCard.Positioner>\n          <HoverCard.Content>\n            <HoverCard.Arrow>\n              <HoverCard.ArrowTip />\n            </HoverCard.Arrow>\n            {person === null ? null : (\n              <Stack direction=\"row\" gap=\"sm\">\n                <Avatar.Root aria-hidden name={t(`people.${person}.name`)}>\n                  <Avatar.Fallback />\n                </Avatar.Root>\n                <Stack gap=\"xs\">\n                  <Strong>{t(`people.${person}.name`)}</Strong>\n                  <Span tone=\"muted\">{t(`people.${person}.role`)}</Span>\n                </Stack>\n              </Stack>\n            )}\n          </HoverCard.Content>\n        </HoverCard.Positioner>\n      </Portal>\n    </HoverCard.Root>\n  );\n}\n";
+//#endregion
+//#region src/hover-card/hover-card.specimen.tsx
+/**
+* Catalogue page for the hover card.
+*
+* @remarks
+*   `scenesOf` generates the looks by sizes from the profile example. The placement, delay and
+*   disabled scenes are hand-written, because each sets a machine option and not an axis. The issue
+*   and reviewers scenes show a card of another kind and one card that several links share. Every
+*   card renders closed and portals its panel to the document body, so an opened card renders over
+*   the page and a scene is as tall as its links. A single link renders in a `Sample`, which keeps
+*   its pointer area at the width of its words. The words are keys under `hover-card` in
+*   `locales/en/specimen/hover-card.json`.
+*/
+/**
+* Sides of the placement scene.
+*/
+const SIDES = [
+	"top",
+	"right",
+	"bottom",
+	"left"
+];
+/**
+* Open delays of the delay scene, in milliseconds.
+*/
+const DELAYS = [
+	0,
+	300,
+	600
+];
+/**
+* Hand-written scene for the four placements.
+*/
+const placement = {
+	about: "hover-card.placement.about",
+	draw: () => /* @__PURE__ */ jsx(Matrix, {
+		knob: "placement",
+		of: SIDES,
+		children: (side) => /* @__PURE__ */ jsx(Profile, { positioning: { placement: side } })
+	}),
+	example: profile_example_exports,
+	props: { positioning: { placement: "top" } },
+	title: "hover-card.placement.title"
+};
+/**
+* Hand-written scene for the time a pointer rests on the link before the card opens.
+*/
+const delays = {
+	about: "hover-card.delays.about",
+	draw: () => /* @__PURE__ */ jsx(Matrix, {
+		knob: "openDelay",
+		of: DELAYS,
+		children: (delay) => /* @__PURE__ */ jsx(Profile, { openDelay: delay })
+	}),
+	example: profile_example_exports,
+	props: { openDelay: 0 },
+	title: "hover-card.delays.title"
+};
+/**
+* Hand-written scene for a link whose card is turned off.
+*/
+const disabled = {
+	about: "hover-card.disabled.about",
+	draw: () => /* @__PURE__ */ jsx(Matrix, {
+		knob: "disabled",
+		of: [true, false],
+		children: (off) => /* @__PURE__ */ jsx(Profile, { disabled: off })
+	}),
+	example: profile_example_exports,
+	props: { disabled: true },
+	title: "hover-card.disabled.title"
+};
+/**
+* Hand-written scene for a card that previews an issue.
+*/
+const issue = {
+	about: "hover-card.issue.about",
+	draw: () => /* @__PURE__ */ jsx(Sample, { children: /* @__PURE__ */ jsx(Issue, {}) }),
+	example: issue_example_exports,
+	title: "hover-card.issue.title"
+};
+/**
+* Hand-written scene for one card that three links share.
+*/
+const reviewers = {
+	about: "hover-card.reviewers.about",
+	draw: Reviewers,
+	example: reviewers_example_exports,
+	title: "hover-card.reviewers.title"
+};
+var hover_card_specimen_default = specimen({
+	about: "hover-card.about",
+	id: "components/disclosure/hover-card",
+	imports: "import { HoverCard } from \"@stealthscale/component-disclosure\";",
+	scenes: [
+		...scenesOf(recipe, {
+			axes: { variant: { across: "size" } },
+			draw: (props) => /* @__PURE__ */ jsx(Profile, { ...props }),
+			example: profile_example_exports,
+			namespace: "hover-card"
+		}),
+		placement,
+		delays,
+		disabled,
+		issue,
+		reviewers
+	],
+	title: "hover-card.title"
+});
+//#endregion
+export { hover_card_specimen_default as default, delays, disabled, issue, placement, reviewers };

package/dist/pages/hover-card/hover-card.props.js

@@ -0,0 +1,3 @@
+export const dropped = {"ArrowTipProps": {"conditions": 284, "foreign": 1041}, "ArrowProps": {"conditions": 284, "foreign": 1041}, "ContentProps": {"conditions": 284, "foreign": 1040}, "PositionerProps": {"conditions": 284, "foreign": 1041}, "RootProps": {"conditions": 284, "foreign": 1039}, "TriggerProps": {"conditions": 284, "foreign": 1049}};
+export const parts = {"ArrowTipProps": [], "ArrowProps": [], "ContentProps": [], "PositionerProps": [], "RootProps": [{"accepts": "number", "fallback": "300", "kind": "option", "name": "closeDelay", "refers": [], "required": false, "says": "The duration from when the mouse leaves the trigger or content until the hover card closes."}, {"accepts": "boolean", "fallback": "", "kind": "option", "name": "defaultOpen", "refers": [], "required": false, "says": "The initial open state of the hover card when rendered. Use when you don't need to control the open state of the hover card."}, {"accepts": "string | null", "fallback": "", "kind": "option", "name": "defaultTriggerValue", "refers": [], "required": false, "says": "The initial trigger value when rendered. Use when you don't need to control the trigger value."}, {"accepts": "\"ltr\" | \"rtl\"", "fallback": "\"ltr\"", "kind": "option", "name": "dir", "refers": [], "required": false, "says": "The document's text/writing direction."}, {"accepts": "boolean", "fallback": "", "kind": "option", "name": "disabled", "refers": [], "required": false, "says": "Whether the hover card is disabled"}, {"accepts": "(() => Document | Node | ShadowRoot)", "fallback": "", "kind": "option", "name": "getRootNode", "refers": [], "required": false, "says": "A root node to correctly resolve document in custom environments. E.x.: Iframes, Electron."}, {"accepts": "string", "fallback": "", "kind": "option", "name": "id", "refers": [], "required": false, "says": "The unique identifier of the machine."}, {"accepts": "ElementIds", "fallback": "", "kind": "option", "name": "ids", "refers": ["hover-card.ElementIds"], "required": false, "says": "The ids of the elements in the popover. Useful for composition."}, {"accepts": "boolean", "fallback": "true", "kind": "option", "name": "lazyMount", "refers": [], "required": false, "says": "When true, the overlay renders no content until it first opens."}, {"accepts": "(() => void)", "fallback": "", "kind": "option", "name": "onExitComplete", "refers": [], "required": false, "says": "Runs once the content's exit animation ends."}, {"accepts": "((event: FocusOutsideEvent) => void)", "fallback": "", "kind": "option", "name": "onFocusOutside", "refers": ["interact-outside.EventDetails", "interact-outside.FocusOutsideEvent"], "required": false, "says": "Function called when the focus is moved outside the component"}, {"accepts": "((event: InteractOutsideEvent) => void)", "fallback": "", "kind": "option", "name": "onInteractOutside", "refers": ["interact-outside.EventDetails", "interact-outside.FocusOutsideEvent", "interact-outside.InteractOutsideEvent", "interact-outside.PointerDownOutsideEvent"], "required": false, "says": "Function called when an interaction happens outside the component"}, {"accepts": "((details: OpenChangeDetails) => void)", "fallback": "", "kind": "option", "name": "onOpenChange", "refers": ["hover-card.OpenChangeDetails"], "required": false, "says": "Function called when the hover card opens or closes."}, {"accepts": "((event: PointerDownOutsideEvent) => void)", "fallback": "", "kind": "option", "name": "onPointerDownOutside", "refers": ["interact-outside.EventDetails", "interact-outside.PointerDownOutsideEvent"], "required": false, "says": "Function called when the pointer is pressed down outside the component"}, {"accepts": "((details: TriggerValueChangeDetails) => void)", "fallback": "", "kind": "option", "name": "onTriggerValueChange", "refers": ["hover-card.TriggerValueChangeDetails"], "required": false, "says": "Function called when the trigger value changes."}, {"accepts": "boolean", "fallback": "", "kind": "option", "name": "open", "refers": [], "required": false, "says": "The controlled open state of the hover card"}, {"accepts": "number", "fallback": "600", "kind": "option", "name": "openDelay", "refers": [], "required": false, "says": "The duration from when the mouse enters the trigger until the hover card opens."}, {"accepts": "PositioningOptions", "fallback": "", "kind": "option", "name": "positioning", "refers": ["core.ComputePositionReturn", "dom.AutoUpdateOptions", "dom.VirtualElement", "popper.PositioningOptions", "utils.Placement"], "required": false, "says": "The user provided options used to position the popover content"}, {"accepts": "\"lg\" | \"md\" | \"sm\" | \"xs\"", "fallback": "", "kind": "variant", "name": "size", "refers": [], "required": false, "says": "Padding of the panel on the inset scale and its text on the body role."}, {"accepts": "boolean", "fallback": "", "kind": "option", "name": "skipAnimationOnMount", "refers": [], "required": false, "says": "When true, content that is open on mount plays no entry animation."}, {"accepts": "string | null", "fallback": "", "kind": "option", "name": "triggerValue", "refers": [], "required": false, "says": "The controlled trigger value"}, {"accepts": "boolean", "fallback": "true", "kind": "option", "name": "unmountOnExit", "refers": [], "required": false, "says": "When true, the overlay removes its content once the exit animation ends."}, {"accepts": "\"elevated\" | \"glass\" | \"surface\"", "fallback": "", "kind": "variant", "name": "variant", "refers": [], "required": false, "says": "Surface of the panel: the popover surface inside a hairline edge, the panel surface with a large shadow, or the glass layer style."}], "TriggerProps": [{"accepts": "string", "fallback": "", "kind": "option", "name": "value", "refers": [], "required": false, "says": "The value the root reports as `triggerValue` while this trigger opened the card. Absent for a card with one trigger."}]};
+export const shapes = {"interact-outside.EventDetails": [{"accepts": "PointerEvent", "name": "originalEvent", "says": ""}, {"accepts": "boolean", "name": "contextmenu", "says": ""}, {"accepts": "boolean", "name": "focusable", "says": ""}, {"accepts": "EventTarget", "name": "target", "says": ""}], "interact-outside.PointerDownOutsideEvent": [{"accepts": "EventDetails<PointerEvent>", "name": "detail", "says": "The read-only **`detail`** property of the CustomEvent interface returns any data passed when initializing the event."}, {"accepts": "(type: string, bubbles?: boolean, cancelable?: boolean, detail?: EventDetails<PointerEvent>) => void", "name": "initCustomEvent", "says": "The **`CustomEvent.initCustomEvent()`** method initializes a CustomEvent object. If the event has already been dispatched, this method does nothing."}, {"accepts": "boolean", "name": "bubbles", "says": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not."}, {"accepts": "boolean", "name": "cancelBubble", "says": "The **`cancelBubble`** property of the Event interface is deprecated. Use Event.stopPropagation() instead. Setting its value to true before returning from an event handler prevents propagation of the event. In later implementations, setting this to false does nothing. See Browser compatibility for details."}, {"accepts": "boolean", "name": "cancelable", "says": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened."}, {"accepts": "boolean", "name": "composed", "says": "The read-only **`composed`** property of the Event interface returns a boolean value which indicates whether or not the event will propagate across the shadow DOM boundary into the standard DOM."}, {"accepts": "EventTarget | null", "name": "currentTarget", "says": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached."}, {"accepts": "boolean", "name": "defaultPrevented", "says": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event."}, {"accepts": "number", "name": "eventPhase", "says": "The **`eventPhase`** read-only property of the Event interface indicates which phase of the event flow is currently being evaluated."}, {"accepts": "boolean", "name": "isTrusted", "says": "The **`isTrusted`** read-only property of the Event interface is a boolean value that is true when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and false when the event was dispatched via EventTarget.dispatchEvent(). The only exception is the click event, which initializes the isTrusted property to false in user agents."}, {"accepts": "boolean", "name": "returnValue", "says": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not."}, {"accepts": "EventTarget | null", "name": "srcElement", "says": "The deprecated **`Event.srcElement`** is an alias for the Event.target property. Use Event.target instead."}, {"accepts": "EventTarget | null", "name": "target", "says": "The read-only **`target`** property of the Event interface is a reference to the object onto which the event was dispatched. It is different from Event.currentTarget when the event handler is called during the bubbling or capturing phase of the event."}, {"accepts": "number", "name": "timeStamp", "says": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created."}, {"accepts": "string", "name": "type", "says": "The **`type`** read-only property of the Event interface returns a string containing the event's type. It is set when the event is constructed and is the name commonly used to refer to the specific event, such as click, load, or error."}, {"accepts": "() => EventTarget[]", "name": "composedPath", "says": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked. This does not include nodes in shadow trees if the shadow root was created with its ShadowRoot.mode closed."}, {"accepts": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", "name": "initEvent", "says": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent()."}, {"accepts": "() => void", "name": "preventDefault", "says": "The **`preventDefault()`** method of the Event interface tells the user agent that the event is being explicitly handled, so its default action, such as page scrolling, link navigation, or pasting text, should not be taken."}, {"accepts": "() => void", "name": "stopImmediatePropagation", "says": "The **`stopImmediatePropagation()`** method of the Event interface prevents other listeners of the same event from being called."}, {"accepts": "() => void", "name": "stopPropagation", "says": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases. It does not, however, prevent any default behaviors from occurring; for instance, clicks on links are still processed. If you want to stop those behaviors, see the preventDefault() method. It also does not prevent propagation to other event-handlers of the current element. If you want to stop those, see stopImmediatePropagation()."}, {"accepts": "0", "name": "NONE", "says": ""}, {"accepts": "1", "name": "CAPTURING_PHASE", "says": ""}, {"accepts": "2", "name": "AT_TARGET", "says": ""}, {"accepts": "3", "name": "BUBBLING_PHASE", "says": ""}], "interact-outside.FocusOutsideEvent": [{"accepts": "EventDetails<FocusEvent>", "name": "detail", "says": "The read-only **`detail`** property of the CustomEvent interface returns any data passed when initializing the event."}, {"accepts": "(type: string, bubbles?: boolean, cancelable?: boolean, detail?: EventDetails<FocusEvent>) => void", "name": "initCustomEvent", "says": "The **`CustomEvent.initCustomEvent()`** method initializes a CustomEvent object. If the event has already been dispatched, this method does nothing."}, {"accepts": "boolean", "name": "bubbles", "says": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not."}, {"accepts": "boolean", "name": "cancelBubble", "says": "The **`cancelBubble`** property of the Event interface is deprecated. Use Event.stopPropagation() instead. Setting its value to true before returning from an event handler prevents propagation of the event. In later implementations, setting this to false does nothing. See Browser compatibility for details."}, {"accepts": "boolean", "name": "cancelable", "says": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened."}, {"accepts": "boolean", "name": "composed", "says": "The read-only **`composed`** property of the Event interface returns a boolean value which indicates whether or not the event will propagate across the shadow DOM boundary into the standard DOM."}, {"accepts": "EventTarget | null", "name": "currentTarget", "says": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached."}, {"accepts": "boolean", "name": "defaultPrevented", "says": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event."}, {"accepts": "number", "name": "eventPhase", "says": "The **`eventPhase`** read-only property of the Event interface indicates which phase of the event flow is currently being evaluated."}, {"accepts": "boolean", "name": "isTrusted", "says": "The **`isTrusted`** read-only property of the Event interface is a boolean value that is true when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and false when the event was dispatched via EventTarget.dispatchEvent(). The only exception is the click event, which initializes the isTrusted property to false in user agents."}, {"accepts": "boolean", "name": "returnValue", "says": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not."}, {"accepts": "EventTarget | null", "name": "srcElement", "says": "The deprecated **`Event.srcElement`** is an alias for the Event.target property. Use Event.target instead."}, {"accepts": "EventTarget | null", "name": "target", "says": "The read-only **`target`** property of the Event interface is a reference to the object onto which the event was dispatched. It is different from Event.currentTarget when the event handler is called during the bubbling or capturing phase of the event."}, {"accepts": "number", "name": "timeStamp", "says": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created."}, {"accepts": "string", "name": "type", "says": "The **`type`** read-only property of the Event interface returns a string containing the event's type. It is set when the event is constructed and is the name commonly used to refer to the specific event, such as click, load, or error."}, {"accepts": "() => EventTarget[]", "name": "composedPath", "says": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked. This does not include nodes in shadow trees if the shadow root was created with its ShadowRoot.mode closed."}, {"accepts": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", "name": "initEvent", "says": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent()."}, {"accepts": "() => void", "name": "preventDefault", "says": "The **`preventDefault()`** method of the Event interface tells the user agent that the event is being explicitly handled, so its default action, such as page scrolling, link navigation, or pasting text, should not be taken."}, {"accepts": "() => void", "name": "stopImmediatePropagation", "says": "The **`stopImmediatePropagation()`** method of the Event interface prevents other listeners of the same event from being called."}, {"accepts": "() => void", "name": "stopPropagation", "says": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases. It does not, however, prevent any default behaviors from occurring; for instance, clicks on links are still processed. If you want to stop those behaviors, see the preventDefault() method. It also does not prevent propagation to other event-handlers of the current element. If you want to stop those, see stopImmediatePropagation()."}, {"accepts": "0", "name": "NONE", "says": ""}, {"accepts": "1", "name": "CAPTURING_PHASE", "says": ""}, {"accepts": "2", "name": "AT_TARGET", "says": ""}, {"accepts": "3", "name": "BUBBLING_PHASE", "says": ""}], "interact-outside.InteractOutsideEvent": [{"accepts": "", "name": "FocusOutsideEvent", "says": ""}, {"accepts": "", "name": "PointerDownOutsideEvent", "says": ""}], "hover-card.ElementIds": [{"accepts": "string | ((value?: string) => string)", "name": "trigger", "says": ""}, {"accepts": "string", "name": "content", "says": ""}, {"accepts": "string", "name": "positioner", "says": ""}, {"accepts": "string", "name": "arrow", "says": ""}], "hover-card.OpenChangeDetails": [{"accepts": "boolean", "name": "open", "says": ""}], "popper.PositioningOptions": [{"accepts": "boolean", "name": "restoreStyles", "says": "Whether styles applied by the positioning utility should be restored on cleanup."}, {"accepts": "boolean", "name": "applyStyles", "says": "Whether to apply computed position styles (`--x`, `--y`, `--z-index`, `z-index`) to the floating element. Set to `false` when the consumer applies these from context (e.g. for exit animations)."}, {"accepts": "boolean", "name": "hideWhenDetached", "says": "Whether the popover should be hidden when the reference element is detached"}, {"accepts": "\"absolute\" | \"fixed\"", "name": "strategy", "says": "The strategy to use for positioning"}, {"accepts": "Placement", "name": "placement", "says": "The initial placement of the floating element"}, {"accepts": "{ mainAxis?: number; crossAxis?: number; }", "name": "offset", "says": "The offset of the floating element"}, {"accepts": "number", "name": "gutter", "says": "The main axis offset or gap between the reference and floating elements"}, {"accepts": "number", "name": "shift", "says": "The secondary axis offset or gap between the reference and floating elements"}, {"accepts": "number", "name": "overflowPadding", "says": "The virtual padding around the viewport edges to check for overflow"}, {"accepts": "number", "name": "arrowPadding", "says": "The minimum padding between the arrow and the floating element's corner."}, {"accepts": "boolean | Placement[]", "name": "flip", "says": "Whether to flip the placement"}, {"accepts": "boolean", "name": "slide", "says": "Whether the popover should slide when it overflows."}, {"accepts": "boolean", "name": "overlap", "says": "Whether the floating element can overlap the reference element"}, {"accepts": "boolean", "name": "sameWidth", "says": "Whether to make the floating element same width as the reference element"}, {"accepts": "boolean", "name": "fitViewport", "says": "Whether the popover should fit the viewport."}, {"accepts": "boolean", "name": "sizeMiddleware", "says": "Whether to use the size middleware from Floating UI. It computes and sets CSS variables (`--reference-width`, `--reference-height`, `--available-width`, `--available-height`) used by `sameWidth` and `fitViewport`."}, {"accepts": "\"clipping-ancestors\" | (() => Boundary) | Boundary", "name": "boundary", "says": "The overflow boundary of the reference element Accepts a function returning a Boundary, a Boundary directly, or the shorthand string 'clipping-ancestors' which maps to Floating UI's 'clippingAncestors'."}, {"accepts": "boolean | AutoUpdateOptions", "name": "listeners", "says": "Options to activate auto-update listeners"}, {"accepts": "((data: ComputePositionReturn) => void)", "name": "onComplete", "says": "Function called when the placement is computed"}, {"accepts": "((data: { placed: boolean; }) => void)", "name": "onPositioned", "says": "Function called when the floating element is positioned or not"}, {"accepts": "(() => HTMLElement | VirtualElement | null)", "name": "getAnchorElement", "says": "Function that returns the anchor element. Useful when you want to use a different element as the anchor."}, {"accepts": "((element: HTMLElement | VirtualElement | null) => AnchorRect | null)", "name": "getAnchorRect", "says": "Function that returns the anchor rect"}, {"accepts": "((data: { updatePosition: () => Promise<void>; floatingElement: HTMLElement | null; }) => void | Promise<void>)", "name": "updatePosition", "says": "A callback that will be called when the popover needs to calculate its position."}], "utils.Placement": [{"accepts": "", "name": "\"bottom\"", "says": ""}, {"accepts": "", "name": "\"bottom-end\"", "says": ""}, {"accepts": "", "name": "\"bottom-start\"", "says": ""}, {"accepts": "", "name": "\"left\"", "says": ""}, {"accepts": "", "name": "\"left-end\"", "says": ""}, {"accepts": "", "name": "\"left-start\"", "says": ""}, {"accepts": "", "name": "\"right\"", "says": ""}, {"accepts": "", "name": "\"right-end\"", "says": ""}, {"accepts": "", "name": "\"right-start\"", "says": ""}, {"accepts": "", "name": "\"top\"", "says": ""}, {"accepts": "", "name": "\"top-end\"", "says": ""}, {"accepts": "", "name": "\"top-start\"", "says": ""}], "dom.AutoUpdateOptions": [{"accepts": "boolean", "name": "ancestorScroll", "says": "Whether to update the position when an overflow ancestor is scrolled."}, {"accepts": "boolean", "name": "ancestorResize", "says": "Whether to update the position when an overflow ancestor is resized. This\r uses the native `resize` event."}, {"accepts": "boolean", "name": "elementResize", "says": "Whether to update the position when either the reference or floating\r elements resized. This uses a `ResizeObserver`."}, {"accepts": "boolean", "name": "layoutShift", "says": "Whether to update the position when the reference relocated on the screen\r due to layout shift."}, {"accepts": "boolean", "name": "animationFrame", "says": "Whether to update on every animation frame if necessary. Only use if you\r need to update the position in response to an animation using transforms."}], "core.ComputePositionReturn": [{"accepts": "Placement", "name": "placement", "says": "The final chosen placement of the floating element."}, {"accepts": "Strategy", "name": "strategy", "says": "The strategy used to position the floating element."}, {"accepts": "MiddlewareData", "name": "middlewareData", "says": "Object containing data returned from all middleware, keyed by their name."}, {"accepts": "number", "name": "x", "says": ""}, {"accepts": "number", "name": "y", "says": ""}], "dom.VirtualElement": [{"accepts": "() => { bottom: number; height: number; left: number; right: number; top: number; width: number; x: number; y: number; }", "name": "getBoundingClientRect", "says": ""}, {"accepts": "(() => { bottom: number; height: number; left: number; right: number; top: number; width: number; x: number; y: number; }[] | DOMRectList)", "name": "getClientRects", "says": ""}, {"accepts": "Element", "name": "contextElement", "says": ""}], "hover-card.TriggerValueChangeDetails": [{"accepts": "string | null", "name": "value", "says": "The value of the trigger"}, {"accepts": "HTMLElement | null", "name": "triggerElement", "says": "The trigger element"}]};