@agg-market/ui 5.0.0 → 7.0.0

package/dist/chunk-3W7NBJLU.mjs

@@ -1,371 +0,0 @@
-import {
-  defaultSettlementDifferencesTitle,
-  defaultSettlementSectionLabel,
-  getTradingVenueLabel
-} from "./chunk-OBCHURW5.mjs";
-import {
-  Skeleton,
-  skeletonViews
-} from "./chunk-M4RJHRFT.mjs";
-import {
-  VenueLogo
-} from "./chunk-PORVP72S.mjs";
-import {
-  Icon
-} from "./chunk-PZTHM6WG.mjs";
-import {
-  Card
-} from "./chunk-FO2QCB4Z.mjs";
-import {
-  __spreadProps,
-  __spreadValues,
-  cn,
-  getMotionClassName
-} from "./chunk-GJ4U5NCE.mjs";
-
-// src/trading/settlement/index.tsx
-import { useCallback, useEffect, useRef, useState } from "react";
-import { useLabels, useSdkUiConfig } from "@agg-market/hooks";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var getSettlementHeaderClassName = () => {
-  return "flex items-center justify-between gap-4";
-};
-var Settlement = ({
-  sectionLabel = defaultSettlementSectionLabel,
-  question,
-  differencesTitle = defaultSettlementDifferencesTitle,
-  differences,
-  venues,
-  defaultExpandedVenue,
-  expandedVenue,
-  isLoading = false,
-  onExpandedVenueChange,
-  onShowMore,
-  className
-}) => {
-  var _a, _b;
-  const labels = useLabels();
-  const { enableAnimations } = useSdkUiConfig();
-  const resolvedSectionLabel = sectionLabel === defaultSettlementSectionLabel ? labels.trading.settlementSection : sectionLabel;
-  const resolvedDifferencesTitle = differencesTitle === defaultSettlementDifferencesTitle ? labels.trading.settlementDifferencesTitle : differencesTitle;
-  const [internalExpandedVenue, setInternalExpandedVenue] = useState(
-    (_b = defaultExpandedVenue != null ? defaultExpandedVenue : (_a = venues[0]) == null ? void 0 : _a.venue) != null ? _b : null
-  );
-  const [expandedDescriptionByVenue, setExpandedDescriptionByVenue] = useState({});
-  const [overflowingDescriptionByVenue, setOverflowingDescriptionByVenue] = useState({});
-  const [collapsedDescriptionByVenue, setCollapsedDescriptionByVenue] = useState({});
-  const descriptionWrapperRefs = useRef(/* @__PURE__ */ new Map());
-  const descriptionMeasureRefs = useRef(/* @__PURE__ */ new Map());
-  useEffect(() => {
-    if (expandedVenue === void 0)
-      return;
-    setInternalExpandedVenue(expandedVenue);
-  }, [expandedVenue]);
-  const resolvedExpandedVenue = expandedVenue === void 0 ? internalExpandedVenue : expandedVenue;
-  const handleVenueClick = (venue) => {
-    const nextVenue = resolvedExpandedVenue === venue ? null : venue;
-    if (expandedVenue === void 0) {
-      setInternalExpandedVenue(nextVenue);
-    }
-    onExpandedVenueChange == null ? void 0 : onExpandedVenueChange(nextVenue);
-  };
-  const handleDescriptionWrapperRef = useCallback(
-    (venue, element) => {
-      if (!element) {
-        descriptionWrapperRefs.current.delete(venue);
-        return;
-      }
-      descriptionWrapperRefs.current.set(venue, element);
-    },
-    []
-  );
-  const handleDescriptionMeasureRef = useCallback(
-    (venue, element) => {
-      if (!element) {
-        descriptionMeasureRefs.current.delete(venue);
-        return;
-      }
-      descriptionMeasureRefs.current.set(venue, element);
-    },
-    []
-  );
-  const updateDescriptionLayout = useCallback(
-    (venue, description, showMoreLabel) => {
-      const descriptionWrapperElement = descriptionWrapperRefs.current.get(venue);
-      const descriptionMeasureElement = descriptionMeasureRefs.current.get(venue);
-      if (!descriptionWrapperElement || !descriptionMeasureElement)
-        return;
-      const wrapperWidth = descriptionWrapperElement.clientWidth;
-      if (wrapperWidth <= 0)
-        return;
-      const computedStyles = window.getComputedStyle(descriptionWrapperElement);
-      const parsedLineHeight = Number.parseFloat(computedStyles.lineHeight);
-      const lineHeight = Number.isFinite(parsedLineHeight) ? parsedLineHeight : 20;
-      const maxHeight = lineHeight * 2 + 1;
-      descriptionMeasureElement.style.width = `${wrapperWidth}px`;
-      const getHeight = (value) => {
-        descriptionMeasureElement.textContent = value;
-        return descriptionMeasureElement.scrollHeight;
-      };
-      const fullHeight = getHeight(description);
-      if (fullHeight <= maxHeight) {
-        setOverflowingDescriptionByVenue((currentState) => {
-          if (currentState[venue] === false)
-            return currentState;
-          return __spreadProps(__spreadValues({}, currentState), {
-            [venue]: false
-          });
-        });
-        setCollapsedDescriptionByVenue((currentState) => {
-          if (currentState[venue] === description)
-            return currentState;
-          return __spreadProps(__spreadValues({}, currentState), {
-            [venue]: description
-          });
-        });
-        return;
-      }
-      const suffix = `... ${showMoreLabel}`;
-      let left = 0;
-      let right = description.length;
-      let bestLength = 0;
-      while (left <= right) {
-        const middle = Math.floor((left + right) / 2);
-        const candidate = description.slice(0, middle).trimEnd();
-        const candidateHeight = getHeight(`${candidate}${suffix}`);
-        if (candidateHeight <= maxHeight) {
-          bestLength = middle;
-          left = middle + 1;
-          continue;
-        }
-        right = middle - 1;
-      }
-      const collapsedDescription = description.slice(0, bestLength).trimEnd();
-      setOverflowingDescriptionByVenue((currentState) => {
-        if (currentState[venue] === true)
-          return currentState;
-        return __spreadProps(__spreadValues({}, currentState), {
-          [venue]: true
-        });
-      });
-      setCollapsedDescriptionByVenue((currentState) => {
-        if (currentState[venue] === collapsedDescription)
-          return currentState;
-        return __spreadProps(__spreadValues({}, currentState), {
-          [venue]: collapsedDescription
-        });
-      });
-    },
-    []
-  );
-  useEffect(() => {
-    if (typeof window === "undefined")
-      return;
-    if (!resolvedExpandedVenue)
-      return;
-    if (expandedDescriptionByVenue[resolvedExpandedVenue])
-      return;
-    const expandedVenueItem = venues.find((venueItem) => venueItem.venue === resolvedExpandedVenue);
-    if (!expandedVenueItem)
-      return;
-    const frameId = window.requestAnimationFrame(() => {
-      var _a2;
-      updateDescriptionLayout(
-        resolvedExpandedVenue,
-        expandedVenueItem.description,
-        (_a2 = expandedVenueItem.showMoreLabel) != null ? _a2 : "Show more"
-      );
-    });
-    return () => {
-      window.cancelAnimationFrame(frameId);
-    };
-  }, [expandedDescriptionByVenue, resolvedExpandedVenue, updateDescriptionLayout, venues]);
-  useEffect(() => {
-    if (!resolvedExpandedVenue)
-      return;
-    if (expandedDescriptionByVenue[resolvedExpandedVenue])
-      return;
-    if (typeof ResizeObserver === "undefined")
-      return;
-    const expandedVenueItem = venues.find((venueItem) => venueItem.venue === resolvedExpandedVenue);
-    if (!expandedVenueItem)
-      return;
-    const descriptionWrapperElement = descriptionWrapperRefs.current.get(resolvedExpandedVenue);
-    if (!descriptionWrapperElement)
-      return;
-    const resizeObserver = new ResizeObserver(() => {
-      var _a2;
-      updateDescriptionLayout(
-        resolvedExpandedVenue,
-        expandedVenueItem.description,
-        (_a2 = expandedVenueItem.showMoreLabel) != null ? _a2 : "Show more"
-      );
-    });
-    resizeObserver.observe(descriptionWrapperElement);
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, [expandedDescriptionByVenue, resolvedExpandedVenue, updateDescriptionLayout, venues]);
-  const handleDescriptionShowMoreClick = (event, venue) => {
-    event == null ? void 0 : event.stopPropagation();
-    setExpandedDescriptionByVenue((currentState) => {
-      if (currentState[venue])
-        return currentState;
-      return __spreadProps(__spreadValues({}, currentState), {
-        [venue]: true
-      });
-    });
-    onShowMore == null ? void 0 : onShowMore(venue);
-  };
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(
-      Skeleton,
-      {
-        ariaLabel: labels.trading.settlementLoading,
-        className,
-        view: skeletonViews.settlement
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(
-    Card,
-    {
-      className: cn(
-        "flex flex-col w-full gap-5 rounded-agg-xl border border-agg-separator bg-agg-secondary p-5 shadow-none hover:shadow-none",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: getSettlementHeaderClassName(), children: [
-          /* @__PURE__ */ jsx("p", { className: "text-agg-xs font-agg-bold leading-agg-4 uppercase text-agg-muted-foreground", children: resolvedSectionLabel }),
-          /* @__PURE__ */ jsx("p", { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: question })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsx("p", { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: resolvedDifferencesTitle }),
-          /* @__PURE__ */ jsx("ul", { className: "list-disc pl-5 text-agg-sm leading-agg-5 text-agg-foreground", children: differences.map((difference) => /* @__PURE__ */ jsx("li", { children: difference }, difference)) })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "h-px w-full bg-agg-separator" }),
-        /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-3", children: venues.map((venue) => {
-          var _a2, _b2;
-          const venueLabel = getTradingVenueLabel(venue.venue, venue.label);
-          const isExpanded = resolvedExpandedVenue === venue.venue;
-          const isDescriptionExpanded = !!expandedDescriptionByVenue[venue.venue];
-          const isDescriptionOverflowing = !!overflowingDescriptionByVenue[venue.venue];
-          const shouldShowDescriptionCta = isExpanded && isDescriptionOverflowing && !isDescriptionExpanded;
-          const resolvedShowMoreLabel = (_a2 = venue.showMoreLabel) != null ? _a2 : "Show more";
-          return /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
-            /* @__PURE__ */ jsxs(
-              "button",
-              {
-                type: "button",
-                className: cn(
-                  "flex items-center gap-2 text-left",
-                  "cursor-pointer disabled:cursor-not-allowed hover:opacity-50",
-                  getMotionClassName(
-                    enableAnimations,
-                    "transition-[opacity,color] duration-200 ease-in-out"
-                  )
-                ),
-                "aria-expanded": isExpanded,
-                "aria-label": labels.trading.settlementDetailsAria(venueLabel),
-                onClick: () => handleVenueClick(venue.venue),
-                children: [
-                  /* @__PURE__ */ jsx(
-                    VenueLogo,
-                    {
-                      venue: venue.venue,
-                      size: "small",
-                      ariaLabel: venueLabel
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    "span",
-                    {
-                      className: cn(
-                        "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground",
-                        isExpanded ? "text-agg-primary" : "text-agg-foreground"
-                      ),
-                      children: venueLabel
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    Icon,
-                    {
-                      name: isExpanded ? "chevron-up" : "chevron-down",
-                      size: "small",
-                      className: "text-agg-foreground",
-                      color: "currentColor"
-                    }
-                  )
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                "aria-hidden": !isExpanded,
-                className: cn(
-                  "grid overflow-hidden",
-                  isExpanded ? "mt-2 grid-rows-[1fr] opacity-100" : "mt-0 grid-rows-[0fr] opacity-0",
-                  !isExpanded && "pointer-events-none",
-                  getMotionClassName(
-                    enableAnimations,
-                    "transition-[grid-template-rows,opacity,margin-top] duration-300 ease-in-out"
-                  )
-                ),
-                children: /* @__PURE__ */ jsxs(
-                  "div",
-                  {
-                    ref: (element) => handleDescriptionWrapperRef(venue.venue, element),
-                    className: "relative min-h-0",
-                    children: [
-                      /* @__PURE__ */ jsxs("p", { className: "min-h-0 text-agg-sm leading-agg-5 text-agg-foreground", children: [
-                        isDescriptionExpanded || !isDescriptionOverflowing ? venue.description : (_b2 = collapsedDescriptionByVenue[venue.venue]) != null ? _b2 : venue.description,
-                        shouldShowDescriptionCta ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                          "... ",
-                          /* @__PURE__ */ jsx(
-                            "button",
-                            {
-                              type: "button",
-                              tabIndex: isExpanded ? 0 : -1,
-                              className: cn(
-                                "cursor-pointer disabled:cursor-not-allowed",
-                                "text-agg-sm leading-agg-5 text-agg-foreground underline-offset-2 hover:underline hover:font-agg-bold",
-                                getMotionClassName(
-                                  enableAnimations,
-                                  "transition-[text-decoration] duration-200 ease-in-out"
-                                )
-                              ),
-                              "aria-label": labels.trading.settlementShowMoreAria(
-                                resolvedShowMoreLabel,
-                                venueLabel
-                              ),
-                              onClick: (event) => handleDescriptionShowMoreClick(event, venue.venue),
-                              children: resolvedShowMoreLabel
-                            }
-                          )
-                        ] }) : null
-                      ] }),
-                      /* @__PURE__ */ jsx(
-                        "p",
-                        {
-                          ref: (element) => handleDescriptionMeasureRef(venue.venue, element),
-                          "aria-hidden": true,
-                          className: "pointer-events-none invisible fixed top-0 left-0 -z-10 whitespace-normal text-agg-sm leading-agg-5"
-                        }
-                      )
-                    ]
-                  }
-                )
-              }
-            )
-          ] }, venue.venue);
-        }) })
-      ]
-    }
-  );
-};
-Settlement.displayName = "Settlement";
-
-export {
-  Settlement
-};

