@rojaostudio/ds 1.0.2 → 2.0.0-next.1

package/dist/components/toaster.js

@@ -1,290 +0,0 @@
-"use client";
-import {
-  __spreadProps,
-  __spreadValues
-} from "../chunk-ORMEWXMH.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useEffect, useRef, useState, useCallback } from "react";
-import { createPortal } from "react-dom";
-import { Loader2, X, Check, AlertTriangle, Info } from "lucide-react";
-const listeners = /* @__PURE__ */ new Set();
-function emit(a) {
-  for (const l of listeners) l(a);
-}
-let counter = 0;
-function genId() {
-  counter += 1;
-  return `t${Date.now()}_${counter}`;
-}
-function defaultDuration(variant, hasAction) {
-  if (variant === "loading") return 0;
-  if (hasAction || variant === "error") return 2750;
-  return 1500;
-}
-function show(message, options = {}) {
-  var _a, _b, _c;
-  const id = (_a = options.id) != null ? _a : genId();
-  const variant = (_b = options.variant) != null ? _b : "default";
-  const hasAction = !!options.action;
-  emit({
-    type: "show",
-    toast: {
-      id,
-      message,
-      description: options.description,
-      variant,
-      duration: (_c = options.duration) != null ? _c : defaultDuration(variant, hasAction),
-      action: options.action
-    }
-  });
-  return id;
-}
-const base = (msg, opts) => show(msg, opts);
-const toast = Object.assign(base, {
-  success: (m, o) => show(m, __spreadProps(__spreadValues({}, o), { variant: "success" })),
-  error: (m, o) => show(m, __spreadProps(__spreadValues({}, o), { variant: "error" })),
-  warning: (m, o) => show(m, __spreadProps(__spreadValues({}, o), { variant: "warning" })),
-  info: (m, o) => show(m, __spreadProps(__spreadValues({}, o), { variant: "info" })),
-  loading: (m, o) => show(m, __spreadProps(__spreadValues({}, o), { variant: "loading" })),
-  dismiss: (id) => {
-    if (id) emit({ type: "dismiss", id });
-    else listeners.forEach((l) => l({ type: "dismiss", id: "*" }));
-  },
-  promise: async (promise, msgs) => {
-    const id = show(msgs.loading, { variant: "loading" });
-    try {
-      const data = await promise;
-      const m = typeof msgs.success === "function" ? msgs.success(data) : msgs.success;
-      emit({ type: "update", id, patch: { variant: "success", message: m, duration: defaultDuration("success", false) } });
-      return data;
-    } catch (err) {
-      const m = typeof msgs.error === "function" ? msgs.error(err) : msgs.error;
-      emit({ type: "update", id, patch: { variant: "error", message: m, duration: defaultDuration("error", false) } });
-      throw err;
-    }
-  }
-});
-const VARIANT_COLOR = {
-  success: "var(--success)",
-  error: "var(--danger)",
-  warning: "var(--warning)",
-  info: "var(--info)"
-};
-function containerStyle(variant) {
-  const c = VARIANT_COLOR[variant];
-  return {
-    background: c ? `linear-gradient(105deg, color-mix(in srgb, ${c} 16%, var(--toast-bg)) 0%, var(--toast-bg) 60%)` : "var(--toast-bg)",
-    color: "var(--toast-text)"
-  };
-}
-const VARIANT_ICON = {
-  default: null,
-  success: Check,
-  error: X,
-  warning: AlertTriangle,
-  info: Info,
-  loading: Loader2
-};
-function ToastVisual({
-  message,
-  description,
-  variant = "default",
-  action,
-  animate = false,
-  origin = "bottom",
-  dismissible,
-  onDismiss
-}) {
-  const isError = variant === "error";
-  const isLoading = variant === "loading";
-  const hasAction = !!action;
-  const showClose = dismissible != null ? dismissible : !hasAction && !isLoading;
-  const animClass = animate ? origin === "top" ? "rojao-toast--enter-top" : "rojao-toast--enter-bottom" : "";
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      role: isError ? "alert" : "status",
-      className: [
-        "rojao-toast",
-        "flex items-center gap-3 px-4 py-3 shadow-lg",
-        "min-w-[344px] max-w-[min(560px,calc(100vw-2rem))]",
-        animClass
-      ].join(" "),
-      style: __spreadProps(__spreadValues({}, containerStyle(variant)), {
-        border: "1px solid var(--toast-border)",
-        borderRadius: "var(--radius-toast)",
-        minHeight: "56px",
-        fontFamily: "var(--font-family)"
-      }),
-      children: [
-        (() => {
-          const Icon = VARIANT_ICON[variant];
-          if (!Icon) return null;
-          if (isLoading) {
-            return /* @__PURE__ */ jsx(
-              Icon,
-              {
-                size: 18,
-                className: "shrink-0 animate-spin",
-                style: { color: "var(--toast-text-muted)" }
-              }
-            );
-          }
-          const c = VARIANT_COLOR[variant];
-          return /* @__PURE__ */ jsx(
-            "span",
-            {
-              "aria-hidden": "true",
-              className: "grid place-items-center rounded-full shrink-0 size-9",
-              style: {
-                background: c,
-                color: `color-mix(in srgb, ${c} 30%, black)`,
-                boxShadow: `0 0 0 5px color-mix(in srgb, ${c} 18%, transparent)`
-              },
-              children: /* @__PURE__ */ jsx(Icon, { size: 18, strokeWidth: 2.75 })
-            }
-          );
-        })(),
-        /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
-          /* @__PURE__ */ jsx("p", { className: description ? "text-[0.9375rem] font-semibold leading-snug" : "text-label leading-snug", children: message }),
-          description && /* @__PURE__ */ jsx("p", { className: "text-label leading-snug mt-0.5", style: { color: "var(--toast-text-muted)" }, children: description })
-        ] }),
-        hasAction ? /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            onClick: action.onClick,
-            className: "shrink-0 text-label font-medium px-2 -mr-1 transition-opacity hover:opacity-80",
-            style: { color: "currentColor" },
-            children: action.label
-          }
-        ) : showClose && /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            onClick: onDismiss,
-            "aria-label": "Fechar",
-            className: "shrink-0 opacity-60 hover:opacity-100 transition-opacity",
-            style: { color: "currentColor" },
-            children: /* @__PURE__ */ jsx(X, { size: 16 })
-          }
-        )
-      ]
-    }
-  );
-}
-const POSITION_CLASS = {
-  "top-left": "top-4 left-4",
-  "top-center": "top-4 left-1/2 -translate-x-1/2",
-  "top-right": "top-4 right-4",
-  "bottom-left": "bottom-4 left-4",
-  "bottom-center": "bottom-4 left-1/2 -translate-x-1/2",
-  "bottom-right": "bottom-4 right-4"
-};
-function Toaster({ position = "bottom-center" } = {}) {
-  const [current, setCurrent] = useState(null);
-  const [mounted, setMounted] = useState(false);
-  const timerRef = useRef(null);
-  useEffect(() => {
-    setMounted(true);
-  }, []);
-  const clearTimer = useCallback(() => {
-    if (timerRef.current) {
-      clearTimeout(timerRef.current);
-      timerRef.current = null;
-    }
-  }, []);
-  const startExit = useCallback((id) => {
-    clearTimer();
-    setCurrent((prev) => prev && prev.id === id ? __spreadProps(__spreadValues({}, prev), { exiting: true }) : prev);
-    setTimeout(() => {
-      setCurrent((prev) => prev && prev.id === id ? null : prev);
-    }, 75);
-  }, [clearTimer]);
-  const scheduleDismiss = useCallback((t2) => {
-    if (t2.duration <= 0) return;
-    timerRef.current = setTimeout(() => startExit(t2.id), t2.duration);
-  }, [startExit]);
-  const currentRef = useRef(null);
-  currentRef.current = current;
-  useEffect(() => {
-    const listener = (action) => {
-      var _a, _b, _c;
-      if (action.type === "show") {
-        clearTimer();
-        setCurrent(action.toast);
-        scheduleDismiss(action.toast);
-      } else if (action.type === "update") {
-        setCurrent((prev) => {
-          if (!prev || prev.id !== action.id) return prev;
-          const next = __spreadProps(__spreadValues(__spreadValues({}, prev), action.patch), { exiting: false });
-          clearTimer();
-          if (next.duration > 0) {
-            timerRef.current = setTimeout(() => startExit(next.id), next.duration);
-          }
-          return next;
-        });
-      } else if (action.type === "dismiss") {
-        if (action.id === "*") startExit((_b = (_a = currentRef.current) == null ? void 0 : _a.id) != null ? _b : "");
-        else if (((_c = currentRef.current) == null ? void 0 : _c.id) === action.id) startExit(action.id);
-      }
-    };
-    listeners.add(listener);
-    return () => {
-      listeners.delete(listener);
-      clearTimer();
-    };
-  }, [clearTimer, scheduleDismiss, startExit]);
-  const handleMouseEnter = () => clearTimer();
-  const handleMouseLeave = () => {
-    if (current && !current.exiting) scheduleDismiss(current);
-  };
-  if (!mounted || !current) return null;
-  const t = current;
-  const isError = t.variant === "error";
-  const ariaLive = isError ? "assertive" : "polite";
-  const isTop = position.startsWith("top-");
-  const exitClass = t.exiting ? isTop ? "rojao-toast--exit-top" : "rojao-toast--exit-bottom" : "";
-  return createPortal(
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        "aria-live": ariaLive,
-        "aria-atomic": "true",
-        className: ["fixed z-[9999] pointer-events-none", POSITION_CLASS[position]].join(" "),
-        children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            onMouseEnter: handleMouseEnter,
-            onMouseLeave: handleMouseLeave,
-            className: ["pointer-events-auto", exitClass].join(" "),
-            children: /* @__PURE__ */ jsx(
-              ToastVisual,
-              {
-                message: t.message,
-                description: t.description,
-                variant: t.variant,
-                action: t.action ? {
-                  label: t.action.label,
-                  onClick: () => {
-                    t.action.onClick();
-                    startExit(t.id);
-                  }
-                } : void 0,
-                animate: !t.exiting,
-                origin: isTop ? "top" : "bottom",
-                onDismiss: () => startExit(t.id)
-              }
-            )
-          }
-        )
-      }
-    ),
-    document.body
-  );
-}
-export {
-  ToastVisual,
-  Toaster,
-  toast
-};

