@sfperusacdev/sf-ui 0.1.11

package/dist/theme/sf-tokens.css

@@ -0,0 +1,474 @@
+/**
+ * Tokens sf-ui — defaults slate (Sección A referencia).
+ * Sobrescribir con theme/erp.css, theme/sark.css o theme/dark.css.
+ */
+:root {
+  /* Marca / acento (focus, primary ERP cuando aplica tema) */
+  --sf-primary: #0f172a;
+  --sf-primary-muted: #64748b;
+  --sf-accent: #64748b;
+  --sf-accent-hover: #475569;
+  --sf-accent-10: rgb(15 23 42 / 0.06);
+
+  /* Verdes — tabla / agro (fallback slate en referencia) */
+  --sf-navy: #0f172a;
+  --sf-navy-muted: #64748b;
+  --sf-green: #0f172a;
+  --sf-green-mid: #334155;
+  --sf-green-light: #64748b;
+
+  /* Superficies */
+  --sf-surface: #f8fafc;
+  --sf-surface-alt: #f1f5f9;
+  --sf-white: #ffffff;
+  --sf-page-bg: #f8fafc;
+
+  /* Bordes y texto */
+  --sf-border: #e5e7eb;
+  --sf-border-strong: #d1d5db;
+  --sf-text: #111827;
+  --sf-text-muted: #6b7280;
+  --sf-text-subtle: #9ca3af;
+  --sf-label: #0f172a;
+
+  /* Inputs */
+  --sf-input-bg: #ffffff;
+  --sf-input-bg-readonly: #f8fafc;
+  --sf-input-border: #d1d5db;
+  --sf-input-border-focus: #94a3b8;
+  --sf-input-text: #111827;
+  --sf-input-placeholder: #94a3b8;
+  --sf-input-height: 2.5rem;
+  --sf-input-height-sm: 2rem;
+  --sf-input-radius: 0.375rem;
+  --sf-input-font-size: 0.875rem;
+
+  /* Focus ring */
+  --sf-ring: rgb(148 163 184 / 0.35);
+  --sf-ring-focus: rgb(226 232 240);
+  --sf-ring-width: 2px;
+  --sf-ring-error: rgb(254 202 202);
+  --sf-input-border-error: #ef4444;
+
+  /* Semánticos */
+  --sf-danger: #dc2626;
+  --sf-danger-strong: #b91c1c;
+  --sf-danger-bg: #fff1f2;
+  --sf-danger-border: #fecdd3;
+  --sf-warning: #d97706;
+  --sf-warning-bg: #fffbeb;
+  --sf-warning-border: #fde68a;
+  --sf-success: #16a34a;
+  --sf-success-bg: #f0fdf4;
+  --sf-success-border: #bbf7d0;
+
+  /* Tabla */
+  --sf-table-header-bg: var(--sf-primary);
+  --sf-table-header-text: var(--sf-white);
+  --sf-table-header-border: color-mix(in srgb, var(--sf-primary) 82%, var(--sf-white));
+  --sf-row-hover: #f0f7ff;
+  --sf-row-alt: #f8fafc;
+  --sf-row-selected: rgb(15 23 42 / 0.06);
+
+  /* Botones */
+  --sf-btn-primary-bg: #0f172a;
+  --sf-btn-primary-hover: #1e293b;
+  --sf-btn-primary-text: #ffffff;
+  --sf-btn-primary-shadow: none;
+  --sf-btn-primary-shadow-hover: none;
+  --sf-btn-outline-border: rgb(15 23 42 / 0.25);
+  --sf-btn-outline-text: #334155;
+  --sf-btn-outline-hover-bg: #f8fafc;
+
+  /* Info (badges, alerts) */
+  --sf-info: #2563eb;
+  --sf-info-bg: #eff6ff;
+  --sf-info-border: #bfdbfe;
+
+  /* Modal / overlay */
+  --sf-modal-overlay: rgb(15 23 42 / 0.4);
+  --sf-modal-bg: #ffffff;
+  --sf-modal-border: #e5e7eb;
+  --sf-modal-title: #111827;
+  --sf-modal-body-text: #334155;
+  --sf-modal-close: #64748b;
+  --sf-modal-close-hover-bg: #f1f5f9;
+  --sf-modal-close-hover-text: #111827;
+  --sf-modal-shadow: 0 20px 25px rgb(0 0 0 / 0.1), 0 8px 10px rgb(0 0 0 / 0.04);
+  --sf-modal-header-bg: var(--sf-primary);
+  --sf-modal-header-text: var(--sf-white);
+  /** Mismo tono que eyebrow del topbar / subtítulo en chip usuario (AppShell). */
+  --sf-modal-header-subtitle: var(--sf-app-shell-topbar-muted);
+  --sf-modal-header-icon-bg: var(--sf-app-shell-accent);
+  --sf-modal-header-icon-text: var(--sf-white);
+  --sf-modal-header-close: color-mix(in srgb, var(--sf-white) 68%, transparent);
+  --sf-modal-header-close-hover-bg: color-mix(in srgb, var(--sf-white) 12%, transparent);
+  --sf-modal-header-close-hover-text: var(--sf-white);
+  --sf-modal-footer-bg: var(--sf-surface-alt);
+
+  /* Cards / layout */
+  --sf-card-bg: #ffffff;
+  --sf-card-border: #e5e7eb;
+  --sf-card-shadow: 0 1px 2px rgb(0 0 0 / 0.05);
+  --sf-card-shadow-hover: 0 4px 6px rgb(0 0 0 / 0.07);
+  --sf-card-title: #111827;
+  --sf-card-subtitle: #64748b;
+  --sf-card-muted: #94a3b8;
+  --sf-card-radius: 0.75rem;
+
+  /* Badges */
+  --sf-badge-neutral-bg: #f1f5f9;
+  --sf-badge-neutral-text: #334155;
+  --sf-badge-neutral-dot: #94a3b8;
+  --sf-badge-primary-bg: #0f172a;
+  --sf-badge-primary-text: #ffffff;
+  --sf-badge-primary-dot: #334155;
+
+  /* Alert */
+  --sf-alert-body: #334155;
+  --sf-alert-info-accent: var(--sf-info);
+  --sf-alert-success-accent: var(--sf-success);
+  --sf-alert-warning-accent: var(--sf-warning);
+  --sf-alert-danger-accent: var(--sf-danger);
+
+  /* Tabs */
+  --sf-tab-list-border: var(--sf-border);
+  --sf-tab-active-bg: var(--sf-white);
+  --sf-tab-active-text: var(--sf-text);
+  --sf-tab-active-border: var(--sf-border);
+  --sf-tab-active-indicator: var(--sf-accent);
+  --sf-tab-idle-text: var(--sf-text-muted);
+  --sf-tab-hover-bg: var(--sf-surface);
+  --sf-tab-badge-bg: var(--sf-surface-alt);
+  --sf-tab-badge-text: var(--sf-text-muted);
+  --sf-tab-badge-active-bg: var(--sf-primary);
+  --sf-tab-badge-active-text: var(--sf-white);
+
+  /* Dropdown */
+  --sf-dropdown-bg: var(--sf-white);
+  --sf-dropdown-border: var(--sf-card-border);
+  --sf-dropdown-shadow: var(--sf-shadow-4);
+  --sf-dropdown-item-text: var(--sf-text);
+  --sf-dropdown-item-hover-bg: var(--sf-surface);
+  --sf-dropdown-item-danger: var(--sf-danger);
+  --sf-dropdown-item-danger-hover-bg: var(--sf-danger-bg);
+
+  /* Page header */
+  --sf-page-header-bg: var(--sf-white);
+  --sf-page-header-border: var(--sf-border);
+  --sf-page-header-shadow: var(--sf-shadow-2);
+
+  /* AppShell topbar user chip */
+  --sf-app-shell-user-chip-bg: color-mix(in srgb, var(--sf-primary) 86%, var(--sf-surface-alt));
+  --sf-app-shell-user-chip-bg-hover: color-mix(in srgb, var(--sf-primary) 80%, var(--sf-surface-alt));
+  --sf-app-shell-user-chip-border: color-mix(in srgb, var(--sf-white) 22%, transparent);
+  --sf-app-shell-user-chip-border-hover: color-mix(in srgb, var(--sf-white) 34%, transparent);
+  --sf-app-shell-user-chip-radius: 0.5rem;
+  --sf-app-shell-topbar-muted: #9fb6c4;
+  --sf-app-shell-user-chip-name: var(--sf-white);
+  --sf-app-shell-user-chip-subtitle: var(--sf-app-shell-topbar-muted);
+  --sf-app-shell-user-avatar-bg: var(--sf-app-shell-accent);
+  --sf-app-shell-user-avatar-text: var(--sf-white);
+  --sf-app-shell-user-avatar-ring: color-mix(in srgb, var(--sf-white) 28%, transparent);
+  --sf-app-shell-user-avatar-radius: 0.75rem;
+  --sf-app-shell-accent: #2e9e5b;
+
+  /* Domain tokens neutralizados (fuente única, sin prefijos de proyecto) */
+  --sf-app-header-bg: var(--sf-primary);
+  --sf-success-hover: #15803d;
+  --sf-primary-hover: var(--sf-primary-muted);
+  --sf-danger-hover: var(--sf-danger-strong);
+  --sf-border-soft: color-mix(in srgb, var(--sf-border) 78%, var(--sf-white));
+
+  --sf-state-ok-text: var(--sf-success);
+  --sf-state-ok-bg: var(--sf-success-bg);
+  --sf-state-warn-text: var(--sf-warning);
+  --sf-state-warn-bg: var(--sf-warning-bg);
+  --sf-state-warn-soft-bg: color-mix(in srgb, var(--sf-warning-bg) 60%, var(--sf-white));
+  --sf-state-error-bg: var(--sf-danger-bg);
+  --sf-state-select-bg: var(--sf-row-selected);
+
+  --sf-live-dot: var(--sf-success);
+  --sf-live-chip-bg: color-mix(in srgb, var(--sf-success) 14%, var(--sf-white));
+  --sf-live-chip-text: var(--sf-success);
+  --sf-live-status-bg: var(--sf-white);
+  --sf-live-status-border: var(--sf-border);
+  --sf-passenger-onboard-bg: var(--sf-onboard-bg);
+  --sf-passenger-onboard-border: var(--sf-onboard-border);
+  --sf-passenger-pending-text: var(--sf-text-muted);
+  --sf-live-route-bg: var(--sf-white);
+  --sf-live-route-border: var(--sf-border);
+  --sf-live-route-hover: var(--sf-surface-alt);
+  --sf-live-unit-pill-bg: var(--sf-surface-alt);
+  --sf-live-unit-pill-border: var(--sf-border);
+
+  --sf-onboard-border: color-mix(in srgb, var(--sf-accent) 25%, var(--sf-border));
+  --sf-onboard-bg: color-mix(in srgb, var(--sf-accent) 10%, var(--sf-white));
+  --sf-onboard-avatar-bg: color-mix(in srgb, var(--sf-accent) 20%, var(--sf-white));
+  --sf-pending-avatar-bg: var(--sf-surface-alt);
+  --sf-pending-avatar-text: var(--sf-text-muted);
+
+  --sf-route-active-bg: color-mix(in srgb, var(--sf-accent) 14%, var(--sf-white));
+  --sf-route-active-border: color-mix(in srgb, var(--sf-accent) 42%, var(--sf-border));
+  --sf-route-active-text: var(--sf-accent);
+
+  --sf-timeline-edit-icon-bg: var(--sf-info-bg);
+  --sf-timeline-edit-icon-text: var(--sf-info);
+  --sf-timeline-sync-icon-bg: var(--sf-state-warn-soft-bg);
+  --sf-timeline-sync-icon-text: var(--sf-warning);
+  --sf-timeline-create-icon-bg: var(--sf-success-bg);
+  --sf-timeline-create-icon-text: var(--sf-success);
+  --sf-timeline-detail-bg: var(--sf-surface-alt);
+  --sf-timeline-detail-border: var(--sf-border-soft);
+  --sf-timeline-section-text: var(--sf-text-subtle);
+
+  --sf-record-icon-bg-info: var(--sf-info-bg);
+  --sf-record-icon-text-info: var(--sf-info);
+  --sf-record-icon-bg-warning: var(--sf-state-warn-soft-bg);
+  --sf-record-icon-text-warning: var(--sf-warning);
+  --sf-record-icon-bg-success: var(--sf-success-bg);
+  --sf-record-icon-text-success: var(--sf-success);
+  --sf-record-icon-bg-neutral: var(--sf-surface-alt);
+  --sf-record-icon-text-neutral: var(--sf-text-muted);
+  --sf-record-item-border: var(--sf-border);
+  --sf-record-item-bg: var(--sf-white);
+
+  --sf-kpi-accent-emerald: var(--sf-success);
+  --sf-kpi-accent-blue: var(--sf-info);
+  --sf-kpi-accent-amber: var(--sf-warning);
+  --sf-kpi-accent-red: var(--sf-danger);
+  --sf-kpi-accent-teal: var(--sf-map-track-4);
+  --sf-kpi-accent-slate: var(--sf-primary);
+
+  --sf-progress-fill: var(--sf-accent);
+  --sf-progress-fill-success: var(--sf-success);
+  --sf-progress-fill-warning: var(--sf-warning);
+  --sf-progress-fill-danger: var(--sf-danger);
+  --sf-progress-fill-info: var(--sf-info);
+  --sf-progress-track: var(--sf-border);
+
+  --sf-master-detail-list-bg: var(--sf-surface-alt);
+  --sf-master-detail-list-width: 18rem;
+  --sf-master-detail-divider: var(--sf-border);
+  --sf-master-detail-panel-bg: var(--sf-white);
+
+  --sf-filter-bar-bg: var(--sf-white);
+  --sf-filter-bar-border: var(--sf-border);
+
+  --sf-itinerary-map-bg: color-mix(in srgb, var(--sf-info-bg) 55%, var(--sf-white));
+  --sf-itinerary-map-grid: color-mix(in srgb, var(--sf-border) 65%, transparent);
+  --sf-itinerary-path: var(--sf-accent);
+  --sf-itinerary-stop-marker-bg: var(--sf-primary);
+  --sf-itinerary-stop-marker-text: var(--sf-white);
+  --sf-itinerary-origin-dot: var(--sf-success);
+  --sf-itinerary-destination-dot: var(--sf-danger);
+
+  --sf-expandable-row-bg: var(--sf-white);
+  --sf-expandable-row-border: var(--sf-border);
+  --sf-expandable-row-hover: var(--sf-surface-alt);
+
+  --sf-maestro-toolbar-bg: var(--sf-white);
+  --sf-maestro-toolbar-border: var(--sf-border);
+  --sf-maestro-title-text: var(--sf-text);
+  --sf-maestro-search-icon: var(--sf-text-muted);
+
+  --sf-map-track-1: #2e9e5b;
+  --sf-map-track-2: #1e6fa3;
+  --sf-map-track-3: #ee7a14;
+  --sf-map-track-4: #16a89c;
+  --sf-map-track-5: #7c3aed;
+  --sf-map-track-6: #d97706;
+  --sf-map-track-7: #c0392b;
+  --sf-map-track-8: #5c7180;
+
+  /* Toolbar button */
+  --sf-toolbar-bg-selected: var(--sf-surface-alt);
+  --sf-toolbar-border-selected: var(--sf-border-strong);
+  --sf-toolbar-text: var(--sf-text-muted);
+  --sf-toolbar-text-hover: var(--sf-text);
+  --sf-toolbar-hover-bg: var(--sf-surface);
+  --sf-toolbar-hover-border: var(--sf-border);
+
+  /* Metric bar */
+  --sf-metric-track: var(--sf-surface-alt);
+  --sf-metric-label: var(--sf-text-muted);
+  --sf-metric-value: var(--sf-text);
+  --sf-metric-tone-slate: #334155;
+  --sf-metric-tone-emerald: var(--sf-success);
+  --sf-metric-tone-amber: var(--sf-warning);
+  --sf-metric-tone-red: var(--sf-danger);
+  --sf-metric-tone-blue: var(--sf-info);
+
+  /* Module launcher card — SARK menu / Link tile parity */
+  --sf-module-bg: rgb(255 255 255 / 0.6);
+  --sf-module-border: transparent;
+  --sf-module-tile-border: rgb(0 0 0 / 0.06);
+  --sf-module-shadow: 0 1px 2px rgb(0 0 0 / 0.04), 0 4px 12px rgb(13 42 58 / 0.08);
+  --sf-module-tile-shadow: 0 1px 2px rgb(0 0 0 / 0.05), 0 6px 16px rgb(13 42 58 / 0.1);
+  --sf-module-hover-bg: rgb(12 33 49 / 0.2);
+  --sf-module-hover-border: #0c2131;
+  --sf-module-active-bg: rgb(0 0 0 / 0.1);
+  --sf-module-hover-lift: -4px;
+  --sf-module-hover-lift-row: -3px;
+  --sf-module-accent: var(--sf-accent);
+  --sf-module-icon-accent-fill: color-mix(in srgb, var(--sf-module-accent) 14%, var(--sf-module-icon-bg));
+  --sf-module-icon-accent-center: color-mix(in srgb, var(--sf-module-accent) 26%, var(--sf-module-icon-bg));
+  --sf-module-icon-letter-color: var(--sf-module-accent);
+  --sf-module-icon-border: #edf1f4;
+  --sf-module-icon-border-logo: #eaeff2;
+  --sf-module-icon-bg: #ffffff;
+  --sf-module-favorite-active: #f5b301;
+  --sf-module-favorite-idle: #9ca3af;
+  --sf-module-favorite-opacity: 0.78;
+  --sf-module-badge-bg: #e5484d;
+  --sf-module-badge-text: #ffffff;
+  --sf-module-badge-shadow: rgb(229 72 77 / 0.5);
+  --sf-module-new-color: #2e9e5b;
+  --sf-module-new-bg: rgb(46 158 91 / 0.14);
+  --sf-module-title-color: #000000;
+  --sf-module-title-weight: 400;
+  --sf-module-subtitle-color: #8a98a4;
+  --sf-module-tile-min: 9.5rem;
+  --sf-module-tile-min-compact: 7.75rem;
+  --sf-module-row-min: 13.75rem;
+  --sf-module-grid-gap: 1rem;
+  --sf-module-grid-gap-compact: 0.75rem;
+  --sf-module-row-grid-gap: 0.875rem;
+  --sf-module-tile-radius: 18%;
+  --sf-module-row-radius: 0.875rem;
+  --sf-module-icon-radius-ratio: 0.3;
+  --sf-module-body-min-height-tile: 2.375rem;
+  --sf-module-body-min-height-tile-compact: 2.125rem;
+  --sf-module-transition: background 0.14s ease, border-color 0.14s ease, transform 0.14s ease;
+
+  /* Entity card */
+  --sf-entity-photo-bg: var(--sf-surface-alt);
+  --sf-entity-photo-text: var(--sf-text-subtle);
+  --sf-entity-ring-default: var(--sf-card-border);
+  --sf-entity-ring-featured: var(--sf-warning);
+  --sf-entity-ring-warning: var(--sf-danger);
+  --sf-entity-score-high-border: var(--sf-success);
+  --sf-entity-score-high-bg: var(--sf-success-bg);
+  --sf-entity-score-high-text: var(--sf-success);
+  --sf-entity-score-mid-border: var(--sf-warning);
+  --sf-entity-score-mid-bg: var(--sf-warning-bg);
+  --sf-entity-score-mid-text: var(--sf-warning);
+  --sf-entity-score-low-border: var(--sf-danger);
+  --sf-entity-score-low-bg: var(--sf-danger-bg);
+  --sf-entity-score-low-text: var(--sf-danger);
+
+  /* Skeleton (base Fase 19) */
+  --sf-skeleton-bg: var(--sf-surface-alt);
+  --sf-skeleton-shimmer: var(--sf-border);
+
+  /* Spinner / overlays feedback */
+  --sf-spinner-track: #cbd5e1;
+  --sf-spinner-fill: var(--sf-primary);
+  --sf-overlay-loading: rgb(255 255 255 / 0.7);
+  --sf-overlay-error: rgb(255 255 255 / 0.85);
+
+  /* ActionButton semánticos extra */
+  --sf-btn-success-bg: var(--sf-success);
+  --sf-btn-success-hover: #15803d;
+  --sf-btn-warning-bg: var(--sf-warning);
+  --sf-btn-warning-hover: #b45309;
+  --sf-btn-info-bg: var(--sf-info);
+  --sf-btn-info-bg-hover: #1d4ed8;
+
+  /* Gauge / calendar */
+  --sf-gauge-track: #e2e8f0;
+
+  /* Toast (Fase 19) */
+  --sf-toast-bg: var(--sf-card-bg);
+  --sf-toast-border: var(--sf-card-border);
+  --sf-toast-shadow: var(--sf-shadow-8);
+  --sf-toast-title: var(--sf-card-title);
+  --sf-toast-body: var(--sf-text-muted);
+  --sf-toast-close: var(--sf-text-subtle);
+
+  /* Tooltip (Fase 19) */
+  --sf-tooltip-bg: var(--sf-text);
+  --sf-tooltip-text: var(--sf-btn-primary-text);
+  --sf-tooltip-shadow: var(--sf-shadow-4);
+
+  /* Avatar (Fase 19) */
+  --sf-avatar-bg: var(--sf-surface-alt);
+  --sf-avatar-text: var(--sf-text-muted);
+  --sf-avatar-ring: var(--sf-card-bg);
+  --sf-avatar-accent-bg: var(--sf-accent);
+  --sf-avatar-accent-text: var(--sf-white);
+  --sf-avatar-accent-radius: 9999px;
+
+  /* AppShell nav badge */
+  --sf-app-shell-nav-badge-bg: var(--sf-accent);
+  --sf-app-shell-nav-badge-text: var(--sf-white);
+
+  /* Navegación / contenedores (Fase 20) */
+  --sf-breadcrumb-text: var(--sf-text-muted);
+  --sf-breadcrumb-hover: var(--sf-text);
+  --sf-breadcrumb-current: var(--sf-card-title);
+  --sf-breadcrumb-separator: var(--sf-text-subtle);
+  --sf-accordion-border: var(--sf-border);
+  --sf-accordion-trigger-hover: var(--sf-surface-alt);
+  --sf-drawer-bg: var(--sf-card-bg);
+  --sf-drawer-border: var(--sf-border);
+  --sf-drawer-overlay: var(--sf-modal-overlay);
+  --sf-drawer-shadow: var(--sf-shadow-8);
+  --sf-popover-bg: var(--sf-dropdown-bg);
+  --sf-popover-border: var(--sf-dropdown-border);
+  --sf-popover-shadow: var(--sf-dropdown-shadow);
+  --sf-scroll-track: var(--sf-surface-alt);
+  --sf-scroll-thumb: var(--sf-border-strong);
+
+  /* Charts (Fase 22) */
+  --sf-chart-1: var(--sf-primary);
+  --sf-chart-2: var(--sf-info);
+  --sf-chart-3: var(--sf-success);
+  --sf-chart-4: var(--sf-warning);
+  --sf-chart-5: var(--sf-danger);
+  --sf-chart-grid: var(--sf-border);
+  --sf-chart-axis: var(--sf-text-muted);
+  --sf-chart-tooltip-bg: var(--sf-card-bg);
+  --sf-chart-tooltip-border: var(--sf-card-border);
+  --sf-chart-tooltip-text: var(--sf-text);
+
+  /* Network map (Fase 13 / 25) */
+  --sf-network-panel-bg: rgb(255 255 255 / 0.95);
+  --sf-network-marker-label-text: var(--sf-btn-primary-text);
+  --sf-network-marker-label-bg: rgb(15 23 42 / 0.75);
+  --sf-network-marker-label-bg-selected: rgb(51 65 85 / 0.9);
+  --sf-network-marker-dot-text: var(--sf-btn-primary-text);
+  --sf-network-marker-shadow: rgb(15 23 42 / 0.35);
+  --sf-network-marker-ring-selected: rgb(51 65 85 / 0.45);
+  --sf-network-kind-nap: #7c3aed;
+  --sf-network-kind-olt: #0ea5e9;
+  --sf-network-kind-splitter: var(--sf-text-muted);
+  --sf-network-status-normal: var(--sf-success);
+  --sf-network-status-warning: var(--sf-warning);
+  --sf-network-status-critical: var(--sf-danger);
+  --sf-network-status-maintenance: var(--sf-info);
+  --sf-network-edge-backbone: var(--sf-success);
+  --sf-network-edge-distribution: var(--sf-warning);
+  --sf-network-edge-maintenance: var(--sf-info);
+
+  /* Map shapes (Fase 11) */
+  --sf-map-area-stroke: var(--sf-info);
+  --sf-map-area-fill: var(--sf-info);
+  --sf-map-route-stroke: #0f766e;
+  --sf-map-route-fill: #14b8a6;
+  --sf-map-panel-bg: var(--sf-network-panel-bg);
+  --sf-map-vertex-border: var(--sf-white);
+  --sf-map-vertex-shadow: var(--sf-network-marker-shadow);
+  --sf-map-vertex-ring: rgb(59 130 246 / 0.35);
+  --sf-map-vertex-ring-active: rgb(59 130 246 / 0.45);
+  --sf-org-tree-chip-inset: rgb(0 0 0 / 0.05);
+  --sf-org-tree-toggle-hover-bg: rgb(255 255 255 / 0.6);
+  --sf-calendar-badge-on-selected-bg: rgb(255 255 255 / 0.3);
+
+  /* Elevación */
+  --sf-shadow-2: 0 1px 2px rgb(0 0 0 / 0.05);
+  --sf-shadow-4: 0 4px 16px rgb(0 0 0 / 0.08);
+  --sf-shadow-8: 0 10px 32px rgb(15 23 42 / 0.1), 0 4px 10px rgb(15 23 42 / 0.06);
+
+  --sf-transition: 200ms ease;
+}

