@checkstack/ui 0.3.0 → 0.4.0

package/CHANGELOG.md

@@ -1,5 +1,43 @@
 # @checkstack/ui
 
+## 0.4.0
+
+### Minor Changes
+
+- d1324e6: Enhanced DateTimePicker with calendar popup and independent field editing
+
+  - Added calendar popup using `react-day-picker` and Radix Popover for date selection
+  - Implemented independent input fields for day, month, year, hour, and minute
+  - Added input validation with proper clamping on blur (respects leap years)
+  - Updated `onChange` signature to `Date | undefined` to handle invalid states
+  - Fixed Dialog focus ring clipping by adding wrapper with negative margin/padding
+
+### Patch Changes
+
+- 2c0822d: ### Queue System
+
+  - Added cron pattern support to `scheduleRecurring()` - accepts either `intervalSeconds` or `cronPattern`
+  - BullMQ backend uses native cron scheduling via `pattern` option
+  - InMemoryQueue implements wall-clock cron scheduling with `cron-parser`
+
+  ### Maintenance Backend
+
+  - Auto status transitions now use cron pattern `* * * * *` for precise second-0 scheduling
+  - User notifications are now sent for auto-started and auto-completed maintenances
+  - Refactored to call `addUpdate` RPC for status changes, centralizing hook/signal/notification logic
+
+  ### UI
+
+  - DateTimePicker now resets seconds and milliseconds to 0 when time is changed
+
+## 0.3.1
+
+### Patch Changes
+
+- Updated dependencies [8a87cd4]
+  - @checkstack/common@0.5.0
+  - @checkstack/frontend-api@0.3.2
+
 ## 0.3.0
 
 ### Minor Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@checkstack/ui",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "type": "module",
   "main": "src/index.ts",
   "dependencies": {
@@ -16,6 +16,7 @@
     "@codemirror/view": "^6.39.11",
     "@radix-ui/react-accordion": "^1.2.12",
     "@radix-ui/react-dialog": "^1.1.15",
+    "@radix-ui/react-popover": "^1.1.15",
     "@radix-ui/react-select": "^2.2.6",
     "@radix-ui/react-slot": "^1.2.4",
     "@uiw/react-codemirror": "^4.25.4",
@@ -26,6 +27,7 @@
     "date-fns": "^4.1.0",
     "lucide-react": "0.562.0",
     "react": "^18.2.0",
+    "react-day-picker": "^9.13.0",
     "react-markdown": "^10.1.0",
     "react-router-dom": "^6.20.0",
     "recharts": "^3.6.0",

package/src/components/CodeEditor/languageSupport/json-utils.ts

@@ -0,0 +1,117 @@
+/**
+ * Pure utility functions for JSON parsing that don't depend on CodeMirror.
+ * These are extracted to allow testing without triggering CodeMirror's module loading.
+ */
+
+/**
+ * Check if cursor is in a valid JSON template position.
+ * Returns true if:
+ * 1. Inside a string value (for string templates like "{{payload.name}}")
+ * 2. In a value position after a colon but outside quotes (for number templates like {{payload.count}})
+ * 3. Inside an array element position
+ *
+ * @internal Exported for testing
+ */
+export function isValidJsonTemplatePosition(text: string): boolean {
+  let insideString = false;
+  let inValuePosition = false;
+  // Stack to track object/array nesting: 'o' for object, 'a' for array
+  const nestingStack: ("o" | "a")[] = [];
+
+  for (let i = 0; i < text.length; i++) {
+    const char = text[i];
+    const prevChar = i > 0 ? text[i - 1] : "";
+
+    if (char === '"' && prevChar !== "\\") {
+      insideString = !insideString;
+    } else if (!insideString) {
+      switch (char) {
+        case ":": {
+          inValuePosition = true;
+          break;
+        }
+        case ",": {
+          // After comma: in arrays we stay in value position, in objects we go to key position
+          const currentContext = nestingStack.at(-1);
+          inValuePosition = currentContext === "a";
+          break;
+        }
+        case "{": {
+          // Start of object - next is a key position, not a value
+          nestingStack.push("o");
+          inValuePosition = false;
+          break;
+        }
+        case "[": {
+          // Start of array - next is a value position
+          nestingStack.push("a");
+          inValuePosition = true;
+          break;
+        }
+        case "}": {
+          nestingStack.pop();
+          inValuePosition = false;
+          break;
+        }
+        case "]": {
+          nestingStack.pop();
+          inValuePosition = false;
+          break;
+        }
+      }
+    }
+  }
+
+  // Valid if inside a string OR in a value position (for bare number templates)
+  return insideString || inValuePosition;
+}
+
+/**
+ * Calculate indentation for JSON, properly handling template expressions.
+ * Counts structural { and [ while ignoring {{ template braces.
+ * @internal Exported for testing
+ */
+export function calculateJsonIndentation(
+  textBefore: string,
+  indentUnit: number,
+): number {
+  let depth = 0;
+  let insideString = false;
+  let i = 0;
+
+  while (i < textBefore.length) {
+    const char = textBefore[i];
+    const nextChar = i < textBefore.length - 1 ? textBefore[i + 1] : "";
+    const prevChar = i > 0 ? textBefore[i - 1] : "";
+
+    // Handle string boundaries
+    if (char === '"' && prevChar !== "\\") {
+      insideString = !insideString;
+      i++;
+      continue;
+    }
+
+    if (!insideString) {
+      // Skip template braces {{ and }}
+      if (char === "{" && nextChar === "{") {
+        i += 2;
+        continue;
+      }
+      if (char === "}" && nextChar === "}") {
+        i += 2;
+        continue;
+      }
+
+      // Count structural braces
+      if (char === "{" || char === "[") {
+        depth++;
+      } else if (char === "}" || char === "]") {
+        depth = Math.max(0, depth - 1);
+      }
+    }
+
+    i++;
+  }
+
+  return depth * indentUnit;
+}

package/src/components/CodeEditor/languageSupport/json.test.ts

@@ -1,6 +1,9 @@
 import { describe, expect, it } from "bun:test";
 
-import { isValidJsonTemplatePosition, calculateJsonIndentation } from "./json";
+import {
+  isValidJsonTemplatePosition,
+  calculateJsonIndentation,
+} from "./json-utils";
 
 describe("isValidJsonTemplatePosition", () => {
   describe("string values (inside quotes)", () => {

package/src/components/CodeEditor/languageSupport/json.ts

@@ -2,6 +2,12 @@ import { json } from "@codemirror/lang-json";
 import { Decoration } from "@codemirror/view";
 import type { LanguageSupport, DecorationRange } from "./types";
 
+// Re-export pure utils for backwards compatibility
+export {
+  isValidJsonTemplatePosition,
+  calculateJsonIndentation,
+} from "./json-utils";
+
 // Decoration marks for JSON syntax highlighting using inline styles
 // (higher specificity than Lezer parser's CSS classes)
 const jsonStringMark = Decoration.mark({
@@ -20,69 +26,6 @@ const templateMark = Decoration.mark({
   attributes: { style: "color: hsl(190, 70%, 50%); font-weight: 500" },
 });
 
-/**
- * Check if cursor is in a valid JSON template position.
- * Returns true if:
- * 1. Inside a string value (for string templates like "{{payload.name}}")
- * 2. In a value position after a colon but outside quotes (for number templates like {{payload.count}})
- * 3. Inside an array element position
- *
- * @internal Exported for testing
- */
-export function isValidJsonTemplatePosition(text: string): boolean {
-  let insideString = false;
-  let inValuePosition = false;
-  // Stack to track object/array nesting: 'o' for object, 'a' for array
-  const nestingStack: ("o" | "a")[] = [];
-
-  for (let i = 0; i < text.length; i++) {
-    const char = text[i];
-    const prevChar = i > 0 ? text[i - 1] : "";
-
-    if (char === '"' && prevChar !== "\\") {
-      insideString = !insideString;
-    } else if (!insideString) {
-      switch (char) {
-        case ":": {
-          inValuePosition = true;
-          break;
-        }
-        case ",": {
-          // After comma: in arrays we stay in value position, in objects we go to key position
-          const currentContext = nestingStack.at(-1);
-          inValuePosition = currentContext === "a";
-          break;
-        }
-        case "{": {
-          // Start of object - next is a key position, not a value
-          nestingStack.push("o");
-          inValuePosition = false;
-          break;
-        }
-        case "[": {
-          // Start of array - next is a value position
-          nestingStack.push("a");
-          inValuePosition = true;
-          break;
-        }
-        case "}": {
-          nestingStack.pop();
-          inValuePosition = false;
-          break;
-        }
-        case "]": {
-          nestingStack.pop();
-          inValuePosition = false;
-          break;
-        }
-      }
-    }
-  }
-
-  // Valid if inside a string OR in a value position (for bare number templates)
-  return insideString || inValuePosition;
-}
-
 /**
  * Build comprehensive JSON + template decorations.
  * This uses regex-based matching to apply consistent syntax highlighting
@@ -179,55 +122,11 @@ function buildJsonDecorations(doc: string): DecorationRange[] {
   return filtered;
 }
 
-/**
- * Calculate indentation for JSON, properly handling template expressions.
- * Counts structural { and [ while ignoring {{ template braces.
- * @internal Exported for testing
- */
-export function calculateJsonIndentation(
-  textBefore: string,
-  indentUnit: number,
-): number {
-  let depth = 0;
-  let insideString = false;
-  let i = 0;
-
-  while (i < textBefore.length) {
-    const char = textBefore[i];
-    const nextChar = i < textBefore.length - 1 ? textBefore[i + 1] : "";
-    const prevChar = i > 0 ? textBefore[i - 1] : "";
-
-    // Handle string boundaries
-    if (char === '"' && prevChar !== "\\") {
-      insideString = !insideString;
-      i++;
-      continue;
-    }
-
-    if (!insideString) {
-      // Skip template braces {{ and }}
-      if (char === "{" && nextChar === "{") {
-        i += 2;
-        continue;
-      }
-      if (char === "}" && nextChar === "}") {
-        i += 2;
-        continue;
-      }
-
-      // Count structural braces
-      if (char === "{" || char === "[") {
-        depth++;
-      } else if (char === "}" || char === "]") {
-        depth = Math.max(0, depth - 1);
-      }
-    }
-
-    i++;
-  }
-
-  return depth * indentUnit;
-}
+// Import the pure utils for use in the language support object
+import {
+  isValidJsonTemplatePosition,
+  calculateJsonIndentation,
+} from "./json-utils";
 
 /**
  * JSON language support for CodeEditor with template expression handling.

package/src/components/CodeEditor/languageSupport/markdown-utils.ts

@@ -0,0 +1,65 @@
+/**
+ * Pure utility functions for Markdown parsing that don't depend on CodeMirror.
+ * These are extracted to allow testing without triggering CodeMirror's module loading.
+ */
+
+/**
+ * Check if cursor is in a valid Markdown template position.
+ * Templates can appear almost anywhere in Markdown (text content).
+ * @internal Exported for testing
+ */
+export function isValidMarkdownTemplatePosition(text: string): boolean {
+  // In Markdown, templates are valid almost everywhere except:
+  // - Inside code blocks (``` ... ```)
+  // - Inside inline code (` ... `)
+
+  // Check for unclosed code blocks
+  const codeBlockMatches = text.match(/```/g) || [];
+  if (codeBlockMatches.length % 2 === 1) {
+    return false; // Inside a code block
+  }
+
+  // Check if we're inside inline code on the current line
+  const lastNewline = text.lastIndexOf("\n");
+  const currentLine = text.slice(lastNewline + 1);
+  const backticks = (currentLine.match(/`/g) || []).length;
+
+  // If odd number of backticks, we're inside inline code
+  if (backticks % 2 === 1) {
+    return false;
+  }
+
+  // Valid in all other positions
+  return true;
+}
+
+/**
+ * Calculate indentation for Markdown.
+ * Markdown uses list indentation.
+ * @internal Exported for testing
+ */
+export function calculateMarkdownIndentation(
+  textBefore: string,
+  _indentUnit: number,
+): number {
+  const lines = textBefore.split("\n");
+  if (lines.length === 0) return 0;
+
+  // Find the last non-empty line
+  for (let i = lines.length - 1; i >= 0; i--) {
+    const line = lines[i];
+    if (line.trim().length === 0) continue;
+
+    // Count leading spaces
+    const leadingSpaces = line.match(/^(\s*)/)?.[1].length ?? 0;
+
+    // If line is a list item, next line should be indented if continuing
+    if (/^\s*[-*+]\s/.test(line) || /^\s*\d+\.\s/.test(line)) {
+      return leadingSpaces;
+    }
+
+    return leadingSpaces;
+  }
+
+  return 0;
+}

package/src/components/CodeEditor/languageSupport/markdown.test.ts

@@ -3,7 +3,7 @@ import { describe, expect, it } from "bun:test";
 import {
   isValidMarkdownTemplatePosition,
   calculateMarkdownIndentation,
-} from "./markdown";
+} from "./markdown-utils";
 
 describe("isValidMarkdownTemplatePosition", () => {
   describe("valid text positions", () => {

package/src/components/CodeEditor/languageSupport/markdown.ts

@@ -2,6 +2,12 @@ import { markdown } from "@codemirror/lang-markdown";
 import { Decoration } from "@codemirror/view";
 import type { LanguageSupport, DecorationRange } from "./types";
 
+// Re-export pure utils for backwards compatibility
+export {
+  isValidMarkdownTemplatePosition,
+  calculateMarkdownIndentation,
+} from "./markdown-utils";
+
 // Decoration marks for Markdown syntax highlighting using inline styles
 const mdHeadingMark = Decoration.mark({
   attributes: { style: "color: hsl(280, 65%, 60%); font-weight: bold" },
@@ -25,36 +31,6 @@ const templateMark = Decoration.mark({
   attributes: { style: "color: hsl(190, 70%, 50%); font-weight: 500" },
 });
 
-/**
- * Check if cursor is in a valid Markdown template position.
- * Templates can appear almost anywhere in Markdown (text content).
- * @internal Exported for testing
- */
-export function isValidMarkdownTemplatePosition(text: string): boolean {
-  // In Markdown, templates are valid almost everywhere except:
-  // - Inside code blocks (``` ... ```)
-  // - Inside inline code (` ... `)
-
-  // Check for unclosed code blocks
-  const codeBlockMatches = text.match(/```/g) || [];
-  if (codeBlockMatches.length % 2 === 1) {
-    return false; // Inside a code block
-  }
-
-  // Check if we're inside inline code on the current line
-  const lastNewline = text.lastIndexOf("\n");
-  const currentLine = text.slice(lastNewline + 1);
-  const backticks = (currentLine.match(/`/g) || []).length;
-
-  // If odd number of backticks, we're inside inline code
-  if (backticks % 2 === 1) {
-    return false;
-  }
-
-  // Valid in all other positions
-  return true;
-}
-
 /**
  * Build Markdown + template decorations.
  */
@@ -141,36 +117,11 @@ function buildMarkdownDecorations(doc: string): DecorationRange[] {
   return filtered;
 }
 
-/**
- * Calculate indentation for Markdown.
- * Markdown uses list indentation.
- * @internal Exported for testing
- */
-export function calculateMarkdownIndentation(
-  textBefore: string,
-  _indentUnit: number,
-): number {
-  const lines = textBefore.split("\n");
-  if (lines.length === 0) return 0;
-
-  // Find the last non-empty line
-  for (let i = lines.length - 1; i >= 0; i--) {
-    const line = lines[i];
-    if (line.trim().length === 0) continue;
-
-    // Count leading spaces
-    const leadingSpaces = line.match(/^(\s*)/)?.[1].length ?? 0;
-
-    // If line is a list item, next line should be indented if continuing
-    if (/^\s*[-*+]\s/.test(line) || /^\s*\d+\.\s/.test(line)) {
-      return leadingSpaces;
-    }
-
-    return leadingSpaces;
-  }
-
-  return 0;
-}
+// Import the pure utils for use in the language support object
+import {
+  isValidMarkdownTemplatePosition,
+  calculateMarkdownIndentation,
+} from "./markdown-utils";
 
 /**
  * Markdown language support for CodeEditor with template expression handling.

package/src/components/CodeEditor/languageSupport/xml-utils.ts

@@ -0,0 +1,94 @@
+/**
+ * Pure utility functions for XML parsing that don't depend on CodeMirror.
+ * These are extracted to allow testing without triggering CodeMirror's module loading.
+ */
+
+/**
+ * Check if cursor is in a valid XML template position.
+ * Templates can appear in:
+ * 1. Text content between tags: <tag>|</tag>
+ * 2. Attribute values: <tag attr="|">
+ * @internal Exported for testing
+ */
+export function isValidXmlTemplatePosition(text: string): boolean {
+  // Check if we're inside an attribute value (inside quotes after =)
+  let inTag = false;
+  let inAttrValue = false;
+  let quoteChar = "";
+
+  for (let i = 0; i < text.length; i++) {
+    const char = text[i];
+
+    if (!inTag && char === "<" && text[i + 1] !== "/") {
+      inTag = true;
+      inAttrValue = false;
+    } else if (inTag && char === ">") {
+      inTag = false;
+      inAttrValue = false;
+    } else if (inTag && !inAttrValue && char === "=") {
+      // Next should be a quote
+      const nextChar = text[i + 1];
+      if (nextChar === '"' || nextChar === "'") {
+        quoteChar = nextChar;
+        inAttrValue = true;
+        i++; // Skip the quote
+      }
+    } else if (inAttrValue && char === quoteChar) {
+      inAttrValue = false;
+      quoteChar = "";
+    }
+  }
+
+  // Valid if inside attribute value
+  if (inAttrValue) {
+    return true;
+  }
+
+  // Valid if between tags (text content position)
+  // Check if we're after a closing > and not inside an opening <
+  const lastOpenTag = text.lastIndexOf("<");
+  const lastCloseTag = text.lastIndexOf(">");
+
+  // If last > is after last <, we're in text content
+  if (lastCloseTag > lastOpenTag) {
+    return true;
+  }
+
+  return false;
+}
+
+/**
+ * Calculate indentation for XML, properly handling template expressions.
+ * @internal Exported for testing
+ */
+export function calculateXmlIndentation(
+  textBefore: string,
+  indentUnit: number,
+): number {
+  let depth = 0;
+
+  // Match all opening and closing tags
+  const tagRegex = /<\/?[\w:-]+[^>]*\/?>/g;
+  let match;
+
+  while ((match = tagRegex.exec(textBefore)) !== null) {
+    const tag = match[0];
+
+    // Self-closing tag: <tag />
+    if (tag.endsWith("/>")) {
+      // No depth change
+      continue;
+    }
+
+    // Closing tag: </tag>
+    if (tag.startsWith("</")) {
+      depth = Math.max(0, depth - 1);
+      continue;
+    }
+
+    // Opening tag: <tag> or <tag attr="value">
+    depth++;
+  }
+
+  return depth * indentUnit;
+}

package/src/components/CodeEditor/languageSupport/xml.test.ts

@@ -1,6 +1,9 @@
 import { describe, expect, it } from "bun:test";
 
-import { isValidXmlTemplatePosition, calculateXmlIndentation } from "./xml";
+import {
+  isValidXmlTemplatePosition,
+  calculateXmlIndentation,
+} from "./xml-utils";
 
 describe("isValidXmlTemplatePosition", () => {
   describe("text content positions", () => {