impact-nova 2.6.0-alpha.0 → 2.6.0

package/dist/impact-nova-components.css

@@ -1068,252 +1068,3 @@
     transition: none;
   }
 }
-
-/* ponytail: Indicator knobs inherit. Defaults are fallbacks so unused grids pay no React theming.
-   Do not assign these on [data-iv-comments] — that would block ancestor overrides. */
-[data-iv-comments] .iv-has-cell-comment:not(.ag-has-cell-notes)::after {
-  content: "Has comment";
-  overflow: hidden;
-  color: transparent;
-  font-size: 0;
-  line-height: 0;
-  position: absolute;
-  top: 0;
-  right: 0;
-  width: var(--iv-comment-indicator-size, 12px);
-  height: var(--iv-comment-indicator-size, 12px);
-  box-sizing: border-box;
-  pointer-events: none;
-  border: 0;
-  background-color: var(--iv-comment-indicator-color, var(--color-primary));
-  clip-path: path("M 1 0 H 10 A 2 2 0 0 1 12 2 V 11 Q 12 12 11 11 L 1 1 Q 0 0 1 0 Z");
-}
-
-/* ponytail: AG Grid NotesModule owns note presence and popup. Yellow is the Nova default. */
-[data-iv-notes] {
-  --ag-note-indicator-color: var(--iv-note-indicator-color, var(--color-warning));
-  --ag-note-indicator-size: var(--iv-note-indicator-size, 12px);
-  --ag-note-popup-background-color: var(--iv-note-popup-background, var(--color-warning-surface));
-  --ag-note-popup-text-color: var(--iv-note-popup-text, var(--color-foreground));
-  --ag-note-popup-input-text-color: var(--iv-note-popup-text, var(--color-foreground));
-  --ag-note-popup-input-background-color: var(--iv-note-popup-input-background, var(--color-background));
-  --ag-note-popup-border: var(--iv-note-popup-border, 1px solid var(--color-warning-border));
-}
-
-[data-iv-notes] .ag-has-cell-notes:not(.iv-has-cell-comment)::after {
-  content: "Has note";
-  overflow: hidden;
-  color: transparent;
-  font-size: 0;
-  line-height: 0;
-  top: 0;
-  right: 0;
-  width: var(--ag-note-indicator-size);
-  height: var(--ag-note-indicator-size);
-  box-sizing: border-box;
-  border: 0;
-  background-color: var(--iv-note-indicator-color, var(--color-warning));
-  clip-path: path("M 1 0 H 10 A 2 2 0 0 1 12 2 V 11 Q 12 12 11 11 L 1 1 Q 0 0 1 0 Z");
-}
-
-[data-iv-comments][data-iv-notes] .iv-has-cell-comment.ag-has-cell-notes::after {
-  content: "Has comment and note";
-  overflow: hidden;
-  color: transparent;
-  font-size: 0;
-  line-height: 0;
-  top: 0;
-  right: 0;
-  width: var(--iv-comment-indicator-size, var(--iv-note-indicator-size, 12px));
-  height: var(--iv-comment-indicator-size, var(--iv-note-indicator-size, 12px));
-  box-sizing: border-box;
-  border: 0;
-  background-color: transparent;
-  background-image: linear-gradient(
-    135deg,
-    var(--iv-comment-indicator-color, var(--color-primary)) 0 50%,
-    var(--iv-note-indicator-color, var(--color-warning)) 50% 100%
-  );
-  clip-path: path("M 1 0 H 10 A 2 2 0 0 1 12 2 V 11 Q 12 12 11 11 L 1 1 Q 0 0 1 0 Z");
-}
-
-/* ponytail: Figma 4222:61663 comment-mode cursor. Data-URI fill uses %23 so token scan stays clean. Hotspot is the square TL. */
-[data-iv-comments][data-iv-comment-mode] .ag-cell {
-  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4 4H12C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12V4Z' fill='%234259EE'/%3E%3C/svg%3E") 4 4, cell;
-}
-
-/* ponytail: Figma 4364:63475 — square TL (cell-adjacent). Extra Large 0/0/30/6 at 10% fg. Longhands beat Popover rounded-xl. */
-[data-component="popover-content"][data-iv-comments-popover] {
-  border-top-left-radius: 0;
-  border-top-right-radius: 16px;
-  border-bottom-right-radius: 16px;
-  border-bottom-left-radius: 16px;
-  box-shadow: 0px 0px 30px 6px color-mix(in srgb, var(--color-foreground) 10%, transparent);
-}
-
-[data-iv-chat] {
-  --iv-chat-column-width: 69px;
-  --iv-chat-unread-bg: var(--color-destructive);
-  --iv-chat-unread-fg: var(--color-destructive-foreground);
-  --iv-chat-icon-size: 21px;
-  --iv-chat-badge-size: 16px;
-}
-
-[data-iv-chat] .ag-cell[col-id="iv-chat"] {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  overflow: visible;
-  padding: 0;
-}
-
-.iv-chat-cell-button {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 100%;
-  overflow: visible;
-  border: 0;
-  background: transparent;
-  cursor: pointer;
-}
-
-.iv-chat-cell-button::before,
-.iv-chat-cell-button::after {
-  content: none;
-  display: none;
-}
-
-.iv-chat-cell-icon {
-  position: relative;
-  display: inline-flex;
-  width: var(--iv-chat-icon-size);
-  height: var(--iv-chat-icon-size);
-  overflow: visible;
-}
-
-.iv-chat-cell-icon img {
-  display: block;
-  width: var(--iv-chat-icon-size);
-  height: var(--iv-chat-icon-size);
-}
-
-.iv-chat-unread {
-  position: absolute;
-  top: 0;
-  right: 0;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-width: var(--iv-chat-badge-size);
-  height: var(--iv-chat-badge-size);
-  padding: 0 3px;
-  border-radius: 999px;
-  background: var(--iv-chat-unread-bg);
-  color: var(--iv-chat-unread-fg);
-  font-size: 9px;
-  font-weight: 800;
-  line-height: 1;
-  text-align: center;
-  pointer-events: none;
-  transform: translate(40%, -50%);
-}
-
-[data-iv-chat-workspace] {
-  --iv-chat-list-width: 340px;
-  --iv-chat-thread-min-width: 640px;
-}
-
-.iv-chat-html b,
-.iv-chat-html strong {
-  font-weight: 700;
-}
-
-.iv-chat-html i,
-.iv-chat-html em {
-  font-style: italic;
-}
-
-.iv-chat-html a {
-  color: var(--color-brand, var(--color-primary));
-  text-decoration: underline;
-}
-
-.iv-chat-day {
-  margin: 0 auto 12px;
-  width: fit-content;
-  border-radius: 1000px;
-  border: 1px solid var(--color-border);
-  background: var(--gradient-chat-day);
-  padding: 4px 12px;
-  font-size: 12px;
-  line-height: 16px;
-  color: var(--color-header-notification-icon, var(--color-foreground-secondary));
-}
-
-.iv-chat-bubble {
-  border-radius: 12px;
-  padding: 12px 16px;
-}
-
-[data-iv-chat-message]:not([data-iv-chat-mine]) .iv-chat-bubble {
-  background: var(--gradient-chat-theirs);
-}
-
-[data-iv-chat-message][data-iv-chat-mine] .iv-chat-bubble {
-  background: var(--gradient-chat-mine);
-}
-
-.iv-chat-quote {
-  margin: 0 0 8px;
-  border-radius: 8px;
-  background: var(--color-background);
-  padding: 8px 12px;
-}
-
-.iv-chat-quote-author {
-  color: var(--color-foreground);
-  font-size: 16px;
-  font-weight: 700;
-  line-height: 22px;
-}
-
-.iv-chat-quote-text {
-  color: var(--color-header-notification-icon, var(--color-foreground-secondary));
-  font-size: 16px;
-  line-height: 22px;
-}
-
-.iv-chat-stamp {
-  margin-top: 8px;
-  align-self: flex-end;
-  font-size: 12px;
-  line-height: 16px;
-  color: var(--color-header-notification-icon, var(--color-foreground-secondary));
-}
-
-.iv-chat-reply-curve {
-  flex-shrink: 0;
-  color: var(--color-foreground-icon);
-}
-
-/* ponytail: inset shadow follows border-radius. Mixed 1px+3px borders miter square
-   corners; ::before rails also square off unless they are the border itself. */
-[data-iv-chat-summary][data-selected] {
-  box-shadow: inset 3px 0 0 var(--color-primary);
-}
-
-[data-iv-chat-summary][data-iv-chat-priority="high"] {
-  box-shadow: inset 3px 0 0 var(--color-destructive);
-}
-
-[data-iv-chat-summary][data-iv-chat-priority="medium"] {
-  box-shadow: inset 3px 0 0 var(--color-warning);
-}
-
-[data-iv-chat-summary][data-iv-chat-priority="low"] {
-  box-shadow: inset 3px 0 0 var(--color-success);
-}
-

