kanto-ds 1.0.0 → 1.0.1

package/dist/vue/index.js

@@ -1,6 +1,7 @@
 import "../components/core/kt-avatar/kt-avatar.js";
 import "../components/core/kt-badge/kt-badge.js";
 import "../components/core/kt-button/kt-button.js";
+import "../components/core/kt-split-button/kt-split-button.js";
 import "../components/core/kt-card/kt-card.js";
 import "../components/core/kt-code/kt-code.js";
 import "../components/core/kt-icon/kt-icon.js";
@@ -27,7 +28,7 @@ import "../components/feedback/kt-progress-bar/kt-progress-bar.js";
 import "../components/feedback/kt-skeleton/kt-skeleton.js";
 import "../components/feedback/kt-toast/kt-toast.js";
 import "../components/feedback/kt-toast-container/kt-toast-container.js";
-import { t as Q } from "../chunks/toaster-PmdKSV5x.js";
+import { t as S } from "../chunks/toaster-PmdKSV5x.js";
 import "../components/feedback/kt-tooltip/kt-tooltip.js";
 import "../components/overlays/kt-collapsible/kt-collapsible.js";
 import "../components/overlays/kt-confirm-dialog/kt-confirm-dialog.js";
@@ -40,17 +41,17 @@ import "../components/data/kt-pagination/kt-pagination.js";
 import "../components/data/kt-stat/kt-stat.js";
 import "../components/data/kt-table/kt-table.js";
 import "../components/data/kt-timeline/kt-timeline.js";