package/dist/types/src/adapters/maps/google/index.d.ts

@@ -0,0 +1,18 @@
+import { SfLatLng, SfPlace } from '../../../types/maps';
+export type GoogleMapsLikeLatLng = {
+    lat: () => number;
+    lng: () => number;
+};
+export type GoogleMapsLikeGeocoderResult = {
+    place_id?: string;
+    formatted_address?: string;
+    geometry?: {
+        location?: GoogleMapsLikeLatLng;
+    };
+};
+export declare const googleLatLngToSfLatLng: (point: GoogleMapsLikeLatLng) => SfLatLng;
+export declare const sfLatLngToGoogleLiteral: (point: SfLatLng) => {
+    lat: number;
+    lng: number;
+};
+export declare const googleGeocoderResultToSfPlace: (result: GoogleMapsLikeGeocoderResult) => SfPlace | null;

package/dist/types/src/adapters/maps/index.d.ts

@@ -0,0 +1,2 @@
+export * from './google';
+export * from './leaflet';

package/dist/types/src/adapters/maps/leaflet/index.d.ts

@@ -0,0 +1,10 @@
+import { SfLatLng, SfMapMarker } from '../../../types/maps';
+export declare const leafletLatLngToSfLatLng: (point: {
+    lat: number;
+    lng: number;
+}) => SfLatLng;
+export declare const sfLatLngToLeafletLatLng: (point: SfLatLng) => [number, number];
+export declare const leafletMarkerToSfMarker: (id: string, position: {
+    lat: number;
+    lng: number;
+}, label?: string) => SfMapMarker;

