@actionexec/dashboards 0.5.4 → 0.5.5

package/dist/types/index.d.ts

@@ -61,7 +61,10 @@ export interface ChartAxisConfig {
     column: string;
     granularity: Granularity;
 }
-export interface KpiCardConfig {
+export interface WidgetFilterTargeting {
+    excludedFilters?: string[];
+}
+export interface KpiCardConfig extends WidgetFilterTargeting {
     label: string;
     format?: FormatType;
     column?: string;
@@ -73,7 +76,7 @@ export interface KpiCardConfig {
     comparison?: ComparisonConfig;
     filterExpression?: Record<string, unknown>;
 }
-export interface GaugeConfig {
+export interface GaugeConfig extends WidgetFilterTargeting {
     label: string;
     format?: FormatType;
     column?: string;
@@ -86,7 +89,7 @@ export interface GaugeConfig {
     outerAggregation?: AggregationType;
     filterExpression?: Record<string, unknown>;
 }
-export interface ChartConfig {
+export interface ChartConfig extends WidgetFilterTargeting {
     label: string;
     chartType?: ChartType;
     xAxis?: ChartAxisConfig;
@@ -196,6 +199,7 @@ export declare const NUMERIC_FORMAT_OPTIONS: [FormatType, string][];
 export declare const COMPARISON_LABELS: Record<ComparisonType, string>;
 export declare const CHART_TYPE_LABELS: Record<ChartType, string>;
 export declare const FILTER_TYPE_LABELS: Record<FilterType, string>;
+export declare const MULTI_VALUE_SEPARATOR = "\u001F";
 export declare const DEFAULT_GRID: Record<WidgetType, GridPosition>;
 export declare const DEFAULT_CONFIG: {
     [K in WidgetType]: Partial<WidgetConfigOf<K>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@actionexec/dashboards",
-  "version": "0.5.4",
+  "version": "0.5.5",
   "description": "Biblioteca de renderizacao de dashboards da plataforma Action — componente <Dashboard> unico, consumindo /external/dashboards.",
   "type": "module",
   "main": "./dist/index.js",

package/dist/index-BXIn44vr.js

@@ -1,603 +0,0 @@
-import { jsx as l, jsxs as h } from "react/jsx-runtime";
-import C from "react-datepicker";
-import { useState as N, useRef as P, useMemo as w, useEffect as $ } from "react";
-const k = "https://action-data-api-7mbrztperq-rj.a.run.app", R = "/external/dashboards";
-let v = k;
-function X(e) {
-  v = e.replace(/\/$/, "");
-}
-class F extends Error {
-  constructor(t, r, a) {
-    super(t), this.status = r, this.payload = a, this.name = "ApiError";
-  }
-}
-async function L(e, t, r) {
-  const a = new URL(`${v}${R}${e}`);
-  if (r)
-    for (const [n, i] of Object.entries(r)) a.searchParams.set(n, i);
-  const s = await fetch(a.toString(), {
-    headers: { Authorization: `Bearer ${t}` }
-  });
-  if (!s.ok) {
-    let n;
-    try {
-      n = await s.json();
-    } catch {
-    }
-    throw new F(
-      `Requisicao falhou (${s.status}) em ${e}`,
-      s.status,
-      n
-    );
-  }
-  return await s.json();
-}
-const Z = (e) => L("/layout", e), ee = (e, t) => L("/render", e, t), d = {
-  series0: 0,
-  series1: 1,
-  series2: 2,
-  series3: 3,
-  series4: 4,
-  bgDark: 5,
-  bgPaper: 6,
-  bgElevated: 7,
-  textPrimary: 8,
-  textMuted: 9,
-  accent: 10,
-  success: 11,
-  error: 12
-}, I = 5, E = 13, U = {
-  series0: "Série 1",
-  series1: "Série 2",
-  series2: "Série 3",
-  series3: "Série 4",
-  series4: "Série 5",
-  bgDark: "Fundo Escuro",
-  bgPaper: "Fundo Cartão",
-  bgElevated: "Fundo Elevado",
-  textPrimary: "Texto Primário",
-  textMuted: "Texto Secundário",
-  accent: "Destaque",
-  success: "Sucesso",
-  error: "Erro"
-}, y = {
-  action: {
-    label: "Action",
-    colors: [
-      "#ff6b00",
-      "#a3e635",
-      "#e3f544",
-      "#65ffd1",
-      "#ff0404",
-      "#1a1a1a",
-      "#262626",
-      "#333333",
-      "#f5f5f5",
-      "#999999",
-      "#ff6b00",
-      "#a3e635",
-      "#ef4444"
-    ]
-  },
-  westCoast: {
-    label: "West Coast",
-    colors: [
-      "#a3b86c",
-      "#c89b3c",
-      "#8b6f47",
-      "#6b8e23",
-      "#d2691e",
-      "#1f1a14",
-      "#2a241b",
-      "#3a3225",
-      "#e8dcc4",
-      "#a89878",
-      "#c89b3c",
-      "#a3b86c",
-      "#c44536"
-    ]
-  },
-  mono: {
-    label: "Monocromático",
-    colors: [
-      "#f8fafc",
-      "#cbd5e1",
-      "#94a3b8",
-      "#64748b",
-      "#475569",
-      "#0a0a0a",
-      "#171717",
-      "#262626",
-      "#fafafa",
-      "#a3a3a3",
-      "#e5e5e5",
-      "#cbd5e1",
-      "#ef4444"
-    ]
-  },
-  ocean: {
-    label: "Ocean",
-    colors: [
-      "#0ea5e9",
-      "#06b6d4",
-      "#0891b2",
-      "#3b82f6",
-      "#22d3ee",
-      "#0a1929",
-      "#0f2740",
-      "#173554",
-      "#e0f2fe",
-      "#7dd3fc",
-      "#22d3ee",
-      "#10b981",
-      "#f43f5e"
-    ]
-  },
-  princess: {
-    label: "Cute Pink",
-    colors: [
-      "#ff79bc",
-      "#a855f7",
-      "#f472b6",
-      "#d946ef",
-      "#fb7185",
-      "#fff0f6",
-      "#ffe4ec",
-      "#ffffff",
-      "#ff4099",
-      "#ffadd5",
-      "#ec4899",
-      "#10b981",
-      "#e11d48"
-    ]
-  }
-}, M = y.action.colors;
-function D(e) {
-  const t = M;
-  if (!e || e.length === 0) return [...t];
-  if (e.length >= E) return e.slice(0, E);
-  const r = [...e];
-  for (let a = e.length; a < E; a++) r.push(t[a]);
-  return r;
-}
-function Y(e) {
-  return D(e).slice(0, I);
-}
-function te(e) {
-  const t = D(e);
-  return {
-    "--bg-dark": t[d.bgDark],
-    "--bg-paper": t[d.bgPaper],
-    "--bg-elevated": t[d.bgElevated],
-    "--text-primary": t[d.textPrimary],
-    "--text-secondary": t[d.textMuted],
-    "--text-muted": t[d.textMuted],
-    "--action-orange": t[d.accent],
-    "--action-green": t[d.success],
-    "--color-success": t[d.success],
-    "--color-error": t[d.error],
-    "--color-info": t[d.series2],
-    "--color-warning": t[d.series3]
-  };
-}
-const ae = [
-  "Jan",
-  "Fev",
-  "Mar",
-  "Abr",
-  "Mai",
-  "Jun",
-  "Jul",
-  "Ago",
-  "Set",
-  "Out",
-  "Nov",
-  "Dez"
-], re = [
-  "Janeiro",
-  "Fevereiro",
-  "Marco",
-  "Abril",
-  "Maio",
-  "Junho",
-  "Julho",
-  "Agosto",
-  "Setembro",
-  "Outubro",
-  "Novembro",
-  "Dezembro"
-];
-function se(e) {
-  return { start: `${e}-01-01`, end: `${e}-12-31` };
-}
-function ne(e) {
-  if (!e) return null;
-  const t = e.match(/^(\d{4})/);
-  return t ? { year: parseInt(t[1]) } : null;
-}
-function oe(e, t) {
-  const r = new Date(e, t, 0).getDate(), a = (s) => String(s).padStart(2, "0");
-  return {
-    start: `${e}-${a(t)}-01`,
-    end: `${e}-${a(t)}-${a(r)}`
-  };
-}
-function x(e) {
-  const t = new Date(Date.UTC(e.getFullYear(), e.getMonth(), e.getDate()));
-  t.setUTCDate(t.getUTCDate() + 4 - (t.getUTCDay() || 7));
-  const r = new Date(Date.UTC(t.getUTCFullYear(), 0, 1));
-  return Math.ceil(((t.getTime() - r.getTime()) / 864e5 + 1) / 7);
-}
-function ce(e, t) {
-  const r = new Date(e, 0, 4), a = (r.getDay() + 6) % 7, s = new Date(r.getTime() - a * 864e5), n = new Date(s.getTime() + (t - 1) * 7 * 864e5), i = new Date(n.getTime() + 6 * 864e5), f = (g) => String(g).padStart(2, "0"), p = (g) => `${g.getFullYear()}-${f(g.getMonth() + 1)}-${f(g.getDate())}`;
-  return { start: p(n), end: p(i) };
-}
-function le(e, t) {
-  const r = /* @__PURE__ */ new Set(), a = new Date(e, t, 0).getDate();
-  for (let s = 1; s <= a; s++)
-    r.add(x(new Date(e, t - 1, s)));
-  return Array.from(r).sort((s, n) => s - n);
-}
-function ie(e, t) {
-  const r = new Date(e, t, 0).getDate(), a = (f) => String(f).padStart(2, "0"), s = [];
-  let n = 1, i = 1;
-  for (; n <= r; ) {
-    const f = n, p = Math.min(n + 6, r), g = `${e}-${a(t)}-${a(f)}`, o = `${e}-${a(t)}-${a(p)}`, u = `${i}° Semana (${a(f)}/${a(t)} - ${a(p)}/${a(t)})`;
-    s.push({ index: i, startDay: f, endDay: p, start: g, end: o, label: u }), n = p + 1, i++;
-  }
-  return s;
-}
-function ue(e, t, r) {
-  if (!e) return 1;
-  const a = (i) => String(i).padStart(2, "0"), s = e.match(new RegExp(`^${t}-${a(r)}-(\\d{2})`));
-  if (!s) return 1;
-  const n = parseInt(s[1]);
-  return Math.ceil(n / 7);
-}
-function de(e) {
-  if (!e) return null;
-  const t = e.match(/^(\d{4})-(\d{2})/);
-  return t ? { year: parseInt(t[1]), month: parseInt(t[2]) } : null;
-}
-function fe(e) {
-  if (!e) return null;
-  const t = /* @__PURE__ */ new Date(e + "T00:00:00");
-  return isNaN(t.getTime()) ? null : { year: t.getFullYear(), week: x(t) };
-}
-function ge(e) {
-  const t = /* @__PURE__ */ new Date(), r = e != null && e.min ? parseInt(e.min.slice(0, 4)) : t.getFullYear() - 2, a = e != null && e.max ? parseInt(e.max.slice(0, 4)) : t.getFullYear(), s = [];
-  for (let n = a; n >= r; n--) s.push(n);
-  return s;
-}
-function T(e) {
-  if (!e) return null;
-  const [t, r, a] = e.split("-").map(Number);
-  return !t || !r || !a ? null : new Date(t, r - 1, a);
-}
-function G(e) {
-  if (!e) return "";
-  const t = e.getFullYear(), r = String(e.getMonth() + 1).padStart(2, "0"), a = String(e.getDate()).padStart(2, "0");
-  return `${t}-${r}-${a}`;
-}
-function pe({
-  value: e,
-  onChange: t,
-  minIso: r,
-  maxIso: a,
-  placeholder: s,
-  selectsStart: n,
-  selectsEnd: i,
-  startIso: f,
-  endIso: p,
-  className: g,
-  disabled: o
-}) {
-  return /* @__PURE__ */ l("div", { className: `ddp-field ${g ?? ""}`, children: /* @__PURE__ */ l(
-    C,
-    {
-      selected: T(e),
-      onChange: (u) => t(G(u)),
-      selectsStart: n,
-      selectsEnd: i,
-      startDate: T(f) ?? void 0,
-      endDate: T(p) ?? void 0,
-      minDate: T(r) ?? void 0,
-      maxDate: T(a) ?? void 0,
-      dateFormat: "dd/MM/yyyy",
-      placeholderText: s ?? "Selecione...",
-      disabled: o,
-      portalId: "ddp-portal",
-      popperPlacement: "bottom-start",
-      popperModifiers: [
-        {
-          name: "flip",
-          options: { fallbackPlacements: ["bottom-end", "top-start", "top-end"] },
-          fn: (u) => u
-        }
-      ]
-    }
-  ) });
-}
-function me({ options: e, value: t, multi: r, onChange: a, placeholder: s }) {
-  const [n, i] = N(!1), [f, p] = N(""), g = P(null), o = w(
-    () => t ? t.split(",").filter(Boolean) : [],
-    [t]
-  ), u = w(() => {
-    const c = f.trim().toLowerCase();
-    return c ? e.filter((S) => S.toLowerCase().includes(c)) : e;
-  }, [e, f]);
-  $(() => {
-    if (!n) return;
-    const c = (S) => {
-      g.current && !g.current.contains(S.target) && i(!1);
-    };
-    return document.addEventListener("mousedown", c), () => document.removeEventListener("mousedown", c);
-  }, [n]);
-  const m = (c) => {
-    a(c), p(""), i(!1);
-  }, b = (c) => {
-    const S = o.includes(c) ? o.filter((A) => A !== c) : [...o, c];
-    a(S.join(","));
-  }, _ = r ? o.length > 0 : !!t, O = r ? o.length > 0 ? `${o.length} selecionado(s)` : s || "Todos" : t || s || "Todos";
-  return /* @__PURE__ */ h("div", { ref: g, className: "widget-filter__search", children: [
-    /* @__PURE__ */ h(
-      "button",
-      {
-        type: "button",
-        className: "widget-filter__search-trigger",
-        onClick: () => i((c) => !c),
-        children: [
-          /* @__PURE__ */ l("span", { className: `widget-filter__search-value${_ ? "" : " is-placeholder"}`, children: O }),
-          /* @__PURE__ */ l("span", { className: "widget-filter__search-caret", "aria-hidden": !0, children: "▾" })
-        ]
-      }
-    ),
-    n && /* @__PURE__ */ h("div", { className: "widget-filter__search-panel", children: [
-      /* @__PURE__ */ l(
-        "input",
-        {
-          type: "text",
-          className: "widget-filter__search-input",
-          autoFocus: !0,
-          value: f,
-          placeholder: "Buscar...",
-          onChange: (c) => p(c.target.value)
-        }
-      ),
-      /* @__PURE__ */ h("div", { className: "widget-filter__search-list", children: [
-        !r && /* @__PURE__ */ l(
-          "button",
-          {
-            type: "button",
-            className: `widget-filter__search-option${t ? "" : " is-selected"}`,
-            onClick: () => m(""),
-            children: "Todos"
-          }
-        ),
-        u.length === 0 ? /* @__PURE__ */ l("span", { className: "widget-filter__search-empty", children: "Nenhuma opção" }) : u.map(
-          (c) => r ? /* @__PURE__ */ h("label", { className: "widget-filter__search-option", children: [
-            /* @__PURE__ */ l(
-              "input",
-              {
-                type: "checkbox",
-                checked: o.includes(c),
-                onChange: () => b(c)
-              }
-            ),
-            c
-          ] }, c) : /* @__PURE__ */ l(
-            "button",
-            {
-              type: "button",
-              className: `widget-filter__search-option${t === c ? " is-selected" : ""}`,
-              onClick: () => m(c),
-              children: c
-            },
-            c
-          )
-        )
-      ] })
-    ] })
-  ] });
-}
-const W = [
-  d.bgDark,
-  d.bgPaper,
-  d.bgElevated,
-  d.accent,
-  d.success
-];
-function j(e) {
-  if (!e) return !0;
-  const t = D(e);
-  return Object.values(y).some(
-    (r) => JSON.stringify(r.colors) === JSON.stringify(t)
-  );
-}
-const J = [
-  { label: "Series", slots: ["series0", "series1", "series2", "series3", "series4"] },
-  { label: "Tema", slots: ["bgDark", "bgPaper", "bgElevated", "textPrimary", "textMuted"] },
-  { label: "Estados", slots: ["accent", "success", "error"] }
-];
-function he({
-  selected: e,
-  onSelect: t,
-  customMode: r,
-  onCustomModeChange: a,
-  disabled: s
-}) {
-  var g;
-  const n = r ?? !j(e), i = D(e), f = n || (g = Object.entries(y).find(
-    ([, o]) => JSON.stringify(o.colors) === JSON.stringify(i)
-  )) == null ? void 0 : g[0], p = (o, u) => {
-    const m = [...i];
-    for (; m.length < E; ) m.push("#000000");
-    m[o] = u, t(m);
-  };
-  return /* @__PURE__ */ h("div", { className: `palette-selector ${s ? "palette-selector--disabled" : ""}`, children: [
-    a && /* @__PURE__ */ h("label", { className: "config-panel__checkbox", children: [
-      /* @__PURE__ */ l(
-        "input",
-        {
-          type: "checkbox",
-          checked: n,
-          onChange: (o) => a(o.target.checked),
-          disabled: s
-        }
-      ),
-      "Customizar"
-    ] }),
-    n ? /* @__PURE__ */ l("div", { className: "palette-selector__custom", children: J.map((o) => /* @__PURE__ */ h("div", { className: "palette-selector__row", children: [
-      /* @__PURE__ */ l("span", { className: "palette-selector__row-label", children: o.label }),
-      /* @__PURE__ */ l("div", { className: "palette-selector__row-slots", children: o.slots.map((u) => {
-        const m = d[u];
-        return /* @__PURE__ */ l(
-          "input",
-          {
-            type: "color",
-            className: "palette-selector__color-input",
-            value: i[m] || "#000000",
-            onChange: (b) => p(m, b.target.value),
-            disabled: s,
-            title: U[u]
-          },
-          u
-        );
-      }) })
-    ] }, o.label)) }) : /* @__PURE__ */ l("div", { className: "palette-selector__options", children: Object.entries(y).map(([o, u]) => {
-      const m = D(u.colors);
-      return /* @__PURE__ */ h(
-        "button",
-        {
-          className: `palette-selector__option ${f === o ? "palette-selector__option--active" : ""}`,
-          onClick: () => t(u.colors),
-          disabled: s,
-          children: [
-            /* @__PURE__ */ l("div", { className: "palette-selector__bar", children: Y(u.colors).map((b, _) => /* @__PURE__ */ l(
-              "span",
-              {
-                className: "palette-selector__swatch",
-                style: { backgroundColor: b }
-              },
-              _
-            )) }),
-            /* @__PURE__ */ l("div", { className: "palette-selector__bar palette-selector__bar--theme", children: W.map((b, _) => /* @__PURE__ */ l(
-              "span",
-              {
-                className: "palette-selector__swatch",
-                style: { backgroundColor: m[b] }
-              },
-              _
-            )) }),
-            /* @__PURE__ */ l("span", { className: "palette-selector__label", children: u.label })
-          ]
-        },
-        o
-      );
-    }) })
-  ] });
-}
-const z = M, q = 30, H = 10, be = {
-  gridColumns: q,
-  gridRows: H,
-  widgets: []
-}, _e = {
-  kpi_card: "KPI Card",
-  gauge: "Gauge",
-  chart: "Gráfico",
-  filter: "Filtro",
-  variable: "Variável",
-  color_palette: "Paleta de Cores"
-}, Se = ["kpi_card", "gauge", "chart"], Te = ["filter", "variable", "color_palette"], De = /* @__PURE__ */ new Set(["filter", "variable", "color_palette"]), Ee = {
-  sum: "Soma",
-  avg: "Média",
-  count: "Contagem",
-  min: "Mínimo",
-  max: "Máximo",
-  count_distinct: "Contagem Distinta"
-}, V = {
-  currency: "Moeda (R$)",
-  number: "Número",
-  integer: "Inteiro",
-  percentage: "Porcentagem",
-  date: "Data",
-  text: "Texto"
-}, ye = Object.entries(V).filter(([e]) => e !== "date" && e !== "text"), Ne = {
-  yoy: "vs Ano Anterior",
-  mom: "vs Mês Anterior",
-  target: "vs Meta",
-  none: "Nenhuma"
-}, we = {
-  bar: "Barras",
-  line: "Linhas",
-  area: "Área",
-  pie: "Pizza"
-}, ve = {
-  date_range: "Periodo",
-  select: "Seleção Única",
-  multi_select: "Seleção Múltipla"
-}, Le = {
-  kpi_card: { x: 0, y: 0, w: 6, h: 3 },
-  gauge: { x: 0, y: 0, w: 6, h: 5 },
-  chart: { x: 0, y: 0, w: 6, h: 6 },
-  filter: { x: 0, y: 0, w: 4, h: 2 },
-  variable: { x: 0, y: 0, w: 4, h: 2 },
-  color_palette: { x: 0, y: 0, w: 4, h: 2 }
-}, Me = {
-  kpi_card: { label: "Novo KPI", aggregation: "sum", format: "number" },
-  gauge: { label: "Novo Gauge", aggregation: "sum" },
-  chart: { label: "Novo Grafico", chartType: "bar", xAxis: { column: "", granularity: "day" }, series: [] },
-  filter: { label: "Novo Filtro", filterType: "select" },
-  variable: { label: "Nova Variavel", variableValue: 0, variableFormat: "number", locked: !1 },
-  color_palette: { label: "Paleta de Cores", paletteColors: z, locked: !1 }
-};
-export {
-  Ee as A,
-  ge as B,
-  we as C,
-  Se as D,
-  be as E,
-  ve as F,
-  T as G,
-  de as H,
-  ue as I,
-  fe as J,
-  ne as K,
-  X as L,
-  re as M,
-  ye as N,
-  Z as O,
-  y as P,
-  ee as Q,
-  F as R,
-  I as S,
-  E as T,
-  _e as W,
-  Ne as a,
-  De as b,
-  Te as c,
-  he as d,
-  Me as e,
-  Le as f,
-  q as g,
-  H as h,
-  z as i,
-  M as j,
-  pe as k,
-  V as l,
-  ae as m,
-  d as n,
-  U as o,
-  me as p,
-  G as q,
-  D as r,
-  se as s,
-  x as t,
-  oe as u,
-  ie as v,
-  te as w,
-  Y as x,
-  ce as y,
-  le as z
-};
-//# sourceMappingURL=index-BXIn44vr.js.map