package/dist/impact-nova-tokens.scss

@@ -107,9 +107,6 @@
     --color-tab-hover-border: #c6ccf1;
     --color-tab-hover-foreground: #7a83b8;
     --color-tab-hover-surface: #f2f3fd;
-    --gradient-chat-day: linear-gradient(90deg, #f5f5f5 6%, rgba(245, 245, 245, 0) 120%);
-    --gradient-chat-mine: linear-gradient(91deg, rgba(223, 231, 255, 0.40) 0.67%, rgba(228, 216, 255, 0.32) 56.16%, rgba(255, 203, 204, 0.27) 111.65%);
-    --gradient-chat-theirs: linear-gradient(92deg, #f8f9fb -0.92%, #f6f7fa 98.11%);
     --gradient-file-upload-drag: radial-gradient(circle at center, #fafbff 0%, #f4f6ff 60%, #eef1ff 100%);
     --gradient-file-upload-error: radial-gradient(circle at center, #ffffff 0%, #fffcfc 65%, #fdf5f4 100%);
 
@@ -176,6 +173,17 @@
     --color-scrim-light: hsl(0 0% 0% / 0.06);
     --color-scrim-skeleton: hsl(0 0% 0% / 0.1);
 
+    /* —— Guidance (tours, coach marks, announcements) —— */
+    --guidance-announcement-hero-bg: #eceefd;
+    --guidance-backdrop-bg: #000000;
+    --guidance-backdrop-opacity: 0.6;
+    --guidance-coach-mark-bg: #ffffff;
+    --guidance-coach-mark-border: #e8eaed;
+    --guidance-highlight-ring: #5267f4;
+    --guidance-highlight-ring-width: 2px;
+    --guidance-step-counter-active: #5267f4;
+    --guidance-step-counter-text: #7a83b8;
+
     /* —— Radius —— */
     --radius: 0.5rem;
     /* —— Chart series palette (6–50; 1–5 are chart-1..chart-5 above) —— */
@@ -335,9 +343,6 @@
     --color-tab-hover-border: #737373;
     --color-tab-hover-foreground: #fafafa;
     --color-tab-hover-surface: #404040;
-    --gradient-chat-day: linear-gradient(90deg, #262626 6%, rgba(38, 38, 38, 0) 120%);
-    --gradient-chat-mine: linear-gradient(91deg, rgba(82, 103, 244, 0.22) 0.67%, rgba(174, 87, 234, 0.16) 56.16%, rgba(236, 75, 88, 0.14) 111.65%);
-    --gradient-chat-theirs: linear-gradient(92deg, #171717 -0.92%, #1f1f1f 98.11%);
     --gradient-file-upload-drag: radial-gradient(circle at center, #fafbff 0%, #f4f6ff 60%, #eef1ff 100%);
     --gradient-file-upload-error: radial-gradient(circle at center, #ffffff 0%, #fffcfc 65%, #fdf5f4 100%);
 
@@ -404,6 +409,17 @@
     --color-scrim-light: hsl(0 0% 0% / 0.35);
     --color-scrim-skeleton: hsl(0 0% 100% / 0.06);
 
+    /* —— Guidance (tours, coach marks, announcements) —— */
+    --guidance-announcement-hero-bg: #eceefd;
+    --guidance-backdrop-bg: #000000;
+    --guidance-backdrop-opacity: 0.6;
+    --guidance-coach-mark-bg: #ffffff;
+    --guidance-coach-mark-border: #e8eaed;
+    --guidance-highlight-ring: #5267f4;
+    --guidance-highlight-ring-width: 2px;
+    --guidance-step-counter-active: #5267f4;
+    --guidance-step-counter-text: #7a83b8;
+
     /* —— Radius —— */
     --radius: 0.625rem;
     /* —— Chart series palette (6–50; 1–5 are chart-1..chart-5 above) —— */