-function D(t) {
+function H(t) {
   return t.startsWith("kt-");
 }
-const H = "kt-", J = {
+const J = "kt-", L = {
   install() {
   }
 };
 export {
-  H as KANTO_TAG_PREFIX,
-  D as isKantoElement,
-  J as kanto,
-  Q as toaster
+  J as KANTO_TAG_PREFIX,
+  H as isKantoElement,
+  L as kanto,
+  S as toaster
 };
 //# sourceMappingURL=index.js.map

package/dist/vue/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/vue/index.ts"],"sourcesContent":["/**\n * Vue integration for the Kanto elements.\n *\n * There are no per-component wrappers here, and that is the point. Vue 3\n * renders custom elements natively and sets non-primitive bindings as DOM\n * properties, so `<kt-select :options=\"regions\">` already works. A wrapper\n * layer would only be one more thing to keep in sync.\n *\n * What Vue cannot infer on its own is which tags are custom elements, and what\n * they accept. That is what this module supplies.\n *\n * ```ts\n * // vite.config.ts\n * import vue from '@vitejs/plugin-vue';\n * import { isKantoElement } from 'kanto-ds/vue';\n *\n * export default defineConfig({\n *   plugins: [vue({ template: { compilerOptions: { isCustomElement: isKantoElement } } })],\n * });\n * ```\n *\n * ```ts\n * // main.ts\n * import 'kanto-ds/vue'; // registers every element\n * import 'kanto-ds/styles.css';\n * ```\n *\n * Vue is a peer dependency: importing this module in a project without Vue\n * still works, since nothing here is imported from `vue` at runtime.\n */\n// Type-only, so nothing from Vue is pulled in at runtime — but the import is\n// what lets TypeScript resolve the module we augment below.\nimport type { Plugin } from 'vue';\n\nimport '../index.js';\n\nimport type { KtAvatar } from 'kanto-ds';\nimport type { KtBadge } from 'kanto-ds';\nimport type { KtButton } from 'kanto-ds';\nimport type { KtCard } from 'kanto-ds';\nimport type { KtCode } from 'kanto-ds';\nimport type { KtIcon } from 'kanto-ds';\nimport type { KtKbd } from 'kanto-ds';\nimport type { KtDragDrop } from 'kanto-ds';\nimport type { KtForm } from 'kanto-ds';\nimport type { KtInput } from 'kanto-ds';\nimport type { KtInputMenu } from 'kanto-ds';\nimport type { KtLabelInput } from 'kanto-ds';\nimport type { KtSelect } from 'kanto-ds';\nimport type { KtTextarea } from 'kanto-ds';\nimport type { KtToggle } from 'kanto-ds';\nimport type { KtBreadcrumb } from 'kanto-ds';\nimport type { KtPageHeader } from 'kanto-ds';\nimport type { KtSegmentedControl } from 'kanto-ds';\nimport type { KtSubMenuNavigation } from 'kanto-ds';\nimport type { KtTabs } from 'kanto-ds';\nimport type { KtHeader } from 'kanto-ds';\nimport type { KtToggleButton } from 'kanto-ds';\nimport type { KtToggleButtonGroup } from 'kanto-ds';\nimport type { KtAlert } from 'kanto-ds';\nimport type { KtEmptyState } from 'kanto-ds';\nimport type { KtProgressBar } from 'kanto-ds';\nimport type { KtSkeleton } from 'kanto-ds';\nimport type { KtToast } from 'kanto-ds';\nimport type { KtToastContainer } from 'kanto-ds';\nimport type { KtTooltip } from 'kanto-ds';\nimport type { KtCollapsible } from 'kanto-ds';\nimport type { KtConfirmDialog } from 'kanto-ds';\nimport type { KtDropdown } from 'kanto-ds';\nimport type { KtModal } from 'kanto-ds';\nimport type { KtSidePanel } from 'kanto-ds';\nimport type { KtChart } from 'kanto-ds';\nimport type { KtMeter } from 'kanto-ds';\nimport type { KtPagination } from 'kanto-ds';\nimport type { KtStat } from 'kanto-ds';\nimport type { KtTable } from 'kanto-ds';\nimport type { KtTimeline, KtTimelineItem } from 'kanto-ds';\n\n/**\n * True for any Kanto custom element.\n *\n * Pass it as `compilerOptions.isCustomElement` so the Vue compiler stops\n * trying to resolve `kt-*` tags as components.\n */\nexport function isKantoElement(tag: string): boolean {\n  return tag.startsWith('kt-');\n}\n\n/** Every element's tag name, for anyone building their own predicate. */\nexport const KANTO_TAG_PREFIX = 'kt-';\n\n/**\n * What a Kanto element accepts in a template: its own properties, plus the\n * attributes and listeners any element takes.\n */\ntype KtProps<T> = Partial<T> &\n  Record<`on${string}`, unknown> & { class?: unknown; style?: unknown };\n\ndeclare module 'vue' {\n  interface GlobalComponents {\n    'kt-avatar': KtProps<KtAvatar>;\n    'kt-badge': KtProps<KtBadge>;\n    'kt-button': KtProps<KtButton>;\n    'kt-card': KtProps<KtCard>;\n    'kt-code': KtProps<KtCode>;\n    'kt-icon': KtProps<KtIcon>;\n    'kt-kbd': KtProps<KtKbd>;\n    'kt-drag-drop': KtProps<KtDragDrop>;\n    'kt-form': KtProps<KtForm>;\n    'kt-input': KtProps<KtInput>;\n    'kt-input-menu': KtProps<KtInputMenu>;\n    'kt-label-input': KtProps<KtLabelInput>;\n    'kt-select': KtProps<KtSelect>;\n    'kt-textarea': KtProps<KtTextarea>;\n    'kt-toggle': KtProps<KtToggle>;\n    'kt-breadcrumb': KtProps<KtBreadcrumb>;\n    'kt-page-header': KtProps<KtPageHeader>;\n    'kt-segmented-control': KtProps<KtSegmentedControl>;\n    'kt-sub-menu-navigation': KtProps<KtSubMenuNavigation>;\n    'kt-tabs': KtProps<KtTabs>;\n    'kt-header': KtProps<KtHeader>;\n    'kt-toggle-button': KtProps<KtToggleButton>;\n    'kt-toggle-button-group': KtProps<KtToggleButtonGroup>;\n    'kt-alert': KtProps<KtAlert>;\n    'kt-empty-state': KtProps<KtEmptyState>;\n    'kt-progress-bar': KtProps<KtProgressBar>;\n    'kt-skeleton': KtProps<KtSkeleton>;\n    'kt-toast': KtProps<KtToast>;\n    'kt-toast-container': KtProps<KtToastContainer>;\n    'kt-tooltip': KtProps<KtTooltip>;\n    'kt-collapsible': KtProps<KtCollapsible>;\n    'kt-confirm-dialog': KtProps<KtConfirmDialog>;\n    'kt-dropdown': KtProps<KtDropdown>;\n    'kt-modal': KtProps<KtModal>;\n    'kt-side-panel': KtProps<KtSidePanel>;\n    'kt-chart': KtProps<KtChart>;\n    'kt-meter': KtProps<KtMeter>;\n    'kt-pagination': KtProps<KtPagination>;\n    'kt-stat': KtProps<KtStat>;\n    'kt-table': KtProps<KtTable>;\n    'kt-timeline': KtProps<KtTimeline>;\n    'kt-timeline-item': KtProps<KtTimelineItem>;\n  }\n}\n\n/**\n * A no-op plugin, for apps that would rather write `app.use(kanto)` than a\n * bare side-effect import. Importing this module already registers every\n * element; this only makes that visible in `main.ts`.\n */\nexport const kanto: Plugin = {\n  install() {\n    /* the elements register themselves on import */\n  },\n};\n\nexport { toaster } from '../components/feedback/kt-toast-container/toaster.js';\n"],"names":["isKantoElement","tag","KANTO_TAG_PREFIX","kanto"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoFO,SAASA,EAAeC,GAAsB;AACnD,SAAOA,EAAI,WAAW,KAAK;AAC7B;AAGO,MAAMC,IAAmB,OA6DnBC,IAAgB;AAAA,EAC3B,UAAU;AAAA,EAEV;AACF;"}
+{"version":3,"file":"index.js","sources":["../../src/vue/index.ts"],"sourcesContent":["/**\n * Vue integration for the Kanto elements.\n *\n * There are no per-component wrappers here, and that is the point. Vue 3\n * renders custom elements natively and sets non-primitive bindings as DOM\n * properties, so `<kt-select :options=\"regions\">` already works. A wrapper\n * layer would only be one more thing to keep in sync.\n *\n * What Vue cannot infer on its own is which tags are custom elements, and what\n * they accept. That is what this module supplies.\n *\n * ```ts\n * // vite.config.ts\n * import vue from '@vitejs/plugin-vue';\n * import { isKantoElement } from 'kanto-ds/vue';\n *\n * export default defineConfig({\n *   plugins: [vue({ template: { compilerOptions: { isCustomElement: isKantoElement } } })],\n * });\n * ```\n *\n * ```ts\n * // main.ts\n * import 'kanto-ds/vue'; // registers every element\n * import 'kanto-ds/styles.css';\n * ```\n *\n * Vue is a peer dependency: importing this module in a project without Vue\n * still works, since nothing here is imported from `vue` at runtime.\n */\n// Type-only, so nothing from Vue is pulled in at runtime — but the import is\n// what lets TypeScript resolve the module we augment below.\nimport type { Plugin } from 'vue';\n\nimport '../index.js';\n\nimport type { KtAvatar } from 'kanto-ds';\nimport type { KtBadge } from 'kanto-ds';\nimport type { KtButton } from 'kanto-ds';\nimport type { KtSplitButton } from 'kanto-ds';\nimport type { KtCard } from 'kanto-ds';\nimport type { KtCode } from 'kanto-ds';\nimport type { KtIcon } from 'kanto-ds';\nimport type { KtKbd } from 'kanto-ds';\nimport type { KtDragDrop } from 'kanto-ds';\nimport type { KtForm } from 'kanto-ds';\nimport type { KtInput } from 'kanto-ds';\nimport type { KtInputMenu } from 'kanto-ds';\nimport type { KtLabelInput } from 'kanto-ds';\nimport type { KtSelect } from 'kanto-ds';\nimport type { KtTextarea } from 'kanto-ds';\nimport type { KtToggle } from 'kanto-ds';\nimport type { KtBreadcrumb } from 'kanto-ds';\nimport type { KtPageHeader } from 'kanto-ds';\nimport type { KtSegmentedControl } from 'kanto-ds';\nimport type { KtSubMenuNavigation } from 'kanto-ds';\nimport type { KtTabs } from 'kanto-ds';\nimport type { KtHeader } from 'kanto-ds';\nimport type { KtToggleButton } from 'kanto-ds';\nimport type { KtToggleButtonGroup } from 'kanto-ds';\nimport type { KtAlert } from 'kanto-ds';\nimport type { KtEmptyState } from 'kanto-ds';\nimport type { KtProgressBar } from 'kanto-ds';\nimport type { KtSkeleton } from 'kanto-ds';\nimport type { KtToast } from 'kanto-ds';\nimport type { KtToastContainer } from 'kanto-ds';\nimport type { KtTooltip } from 'kanto-ds';\nimport type { KtCollapsible } from 'kanto-ds';\nimport type { KtConfirmDialog } from 'kanto-ds';\nimport type { KtDropdown } from 'kanto-ds';\nimport type { KtModal } from 'kanto-ds';\nimport type { KtSidePanel } from 'kanto-ds';\nimport type { KtChart } from 'kanto-ds';\nimport type { KtMeter } from 'kanto-ds';\nimport type { KtPagination } from 'kanto-ds';\nimport type { KtStat } from 'kanto-ds';\nimport type { KtTable } from 'kanto-ds';\nimport type { KtTimeline, KtTimelineItem } from 'kanto-ds';\n\n/**\n * True for any Kanto custom element.\n *\n * Pass it as `compilerOptions.isCustomElement` so the Vue compiler stops\n * trying to resolve `kt-*` tags as components.\n */\nexport function isKantoElement(tag: string): boolean {\n  return tag.startsWith('kt-');\n}\n\n/** Every element's tag name, for anyone building their own predicate. */\nexport const KANTO_TAG_PREFIX = 'kt-';\n\n/**\n * What a Kanto element accepts in a template: its own properties, plus the\n * attributes and listeners any element takes.\n */\ntype KtProps<T> = Partial<T> &\n  Record<`on${string}`, unknown> & { class?: unknown; style?: unknown };\n\ndeclare module 'vue' {\n  interface GlobalComponents {\n    'kt-avatar': KtProps<KtAvatar>;\n    'kt-badge': KtProps<KtBadge>;\n    'kt-button': KtProps<KtButton>;\n    'kt-split-button': KtProps<KtSplitButton>;\n    'kt-card': KtProps<KtCard>;\n    'kt-code': KtProps<KtCode>;\n    'kt-icon': KtProps<KtIcon>;\n    'kt-kbd': KtProps<KtKbd>;\n    'kt-drag-drop': KtProps<KtDragDrop>;\n    'kt-form': KtProps<KtForm>;\n    'kt-input': KtProps<KtInput>;\n    'kt-input-menu': KtProps<KtInputMenu>;\n    'kt-label-input': KtProps<KtLabelInput>;\n    'kt-select': KtProps<KtSelect>;\n    'kt-textarea': KtProps<KtTextarea>;\n    'kt-toggle': KtProps<KtToggle>;\n    'kt-breadcrumb': KtProps<KtBreadcrumb>;\n    'kt-page-header': KtProps<KtPageHeader>;\n    'kt-segmented-control': KtProps<KtSegmentedControl>;\n    'kt-sub-menu-navigation': KtProps<KtSubMenuNavigation>;\n    'kt-tabs': KtProps<KtTabs>;\n    'kt-header': KtProps<KtHeader>;\n    'kt-toggle-button': KtProps<KtToggleButton>;\n    'kt-toggle-button-group': KtProps<KtToggleButtonGroup>;\n    'kt-alert': KtProps<KtAlert>;\n    'kt-empty-state': KtProps<KtEmptyState>;\n    'kt-progress-bar': KtProps<KtProgressBar>;\n    'kt-skeleton': KtProps<KtSkeleton>;\n    'kt-toast': KtProps<KtToast>;\n    'kt-toast-container': KtProps<KtToastContainer>;\n    'kt-tooltip': KtProps<KtTooltip>;\n    'kt-collapsible': KtProps<KtCollapsible>;\n    'kt-confirm-dialog': KtProps<KtConfirmDialog>;\n    'kt-dropdown': KtProps<KtDropdown>;\n    'kt-modal': KtProps<KtModal>;\n    'kt-side-panel': KtProps<KtSidePanel>;\n    'kt-chart': KtProps<KtChart>;\n    'kt-meter': KtProps<KtMeter>;\n    'kt-pagination': KtProps<KtPagination>;\n    'kt-stat': KtProps<KtStat>;\n    'kt-table': KtProps<KtTable>;\n    'kt-timeline': KtProps<KtTimeline>;\n    'kt-timeline-item': KtProps<KtTimelineItem>;\n  }\n}\n\n/**\n * A no-op plugin, for apps that would rather write `app.use(kanto)` than a\n * bare side-effect import. Importing this module already registers every\n * element; this only makes that visible in `main.ts`.\n */\nexport const kanto: Plugin = {\n  install() {\n    /* the elements register themselves on import */\n  },\n};\n\nexport { toaster } from '../components/feedback/kt-toast-container/toaster.js';\n"],"names":["isKantoElement","tag","KANTO_TAG_PREFIX","kanto"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqFO,SAASA,EAAeC,GAAsB;AACnD,SAAOA,EAAI,WAAW,KAAK;AAC7B;AAGO,MAAMC,IAAmB,OA8DnBC,IAAgB;AAAA,EAC3B,UAAU;AAAA,EAEV;AACF;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kanto-ds",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Framework-agnostic design system for data-dense product interfaces.",
   "keywords": [
     "design-system",
@@ -22,7 +22,9 @@
   "sideEffects": [
     "*.css",
     "./dist/components/**",
-    "./dist/icons/defaults.js"
+    "./dist/icons/defaults.js",
+    "./src/components/**",
+    "./src/icons/defaults.ts"
   ],
   "engines": {
     "node": ">=20"
@@ -67,6 +69,10 @@
       "types": "./dist/components/core/kt-button/kt-button.d.ts",
       "default": "./dist/components/core/kt-button/kt-button.js"
     },
+    "./components/core/kt-split-button": {
+      "types": "./dist/components/core/kt-split-button/kt-split-button.d.ts",
+      "default": "./dist/components/core/kt-split-button/kt-split-button.js"
+    },
     "./components/core/kt-card": {
       "types": "./dist/components/core/kt-card/kt-card.d.ts",
       "default": "./dist/components/core/kt-card/kt-card.js"

package/dist/chunks/registry-X4LS9J5K.js

@@ -1,30 +0,0 @@
-const t = /* @__PURE__ */ new Map();
-function o(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 s(e, r) {
-  t.set(o(e), r);
-}
-function c(e) {
-  for (const [r, n] of Object.entries(e))
-    a(n) && s(r, n);
-}
-function i(e) {
-  return t.get(o(e));
-}
-function g() {
-  return [...t.keys()].sort();
-}
-function a(e) {
-  return Array.isArray(e) && e.every(
-    (r) => Array.isArray(r) && typeof r[0] == "string" && typeof r[1] == "object" && r[1] !== null
-  );
-}
-export {
-  c as a,
-  g as b,
-  i as g,
-  s as r,
-  o as t
-};
-//# sourceMappingURL=registry-X4LS9J5K.js.map

package/dist/chunks/registry-X4LS9J5K.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"registry-X4LS9J5K.js","sources":["../../src/icons/registry.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"],"names":["registry","toKebabCase","name","registerIcon","node","registerIcons","icons","isIconNode","getIcon","registeredIcons","value","child"],"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;"}