atlas-react-kit 0.12.0 → 1.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "atlas-react-kit",
-  "version": "0.12.0",
+  "version": "1.0.0",
   "description": "Shared React components and Tailwind theme for Atlas",
   "type": "module",
   "license": "MIT",
@@ -52,6 +52,10 @@
       "types": "./dist/card.d.ts",
       "default": "./dist/card.js"
     },
+    "./chart": {
+      "types": "./dist/chart.d.ts",
+      "default": "./dist/chart.js"
+    },
     "./checkbox": {
       "types": "./dist/checkbox.d.ts",
       "default": "./dist/checkbox.js"
@@ -100,6 +104,10 @@
       "types": "./dist/input.d.ts",
       "default": "./dist/input.js"
     },
+    "./kanban": {
+      "types": "./dist/kanban.d.ts",
+      "default": "./dist/kanban.js"
+    },
     "./label": {
       "types": "./dist/label.d.ts",
       "default": "./dist/label.js"
@@ -112,10 +120,22 @@
       "types": "./dist/meter.d.ts",
       "default": "./dist/meter.js"
     },
+    "./nav-link": {
+      "types": "./dist/nav-link.d.ts",
+      "default": "./dist/nav-link.js"
+    },
+    "./page-header": {
+      "types": "./dist/page-header.d.ts",
+      "default": "./dist/page-header.js"
+    },
     "./pagination": {
       "types": "./dist/pagination.d.ts",
       "default": "./dist/pagination.js"
     },
+    "./period-stepper": {
+      "types": "./dist/period-stepper.d.ts",
+      "default": "./dist/period-stepper.js"
+    },
     "./popover": {
       "types": "./dist/popover.d.ts",
       "default": "./dist/popover.js"
@@ -144,6 +164,10 @@
       "types": "./dist/skeleton.d.ts",
       "default": "./dist/skeleton.js"
     },
+    "./skip-link": {
+      "types": "./dist/skip-link.d.ts",
+      "default": "./dist/skip-link.js"
+    },
     "./slider": {
       "types": "./dist/slider.d.ts",
       "default": "./dist/slider.js"
@@ -200,6 +224,18 @@
       "types": "./dist/tooltip.d.ts",
       "default": "./dist/tooltip.js"
     },
+    "./form/checkbox-field": {
+      "types": "./dist/form/checkbox-field.d.ts",
+      "default": "./dist/form/checkbox-field.js"
+    },
+    "./form/combobox-field": {
+      "types": "./dist/form/combobox-field.d.ts",
+      "default": "./dist/form/combobox-field.js"
+    },
+    "./form/control-field": {
+      "types": "./dist/form/control-field.d.ts",
+      "default": "./dist/form/control-field.js"
+    },
     "./form/date-picker-field": {
       "types": "./dist/form/date-picker-field.d.ts",
       "default": "./dist/form/date-picker-field.js"
@@ -208,14 +244,14 @@
       "types": "./dist/form/date-time-picker-field.d.ts",
       "default": "./dist/form/date-time-picker-field.js"
     },
-    "./form/field-error": {
-      "types": "./dist/form/field-error.d.ts",
-      "default": "./dist/form/field-error.js"
-    },
     "./form/feedback-field": {
       "types": "./dist/form/feedback-field.d.ts",
       "default": "./dist/form/feedback-field.js"
     },
+    "./form/field-error": {
+      "types": "./dist/form/field-error.d.ts",
+      "default": "./dist/form/field-error.js"
+    },
     "./form/markdown-field": {
       "types": "./dist/form/markdown-field.d.ts",
       "default": "./dist/form/markdown-field.js"
@@ -228,6 +264,18 @@
       "types": "./dist/form/text-field.d.ts",
       "default": "./dist/form/text-field.js"
     },
