@actioneer/ads 0.5.9 → 0.7.0

package/components/pagination.js

@@ -1,48 +1,48 @@
 "use client";
 import { jsxs as u, jsx as l } from "react/jsx-runtime";
 import * as j from "react";
-import { ChevronLeft as k, MoreHorizontal as L, ChevronRight as G } from "../lib/icons.js";
+import { ChevronLeft as L, MoreHorizontal as k, ChevronRight as G } from "../lib/icons.js";
 import { cn as o } from "../lib/cn.js";
 import { Select as M } from "./select.js";
-function p(e, r) {
-  const t = [];
-  for (let i = e; i <= r; i += 1) t.push(i);
-  return t;
+function p(t, s) {
+  const e = [];
+  for (let r = t; r <= s; r += 1) e.push(r);
+  return e;
 }
-function E(e, r, t) {
-  if (t * 2 + 5 >= e)
-    return p(1, e);
-  const m = Math.max(r - t, 1), s = Math.min(r + t, e), d = m > 2, a = s < e - 1;
+function E(t, s, e) {
+  if (e * 2 + 5 >= t)
+    return p(1, t);
+  const m = Math.max(s - e, 1), i = Math.min(s + e, t), d = m > 2, a = i < t - 1;
   if (!d && a) {
-    const c = t * 2 + 3;
-    return [...p(1, c), "end-ellipsis", e];
+    const c = e * 2 + 3;
+    return [...p(1, c), "end-ellipsis", t];
   }
   if (d && !a) {
-    const c = t * 2 + 3;
-    return [1, "start-ellipsis", ...p(e - c + 1, e)];
+    const c = e * 2 + 3;
+    return [1, "start-ellipsis", ...p(t - c + 1, t)];
   }
   return [
     1,
     "start-ellipsis",
-    ...p(m, s),
+    ...p(m, i),
     "end-ellipsis",
-    e
+    t
   ];
 }
-const A = (e) => o(
+const A = () => o(
   "inline-flex items-center justify-center rounded-md font-normal",
   "outline-none focus-visible:ring-3 focus-visible:ring-ring",
   "transition active:scale-[0.97] motion-reduce:transition-none motion-reduce:active:scale-100",
   "disabled:pointer-events-none disabled:opacity-40",
-  e === "sm" ? "size-7 text-xs" : "size-9 text-xs"
-), N = (e) => e === "sm" ? "w-auto gap-1.5 px-2" : "w-auto gap-1.5 px-2.5", F = j.forwardRef(
+  "size-6 text-xs"
+), N = (t) => t === "sm" ? "w-auto gap-1.5 px-2" : "w-auto gap-1.5 px-2.5", F = j.forwardRef(
   ({
-    className: e,
-    total: r,
-    page: t,
-    onChange: i,
+    className: t,
+    total: s,
+    page: e,
+    onChange: r,
     siblings: m = 1,
-    size: s = "md",
+    size: i = "md",
     summary: d,
     labels: a = !1,
     pageSize: c,
@@ -50,8 +50,8 @@ const A = (e) => o(
     onPageSizeChange: g,
     ...C
   }, y) => {
-    if (r <= 0) return null;
-    const P = E(r, t, m), R = t <= 1, S = t >= r, f = A(s), x = s === "sm" ? "size-3.5" : "size-4", h = c != null && !!g, b = d != null || h;
+    if (s <= 0) return null;
+    const P = E(s, e, m), R = e <= 1, S = e >= s, f = A(), x = i === "sm" ? "size-3.5" : "size-4", h = c != null && !!g, b = d != null || h;
     return /* @__PURE__ */ u(
       "nav",
       {
@@ -60,7 +60,7 @@ const A = (e) => o(
         className: o(
           "flex items-center",
           b ? "w-full justify-between gap-4" : "gap-1",
-          e
+          t
         ),
         ...C,
         children: [
@@ -88,7 +88,7 @@ const A = (e) => o(
                     M,
                     {
                       size: "sm",
-                      className: "w-18",
+                      className: "w-18 text-s font-normal",
                       placement: "top",
                       items: (w ?? [8, 16, 32]).map((n) => ({
                         label: String(n),
@@ -108,14 +108,14 @@ const A = (e) => o(
                   type: "button",
                   "aria-label": "Go to previous page",
                   disabled: R,
-                  onClick: () => i(t - 1),
+                  onClick: () => r(e - 1),
                   className: o(
                     f,
                     "text-foreground hover:bg-muted",
-                    a && N(s)
+                    a && N(i)
                   ),
                   children: [
-                    /* @__PURE__ */ l(k, { className: x, "aria-hidden": !0 }),
+                    /* @__PURE__ */ l(L, { className: x, "aria-hidden": !0 }),
                     a && "Prev"
                   ]
                 }
@@ -127,21 +127,21 @@ const A = (e) => o(
                     {
                       "aria-hidden": !0,
                       className: o(f, "text-muted-foreground"),
-                      children: /* @__PURE__ */ l(L, { className: x })
+                      children: /* @__PURE__ */ l(k, { className: x })
                     },
                     n
                   );
-                const v = n === t;
+                const v = n === e;
                 return /* @__PURE__ */ l(
                   "button",
                   {
                     type: "button",
                     "aria-label": `Go to page ${n}`,
                     "aria-current": v ? "page" : void 0,
-                    onClick: () => i(n),
+                    onClick: () => r(n),
                     className: o(
                       f,
-                      v ? "bg-foreground text-background" : "text-foreground hover:bg-muted"
+                      v ? "bg-ng10 text-white" : "text-foreground hover:bg-muted"
                     ),
                     children: n
                   },
@@ -154,11 +154,11 @@ const A = (e) => o(
                   type: "button",
                   "aria-label": "Go to next page",
                   disabled: S,
-                  onClick: () => i(t + 1),
+                  onClick: () => r(e + 1),
                   className: o(
                     f,
                     "text-foreground hover:bg-muted",
-                    a && N(s)
+                    a && N(i)
                   ),
                   children: [
                     a && "Next",

package/components/panel.js

@@ -1,13 +1,14 @@
 "use client";
-import { jsx as o } from "react/jsx-runtime";
-import * as l from "react";
-import { cn as n } from "../lib/cn.js";
-const s = l.forwardRef(
-  ({ className: e, ...a }, r) => /* @__PURE__ */ o(
+import { jsx as t } from "react/jsx-runtime";
+import * as n from "react";
+import { cn as o } from "../lib/cn.js";
+const l = n.forwardRef(
+  ({ className: e, ...a }, r) => /* @__PURE__ */ t(
     "div",
     {
       ref: r,
-      className: n(
+      "data-slot": "panel",
+      className: o(
         // Static surface — delineated by color alone (elevation is reserved for
         // actionable surfaces).
         "flex min-h-0 min-w-0 flex-col overflow-hidden rounded-lg bg-card",
@@ -17,55 +18,57 @@ const s = l.forwardRef(
     }
   )
 );
-s.displayName = "Panel";
-const t = l.forwardRef(
-  ({ className: e, ...a }, r) => /* @__PURE__ */ o(
+l.displayName = "Panel";
+const s = n.forwardRef(
+  ({ className: e, ...a }, r) => /* @__PURE__ */ t(
     "div",
     {
       ref: r,
-      className: n(
-        "flex h-[var(--panel-header-height)] shrink-0 items-center justify-between gap-2",
-        "border-b border-border bg-card px-3",
+      className: o(
+        "relative flex h-[var(--panel-header-height)] shrink-0 items-center justify-between gap-2",
+        "border-b-0 bg-card px-3",
+        "after:pointer-events-none after:absolute after:inset-x-0 after:bottom-0 after:h-px",
+        "after:bg-[linear-gradient(to_right,var(--color-border)_0%,transparent_100%)] after:content-['']",
         e
       ),
       ...a
     }
   )
 );
-t.displayName = "PanelHeader";
-const d = l.forwardRef(({ className: e, ...a }, r) => /* @__PURE__ */ o(
+s.displayName = "PanelHeader";
+const i = n.forwardRef(({ className: e, ...a }, r) => /* @__PURE__ */ t(
   "h2",
   {
     ref: r,
-    className: n("flex min-w-0 items-center gap-2 truncate text-xs font-medium text-foreground", e),
+    className: o("flex min-w-0 items-center gap-2 truncate text-xs font-medium text-foreground", e),
     ...a
   }
 ));
-d.displayName = "PanelTitle";
-const i = l.forwardRef(
-  ({ className: e, ...a }, r) => /* @__PURE__ */ o("div", { ref: r, className: n("flex shrink-0 items-center gap-1", e), ...a })
+i.displayName = "PanelTitle";
+const d = n.forwardRef(
+  ({ className: e, ...a }, r) => /* @__PURE__ */ t("div", { ref: r, className: o("flex shrink-0 items-center gap-1", e), ...a })
 );
-i.displayName = "PanelToolbar";
-const f = l.forwardRef(
-  ({ className: e, ...a }, r) => /* @__PURE__ */ o("div", { ref: r, tabIndex: 0, className: n("min-h-0 flex-1 overflow-auto p-4", e), ...a })
+d.displayName = "PanelToolbar";
+const f = n.forwardRef(
+  ({ className: e, ...a }, r) => /* @__PURE__ */ t("div", { ref: r, tabIndex: 0, className: o("min-h-0 flex-1 overflow-auto p-4", e), ...a })
 );
 f.displayName = "PanelBody";
-const m = l.forwardRef(
-  ({ className: e, ...a }, r) => /* @__PURE__ */ o(
+const m = n.forwardRef(
+  ({ className: e, ...a }, r) => /* @__PURE__ */ t(
     "div",
     {
       ref: r,
-      className: n("flex shrink-0 items-center gap-2 bg-surface/40 px-3 py-2", e),
+      className: o("flex shrink-0 items-center gap-2 bg-surface/40 px-3 py-2", e),
       ...a
     }
   )
 );
 m.displayName = "PanelFooter";
 export {
-  s as Panel,
+  l as Panel,
   f as PanelBody,
   m as PanelFooter,
-  t as PanelHeader,
-  d as PanelTitle,
-  i as PanelToolbar
+  s as PanelHeader,
+  i as PanelTitle,
+  d as PanelToolbar
 };

package/components/select.d.ts

@@ -8,6 +8,26 @@ export interface SelectItem {
     value: string;
     disabled?: boolean;
 }
+export interface DropdownOptionsProps {
+    items: SelectItem[];
+    value?: string;
+    values?: string[];
+    multiple?: boolean;
+    activeIndex?: number;
+    onActiveIndexChange?: (index: number) => void;
+    onItemSelect?: (index: number) => void;
+    placement?: "top" | "bottom";
+    id?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    "aria-label"?: string;
+}
+/**
+ * DropdownOptions — the reusable options surface composed by Select.
+ * It owns listbox semantics and the brand-green option interaction treatment;
+ * positioning and open/closed state stay with the parent Select.
+ */
+export declare const DropdownOptions: React.ForwardRefExoticComponent<DropdownOptionsProps & React.RefAttributes<HTMLUListElement>>;
 export interface SelectProps extends VariantProps<typeof selectTriggerVariants> {
     items: SelectItem[];
     value?: string;
@@ -15,6 +35,7 @@ export interface SelectProps extends VariantProps<typeof selectTriggerVariants>
     multiple?: boolean;
     values?: string[];
     onValuesChange?: (values: string[]) => void;
+    /** Empty-state trigger copy. Defaults to "Select" and inherits tertiary text. */
     placeholder?: string;
     disabled?: boolean;
     isInvalid?: boolean;