package/dist/types/src/components/advanced-inputs/CodeEditor.d.ts

@@ -0,0 +1,20 @@
+import { FieldValues, Path, UseFormReturn } from 'react-hook-form';
+import { CodeEditorLanguage } from './types';
+type CodeEditorProps<TFormValues extends FieldValues> = {
+    form: UseFormReturn<TFormValues>;
+    name: Path<TFormValues>;
+    label?: string;
+    info?: string;
+    required?: boolean;
+    language?: CodeEditorLanguage;
+    highlighted?: boolean;
+    readOnly?: boolean;
+    disabled?: boolean;
+    rows?: number;
+    small?: boolean;
+    className?: string;
+    onChange?: (value: string) => void;
+    onRefresh?: () => Promise<void> | void;
+};
+export declare const CodeEditor: <TFormValues extends FieldValues>({ form, name, label, info, required, language, highlighted, readOnly, disabled, rows, small, className, onChange, onRefresh, }: CodeEditorProps<TFormValues>) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/advanced-inputs/MapFlyTo.d.ts

@@ -0,0 +1,9 @@
+type MapTarget = {
+    lat: number;
+    lng: number;
+};
+export declare const MapFlyTo: ({ target, zoom }: {
+    target: MapTarget | null;
+    zoom?: number;
+}) => null;
+export {};