package/dist/components/use-dismiss.d.ts

@@ -1,9 +0,0 @@
-import { RefObject } from 'react';
-
-/**
- * useDismiss — outside-click + ESC para overlays (dropdown, combobox, etc).
- * Stale-closure safe: handler updates on every render via ref.
- */
-declare function useDismiss(popupRef: RefObject<Element | null>, triggerRef: RefObject<Element | null>, onDismiss: () => void, active: boolean): void;
-
-export { useDismiss };

package/dist/components/use-dismiss.js

@@ -1,28 +0,0 @@
-"use client";
-import "../chunk-ORMEWXMH.js";
-import { useEffect, useRef } from "react";
-function useDismiss(popupRef, triggerRef, onDismiss, active) {
-  const cb = useRef(onDismiss);
-  cb.current = onDismiss;
-  useEffect(() => {
-    if (!active) return;
-    const onMouse = (e) => {
-      var _a, _b;
-      const t = e.target;
-      if (((_a = popupRef.current) == null ? void 0 : _a.contains(t)) || ((_b = triggerRef.current) == null ? void 0 : _b.contains(t))) return;
-      cb.current();
-    };
-    const onKey = (e) => {
-      if (e.key === "Escape") cb.current();
-    };
-    document.addEventListener("mousedown", onMouse);
-    document.addEventListener("keydown", onKey);
-    return () => {
-      document.removeEventListener("mousedown", onMouse);
-      document.removeEventListener("keydown", onKey);
-    };
-  }, [active]);
-}
-export {
-  useDismiss
-};

