@1771technologies/lytenyte-pro 0.0.39

package/dist/pill-manager.js

@@ -0,0 +1,674 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { u as useGrid, a as useDragStore, b as useDrag, D as DragProvider, G as GridProvider } from "./use-grid-DKvzGZWc.js";
+import { useMemo, createContext, useState, useContext, forwardRef, useEffect, useCallback } from "react";
+import { clsx } from "@1771technologies/js-utils";
+import { c as canAgg, a as canMeasure, u as useAggregationSource, b as useMeasuresSource, d as useRowGroupsSource, e as useColumnPivotSource, f as useDroppable, g as useEdgeScroll, P as Pill, M as MenuTrigger, h as useDraggable, i as PillManagerAggMenu, j as PillManagerMeasureMenu } from "./pill-C4Jhdf8E.js";
+import "@1771technologies/react-sizer";
+import { useCombinedRefs } from "@1771technologies/react-utils";
+import "@1771technologies/grid-provider";
+import "@1771technologies/react-dragon";
+import "@1771technologies/grid-core";
+import { D as DragIcon, M as MeasuresIcon, C as ColumnPivotIcon, R as RowGroupIcon, a as MoreDotsIcon } from "./row-group-icon-BOOju5Vu.js";
+import { M as MenuRoot, a as MenuPortal, b as MenuPositioner } from "./MenuRoot-9n64jNWP.js";
+import { M as ManageColumnsIcon, C as CollapseIcon, E as ExpandIcon } from "./manage-columns-icon-D4CElo5H.js";
+import { createPortal } from "react-dom";
+function useColumnSource(source) {
+  const { api, state: sx } = useGrid();
+  const columns = sx.columns.use();
+  const pivotModel = sx.columnPivotModel.use();
+  const aggModel = sx.aggModel.use();
+  const groupModel = sx.rowGroupModel.use();
+  const measureModel = sx.measureModel.use();
+  const base = sx.columnBase.use();
+  return useMemo(() => {
+    if (source !== "columns") return [];
+    const active = [];
+    const inactive = [];
+    for (const c of columns) {
+      if (api.columnIsGridGenerated(c)) continue;
+      if (api.columnIsVisible(c, true)) {
+        const onToggle = () => api.columnUpdate(c, { hide: true });
+        const dragTags = ["columns"];
+        if (api.columnIsPivotable(c) && !pivotModel.includes(c.id)) dragTags.push("column-pivot");
+        if (api.columnIsRowGroupable(c) && !groupModel.includes(c.id)) dragTags.push("row-group");
+        if (!aggModel[c.id] && canAgg(c, base)) dragTags.push("aggregations");
+        if (!measureModel[c.id] && canMeasure(c, base)) dragTags.push("measures");
+        const dragEnd = (d) => {
+          const over = d.over.at(-1);
+          if (!over || !over.canDrop) return;
+          if (over.data.target === "columns") {
+            const id = over.data.id;
+            if (id === c.id) return;
+            const isBefore = (sx.rtl.peek() ? "right" : "left") === over.xHalf;
+            if (isBefore) api.columnMoveBefore([c.id], id);
+            else api.columnMoveAfter([c.id], id);
+            return;
+          }
+          if (over.id === "row-groups-pills") {
+            sx.rowGroupModel.set((prev) => [...prev, c.id]);
+            api.columnUpdate(c, { hide: true });
+            return;
+          }
+          if (over.data.target === "row-group") {
+            const id = over.data.id;
+            api.columnUpdate(c, { hide: true });
+            const model = sx.rowGroupModel.peek();
+            const isBefore = (sx.rtl.peek() ? "right" : "left") === over.xHalf;
+            const index = model.indexOf(id);
+            const nextModel = [...model];
+            nextModel.splice(isBefore ? index : index + 1, 0, c.id);
+            sx.rowGroupModel.set(nextModel);
+            return;
+          }
+          if (over.id === "column-pivots-pills") {
+            sx.columnPivotModel.set((prev) => [...prev, c.id]);
+            api.columnUpdate(c, { hide: true });
+            return;
+          }
+          if (over.data.target === "column-pivot") {
+            const id = over.data.id;
+            api.columnUpdate(c, { hide: true });
+            const model = sx.columnPivotModel.peek();
+            const isBefore = (sx.rtl.peek() ? "right" : "left") === over.xHalf;
+            const index = model.indexOf(id);
+            const nextModel = [...model];
+            nextModel.splice(isBefore ? index : index + 1, 0, c.id);
+            sx.columnPivotModel.set(nextModel);
+            return;
+          }
+          if (over.id === "aggregations-pills") {
+            const aggFn = c.aggFnDefault ?? c.aggFnsAllowed?.at(0) ?? base.aggFnsAllowed?.at(0);
+            if (!aggFn) return;
+            sx.aggModel.set((prev) => ({ ...prev, [c.id]: { fn: aggFn } }));
+            return;
+          }
+          if (over.id === "measures-pills") {
+            const measureFn = c.measureFnDefault ?? c.measureFnsAllowed?.at(0) ?? base.measureFnsAllowed?.at(0);
+            if (!measureFn) return;
+            sx.measureModel.set((prev) => ({ ...prev, [c.id]: { fn: measureFn } }));
+            return;
+          }
+        };
+        active.push({
+          kind: "column",
+          active: true,
+          label: c.headerName ?? c.id,
+          onClick: onToggle,
+          isColumn: true,
+          draggable: api.columnIsMovable(c),
+          dragTags,
+          dragEnd,
+          dropId: `column-${c.id}`,
+          dropTags: ["columns"],
+          dropData: {
+            target: "columns",
+            id: c.id
+          }
+        });
+      } else {
+        const onToggle = () => api.columnUpdate(c, { hide: false });
+        inactive.push({
+          kind: "column",
+          active: false,
+          label: c.headerName ?? c.id,
+          onClick: onToggle,
+          dropId: `column-${c.id}`,
+          draggable: false,
+          dragTags: [],
+          dropTags: [],
+          dropData: {}
+        });
+      }
+    }
+    return [...active, ...inactive];
+  }, [
+    aggModel,
+    api,
+    base,
+    columns,
+    groupModel,
+    measureModel,
+    pivotModel,
+    source,
+    sx.aggModel,
+    sx.columnPivotModel,
+    sx.measureModel,
+    sx.rowGroupModel,
+    sx.rtl
+  ]);
+}
+const context$1 = createContext({});
+function PillManagerControlsProvider(props) {
+  const [activeRow, setActiveRow] = useState(null);
+  const [activePill, setActivePill] = useState(null);
+  const m = useMemo(() => {
+    return {
+      activeRow,
+      setActiveRow,
+      activePill,
+      setActivePill
+    };
+  }, [activePill, activeRow]);
+  return /* @__PURE__ */ jsx(context$1.Provider, { value: m, children: props.children });
+}
+const usePillControls = () => useContext(context$1);
+const PillRowContext = createContext(null);
+const usePillRow = () => useContext(PillRowContext);
+const PillManagerRow = forwardRef(
+  function PillManagerRow2({ pillSource, ...props }, ref) {
+    const [expanded, setExpanded] = useState(false);
+    const { activeRow } = usePillControls();
+    const value = useMemo(() => {
+      return {
+        expanded,
+        setExpanded,
+        expandable: true,
+        pillSource
+      };
+    }, [expanded, pillSource]);
+    return /* @__PURE__ */ jsx(PillRowContext.Provider, { value, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...props,
+        className: clsx("lng1771-pill-manager__row"),
+        ref,
+        "data-expanded": expanded,
+        "data-pill-row-key": pillSource,
+        "data-pill-active": activeRow === pillSource
+      }
+    ) });
+  }
+);
+const PillManagerPills = forwardRef(function PillManagerRow3({ children, ...props }, ref) {
+  const { pillSource } = usePillRow();
+  const aggs = useAggregationSource(pillSource);
+  const measures = useMeasuresSource(pillSource);
+  const columns = useColumnSource(pillSource);
+  const rowGroups = useRowGroupsSource(pillSource);
+  const pivots = useColumnPivotSource(pillSource);
+  const sourceItems = useMemo(() => {
+    if (pillSource === "columns") return columns;
+    if (pillSource === "column-pivots") return pivots;
+    if (pillSource === "row-groups") return rowGroups;
+    if (pillSource === "aggregations") return aggs;
+    if (pillSource === "measures") return measures;
+    return [];
+  }, [aggs, columns, measures, pillSource, pivots, rowGroups]);
+  const dropTags = useMemo(() => {
+    if (pillSource === "columns") return ["columns"];
+    if (pillSource === "aggregations") return ["aggregations"];
+    if (pillSource === "column-pivots") return ["column-pivot"];
+    if (pillSource === "measures") return ["measures"];
+    if (pillSource === "row-groups") return ["row-group"];
+    return [];
+  }, [pillSource]);
+  const dropData = useMemo(() => {
+    return { target: pillSource, sourceItems };
+  }, [pillSource, sourceItems]);
+  const {
+    canDrop,
+    isTarget,
+    isNearestOver,
+    ref: dropRef
+  } = useDroppable({
+    id: `${pillSource}-pills`,
+    accepted: dropTags,
+    data: dropData
+  });
+  const combined = useCombinedRefs(dropRef, ref);
+  const store = useDragStore();
+  const isActive = useDrag(store, (s) => !!s.active);
+  const re = useEdgeScroll({ isActive, direction: "horizontal" });
+  const allRefs = useCombinedRefs(re, combined);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...props,
+      className: clsx("lng1771-pill-manager__pills", props.className),
+      "data-is-drop-target": isTarget,
+      ref: allRefs,
+      "data-pill-source": pillSource,
+      "data-drop-visible": canDrop && sourceItems.filter((c) => c.active).length === 0,
+      tabIndex: -1,
+      children: /* @__PURE__ */ jsxs("div", { className: "lng1771-pill-manager__pills-inner", children: [
+        children({ pills: sourceItems }),
+        canDrop && isNearestOver && sourceItems.filter((c) => c.active).length > 0 && /* @__PURE__ */ jsx("div", { className: "lng1771-pill-manager__drop-indicator-end" })
+      ] })
+    }
+  );
+});
+const PillManagerPill = forwardRef(function PillManagerPill2({ item, ...props }, ref) {
+  const {
+    ref: dropRef,
+    isTarget,
+    canDrop,
+    xHalf
+  } = useDroppable({
+    id: item.dropId,
+    accepted: item.dropTags,
+    data: item.dropData,
+    active: item.active
+  });
+  const grid = useGrid();
+  const rtl = grid.state.rtl.use();
+  const combinedRefs = useCombinedRefs(ref, dropRef);
+  const { activePill, setActivePill, setActiveRow } = usePillControls();
+  const { pillSource } = usePillRow();
+  const {
+    aggMenuRenderer: AggMenu,
+    measureMenuRenderer: MeasureMenu,
+    menuTriggerIcon: TriggerIcon
+  } = useComponents();
+  const [isDragging, setIsDragging] = useState(false);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...props,
+      role: "button",
+      ref: combinedRefs,
+      "data-pill-key": item.dropId,
+      "data-pill-active": item.active,
+      "data-is-droppable": isTarget && canDrop,
+      className: "lng1771-pill-manager__pill-outer",
+      onClick: item.onClick,
+      children: [
+        /* @__PURE__ */ jsxs(
+          Pill,
+          {
+            kind: item.kind,
+            "data-pill-focused": item.dropId === activePill,
+            className: "lng1771-pill-manager__pill-inner",
+            interactive: true,
+            "data-draggable": item.draggable,
+            "data-drag-active": isDragging,
+            children: [
+              item.draggable && /* @__PURE__ */ jsx(DragHandle, { item, setIsDragging }),
+              /* @__PURE__ */ jsx("span", { children: item.label }),
+              item.secondaryLabel && /* @__PURE__ */ jsx("span", { className: "lng1771-pill-manager__pill-inner--secondary-label", children: item.secondaryLabel }),
+              (item.isAggregation || item.isMeasure) && /* @__PURE__ */ jsxs(MenuRoot, { children: [
+                /* @__PURE__ */ jsx(
+                  MenuTrigger,
+                  {
+                    className: "lng1771-pill-manager__menu-trigger",
+                    "data-pill-menu-trigger": "true",
+                    tabIndex: -1,
+                    onClick: (e) => e.stopPropagation(),
+                    onFocus: (ev) => {
+                      let current = ev.currentTarget;
+                      while (current && current.getAttribute("data-rows-root") == null) {
+                        current = current.parentElement;
+                      }
+                      if (current) current.focus();
+                      setTimeout(() => {
+                        setActivePill(item.dropId);
+                        setActiveRow(pillSource);
+                      });
+                    },
+                    children: /* @__PURE__ */ jsx(TriggerIcon, { width: 16, height: 16 })
+                  }
+                ),
+                /* @__PURE__ */ jsx(MenuPortal, { children: /* @__PURE__ */ jsxs(MenuPositioner, { onClick: (ev) => ev.stopPropagation(), children: [
+                  item.isAggregation && /* @__PURE__ */ jsx(AggMenu, { grid, column: item.column }),
+                  item.isMeasure && /* @__PURE__ */ jsx(MeasureMenu, { grid, column: item.column })
+                ] }) })
+              ] })
+            ]
+          }
+        ),
+        canDrop && (rtl ? "left" : "right") === xHalf && /* @__PURE__ */ jsx("div", { className: "lng1771-pill-manager__drop-indicator-end" }),
+        canDrop && (rtl ? "right" : "left") === xHalf && /* @__PURE__ */ jsx("div", { className: "lng1771-pill-manager__drop-indicator-start" })
+      ]
+    }
+  );
+});
+function DragHandle({
+  item,
+  setIsDragging
+}) {
+  const { onPointerDown, isActive } = useDraggable({
+    id: item.label,
+    getTags: () => item.dragTags,
+    getData: () => item?.dragData,
+    onDragStart: () => {
+      document.body.classList.add("lng1771-drag-on");
+    },
+    onDragCancel: () => {
+      document.body.classList.remove("lng1771-drag-on");
+    },
+    onDragEnd: (p) => {
+      item.dragEnd?.(p);
+      document.body.classList.remove("lng1771-drag-on");
+    }
+  });
+  useEffect(() => {
+    setIsDragging(isActive);
+  }, [isActive, setIsDragging]);
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      tabIndex: -1,
+      className: "lng1771-pill-manager__pill-dragger",
+      onPointerDown,
+      children: /* @__PURE__ */ jsx(DragIcon, { width: 16, height: 16 })
+    }
+  );
+}
+const PillManagerRowLabel = forwardRef(
+  function PillManagerRowLabel2(props, ref) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...props,
+        className: clsx("lng1771-pill-manager__row-label", props.className),
+        ref
+      }
+    );
+  }
+);
+const PillManagerColumnsLabel = forwardRef(function PillManagerColumnsLabel2({ labelText = "Columns", icon = /* @__PURE__ */ jsx(ManageColumnsIcon, {}), ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    PillManagerRowLabel,
+    {
+      ...props,
+      className: "lng1771-pill-manager__row-label-built-in",
+      ref,
+      children: [
+        icon,
+        /* @__PURE__ */ jsx("span", { children: labelText })
+      ]
+    }
+  );
+});
+const PillManagerAggLabel = forwardRef(function PillManagerColumnsLabel3({ labelText = "Aggregations", icon = /* @__PURE__ */ jsx(MeasuresIcon, {}), ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    PillManagerRowLabel,
+    {
+      ...props,
+      className: "lng1771-pill-manager__row-label-built-in",
+      ref,
+      children: [
+        icon,
+        /* @__PURE__ */ jsx("span", { children: labelText })
+      ]
+    }
+  );
+});
+const PillManagerMeasureLabel = forwardRef(function PillManagerColumnsLabel4({ labelText = "Measure", icon = /* @__PURE__ */ jsx(MeasuresIcon, {}), ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    PillManagerRowLabel,
+    {
+      ...props,
+      className: "lng1771-pill-manager__row-label-built-in",
+      ref,
+      children: [
+        icon,
+        /* @__PURE__ */ jsx("span", { children: labelText })
+      ]
+    }
+  );
+});
+const PillManagerColumnPivotsLabel = forwardRef(function PillManagerColumnsLabel5({ labelText = "Column Pivots", icon = /* @__PURE__ */ jsx(ColumnPivotIcon, {}), ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    PillManagerRowLabel,
+    {
+      ...props,
+      className: "lng1771-pill-manager__row-label-built-in",
+      ref,
+      children: [
+        icon,
+        /* @__PURE__ */ jsx("span", { children: labelText })
+      ]
+    }
+  );
+});
+const PillManagerRowGroupsLabel = forwardRef(function PillManagerColumnsLabel6({ labelText = "Row Groups", icon = /* @__PURE__ */ jsx(RowGroupIcon, {}), ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    PillManagerRowLabel,
+    {
+      ...props,
+      className: "lng1771-pill-manager__row-label-built-in",
+      ref,
+      children: [
+        icon,
+        /* @__PURE__ */ jsx("span", { children: labelText })
+      ]
+    }
+  );
+});
+const PillManagerRows = forwardRef(
+  function PillManagerRows2({ onKeyDown: kd, ...props }, ref) {
+    const { activePill, activeRow, setActivePill, setActiveRow } = usePillControls();
+    const sx = useGrid();
+    const onKeydown = useCallback(
+      (ev) => {
+        kd?.(ev);
+        const targets = Array.from(ev.currentTarget.children).filter((c) => c.getAttribute("data-pill-row-key")).map((c) => [c.getAttribute("data-pill-row-key"), c]);
+        if (targets.length === 0) return;
+        const startKey = sx.state.rtl.peek() ? "ArrowRight" : "ArrowLeft";
+        const endKey = sx.state.rtl.peek() ? "ArrowLeft" : "ArrowRight";
+        const focusPrevActive = (el) => {
+          const pills = Array.from(el.querySelectorAll(`[data-pill-key]`)).map(
+            (c) => [c.getAttribute("data-pill-key"), c]
+          );
+          if (!pills.length) {
+            setActivePill(null);
+            return;
+          }
+          if (!activePill) {
+            setActivePill(pills.at(-1)[0]);
+            pills.at(-1)[1].scrollIntoView();
+            return;
+          }
+          const activeIndex = pills.findIndex((c) => c[0] === activePill);
+          if (activeIndex === -1 || activeIndex === 0) {
+            setActivePill(pills.at(-1)[0]);
+            pills.at(-1)[1].scrollIntoView();
+            return;
+          }
+          setActivePill(pills[activeIndex - 1][0]);
+          pills[activeIndex - 1][1].scrollIntoView();
+        };
+        const focusNextActive = (el) => {
+          const pills = Array.from(el.querySelectorAll(`[data-pill-key]`)).map(
+            (c) => [c.getAttribute("data-pill-key"), c]
+          );
+          if (!pills.length) {
+            setActivePill(null);
+            return;
+          }
+          if (!activePill) {
+            setActivePill(pills[0][0]);
+            pills[0][1].scrollIntoView();
+            return;
+          }
+          const activeIndex = pills.findIndex((c) => c[0] === activePill);
+          if (activeIndex === -1 || activeIndex === pills.length - 1) {
+            setActivePill(pills[0][0]);
+            pills[0][1].scrollIntoView();
+            return;
+          }
+          setActivePill(pills[activeIndex + 1][0]);
+          pills[activeIndex + 1][1].scrollIntoView();
+        };
+        if (ev.key === "ArrowUp") {
+          const currentActive = targets.findIndex((c) => c[0] === activeRow);
+          if (currentActive === -1 || currentActive === 0) {
+            setActiveRow(targets.at(-1)[0]);
+            focusNextActive(targets.at(-1)[1]);
+          } else {
+            setActiveRow(targets[currentActive - 1][0]);
+            focusNextActive(targets[currentActive - 1][1]);
+          }
+        } else if (ev.key === "ArrowDown") {
+          const currentActive = targets.findIndex((c) => c[0] === activeRow);
+          if (currentActive === -1 || currentActive === targets.length - 1) {
+            setActiveRow(targets[0][0]);
+            focusNextActive(targets[0][1]);
+          } else {
+            setActiveRow(targets[currentActive + 1][0]);
+            focusNextActive(targets[currentActive + 1][1]);
+          }
+        } else if (ev.key === endKey) {
+          const currentActive = targets.find((c) => c[0] === activeRow)?.[1];
+          if (!currentActive) return;
+          focusNextActive(currentActive);
+          ev.preventDefault();
+          return;
+        } else if (ev.key === startKey) {
+          const currentActive = targets.find((c) => c[0] === activeRow)?.[1];
+          if (!currentActive) return;
+          focusPrevActive(currentActive);
+          ev.preventDefault();
+          return;
+        } else if (ev.key === " ") {
+          if (!activePill) return;
+          const currentActive = targets.find((c) => c[0] === activeRow)?.[1];
+          if (!currentActive) return;
+          const pill = currentActive.querySelector(
+            `[data-pill-key="${activePill}"]`
+          );
+          if (!pill) return;
+          pill.click();
+          ev.preventDefault();
+        } else if (ev.key === "x") {
+          const currentActive = targets.find((c) => c[0] === activeRow)?.[1];
+          if (!currentActive) return;
+          const expander = currentActive.querySelector(
+            `[data-pill-expander-source]`
+          );
+          if (expander) expander.click();
+        } else if (ev.key === "m") {
+          if (!activePill) return;
+          const currentActive = targets.find((c) => c[0] === activeRow)?.[1];
+          if (!currentActive) return;
+          const pill = currentActive.querySelector(
+            `[data-pill-key="${activePill}"]`
+          );
+          if (!pill) return;
+          const menu = pill.querySelector('[data-pill-menu-trigger="true"]');
+          if (!menu) return;
+          menu.click();
+        }
+      },
+      [activePill, activeRow, kd, setActivePill, setActiveRow, sx.state.rtl]
+    );
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...props,
+        onKeyDown: onKeydown,
+        tabIndex: 0,
+        onBlur: () => {
+          setActiveRow(null);
+          setActivePill(null);
+        },
+        className: clsx("lng1771-pill-manager__rows", props.className),
+        "data-rows-root": "true",
+        "data-active-row": activePill,
+        "data-active-pill": activeRow,
+        ref
+      }
+    );
+  }
+);
+const PillManagerExpander = forwardRef(
+  function PillManagerExpander2({ children, ...props }, ref) {
+    const { expanded, setExpanded, pillSource } = usePillRow();
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ...props,
+        className: clsx("lng1771-pill-manager__expander"),
+        ref,
+        tabIndex: -1,
+        "data-pill-expander-source": pillSource,
+        onClick: () => {
+          setExpanded((prev) => !prev);
+        },
+        children: [
+          !children && (expanded ? /* @__PURE__ */ jsx(CollapseIcon, {}) : /* @__PURE__ */ jsx(ExpandIcon, {})),
+          children
+        ]
+      }
+    );
+  }
+);
+const PillManagerSeparator = forwardRef(
+  function PillManagerSeparator2(props, ref) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...props,
+        className: clsx("lng1771-pill-manager__separator", props.className),
+        ref
+      }
+    );
+  }
+);
+function PillManagerDragPlaceholder(props) {
+  const store = useDragStore();
+  const s = useDrag(store, (s2) => s2.active);
+  if (!s) return null;
+  const c = props.children ?? DefaultPlaceholder;
+  return createPortal(
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "lng1771-pill-manager__drag-placeholder",
+        style: { transform: `translate3d(${s.x}px, ${s.y}px, 0px)` },
+        children: c(s)
+      }
+    ),
+    document.body
+  );
+}
+function DefaultPlaceholder(p) {
+  return /* @__PURE__ */ jsxs("div", { className: "lng1771-pill-manager__drag-placeholder--default", children: [
+    /* @__PURE__ */ jsx(
+      "svg",
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "20px",
+        height: "20px",
+        fill: "currentcolor",
+        viewBox: "0 0 256 256",
+        children: /* @__PURE__ */ jsx("path", { d: "M90.34,61.66a8,8,0,0,1,0-11.32l32-32a8,8,0,0,1,11.32,0l32,32a8,8,0,0,1-11.32,11.32L136,43.31V96a8,8,0,0,1-16,0V43.31L101.66,61.66A8,8,0,0,1,90.34,61.66Zm64,132.68L136,212.69V160a8,8,0,0,0-16,0v52.69l-18.34-18.35a8,8,0,0,0-11.32,11.32l32,32a8,8,0,0,0,11.32,0l32-32a8,8,0,0,0-11.32-11.32Zm83.32-72-32-32a8,8,0,0,0-11.32,11.32L212.69,120H160a8,8,0,0,0,0,16h52.69l-18.35,18.34a8,8,0,0,0,11.32,11.32l32-32A8,8,0,0,0,237.66,122.34ZM43.31,136H96a8,8,0,0,0,0-16H43.31l18.35-18.34A8,8,0,0,0,50.34,90.34l-32,32a8,8,0,0,0,0,11.32l32,32a8,8,0,0,0,11.32-11.32Z" })
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { children: p.id })
+  ] });
+}
+const context = createContext({});
+const useComponents = () => useContext(context);
+const Root = forwardRef(function Root2({ grid, children, aggMenuRenderer, measureMenuRenderer, menuTriggerIcon, ...props }, ref) {
+  const components = useMemo(() => {
+    return {
+      aggMenuRenderer: aggMenuRenderer ?? PillManagerAggMenu,
+      measureMenuRenderer: measureMenuRenderer ?? PillManagerMeasureMenu,
+      menuTriggerIcon: menuTriggerIcon ?? MoreDotsIcon
+    };
+  }, [aggMenuRenderer, measureMenuRenderer, menuTriggerIcon]);
+  return /* @__PURE__ */ jsx(context.Provider, { value: components, children: /* @__PURE__ */ jsx(DragProvider, { children: /* @__PURE__ */ jsx(GridProvider, { value: grid, children: /* @__PURE__ */ jsx(PillManagerControlsProvider, { children: /* @__PURE__ */ jsx(RootImpl, { ...props, ref, children }) }) }) }) });
+});
+const RootImpl = forwardRef(function RootImpl2({ children, ...props }, ref) {
+  return /* @__PURE__ */ jsx("div", { ...props, className: clsx("lng1771-pill-manager", props.className), ref, children });
+});
+const PillManager = {
+  Root,
+  Rows: PillManagerRows,
+  Row: PillManagerRow,
+  RowLabel: PillManagerRowLabel,
+  RowLabelColumns: PillManagerColumnsLabel,
+  RowLabelMeasures: PillManagerMeasureLabel,
+  RowLabelAggregations: PillManagerAggLabel,
+  RowLabelColumnPivots: PillManagerColumnPivotsLabel,
+  RowLabelRowGroups: PillManagerRowGroupsLabel,
+  Separator: PillManagerSeparator,
+  Expander: PillManagerExpander,
+  Pills: PillManagerPills,
+  Pill: PillManagerPill,
+  DragPlaceholder: PillManagerDragPlaceholder
+};
+export {
+  PillManager
+};

package/dist/plus-icon-ToqW5CC-.js

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+function PlusIcon(props) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M8 2.75C8 2.47386 7.77614 2.25 7.5 2.25C7.22386 2.25 7 2.47386 7 2.75V7H2.75C2.47386 7 2.25 7.22386 2.25 7.5C2.25 7.77614 2.47386 8 2.75 8H7V12.25C7 12.5261 7.22386 12.75 7.5 12.75C7.77614 12.75 8 12.5261 8 12.25V8H12.25C12.5261 8 12.75 7.77614 12.75 7.5C12.75 7.22386 12.5261 7 12.25 7H8V2.75Z",
+      fill: "currentColor",
+      fillRule: "evenodd",
+      clipRule: "evenodd"
+    }
+  ) });
+}
+export {
+  PlusIcon as P
+};