+    "./form/toggle-group-field": {
+      "types": "./dist/form/toggle-group-field.d.ts",
+      "default": "./dist/form/toggle-group-field.js"
+    },
+    "./next/nav-link": {
+      "types": "./dist/next/nav-link.d.ts",
+      "default": "./dist/next/nav-link.js"
+    },
+    "./next/period-stepper": {
+      "types": "./dist/next/period-stepper.d.ts",
+      "default": "./dist/next/period-stepper.js"
+    },
     "./next/tabs-nav-link": {
       "types": "./dist/next/tabs-nav-link.d.ts",
       "default": "./dist/next/tabs-nav-link.js"
@@ -245,9 +293,17 @@
     "build": "tsc",
     "check": "npm run build && npm run docs:check && prettier --check .",
     "docs:check": "node scripts/check-doc-links.mjs",
+    "lint": "oxlint --type-aware --deny-warnings",
+    "knip": "knip",
+    "sast": "node scripts/sast.mjs",
+    "secrets": "secretlint \"**/*\"",
+    "size": "size-limit",
+    "gate:static": "npm run lint && npm run knip && npm run sast && npm run secrets",
+    "gate": "npm run check && npm run gate:static && npm run size && vitest run",
     "test": "npm run build && vitest run",
     "test:coverage": "npm run build && vitest run --coverage",
-    "prepack": "npm run build"
+    "prepack": "npm run build",
+    "prepare": "lefthook install"
   },
   "engines": {
     "node": ">=20.19.0"
@@ -256,6 +312,8 @@
     "access": "public"
   },
   "peerDependencies": {
+    "@dnd-kit/dom": "^0.4.0",
+    "@dnd-kit/react": "^0.4.0",
     "date-fns": "^4.4.0",
     "next": "^16.0.0",
     "next-themes": "^0.4.6",
@@ -264,11 +322,16 @@
     "react-dom": "^19.0.0",
     "react-markdown": "^10.1.0",
     "remark-gfm": "^4.0.1",
-    "remark-parse": "^11.0.0",
     "sonner": "^2.0.7",
     "tailwindcss": "^4.0.0"
   },
   "peerDependenciesMeta": {
+    "@dnd-kit/dom": {
+      "optional": true
+    },
+    "@dnd-kit/react": {
+      "optional": true
+    },
     "date-fns": {
       "optional": true
     },
@@ -300,6 +363,10 @@
     "tw-animate-css": "^1.4.0"
   },
   "devDependencies": {
+    "@dnd-kit/dom": "^0.4.0",
+    "@dnd-kit/react": "^0.4.0",
+    "@secretlint/secretlint-rule-preset-recommend": "^13.0.7",
+    "@size-limit/file": "^14.2.0",
     "@testing-library/dom": "^10.4.2",
     "@testing-library/jest-dom": "^7.0.1",
     "@testing-library/react": "^16.3.3",
@@ -307,21 +374,28 @@
     "@types/node": "^25.5.0",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
-    "@vitest/coverage-v8": "4.1.11",
+    "@vitest/coverage-v8": "5.0.5",
     "date-fns": "^4.4.0",
     "jsdom": "^29.1.1",
-    "next": "16.2.6",
+    "knip": "^6.41.0",
+    "lefthook": "^2.2.2",
+    "next": "16.4.2",
     "next-themes": "^0.4.6",
+    "oxlint": "^1.88.0",
+    "oxlint-tsgolint": "^7.0.2004",
     "prettier": "^3.8.1",
     "react": "^19.2.4",
     "react-day-picker": "^10.0.1",
     "react-dom": "^19.2.4",
     "react-markdown": "^10.1.0",
     "remark-gfm": "^4.0.1",
+    "remark-parse": "^11.0.0",
+    "secretlint": "^13.0.7",
+    "size-limit": "^14.2.0",
     "sonner": "^2.0.7",
     "tailwindcss": "^4.2.1",
-    "typescript": "^6.0.3",
+    "typescript": "^7.0.2",
     "unified": "^11.0.5",
-    "vitest": "^4.1.9"
+    "vitest": "^5.0.5"
   }
 }

package/skills/atlas-react-kit/SKILL.md

@@ -61,9 +61,11 @@ Import each component from its subpath, e.g.
 | One date, or a from/to range                    | `DatePickerButton` from `date-picker` (`mode="range"` for ranges)                                                       |
 | Date and time (not `datetime-local`)            | `DateTimePickerButton` from `date-time-picker`                                                                          |
 | Labelled field with error text                  | `FormTextField`, `FormSelectField`, `FormDatePickerField`, `FormDateTimePickerField`, `FormMarkdownField` from `form/*` |
+| Labelled custom control (combobox) in a form    | `FormControlField` from `form/control-field`                                                                            |
 | Form-level error (save failed)                  | `FormFeedbackField` from `form/feedback-field`                                                                          |
 | Content panels on one page                      | `Tabs`, `TabsList`, `TabsTrigger`, `TabsContent` from `tabs`                                                            |
 | View switch that changes the URL                | `TabsNav` with links: `TabsNavLink` from `next/tabs-nav-link` in Next, else `tabsTriggerVariants()`                     |
+| App shell nav (Calendar, Tasks, Settings)       | `NavLink` from `nav-link` (`asChild` for a router link); Next: `next/nav-link`                                          |
 | Status chip (paid, pending, failed)             | `Badge variant="soft"` with `tone="success"`, `"warning"`, `"destructive"`, or `"neutral"`                              |
 | Data table                                      | `Table` family from `table`; `SortableTableHead`; `TableBodySkeleton` while loading                                     |
 | Nothing to show yet                             | `EmptyPanel` from `empty-panel`                                                                                         |

package/theme.css

@@ -197,6 +197,17 @@
    * Radix can unmount closing overlays. `!important` in this early layer
    * beats the utility classes that set the animations.
    */
+  /*
+   * Forced colors (Windows High Contrast) drop box-shadow, which is how the
+   * kit draws its focus ring, so keyboard focus would vanish. Draw it as a
+   * system-colored outline there instead (WCAG 2.4.7).
+   */
+  @media (forced-colors: active) {
+    :focus-visible {
+      outline: 2px solid Highlight !important;
+      outline-offset: 2px !important;
+    }
+  }
   @media (prefers-reduced-motion: reduce) {
     *,
     ::before,