package/dist/components/use-focus-trap.d.ts

@@ -1,5 +0,0 @@
-import * as react from 'react';
-
-declare function useFocusTrap<T extends HTMLElement>(open: boolean): react.RefObject<T | null>;
-
-export { useFocusTrap };

package/dist/components/use-focus-trap.js

@@ -1,54 +0,0 @@
-"use client";
-import "../chunk-ORMEWXMH.js";
-import { useEffect, useRef } from "react";
-const FOCUSABLE = [
-  "a[href]",
-  "button:not([disabled])",
-  "textarea:not([disabled])",
-  "input:not([disabled])",
-  "select:not([disabled])",
-  '[tabindex]:not([tabindex="-1"])'
-].join(", ");
-function useFocusTrap(open) {
-  const ref = useRef(null);
-  useEffect(() => {
-    var _a;
-    if (!open) return;
-    const container = ref.current;
-    if (!container) return;
-    const previousFocus = document.activeElement;
-    const focusables = Array.from(container.querySelectorAll(FOCUSABLE));
-    ((_a = focusables[0]) != null ? _a : container).focus();
-    const trap = (e) => {
-      if (e.key !== "Tab") return;
-      const nodes = Array.from(container.querySelectorAll(FOCUSABLE));
-      if (nodes.length === 0) {
-        e.preventDefault();
-        return;
-      }
-      const first = nodes[0];
-      const last = nodes[nodes.length - 1];
-      if (!first || !last) return;
-      if (e.shiftKey) {
-        if (document.activeElement === first) {
-          e.preventDefault();
-          last.focus();
-        }
-      } else {
-        if (document.activeElement === last) {
-          e.preventDefault();
-          first.focus();
-        }
-      }
-    };
-    document.addEventListener("keydown", trap);
-    return () => {
-      document.removeEventListener("keydown", trap);
-      previousFocus == null ? void 0 : previousFocus.focus();
-    };
-  }, [open]);
-  return ref;
-}
-export {
-  useFocusTrap
-};