package/dist/types/src/components/advanced-inputs/MapGeocoderBar.d.ts

@@ -0,0 +1,8 @@
+import { MapGeocoderResult } from '../../utils/maps/geocoder';
+export type MapGeocoderBarProps = {
+    onSelect: (result: MapGeocoderResult) => void;
+    placeholder?: string;
+    className?: string;
+    disabled?: boolean;
+};
+export declare const MapGeocoderBar: ({ onSelect, placeholder, className, disabled, }: MapGeocoderBarProps) => import("react").JSX.Element;

package/dist/types/src/components/advanced-inputs/MapPicker.d.ts

@@ -0,0 +1,22 @@
+import { FieldValues, Path, UseFormReturn } from 'react-hook-form';
+import { MapPoint } from './types';
+type MapPickerProps<TFormValues extends FieldValues> = {
+    form: UseFormReturn<TFormValues>;
+    name: Path<TFormValues>;
+    label?: string;
+    info?: string;
+    required?: boolean;
+    zoom?: number;
+    readOnly?: boolean;
+    disabled?: boolean;
+    showGeocoder?: boolean;
+    className?: string;
+    onChange?: (value: MapPoint) => void;
+    onRefresh?: () => Promise<void> | void;
+};
+/**
+ * @deprecated Use `LocationPicker` or `SmartMapInput kind="coordinates"` from `components/maps/forms`.
+ * This component remains for compatibility during migration.
+ */
+export declare const MapPicker: <TFormValues extends FieldValues>({ form, name, label, info, required, zoom, readOnly, disabled, showGeocoder, className, onChange, onRefresh, }: MapPickerProps<TFormValues>) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/advanced-inputs/MapPickerMap.d.ts

