@squadbase/vantage 0.1.0 → 0.1.1

package/dist/components/index.js

@@ -815,6 +815,108 @@ var FunnelSteps = forwardRef(function FunnelSteps2({
   );
 });
 FunnelSteps.displayName = "FunnelSteps";
+var VB_WIDTH = 100;
+function normalizeData(values, height, vPad = 2) {
+  const min = Math.min(...values);
+  const max = Math.max(...values);
+  const range = max - min;
+  const drawHeight = height - vPad * 2;
+  if (range === 0) return values.map(() => vPad + drawHeight / 2);
+  return values.map((v) => height - vPad - (v - min) / range * drawHeight);
+}
+function buildLinePath(ys) {
+  if (ys.length === 0) return "";
+  const step = ys.length > 1 ? VB_WIDTH / (ys.length - 1) : 0;
+  return ys.map((y, i) => `${i === 0 ? "M" : "L"}${(i * step).toFixed(2)},${y.toFixed(2)}`).join(" ");
+}
+function buildAreaPath(ys, height) {
+  if (ys.length === 0) return "";
+  const step = ys.length > 1 ? VB_WIDTH / (ys.length - 1) : 0;
+  const lastX = ((ys.length - 1) * step).toFixed(2);
+  return `${buildLinePath(ys)} L${lastX},${height} L0,${height} Z`;
+}
+function buildBarRects(ys, height, gap = 1) {
+  const barW = Math.max(1, VB_WIDTH / ys.length - gap);
+  return ys.map((y, i) => ({ x: i * (barW + gap), y, w: barW, h: height - y }));
+}
+var Sparkline = forwardRef(function Sparkline2({
+  data,
+  variant = "line",
+  height = 40,
+  color = "text-chart-1",
+  area = false,
+  animate = false,
+  className,
+  ...props
+}, ref) {
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    if (animate) setMounted(true);
+  }, [animate]);
+  if (data.length === 0) return null;
+  const ys = normalizeData(
+    data.map((d) => d.value),
+    height
+  );
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      ref,
+      "data-slot": "sparkline",
+      viewBox: `0 0 ${VB_WIDTH} ${height}`,
+      preserveAspectRatio: "none",
+      width: "100%",
+      height,
+      "aria-hidden": "true",
+      className: cn("overflow-visible", className),
+      ...props,
+      children: [
+        variant === "line" && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+          area && /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: buildAreaPath(ys, height),
+              strokeWidth: 0,
+              className: cn("fill-current opacity-15", color)
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: buildLinePath(ys),
+              fill: "none",
+              strokeWidth: 1.5,
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              vectorEffect: "non-scaling-stroke",
+              pathLength: animate ? 1 : void 0,
+              strokeDasharray: animate ? 1 : void 0,
+              strokeDashoffset: animate ? mounted ? 0 : 1 : void 0,
+              className: cn("stroke-current", color),
+              style: animate ? { transition: "stroke-dashoffset 0.6s ease-in-out" } : void 0
+            }
+          )
+        ] }),
+        variant === "bar" && buildBarRects(ys, height).map((rect, i) => /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: rect.x,
+            y: animate ? mounted ? rect.y : height : rect.y,
+            width: rect.w,
+            height: animate ? mounted ? rect.h : 0 : rect.h,
+            rx: 0.5,
+            className: cn("fill-current", color),
+            style: animate ? {
+              transition: `height 0.4s ease-out ${i * 0.02}s, y 0.4s ease-out ${i * 0.02}s`
+            } : void 0
+          },
+          i
+        ))
+      ]
+    }
+  );
+});
+Sparkline.displayName = "Sparkline";
 function useControlledState(controlledValue, defaultValue, onChange) {
   const [internalValue, setInternalValue] = useState(defaultValue);
   const isControlled = controlledValue !== void 0;
@@ -1977,7 +2079,19 @@ var StatusBadge = forwardRef(function StatusBadge2({ status, label, colorMap, cl
   );
 });
 StatusBadge.displayName = "StatusBadge";
+var Placeholder = forwardRef(function Placeholder2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      ref,
+      "data-slot": "placeholder",
+      className: cn("inline-block animate-pulse text-muted-foreground", className),
+      ...props
+    }
+  );
+});
+Placeholder.displayName = "Placeholder";
 
-export { AppShell, DashboardCard, DashboardCardAction, DashboardCardContent, DashboardCardDescription, DashboardCardFooter, DashboardCardHeader, DashboardCardPreset, DashboardCardSkeleton, DashboardCardTitle, DataTable, DataTableColumnVisibility, DataTableContent, DataTablePagination, DataTablePreset, DataTableToolbar, DateRangePicker, EChart, FilterBar, FilterBarActiveChips, FilterBarClearButton, FilterBarMultiSelect, FilterBarPreset, FilterBarSelect, FunnelSteps, MetricUnit, MetricValue, MultiSelect, PageShell, PageShellActions, PageShellContent, PageShellDescription, PageShellHeader, PageShellHeaderEnd, PageShellHeading, PageShellMeta, PageShellSummary, PageShellSummaryCard, PageShellTitle, SearchableSelect, SectionHeader, SegmentedControl, StatusBadge, TrendIndicator, defaultPresets, flattenOptions, funnelStepsVariants, isGroupedOptions, metricValueVariants, pageShellSummaryCardVariants, useDataTable };
+export { AppShell, DashboardCard, DashboardCardAction, DashboardCardContent, DashboardCardDescription, DashboardCardFooter, DashboardCardHeader, DashboardCardPreset, DashboardCardSkeleton, DashboardCardTitle, DataTable, DataTableColumnVisibility, DataTableContent, DataTablePagination, DataTablePreset, DataTableToolbar, DateRangePicker, EChart, FilterBar, FilterBarActiveChips, FilterBarClearButton, FilterBarMultiSelect, FilterBarPreset, FilterBarSelect, FunnelSteps, MetricUnit, MetricValue, MultiSelect, PageShell, PageShellActions, PageShellContent, PageShellDescription, PageShellHeader, PageShellHeaderEnd, PageShellHeading, PageShellMeta, PageShellSummary, PageShellSummaryCard, PageShellTitle, Placeholder, SearchableSelect, SectionHeader, SegmentedControl, Sparkline, StatusBadge, TrendIndicator, defaultPresets, flattenOptions, funnelStepsVariants, isGroupedOptions, metricValueVariants, pageShellSummaryCardVariants, useDataTable };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map