package/dist/targets/native/components/paywall-banner.d.ts

@@ -1,11 +0,0 @@
-import * as react from 'react';
-
-type PaywallBannerProps = {
-    title: string;
-    description?: string;
-    ctaLabel?: string;
-    onPress: () => void;
-};
-declare function PaywallBanner({ title, description, ctaLabel, onPress }: PaywallBannerProps): react.JSX.Element;
-
-export { PaywallBanner, type PaywallBannerProps };

package/dist/targets/native/components/paywall-banner.js

@@ -1,55 +0,0 @@
-import "../../../chunk-ORMEWXMH.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Lock } from "lucide-react-native";
-import { StyleSheet, View } from "react-native";
-import { Button } from "./button.js";
-import { Text } from "./text.js";
-import { useTheme } from "./theme.js";
-function PaywallBanner({ title, description, ctaLabel = "Ver planos", onPress }) {
-  const t = useTheme();
-  return /* @__PURE__ */ jsxs(
-    View,
-    {
-      accessibilityRole: "summary",
-      style: [
-        styles.container,
-        { backgroundColor: t["--surface-raised"], borderColor: t["--border-default"] }
-      ],
-      children: [
-        /* @__PURE__ */ jsxs(View, { style: styles.row, children: [
-          /* @__PURE__ */ jsx(View, { style: [styles.iconWrap, { backgroundColor: t["--brand-primary"] }], children: /* @__PURE__ */ jsx(Lock, { size: 20, color: t["--brand-on-primary"] }) }),
-          /* @__PURE__ */ jsxs(View, { style: styles.copy, children: [
-            /* @__PURE__ */ jsx(Text, { variant: "label", numberOfLines: 2, children: title }),
-            description ? /* @__PURE__ */ jsx(Text, { variant: "caption", color: "secondary", style: styles.desc, children: description }) : null
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx(Button, { label: ctaLabel, variant: "primary", fullWidth: true, onPress })
-      ]
-    }
-  );
-}
-const styles = StyleSheet.create({
-  container: {
-    borderWidth: 1,
-    borderRadius: 12,
-    padding: 16,
-    gap: 14
-  },
-  row: {
-    flexDirection: "row",
-    alignItems: "flex-start",
-    gap: 12
-  },
-  iconWrap: {
-    width: 40,
-    height: 40,
-    borderRadius: 10,
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  copy: { flex: 1 },
-  desc: { marginTop: 2 }
-});
-export {
-  PaywallBanner
-};

package/dist/targets/native/components/paywall.d.ts

@@ -1,18 +0,0 @@
-import * as react from 'react';
-
-type PaywallReason = 'feature' | 'limit';
-type PaywallIcon = 'lock' | 'catalog' | 'channels' | 'commercial' | 'operation' | 'intelligence' | 'billing';
-type PaywallContentProps = {
-    icon?: PaywallIcon;
-    title: string;
-    description?: string;
-    reason?: PaywallReason;
-    planLabel?: string;
-    ctaLabel?: string;
-    onCta: () => void;
-};
-/** Visual puro do paywall — o app envolve num Sheet/overlay (gate de ação) ou
- *  num container de tela cheia (gate de seção). */
-declare function PaywallContent({ icon, title, description, reason, planLabel, ctaLabel, onCta, }: PaywallContentProps): react.JSX.Element;
-
-export { PaywallContent, type PaywallContentProps, type PaywallIcon, type PaywallReason };

package/dist/targets/native/components/paywall.js

@@ -1,71 +0,0 @@
-import "../../../chunk-ORMEWXMH.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-import {
-  Lock,
-  Package,
-  Send,
-  HandCoins,
-  Store,
-  BarChart3,
-  CreditCard
-} from "lucide-react-native";
-import { StyleSheet, View } from "react-native";
-import { Button } from "./button.js";
-import { Text } from "./text.js";
-import { useTheme } from "./theme.js";
-const ICONS = {
-  lock: Lock,
-  catalog: Package,
-  channels: Send,
-  commercial: HandCoins,
-  operation: Store,
-  intelligence: BarChart3,
-  billing: CreditCard
-};
-function planLineText(reason, planLabel) {
-  if (reason === "limit") return "Limite atingido";
-  return planLabel ? `Dispon\xEDvel no ${planLabel}` : "Fa\xE7a upgrade";
-}
-function PaywallContent({
-  icon = "lock",
-  title,
-  description,
-  reason = "feature",
-  planLabel,
-  ctaLabel = "Ver planos",
-  onCta
-}) {
-  var _a;
-  const t = useTheme();
-  const Icon = (_a = ICONS[icon]) != null ? _a : Lock;
-  return /* @__PURE__ */ jsxs(View, { style: styles.container, children: [
-    /* @__PURE__ */ jsxs(View, { style: styles.iconWrap, children: [
-      /* @__PURE__ */ jsx(Icon, { size: 52, strokeWidth: 1.25, color: t["--text-secondary"] }),
-      /* @__PURE__ */ jsx(View, { style: [styles.lockBadge, { backgroundColor: t["--brand-primary"] }], children: /* @__PURE__ */ jsx(Lock, { size: 12, strokeWidth: 2.5, color: t["--brand-on-primary"] }) })
-    ] }),
-    /* @__PURE__ */ jsx(View, { style: [styles.pill, { backgroundColor: t["--surface-raised"] }], children: /* @__PURE__ */ jsx(Text, { variant: "caption", color: "secondary", children: planLineText(reason, planLabel) }) }),
-    /* @__PURE__ */ jsx(Text, { variant: "title", style: styles.title, children: title }),
-    description ? /* @__PURE__ */ jsx(Text, { variant: "body-sm", color: "muted", style: styles.desc, children: description }) : null,
-    /* @__PURE__ */ jsx(Button, { label: ctaLabel, variant: "primary", fullWidth: true, onPress: onCta })
-  ] });
-}
-const styles = StyleSheet.create({
-  container: { alignItems: "center", paddingHorizontal: 8, gap: 12, width: "100%" },
-  iconWrap: { position: "relative", marginBottom: 4 },
-  lockBadge: {
-    position: "absolute",
-    bottom: -4,
-    right: -4,
-    width: 24,
-    height: 24,
-    borderRadius: 12,
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  pill: { borderRadius: 999, paddingHorizontal: 10, paddingVertical: 4 },
-  title: { textAlign: "center" },
-  desc: { textAlign: "center", maxWidth: 320 }
-});
-export {
-  PaywallContent
-};