division-ds 0.7.0 → 0.7.1

package/AGENTS.md

@@ -51,7 +51,7 @@ installs these rules into that project's `AGENTS.md`, `GEMINI.md` and Cursor rul
 `.claude/skills/` (Claude Code).
 
 An agent that supports MCP can have the docs and the same checks as tools instead:
-`claude mcp add division-ds -- npx -y division-ds@0.6.0 mcp` (`list_components`, `get_component`,
+`claude mcp add division-ds -- npx -y division-ds@0.7.1 mcp` (`list_components`, `get_component`,
 `search`, `get_tokens`, `validate_code`, `check_contrast`, `get_add_command`,
 `get_review_checklist`).
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "division-ds",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "Checks a project that uses Division DS components (raw colours, invented tokens, touching buttons, unknown props), and serves the docs and the same checks to agents over MCP.",
   "license": "MIT",
   "author": "Victor Ilioiu",

package/public/docs/components/select.md

@@ -116,6 +116,18 @@ const DELIVERY_GROUPS: SelectGroup[] = [
 <Select label="Delivery" groups={DELIVERY_GROUPS} placeholder="Choose delivery" />
 ```
 
+### Long list
+
+```tsx
+const MONTH_OPTIONS = Array.from({ length: 30 }, (_, i) => {
+  const date = new Date(Date.UTC(2026, 10 - i, 1))
+  const label = date.toLocaleDateString('en-GB', { month: 'long', year: 'numeric', timeZone: 'UTC' })
+  return { value: date.toISOString().slice(0, 7), label }
+})
+
+<Select label="Billing month" options={MONTH_OPTIONS} placeholder="Choose a month" />
+```
+
 ### Sizes
 
 ```tsx

package/public/manifest/components.json

@@ -2373,6 +2373,10 @@
           "caption": "Groups with headings and icons",
           "source": "const DELIVERY_GROUPS: SelectGroup[] = [\n  {\n    label: 'Courier',\n    options: [\n      { value: 'standard', label: 'Standard', icon: <Truck /> },\n      { value: 'priority', label: 'Priority', icon: <Zap /> },\n    ],\n  },\n  {\n    label: 'Collect',\n    options: [\n      { value: 'depot', label: 'Brasov depot', icon: <Package /> },\n      { value: 'field', label: 'At the field', icon: <Crosshair /> },\n    ],\n  },\n]\n\n<Select label=\"Delivery\" groups={DELIVERY_GROUPS} placeholder=\"Choose delivery\" />"
         },
+        {
+          "caption": "Long list",
+          "source": "const MONTH_OPTIONS = Array.from({ length: 30 }, (_, i) => {\n  const date = new Date(Date.UTC(2026, 10 - i, 1))\n  const label = date.toLocaleDateString('en-GB', { month: 'long', year: 'numeric', timeZone: 'UTC' })\n  return { value: date.toISOString().slice(0, 7), label }\n})\n\n<Select label=\"Billing month\" options={MONTH_OPTIONS} placeholder=\"Choose a month\" />"
+        },
         {
           "caption": "Sizes",
           "source": "const TERRAIN_OPTIONS = [\n  { value: 'woodland', label: 'Woodland' },\n  { value: 'urban', label: 'Urban' },\n  { value: 'desert', label: 'Desert' },\n  { value: 'indoor', label: 'Indoor' },\n]\n\n<Select label=\"Terrain (small)\" inputSize=\"sm\" options={TERRAIN_OPTIONS} placeholder=\"Terrain\" />\n<Select label=\"Terrain (medium)\" inputSize=\"md\" options={TERRAIN_OPTIONS} placeholder=\"Terrain\" />\n<Select label=\"Terrain (large)\" inputSize=\"lg\" options={TERRAIN_OPTIONS} placeholder=\"Terrain\" />"