package/dist/chunk-4343LYSH.mjs

@@ -1,45 +0,0 @@
-import {
-  getIconA11yProps
-} from "./chunk-BNDFQPHF.mjs";
-import {
-  __objRest,
-  __spreadProps,
-  __spreadValues
-} from "./chunk-GJ4U5NCE.mjs";
-
-// src/primitives/search/search-empty-icon.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var SearchEmptyIcon = (_a) => {
-  var _b = _a, { title, className } = _b, props = __objRest(_b, ["title", "className"]);
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    __spreadProps(__spreadValues(__spreadValues({
-      viewBox: "0 0 40 40",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      className
-    }, getIconA11yProps(title)), props), {
-      children: [
-        title ? /* @__PURE__ */ jsx("title", { children: title }) : null,
-        /* @__PURE__ */ jsx("circle", { cx: "19.9987", cy: "20.0013", r: "9.2", stroke: "currentColor", strokeWidth: "1.6" }),
-        /* @__PURE__ */ jsx(
-          "ellipse",
-          {
-            cx: "19.9987",
-            cy: "20.0012",
-            rx: "17.2",
-            ry: "6.6",
-            transform: "rotate(-35 19.9987 20.0012)",
-            stroke: "currentColor",
-            strokeWidth: "1.6"
-          }
-        )
-      ]
-    })
-  );
-};
-SearchEmptyIcon.displayName = "SearchEmptyIcon";
-
-export {
-  SearchEmptyIcon
-};