kanto-ds 1.1.0 → 1.3.0

package/dist/index.d.ts

@@ -80,4 +80,5 @@ export type { KtOption } from './internal/listbox.js';
 export type { KtCountry } from './internal/countries.js';
 export { getIcon, registerIcon, registerIcons, registeredIcons } from './icons/registry.js';
 export type { IconNode } from './icons/registry.js';
+export { defaultStrings, resetStrings, setStrings, strings as getStrings, type KtStrings, } from './internal/strings.js';
 export { KtElement, defineElement } from './internal/kt-element.js';

package/dist/index.js

@@ -1,13 +1,13 @@
-import { KtAvatar as r } from "./components/core/kt-avatar/kt-avatar.js";
+import { KtAvatar as o } from "./components/core/kt-avatar/kt-avatar.js";
 import { KtBadge as m } from "./components/core/kt-badge/kt-badge.js";
 import { KtButton as f } from "./components/core/kt-button/kt-button.js";
 import { KtSplitButton as K } from "./components/core/kt-split-button/kt-split-button.js";
 import { KtCard as n } from "./components/core/kt-card/kt-card.js";
 import { KtCode as g } from "./components/core/kt-code/kt-code.js";
-import { KtIcon as s } from "./components/core/kt-icon/kt-icon.js";
+import { KtIcon as l } from "./components/core/kt-icon/kt-icon.js";
 import { KtKbd as u } from "./components/core/kt-kbd/kt-kbd.js";
-import { KtDragDrop as I } from "./components/forms/kt-drag-drop/kt-drag-drop.js";
-import { KtForm as S } from "./components/forms/kt-form/kt-form.js";
+import { KtDragDrop as T } from "./components/forms/kt-drag-drop/kt-drag-drop.js";
+import { KtForm as b } from "./components/forms/kt-form/kt-form.js";
 import { KtInput as B } from "./components/forms/kt-input/kt-input.js";
 import { KtInputMenu as D } from "./components/forms/kt-input-menu/kt-input-menu.js";
 import { KtLabelInput as P } from "./components/forms/kt-label-input/kt-label-input.js";
@@ -25,16 +25,16 @@ import { KtToggleButtonGroup as W } from "./components/navigation/kt-toggle-butt
 import { KtAlert as Y } from "./components/feedback/kt-alert/kt-alert.js";
 import { KtEmptyState as _ } from "./components/feedback/kt-empty-state/kt-empty-state.js";
 import { KtProgressBar as tt } from "./components/feedback/kt-progress-bar/kt-progress-bar.js";
-import { KtSkeleton as rt } from "./components/feedback/kt-skeleton/kt-skeleton.js";
+import { KtSkeleton as ot } from "./components/feedback/kt-skeleton/kt-skeleton.js";
 import { KtToast as mt } from "./components/feedback/kt-toast/kt-toast.js";
 import { KtToastContainer as ft } from "./components/feedback/kt-toast-container/kt-toast-container.js";
 import { t as Kt } from "./chunks/toaster-PmdKSV5x.js";
 import { KtTooltip as nt } from "./components/feedback/kt-tooltip/kt-tooltip.js";
 import { KtCollapsible as gt } from "./components/overlays/kt-collapsible/kt-collapsible.js";
-import { KtConfirmDialog as st } from "./components/overlays/kt-confirm-dialog/kt-confirm-dialog.js";
+import { KtConfirmDialog as lt } from "./components/overlays/kt-confirm-dialog/kt-confirm-dialog.js";
 import { KtDropdown as ut } from "./components/overlays/kt-dropdown/kt-dropdown.js";
-import { KtModal as It } from "./components/overlays/kt-modal/kt-modal.js";
-import { KtSidePanel as St } from "./components/overlays/kt-side-panel/kt-side-panel.js";
+import { KtModal as Tt } from "./components/overlays/kt-modal/kt-modal.js";
+import { KtSidePanel as bt } from "./components/overlays/kt-side-panel/kt-side-panel.js";
 import { KtChart as Bt } from "./components/data/kt-chart/kt-chart.js";
 import { KtMeter as Dt } from "./components/data/kt-meter/kt-meter.js";
 import { KtPagination as Pt } from "./components/data/kt-pagination/kt-pagination.js";
@@ -42,10 +42,11 @@ import { KtStat as vt } from "./components/data/kt-stat/kt-stat.js";
 import { KtTable as Ht } from "./components/data/kt-table/kt-table.js";
 import { KtTimeline as kt, KtTimelineItem as wt } from "./components/data/kt-timeline/kt-timeline.js";
 import { g as Ft, r as Gt, a as Lt, b as Nt } from "./chunks/defaults-DKzFsNbv.js";