@@ -0,0 +1,10 @@
+type MapPickerMapProps = {
+    lat: number;
+    lng: number;
+    zoom?: number;
+    readOnly?: boolean;
+    showGeocoder?: boolean;
+    onPick: (lat: string, lng: string) => void;
+};
+export declare const MapPickerMap: ({ lat, lng, zoom, readOnly, showGeocoder, onPick, }: MapPickerMapProps) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/advanced-inputs/PhotoInput.d.ts

@@ -0,0 +1,18 @@
+import { FieldValues, Path, UseFormReturn } from 'react-hook-form';
+type PhotoInputProps<TFormValues extends FieldValues> = {
+    form: UseFormReturn<TFormValues>;
+    name: Path<TFormValues>;
+    label?: string;
+    info?: string;
+    required?: boolean;
+    capture?: "user" | "environment";
+    maxSizeMb?: number;
+    readOnly?: boolean;
+    disabled?: boolean;
+    small?: boolean;
+    className?: string;
+    onChange?: (file: File | null) => void;
+    onRefresh?: () => Promise<void> | void;
+};
+export declare const PhotoInput: <TFormValues extends FieldValues>({ form, name, label, info, required, capture, maxSizeMb, readOnly, disabled, small, className, onChange, onRefresh, }: PhotoInputProps<TFormValues>) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/advanced-inputs/RichTextEditor.d.ts

