kanto-ds 1.5.2 → 1.6.1

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "kanto-ds",
-  "version": "1.5.2",
+  "version": "1.6.1",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -1715,7 +1715,7 @@
         },
         {
           "name": "kt-calendar",
-          "description": "A month calendar to pick a day or a period from, shown in the page.\n\nThe same calendar `<kt-date-picker>` opens in its popup, for when the\ncalendar is the interface rather than a way to fill a field: a booking\npage, a dashboard's date filter, a planning view.\n\nThe header's month and year are buttons. The month opens a grid of the\ntwelve months, the year a grid of twelve years, so reaching a date years\naway takes three clicks rather than paging month by month.\n\nKeyboard, in the day grid (the WAI-ARIA date grid pattern): arrows by day\nand week, Home/End to the week's ends, Page Up/Down by month and with Shift\nby year, Enter to choose. In the month and year grids: arrows, Page Up/Down\nby year or by twelve years, Enter to choose, Escape back to the days.\n\n---\n\n\n### **Events:**\n - **kt-change** - A day, or a whole period, was chosen. `detail: { value }`.\n\n### **Methods:**\n - **focus(): _void_** - Focuses the grid's current cell — the chosen day, or today.\n\n### **CSS Parts:**\n - **base** - The calendar.\n- **day** - A day cell.",
+          "description": "A month calendar to pick a day or a period from, shown in the page.\n\nThe same calendar `<kt-date-picker>` opens in its popup, for when the\ncalendar is the interface rather than a way to fill a field: a booking\npage, a dashboard's date filter, a planning view.\n\nThe title — \"September 2026\" — opens one panel: a scrolling list of years\nbeside the twelve months of the one chosen. A year is a click or four typed\ndigits away, then its month a second click, whatever the distance.\n\nKeyboard, in the day grid (the WAI-ARIA date grid pattern): arrows by day\nand week, Home/End to the week's ends, Page Up/Down by month and with Shift\nby year, Enter to choose. In the year list: arrows, Page Up/Down by ten,\nHome/End, or type the year; Enter or Tab on to the months. In the months:\narrows, Enter to choose. Escape returns to the days.\n\n---\n\n\n### **Events:**\n - **kt-change** - A day, or a whole period, was chosen. `detail: { value }`.\n\n### **Methods:**\n - **focus(): _void_** - Focuses the grid's current cell — the chosen day, or today.\n\n### **CSS Parts:**\n - **base** - The calendar.\n- **day** - A day cell.",
           "doc-url": "",
           "attributes": [
             {
@@ -1743,6 +1743,11 @@
               "description": "BCP 47 language tag for names and the first day of the week. Empty: the\npage's `lang`, then the browser's language.",
               "value": { "type": "string", "default": "''" }
             },
+            {
+              "name": "months",
+              "description": "How many months the day view shows side by side: 1, or 2 for a period.",
+              "value": { "type": "1 | 2", "default": "1" }
+            },
             {
               "name": "label",
               "description": "Accessible name of the calendar. Defaults to the strings registry.",
@@ -1782,6 +1787,11 @@
                 "description": "BCP 47 language tag for names and the first day of the week. Empty: the\npage's `lang`, then the browser's language.",
                 "type": "string"
               },
+              {
+                "name": "months",
+                "description": "How many months the day view shows side by side: 1, or 2 for a period.",
+                "type": "1 | 2"
+              },
               {
                 "name": "label",
                 "description": "Accessible name of the calendar. Defaults to the strings registry.",
@@ -1882,9 +1892,42 @@
             ]
           }
         },