-import { K as qt, d as zt } from "./chunks/kt-element-B_jjQDhg.js";
+import { d as qt, s as zt, r as Jt, a as Ot } from "./chunks/index-fzPIgxe2.js";
+import { K as Rt, d as Ut } from "./chunks/kt-element-mdd5cXZX.js";
 export {
   Y as KtAlert,
-  r as KtAvatar,
+  o as KtAvatar,
   m as KtBadge,
   y as KtBreadcrumb,
   f as KtButton,
@@ -53,27 +54,27 @@ export {
   Bt as KtChart,
   g as KtCode,
   gt as KtCollapsible,
-  st as KtConfirmDialog,
-  I as KtDragDrop,
+  lt as KtConfirmDialog,
+  T as KtDragDrop,
   ut as KtDropdown,
-  qt as KtElement,
+  Rt as KtElement,
   _ as KtEmptyState,
-  S as KtForm,
+  b as KtForm,
   Q as KtHeader,
-  s as KtIcon,
+  l as KtIcon,
   B as KtInput,
   D as KtInputMenu,
   u as KtKbd,
   P as KtLabelInput,
   Dt as KtMeter,
-  It as KtModal,
+  Tt as KtModal,
   G as KtPageHeader,
   Pt as KtPagination,
   tt as KtProgressBar,
   N as KtSegmentedControl,
   v as KtSelect,
-  St as KtSidePanel,
-  rt as KtSkeleton,
+  bt as KtSidePanel,
+  ot as KtSkeleton,
   K as KtSplitButton,
   vt as KtStat,
   q as KtSubMenuNavigation,
@@ -88,11 +89,15 @@ export {
   U as KtToggleButton,
   W as KtToggleButtonGroup,
   nt as KtTooltip,
-  zt as defineElement,
+  qt as defaultStrings,
+  Ut as defineElement,
   Ft as getIcon,
+  zt as getStrings,
   Gt as registerIcon,
   Lt as registerIcons,
   Nt as registeredIcons,
+  Jt as resetStrings,
+  Ot as setStrings,
   Kt as toaster
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/internal/kt-element.d.ts

@@ -1,4 +1,4 @@
-import { LitElement, type CSSResultGroup } from 'lit';
+import { LitElement, type CSSResultGroup, type PropertyValues } from 'lit';
 /**
  * Base class for every Kanto element.
  *
@@ -10,6 +10,11 @@ import { LitElement, type CSSResultGroup } from 'lit';
  */
 export declare class KtElement extends LitElement {
     static styles: CSSResultGroup;
+    private unsubscribeStrings;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** True when this update was triggered by `setStrings`. */
+    protected stringsChanged(changed: PropertyValues): boolean;
 }
 /**
  * Registers a custom element, tolerating a repeat call.

package/dist/internal/strings.d.ts

@@ -0,0 +1,93 @@
+/**
+ * Every piece of copy the elements write themselves — empty states, button
+ * labels, validation messages, and the accessible names a screen reader
+ * announces but nobody sees.
+ *
+ * English by default. An application in another language replaces them once,
+ * at start-up, and every element follows:
+ *
+ *     import { setStrings } from 'kanto-ds/strings';
+ *
+ *     setStrings({
+ *       clear: 'Effacer',
+ *       pageOf: (page, total) => `Page ${page} sur ${total}`,
+ *     });
+ *
+ * Anything left out keeps its English default. A string an element also takes
+ * as a property — `emptyText`, `placeholder`, `confirmLabel` — still wins when
+ * it is set, so one screen can say something different from the rest.
+ *
+ * Copy that carries a value is a function, not a template with placeholders:
+ * the translation owns the word order, and "Remove {name}" does not survive
+ * languages that put the object first.
+ */
+export interface KtStrings {
+    /** Clear button in fields. */
+    clear: string;
+    /** Close button on toasts, alerts' dismiss button. */
+    close: string;
+    dismiss: string;
+    /** Copy button on `kt-code`, and its state once copied. */
+    copy: string;
+    copied: string;
+    copyCode: string;
+    /** The countdown bar on a toast that closes itself. */
+    timeRemaining: string;
+    /** Remove button on a badge or a dropped file. */
+    remove: (name: string) => string;
+    noOptions: string;
+    noResults: string;
+    noActions: string;
+    noData: string;
+    loading: string;
+    /** `kt-select` with nothing chosen. */
+    select: string;
+    openList: string;
+    closeList: string;
+    showPassword: string;
+    hidePassword: string;
+    searchCountry: string;
+    noCountry: string;
+    countryCode: (country: string | undefined) => string;
+    dragAndDrop: string;
+    browseFiles: string;
+    recommendedSize: (size: string) => string;
+    selectedFiles: string;
+    required: string;
+    selectOption: string;
+    selectFile: string;
+    openMenu: string;
+    closeMenu: string;
+    breadcrumb: string;
+    secondaryNavigation: string;
+    pagination: string;
+    previous: string;
+    next: string;
+    pageOf: (page: number, total: number) => string;
+    moreActions: string;
+    selectRow: string;
+    selectAll: string;
+    total: string;
+    /** Column headers of the data table every chart renders for assistive tech. */
+    chartSeries: string;
+    chartPoint: string;
+    chartSlice: string;
+    chartShare: string;
+    confirmHeading: string;
+    confirm: string;
+    cancel: string;
+    details: string;
+    avatar: string;
+}
+export declare const defaultStrings: Readonly<KtStrings>;
+/** The strings in effect. Elements read them at render time. */
+export declare function strings(): Readonly<KtStrings>;
+/**
+ * Replaces some or all of the strings, and re-renders every connected element
+ * so the change shows at once — switching language at runtime works.
+ */
+export declare function setStrings(overrides: Partial<KtStrings>): void;
+/** Back to the English defaults. */
+export declare function resetStrings(): void;
+/** Calls `listener` after every `setStrings`. Returns the unsubscribe function. */
+export declare function onStringsChange(listener: () => void): () => void;

package/dist/react/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/react/index.ts"],"sourcesContent":["/**\n * React wrappers for the Kanto elements.\n *\n * React 19 can set custom-element properties and listen for custom events on\n * its own, so these wrappers are not strictly required. They are here for what\n * plain JSX still cannot give you: typed props with autocompletion, typed\n * event handlers as `onKtChange` rather than `useEffect` plus\n * `addEventListener`, and refs typed as the element rather than `HTMLElement`.\n *\n *     import { KtButton, KtInput } from 'kanto-ds/react';\n *     import 'kanto-ds/styles.css';\n *\n *     <KtInput placeholder=\"Search\" onKtChange={(e) => setQuery(e.detail.value)} />\n *\n * React is a peer dependency: the package works without it.\n */\nimport * as React from 'react';\nimport { createComponent, type EventName } from '@lit/react';\n\nimport { KtAvatar as KtAvatarElement } from '../components/core/kt-avatar/kt-avatar.js';\nimport { KtBadge as KtBadgeElement } from '../components/core/kt-badge/kt-badge.js';\nimport { KtButton as KtButtonElement } from '../components/core/kt-button/kt-button.js';\nimport { KtSplitButton as KtSplitButtonElement } from '../components/core/kt-split-button/kt-split-button.js';\nimport { KtCard as KtCardElement } from '../components/core/kt-card/kt-card.js';\nimport { KtCode as KtCodeElement } from '../components/core/kt-code/kt-code.js';\nimport { KtIcon as KtIconElement } from '../components/core/kt-icon/kt-icon.js';\nimport { KtKbd as KtKbdElement } from '../components/core/kt-kbd/kt-kbd.js';\nimport { KtDragDrop as KtDragDropElement } from '../components/forms/kt-drag-drop/kt-drag-drop.js';\nimport { KtForm as KtFormElement } from '../components/forms/kt-form/kt-form.js';\nimport { KtInput as KtInputElement } from '../components/forms/kt-input/kt-input.js';\nimport { KtInputMenu as KtInputMenuElement } from '../components/forms/kt-input-menu/kt-input-menu.js';\nimport { KtLabelInput as KtLabelInputElement } from '../components/forms/kt-label-input/kt-label-input.js';\nimport { KtSelect as KtSelectElement } from '../components/forms/kt-select/kt-select.js';\nimport { KtTextarea as KtTextareaElement } from '../components/forms/kt-textarea/kt-textarea.js';\nimport { KtToggle as KtToggleElement } from '../components/forms/kt-toggle/kt-toggle.js';\nimport { KtBreadcrumb as KtBreadcrumbElement } from '../components/navigation/kt-breadcrumb/kt-breadcrumb.js';\nimport { KtPageHeader as KtPageHeaderElement } from '../components/navigation/kt-page-header/kt-page-header.js';\nimport { KtSegmentedControl as KtSegmentedControlElement } from '../components/navigation/kt-segmented-control/kt-segmented-control.js';\nimport { KtSubMenuNavigation as KtSubMenuNavigationElement } from '../components/navigation/kt-sub-menu-navigation/kt-sub-menu-navigation.js';\nimport { KtTabs as KtTabsElement } from '../components/navigation/kt-tabs/kt-tabs.js';\nimport { KtHeader as KtHeaderElement } from '../components/navigation/kt-header/kt-header.js';\nimport { KtToggleButton as KtToggleButtonElement } from '../components/navigation/kt-toggle-button/kt-toggle-button.js';\nimport { KtToggleButtonGroup as KtToggleButtonGroupElement } from '../components/navigation/kt-toggle-button-group/kt-toggle-button-group.js';\nimport { KtAlert as KtAlertElement } from '../components/feedback/kt-alert/kt-alert.js';\nimport { KtEmptyState as KtEmptyStateElement } from '../components/feedback/kt-empty-state/kt-empty-state.js';\nimport { KtProgressBar as KtProgressBarElement } from '../components/feedback/kt-progress-bar/kt-progress-bar.js';\nimport { KtSkeleton as KtSkeletonElement } from '../components/feedback/kt-skeleton/kt-skeleton.js';\nimport { KtToast as KtToastElement } from '../components/feedback/kt-toast/kt-toast.js';\nimport { KtToastContainer as KtToastContainerElement } from '../components/feedback/kt-toast-container/kt-toast-container.js';\nimport { KtTooltip as KtTooltipElement } from '../components/feedback/kt-tooltip/kt-tooltip.js';\nimport { KtCollapsible as KtCollapsibleElement } from '../components/overlays/kt-collapsible/kt-collapsible.js';\nimport { KtConfirmDialog as KtConfirmDialogElement } from '../components/overlays/kt-confirm-dialog/kt-confirm-dialog.js';\nimport { KtDropdown as KtDropdownElement } from '../components/overlays/kt-dropdown/kt-dropdown.js';\nimport { KtModal as KtModalElement } from '../components/overlays/kt-modal/kt-modal.js';\nimport { KtSidePanel as KtSidePanelElement } from '../components/overlays/kt-side-panel/kt-side-panel.js';\nimport { KtChart as KtChartElement } from '../components/data/kt-chart/kt-chart.js';\nimport { KtMeter as KtMeterElement } from '../components/data/kt-meter/kt-meter.js';\nimport { KtPagination as KtPaginationElement } from '../components/data/kt-pagination/kt-pagination.js';\nimport { KtStat as KtStatElement } from '../components/data/kt-stat/kt-stat.js';\nimport { KtTable as KtTableElement } from '../components/data/kt-table/kt-table.js';\nimport {\n  KtTimeline as KtTimelineElement,\n  KtTimelineItem as KtTimelineItemElement,\n} from '../components/data/kt-timeline/kt-timeline.js';\n\n/** Narrows an event name to the detail its element actually dispatches. */\ntype Kt<T> = EventName<CustomEvent<T>>;\n\n// === CORE ===\nexport const KtAvatar = createComponent({\n  tagName: 'kt-avatar',\n  elementClass: KtAvatarElement,\n  react: React,\n});\n\nexport const KtBadge = createComponent({\n  tagName: 'kt-badge',\n  elementClass: KtBadgeElement,\n  react: React,\n  events: {\n    onKtBadgeClick: 'kt-badge-click' as Kt<never>,\n    onKtRemove: 'kt-remove' as Kt<never>,\n  },\n});\n\nexport const KtButton = createComponent({\n  tagName: 'kt-button',\n  elementClass: KtButtonElement,\n  react: React,\n});\n\nexport const KtSplitButton = createComponent({\n  tagName: 'kt-split-button',\n  elementClass: KtSplitButtonElement,\n  react: React,\n  events: {\n    onKtSelect: 'kt-select' as Kt<{ value: string | number }>,\n    onKtOpen: 'kt-open' as Kt<never>,\n    onKtClose: 'kt-close' as Kt<never>,\n  },\n});\n\nexport const KtCard = createComponent({\n  tagName: 'kt-card',\n  elementClass: KtCardElement,\n  react: React,\n  events: { onKtCardClick: 'kt-card-click' as Kt<never> },\n});\n\nexport const KtCode = createComponent({\n  tagName: 'kt-code',\n  elementClass: KtCodeElement,\n  react: React,\n  events: { onKtCopy: 'kt-copy' as Kt<{ code: string }> },\n});\n\nexport const KtIcon = createComponent({\n  tagName: 'kt-icon',\n  elementClass: KtIconElement,\n  react: React,\n});\n\nexport const KtKbd = createComponent({\n  tagName: 'kt-kbd',\n  elementClass: KtKbdElement,\n  react: React,\n});\n\n// === FORMS ===\nexport const KtForm = createComponent({\n  tagName: 'kt-form',\n  elementClass: KtFormElement,\n  react: React,\n});\n\nexport const KtInput = createComponent({\n  tagName: 'kt-input',\n  elementClass: KtInputElement,\n  react: React,\n  events: {\n    onKtInput: 'kt-input' as Kt<{ value: string }>,\n    onKtChange: 'kt-change' as Kt<{ value: string }>,\n    onKtClear: 'kt-clear' as Kt<never>,\n    onKtCountryChange: 'kt-country-change' as Kt<{ country: string; dialCode: string }>,\n  },\n});\n\nexport const KtTextarea = createComponent({\n  tagName: 'kt-textarea',\n  elementClass: KtTextareaElement,\n  react: React,\n  events: {\n    onKtInput: 'kt-input' as Kt<{ value: string }>,\n    onKtChange: 'kt-change' as Kt<{ value: string }>,\n  },\n});\n\nexport const KtLabelInput = createComponent({\n  tagName: 'kt-label-input',\n  elementClass: KtLabelInputElement,\n  react: React,\n});\n\nexport const KtToggle = createComponent({\n  tagName: 'kt-toggle',\n  elementClass: KtToggleElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ checked: boolean }> },\n});\n\nexport const KtSelect = createComponent({\n  tagName: 'kt-select',\n  elementClass: KtSelectElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ value: string | number | null }> },\n});\n\nexport const KtInputMenu = createComponent({\n  tagName: 'kt-input-menu',\n  elementClass: KtInputMenuElement,\n  react: React,\n  events: {\n    onKtChange: 'kt-change' as Kt<{ value: string | number | null }>,\n    onKtFilter: 'kt-filter' as Kt<{ query: string }>,\n  },\n});\n\nexport const KtDragDrop = createComponent({\n  tagName: 'kt-drag-drop',\n  elementClass: KtDragDropElement,\n  react: React,\n  events: {\n    onKtFilesChange: 'kt-files-change' as Kt<{ files: File[] }>,\n    onKtFilesRejected: 'kt-files-rejected' as Kt<{ files: File[]; reason: 'type' | 'size' }>,\n  },\n});\n\n// === NAVIGATION ===\nexport const KtBreadcrumb = createComponent({\n  tagName: 'kt-breadcrumb',\n  elementClass: KtBreadcrumbElement,\n  react: React,\n  events: { onKtNavigate: 'kt-navigate' as Kt<{ index: number }> },\n});\n\nexport const KtSubMenuNavigation = createComponent({\n  tagName: 'kt-sub-menu-navigation',\n  elementClass: KtSubMenuNavigationElement,\n  react: React,\n  events: { onKtNavigate: 'kt-navigate' as Kt<unknown> },\n});\n\nexport const KtPageHeader = createComponent({\n  tagName: 'kt-page-header',\n  elementClass: KtPageHeaderElement,\n  react: React,\n});\n\nexport const KtSegmentedControl = createComponent({\n  tagName: 'kt-segmented-control',\n  elementClass: KtSegmentedControlElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ value: string | number }> },\n});\n\nexport const KtTabs = createComponent({\n  tagName: 'kt-tabs',\n  elementClass: KtTabsElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ value: string | number }> },\n});\n\nexport const KtHeader = createComponent({\n  tagName: 'kt-header',\n  elementClass: KtHeaderElement,\n  react: React,\n  events: { onKtMenuToggle: 'kt-menu-toggle' as Kt<{ open: boolean }> },\n});\n\nexport const KtToggleButton = createComponent({\n  tagName: 'kt-toggle-button',\n  elementClass: KtToggleButtonElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ selected: boolean; value: string }> },\n});\n\nexport const KtToggleButtonGroup = createComponent({\n  tagName: 'kt-toggle-button-group',\n  elementClass: KtToggleButtonGroupElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ value: string | string[] | null }> },\n});\n\n// === FEEDBACK ===\nexport const KtAlert = createComponent({\n  tagName: 'kt-alert',\n  elementClass: KtAlertElement,\n  react: React,\n  events: { onKtClose: 'kt-close' as Kt<never> },\n});\n\nexport const KtEmptyState = createComponent({\n  tagName: 'kt-empty-state',\n  elementClass: KtEmptyStateElement,\n  react: React,\n});\n\nexport const KtProgressBar = createComponent({\n  tagName: 'kt-progress-bar',\n  elementClass: KtProgressBarElement,\n  react: React,\n});\n\nexport const KtSkeleton = createComponent({\n  tagName: 'kt-skeleton',\n  elementClass: KtSkeletonElement,\n  react: React,\n});\n\nexport const KtTooltip = createComponent({\n  tagName: 'kt-tooltip',\n  elementClass: KtTooltipElement,\n  react: React,\n});\n\nexport const KtToast = createComponent({\n  tagName: 'kt-toast',\n  elementClass: KtToastElement,\n  react: React,\n  events: { onKtToastClose: 'kt-toast-close' as Kt<never> },\n});\n\nexport const KtToastContainer = createComponent({\n  tagName: 'kt-toast-container',\n  elementClass: KtToastContainerElement,\n  react: React,\n});\n\n// === OVERLAYS ===\nexport const KtCollapsible = createComponent({\n  tagName: 'kt-collapsible',\n  elementClass: KtCollapsibleElement,\n  react: React,\n  events: { onKtToggle: 'kt-toggle' as Kt<{ open: boolean }> },\n});\n\nexport const KtDropdown = createComponent({\n  tagName: 'kt-dropdown',\n  elementClass: KtDropdownElement,\n  react: React,\n  events: {\n    onKtSelect: 'kt-select' as Kt<{ value: string | number }>,\n    onKtOpen: 'kt-open' as Kt<never>,\n    onKtClose: 'kt-close' as Kt<never>,\n  },\n});\n\nexport const KtModal = createComponent({\n  tagName: 'kt-modal',\n  elementClass: KtModalElement,\n  react: React,\n  events: { onKtClose: 'kt-close' as Kt<never> },\n});\n\nexport const KtSidePanel = createComponent({\n  tagName: 'kt-side-panel',\n  elementClass: KtSidePanelElement,\n  react: React,\n  events: { onKtClose: 'kt-close' as Kt<never> },\n});\n\nexport const KtConfirmDialog = createComponent({\n  tagName: 'kt-confirm-dialog',\n  elementClass: KtConfirmDialogElement,\n  react: React,\n  events: {\n    onKtConfirm: 'kt-confirm' as Kt<never>,\n    onKtCancel: 'kt-cancel' as Kt<never>,\n  },\n});\n\n// === DATA ===\nexport const KtChart = createComponent({\n  tagName: 'kt-chart',\n  elementClass: KtChartElement,\n  react: React,\n  events: {\n    onKtPointHover: 'kt-point-hover' as Kt<{ index: number; series: number }>,\n    onKtSeriesToggle: 'kt-series-toggle' as Kt<{ series: number; hidden: boolean }>,\n  },\n});\n\nexport const KtTable = createComponent({\n  tagName: 'kt-table',\n  elementClass: KtTableElement,\n  react: React,\n  events: {\n    onKtSortChange: 'kt-sort-change' as Kt<{\n      key: string | null;\n      direction: 'asc' | 'desc' | null;\n    }>,\n    onKtSelectionChange: 'kt-selection-change' as Kt<{ selected: unknown[] }>,\n    onKtRowClick: 'kt-row-click' as Kt<{ index: number }>,\n    onKtPageChange: 'kt-page-change' as Kt<{ page: number }>,\n  },\n});\n\nexport const KtMeter = createComponent({\n  tagName: 'kt-meter',\n  elementClass: KtMeterElement,\n  react: React,\n});\n\nexport const KtPagination = createComponent({\n  tagName: 'kt-pagination',\n  elementClass: KtPaginationElement,\n  react: React,\n  events: { onKtPageChange: 'kt-page-change' as Kt<{ page: number }> },\n});\n\n// The imperative toaster needs no wrapper.\nexport { toaster } from '../components/feedback/kt-toast-container/toaster.js';\n\nexport const KtStat = createComponent({\n  tagName: 'kt-stat',\n  elementClass: KtStatElement,\n  react: React,\n});\n\nexport const KtTimeline = createComponent({\n  tagName: 'kt-timeline',\n  elementClass: KtTimelineElement,\n  react: React,\n});\n\nexport const KtTimelineItem = createComponent({\n  tagName: 'kt-timeline-item',\n  elementClass: KtTimelineItemElement,\n  react: React,\n});\n"],"names":["KtAvatar","createComponent","KtAvatarElement","React","KtBadge","KtBadgeElement","KtButton","KtButtonElement","KtSplitButton","KtSplitButtonElement","KtCard","KtCardElement","KtCode","KtCodeElement","KtIcon","KtIconElement","KtKbd","KtKbdElement","KtForm","KtFormElement","KtInput","KtInputElement","KtTextarea","KtTextareaElement","KtLabelInput","KtLabelInputElement","KtToggle","KtToggleElement","KtSelect","KtSelectElement","KtInputMenu","KtInputMenuElement","KtDragDrop","KtDragDropElement","KtBreadcrumb","KtBreadcrumbElement","KtSubMenuNavigation","KtSubMenuNavigationElement","KtPageHeader","KtPageHeaderElement","KtSegmentedControl","KtSegmentedControlElement","KtTabs","KtTabsElement","KtHeader","KtHeaderElement","KtToggleButton","KtToggleButtonElement","KtToggleButtonGroup","KtToggleButtonGroupElement","KtAlert","KtAlertElement","KtEmptyState","KtEmptyStateElement","KtProgressBar","KtProgressBarElement","KtSkeleton","KtSkeletonElement","KtTooltip","KtTooltipElement","KtToast","KtToastElement","KtToastContainer","KtToastContainerElement","KtCollapsible","KtCollapsibleElement","KtDropdown","KtDropdownElement","KtModal","KtModalElement","KtSidePanel","KtSidePanelElement","KtConfirmDialog","KtConfirmDialogElement","KtChart","KtChartElement","KtTable","KtTableElement","KtMeter","KtMeterElement","KtPagination","KtPaginationElement","KtStat","KtStatElement","KtTimeline","KtTimelineElement","KtTimelineItem","KtTimelineItemElement"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/react/index.ts"],"sourcesContent":["/**\n * React wrappers for the Kanto elements — for React 18.\n *\n * React 18 sets every prop as a string attribute and cannot listen for custom\n * events, so each element is wrapped with `@lit/react`: props become\n * properties, `onKtChange` listens for `kt-change`, refs are typed as the\n * element. `@lit/react` is an optional peer dependency — a React 18 project\n * installs it alongside kanto-ds:\n *\n *     npm install kanto-ds @lit/react\n *\n *     import { KtButton, KtInput } from 'kanto-ds/react';\n *     import 'kanto-ds/styles.css';\n *\n *     <KtInput placeholder=\"Search\" onKtChange={(e) => setQuery(e.detail.value)} />\n *\n * React 19 needs none of this: it renders the `kt-*` tags directly, and\n * `kanto-ds/react/jsx` types them.\n */\nimport * as React from 'react';\nimport { createComponent, type EventName } from '@lit/react';\n\nimport { KtAvatar as KtAvatarElement } from '../components/core/kt-avatar/kt-avatar.js';\nimport { KtBadge as KtBadgeElement } from '../components/core/kt-badge/kt-badge.js';\nimport { KtButton as KtButtonElement } from '../components/core/kt-button/kt-button.js';\nimport { KtSplitButton as KtSplitButtonElement } from '../components/core/kt-split-button/kt-split-button.js';\nimport { KtCard as KtCardElement } from '../components/core/kt-card/kt-card.js';\nimport { KtCode as KtCodeElement } from '../components/core/kt-code/kt-code.js';\nimport { KtIcon as KtIconElement } from '../components/core/kt-icon/kt-icon.js';\nimport { KtKbd as KtKbdElement } from '../components/core/kt-kbd/kt-kbd.js';\nimport { KtDragDrop as KtDragDropElement } from '../components/forms/kt-drag-drop/kt-drag-drop.js';\nimport { KtForm as KtFormElement } from '../components/forms/kt-form/kt-form.js';\nimport { KtInput as KtInputElement } from '../components/forms/kt-input/kt-input.js';\nimport { KtInputMenu as KtInputMenuElement } from '../components/forms/kt-input-menu/kt-input-menu.js';\nimport { KtLabelInput as KtLabelInputElement } from '../components/forms/kt-label-input/kt-label-input.js';\nimport { KtSelect as KtSelectElement } from '../components/forms/kt-select/kt-select.js';\nimport { KtTextarea as KtTextareaElement } from '../components/forms/kt-textarea/kt-textarea.js';\nimport { KtToggle as KtToggleElement } from '../components/forms/kt-toggle/kt-toggle.js';\nimport { KtBreadcrumb as KtBreadcrumbElement } from '../components/navigation/kt-breadcrumb/kt-breadcrumb.js';\nimport { KtPageHeader as KtPageHeaderElement } from '../components/navigation/kt-page-header/kt-page-header.js';\nimport { KtSegmentedControl as KtSegmentedControlElement } from '../components/navigation/kt-segmented-control/kt-segmented-control.js';\nimport { KtSubMenuNavigation as KtSubMenuNavigationElement } from '../components/navigation/kt-sub-menu-navigation/kt-sub-menu-navigation.js';\nimport { KtTabs as KtTabsElement } from '../components/navigation/kt-tabs/kt-tabs.js';\nimport { KtHeader as KtHeaderElement } from '../components/navigation/kt-header/kt-header.js';\nimport { KtToggleButton as KtToggleButtonElement } from '../components/navigation/kt-toggle-button/kt-toggle-button.js';\nimport { KtToggleButtonGroup as KtToggleButtonGroupElement } from '../components/navigation/kt-toggle-button-group/kt-toggle-button-group.js';\nimport { KtAlert as KtAlertElement } from '../components/feedback/kt-alert/kt-alert.js';\nimport { KtEmptyState as KtEmptyStateElement } from '../components/feedback/kt-empty-state/kt-empty-state.js';\nimport { KtProgressBar as KtProgressBarElement } from '../components/feedback/kt-progress-bar/kt-progress-bar.js';\nimport { KtSkeleton as KtSkeletonElement } from '../components/feedback/kt-skeleton/kt-skeleton.js';\nimport { KtToast as KtToastElement } from '../components/feedback/kt-toast/kt-toast.js';\nimport { KtToastContainer as KtToastContainerElement } from '../components/feedback/kt-toast-container/kt-toast-container.js';\nimport { KtTooltip as KtTooltipElement } from '../components/feedback/kt-tooltip/kt-tooltip.js';\nimport { KtCollapsible as KtCollapsibleElement } from '../components/overlays/kt-collapsible/kt-collapsible.js';\nimport { KtConfirmDialog as KtConfirmDialogElement } from '../components/overlays/kt-confirm-dialog/kt-confirm-dialog.js';\nimport { KtDropdown as KtDropdownElement } from '../components/overlays/kt-dropdown/kt-dropdown.js';\nimport { KtModal as KtModalElement } from '../components/overlays/kt-modal/kt-modal.js';\nimport { KtSidePanel as KtSidePanelElement } from '../components/overlays/kt-side-panel/kt-side-panel.js';\nimport { KtChart as KtChartElement } from '../components/data/kt-chart/kt-chart.js';\nimport { KtMeter as KtMeterElement } from '../components/data/kt-meter/kt-meter.js';\nimport { KtPagination as KtPaginationElement } from '../components/data/kt-pagination/kt-pagination.js';\nimport { KtStat as KtStatElement } from '../components/data/kt-stat/kt-stat.js';\nimport { KtTable as KtTableElement } from '../components/data/kt-table/kt-table.js';\nimport {\n  KtTimeline as KtTimelineElement,\n  KtTimelineItem as KtTimelineItemElement,\n} from '../components/data/kt-timeline/kt-timeline.js';\n\n/** Narrows an event name to the detail its element actually dispatches. */\ntype Kt<T> = EventName<CustomEvent<T>>;\n\n// === CORE ===\nexport const KtAvatar = createComponent({\n  tagName: 'kt-avatar',\n  elementClass: KtAvatarElement,\n  react: React,\n});\n\nexport const KtBadge = createComponent({\n  tagName: 'kt-badge',\n  elementClass: KtBadgeElement,\n  react: React,\n  events: {\n    onKtBadgeClick: 'kt-badge-click' as Kt<never>,\n    onKtRemove: 'kt-remove' as Kt<never>,\n  },\n});\n\nexport const KtButton = createComponent({\n  tagName: 'kt-button',\n  elementClass: KtButtonElement,\n  react: React,\n});\n\nexport const KtSplitButton = createComponent({\n  tagName: 'kt-split-button',\n  elementClass: KtSplitButtonElement,\n  react: React,\n  events: {\n    onKtSelect: 'kt-select' as Kt<{ value: string | number }>,\n    onKtOpen: 'kt-open' as Kt<never>,\n    onKtClose: 'kt-close' as Kt<never>,\n  },\n});\n\nexport const KtCard = createComponent({\n  tagName: 'kt-card',\n  elementClass: KtCardElement,\n  react: React,\n  events: { onKtCardClick: 'kt-card-click' as Kt<never> },\n});\n\nexport const KtCode = createComponent({\n  tagName: 'kt-code',\n  elementClass: KtCodeElement,\n  react: React,\n  events: { onKtCopy: 'kt-copy' as Kt<{ code: string }> },\n});\n\nexport const KtIcon = createComponent({\n  tagName: 'kt-icon',\n  elementClass: KtIconElement,\n  react: React,\n});\n\nexport const KtKbd = createComponent({\n  tagName: 'kt-kbd',\n  elementClass: KtKbdElement,\n  react: React,\n});\n\n// === FORMS ===\nexport const KtForm = createComponent({\n  tagName: 'kt-form',\n  elementClass: KtFormElement,\n  react: React,\n});\n\nexport const KtInput = createComponent({\n  tagName: 'kt-input',\n  elementClass: KtInputElement,\n  react: React,\n  events: {\n    onKtInput: 'kt-input' as Kt<{ value: string }>,\n    onKtChange: 'kt-change' as Kt<{ value: string }>,\n    onKtClear: 'kt-clear' as Kt<never>,\n    onKtCountryChange: 'kt-country-change' as Kt<{ country: string; dialCode: string }>,\n  },\n});\n\nexport const KtTextarea = createComponent({\n  tagName: 'kt-textarea',\n  elementClass: KtTextareaElement,\n  react: React,\n  events: {\n    onKtInput: 'kt-input' as Kt<{ value: string }>,\n    onKtChange: 'kt-change' as Kt<{ value: string }>,\n  },\n});\n\nexport const KtLabelInput = createComponent({\n  tagName: 'kt-label-input',\n  elementClass: KtLabelInputElement,\n  react: React,\n});\n\nexport const KtToggle = createComponent({\n  tagName: 'kt-toggle',\n  elementClass: KtToggleElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ checked: boolean }> },\n});\n\nexport const KtSelect = createComponent({\n  tagName: 'kt-select',\n  elementClass: KtSelectElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ value: string | number | null }> },\n});\n\nexport const KtInputMenu = createComponent({\n  tagName: 'kt-input-menu',\n  elementClass: KtInputMenuElement,\n  react: React,\n  events: {\n    onKtChange: 'kt-change' as Kt<{ value: string | number | null }>,\n    onKtFilter: 'kt-filter' as Kt<{ query: string }>,\n  },\n});\n\nexport const KtDragDrop = createComponent({\n  tagName: 'kt-drag-drop',\n  elementClass: KtDragDropElement,\n  react: React,\n  events: {\n    onKtFilesChange: 'kt-files-change' as Kt<{ files: File[] }>,\n    onKtFilesRejected: 'kt-files-rejected' as Kt<{ files: File[]; reason: 'type' | 'size' }>,\n  },\n});\n\n// === NAVIGATION ===\nexport const KtBreadcrumb = createComponent({\n  tagName: 'kt-breadcrumb',\n  elementClass: KtBreadcrumbElement,\n  react: React,\n  events: { onKtNavigate: 'kt-navigate' as Kt<{ index: number }> },\n});\n\nexport const KtSubMenuNavigation = createComponent({\n  tagName: 'kt-sub-menu-navigation',\n  elementClass: KtSubMenuNavigationElement,\n  react: React,\n  events: { onKtNavigate: 'kt-navigate' as Kt<unknown> },\n});\n\nexport const KtPageHeader = createComponent({\n  tagName: 'kt-page-header',\n  elementClass: KtPageHeaderElement,\n  react: React,\n});\n\nexport const KtSegmentedControl = createComponent({\n  tagName: 'kt-segmented-control',\n  elementClass: KtSegmentedControlElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ value: string | number }> },\n});\n\nexport const KtTabs = createComponent({\n  tagName: 'kt-tabs',\n  elementClass: KtTabsElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ value: string | number }> },\n});\n\nexport const KtHeader = createComponent({\n  tagName: 'kt-header',\n  elementClass: KtHeaderElement,\n  react: React,\n  events: { onKtMenuToggle: 'kt-menu-toggle' as Kt<{ open: boolean }> },\n});\n\nexport const KtToggleButton = createComponent({\n  tagName: 'kt-toggle-button',\n  elementClass: KtToggleButtonElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ selected: boolean; value: string }> },\n});\n\nexport const KtToggleButtonGroup = createComponent({\n  tagName: 'kt-toggle-button-group',\n  elementClass: KtToggleButtonGroupElement,\n  react: React,\n  events: { onKtChange: 'kt-change' as Kt<{ value: string | string[] | null }> },\n});\n\n// === FEEDBACK ===\nexport const KtAlert = createComponent({\n  tagName: 'kt-alert',\n  elementClass: KtAlertElement,\n  react: React,\n  events: { onKtClose: 'kt-close' as Kt<never> },\n});\n\nexport const KtEmptyState = createComponent({\n  tagName: 'kt-empty-state',\n  elementClass: KtEmptyStateElement,\n  react: React,\n});\n\nexport const KtProgressBar = createComponent({\n  tagName: 'kt-progress-bar',\n  elementClass: KtProgressBarElement,\n  react: React,\n});\n\nexport const KtSkeleton = createComponent({\n  tagName: 'kt-skeleton',\n  elementClass: KtSkeletonElement,\n  react: React,\n});\n\nexport const KtTooltip = createComponent({\n  tagName: 'kt-tooltip',\n  elementClass: KtTooltipElement,\n  react: React,\n});\n\nexport const KtToast = createComponent({\n  tagName: 'kt-toast',\n  elementClass: KtToastElement,\n  react: React,\n  events: { onKtToastClose: 'kt-toast-close' as Kt<never> },\n});\n\nexport const KtToastContainer = createComponent({\n  tagName: 'kt-toast-container',\n  elementClass: KtToastContainerElement,\n  react: React,\n});\n\n// === OVERLAYS ===\nexport const KtCollapsible = createComponent({\n  tagName: 'kt-collapsible',\n  elementClass: KtCollapsibleElement,\n  react: React,\n  events: { onKtToggle: 'kt-toggle' as Kt<{ open: boolean }> },\n});\n\nexport const KtDropdown = createComponent({\n  tagName: 'kt-dropdown',\n  elementClass: KtDropdownElement,\n  react: React,\n  events: {\n    onKtSelect: 'kt-select' as Kt<{ value: string | number }>,\n    onKtOpen: 'kt-open' as Kt<never>,\n    onKtClose: 'kt-close' as Kt<never>,\n  },\n});\n\nexport const KtModal = createComponent({\n  tagName: 'kt-modal',\n  elementClass: KtModalElement,\n  react: React,\n  events: { onKtClose: 'kt-close' as Kt<never> },\n});\n\nexport const KtSidePanel = createComponent({\n  tagName: 'kt-side-panel',\n  elementClass: KtSidePanelElement,\n  react: React,\n  events: { onKtClose: 'kt-close' as Kt<never> },\n});\n\nexport const KtConfirmDialog = createComponent({\n  tagName: 'kt-confirm-dialog',\n  elementClass: KtConfirmDialogElement,\n  react: React,\n  events: {\n    onKtConfirm: 'kt-confirm' as Kt<never>,\n    onKtCancel: 'kt-cancel' as Kt<never>,\n  },\n});\n\n// === DATA ===\nexport const KtChart = createComponent({\n  tagName: 'kt-chart',\n  elementClass: KtChartElement,\n  react: React,\n  events: {\n    onKtPointHover: 'kt-point-hover' as Kt<{ index: number; series: number }>,\n    onKtSeriesToggle: 'kt-series-toggle' as Kt<{ series: number; hidden: boolean }>,\n  },\n});\n\nexport const KtTable = createComponent({\n  tagName: 'kt-table',\n  elementClass: KtTableElement,\n  react: React,\n  events: {\n    onKtSortChange: 'kt-sort-change' as Kt<{\n      key: string | null;\n      direction: 'asc' | 'desc' | null;\n    }>,\n    onKtSelectionChange: 'kt-selection-change' as Kt<{ selected: unknown[] }>,\n    onKtRowClick: 'kt-row-click' as Kt<{ index: number }>,\n    onKtPageChange: 'kt-page-change' as Kt<{ page: number }>,\n  },\n});\n\nexport const KtMeter = createComponent({\n  tagName: 'kt-meter',\n  elementClass: KtMeterElement,\n  react: React,\n});\n\nexport const KtPagination = createComponent({\n  tagName: 'kt-pagination',\n  elementClass: KtPaginationElement,\n  react: React,\n  events: { onKtPageChange: 'kt-page-change' as Kt<{ page: number }> },\n});\n\n// The imperative toaster needs no wrapper.\nexport { toaster } from '../components/feedback/kt-toast-container/toaster.js';\n\nexport const KtStat = createComponent({\n  tagName: 'kt-stat',\n  elementClass: KtStatElement,\n  react: React,\n});\n\nexport const KtTimeline = createComponent({\n  tagName: 'kt-timeline',\n  elementClass: KtTimelineElement,\n  react: React,\n});\n\nexport const KtTimelineItem = createComponent({\n  tagName: 'kt-timeline-item',\n  elementClass: KtTimelineItemElement,\n  react: React,\n});\n"],"names":["KtAvatar","createComponent","KtAvatarElement","React","KtBadge","KtBadgeElement","KtButton","KtButtonElement","KtSplitButton","KtSplitButtonElement","KtCard","KtCardElement","KtCode","KtCodeElement","KtIcon","KtIconElement","KtKbd","KtKbdElement","KtForm","KtFormElement","KtInput","KtInputElement","KtTextarea","KtTextareaElement","KtLabelInput","KtLabelInputElement","KtToggle","KtToggleElement","KtSelect","KtSelectElement","KtInputMenu","KtInputMenuElement","KtDragDrop","KtDragDropElement","KtBreadcrumb","KtBreadcrumbElement","KtSubMenuNavigation","KtSubMenuNavigationElement","KtPageHeader","KtPageHeaderElement","KtSegmentedControl","KtSegmentedControlElement","KtTabs","KtTabsElement","KtHeader","KtHeaderElement","KtToggleButton","KtToggleButtonElement","KtToggleButtonGroup","KtToggleButtonGroupElement","KtAlert","KtAlertElement","KtEmptyState","KtEmptyStateElement","KtProgressBar","KtProgressBarElement","KtSkeleton","KtSkeletonElement","KtTooltip","KtTooltipElement","KtToast","KtToastElement","KtToastContainer","KtToastContainerElement","KtCollapsible","KtCollapsibleElement","KtDropdown","KtDropdownElement","KtModal","KtModalElement","KtSidePanel","KtSidePanelElement","KtConfirmDialog","KtConfirmDialogElement","KtChart","KtChartElement","KtTable","KtTableElement","KtMeter","KtMeterElement","KtPagination","KtPaginationElement","KtStat","KtStatElement","KtTimeline","KtTimelineElement","KtTimelineItem","KtTimelineItemElement"],"mappings":"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"}

package/dist/react/jsx.d.ts

@@ -0,0 +1,213 @@
+/**
+ * JSX typings for the Kanto elements, for React 19.
+ *
+ * React 19 renders custom elements natively: it sets a prop as a property when
+ * the element has one — so `options={regions}` reaches `<kt-select>` as an
+ * array — and a prop named `on` + an event name listens for that event, so
+ * `onkt-change` hears `kt-change`. What it cannot know is which tags exist
+ * and what they take; without this module TypeScript rejects every `kt-*`
+ * tag. It is types only: importing it loads nothing, and it needs no package
+ * beyond React itself.
+ *
+ *     import 'kanto-ds';
+ *     import 'kanto-ds/styles.css';
+ *     import type {} from 'kanto-ds/react/jsx';
+ *
+ *     <kt-select options={regions} onkt-change={(e) => setRegion(e.detail.value)} />
+ *
+ * React 18 cannot do either, which is what the wrappers in `kanto-ds/react`
+ * are for.
+ */
+import type * as React from 'react';
+import type { KtAvatar, KtBadge, KtButton, KtSplitButton, KtCard, KtCode, KtIcon, KtKbd, KtForm, KtInput, KtTextarea, KtLabelInput, KtToggle, KtSelect, KtInputMenu, KtDragDrop, KtBreadcrumb, KtSubMenuNavigation, KtPageHeader, KtSegmentedControl, KtTabs, KtHeader, KtToggleButton, KtToggleButtonGroup, KtAlert, KtEmptyState, KtProgressBar, KtSkeleton, KtTooltip, KtToast, KtToastContainer, KtCollapsible, KtDropdown, KtModal, KtSidePanel, KtConfirmDialog, KtChart, KtTable, KtMeter, KtPagination, KtStat, KtTimeline, KtTimelineItem } from 'kanto-ds';
+/** The `on<event>` props React 19 turns into listeners, typed by their detail. */
+type Handlers<E> = {
+    [K in keyof E & string as `on${K}`]?: (event: CustomEvent<E[K]>) => void;
+};
+/**
+ * What a `kt-*` tag accepts in JSX: its own public properties, the usual
+ * HTML attributes and a typed ref, plus a handler for each event it fires.
+ */
+type KtProps<T extends HTMLElement, E = Record<never, never>> = Partial<Omit<T, keyof HTMLElement>> & React.HTMLAttributes<T> & React.RefAttributes<T> & Handlers<E>;
+declare module 'react' {
+    namespace JSX {
+        interface IntrinsicElements {
+            'kt-avatar': KtProps<KtAvatar>;
+            'kt-badge': KtProps<KtBadge, {
+                'kt-badge-click': never;
+                'kt-remove': never;
+            }>;
+            'kt-button': KtProps<KtButton>;
+            'kt-split-button': KtProps<KtSplitButton, {
+                'kt-select': {
+                    value: string | number;
+                };
+                'kt-open': never;
+                'kt-close': never;
+            }>;
+            'kt-card': KtProps<KtCard, {
+                'kt-card-click': never;
+            }>;
+            'kt-code': KtProps<KtCode, {
+                'kt-copy': {
+                    code: string;
+                };
+            }>;
+            'kt-icon': KtProps<KtIcon>;
+            'kt-kbd': KtProps<KtKbd>;
+            'kt-form': KtProps<KtForm>;
+            'kt-input': KtProps<KtInput, {
+                'kt-input': {
+                    value: string;
+                };
+                'kt-change': {
+                    value: string;
+                };
+                'kt-clear': never;
+                'kt-country-change': {
+                    country: string;
+                    dialCode: string;
+                };
+            }>;
+            'kt-textarea': KtProps<KtTextarea, {
+                'kt-input': {
+                    value: string;
+                };
+                'kt-change': {
+                    value: string;
+                };
+            }>;
+            'kt-label-input': KtProps<KtLabelInput>;
+            'kt-toggle': KtProps<KtToggle, {
+                'kt-change': {
+                    checked: boolean;
+                };
+            }>;
+            'kt-select': KtProps<KtSelect, {
+                'kt-change': {
+                    value: string | number | null;
+                };
+            }>;
+            'kt-input-menu': KtProps<KtInputMenu, {
+                'kt-change': {
+                    value: string | number | null;
+                };
+                'kt-filter': {
+                    query: string;
+                };
+            }>;
+            'kt-drag-drop': KtProps<KtDragDrop, {
+                'kt-files-change': {
+                    files: File[];
+                };
+                'kt-files-rejected': {
+                    files: File[];
+                    reason: 'type' | 'size';
+                };
+            }>;
+            'kt-breadcrumb': KtProps<KtBreadcrumb, {
+                'kt-navigate': {
+                    index: number;
+                };
+            }>;
+            'kt-sub-menu-navigation': KtProps<KtSubMenuNavigation, {
+                'kt-navigate': unknown;
+            }>;
+            'kt-page-header': KtProps<KtPageHeader>;
+            'kt-segmented-control': KtProps<KtSegmentedControl, {
+                'kt-change': {
+                    value: string | number;
+                };
+            }>;
+            'kt-tabs': KtProps<KtTabs, {
+                'kt-change': {
+                    value: string | number;
+                };
+            }>;
+            'kt-header': KtProps<KtHeader, {
+                'kt-menu-toggle': {
+                    open: boolean;
+                };
+            }>;
+            'kt-toggle-button': KtProps<KtToggleButton, {
+                'kt-change': {
+                    selected: boolean;
+                    value: string;
+                };
+            }>;
+            'kt-toggle-button-group': KtProps<KtToggleButtonGroup, {
+                'kt-change': {
+                    value: string | string[] | null;
+                };
+            }>;
+            'kt-alert': KtProps<KtAlert, {
+                'kt-close': never;
+            }>;
+            'kt-empty-state': KtProps<KtEmptyState>;
+            'kt-progress-bar': KtProps<KtProgressBar>;
+            'kt-skeleton': KtProps<KtSkeleton>;
+            'kt-tooltip': KtProps<KtTooltip>;
+            'kt-toast': KtProps<KtToast, {
+                'kt-toast-close': never;
+            }>;
+            'kt-toast-container': KtProps<KtToastContainer>;
+            'kt-collapsible': KtProps<KtCollapsible, {
+                'kt-toggle': {
+                    open: boolean;
+                };
+            }>;
+            'kt-dropdown': KtProps<KtDropdown, {
+                'kt-select': {
+                    value: string | number;
+                };
+                'kt-open': never;
+                'kt-close': never;
+            }>;
+            'kt-modal': KtProps<KtModal, {
+                'kt-close': never;
+            }>;
+            'kt-side-panel': KtProps<KtSidePanel, {
+                'kt-close': never;
+            }>;
+            'kt-confirm-dialog': KtProps<KtConfirmDialog, {
+                'kt-confirm': never;
+                'kt-cancel': never;
+            }>;
+            'kt-chart': KtProps<KtChart, {
+                'kt-point-hover': {
+                    index: number;
+                    series: number;
+                };
+                'kt-series-toggle': {
+                    series: number;
+                    hidden: boolean;
+                };
+            }>;
+            'kt-table': KtProps<KtTable, {
+                'kt-sort-change': {
+                    key: string | null;
+                    direction: 'asc' | 'desc' | null;
+                };
+                'kt-selection-change': {
+                    selected: unknown[];
+                };
+                'kt-row-click': {
+                    index: number;
+                };
+                'kt-page-change': {
+                    page: number;
+                };
+            }>;
+            'kt-meter': KtProps<KtMeter>;
+            'kt-pagination': KtProps<KtPagination, {
+                'kt-page-change': {
+                    page: number;
+                };
+            }>;
+            'kt-stat': KtProps<KtStat>;
+            'kt-timeline': KtProps<KtTimeline>;
+            'kt-timeline-item': KtProps<KtTimelineItem>;
+        }
+    }
+}
+export {};

package/dist/react/jsx.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=jsx.js.map

package/dist/react/jsx.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jsx.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/strings/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * The copy Kanto's elements write themselves, and the way to translate it.
+ *
+ *     import { setStrings } from 'kanto-ds/strings';
+ *
+ *     setStrings({ clear: 'Effacer', noData: 'Aucune donnée' });
+ *
+ * A light entry point: it loads no element, so it can run before any of them.
+ * The same functions are exported from `kanto-ds`.
+ */
+export { defaultStrings, resetStrings, setStrings, strings as getStrings, type KtStrings, } from '#internal/strings';

package/dist/strings/index.js

@@ -0,0 +1,8 @@
+import { d as r, s as a, r as e, a as g } from "../chunks/index-fzPIgxe2.js";
+export {
+  r as defaultStrings,
+  a as getStrings,
+  e as resetStrings,
+  g as setStrings
+};
+//# sourceMappingURL=index.js.map

package/dist/strings/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/tokens/base.css

@@ -77,3 +77,56 @@ pre {
   outline: var(--outline-width) solid var(--color-primary-base);
   outline-offset: 2px;
 }
+
+/* Before its definition loads, a custom element is an unknown inline element:
+   its slotted text and icons show raw, unstyled, then jump into place. Hidden
+   instead — `visibility`, not `display`, so the page keeps its layout and does
+   not shift twice. Scoped to Kanto's own tags, never to every :not(:defined)
+   element on the page. */
+:is(
+  kt-alert,
+  kt-avatar,
+  kt-badge,
+  kt-breadcrumb,
+  kt-button,
+  kt-card,
+  kt-chart,
+  kt-code,
+  kt-collapsible,
+  kt-confirm-dialog,
+  kt-drag-drop,
+  kt-dropdown,
+  kt-empty-state,
+  kt-form,
+  kt-header,
+  kt-icon,
+  kt-input,
+  kt-input-menu,
+  kt-kbd,
+  kt-label-input,
+  kt-meter,
+  kt-modal,
+  kt-page-header,
+  kt-pagination,
+  kt-progress-bar,
+  kt-segmented-control,
+  kt-select,
+  kt-side-panel,
+  kt-skeleton,
+  kt-split-button,
+  kt-stat,
+  kt-sub-menu-navigation,
+  kt-table,
+  kt-tabs,
+  kt-textarea,
+  kt-timeline,
+  kt-timeline-item,
+  kt-toast,
+  kt-toast-container,
+  kt-toggle,
+  kt-toggle-button,
+  kt-toggle-button-group,
+  kt-tooltip
+):not(:defined) {
+  visibility: hidden;
+}