@@ -0,0 +1,16 @@
+import { FieldValues, Path, UseFormReturn } from 'react-hook-form';
+type RichTextEditorProps<TFormValues extends FieldValues> = {
+    form: UseFormReturn<TFormValues>;
+    name: Path<TFormValues>;
+    label?: string;
+    info?: string;
+    required?: boolean;
+    readOnly?: boolean;
+    disabled?: boolean;
+    height?: number;
+    className?: string;
+    onChange?: (html: string) => void;
+    onRefresh?: () => Promise<void> | void;
+};
+export declare const RichTextEditor: <TFormValues extends FieldValues>({ form, name, label, info, required, readOnly, disabled, height, className, onChange, onRefresh, }: RichTextEditorProps<TFormValues>) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/advanced-inputs/SignaturePad.d.ts

@@ -0,0 +1,17 @@
+import { FieldValues, Path, UseFormReturn } from 'react-hook-form';
+type SignaturePadProps<TFormValues extends FieldValues> = {
+    form: UseFormReturn<TFormValues>;
+    name: Path<TFormValues>;
+    label?: string;
+    info?: string;
+    required?: boolean;
+    width?: number;
+    height?: number;
+    readOnly?: boolean;
+    disabled?: boolean;
+    className?: string;
+    onChange?: (dataUrl: string) => void;
+    onRefresh?: () => Promise<void> | void;
+};
+export declare const SignaturePad: <TFormValues extends FieldValues>({ form, name, label, info, required, width, height, readOnly, disabled, className, onChange, onRefresh, }: SignaturePadProps<TFormValues>) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/advanced-inputs/codeEditorClassName.d.ts