+        {
+          "name": "kt-date-input",
+          "description": "A date typed into its parts: day, month and year, each its own segment.\n\nThe segments come in the order the reader's language writes a date —\n`25/09/2026` in London, `09/25/2026` in New York, `25.09.2026` in Berlin —\nand the focus moves on as each fills, so a date is eight keystrokes. The\narrows step a segment, a day never past its month's end. The value is ISO\n8601, `2026-09-25`, and `null` until the date is complete.\n\nWith `calendar`, a button at the end opens a `<kt-calendar>` to pick from.\n\n---\n\n\n### **Events:**\n - **kt-change** - The date became complete, changed, or stopped being one. `detail: { value }` — the ISO date or `null`.\n\n### **Methods:**\n \n\n### **CSS Parts:**\n - **field** - The field.\n- **segment** - A day, month or year segment.\n- **trigger** - The calendar button, with `calendar`.\n- **panel** - The calendar popup, with `calendar`.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "calendar",
+              "description": "Adds a button that opens a calendar to pick the date from.",
+              "value": { "type": "boolean", "default": "false" }
+            }
+          ],
+          "events": [
+            {
+              "name": "kt-change",
+              "description": "The date became complete, changed, or stopped being one. `detail: { value }` — the ISO date or `null`."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "calendar",
+                "description": "Adds a button that opens a calendar to pick the date from.",
+                "type": "boolean"
+              }
+            ],
+            "events": [
+              {
+                "name": "kt-change",
+                "description": "The date became complete, changed, or stopped being one. `detail: { value }` — the ISO date or `null`."
+              }
+            ]
+          }
+        },
         {
           "name": "kt-date-picker",
-          "description": "A date field with a calendar, for one day or a period.\n\nThe value is ISO 8601 text, the format a server and a `<input type=\"date\">`\nalready speak: `2026-09-25`, or `2026-09-01/2026-09-25` for a period. What\nthe field shows is the same date formatted for the reader's language, and\nthe calendar starts its weeks on the day their region does.\n\nThe popup is a `<kt-calendar>`, with its keyboard model and its month and\nyear views: the WAI-ARIA date picker dialog pattern, where Escape closes the\ndialog and hands focus back to the field, and tabbing out closes it too.\n\n---\n\n\n### **Events:**\n - **kt-change** - A date or a whole period was chosen, or the value cleared. `detail: { value }` — the ISO date or interval, or `null`.\n\n### **Methods:**\n - **formDisabledCallback(disabled: _boolean_): _void_** - Called by the platform when the control's disabled state changes — its\nown `disabled`, or an ancestor `<fieldset disabled>` it cannot see.\n\n### **CSS Parts:**\n - **trigger** - The field.\n- **panel** - The calendar popup.\n- **calendar** - The `<kt-calendar>` inside it.",
+          "description": "A date field with a calendar, for one day or a period.\n\nThe value is ISO 8601 text, the format a server and a `<input type=\"date\">`\nalready speak: `2026-09-25`, or `2026-09-01/2026-09-25` for a period. What\nthe field shows is the same date formatted for the reader's language, and\nthe calendar starts its weeks on the day their region does.\n\nThe field takes a date typed the way the reader writes it — `25/09/2026` in\nLondon, `9/25/2026` in New York, `25 sept.` in Paris, ISO anywhere — on Enter\nor when it is left. What does not read as a date is flagged, and the value\nit had is kept.\n\nThe popup is a `<kt-calendar>`, with its keyboard model and its month and\nyear views: the WAI-ARIA date picker dialog pattern, where Escape closes the\ndialog and hands focus back to the field, and tabbing out closes it too.\n\n---\n\n\n### **Events:**\n - **kt-change** - A date or a whole period was chosen, or the value cleared. `detail: { value }` — the ISO date or interval, or `null`.\n\n### **Methods:**\n - **formDisabledCallback(disabled: _boolean_): _void_** - Called by the platform when the control's disabled state changes — its\nown `disabled`, or an ancestor `<fieldset disabled>` it cannot see.\n\n### **CSS Parts:**\n - **field** - The field.\n- **input** - The text the date is typed into.\n- **trigger** - The button that opens the calendar.\n- **panel** - The calendar popup.\n- **presets** - The column of ready-made periods, with `range`.\n- **calendar** - The `<kt-calendar>` inside it.",
           "doc-url": "",
           "attributes": [
             {
@@ -1998,6 +2041,11 @@
                 "description": "Shows a button that empties the field once it holds a value.",
                 "type": "boolean"
               },
+              {
+                "name": "presets",
+                "description": "Ready-made periods offered beside the calendar, with `range`. Unset: the\nperiods a dashboard asks for most — today, the last 7 and 30 days, this\nmonth and last, this year. An empty list hides the column.",
+                "type": "readonly KtDatePreset[] | undefined"
+              },
               {
                 "name": "error",
                 "description": "Error message. A non-empty value puts the field in its error state.",
@@ -2445,6 +2493,92 @@
             "events": []
           }
         },
+        {
+          "name": "kt-multi-select",
+          "description": "Several choices from a list: type to narrow it, pick as many as you need.\n\nEach choice shows in the field as a removable chip. The field keeps to one\nline — the chips that do not fit collapse into a \"+3\" — so it sits in a row\nof filters without changing its height; the open list shows everything,\nchosen or not.\n\n---\n\n\n### **Events:**\n - **kt-change** - The choice changed. `detail: { value, options }`.\n- **kt-filter** - The query changed. `detail: { query }`.\n\n### **Methods:**\n - **formDisabledCallback(disabled: _boolean_): _void_** - Called by the platform when the control's disabled state changes — its\nown `disabled`, or an ancestor `<fieldset disabled>` it cannot see.\n- **formStateRestoreCallback(state: _string | FormData | null_): _void_** - Called by the platform when the browser restores a session.\n\n### **CSS Parts:**\n - **control** - The field.\n- **chips** - The row of chips.\n- **input** - The native `<input>`.\n- **popup** - The option list.\n- **option** - An option row.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "placeholder",
+              "value": { "type": "string", "default": "''" }
+            },
+            { "name": "name", "value": { "type": "string", "default": "''" } },
+            {
+              "name": "disabled",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "required",
+              "description": "At least one value must be chosen.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            { "name": "error", "value": { "type": "string", "default": "''" } },
+            {
+              "name": "label",
+              "description": "Accessible name, when no `<kt-label-input>` wraps the field.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "empty-text",
+              "description": "Shown in the list when no option matches.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            }
+          ],
+          "events": [
+            {
+              "name": "kt-change",
+              "description": "The choice changed. `detail: { value, options }`."
+            },
+            {
+              "name": "kt-filter",
+              "description": "The query changed. `detail: { query }`."
+            }
+          ],
+          "js": {
+            "properties": [
+              { "name": "options", "type": "readonly KtOption[]" },
+              {
+                "name": "value",
+                "description": "The ids of the chosen options, in the order they were chosen.",
+                "type": "KtMultiSelectValue"
+              },
+              { "name": "placeholder", "type": "string" },
+              { "name": "name", "type": "string" },
+              { "name": "disabled", "type": "boolean" },
+              {
+                "name": "required",
+                "description": "At least one value must be chosen.",
+                "type": "boolean"
+              },
+              { "name": "error", "type": "string" },
+              {
+                "name": "label",
+                "description": "Accessible name, when no `<kt-label-input>` wraps the field.",
+                "type": "string"
+              },
+              {
+                "name": "emptyText",
+                "description": "Shown in the list when no option matches.",
+                "type": "string | undefined"
+              },
+              {
+                "name": "selectedOptions",
+                "description": "The chosen options, in the order chosen.",
+                "type": "readonly KtOption[]"
+              }
+            ],
+            "events": [
+              {
+                "name": "kt-change",
+                "description": "The choice changed. `detail: { value, options }`."
+              },
+              {
+                "name": "kt-filter",
+                "description": "The query changed. `detail: { query }`."
+              }
+            ]
+          }
+        },
         {
           "name": "kt-radio",
           "description": "One option of a `<kt-radio-group>`.\n\nIt draws itself and carries `role=\"radio\"`; the group owns the selection,\nthe tab stop and the keyboard. A `<kt-radio>` outside a group does nothing\nuseful.\n\n---\n\n\n### **Slots:**\n - _default_ - The label.\n\n### **CSS Parts:**\n - **base** - The `role=\"radio\"` row.\n- **circle** - The drawn circle.",
@@ -2777,6 +2911,59 @@
             ]
           }
         },
