kanto-ds 1.3.0 → 1.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/dist/chunks/{defaults-DKzFsNbv.js → defaults-BwgjMcww.js} +27 -26
- package/dist/chunks/{defaults-DKzFsNbv.js.map → defaults-BwgjMcww.js.map} +1 -1
- package/dist/chunks/{index-fzPIgxe2.js → index-DSSLJirw.js} +17 -12
- package/dist/chunks/index-DSSLJirw.js.map +1 -0
- package/dist/chunks/{kt-element-mdd5cXZX.js → kt-element-E-tfJpGQ.js} +2 -2
- package/dist/chunks/{kt-element-mdd5cXZX.js.map → kt-element-E-tfJpGQ.js.map} +1 -1
- package/dist/components/core/kt-avatar/kt-avatar.js +2 -2
- package/dist/components/core/kt-badge/kt-badge.js +2 -2
- package/dist/components/core/kt-button/kt-button.js +1 -1
- package/dist/components/core/kt-card/kt-card.js +1 -1
- package/dist/components/core/kt-code/kt-code.js +2 -2
- package/dist/components/core/kt-icon/kt-icon.js +2 -2
- package/dist/components/core/kt-kbd/kt-kbd.js +1 -1
- package/dist/components/core/kt-split-button/kt-split-button.js +2 -2
- package/dist/components/data/kt-chart/kt-chart.js +51 -51
- package/dist/components/data/kt-chart/kt-chart.js.map +1 -1
- package/dist/components/data/kt-meter/kt-meter.js +1 -1
- package/dist/components/data/kt-pagination/kt-pagination.js +2 -2
- package/dist/components/data/kt-stat/kt-stat.js +1 -1
- package/dist/components/data/kt-table/kt-table.js +2 -2
- package/dist/components/data/kt-timeline/kt-timeline.js +1 -1
- package/dist/components/feedback/kt-alert/kt-alert.js +2 -2
- package/dist/components/feedback/kt-empty-state/kt-empty-state.js +1 -1
- package/dist/components/feedback/kt-progress-bar/kt-progress-bar.js +1 -1
- package/dist/components/feedback/kt-skeleton/kt-skeleton.js +1 -1
- package/dist/components/feedback/kt-toast/kt-toast.js +2 -2
- package/dist/components/feedback/kt-toast-container/kt-toast-container.js +1 -1
- package/dist/components/feedback/kt-tooltip/kt-tooltip.js +1 -1
- package/dist/components/forms/kt-checkbox/kt-checkbox.d.ts +66 -0
- package/dist/components/forms/kt-checkbox/kt-checkbox.js +198 -0
- package/dist/components/forms/kt-checkbox/kt-checkbox.js.map +1 -0
- package/dist/components/forms/kt-drag-drop/kt-drag-drop.js +2 -2
- package/dist/components/forms/kt-form/kt-form.js +11 -10
- package/dist/components/forms/kt-form/kt-form.js.map +1 -1
- package/dist/components/forms/kt-input/kt-input.js +2 -2
- package/dist/components/forms/kt-input-menu/kt-input-menu.js +2 -2
- package/dist/components/forms/kt-label-input/kt-label-input.js +1 -1
- package/dist/components/forms/kt-radio-group/kt-radio-group.d.ts +103 -0
- package/dist/components/forms/kt-radio-group/kt-radio-group.js +265 -0
- package/dist/components/forms/kt-radio-group/kt-radio-group.js.map +1 -0
- package/dist/components/forms/kt-select/kt-select.js +2 -2
- package/dist/components/forms/kt-textarea/kt-textarea.js +2 -2
- package/dist/components/forms/kt-toggle/kt-toggle.js +1 -1
- package/dist/components/navigation/kt-breadcrumb/kt-breadcrumb.js +2 -2
- package/dist/components/navigation/kt-header/kt-header.js +2 -2
- package/dist/components/navigation/kt-page-header/kt-page-header.js +1 -1
- package/dist/components/navigation/kt-segmented-control/kt-segmented-control.js +2 -2
- package/dist/components/navigation/kt-sub-menu-navigation/kt-sub-menu-navigation.js +2 -2
- package/dist/components/navigation/kt-tabs/kt-tabs.js +1 -1
- package/dist/components/navigation/kt-toggle-button/kt-toggle-button.js +1 -1
- package/dist/components/navigation/kt-toggle-button-group/kt-toggle-button-group.js +12 -6
- package/dist/components/navigation/kt-toggle-button-group/kt-toggle-button-group.js.map +1 -1
- package/dist/components/overlays/kt-collapsible/kt-collapsible.js +1 -1
- package/dist/components/overlays/kt-confirm-dialog/kt-confirm-dialog.js +2 -2
- package/dist/components/overlays/kt-dropdown/kt-dropdown.js +2 -2
- package/dist/components/overlays/kt-modal/kt-modal.js +2 -2
- package/dist/components/overlays/kt-side-panel/kt-side-panel.js +2 -2
- package/dist/custom-elements.json +1740 -941
- package/dist/icons/defaults.d.ts +1 -0
- package/dist/icons/index.js +1 -1
- package/dist/index.d.ts +4 -0
- package/dist/index.js +95 -90
- package/dist/index.js.map +1 -1
- package/dist/internal/strings.d.ts +10 -0
- package/dist/react/index.d.ts +13 -0
- package/dist/react/index.js +176 -157
- package/dist/react/index.js.map +1 -1
- package/dist/react/jsx.d.ts +12 -1
- package/dist/strings/index.js +1 -1
- package/dist/tokens/base.css +3 -0
- package/dist/vscode.css-custom-data.json +12 -0
- package/dist/vscode.html-custom-data.json +85 -0
- package/dist/vue/index.d.ts +6 -0
- package/dist/vue/index.js +9 -7
- package/dist/vue/index.js.map +1 -1
- package/dist/web-types.json +225 -1
- package/package.json +9 -1
- package/dist/chunks/index-fzPIgxe2.js.map +0 -1
package/README.md
CHANGED
|
@@ -100,12 +100,12 @@ Full details in **[src/tokens/README.md](src/tokens/README.md)**.
|
|
|
100
100
|
|
|
101
101
|
## Components
|
|
102
102
|
|
|
103
|
-
Forty-
|
|
103
|
+
Forty-four elements. Each has a page beside its source.
|
|
104
104
|
|
|
105
105
|
| Group | Elements |
|
|
106
106
|
| -------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
107
107
|
| **Core** | [button](src/components/core/kt-button/kt-button.md) · [split-button](src/components/core/kt-split-button/kt-split-button.md) · [card](src/components/core/kt-card/kt-card.md) · [code](src/components/core/kt-code/kt-code.md) · [icon](src/components/core/kt-icon/kt-icon.md) · [avatar](src/components/core/kt-avatar/kt-avatar.md) · [badge](src/components/core/kt-badge/kt-badge.md) · [kbd](src/components/core/kt-kbd/kt-kbd.md) |
|
|
108
|
-
| **Forms** | [input](src/components/forms/kt-input/kt-input.md) · [textarea](src/components/forms/kt-textarea/kt-textarea.md) · [label-input](src/components/forms/kt-label-input/kt-label-input.md) · [form](src/components/forms/kt-form/kt-form.md) · [select](src/components/forms/kt-select/kt-select.md) · [input-menu](src/components/forms/kt-input-menu/kt-input-menu.md) · [toggle](src/components/forms/kt-toggle/kt-toggle.md) · [drag-drop](src/components/forms/kt-drag-drop/kt-drag-drop.md)
|
|
108
|
+
| **Forms** | [input](src/components/forms/kt-input/kt-input.md) · [textarea](src/components/forms/kt-textarea/kt-textarea.md) · [label-input](src/components/forms/kt-label-input/kt-label-input.md) · [form](src/components/forms/kt-form/kt-form.md) · [select](src/components/forms/kt-select/kt-select.md) · [checkbox](src/components/forms/kt-checkbox/kt-checkbox.md) · [radio-group](src/components/forms/kt-radio-group/kt-radio-group.md) · [input-menu](src/components/forms/kt-input-menu/kt-input-menu.md) · [toggle](src/components/forms/kt-toggle/kt-toggle.md) · [drag-drop](src/components/forms/kt-drag-drop/kt-drag-drop.md) |
|
|
109
109
|
| **Navigation** | [header](src/components/navigation/kt-header/kt-header.md) · [breadcrumb](src/components/navigation/kt-breadcrumb/kt-breadcrumb.md) · [sub-menu-navigation](src/components/navigation/kt-sub-menu-navigation/kt-sub-menu-navigation.md) · [page-header](src/components/navigation/kt-page-header/kt-page-header.md) · [tabs](src/components/navigation/kt-tabs/kt-tabs.md) · [segmented-control](src/components/navigation/kt-segmented-control/kt-segmented-control.md) · [toggle-button](src/components/navigation/kt-toggle-button/kt-toggle-button.md) · [toggle-button-group](src/components/navigation/kt-toggle-button-group/kt-toggle-button-group.md) |
|
|
110
110
|
| **Feedback** | [progress-bar](src/components/feedback/kt-progress-bar/kt-progress-bar.md) · [skeleton](src/components/feedback/kt-skeleton/kt-skeleton.md) · [tooltip](src/components/feedback/kt-tooltip/kt-tooltip.md) · [toast](src/components/feedback/kt-toast/kt-toast.md) · [toast-container + toaster](src/components/feedback/kt-toast-container/kt-toast-container.md) · [alert](src/components/feedback/kt-alert/kt-alert.md) · [empty-state](src/components/feedback/kt-empty-state/kt-empty-state.md) |
|
|
111
111
|
| **Overlays** | [dropdown](src/components/overlays/kt-dropdown/kt-dropdown.md) · [side-panel](src/components/overlays/kt-side-panel/kt-side-panel.md) · [confirm-dialog](src/components/overlays/kt-confirm-dialog/kt-confirm-dialog.md) · [modal](src/components/overlays/kt-modal/kt-modal.md) · [collapsible](src/components/overlays/kt-collapsible/kt-collapsible.md) |
|
|
@@ -121,7 +121,7 @@ import 'kanto-ds/components/core/kt-button'; // just this one
|
|
|
121
121
|
## Icons
|
|
122
122
|
|
|
123
123
|
`<kt-icon>` resolves [Lucide](https://lucide.dev) icons by name at render time,
|
|
124
|
-
which means the set cannot be tree-shaken. So Kanto ships only the
|
|
124
|
+
which means the set cannot be tree-shaken. So Kanto ships only the 23 its own
|
|
125
125
|
elements draw. Register what your application uses:
|
|
126
126
|
|
|
127
127
|
```js
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { X as s, User as a, TriangleAlert as c, Trash2 as i, Search as f,
|
|
1
|
+
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 y, FileUp as A, File as C, EyeOff as l, 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, ArrowUp as k, ArrowDown as m } from "lucide";
|
|
2
2
|
const n = /* @__PURE__ */ new Map();
|
|
3
3
|
function t(e) {
|
|
4
4
|
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();
|
|
5
5
|
}
|
|
6
|
-
function
|
|
6
|
+
function z(e, r) {
|
|
7
7
|
n.set(t(e), r);
|
|
8
8
|
}
|
|
9
|
-
function
|
|
9
|
+
function L(e) {
|
|
10
10
|
for (const [r, o] of Object.entries(e))
|
|
11
|
-
|
|
11
|
+
M(o) && z(r, o);
|
|
12
12
|
}
|
|
13
13
|
function E(e) {
|
|
14
14
|
return n.get(t(e));
|
|
@@ -16,42 +16,43 @@ function E(e) {
|
|
|
16
16
|
function F() {
|
|
17
17
|
return [...n.keys()].sort();
|
|
18
18
|
}
|
|
19
|
-
function
|
|
19
|
+
function M(e) {
|
|
20
20
|
return Array.isArray(e) && e.every(
|
|
21
21
|
(r) => Array.isArray(r) && typeof r[0] == "string" && typeof r[1] == "object" && r[1] !== null
|
|
22
22
|
);
|
|
23
23
|
}
|
|
24
24
|
const j = {
|
|
25
|
-
ArrowDown:
|
|
26
|
-
ArrowUp:
|
|
27
|
-
Check:
|
|
28
|
-
ChevronDown:
|
|
29
|
-
ChevronLeft:
|
|
30
|
-
ChevronRight:
|
|
31
|
-
ChevronUp:
|
|
32
|
-
CircleAlert:
|
|
33
|
-
CircleCheck:
|
|
34
|
-
Copy:
|
|
35
|
-
Eye:
|
|
36
|
-
EyeOff:
|
|
37
|
-
File:
|
|
38
|
-
FileUp:
|
|
39
|
-
Info:
|
|
40
|
-
LoaderCircle:
|
|
41
|
-
Menu:
|
|
25
|
+
ArrowDown: m,
|
|
26
|
+
ArrowUp: k,
|
|
27
|
+
Check: Z,
|
|
28
|
+
ChevronDown: U,
|
|
29
|
+
ChevronLeft: v,
|
|
30
|
+
ChevronRight: d,
|
|
31
|
+
ChevronUp: b,
|
|
32
|
+
CircleAlert: $,
|
|
33
|
+
CircleCheck: w,
|
|
34
|
+
Copy: h,
|
|
35
|
+
Eye: I,
|
|
36
|
+
EyeOff: l,
|
|
37
|
+
File: C,
|
|
38
|
+
FileUp: A,
|
|
39
|
+
Info: y,
|
|
40
|
+
LoaderCircle: u,
|
|
41
|
+
Menu: p,
|
|
42
|
+
Minus: g,
|
|
42
43
|
Search: f,
|
|
43
44
|
Trash2: i,
|
|
44
45
|
TriangleAlert: c,
|
|
45
46
|
User: a,
|
|
46
47
|
X: s
|
|
47
48
|
};
|
|
48
|
-
|
|
49
|
+
L(j);
|
|
49
50
|
export {
|
|
50
|
-
|
|
51
|
+
L as a,
|
|
51
52
|
F as b,
|
|
52
53
|
j as d,
|
|
53
54
|
E as g,
|
|
54
|
-
|
|
55
|
+
z as r,
|
|
55
56
|
t
|
|
56
57
|
};
|
|
57
|
-
//# sourceMappingURL=defaults-
|
|
58
|
+
//# sourceMappingURL=defaults-BwgjMcww.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defaults-
|
|
1
|
+
{"version":3,"file":"defaults-BwgjMcww.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 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 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","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;ACrCO,MAAMC,IAAe;AAAA,EAC1B,WAAAC;AAAA,EACA,SAAAC;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;AAEA9B,EAAcO,CAAY;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const
|
|
1
|
+
const i = Object.freeze({
|
|
2
2
|
clear: "Clear",
|
|
3
3
|
close: "Close",
|
|
4
4
|
dismiss: "Dismiss",
|
|
@@ -27,6 +27,7 @@ const t = Object.freeze({
|
|
|
27
27
|
required: "This field is required.",
|
|
28
28
|
selectOption: "Select an option.",
|
|
29
29
|
selectFile: "Select a file.",
|
|
30
|
+
checkRequired: "Check this box to continue.",
|
|
30
31
|
openMenu: "Open menu",
|
|
31
32
|
closeMenu: "Close menu",
|
|
32
33
|
breadcrumb: "Breadcrumb",
|
|
@@ -36,6 +37,8 @@ const t = Object.freeze({
|
|
|
36
37
|
next: "Next",
|
|
37
38
|
pageOf: (e, o) => `Page ${e} / ${o}`,
|
|
38
39
|
moreActions: "More actions",
|
|
40
|
+
options: "Options",
|
|
41
|
+
formSection: "Form section",
|
|
39
42
|
selectRow: "Select row",
|
|
40
43
|
selectAll: "Select all",
|
|
41
44
|
total: "Total",
|
|
@@ -43,32 +46,34 @@ const t = Object.freeze({
|
|
|
43
46
|
chartPoint: "Point",
|
|
44
47
|
chartSlice: "Slice",
|
|
45
48
|
chartShare: "Share",
|
|
49
|
+
chartData: "Chart data",
|
|
50
|
+
chartValue: "Value",
|
|
46
51
|
confirmHeading: "Are you sure?",
|
|
47
52
|
confirm: "Confirm",
|
|
48
53
|
cancel: "Cancel",
|
|
49
54
|
details: "Details",
|
|
50
55
|
avatar: "Avatar"
|
|
51
56
|
});
|
|
52
|
-
let
|
|
53
|
-
const
|
|
57
|
+
let t = { ...i };
|
|
58
|
+
const n = /* @__PURE__ */ new Set();
|
|
54
59
|
function r() {
|
|
55
|
-
return
|
|
60
|
+
return t;
|
|
56
61
|
}
|
|
57
|
-
function
|
|
58
|
-
|
|
59
|
-
for (const o of
|
|
62
|
+
function s(e) {
|
|
63
|
+
t = { ...t, ...e };
|
|
64
|
+
for (const o of n) o();
|
|
60
65
|
}
|
|
61
66
|
function a() {
|
|
62
|
-
i
|
|
67
|
+
s(i);
|
|
63
68
|
}
|
|
64
69
|
function c(e) {
|
|
65
|
-
return
|
|
70
|
+
return n.add(e), () => n.delete(e);
|
|
66
71
|
}
|
|
67
72
|
export {
|
|
68
|
-
|
|
69
|
-
|
|
73
|
+
s as a,
|
|
74
|
+
i as d,
|
|
70
75
|
c as o,
|
|
71
76
|
a as r,
|
|
72
77
|
r as s
|
|
73
78
|
};
|
|
74
|
-
//# sourceMappingURL=index-
|
|
79
|
+
//# sourceMappingURL=index-DSSLJirw.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-DSSLJirw.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\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\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\n required: 'This field is required.',\n selectOption: 'Select an option.',\n selectFile: 'Select a file.',\n checkRequired: 'Check this box to continue.',\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","page","total","current","listeners","strings","setStrings","overrides","listener","resetStrings","onStringsChange"],"mappings":"AA8GO,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,EAEf,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,eAAe;AAAA,EAEf,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,GAAGN,EAAA;AAC9B,MAAMO,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,EAAWT,CAAc;AAC3B;AAGO,SAASa,EAAgBF,GAAkC;AAChE,SAAAJ,EAAU,IAAII,CAAQ,GACf,MAAMJ,EAAU,OAAOI,CAAQ;AACxC;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { LitElement as n, css as i } from "lit";
|
|
2
|
-
import { o } from "./index-
|
|
2
|
+
import { o } from "./index-DSSLJirw.js";
|
|
3
3
|
const t = "kt-strings";
|
|
4
4
|
class c extends n {
|
|
5
5
|
static {
|
|
@@ -49,4 +49,4 @@ export {
|
|
|
49
49
|
c as K,
|
|
50
50
|
d
|
|
51
51
|
};
|
|
52
|
-
//# sourceMappingURL=kt-element-
|
|
52
|
+
//# sourceMappingURL=kt-element-E-tfJpGQ.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kt-element-
|
|
1
|
+
{"version":3,"file":"kt-element-E-tfJpGQ.js","sources":["../../src/internal/kt-element.ts"],"sourcesContent":["import { LitElement, css, type CSSResultGroup, type PropertyValues } from 'lit';\nimport { onStringsChange } from './strings.js';\n\n/**\n * The key a `setStrings` call marks in `changedProperties`, so an element can\n * recompute copy it caches outside `render()` — a validation message.\n */\nconst STRINGS_CHANGED = 'kt-strings';\n\n/**\n * Base class for every Kanto element.\n *\n * It exists for two reasons. First, `box-sizing: border-box` does not cross a\n * shadow boundary, so each root has to re-establish it. Second, `[hidden]`\n * loses to a `:host { display: flex }` rule inside the shadow root, and every\n * element in this system sets its own display — without the override here,\n * hiding a Kanto element from the outside silently does nothing.\n */\nexport class KtElement extends LitElement {\n static override styles: CSSResultGroup = css`\n :host {\n box-sizing: border-box;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n\n *,\n *::before,\n *::after {\n box-sizing: inherit;\n }\n\n /* Read by assistive technology, never drawn. */\n .visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n }\n `;\n\n private unsubscribeStrings: (() => void) | undefined;\n\n override connectedCallback(): void {\n super.connectedCallback();\n // Copy comes from the strings registry at render time; follow it when an\n // application switches language.\n // A fresh old value, because Lit skips a named update whose value did not\n // change — and 'kt-strings' is not a property, so it is always undefined.\n this.unsubscribeStrings = onStringsChange(() =>\n this.requestUpdate(STRINGS_CHANGED, Symbol('previous strings')),\n );\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.unsubscribeStrings?.();\n this.unsubscribeStrings = undefined;\n }\n\n /** True when this update was triggered by `setStrings`. */\n protected stringsChanged(changed: PropertyValues): boolean {\n return changed.has(STRINGS_CHANGED);\n }\n}\n\n/**\n * Registers a custom element, tolerating a repeat call.\n *\n * A design system gets loaded twice more often than you would like — two\n * versions in one dependency tree, a dev-server hot reload, a micro-frontend\n * mounting a second copy. `customElements.define` throws on a duplicate tag\n * and would take the whole page down with it.\n */\nexport function defineElement(tag: string, ctor: CustomElementConstructor): void {\n if (customElements.get(tag)) return;\n customElements.define(tag, ctor);\n}\n"],"names":["STRINGS_CHANGED","KtElement","LitElement","css","onStringsChange","changed","defineElement","tag","ctor"],"mappings":";;AAOA,MAAMA,IAAkB;AAWjB,MAAMC,UAAkBC,EAAW;AAAA,EACxC,OAAA;AAAA,SAAgB,SAAyBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAAA,EA4BhC,oBAA0B;AACjC,UAAM,kBAAA,GAKN,KAAK,qBAAqBC;AAAA,MAAgB,MACxC,KAAK,cAAcJ,GAAiB,uBAAO,kBAAkB,CAAC;AAAA,IAAA;AAAA,EAElE;AAAA,EAES,uBAA6B;AACpC,UAAM,qBAAA,GACN,KAAK,qBAAA,GACL,KAAK,qBAAqB;AAAA,EAC5B;AAAA;AAAA,EAGU,eAAeK,GAAkC;AACzD,WAAOA,EAAQ,IAAIL,CAAe;AAAA,EACpC;AACF;AAUO,SAASM,EAAcC,GAAaC,GAAsC;AAC/E,EAAI,eAAe,IAAID,CAAG,KAC1B,eAAe,OAAOA,GAAKC,CAAI;AACjC;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { css as p, nothing as f, html as n } from "lit";
|
|
2
2
|
import { state as v, property as o } from "lit/decorators.js";
|
|
3
3
|
import { classMap as c } from "lit/directives/class-map.js";
|
|
4
|
-
import { K as d, d as g } from "../../../chunks/kt-element-
|
|
5
|
-
import { s as m } from "../../../chunks/index-
|
|
4
|
+
import { K as d, d as g } from "../../../chunks/kt-element-E-tfJpGQ.js";
|
|
5
|
+
import { s as m } from "../../../chunks/index-DSSLJirw.js";
|
|
6
6
|
import "../kt-icon/kt-icon.js";
|
|
7
7
|
var y = Object.defineProperty, s = (a, e, t, k) => {
|
|
8
8
|
for (var i = void 0, l = a.length - 1, h; l >= 0; l--)
|
|
@@ -2,9 +2,9 @@ import { css as h, nothing as n, html as l } from "lit";
|
|
|
2
2
|
import { property as e } from "lit/decorators.js";
|
|
3
3
|
import { classMap as b } from "lit/directives/class-map.js";
|
|
4
4
|
import { styleMap as m } from "lit/directives/style-map.js";
|
|
5
|
-
import { K as p, d as v } from "../../../chunks/kt-element-
|
|
5
|
+
import { K as p, d as v } from "../../../chunks/kt-element-E-tfJpGQ.js";
|
|
6
6
|
import { e as u } from "../../../chunks/events-Bjl5Zmmq.js";
|
|
7
|
-
import { s as g } from "../../../chunks/index-
|
|
7
|
+
import { s as g } from "../../../chunks/index-DSSLJirw.js";
|
|
8
8
|
import "../kt-icon/kt-icon.js";
|
|
9
9
|
var f = Object.defineProperty, t = (s, r, i, y) => {
|
|
10
10
|
for (var a = void 0, c = s.length - 1, d; c >= 0; c--)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { css as h, html as d, nothing as i } from "lit";
|
|
2
2
|
import { property as e } from "lit/decorators.js";
|
|
3
3
|
import { classMap as p } from "lit/directives/class-map.js";
|
|
4
|
-
import { K as u, d as v } from "../../../chunks/kt-element-
|
|
4
|
+
import { K as u, d as v } from "../../../chunks/kt-element-E-tfJpGQ.js";
|
|
5
5
|
import "../kt-icon/kt-icon.js";
|
|
6
6
|
var g = Object.defineProperty, a = (l, t, o, y) => {
|
|
7
7
|
for (var n = void 0, c = l.length - 1, s; c >= 0; c--)
|
|
@@ -2,7 +2,7 @@ import { css as f, nothing as r, html as d } from "lit";
|
|
|
2
2
|
import { state as g, property as a } from "lit/decorators.js";
|
|
3
3
|
import { classMap as n } from "lit/directives/class-map.js";
|
|
4
4
|
import { styleMap as u } from "lit/directives/style-map.js";
|
|
5
|
-
import { K as m, d as v } from "../../../chunks/kt-element-
|
|
5
|
+
import { K as m, d as v } from "../../../chunks/kt-element-E-tfJpGQ.js";
|
|
6
6
|
import { e as b } from "../../../chunks/events-Bjl5Zmmq.js";
|
|
7
7
|
import { h as p } from "../../../chunks/slots-BPbIdxAJ.js";
|
|
8
8
|
var y = Object.defineProperty, i = (s, e, c, k) => {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { css as b, nothing as s, html as d } from "lit";
|
|
2
2
|
import { state as m, property as c } from "lit/decorators.js";
|
|
3
|
-
import { K as h, d as v } from "../../../chunks/kt-element-
|
|
3
|
+
import { K as h, d as v } from "../../../chunks/kt-element-E-tfJpGQ.js";
|
|
4
4
|
import { e as g } from "../../../chunks/events-Bjl5Zmmq.js";
|
|
5
|
-
import { s as r } from "../../../chunks/index-
|
|
5
|
+
import { s as r } from "../../../chunks/index-DSSLJirw.js";
|
|
6
6
|
import "../kt-icon/kt-icon.js";
|
|
7
7
|
var y = Object.defineProperty, a = (p, o, n, x) => {
|
|
8
8
|
for (var e = void 0, i = p.length - 1, l; i >= 0; i--)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { css as f, html as c, nothing as l } from "lit";
|
|
2
2
|
import { property as n } from "lit/decorators.js";
|
|
3
|
-
import { K as m, d as u } from "../../../chunks/kt-element-
|
|
4
|
-
import { g as v } from "../../../chunks/defaults-
|
|
3
|
+
import { K as m, d as u } from "../../../chunks/kt-element-E-tfJpGQ.js";
|
|
4
|
+
import { g as v } from "../../../chunks/defaults-BwgjMcww.js";
|
|
5
5
|
var w = Object.defineProperty, o = (i, e, r, h) => {
|
|
6
6
|
for (var t = void 0, a = i.length - 1, d; a >= 0; a--)
|
|
7
7
|
(d = i[a]) && (t = d(e, r, t) || t);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { css as c, html as i } from "lit";
|
|
2
2
|
import { property as p } from "lit/decorators.js";
|
|
3
|
-
import { K as l, d as m } from "../../../chunks/kt-element-
|
|
3
|
+
import { K as l, d as m } from "../../../chunks/kt-element-E-tfJpGQ.js";
|
|
4
4
|
var f = Object.defineProperty, d = (a, t, e, u) => {
|
|
5
5
|
for (var r = void 0, s = a.length - 1, o; s >= 0; s--)
|
|
6
6
|
(o = a[s]) && (r = o(t, e, r) || r);
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { css as g, nothing as p, html as a } from "lit";
|
|
2
2
|
import { query as f, state as y, property as o } from "lit/decorators.js";
|
|
3
3
|
import { classMap as w } from "lit/directives/class-map.js";
|
|
4
|
-
import { K as h, d as x } from "../../../chunks/kt-element-
|
|
4
|
+
import { K as h, d as x } from "../../../chunks/kt-element-E-tfJpGQ.js";
|
|
5
5
|
import { e as k } from "../../../chunks/events-Bjl5Zmmq.js";
|
|
6
6
|
import { f as m, o as $, l as I, n as u } from "../../../chunks/listbox-Sm3nvsC6.js";
|
|
7
|
-
import { s as v } from "../../../chunks/index-
|
|
7
|
+
import { s as v } from "../../../chunks/index-DSSLJirw.js";
|
|
8
8
|
import "../kt-button/kt-button.js";
|
|
9
9
|
import "../kt-icon/kt-icon.js";
|
|
10
10
|
import "../../overlays/kt-dropdown/kt-dropdown.js";
|