@actioneer/ads 0.6.0 → 0.8.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-wg10 text-brand-foreground" : "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/pixel-blast-svg.js

@@ -1,19 +1,19 @@
 "use client";
 import { jsx as u } from "react/jsx-runtime";
 import * as c from "react";
-import { ditheringFragmentShader as g, getShaderColorFromString as M, ShaderFitOptions as N, DitheringTypes as L, DitheringShapes as m } from "@paper-design/shaders";
-import { ShaderMount as F } from "@paper-design/shaders-react";
-import { useReducedMotion as I } from "motion/react";
-import { cn as P } from "../lib/cn.js";
-const z = {
+import { ditheringFragmentShader as h, getShaderColorFromString as T, ShaderFitOptions as P, DitheringTypes as z, DitheringShapes as g } from "@paper-design/shaders";
+import { ShaderMount as D } from "@paper-design/shaders-react";
+import { useReducedMotion as F } from "motion/react";
+import { cn as L } from "../lib/cn.js";
+const A = {
   alpha: !0,
   antialias: !1,
   depth: !1,
   powerPreference: "low-power",
   preserveDrawingBuffer: !1
-}, O = 1e6, B = `uniform float u_type;
+}, B = 1e6, b = `uniform float u_type;
 uniform float u_patternDensity;
-uniform float u_pixelSizeJitter;`, k = "  float res = step(.5, shape + dithering);", G = `  vec2 triangleUV = fract(pxSizeUV);
+uniform float u_pixelSizeJitter;`, V = "  float res = step(.5, shape + dithering);", G = `  vec2 triangleUV = fract(pxSizeUV);
   vec2 triangleCell = floor(pxSizeUV);
   float triangleFlip = mod(triangleCell.x + triangleCell.y, 2.0);
   triangleUV.x = mix(triangleUV.x, 1.0 - triangleUV.x, triangleFlip);
@@ -29,61 +29,59 @@ uniform float u_pixelSizeJitter;`, k = "  float res = step(.5, shape + dithering
   float triangleMask = 1.0 - step(1.0, triangleDiagonal);
   float densityThreshold = 0.5 - (u_patternDensity - 1.0) * 0.12;
   float res = step(densityThreshold, shape + dithering) * triangleMask;`;
-if (!g.includes("uniform float u_type;") || !g.includes(k))
+if (!h.includes("uniform float u_type;") || !h.includes(V))
   throw new Error("The Paper dithering shader no longer exposes the expected cell output.");
-const b = g.replace("uniform float u_type;", B).replace(k, G), d = (e) => Math.max(0, Math.min(1, e)), J = "#202020", W = "#ffffff";
-function X(e, t) {
-  if (typeof document > "u") return t;
-  const r = (o, i = 0) => {
-    if (i > 4) return o;
-    const n = o.trim(), a = n.match(/^var\((--[\w-]+)(?:,\s*(.+))?\)$/);
-    if (!a) return n;
-    const s = getComputedStyle(document.documentElement).getPropertyValue(a[1]).trim();
-    return s ? r(s, i + 1) : a[2] ? r(a[2], i + 1) : t;
+const O = h.replace("uniform float u_type;", b).replace(V, G), d = (e) => Math.max(0, Math.min(1, e));
+function J(e) {
+  if (typeof document > "u") return null;
+  const t = (r, o = 0) => {
+    if (o > 4) return r;
+    const i = r.trim(), a = i.match(/^var\((--[\w-]+)(?:,\s*(.+))?\)$/);
+    if (!a) return i;
+    const l = getComputedStyle(document.documentElement).getPropertyValue(a[1]).trim();
+    return l ? t(l, o + 1) : a[2] ? t(a[2], o + 1) : null;
   };
-  return r(e) || t;
+  return t(e);
 }
-function E(e, t) {
-  const [r, o] = c.useState(
-    () => e.startsWith("var(") ? t : e
+function k(e) {
+  const [t, r] = c.useState(
+    () => e.startsWith("var(") ? null : e
   );
   return c.useEffect(() => {
-    o(X(e, t));
-  }, [t, e]), r;
+    r(J(e));
+  }, [e]), t;
 }
-const $ = c.forwardRef(
+const W = c.forwardRef(
   ({
     variant: e = "custom",
     color: t = "var(--texture-ink)",
     pixelSize: r = 7,
     speed: o = 3,
     patternScale: i = 3,
-    patternDensity: n = 1.8,
-    pixelSizeJitter: a = 0.5,
-    enableRipples: s = !1,
-    liquid: p = !1,
-    toneAmount: h = 0,
-    edgeFade: R = 0.25,
-    transparent: f = !0,
-    backgroundColor: _ = "var(--color-background)",
-    paused: x = !1,
-    className: V,
-    style: D
-  }, w) => {
-    const S = I(), U = E(t, J), C = E(
-      _,
-      W
-    ), l = d(R) * 100, T = `linear-gradient(to right, transparent 0%, black ${l}%, black ${100 - l}%, transparent 100%)`, v = `linear-gradient(to bottom, transparent 0%, black ${l}%, black ${100 - l}%, transparent 100%)`, A = c.useMemo(() => {
-      const y = M(U);
-      return y[3] *= 1 - d(h), {
-        u_colorBack: f ? [0, 0, 0, 0] : M(C),
-        u_colorFront: y,
-        u_shape: s ? m.ripple : p ? m.warp : m.simplex,
-        u_type: L["4x4"],
+    patternDensity: a = 1.8,
+    pixelSizeJitter: l = 0.5,
+    enableRipples: p = !1,
+    liquid: _ = !1,
+    toneAmount: x = 0,
+    edgeFade: E = 0.25,
+    transparent: n = !0,
+    backgroundColor: v = "var(--color-background)",
+    paused: S = !1,
+    className: N,
+    style: R
+  }, I) => {
+    const y = F(), f = k(t), m = k(v), s = d(E) * 100, C = `linear-gradient(to right, transparent 0%, var(--color-wg12) ${s}%, var(--color-wg12) ${100 - s}%, transparent 100%)`, M = `linear-gradient(to bottom, transparent 0%, var(--color-wg12) ${s}%, var(--color-wg12) ${100 - s}%, transparent 100%)`, U = c.useMemo(() => {
+      if (!f || !n && !m) return null;
+      const w = T(f);
+      return w[3] *= 1 - d(x), {
+        u_colorBack: n ? [0, 0, 0, 0] : T(m),
+        u_colorFront: w,
+        u_shape: p ? g.ripple : _ ? g.warp : g.simplex,
+        u_type: z["4x4"],
         u_pxSize: Math.max(1, r),
-        u_patternDensity: Math.max(0.1, n),
-        u_pixelSizeJitter: d(a),
-        u_fit: N.none,
+        u_patternDensity: Math.max(0.1, a),
+        u_pixelSizeJitter: d(l),
+        u_fit: P.none,
         u_scale: Math.max(0.01, i),
         u_rotation: 0,
         u_offsetX: 0,
@@ -94,52 +92,52 @@ const $ = c.forwardRef(
         u_worldHeight: 0
       };
     }, [
-      s,
       p,
-      n,
+      _,
+      a,
       i,
       r,
-      a,
-      C,
-      U,
-      h,
-      f
+      l,
+      m,
+      f,
+      x,
+      n
     ]);
     return /* @__PURE__ */ u(
       "div",
       {
-        ref: w,
+        ref: I,
         "aria-hidden": !0,
-        "data-shader-paused": x || S ? "true" : "false",
-        className: P("pixel-blast-svg", V),
+        "data-shader-paused": S || y ? "true" : "false",
+        className: L("pixel-blast-svg", N),
         style: {
-          ...D,
-          background: f ? "transparent" : _
+          ...R,
+          background: n ? "transparent" : v
         },
         children: /* @__PURE__ */ u(
           "div",
           {
             className: "size-full",
-            style: { WebkitMaskImage: T, maskImage: T },
+            style: { WebkitMaskImage: C, maskImage: C },
             children: /* @__PURE__ */ u(
               "div",
               {
                 className: "size-full",
-                style: { WebkitMaskImage: v, maskImage: v },
-                children: /* @__PURE__ */ u(
-                  F,
+                style: { WebkitMaskImage: M, maskImage: M },
+                children: U ? /* @__PURE__ */ u(
+                  D,
                   {
                     className: "size-full",
                     width: "100%",
                     height: "100%",
-                    fragmentShader: b,
-                    uniforms: A,
-                    speed: x || S ? 0 : o,
+                    fragmentShader: O,
+                    uniforms: U,
+                    speed: S || y ? 0 : o,
                     minPixelRatio: 1,
-                    maxPixelCount: O,
-                    webGlContextAttributes: z
+                    maxPixelCount: B,
+                    webGlContextAttributes: A
                   }
-                )
+                ) : null
               }
             )
           }
@@ -148,7 +146,7 @@ const $ = c.forwardRef(
     );
   }
 );
-$.displayName = "PixelBlastSVG";
+W.displayName = "PixelBlastSVG";
 export {
-  $ as PixelBlastSVG
+  W as PixelBlastSVG
 };

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;