@@ -0,0 +1,7 @@
+export declare const codeEditorClassName: ({ small, error, className, }: {
+    small?: boolean;
+    error?: boolean;
+    className?: string;
+    readOnly?: boolean;
+    disabled?: boolean;
+}) => string;

package/dist/types/src/components/advanced-inputs/codeEditorExtensions.d.ts

@@ -0,0 +1,3 @@
+import { Extension } from '@codemirror/state';
+import { CodeEditorLanguage } from './types';
+export declare const codeEditorLanguageExtension: (language: CodeEditorLanguage) => Extension[];

package/dist/types/src/components/advanced-inputs/index.d.ts

@@ -0,0 +1,8 @@
+export { RichTextEditor } from './RichTextEditor';
+export { CodeEditor } from './CodeEditor';
+/**
+ * @deprecated Legacy map input. Use `components/maps/forms/LocationPicker` or `SmartMapInput`.
+ */
+export { MapPicker } from './MapPicker';
+export { codeEditorClassName } from './codeEditorClassName';
+export type { CodeEditorLanguage, MapPoint } from './types';

package/dist/types/src/components/advanced-inputs/mapPickerUtils.d.ts

@@ -0,0 +1,19 @@
+import { default as L } from 'leaflet';
+/** Marcador sin assets PNG — evita roturas con bundlers (Vite/webpack). */
+export declare const mapPickerMarkerIcon: L.DivIcon;
+export declare const DEFAULT_MAP_CENTER: {
+    readonly lat: "-12.0464";
+    readonly lng: "-77.0428";
+};
+export declare const parseMapCoordinate: (value: string, fallback: number) => number;
+export declare const formatMapCoordinate: (value: number) => string;
+/** Opciones recomendadas para getCurrentPosition (GPS / WiFi, sin caché). */
+export declare const GEOLOCATION_OPTIONS: PositionOptions;
+/** Por encima de esto mostramos aviso de ubicación aproximada. */
+export declare const LOW_ACCURACY_THRESHOLD_M = 1000;
+export declare const formatGeolocationAccuracyHint: (accuracyMeters: number) => string | null;
+export declare const geolocationErrorMessage: (code: number) => string;
+export declare const toMapPoint: (value: unknown) => {
+    lat: string;
+    lng: string;
+};