@almadar/ui 5.13.3 → 5.14.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -17578,6 +17578,8 @@ var init_CodeBlock = __esm({
17578
17578
  collapsedRef.current = collapsed;
17579
17579
  const foldStartMapRef = React98.useRef(foldStartMap);
17580
17580
  foldStartMapRef.current = foldStartMap;
17581
+ const hiddenLinesRef = React98.useRef(hiddenLines);
17582
+ hiddenLinesRef.current = hiddenLines;
17581
17583
  const toggleFold = React98.useCallback((lineNum) => {
17582
17584
  setCollapsed((prev) => {
17583
17585
  const next = new Set(prev);
@@ -17690,6 +17692,60 @@ var init_CodeBlock = __esm({
17690
17692
  eventBus.emit("UI:COPY_CODE", { language, success: false });
17691
17693
  }
17692
17694
  };
17695
+ const handleSelectionCopy = React98.useCallback((e) => {
17696
+ if (hiddenLinesRef.current.size === 0) return;
17697
+ const sel = typeof window !== "undefined" ? window.getSelection() : null;
17698
+ if (!sel || sel.rangeCount === 0 || sel.isCollapsed) return;
17699
+ const lineOf = (node) => {
17700
+ const start = node instanceof HTMLElement ? node : node?.parentElement ?? null;
17701
+ const lineEl = start?.closest("[data-line]");
17702
+ if (!lineEl) return null;
17703
+ const n = parseInt(lineEl.getAttribute("data-line") ?? "", 10);
17704
+ return Number.isNaN(n) ? null : n;
17705
+ };
17706
+ const range = sel.getRangeAt(0);
17707
+ let a = lineOf(range.startContainer);
17708
+ let b = lineOf(range.endContainer);
17709
+ if (a === null || b === null) {
17710
+ const container = codeRef.current;
17711
+ if (!container) return;
17712
+ let min = Infinity, max = -Infinity;
17713
+ container.querySelectorAll("[data-line]").forEach((el) => {
17714
+ if (!sel.containsNode(el, true)) return;
17715
+ const n = parseInt(el.getAttribute("data-line") ?? "", 10);
17716
+ if (!Number.isNaN(n)) {
17717
+ min = Math.min(min, n);
17718
+ max = Math.max(max, n);
17719
+ }
17720
+ });
17721
+ if (min === Infinity) return;
17722
+ a = a ?? min;
17723
+ b = b ?? max;
17724
+ }
17725
+ if (a > b) [a, b] = [b, a];
17726
+ let touchesFold = false;
17727
+ for (let i = a; i <= b; i++) {
17728
+ if (hiddenLinesRef.current.has(i) || foldStartMapRef.current.has(i) && collapsedRef.current.has(i)) {
17729
+ touchesFold = true;
17730
+ break;
17731
+ }
17732
+ }
17733
+ if (!touchesFold) return;
17734
+ let endLine = b;
17735
+ let changed = true;
17736
+ while (changed) {
17737
+ changed = false;
17738
+ foldStartMapRef.current.forEach((region, start) => {
17739
+ if (start >= a && start <= endLine && collapsedRef.current.has(start) && region.end > endLine) {
17740
+ endLine = region.end;
17741
+ changed = true;
17742
+ }
17743
+ });
17744
+ }
17745
+ const full = code.split("\n").slice(a, endLine + 1).join("\n");
17746
+ e.clipboardData.setData("text/plain", full);
17747
+ e.preventDefault();
17748
+ }, [code]);
17693
17749
  const hasHeader = showLanguageBadge || showCopyButton;
17694
17750
  return /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: `relative group ${className || ""}`, style: { display: "flex", flexDirection: "column", height: "100%" }, children: [
17695
17751
  hasHeader && /* @__PURE__ */ jsxRuntime.jsxs(
@@ -17840,6 +17896,7 @@ var init_CodeBlock = __esm({
17840
17896
  "div",
17841
17897
  {
17842
17898
  ref: scrollRef,
17899
+ onCopy: handleSelectionCopy,
17843
17900
  style: {
17844
17901
  flex: 1,
17845
17902
  minHeight: 0,
package/dist/avl/index.js CHANGED
@@ -17529,6 +17529,8 @@ var init_CodeBlock = __esm({
17529
17529
  collapsedRef.current = collapsed;
17530
17530
  const foldStartMapRef = useRef(foldStartMap);
17531
17531
  foldStartMapRef.current = foldStartMap;
17532
+ const hiddenLinesRef = useRef(hiddenLines);
17533
+ hiddenLinesRef.current = hiddenLines;
17532
17534
  const toggleFold = useCallback((lineNum) => {
17533
17535
  setCollapsed((prev) => {
17534
17536
  const next = new Set(prev);
@@ -17641,6 +17643,60 @@ var init_CodeBlock = __esm({
17641
17643
  eventBus.emit("UI:COPY_CODE", { language, success: false });
17642
17644
  }
17643
17645
  };
17646
+ const handleSelectionCopy = useCallback((e) => {
17647
+ if (hiddenLinesRef.current.size === 0) return;
17648
+ const sel = typeof window !== "undefined" ? window.getSelection() : null;
17649
+ if (!sel || sel.rangeCount === 0 || sel.isCollapsed) return;
17650
+ const lineOf = (node) => {
17651
+ const start = node instanceof HTMLElement ? node : node?.parentElement ?? null;
17652
+ const lineEl = start?.closest("[data-line]");
17653
+ if (!lineEl) return null;
17654
+ const n = parseInt(lineEl.getAttribute("data-line") ?? "", 10);
17655
+ return Number.isNaN(n) ? null : n;
17656
+ };
17657
+ const range = sel.getRangeAt(0);
17658
+ let a = lineOf(range.startContainer);
17659
+ let b = lineOf(range.endContainer);
17660
+ if (a === null || b === null) {
17661
+ const container = codeRef.current;
17662
+ if (!container) return;
17663
+ let min = Infinity, max = -Infinity;
17664
+ container.querySelectorAll("[data-line]").forEach((el) => {
17665
+ if (!sel.containsNode(el, true)) return;
17666
+ const n = parseInt(el.getAttribute("data-line") ?? "", 10);
17667
+ if (!Number.isNaN(n)) {
17668
+ min = Math.min(min, n);
17669
+ max = Math.max(max, n);
17670
+ }
17671
+ });
17672
+ if (min === Infinity) return;
17673
+ a = a ?? min;
17674
+ b = b ?? max;
17675
+ }
17676
+ if (a > b) [a, b] = [b, a];
17677
+ let touchesFold = false;
17678
+ for (let i = a; i <= b; i++) {
17679
+ if (hiddenLinesRef.current.has(i) || foldStartMapRef.current.has(i) && collapsedRef.current.has(i)) {
17680
+ touchesFold = true;
17681
+ break;
17682
+ }
17683
+ }
17684
+ if (!touchesFold) return;
17685
+ let endLine = b;
17686
+ let changed = true;
17687
+ while (changed) {
17688
+ changed = false;
17689
+ foldStartMapRef.current.forEach((region, start) => {
17690
+ if (start >= a && start <= endLine && collapsedRef.current.has(start) && region.end > endLine) {
17691
+ endLine = region.end;
17692
+ changed = true;
17693
+ }
17694
+ });
17695
+ }
17696
+ const full = code.split("\n").slice(a, endLine + 1).join("\n");
17697
+ e.clipboardData.setData("text/plain", full);
17698
+ e.preventDefault();
17699
+ }, [code]);
17644
17700
  const hasHeader = showLanguageBadge || showCopyButton;
17645
17701
  return /* @__PURE__ */ jsxs(Box, { className: `relative group ${className || ""}`, style: { display: "flex", flexDirection: "column", height: "100%" }, children: [
17646
17702
  hasHeader && /* @__PURE__ */ jsxs(
@@ -17791,6 +17847,7 @@ var init_CodeBlock = __esm({
17791
17847
  "div",
17792
17848
  {
17793
17849
  ref: scrollRef,
17850
+ onCopy: handleSelectionCopy,
17794
17851
  style: {
17795
17852
  flex: 1,
17796
17853
  minHeight: 0,
@@ -8679,13 +8679,13 @@ var init_MapView = __esm({
8679
8679
  shadowSize: [41, 41]
8680
8680
  });
8681
8681
  L.Marker.prototype.options.icon = defaultIcon;
8682
- const { useEffect: useEffect72, useRef: useRef66, useCallback: useCallback128, useState: useState111 } = React80__namespace.default;
8682
+ const { useEffect: useEffect73, useRef: useRef67, useCallback: useCallback129, useState: useState112 } = React80__namespace.default;
8683
8683
  const { Typography: Typography2 } = await Promise.resolve().then(() => (init_Typography(), Typography_exports));
8684
8684
  const { useEventBus: useEventBus2 } = await Promise.resolve().then(() => (init_useEventBus(), useEventBus_exports));
8685
8685
  function MapUpdater({ centerLat, centerLng, zoom }) {
8686
8686
  const map = useMap();
8687
- const prevRef = useRef66({ centerLat, centerLng, zoom });
8688
- useEffect72(() => {
8687
+ const prevRef = useRef67({ centerLat, centerLng, zoom });
8688
+ useEffect73(() => {
8689
8689
  const prev = prevRef.current;
8690
8690
  if (prev.centerLat !== centerLat || prev.centerLng !== centerLng || prev.zoom !== zoom) {
8691
8691
  map.setView([centerLat, centerLng], zoom);
@@ -8696,7 +8696,7 @@ var init_MapView = __esm({
8696
8696
  }
8697
8697
  function MapClickHandler({ onMapClick }) {
8698
8698
  const map = useMap();
8699
- useEffect72(() => {
8699
+ useEffect73(() => {
8700
8700
  if (!onMapClick) return;
8701
8701
  const handler = (e) => {
8702
8702
  onMapClick(e.latlng.lat, e.latlng.lng);
@@ -8724,8 +8724,8 @@ var init_MapView = __esm({
8724
8724
  showAttribution = true
8725
8725
  }) {
8726
8726
  const eventBus = useEventBus2();
8727
- const [clickedPosition, setClickedPosition] = useState111(null);
8728
- const handleMapClick = useCallback128((lat, lng) => {
8727
+ const [clickedPosition, setClickedPosition] = useState112(null);
8728
+ const handleMapClick = useCallback129((lat, lng) => {
8729
8729
  if (showClickedPin) {
8730
8730
  setClickedPosition({ lat, lng });
8731
8731
  }
@@ -8734,7 +8734,7 @@ var init_MapView = __esm({
8734
8734
  eventBus.emit(`UI:${mapClickEvent}`, { latitude: lat, longitude: lng });
8735
8735
  }
8736
8736
  }, [onMapClick, mapClickEvent, eventBus, showClickedPin]);
8737
- const handleMarkerClick = useCallback128((marker) => {
8737
+ const handleMarkerClick = useCallback129((marker) => {
8738
8738
  onMarkerClick?.(marker);
8739
8739
  if (markerClickEvent) {
8740
8740
  eventBus.emit(`UI:${markerClickEvent}`, { ...marker });
@@ -12514,6 +12514,8 @@ var init_CodeBlock = __esm({
12514
12514
  collapsedRef.current = collapsed;
12515
12515
  const foldStartMapRef = React80.useRef(foldStartMap);
12516
12516
  foldStartMapRef.current = foldStartMap;
12517
+ const hiddenLinesRef = React80.useRef(hiddenLines);
12518
+ hiddenLinesRef.current = hiddenLines;
12517
12519
  const toggleFold = React80.useCallback((lineNum) => {
12518
12520
  setCollapsed((prev) => {
12519
12521
  const next = new Set(prev);
@@ -12626,6 +12628,60 @@ var init_CodeBlock = __esm({
12626
12628
  eventBus.emit("UI:COPY_CODE", { language, success: false });
12627
12629
  }
12628
12630
  };
12631
+ const handleSelectionCopy = React80.useCallback((e) => {
12632
+ if (hiddenLinesRef.current.size === 0) return;
12633
+ const sel = typeof window !== "undefined" ? window.getSelection() : null;
12634
+ if (!sel || sel.rangeCount === 0 || sel.isCollapsed) return;
12635
+ const lineOf = (node) => {
12636
+ const start = node instanceof HTMLElement ? node : node?.parentElement ?? null;
12637
+ const lineEl = start?.closest("[data-line]");
12638
+ if (!lineEl) return null;
12639
+ const n = parseInt(lineEl.getAttribute("data-line") ?? "", 10);
12640
+ return Number.isNaN(n) ? null : n;
12641
+ };
12642
+ const range = sel.getRangeAt(0);
12643
+ let a = lineOf(range.startContainer);
12644
+ let b = lineOf(range.endContainer);
12645
+ if (a === null || b === null) {
12646
+ const container = codeRef.current;
12647
+ if (!container) return;
12648
+ let min = Infinity, max = -Infinity;
12649
+ container.querySelectorAll("[data-line]").forEach((el) => {
12650
+ if (!sel.containsNode(el, true)) return;
12651
+ const n = parseInt(el.getAttribute("data-line") ?? "", 10);
12652
+ if (!Number.isNaN(n)) {
12653
+ min = Math.min(min, n);
12654
+ max = Math.max(max, n);
12655
+ }
12656
+ });
12657
+ if (min === Infinity) return;
12658
+ a = a ?? min;
12659
+ b = b ?? max;
12660
+ }
12661
+ if (a > b) [a, b] = [b, a];
12662
+ let touchesFold = false;
12663
+ for (let i = a; i <= b; i++) {
12664
+ if (hiddenLinesRef.current.has(i) || foldStartMapRef.current.has(i) && collapsedRef.current.has(i)) {
12665
+ touchesFold = true;
12666
+ break;
12667
+ }
12668
+ }
12669
+ if (!touchesFold) return;
12670
+ let endLine = b;
12671
+ let changed = true;
12672
+ while (changed) {
12673
+ changed = false;
12674
+ foldStartMapRef.current.forEach((region, start) => {
12675
+ if (start >= a && start <= endLine && collapsedRef.current.has(start) && region.end > endLine) {
12676
+ endLine = region.end;
12677
+ changed = true;
12678
+ }
12679
+ });
12680
+ }
12681
+ const full = code.split("\n").slice(a, endLine + 1).join("\n");
12682
+ e.clipboardData.setData("text/plain", full);
12683
+ e.preventDefault();
12684
+ }, [code]);
12629
12685
  const hasHeader = showLanguageBadge || showCopyButton;
12630
12686
  return /* @__PURE__ */ jsxRuntime.jsxs(exports.Box, { className: `relative group ${className || ""}`, style: { display: "flex", flexDirection: "column", height: "100%" }, children: [
12631
12687
  hasHeader && /* @__PURE__ */ jsxRuntime.jsxs(
@@ -12776,6 +12832,7 @@ var init_CodeBlock = __esm({
12776
12832
  "div",
12777
12833
  {
12778
12834
  ref: scrollRef,
12835
+ onCopy: handleSelectionCopy,
12779
12836
  style: {
12780
12837
  flex: 1,
12781
12838
  minHeight: 0,
@@ -23835,6 +23892,255 @@ var init_InputGroup = __esm({
23835
23892
  exports.InputGroup.displayName = "InputGroup";
23836
23893
  }
23837
23894
  });
23895
+ function resolveAnchorRect(anchor) {
23896
+ if (typeof anchor === "string") {
23897
+ return document.querySelector(anchor)?.getBoundingClientRect() ?? null;
23898
+ }
23899
+ if (anchor instanceof DOMRect) return anchor;
23900
+ return anchor?.current?.getBoundingClientRect() ?? null;
23901
+ }
23902
+ function useAnchorRect(anchor, active) {
23903
+ const [rect, setRect] = React80.useState(null);
23904
+ const read = React80.useCallback(() => resolveAnchorRect(anchor), [anchor]);
23905
+ React80.useEffect(() => {
23906
+ if (!active || typeof document === "undefined") {
23907
+ setRect(null);
23908
+ return;
23909
+ }
23910
+ const update = () => setRect(read());
23911
+ update();
23912
+ window.addEventListener("scroll", update, true);
23913
+ window.addEventListener("resize", update);
23914
+ let raf = 0;
23915
+ let tries = 0;
23916
+ const poll = () => {
23917
+ const found = read();
23918
+ if (found) {
23919
+ setRect(found);
23920
+ } else if (tries++ < 40) {
23921
+ raf = requestAnimationFrame(poll);
23922
+ }
23923
+ };
23924
+ if (!read()) raf = requestAnimationFrame(poll);
23925
+ return () => {
23926
+ window.removeEventListener("scroll", update, true);
23927
+ window.removeEventListener("resize", update);
23928
+ if (raf) cancelAnimationFrame(raf);
23929
+ };
23930
+ }, [active, read]);
23931
+ return rect;
23932
+ }
23933
+ function placeCard(placement, rect, size) {
23934
+ const vw = typeof window !== "undefined" ? window.innerWidth : 1024;
23935
+ const vh = typeof window !== "undefined" ? window.innerHeight : 768;
23936
+ let top = 0;
23937
+ let left = 0;
23938
+ switch (placement) {
23939
+ case "top":
23940
+ top = rect.top - size.h - GAP;
23941
+ left = rect.left + rect.width / 2 - size.w / 2;
23942
+ break;
23943
+ case "left":
23944
+ left = rect.left - size.w - GAP;
23945
+ top = rect.top + rect.height / 2 - size.h / 2;
23946
+ break;
23947
+ case "right":
23948
+ left = rect.right + GAP;
23949
+ top = rect.top + rect.height / 2 - size.h / 2;
23950
+ break;
23951
+ case "bottom":
23952
+ default:
23953
+ top = rect.bottom + GAP;
23954
+ left = rect.left + rect.width / 2 - size.w / 2;
23955
+ break;
23956
+ }
23957
+ left = Math.max(EDGE, Math.min(left, vw - size.w - EDGE));
23958
+ top = Math.max(EDGE, Math.min(top, vh - size.h - EDGE));
23959
+ return { top, left };
23960
+ }
23961
+ var GAP, EDGE; exports.Coachmark = void 0;
23962
+ var init_Coachmark = __esm({
23963
+ "components/molecules/Coachmark.tsx"() {
23964
+ "use client";
23965
+ init_Box();
23966
+ init_Typography();
23967
+ init_Button();
23968
+ init_Icon();
23969
+ init_cn();
23970
+ GAP = 10;
23971
+ EDGE = 8;
23972
+ exports.Coachmark = ({
23973
+ open,
23974
+ anchor,
23975
+ placement = "bottom",
23976
+ title,
23977
+ children,
23978
+ onDismiss,
23979
+ onPrimary,
23980
+ primaryLabel,
23981
+ onSecondary,
23982
+ secondaryLabel,
23983
+ showBeacon = false,
23984
+ fallbackCentered = false,
23985
+ className
23986
+ }) => {
23987
+ const cardRef = React80.useRef(null);
23988
+ const rect = useAnchorRect(anchor, open);
23989
+ const [pos, setPos] = React80.useState(null);
23990
+ const centered = open && !rect && fallbackCentered;
23991
+ React80.useLayoutEffect(() => {
23992
+ if (!open || !rect || !cardRef.current) {
23993
+ setPos(null);
23994
+ return;
23995
+ }
23996
+ const size = {
23997
+ w: cardRef.current.offsetWidth,
23998
+ h: cardRef.current.offsetHeight
23999
+ };
24000
+ setPos(placeCard(placement, rect, size));
24001
+ }, [open, rect, placement, children, title]);
24002
+ React80.useEffect(() => {
24003
+ if (!open) return;
24004
+ const onKey = (e) => {
24005
+ if (e.key === "Escape") onDismiss();
24006
+ };
24007
+ window.addEventListener("keydown", onKey);
24008
+ return () => window.removeEventListener("keydown", onKey);
24009
+ }, [open, onDismiss]);
24010
+ if (!open || typeof document === "undefined") return null;
24011
+ if (!rect && !centered) return null;
24012
+ const hasFooter = Boolean(onPrimary || onSecondary);
24013
+ const cardStyle = centered ? { top: "50%", left: "50%", transform: "translate(-50%, -50%)" } : pos ? { top: pos.top, left: pos.left } : { top: -9999, left: -9999 };
24014
+ const card = /* @__PURE__ */ jsxRuntime.jsxs(
24015
+ exports.Box,
24016
+ {
24017
+ ref: cardRef,
24018
+ bg: "surface",
24019
+ border: true,
24020
+ rounded: "lg",
24021
+ shadow: "xl",
24022
+ padding: "md",
24023
+ role: "dialog",
24024
+ "aria-label": title,
24025
+ className: cn(
24026
+ "fixed z-50 max-w-xs w-72 transition-opacity duration-150",
24027
+ centered || pos ? "opacity-100" : "opacity-0",
24028
+ className
24029
+ ),
24030
+ style: cardStyle,
24031
+ children: [
24032
+ /* @__PURE__ */ jsxRuntime.jsx(
24033
+ "button",
24034
+ {
24035
+ type: "button",
24036
+ "aria-label": "Dismiss",
24037
+ onClick: onDismiss,
24038
+ className: "absolute top-2 right-2 text-[var(--color-muted-foreground)] hover:text-[var(--color-foreground)]",
24039
+ children: /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, { name: "close", size: "xs" })
24040
+ }
24041
+ ),
24042
+ title && /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "body1", weight: "semibold", className: "pr-6 mb-1", children: title }),
24043
+ /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "body2", color: "muted", as: "div", children }),
24044
+ hasFooter && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 flex items-center justify-end gap-2", children: [
24045
+ onSecondary && /* @__PURE__ */ jsxRuntime.jsx(exports.Button, { variant: "ghost", size: "sm", onClick: onSecondary, children: secondaryLabel ?? "Skip" }),
24046
+ onPrimary && /* @__PURE__ */ jsxRuntime.jsx(exports.Button, { variant: "primary", size: "sm", onClick: onPrimary, children: primaryLabel ?? "Got it" })
24047
+ ] })
24048
+ ]
24049
+ }
24050
+ );
24051
+ const beacon = showBeacon && rect ? /* @__PURE__ */ jsxRuntime.jsx(
24052
+ "div",
24053
+ {
24054
+ className: "fixed z-50 pointer-events-none",
24055
+ style: {
24056
+ top: rect.top + rect.height / 2 - 6,
24057
+ left: rect.left + rect.width / 2 - 6
24058
+ },
24059
+ "aria-hidden": "true",
24060
+ children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex h-3 w-3", children: [
24061
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-[var(--color-primary)] opacity-75" }),
24062
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex h-3 w-3 rounded-full bg-[var(--color-primary)]" })
24063
+ ] })
24064
+ }
24065
+ ) : null;
24066
+ return reactDom.createPortal(
24067
+ /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
24068
+ beacon,
24069
+ card
24070
+ ] }),
24071
+ document.body
24072
+ );
24073
+ };
24074
+ exports.Coachmark.displayName = "Coachmark";
24075
+ }
24076
+ });
24077
+ var DIM; exports.OnboardingSpotlight = void 0;
24078
+ var init_OnboardingSpotlight = __esm({
24079
+ "components/molecules/OnboardingSpotlight.tsx"() {
24080
+ "use client";
24081
+ init_Coachmark();
24082
+ init_cn();
24083
+ DIM = "fixed z-[45] bg-black/60";
24084
+ exports.OnboardingSpotlight = ({
24085
+ steps,
24086
+ stepIndex,
24087
+ onNext,
24088
+ onSkip,
24089
+ onFinish,
24090
+ cutoutPadding = 6
24091
+ }) => {
24092
+ const step = steps[stepIndex];
24093
+ const rect = useAnchorRect(step?.anchor ?? "", Boolean(step));
24094
+ if (!step || typeof document === "undefined") return null;
24095
+ const isLast = stepIndex >= steps.length - 1;
24096
+ const backdrop = rect ? (() => {
24097
+ const p2 = cutoutPadding;
24098
+ const top = Math.max(0, rect.top - p2);
24099
+ const left = Math.max(0, rect.left - p2);
24100
+ const right = rect.right + p2;
24101
+ const bottom = rect.bottom + p2;
24102
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
24103
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: DIM, style: { top: 0, left: 0, right: 0, height: top } }),
24104
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: DIM, style: { top: bottom, left: 0, right: 0, bottom: 0 } }),
24105
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: DIM, style: { top, left: 0, width: left, height: bottom - top } }),
24106
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: DIM, style: { top, left: right, right: 0, height: bottom - top } })
24107
+ ] });
24108
+ })() : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(DIM, "inset-0") });
24109
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
24110
+ reactDom.createPortal(backdrop, document.body),
24111
+ /* @__PURE__ */ jsxRuntime.jsxs(
24112
+ exports.Coachmark,
24113
+ {
24114
+ open: true,
24115
+ anchor: step.anchor,
24116
+ placement: step.placement ?? "bottom",
24117
+ fallbackCentered: true,
24118
+ title: step.title,
24119
+ onDismiss: onSkip,
24120
+ onSecondary: onSkip,
24121
+ secondaryLabel: "Skip",
24122
+ onPrimary: isLast ? onFinish : onNext,
24123
+ primaryLabel: isLast ? "Done" : "Next",
24124
+ children: [
24125
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: step.body }),
24126
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mt-3 flex items-center gap-1.5", children: steps.map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
24127
+ "span",
24128
+ {
24129
+ className: cn(
24130
+ "h-1.5 w-1.5 rounded-full",
24131
+ i === stepIndex ? "bg-[var(--color-primary)]" : "bg-[var(--color-border)]"
24132
+ )
24133
+ },
24134
+ i
24135
+ )) })
24136
+ ]
24137
+ }
24138
+ )
24139
+ ] });
24140
+ };
24141
+ exports.OnboardingSpotlight.displayName = "OnboardingSpotlight";
24142
+ }
24143
+ });
23838
24144
  function gateEnabled(level, ns = NAMESPACE) {
23839
24145
  return logger.isLogLevelEnabled(level, ns);
23840
24146
  }
@@ -34195,7 +34501,7 @@ var init_AvlPage = __esm({
34195
34501
  AvlPage.displayName = "AvlPage";
34196
34502
  }
34197
34503
  });
34198
- var NODE_W, NODE_H, GAP, ARROW_W, MiniStateMachine;
34504
+ var NODE_W, NODE_H, GAP2, ARROW_W, MiniStateMachine;
34199
34505
  var init_MiniStateMachine = __esm({
34200
34506
  "components/molecules/avl/MiniStateMachine.tsx"() {
34201
34507
  "use client";
@@ -34204,7 +34510,7 @@ var init_MiniStateMachine = __esm({
34204
34510
  init_types();
34205
34511
  NODE_W = 24;
34206
34512
  NODE_H = 16;
34207
- GAP = 8;
34513
+ GAP2 = 8;
34208
34514
  ARROW_W = 16;
34209
34515
  MiniStateMachine = ({ data, className }) => {
34210
34516
  const states = data.states;
@@ -34221,12 +34527,12 @@ var init_MiniStateMachine = __esm({
34221
34527
  for (const e of t.effects) effectTypes.add(e.type);
34222
34528
  }
34223
34529
  const effectList = Array.from(effectTypes).slice(0, 6);
34224
- const totalW = states.length * NODE_W + (states.length - 1) * (GAP + ARROW_W + GAP);
34530
+ const totalW = states.length * NODE_W + (states.length - 1) * (GAP2 + ARROW_W + GAP2);
34225
34531
  const svgW = Math.max(totalW + 4, 60);
34226
34532
  const svgH = NODE_H + (effectList.length > 0 ? 18 : 4);
34227
34533
  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: svgW, height: svgH, viewBox: `0 0 ${svgW} ${svgH}`, className, children: [
34228
34534
  states.map((s, i) => {
34229
- const x = 2 + i * (NODE_W + GAP + ARROW_W + GAP);
34535
+ const x = 2 + i * (NODE_W + GAP2 + ARROW_W + GAP2);
34230
34536
  const tc = transitionCounts[s.name] ?? 0;
34231
34537
  const role = getStateRole(s.name, s.isInitial, s.isTerminal, tc, maxTC);
34232
34538
  return /* @__PURE__ */ jsxRuntime.jsxs(React80__namespace.default.Fragment, { children: [
@@ -34247,9 +34553,9 @@ var init_MiniStateMachine = __esm({
34247
34553
  /* @__PURE__ */ jsxRuntime.jsx(
34248
34554
  "line",
34249
34555
  {
34250
- x1: x + NODE_W + GAP,
34556
+ x1: x + NODE_W + GAP2,
34251
34557
  y1: NODE_H / 2,
34252
- x2: x + NODE_W + GAP + ARROW_W - 3,
34558
+ x2: x + NODE_W + GAP2 + ARROW_W - 3,
34253
34559
  y2: NODE_H / 2,
34254
34560
  stroke: "var(--color-muted-foreground)",
34255
34561
  strokeWidth: 1,
@@ -34259,7 +34565,7 @@ var init_MiniStateMachine = __esm({
34259
34565
  /* @__PURE__ */ jsxRuntime.jsx(
34260
34566
  "polygon",
34261
34567
  {
34262
- points: `${x + NODE_W + GAP + ARROW_W - 3},${NODE_H / 2 - 2.5} ${x + NODE_W + GAP + ARROW_W},${NODE_H / 2} ${x + NODE_W + GAP + ARROW_W - 3},${NODE_H / 2 + 2.5}`,
34568
+ points: `${x + NODE_W + GAP2 + ARROW_W - 3},${NODE_H / 2 - 2.5} ${x + NODE_W + GAP2 + ARROW_W},${NODE_H / 2} ${x + NODE_W + GAP2 + ARROW_W - 3},${NODE_H / 2 + 2.5}`,
34263
34569
  fill: "var(--color-muted-foreground)",
34264
34570
  opacity: 0.4
34265
34571
  }
@@ -34406,6 +34712,8 @@ var init_molecules = __esm({
34406
34712
  init_Modal();
34407
34713
  init_Pagination();
34408
34714
  init_Popover();
34715
+ init_Coachmark();
34716
+ init_OnboardingSpotlight();
34409
34717
  init_RelationSelect();
34410
34718
  init_SearchInput();
34411
34719
  init_SidePanel();
@@ -50820,6 +51128,7 @@ exports.transitionAnimation = transitionAnimation;
50820
51128
  exports.updateEntity = updateEntity;
50821
51129
  exports.updateSingleton = updateSingleton;
50822
51130
  exports.useAgentChat = useAgentChat;
51131
+ exports.useAnchorRect = useAnchorRect;
50823
51132
  exports.useAuthContext = useAuthContext;
50824
51133
  exports.useBattleState = useBattleState;
50825
51134
  exports.useCamera = useCamera;