+        {
+          "name": "kt-time-input",
+          "description": "A time of day typed into its parts: hours, minutes and, if asked, seconds.\n\nThe clock is the reader's — `14:30` in London, `2:30 PM` in New York — or\nthe one `hour-cycle` names. Whatever the clock shows, the value is the\n24-hour time HTML uses, `14:30` or `14:30:00`, and `null` until complete.\nThe arrows step a segment, the minutes by `step`.\n\n---\n\n\n### **Events:**\n - **kt-change** - The time became complete, changed, or stopped being one. `detail: { value }` — `HH:MM`, `HH:MM:SS` or `null`.\n\n### **Methods:**\n \n\n### **CSS Parts:**\n - **field** - The field.\n- **segment** - An hour, minute, second or AM/PM segment.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "seconds",
+              "description": "Shows a seconds segment, and puts seconds in the value.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "hour-cycle",
+              "description": "The clock to show: `h12` with AM/PM, `h23` without. Empty: the language's.",
+              "value": { "type": "KtHourCycle | ''", "default": "''" }
+            },
+            {
+              "name": "step",
+              "description": "How many minutes the arrows step by.",
+              "value": { "type": "number", "default": "1" }
+            }
+          ],
+          "events": [
+            {
+              "name": "kt-change",
+              "description": "The time became complete, changed, or stopped being one. `detail: { value }` — `HH:MM`, `HH:MM:SS` or `null`."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "seconds",
+                "description": "Shows a seconds segment, and puts seconds in the value.",
+                "type": "boolean"
+              },
+              {
+                "name": "hourCycle",
+                "description": "The clock to show: `h12` with AM/PM, `h23` without. Empty: the language's.",
+                "type": "KtHourCycle | ''"
+              },
+              {
+                "name": "step",
+                "description": "How many minutes the arrows step by.",
+                "type": "number"
+              }
+            ],
+            "events": [
+              {
+                "name": "kt-change",
+                "description": "The time became complete, changed, or stopped being one. `detail: { value }` — `HH:MM`, `HH:MM:SS` or `null`."
+              }
+            ]
+          }
+        },
         {
           "name": "kt-toggle",
           "description": "An on/off switch.\n\nSized off the button heights so a toggle lines up with the controls beside\nit: the track is 1.8× the field height, the thumb is inset by 12% of it.\nChange `--button-height` and the switch follows.\n\n---\n\n\n### **Events:**\n - **kt-change** - The state changed. `detail: { checked }`.\n\n### **Methods:**\n - **formDisabledCallback(disabled: _boolean_): _void_** - Called by the platform when the control's disabled state changes — its\nown `disabled`, or an ancestor `<fieldset disabled>` it cannot see.\n\n### **Slots:**\n - _default_ - Optional label, rendered beside the switch and clickable.\n\n### **CSS Parts:**\n - **base** - The button carrying `role=\"switch\"`.\n- **track** - The track.\n- **thumb** - The sliding thumb.",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kanto-ds",
-  "version": "1.5.2",
+  "version": "1.6.1",
   "description": "Framework-agnostic design system for data-dense product interfaces.",
   "keywords": [
     "design-system",
@@ -23,6 +23,10 @@
   "type": "module",
   "sideEffects": [
     "*.css",
+    "./dist/index.js",
+    "./dist/vue/index.js",
+    "./src/index.ts",
+    "./src/vue/index.ts",
     "./dist/components/**",
     "./dist/icons/defaults.js",
     "./src/components/**",
@@ -161,6 +165,10 @@
       "types": "./dist/components/forms/kt-checkbox/kt-checkbox.d.ts",
       "default": "./dist/components/forms/kt-checkbox/kt-checkbox.js"
     },
+    "./components/forms/kt-date-input": {
+      "types": "./dist/components/forms/kt-date-input/kt-date-input.d.ts",
+      "default": "./dist/components/forms/kt-date-input/kt-date-input.js"
+    },
     "./components/forms/kt-date-picker": {
       "types": "./dist/components/forms/kt-date-picker/kt-date-picker.d.ts",
       "default": "./dist/components/forms/kt-date-picker/kt-date-picker.js"
@@ -181,6 +189,10 @@
       "types": "./dist/components/forms/kt-input-menu/kt-input-menu.d.ts",
       "default": "./dist/components/forms/kt-input-menu/kt-input-menu.js"
     },
+    "./components/forms/kt-multi-select": {
+      "types": "./dist/components/forms/kt-multi-select/kt-multi-select.d.ts",
+      "default": "./dist/components/forms/kt-multi-select/kt-multi-select.js"
+    },
     "./components/forms/kt-label-input": {
       "types": "./dist/components/forms/kt-label-input/kt-label-input.d.ts",
       "default": "./dist/components/forms/kt-label-input/kt-label-input.js"
@@ -197,6 +209,10 @@
       "types": "./dist/components/forms/kt-textarea/kt-textarea.d.ts",
       "default": "./dist/components/forms/kt-textarea/kt-textarea.js"
     },
+    "./components/forms/kt-time-input": {
+      "types": "./dist/components/forms/kt-time-input/kt-time-input.d.ts",
+      "default": "./dist/components/forms/kt-time-input/kt-time-input.js"
+    },
     "./components/forms/kt-toggle": {
       "types": "./dist/components/forms/kt-toggle/kt-toggle.d.ts",
       "default": "./dist/components/forms/kt-toggle/kt-toggle.js"
@@ -286,8 +302,9 @@
     "format:check": "prettier --check .",
     "clean": "node -e \"fs.rmSync(dist,{recursive:true,force:true})\"",
     "check:exports": "node scripts/check-exports.js",
+    "check:consumer": "node scripts/check-consumer.js",
     "check:size": "node scripts/check-size.js",
-    "verify": "npm run format:check && npm run lint && npm run typecheck && npm run test && npm run build && npm run check:exports && npm run check:size && npm run build:demo",
+    "verify": "npm run format:check && npm run lint && npm run typecheck && npm run test && npm run build && npm run check:exports && npm run check:consumer && npm run check:size && npm run build:demo",
     "release": "node scripts/release.js",
     "release:dry": "node scripts/release.js --dry-run",
     "prepublishOnly": "npm run verify"

package/dist/chunks/defaults-CFrjqae2.js

@@ -1,59 +0,0 @@
-import { X as s, User as a, TriangleAlert as c, Trash2 as i, Search as f, Minus as g, Menu as p, LoaderCircle as u, Info as C, FileUp as l, File as y, EyeOff as A, Eye as I, Copy as h, CircleCheck as w, CircleAlert as $, ChevronUp as b, ChevronRight as d, ChevronLeft as v, ChevronDown as U, Check as Z, Calendar as k, ArrowUp as m, ArrowDown as z } from "lucide";
-const n = /* @__PURE__ */ new Map();
-function t(e) {
-  return e.replace(/([A-Z]+)([A-Z][a-z])/g, "$1-$2").replace(/([a-zA-Z])(\d)/g, "$1-$2").replace(/([a-z])([A-Z])/g, "$1-$2").replace(/[\s_]+/g, "-").toLowerCase();
-}
-function L(e, r) {
-  n.set(t(e), r);
-}
-function M(e) {
-  for (const [r, o] of Object.entries(e))
-    j(o) && L(r, o);
-}
-function F(e) {
-  return n.get(t(e));
-}
-function O() {
-  return [...n.keys()].sort();
-}
-function j(e) {
-  return Array.isArray(e) && e.every(
-    (r) => Array.isArray(r) && typeof r[0] == "string" && typeof r[1] == "object" && r[1] !== null
-  );
-}
-const D = {
-  ArrowDown: z,
-  ArrowUp: m,
-  Calendar: k,
-  Check: Z,
-  ChevronDown: U,
-  ChevronLeft: v,
-  ChevronRight: d,
-  ChevronUp: b,
-  CircleAlert: $,
-  CircleCheck: w,
-  Copy: h,
-  Eye: I,
-  EyeOff: A,
-  File: y,
-  FileUp: l,
-  Info: C,
-  LoaderCircle: u,
-  Menu: p,
-  Minus: g,
-  Search: f,
-  Trash2: i,
-  TriangleAlert: c,
-  User: a,
-  X: s
-};
-M(D);
-export {
-  M as a,
-  O as b,
-  D as d,
-  F as g,
-  L as r,
-  t
-};
-//# sourceMappingURL=defaults-CFrjqae2.js.map

package/dist/chunks/defaults-CFrjqae2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"defaults-CFrjqae2.js","sources":["../../src/icons/registry.ts","../../src/icons/defaults.ts"],"sourcesContent":["/**\n * The icon registry.\n *\n * `<kt-icon>` looks icons up by name at render time, which means the set of\n * icons cannot be statically analysed and a bundler cannot tree-shake it. So\n * Kanto does not bundle all two thousand Lucide icons: the elements register\n * the handful they need themselves, and an application registers whatever else\n * it uses.\n *\n *     import { Rocket, Wallet } from 'lucide';\n *     import { registerIcons } from 'kanto-ds/icons';\n *\n *     registerIcons({ Rocket, Wallet });\n *\n * Names are normalised to kebab-case, so `Rocket`, `rocket` and\n * `ChevronDown` / `chevron-down` all resolve.\n */\n\n/** A Lucide icon: a flat list of SVG children, each `[tag, attributes]`. */\nexport type IconNode = [tag: string, attrs: Record<string, string | number | undefined>][];\n\nconst registry = new Map<string, IconNode>();\n\n/**\n * `ChevronDown` → `chevron-down`, `Trash2` → `trash-2`, `AArrowDown` →\n * `a-arrow-down`.\n *\n * The digit boundary matters: Lucide names that icon `trash-2`, so a rule that\n * only splits on case produces `trash2` and the lookup quietly misses.\n */\nexport function toKebabCase(name: string): string {\n  return name\n    .replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2') // acronym run before a word\n    .replace(/([a-zA-Z])(\\d)/g, '$1-$2') // letter before a digit\n    .replace(/([a-z])([A-Z])/g, '$1-$2') // ordinary camel boundary\n    .replace(/[\\s_]+/g, '-')\n    .toLowerCase();\n}\n\n/** Registers a single icon under `name`. */\nexport function registerIcon(name: string, node: IconNode): void {\n  registry.set(toKebabCase(name), node);\n}\n\n/**\n * Registers a map of icons. Accepts a Lucide namespace import directly:\n * every non-icon export (`createElement`, `createIcons`, …) is skipped.\n */\nexport function registerIcons(icons: Record<string, unknown>): void {\n  for (const [name, node] of Object.entries(icons)) {\n    if (isIconNode(node)) registerIcon(name, node);\n  }\n}\n\n/** Returns the icon registered under `name`, or `undefined`. */\nexport function getIcon(name: string): IconNode | undefined {\n  return registry.get(toKebabCase(name));\n}\n\n/** Every registered name, kebab-cased and sorted. Useful for docs and tests. */\nexport function registeredIcons(): string[] {\n  return [...registry.keys()].sort();\n}\n\nfunction isIconNode(value: unknown): value is IconNode {\n  return (\n    Array.isArray(value) &&\n    value.every(\n      (child) =>\n        Array.isArray(child) &&\n        typeof child[0] === 'string' &&\n        typeof child[1] === 'object' &&\n        child[1] !== null,\n    )\n  );\n}\n","/**\n * The icons the design system uses in its own elements.\n *\n * Importing any Kanto element pulls this set in — roughly 2 kB of path data,\n * the price of `<kt-select>` being able to draw its own chevron. Application\n * icons are registered separately through `registerIcons`.\n */\nimport {\n  ArrowDown,\n  ArrowUp,\n  Calendar,\n  Check,\n  ChevronDown,\n  ChevronLeft,\n  ChevronRight,\n  ChevronUp,\n  CircleAlert,\n  CircleCheck,\n  Copy,\n  Eye,\n  EyeOff,\n  File,\n  FileUp,\n  Info,\n  LoaderCircle,\n  Menu,\n  Minus,\n  Search,\n  Trash2,\n  TriangleAlert,\n  User,\n  X,\n} from 'lucide';\n// The sibling registry, not the `kanto-ds` barrel: the barrel pulls in every\n// element, and one of them pulls in this file — a cycle that leaves\n// `registerIcons` undefined by the time the call below runs.\nimport { registerIcons } from './registry.js';\n\n/** Icons referenced by Kanto elements, keyed by their Lucide name. */\nexport const defaultIcons = {\n  ArrowDown,\n  ArrowUp,\n  Calendar,\n  Check,\n  ChevronDown,\n  ChevronLeft,\n  ChevronRight,\n  ChevronUp,\n  CircleAlert,\n  CircleCheck,\n  Copy,\n  Eye,\n  EyeOff,\n  File,\n  FileUp,\n  Info,\n  LoaderCircle,\n  Menu,\n  Minus,\n  Search,\n  Trash2,\n  TriangleAlert,\n  User,\n  X,\n};\n\nregisterIcons(defaultIcons);\n"],"names":["registry","toKebabCase","name","registerIcon","node","registerIcons","icons","isIconNode","getIcon","registeredIcons","value","child","defaultIcons","ArrowDown","ArrowUp","Calendar","Check","ChevronDown","ChevronLeft","ChevronRight","ChevronUp","CircleAlert","CircleCheck","Copy","Eye","EyeOff","File","FileUp","Info","LoaderCircle","Menu","Minus","Search","Trash2","TriangleAlert","User","X"],"mappings":";AAqBA,MAAMA,wBAAe,IAAA;AASd,SAASC,EAAYC,GAAsB;AAChD,SAAOA,EACJ,QAAQ,yBAAyB,OAAO,EACxC,QAAQ,mBAAmB,OAAO,EAClC,QAAQ,mBAAmB,OAAO,EAClC,QAAQ,WAAW,GAAG,EACtB,YAAA;AACL;AAGO,SAASC,EAAaD,GAAcE,GAAsB;AAC/D,EAAAJ,EAAS,IAAIC,EAAYC,CAAI,GAAGE,CAAI;AACtC;AAMO,SAASC,EAAcC,GAAsC;AAClE,aAAW,CAACJ,GAAME,CAAI,KAAK,OAAO,QAAQE,CAAK;AAC7C,IAAIC,EAAWH,CAAI,KAAGD,EAAaD,GAAME,CAAI;AAEjD;AAGO,SAASI,EAAQN,GAAoC;AAC1D,SAAOF,EAAS,IAAIC,EAAYC,CAAI,CAAC;AACvC;AAGO,SAASO,IAA4B;AAC1C,SAAO,CAAC,GAAGT,EAAS,KAAA,CAAM,EAAE,KAAA;AAC9B;AAEA,SAASO,EAAWG,GAAmC;AACrD,SACE,MAAM,QAAQA,CAAK,KACnBA,EAAM;AAAA,IACJ,CAACC,MACC,MAAM,QAAQA,CAAK,KACnB,OAAOA,EAAM,CAAC,KAAM,YACpB,OAAOA,EAAM,CAAC,KAAM,YACpBA,EAAM,CAAC,MAAM;AAAA,EAAA;AAGrB;ACpCO,MAAMC,IAAe;AAAA,EAC1B,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,MAAAC;AAAA,EACA,KAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,MAAAC;AAAA,EACA,GAAAC;AACF;AAEA/B,EAAcO,CAAY;"}

package/dist/chunks/floating-B7_Dahpn.js

@@ -1,54 +0,0 @@
-import { css as n } from "lit";
-import { p as a } from "./position-Cx_ZH5zh.js";
-const p = n`
-  .floating {
-    position: fixed;
-    inset: auto;
-    display: block;
-    margin: 0;
-    color: inherit;
-    border: none;
-  }
-`;
-class c {
-  constructor(t, o) {
-    this.options = o, this.open = !1, this.frame = 0, this.follow = () => {
-      cancelAnimationFrame(this.frame), this.frame = requestAnimationFrame(() => this.place());
-    }, t.addController(this);
-  }
-  /**
-   * Call from the host's `updated()` with whether the panel is open. While it
-   * is, every update re-places it: its content — a filtered list — can change
-   * its size.
-   */
-  sync(t) {
-    if (t !== this.open) {
-      this.open = t;
-      const i = t ? "addEventListener" : "removeEventListener";
-      window[i]("scroll", this.follow, { capture: !0, passive: !0 }), window[i]("resize", this.follow);
-    }
-    const o = this.options.panel();
-    !o || typeof o.showPopover != "function" || (t ? (o.matches(":popover-open") || o.showPopover(), this.place()) : o.matches(":popover-open") && o.hidePopover());
-  }
-  hostDisconnected() {
-    this.sync(!1), cancelAnimationFrame(this.frame);
-  }
-  place() {
-    const t = this.options.panel(), o = this.options.anchor()?.getBoundingClientRect();
-    if (!t || !o) return;
-    this.options.matchWidth && (t.style.width = `${o.width}px`);
-    const { x: i, y: e, placement: s } = a(
-      o,
-      { width: t.offsetWidth, height: t.offsetHeight },
-      { width: window.innerWidth, height: window.innerHeight },
-      this.options.side?.() ?? "bottom",
-      this.options.align?.() ?? "start"
-    );
-    t.style.left = `${i}px`, t.style.top = `${e}px`, this.options.onPlace?.(s);
-  }
-}
-export {
-  c as F,
-  p as f
-};
-//# sourceMappingURL=floating-B7_Dahpn.js.map

package/dist/chunks/floating-B7_Dahpn.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"floating-B7_Dahpn.js","sources":["../../src/internal/floating.ts"],"sourcesContent":["import { css, type ReactiveController, type ReactiveControllerHost } from 'lit';\nimport { placeFloating, type Align, type Side } from './position.js';\n\n/**\n * A panel that opens from a trigger — a select's list, a date picker's\n * calendar, a menu — drawn in the top layer and placed from the trigger.\n *\n * A panel positioned inside its element was cut off by any ancestor with\n * `overflow: hidden`: a table cell, a side panel, an app's scrolling main\n * area. In the top layer, nothing clips it. It opens on the side asked for, or\n * the other one when that has no room, and follows the trigger as the page\n * scrolls.\n */\n\nexport interface FloatingOptions {\n  /** The panel, which carries `popover=\"manual\"` and the `floating` class. */\n  readonly panel: () => HTMLElement | null | undefined;\n  /** What the panel opens from. */\n  readonly anchor: () => Element | null | undefined;\n  /** The side it prefers. */\n  readonly side?: () => Side;\n  /** Which edge of the anchor it lines up with; its start by default. */\n  readonly align?: () => Align;\n  /** Sizes the panel to the anchor's width — a list under its field. */\n  readonly matchWidth?: boolean;\n  /** Told the side it opened on, for the direction of its entrance. */\n  readonly onPlace?: (side: Side) => void;\n}\n\n/**\n * The panel's own styles. Closed, it keeps the display and the hidden,\n * animatable state its element gives it, so it can fade out after it leaves\n * the top layer: `display` here only undoes the popover's `display: none`, and\n * a panel's own `display` still wins.\n */\nexport const floatingStyles = css`\n  .floating {\n    position: fixed;\n    inset: auto;\n    display: block;\n    margin: 0;\n    color: inherit;\n    border: none;\n  }\n`;\n\nexport class FloatingController implements ReactiveController {\n  private open = false;\n  private frame = 0;\n\n  constructor(\n    host: ReactiveControllerHost,\n    private readonly options: FloatingOptions,\n  ) {\n    host.addController(this);\n  }\n\n  /**\n   * Call from the host's `updated()` with whether the panel is open. While it\n   * is, every update re-places it: its content — a filtered list — can change\n   * its size.\n   */\n  sync(open: boolean): void {\n    // First, and whatever the panel: one rendered only while open is already\n    // gone when it closes, and its listeners must go with it.\n    if (open !== this.open) {\n      this.open = open;\n      const method = open ? 'addEventListener' : 'removeEventListener';\n      window[method]('scroll', this.follow, { capture: true, passive: true });\n      window[method]('resize', this.follow);\n    }\n\n    const panel = this.options.panel();\n    // Where popovers are missing — a test DOM — the panel stays where it is.\n    if (!panel || typeof panel.showPopover !== 'function') return;\n\n    if (open) {\n      if (!panel.matches(':popover-open')) panel.showPopover();\n      this.place();\n    } else if (panel.matches(':popover-open')) {\n      panel.hidePopover();\n    }\n  }\n\n  hostDisconnected(): void {\n    this.sync(false);\n    cancelAnimationFrame(this.frame);\n  }\n\n  private follow = (): void => {\n    cancelAnimationFrame(this.frame);\n    this.frame = requestAnimationFrame(() => this.place());\n  };\n\n  private place(): void {\n    const panel = this.options.panel();\n    const anchor = this.options.anchor()?.getBoundingClientRect();\n    if (!panel || !anchor) return;\n\n    if (this.options.matchWidth) panel.style.width = `${anchor.width}px`;\n    // Untransformed size: the entrance animation scales and slides the panel.\n    const { x, y, placement } = placeFloating(\n      anchor,\n      { width: panel.offsetWidth, height: panel.offsetHeight },\n      { width: window.innerWidth, height: window.innerHeight },\n      this.options.side?.() ?? 'bottom',\n      this.options.align?.() ?? 'start',\n    );\n    panel.style.left = `${x}px`;\n    panel.style.top = `${y}px`;\n    this.options.onPlace?.(placement);\n  }\n}\n"],"names":["floatingStyles","css","FloatingController","host","options","open","method","panel","anchor","x","y","placement","placeFloating"],"mappings":";;AAmCO,MAAMA,IAAiBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvB,MAAMC,EAAiD;AAAA,EAI5D,YACEC,GACiBC,GACjB;AADiB,SAAA,UAAAA,GALnB,KAAQ,OAAO,IACf,KAAQ,QAAQ,GAyChB,KAAQ,SAAS,MAAY;AAC3B,2BAAqB,KAAK,KAAK,GAC/B,KAAK,QAAQ,sBAAsB,MAAM,KAAK,OAAO;AAAA,IACvD,GAtCED,EAAK,cAAc,IAAI;AAAA,EACzB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,KAAKE,GAAqB;AAGxB,QAAIA,MAAS,KAAK,MAAM;AACtB,WAAK,OAAOA;AACZ,YAAMC,IAASD,IAAO,qBAAqB;AAC3C,aAAOC,CAAM,EAAE,UAAU,KAAK,QAAQ,EAAE,SAAS,IAAM,SAAS,IAAM,GACtE,OAAOA,CAAM,EAAE,UAAU,KAAK,MAAM;AAAA,IACtC;AAEA,UAAMC,IAAQ,KAAK,QAAQ,MAAA;AAE3B,IAAI,CAACA,KAAS,OAAOA,EAAM,eAAgB,eAEvCF,KACGE,EAAM,QAAQ,eAAe,OAAS,YAAA,GAC3C,KAAK,MAAA,KACIA,EAAM,QAAQ,eAAe,KACtCA,EAAM,YAAA;AAAA,EAEV;AAAA,EAEA,mBAAyB;AACvB,SAAK,KAAK,EAAK,GACf,qBAAqB,KAAK,KAAK;AAAA,EACjC;AAAA,EAOQ,QAAc;AACpB,UAAMA,IAAQ,KAAK,QAAQ,MAAA,GACrBC,IAAS,KAAK,QAAQ,OAAA,GAAU,sBAAA;AACtC,QAAI,CAACD,KAAS,CAACC,EAAQ;AAEvB,IAAI,KAAK,QAAQ,eAAYD,EAAM,MAAM,QAAQ,GAAGC,EAAO,KAAK;AAEhE,UAAM,EAAE,GAAAC,GAAG,GAAAC,GAAG,WAAAC,EAAA,IAAcC;AAAA,MAC1BJ;AAAA,MACA,EAAE,OAAOD,EAAM,aAAa,QAAQA,EAAM,aAAA;AAAA,MAC1C,EAAE,OAAO,OAAO,YAAY,QAAQ,OAAO,YAAA;AAAA,MAC3C,KAAK,QAAQ,OAAA,KAAY;AAAA,MACzB,KAAK,QAAQ,aAAa;AAAA,IAAA;AAE5B,IAAAA,EAAM,MAAM,OAAO,GAAGE,CAAC,MACvBF,EAAM,MAAM,MAAM,GAAGG,CAAC,MACtB,KAAK,QAAQ,UAAUC,CAAS;AAAA,EAClC;AACF;"}

package/dist/chunks/index-STEEvEP7.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-STEEvEP7.js","sources":["../../src/internal/strings.ts"],"sourcesContent":["/**\n * Every piece of copy the elements write themselves — empty states, button\n * labels, validation messages, and the accessible names a screen reader\n * announces but nobody sees.\n *\n * English by default. An application in another language replaces them once,\n * at start-up, and every element follows:\n *\n *     import { setStrings } from 'kanto-ds/strings';\n *\n *     setStrings({\n *       clear: 'Effacer',\n *       pageOf: (page, total) => `Page ${page} sur ${total}`,\n *     });\n *\n * Anything left out keeps its English default. A string an element also takes\n * as a property — `emptyText`, `placeholder`, `confirmLabel` — still wins when\n * it is set, so one screen can say something different from the rest.\n *\n * Copy that carries a value is a function, not a template with placeholders:\n * the translation owns the word order, and \"Remove {name}\" does not survive\n * languages that put the object first.\n */\n\nexport interface KtStrings {\n  // --- Shared actions ---\n  /** Clear button in fields. */\n  clear: string;\n  /** Close button on toasts, alerts' dismiss button. */\n  close: string;\n  dismiss: string;\n  /** Copy button on `kt-code`, and its state once copied. */\n  copy: string;\n  copied: string;\n  copyCode: string;\n  /** The countdown bar on a toast that closes itself. */\n  timeRemaining: string;\n  /** Remove button on a badge or a dropped file. */\n  remove: (name: string) => string;\n\n  // --- Empty and loading states ---\n  noOptions: string;\n  noResults: string;\n  noActions: string;\n  noData: string;\n  loading: string;\n\n  // --- Fields ---\n  /** `kt-select` with nothing chosen. */\n  select: string;\n  openList: string;\n  closeList: string;\n  showPassword: string;\n  hidePassword: string;\n  searchCountry: string;\n  noCountry: string;\n  countryCode: (country: string | undefined) => string;\n  dragAndDrop: string;\n  browseFiles: string;\n  recommendedSize: (size: string) => string;\n  selectedFiles: string;\n  /** `kt-date-picker` with nothing chosen, and its calendar's name. */\n  selectDate: string;\n  selectPeriod: string;\n  previousMonth: string;\n  nextMonth: string;\n  previousYear: string;\n  nextYear: string;\n  previousYears: string;\n  nextYears: string;\n  /** The calendar header's month and year buttons, which open those views. */\n  chooseMonth: string;\n  chooseYear: string;\n\n  // --- Validation messages, shown by the browser on submit ---\n  required: string;\n  selectOption: string;\n  selectFile: string;\n  /** A required checkbox left unchecked. */\n  checkRequired: string;\n  dateRequired: string;\n  /** A phone number typed with the prefix only dialled from inside the country. */\n  phoneTrunkPrefix: (prefix: string) => string;\n\n  // --- Navigation ---\n  openMenu: string;\n  closeMenu: string;\n  breadcrumb: string;\n  secondaryNavigation: string;\n  pagination: string;\n  previous: string;\n  next: string;\n  pageOf: (page: number, total: number) => string;\n  moreActions: string;\n\n  // --- Groups and sections ---\n  /** A button or choice group with no label of its own. */\n  options: string;\n  /** A `kt-form` section with no heading. */\n  formSection: string;\n\n  // --- Data ---\n  selectRow: string;\n  selectAll: string;\n  total: string;\n  /** Column headers of the data table every chart renders for assistive tech. */\n  chartSeries: string;\n  chartPoint: string;\n  chartSlice: string;\n  chartShare: string;\n  /** Caption of a chart's data table when the chart has no label. */\n  chartData: string;\n  /** Value column of a single-series chart's data table when the series has no name. */\n  chartValue: string;\n\n  // --- Overlays ---\n  confirmHeading: string;\n  confirm: string;\n  cancel: string;\n  details: string;\n\n  // --- Identity ---\n  avatar: string;\n}\n\nexport const defaultStrings: Readonly<KtStrings> = Object.freeze({\n  clear: 'Clear',\n  close: 'Close',\n  dismiss: 'Dismiss',\n  copy: 'Copy',\n  copied: 'Copied',\n  copyCode: 'Copy code',\n  timeRemaining: 'Time remaining',\n  remove: (name: string) => (name ? `Remove ${name}` : 'Remove'),\n\n  noOptions: 'No options available',\n  noResults: 'No results',\n  noActions: 'No actions',\n  noData: 'No data to display',\n  loading: 'Loading…',\n\n  select: 'Select',\n  openList: 'Open list',\n  closeList: 'Close list',\n  showPassword: 'Show password',\n  hidePassword: 'Hide password',\n  searchCountry: 'Search country or dial code',\n  noCountry: 'No country found',\n  countryCode: (country: string | undefined) => `Country code: ${country ?? 'none'}`,\n  dragAndDrop: 'Drag and drop or',\n  browseFiles: 'browse your files',\n  recommendedSize: (size: string) => `Recommended image size: ${size}`,\n  selectedFiles: 'Selected files',\n  selectDate: 'Select a date',\n  selectPeriod: 'Select a period',\n  previousMonth: 'Previous month',\n  nextMonth: 'Next month',\n  previousYear: 'Previous year',\n  nextYear: 'Next year',\n  previousYears: 'Previous years',\n  nextYears: 'Next years',\n  chooseMonth: 'Choose month',\n  chooseYear: 'Choose year',\n\n  required: 'This field is required.',\n  selectOption: 'Select an option.',\n  selectFile: 'Select a file.',\n  checkRequired: 'Check this box to continue.',\n  dateRequired: 'Select a date.',\n  phoneTrunkPrefix: (prefix: string) => `Enter the number without the leading ${prefix}.`,\n\n  openMenu: 'Open menu',\n  closeMenu: 'Close menu',\n  breadcrumb: 'Breadcrumb',\n  secondaryNavigation: 'Secondary navigation',\n  pagination: 'Pagination',\n  previous: 'Previous',\n  next: 'Next',\n  pageOf: (page: number, total: number) => `Page ${page} / ${total}`,\n  moreActions: 'More actions',\n\n  options: 'Options',\n  formSection: 'Form section',\n\n  selectRow: 'Select row',\n  selectAll: 'Select all',\n  total: 'Total',\n  chartSeries: 'Series',\n  chartPoint: 'Point',\n  chartSlice: 'Slice',\n  chartShare: 'Share',\n  chartData: 'Chart data',\n  chartValue: 'Value',\n\n  confirmHeading: 'Are you sure?',\n  confirm: 'Confirm',\n  cancel: 'Cancel',\n  details: 'Details',\n\n  avatar: 'Avatar',\n});\n\nlet current: KtStrings = { ...defaultStrings };\nconst listeners = new Set<() => void>();\n\n/** The strings in effect. Elements read them at render time. */\nexport function strings(): Readonly<KtStrings> {\n  return current;\n}\n\n/**\n * Replaces some or all of the strings, and re-renders every connected element\n * so the change shows at once — switching language at runtime works.\n */\nexport function setStrings(overrides: Partial<KtStrings>): void {\n  current = { ...current, ...overrides };\n  for (const listener of listeners) listener();\n}\n\n/** Back to the English defaults. */\nexport function resetStrings(): void {\n  setStrings(defaultStrings);\n}\n\n/** Calls `listener` after every `setStrings`. Returns the unsubscribe function. */\nexport function onStringsChange(listener: () => void): () => void {\n  listeners.add(listener);\n  return () => listeners.delete(listener);\n}\n"],"names":["defaultStrings","name","country","size","prefix","page","total","current","listeners","strings","setStrings","overrides","listener","resetStrings","onStringsChange"],"mappings":"AA6HO,MAAMA,IAAsC,OAAO,OAAO;AAAA,EAC/D,OAAO;AAAA,EACP,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,eAAe;AAAA,EACf,QAAQ,CAACC,MAAkBA,IAAO,UAAUA,CAAI,KAAK;AAAA,EAErD,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,SAAS;AAAA,EAET,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,WAAW;AAAA,EACX,cAAc;AAAA,EACd,cAAc;AAAA,EACd,eAAe;AAAA,EACf,WAAW;AAAA,EACX,aAAa,CAACC,MAAgC,iBAAiBA,KAAW,MAAM;AAAA,EAChF,aAAa;AAAA,EACb,aAAa;AAAA,EACb,iBAAiB,CAACC,MAAiB,2BAA2BA,CAAI;AAAA,EAClE,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,eAAe;AAAA,EACf,WAAW;AAAA,EACX,cAAc;AAAA,EACd,UAAU;AAAA,EACV,eAAe;AAAA,EACf,WAAW;AAAA,EACX,aAAa;AAAA,EACb,YAAY;AAAA,EAEZ,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,cAAc;AAAA,EACd,kBAAkB,CAACC,MAAmB,wCAAwCA,CAAM;AAAA,EAEpF,UAAU;AAAA,EACV,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,qBAAqB;AAAA,EACrB,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,MAAM;AAAA,EACN,QAAQ,CAACC,GAAcC,MAAkB,QAAQD,CAAI,MAAMC,CAAK;AAAA,EAChE,aAAa;AAAA,EAEb,SAAS;AAAA,EACT,aAAa;AAAA,EAEb,WAAW;AAAA,EACX,WAAW;AAAA,EACX,OAAO;AAAA,EACP,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EAEZ,gBAAgB;AAAA,EAChB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,SAAS;AAAA,EAET,QAAQ;AACV,CAAC;AAED,IAAIC,IAAqB,EAAE,GAAGP,EAAA;AAC9B,MAAMQ,wBAAgB,IAAA;AAGf,SAASC,IAA+B;AAC7C,SAAOF;AACT;AAMO,SAASG,EAAWC,GAAqC;AAC9D,EAAAJ,IAAU,EAAE,GAAGA,GAAS,GAAGI,EAAA;AAC3B,aAAWC,KAAYJ,EAAW,CAAAI,EAAA;AACpC;AAGO,SAASC,IAAqB;AACnC,EAAAH,EAAWV,CAAc;AAC3B;AAGO,SAASc,EAAgBF,GAAkC;AAChE,SAAAJ,EAAU,IAAII,CAAQ,GACf,MAAMJ,EAAU,OAAOI,CAAQ;AACxC;"}