@cloudflare/kumo 2.0.2 → 2.0.3
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/CHANGELOG.md +19 -0
- package/ai/component-registry.json +17 -3
- package/ai/component-registry.md +34 -4
- package/ai/schemas.ts +5 -2
- package/dist/.build-complete +1 -1
- package/dist/ai/schemas.d.ts +10 -4
- package/dist/ai/schemas.d.ts.map +1 -1
- package/dist/ai/schemas.js +510 -504
- package/dist/ai/schemas.js.map +1 -1
- package/dist/chunks/{autocomplete-48aq0d244bs2e8zv.js → autocomplete-ln55iimq2n2s5uex.js} +27 -26
- package/dist/chunks/autocomplete-ln55iimq2n2s5uex.js.map +1 -0
- package/dist/chunks/{badge-dan90i0rzy4pwa1j.js → badge-kqox9toi0sygfbno.js} +16 -16
- package/dist/chunks/badge-kqox9toi0sygfbno.js.map +1 -0
- package/dist/chunks/{banner-eiwcnk7ts21s3bnb.js → banner-eux4y8xaogjg64af.js} +32 -31
- package/dist/chunks/banner-eux4y8xaogjg64af.js.map +1 -0
- package/dist/chunks/{breadcrumbs-cxcwf2l1ki3ffg5d.js → breadcrumbs-do6uyvm4msqus0sz.js} +33 -32
- package/dist/chunks/breadcrumbs-do6uyvm4msqus0sz.js.map +1 -0
- package/dist/chunks/{button-6by9ntsa3nj553mq.js → button-dh366jtvswxj0fw3.js} +63 -62
- package/dist/chunks/button-dh366jtvswxj0fw3.js.map +1 -0
- package/dist/chunks/{checkbox-hvxfvhtx1qjo2mww.js → checkbox-cf2pwdupyjweg184.js} +2 -2
- package/dist/chunks/checkbox-cf2pwdupyjweg184.js.map +1 -0
- package/dist/chunks/{clipboard-text-hswydzx3iql369sd.js → clipboard-text-hn2uwdj4ozenezd5.js} +57 -56
- package/dist/chunks/clipboard-text-hn2uwdj4ozenezd5.js.map +1 -0
- package/dist/chunks/{code-f9v1ikwhekqw274q.js → code-bbnjm8vk9hxl129r.js} +20 -19
- package/dist/chunks/code-bbnjm8vk9hxl129r.js.map +1 -0
- package/dist/chunks/{combobox-fq36ye0hstote16x.js → combobox-fivcg1oorkmmmk78.js} +11 -10
- package/dist/chunks/combobox-fivcg1oorkmmmk78.js.map +1 -0
- package/dist/chunks/{command-palette-md65owxt5hv4rt9r.js → command-palette-kgiso245exdons4r.js} +2 -2
- package/dist/chunks/{command-palette-md65owxt5hv4rt9r.js.map → command-palette-kgiso245exdons4r.js.map} +1 -1
- package/dist/chunks/{dialog-k3f1fbam6nt96k8x.js → dialog-mqpvaidy0vnjwrfp.js} +16 -15
- package/dist/chunks/dialog-mqpvaidy0vnjwrfp.js.map +1 -0
- package/dist/chunks/{dropdown-zbax0zowy6m9zhmt.js → dropdown-gp5iptj1niq14lpv.js} +76 -75
- package/dist/chunks/dropdown-gp5iptj1niq14lpv.js.map +1 -0
- package/dist/chunks/{empty-b82oer7npkhtkx7k.js → empty-fr78te81o3qaj3in.js} +27 -26
- package/dist/chunks/empty-fr78te81o3qaj3in.js.map +1 -0
- package/dist/chunks/{field-c0wf94plit2gci59.js → field-dgf36p7cmz1crlnu.js} +2 -2
- package/dist/chunks/{field-c0wf94plit2gci59.js.map → field-dgf36p7cmz1crlnu.js.map} +1 -1
- package/dist/chunks/{grid-hj1ylz16p7g5uelh.js → grid-do93dv1rjggqxx7p.js} +30 -29
- package/dist/chunks/grid-do93dv1rjggqxx7p.js.map +1 -0
- package/dist/chunks/{input-ncfowphv81yq7fyy.js → input-2y9vg81trmamkb6k.js} +51 -50
- package/dist/chunks/input-2y9vg81trmamkb6k.js.map +1 -0
- package/dist/chunks/{input-area-bkyzu6f7gsck479h.js → input-area-i5wulip5pau3u6ss.js} +3 -3
- package/dist/chunks/{input-area-bkyzu6f7gsck479h.js.map → input-area-i5wulip5pau3u6ss.js.map} +1 -1
- package/dist/chunks/{input-group-bidweffa0zyg8gt0.js → input-group-bm9wxzovpvzn1c25.js} +4 -4
- package/dist/chunks/{input-group-bidweffa0zyg8gt0.js.map → input-group-bm9wxzovpvzn1c25.js.map} +1 -1
- package/dist/chunks/{label-c3h9i3y4wiccelt7.js → label-efa0uvb8zqyjwpc8.js} +2 -2
- package/dist/chunks/{label-c3h9i3y4wiccelt7.js.map → label-efa0uvb8zqyjwpc8.js.map} +1 -1
- package/dist/chunks/{link-kt74pxkud4olmcer.js → link-m9hlspftl34nseme.js} +28 -27
- package/dist/chunks/link-m9hlspftl34nseme.js.map +1 -0
- package/dist/chunks/{loader-hr2w7cpqeev3p3vl.js → loader-g8a6j76ue5nq0lr8.js} +15 -14
- package/dist/chunks/loader-g8a6j76ue5nq0lr8.js.map +1 -0
- package/dist/chunks/{pagination-jb3mncivbwsoi1se.js → pagination-fdmcwreb27eej9l3.js} +3 -3
- package/dist/chunks/pagination-fdmcwreb27eej9l3.js.map +1 -0
- package/dist/chunks/{radio-datzh3pilz8ojak1.js → radio-f95mt237ru8fyc03.js} +44 -43
- package/dist/chunks/radio-f95mt237ru8fyc03.js.map +1 -0
- package/dist/chunks/resolve-variant-gw6eh7fa4st8ej7m.js +11 -0
- package/dist/chunks/resolve-variant-gw6eh7fa4st8ej7m.js.map +1 -0
- package/dist/chunks/{select-g261chvosodu22i8.js → select-j8evv2iblgs5fa9s.js} +4 -4
- package/dist/chunks/{select-g261chvosodu22i8.js.map → select-j8evv2iblgs5fa9s.js.map} +1 -1
- package/dist/chunks/{sensitive-input-cijagk551mesdtk4.js → sensitive-input-cmb9jt42bv8jftei.js} +3 -3
- package/dist/chunks/{sensitive-input-cijagk551mesdtk4.js.map → sensitive-input-cmb9jt42bv8jftei.js.map} +1 -1
- package/dist/chunks/surface-k0e8mq1x00b7i8r6.js.map +1 -1
- package/dist/chunks/{switch-jdfsr3j3oa1qxegw.js → switch-c4qjga6x3axmoi20.js} +2 -2
- package/dist/chunks/switch-c4qjga6x3axmoi20.js.map +1 -0
- package/dist/chunks/{table-iudje0lva0z68jto.js → table-jvqy3tu48xa75n2t.js} +56 -55
- package/dist/chunks/table-jvqy3tu48xa75n2t.js.map +1 -0
- package/dist/chunks/{text-f7t467waymhb30sx.js → text-be7ehenoyldhyjma.js} +32 -28
- package/dist/chunks/text-be7ehenoyldhyjma.js.map +1 -0
- package/dist/chunks/{toast-h573o0tc7tefivk2.js → toast-c7kqwuj7qj9dx6gs.js} +75 -74
- package/dist/chunks/toast-c7kqwuj7qj9dx6gs.js.map +1 -0
- package/dist/chunks/tooltip-odudhkxe282wxinq.js.map +1 -1
- package/dist/code.js +1 -1
- package/dist/components/autocomplete.js +1 -1
- package/dist/components/badge.js +1 -1
- package/dist/components/banner.js +1 -1
- package/dist/components/breadcrumbs.js +1 -1
- package/dist/components/button.js +1 -1
- package/dist/components/checkbox.js +1 -1
- package/dist/components/clipboard-text.js +1 -1
- package/dist/components/code.js +1 -1
- package/dist/components/combobox.js +1 -1
- package/dist/components/command-palette.js +1 -1
- package/dist/components/dialog.js +1 -1
- package/dist/components/dropdown.js +1 -1
- package/dist/components/empty.js +1 -1
- package/dist/components/field.js +1 -1
- package/dist/components/grid.js +1 -1
- package/dist/components/input-group.js +1 -1
- package/dist/components/input.js +3 -3
- package/dist/components/label.js +1 -1
- package/dist/components/link.js +1 -1
- package/dist/components/loader.js +1 -1
- package/dist/components/pagination.js +1 -1
- package/dist/components/radio.js +1 -1
- package/dist/components/select.js +1 -1
- package/dist/components/sensitive-input.js +1 -1
- package/dist/components/switch.js +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/text.js +1 -1
- package/dist/components/toast.js +1 -1
- package/dist/index.js +33 -33
- package/dist/src/components/autocomplete/autocomplete.d.ts.map +1 -1
- package/dist/src/components/badge/badge.d.ts.map +1 -1
- package/dist/src/components/banner/banner.d.ts.map +1 -1
- package/dist/src/components/breadcrumbs/breadcrumbs.d.ts.map +1 -1
- package/dist/src/components/button/button.d.ts.map +1 -1
- package/dist/src/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/src/components/clipboard-text/clipboard-text.d.ts.map +1 -1
- package/dist/src/components/code/code.d.ts.map +1 -1
- package/dist/src/components/combobox/combobox.d.ts.map +1 -1
- package/dist/src/components/dialog/dialog.d.ts.map +1 -1
- package/dist/src/components/dropdown/dropdown.d.ts.map +1 -1
- package/dist/src/components/empty/empty.d.ts.map +1 -1
- package/dist/src/components/grid/grid.d.ts.map +1 -1
- package/dist/src/components/input/input.d.ts.map +1 -1
- package/dist/src/components/link/link.d.ts.map +1 -1
- package/dist/src/components/loader/loader.d.ts.map +1 -1
- package/dist/src/components/pagination/pagination.d.ts.map +1 -1
- package/dist/src/components/radio/radio.d.ts.map +1 -1
- package/dist/src/components/surface/surface.d.ts.map +1 -1
- package/dist/src/components/switch/switch.d.ts.map +1 -1
- package/dist/src/components/table/table.d.ts.map +1 -1
- package/dist/src/components/text/text.d.ts.map +1 -1
- package/dist/src/components/toast/toast.d.ts.map +1 -1
- package/dist/src/components/tooltip/tooltip.d.ts.map +1 -1
- package/dist/src/utils/resolve-variant.d.ts +27 -0
- package/dist/src/utils/resolve-variant.d.ts.map +1 -0
- package/package.json +1 -1
- package/scripts/component-registry/metadata.ts +18 -3
- package/dist/chunks/autocomplete-48aq0d244bs2e8zv.js.map +0 -1
- package/dist/chunks/badge-dan90i0rzy4pwa1j.js.map +0 -1
- package/dist/chunks/banner-eiwcnk7ts21s3bnb.js.map +0 -1
- package/dist/chunks/breadcrumbs-cxcwf2l1ki3ffg5d.js.map +0 -1
- package/dist/chunks/button-6by9ntsa3nj553mq.js.map +0 -1
- package/dist/chunks/checkbox-hvxfvhtx1qjo2mww.js.map +0 -1
- package/dist/chunks/clipboard-text-hswydzx3iql369sd.js.map +0 -1
- package/dist/chunks/code-f9v1ikwhekqw274q.js.map +0 -1
- package/dist/chunks/combobox-fq36ye0hstote16x.js.map +0 -1
- package/dist/chunks/dialog-k3f1fbam6nt96k8x.js.map +0 -1
- package/dist/chunks/dropdown-zbax0zowy6m9zhmt.js.map +0 -1
- package/dist/chunks/empty-b82oer7npkhtkx7k.js.map +0 -1
- package/dist/chunks/grid-hj1ylz16p7g5uelh.js.map +0 -1
- package/dist/chunks/input-ncfowphv81yq7fyy.js.map +0 -1
- package/dist/chunks/link-kt74pxkud4olmcer.js.map +0 -1
- package/dist/chunks/loader-hr2w7cpqeev3p3vl.js.map +0 -1
- package/dist/chunks/pagination-jb3mncivbwsoi1se.js.map +0 -1
- package/dist/chunks/radio-datzh3pilz8ojak1.js.map +0 -1
- package/dist/chunks/switch-jdfsr3j3oa1qxegw.js.map +0 -1
- package/dist/chunks/table-iudje0lva0z68jto.js.map +0 -1
- package/dist/chunks/text-f7t467waymhb30sx.js.map +0 -1
- package/dist/chunks/toast-h573o0tc7tefivk2.js.map +0 -1
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as
|
|
2
|
+
import { jsxs as p, jsx as e } from "react/jsx-runtime";
|
|
3
3
|
import { forwardRef as k } from "react";
|
|
4
|
-
import { c as
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
|
|
4
|
+
import { c as i } from "./cn-ct4n7r74mh8y0f48.js";
|
|
5
|
+
import { r as f } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
|
|
6
|
+
import { u as L } from "./link-provider-mn2voeohon7cj9o4.js";
|
|
7
|
+
import { aU as x, aV as h } from "./vendor-base-ui-ie71jahf0czyf58j.js";
|
|
8
|
+
const r = (n) => /* @__PURE__ */ p(
|
|
8
9
|
"svg",
|
|
9
10
|
{
|
|
10
11
|
width: "1em",
|
|
@@ -23,8 +24,8 @@ const i = (n) => /* @__PURE__ */ d(
|
|
|
23
24
|
]
|
|
24
25
|
}
|
|
25
26
|
);
|
|
26
|
-
|
|
27
|
-
const
|
|
27
|
+
r.displayName = "Link.ExternalIcon";
|
|
28
|
+
const C = {
|
|
28
29
|
variant: {
|
|
29
30
|
inline: {
|
|
30
31
|
classes: (
|
|
@@ -45,35 +46,35 @@ const x = {
|
|
|
45
46
|
description: "Link without underline decoration"
|
|
46
47
|
}
|
|
47
48
|
}
|
|
48
|
-
},
|
|
49
|
+
}, t = {
|
|
49
50
|
variant: "inline"
|
|
50
51
|
};
|
|
51
|
-
function
|
|
52
|
-
variant: n =
|
|
52
|
+
function v({
|
|
53
|
+
variant: n = t.variant
|
|
53
54
|
} = {}) {
|
|
54
|
-
return
|
|
55
|
+
return i(f(C.variant, n, t.variant).classes);
|
|
55
56
|
}
|
|
56
|
-
const
|
|
57
|
-
const
|
|
58
|
-
className:
|
|
59
|
-
|
|
57
|
+
const o = k(function({ className: s, variant: a = "inline", render: l, ...c }, m) {
|
|
58
|
+
const u = L(), d = {
|
|
59
|
+
className: i(
|
|
60
|
+
v({ variant: a }),
|
|
60
61
|
"group/link inline-flex items-center gap-[0.1875em]"
|
|
61
62
|
)
|
|
62
63
|
};
|
|
63
|
-
return
|
|
64
|
-
render:
|
|
65
|
-
ref:
|
|
66
|
-
props:
|
|
64
|
+
return x({
|
|
65
|
+
render: l ?? /* @__PURE__ */ e(u, {}),
|
|
66
|
+
ref: m,
|
|
67
|
+
props: h(d, c, { className: s })
|
|
67
68
|
});
|
|
68
69
|
});
|
|
69
|
-
|
|
70
|
-
const
|
|
71
|
-
ExternalIcon:
|
|
70
|
+
o.displayName = "Link";
|
|
71
|
+
const K = Object.assign(o, {
|
|
72
|
+
ExternalIcon: r
|
|
72
73
|
});
|
|
73
74
|
export {
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
75
|
+
C as K,
|
|
76
|
+
K as L,
|
|
77
|
+
t as a,
|
|
78
|
+
v as l
|
|
78
79
|
};
|
|
79
|
-
//# sourceMappingURL=link-
|
|
80
|
+
//# sourceMappingURL=link-m9hlspftl34nseme.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"link-m9hlspftl34nseme.js","sources":["../../src/components/link/link.tsx"],"sourcesContent":["import { forwardRef, type SVGProps } from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport {\n useLinkComponent,\n type LinkComponentProps,\n} from \"../../utils/link-provider\";\n\n/**\n * ExternalIcon - Visual indicator for links that open in a new tab/window.\n *\n * Use this as a child of Link to indicate external navigation:\n * ```tsx\n * <Link href=\"https://example.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n * Visit Example <Link.ExternalIcon />\n * </Link>\n * ```\n */\nconst ExternalIcon = (props: SVGProps<SVGSVGElement>) => (\n <svg\n width=\"1em\"\n height=\"1em\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n className=\"link-external-icon\"\n {...props}\n >\n <path d=\"M9 4H8.8C7.11984 4 6.27976 4 5.63803 4.32698C5.07354 4.6146 4.6146 5.07354 4.32698 5.63803C4 6.27976 4 7.11984 4 8.8V15.2C4 16.8802 4 17.7202 4.32698 18.362C4.6146 18.9265 5.07354 19.3854 5.63803 19.673C6.27976 20 7.11984 20 8.8 20H15.2C16.8802 20 17.7202 20 18.362 19.673C18.9265 19.3854 19.3854 18.9265 19.673 18.362C20 17.7202 20 16.8802 20 15.2V15\" />\n <path d=\"M14 4H20M20 4V10M20 4L11 13\" />\n </svg>\n);\n\nExternalIcon.displayName = \"Link.ExternalIcon\";\n\n/** Link variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_LINK_VARIANTS = {\n variant: {\n inline: {\n classes:\n // text-kumo-link provides defensive color that won't be overridden by global `a` styles\n \"text-kumo-link underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n description: \"Inline text link that flows with content\",\n },\n current: {\n classes:\n \"text-current underline underline-offset-[0.15em] decoration-[0.0625em] link-current transition-colors\",\n description: \"Link that inherits color from parent text\",\n },\n plain: {\n classes:\n // text-kumo-link provides defensive color that won't be overridden by global `a` styles\n \"text-kumo-link hover:text-kumo-link/70 transition-colors\",\n description: \"Link without underline decoration\",\n },\n },\n} as const;\n\nexport const KUMO_LINK_DEFAULT_VARIANTS = {\n variant: \"inline\",\n} as const;\n\nexport type KumoLinkVariant = keyof typeof KUMO_LINK_VARIANTS.variant;\n\nexport interface KumoLinkVariantsProps {\n /**\n * Visual style of the link.\n * - `\"inline\"` — Inline text link that flows with content\n * - `\"current\"` — Link that inherits color from parent text\n * - `\"plain\"` — Link without underline decoration\n * @default \"inline\"\n */\n variant?: KumoLinkVariant;\n}\n\nexport function linkVariants({\n variant = KUMO_LINK_DEFAULT_VARIANTS.variant,\n}: KumoLinkVariantsProps = {}) {\n return cn(resolveVariant(KUMO_LINK_VARIANTS.variant, variant, KUMO_LINK_DEFAULT_VARIANTS.variant).classes);\n}\n\n/**\n * Link component props.\n *\n * @example\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n * Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * <Link render={<RouterLink to=\"/dashboard\" />}>Dashboard</Link>\n * ```\n */\nexport type LinkProps = useRender.ComponentProps<\"a\"> &\n LinkComponentProps &\n KumoLinkVariantsProps;\n\n/**\n * Link component for consistent inline text links.\n *\n * Supports composition via `render` prop for framework-specific routing:\n * - Without render: renders via LinkProvider (default anchor or configured component)\n * - With render: merges props onto the provided element with proper ref/event handling\n *\n * @example Basic usage\n * ```tsx\n * <Link href=\"/docs\">Learn more</Link>\n * ```\n *\n * @example External link with icon\n * ```tsx\n * <Link href=\"https://cloudflare.com\" target=\"_blank\" rel=\"noopener noreferrer\">\n * Visit Cloudflare <Link.ExternalIcon />\n * </Link>\n * ```\n *\n * @example Composition with React Router\n * ```tsx\n * <Link render={<RouterLink to=\"/dashboard\" />} variant=\"inline\">\n * Dashboard\n * </Link>\n * ```\n */\nconst LinkBase = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n { className, variant = \"inline\", render, ...props },\n ref,\n) {\n const LinkComponent = useLinkComponent();\n\n const defaultProps: useRender.ElementProps<\"a\"> = {\n className: cn(\n linkVariants({ variant }),\n \"group/link inline-flex items-center gap-[0.1875em]\",\n ),\n };\n\n const element = useRender({\n render: render ?? <LinkComponent />,\n ref,\n props: mergeProps<\"a\">(defaultProps, props, { className }),\n });\n\n return element;\n});\n\nLinkBase.displayName = \"Link\";\n\n// Compound component with ExternalIcon subcomponent\nexport const Link = Object.assign(LinkBase, {\n ExternalIcon,\n});\n"],"names":["ExternalIcon","props","jsxs","jsx","KUMO_LINK_VARIANTS","KUMO_LINK_DEFAULT_VARIANTS","linkVariants","variant","cn","resolveVariant","LinkBase","forwardRef","className","render","ref","LinkComponent","useLinkComponent","defaultProps","useRender","mergeProps","Link"],"mappings":";;;;;;;AAoBA,MAAMA,IAAe,CAACC,MACpB,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,QAAO;AAAA,IACP,eAAc;AAAA,IACd,gBAAe;AAAA,IACf,eAAY;AAAA,IACZ,WAAU;AAAA,IACT,GAAGD;AAAA,IAEJ,UAAA;AAAA,MAAA,gBAAAE,EAAC,QAAA,EAAK,GAAE,kWAAA,CAAkW;AAAA,MAC1W,gBAAAA,EAAC,QAAA,EAAK,GAAE,8BAAA,CAA8B;AAAA,IAAA;AAAA,EAAA;AACxC;AAGFH,EAAa,cAAc;AAGpB,MAAMI,IAAqB;AAAA,EAChC,SAAS;AAAA,IACP,QAAQ;AAAA,MACN;AAAA;AAAA,QAEE;AAAA;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SACE;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL;AAAA;AAAA,QAEE;AAAA;AAAA,MACF,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA6B;AAAA,EACxC,SAAS;AACX;AAeO,SAASC,EAAa;AAAA,EAC3B,SAAAC,IAAUF,EAA2B;AACvC,IAA2B,IAAI;AAC7B,SAAOG,EAAGC,EAAeL,EAAmB,SAASG,GAASF,EAA2B,OAAO,EAAE,OAAO;AAC3G;AA4CA,MAAMK,IAAWC,EAAyC,SACxD,EAAE,WAAAC,GAAW,SAAAL,IAAU,UAAU,QAAAM,GAAQ,GAAGZ,EAAA,GAC5Ca,GACA;AACA,QAAMC,IAAgBC,EAAA,GAEhBC,IAA4C;AAAA,IAChD,WAAWT;AAAA,MACTF,EAAa,EAAE,SAAAC,GAAS;AAAA,MACxB;AAAA,IAAA;AAAA,EACF;AASF,SANgBW,EAAU;AAAA,IACxB,QAAQL,KAAU,gBAAAV,EAACY,GAAA,CAAA,CAAc;AAAA,IACjC,KAAAD;AAAA,IACA,OAAOK,EAAgBF,GAAchB,GAAO,EAAE,WAAAW,GAAW;AAAA,EAAA,CAC1D;AAGH,CAAC;AAEDF,EAAS,cAAc;AAGhB,MAAMU,IAAO,OAAO,OAAOV,GAAU;AAAA,EAC1C,cAAAV;AACF,CAAC;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as
|
|
3
|
-
|
|
2
|
+
import { jsxs as a, jsx as t } from "react/jsx-runtime";
|
|
3
|
+
import { r as n } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
|
|
4
|
+
const l = {
|
|
4
5
|
size: {
|
|
5
6
|
sm: {
|
|
6
7
|
value: 16,
|
|
@@ -15,21 +16,21 @@ const n = {
|
|
|
15
16
|
description: "Large loader for prominent loading states"
|
|
16
17
|
}
|
|
17
18
|
}
|
|
18
|
-
},
|
|
19
|
+
}, r = {
|
|
19
20
|
size: "base"
|
|
20
21
|
};
|
|
21
|
-
function
|
|
22
|
-
size: e =
|
|
22
|
+
function u({
|
|
23
|
+
size: e = r.size
|
|
23
24
|
} = {}) {
|
|
24
|
-
return typeof e == "number" ? e : n.size
|
|
25
|
+
return typeof e == "number" ? e : n(l.size, e, r.size).value;
|
|
25
26
|
}
|
|
26
|
-
const
|
|
27
|
+
const m = ({
|
|
27
28
|
className: e,
|
|
28
|
-
size: s =
|
|
29
|
+
size: s = r.size,
|
|
29
30
|
"aria-label": o = "Loading"
|
|
30
31
|
}) => {
|
|
31
|
-
const
|
|
32
|
-
return /* @__PURE__ */
|
|
32
|
+
const i = u({ size: s });
|
|
33
|
+
return /* @__PURE__ */ a(
|
|
33
34
|
"svg",
|
|
34
35
|
{
|
|
35
36
|
width: "24",
|
|
@@ -38,11 +39,11 @@ const d = ({
|
|
|
38
39
|
xmlns: "http://www.w3.org/2000/svg",
|
|
39
40
|
stroke: "currentColor",
|
|
40
41
|
className: e,
|
|
41
|
-
style: { height:
|
|
42
|
+
style: { height: i, width: i },
|
|
42
43
|
role: "status",
|
|
43
44
|
"aria-label": o,
|
|
44
45
|
children: [
|
|
45
|
-
/* @__PURE__ */
|
|
46
|
+
/* @__PURE__ */ a(
|
|
46
47
|
"circle",
|
|
47
48
|
{
|
|
48
49
|
cx: "12",
|
|
@@ -103,6 +104,6 @@ const d = ({
|
|
|
103
104
|
);
|
|
104
105
|
};
|
|
105
106
|
export {
|
|
106
|
-
|
|
107
|
+
m as L
|
|
107
108
|
};
|
|
108
|
-
//# sourceMappingURL=loader-
|
|
109
|
+
//# sourceMappingURL=loader-g8a6j76ue5nq0lr8.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"loader-g8a6j76ue5nq0lr8.js","sources":["../../src/components/loader/loader.tsx"],"sourcesContent":["import { resolveVariant } from \"../../utils/resolve-variant\";\n\n/** Loader size variant definitions mapping sizes to their pixel values. */\nexport const KUMO_LOADER_VARIANTS = {\n size: {\n sm: {\n value: 16,\n description: \"Small loader for inline use\",\n },\n base: {\n value: 24,\n description: \"Default loader size\",\n },\n lg: {\n value: 32,\n description: \"Large loader for prominent loading states\",\n },\n },\n} as const;\n\nexport const KUMO_LOADER_DEFAULT_VARIANTS = {\n size: \"base\",\n} as const;\n\n// Derived types from KUMO_LOADER_VARIANTS\nexport type KumoLoaderSize = keyof typeof KUMO_LOADER_VARIANTS.size;\n\nexport interface KumoLoaderVariantsProps {\n /**\n * Size of the loader. Use a preset name or a custom pixel number.\n * - `\"sm\"` — 16px, small loader for inline use\n * - `\"base\"` — 24px, default loader size\n * - `\"lg\"` — 32px, large loader for prominent loading states\n * @default \"base\"\n */\n size?: KumoLoaderSize | number;\n}\n\nexport function loaderVariants({\n size = KUMO_LOADER_DEFAULT_VARIANTS.size,\n}: KumoLoaderVariantsProps = {}): number {\n if (typeof size === \"number\") return size;\n return resolveVariant(KUMO_LOADER_VARIANTS.size, size, KUMO_LOADER_DEFAULT_VARIANTS.size).value;\n}\n\n/**\n * Loader component props.\n *\n * @example\n * ```tsx\n * <Loader />\n * <Loader size=\"sm\" />\n * <Loader size={24} />\n * ```\n */\nexport interface LoaderProps {\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /**\n * Size of the spinner. Use a preset name or a custom pixel number.\n * - `\"sm\"` — 16px, for inline use\n * - `\"base\"` — 24px, default size\n * - `\"lg\"` — 32px, for prominent loading states\n * @default \"base\"\n */\n size?: KumoLoaderSize | number;\n /**\n * Accessible label for the loader, announced by screen readers.\n * Pass a translated string for internationalization.\n * @default \"Loading\"\n */\n \"aria-label\"?: string;\n}\n\n/**\n * Animated circular spinner for indicating loading states.\n *\n * @example\n * ```tsx\n * <Loader />\n * ```\n */\nexport const Loader = ({\n className,\n size = KUMO_LOADER_DEFAULT_VARIANTS.size,\n \"aria-label\": ariaLabel = \"Loading\",\n}: LoaderProps) => {\n const sizeValue = loaderVariants({ size });\n return (\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n className={className}\n style={{ height: sizeValue, width: sizeValue }}\n role=\"status\"\n aria-label={ariaLabel}\n >\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"9.5\"\n fill=\"none\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n >\n <animateTransform\n attributeName=\"transform\"\n type=\"rotate\"\n from=\"0 12 12\"\n to=\"360 12 12\"\n dur=\"2s\"\n repeatCount=\"indefinite\"\n />\n <animate\n attributeName=\"stroke-dasharray\"\n values=\"0 150;42 150;42 150\"\n keyTimes=\"0;0.5;1\"\n dur=\"1.5s\"\n repeatCount=\"indefinite\"\n />\n <animate\n attributeName=\"stroke-dashoffset\"\n values=\"0;-16;-59\"\n keyTimes=\"0;0.5;1\"\n dur=\"1.5s\"\n repeatCount=\"indefinite\"\n />\n </circle>\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"9.5\"\n fill=\"none\"\n opacity={0.1}\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n </svg>\n );\n};\n"],"names":["KUMO_LOADER_VARIANTS","KUMO_LOADER_DEFAULT_VARIANTS","loaderVariants","size","resolveVariant","Loader","className","ariaLabel","sizeValue","jsxs","jsx"],"mappings":";;;AAGO,MAAMA,IAAuB;AAAA,EAClC,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA+B;AAAA,EAC1C,MAAM;AACR;AAgBO,SAASC,EAAe;AAAA,EAC7B,MAAAC,IAAOF,EAA6B;AACtC,IAA6B,IAAY;AACvC,SAAI,OAAOE,KAAS,WAAiBA,IAC9BC,EAAeJ,EAAqB,MAAMG,GAAMF,EAA6B,IAAI,EAAE;AAC5F;AAuCO,MAAMI,IAAS,CAAC;AAAA,EACrB,WAAAC;AAAA,EACA,MAAAH,IAAOF,EAA6B;AAAA,EACpC,cAAcM,IAAY;AAC5B,MAAmB;AACjB,QAAMC,IAAYN,EAAe,EAAE,MAAAC,GAAM;AACzC,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,QAAO;AAAA,MACP,WAAAH;AAAA,MACA,OAAO,EAAE,QAAQE,GAAW,OAAOA,EAAA;AAAA,MACnC,MAAK;AAAA,MACL,cAAYD;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,GAAE;AAAA,YACF,MAAK;AAAA,YACL,aAAY;AAAA,YACZ,eAAc;AAAA,YAEd,UAAA;AAAA,cAAA,gBAAAC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,MAAK;AAAA,kBACL,MAAK;AAAA,kBACL,IAAG;AAAA,kBACH,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEd,gBAAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,QAAO;AAAA,kBACP,UAAS;AAAA,kBACT,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEd,gBAAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAc;AAAA,kBACd,QAAO;AAAA,kBACP,UAAS;AAAA,kBACT,KAAI;AAAA,kBACJ,aAAY;AAAA,gBAAA;AAAA,cAAA;AAAA,YACd;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,gBAAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH,GAAE;AAAA,YACF,MAAK;AAAA,YACL,SAAS;AAAA,YACT,aAAY;AAAA,YACZ,eAAc;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB;AAAA,IAAA;AAAA,EAAA;AAGN;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as a, jsxs as p, Fragment as E } from "react/jsx-runtime";
|
|
3
3
|
import { useState as T, useMemo as N, useEffect as B, createContext as D, useContext as R } from "react";
|
|
4
|
-
import { I as m } from "./input-group-
|
|
4
|
+
import { I as m } from "./input-group-bm9wxzovpvzn1c25.js";
|
|
5
5
|
import { CaretDoubleLeftIcon as F, CaretLeftIcon as V, CaretRightIcon as U, CaretDoubleRightIcon as j } from "@phosphor-icons/react";
|
|
6
6
|
import { c as d } from "./cn-ct4n7r74mh8y0f48.js";
|
|
7
|
-
import { S as P } from "./select-
|
|
7
|
+
import { S as P } from "./select-j8evv2iblgs5fa9s.js";
|
|
8
8
|
const G = [25, 50, 100, 250], y = (n, l, o) => Math.min(Math.max(n, l), o), K = {
|
|
9
9
|
navigation: "Pagination",
|
|
10
10
|
firstPage: "First page",
|
|
@@ -263,4 +263,4 @@ const W = Object.assign(L, {
|
|
|
263
263
|
export {
|
|
264
264
|
W as P
|
|
265
265
|
};
|
|
266
|
-
//# sourceMappingURL=pagination-
|
|
266
|
+
//# sourceMappingURL=pagination-fdmcwreb27eej9l3.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pagination-fdmcwreb27eej9l3.js","sources":["../../src/components/pagination/pagination.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n useEffect,\n useMemo,\n useState,\n type KeyboardEvent,\n type ReactNode,\n} from \"react\";\nimport { InputGroup } from \"../input-group\";\nimport {\n CaretDoubleLeftIcon,\n CaretDoubleRightIcon,\n CaretLeftIcon,\n CaretRightIcon,\n} from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport { Select } from \"../select\";\n\nconst DEFAULT_PAGE_SIZE_OPTIONS = [25, 50, 100, 250] as const;\n\nconst clamp = (value: number, min: number, max: number) =>\n Math.min(Math.max(value, min), max);\n\n// ============================================================================\n// i18n Labels\n// ============================================================================\n\n/**\n * Labels for internationalization of Pagination component.\n * All labels have English defaults and can be overridden for other locales.\n *\n * Note: To customize the \"Showing X-Y of Z\" text, use the `children` render prop\n * on `Pagination.Info` instead. To customize the \"Per page:\" label, use the\n * `label` prop on `Pagination.PageSize`.\n */\nexport interface PaginationLabels {\n /** Aria label for the navigation landmark. @default \"Pagination\" */\n navigation?: string;\n /** Aria label for the first page button. @default \"First page\" */\n firstPage?: string;\n /** Aria label for the previous page button. @default \"Previous page\" */\n previousPage?: string;\n /** Aria label for the next page button. @default \"Next page\" */\n nextPage?: string;\n /** Aria label for the last page button. @default \"Last page\" */\n lastPage?: string;\n /** Aria label for the page number input/select. @default \"Page number\" */\n pageNumber?: string;\n /** Aria label for the page size select. @default \"Page size\" */\n pageSize?: string;\n}\n\nconst DEFAULT_LABELS: Required<PaginationLabels> = {\n navigation: \"Pagination\",\n firstPage: \"First page\",\n previousPage: \"Previous page\",\n nextPage: \"Next page\",\n lastPage: \"Last page\",\n pageNumber: \"Page number\",\n pageSize: \"Page size\",\n};\n\n/** Pagination controls variant definitions. */\nexport const KUMO_PAGINATION_VARIANTS = {\n controls: {\n full: {\n classes: \"\",\n description:\n \"Full pagination controls with first, previous, page input, next, and last buttons\",\n },\n simple: {\n classes: \"\",\n description:\n \"Simple pagination controls with only previous and next buttons\",\n },\n },\n} as const;\n\nexport type KumoPaginationControls =\n keyof typeof KUMO_PAGINATION_VARIANTS.controls;\n\nexport const KUMO_PAGINATION_DEFAULT_VARIANTS = {\n controls: \"full\",\n} as const;\n\nexport interface KumoPaginationVariantsProps {\n controls?: KumoPaginationControls;\n}\n\nexport function paginationVariants({\n controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n}: KumoPaginationVariantsProps = {}) {\n return cn(\n \"flex items-center justify-between gap-2\",\n resolveVariant(KUMO_PAGINATION_VARIANTS.controls, controls, KUMO_PAGINATION_DEFAULT_VARIANTS.controls).classes,\n );\n}\n\n// ============================================================================\n// Pagination Context\n// ============================================================================\n\ninterface PaginationContextValue {\n page: number;\n perPage?: number;\n totalCount?: number;\n maxPage: number;\n pageShowingRange: string;\n setPage: (page: number) => void;\n editingPage: number;\n setEditingPage: (page: number) => void;\n labels: Required<PaginationLabels>;\n}\n\nconst PaginationContext = createContext<PaginationContextValue | null>(null);\n\nfunction usePaginationContext() {\n const context = useContext(PaginationContext);\n if (!context) {\n throw new Error(\n \"Pagination compound components must be used within a Pagination component\",\n );\n }\n return context;\n}\n\n// ============================================================================\n// Pagination.Info\n// ============================================================================\n\nexport interface PaginationInfoProps {\n /** Custom render function for the info text */\n children?: (props: {\n page: number;\n perPage?: number;\n totalCount?: number;\n pageShowingRange: string;\n }) => ReactNode;\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationInfo({ children, className }: PaginationInfoProps) {\n const { page, perPage, totalCount, pageShowingRange } =\n usePaginationContext();\n\n const content = children ? (\n children({ page, perPage, totalCount, pageShowingRange })\n ) : totalCount && totalCount > 0 ? (\n <>\n Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n <span className=\"tabular-nums\">{totalCount}</span>\n </>\n ) : null;\n\n return (\n <div\n data-slot=\"pagination-info\"\n className={cn(\"text-sm text-kumo-subtle\", className)}\n >\n {content}\n </div>\n );\n}\n\nPaginationInfo.displayName = \"Pagination.Info\";\n\n// ============================================================================\n// Pagination.PageSize\n// ============================================================================\n\nexport interface PaginationPageSizeProps {\n /** Current page size value */\n value: number;\n /** Callback when page size changes */\n onChange: (size: number) => void;\n /** Available page size options */\n options?: number[];\n /**\n * Label text shown before the selector.\n * @default \"Per page:\"\n */\n label?: ReactNode;\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationPageSize({\n value,\n onChange,\n options = DEFAULT_PAGE_SIZE_OPTIONS as unknown as number[],\n label = \"Per page:\",\n className,\n}: PaginationPageSizeProps) {\n const { labels } = usePaginationContext();\n\n return (\n <div\n data-slot=\"pagination-page-size\"\n className={cn(\"flex items-center gap-2\", className)}\n >\n {label && <span className=\"text-sm text-kumo-subtle\">{label}</span>}\n <Select\n aria-label={labels.pageSize}\n value={value}\n onValueChange={(v) => onChange(v as number)}\n >\n {options.map((size) => (\n <Select.Option key={size} value={size}>\n {size}\n </Select.Option>\n ))}\n </Select>\n </div>\n );\n}\n\nPaginationPageSize.displayName = \"Pagination.PageSize\";\n\n// ============================================================================\n// Pagination.Controls\n// ============================================================================\n\nexport interface PaginationControlsProps extends KumoPaginationVariantsProps {\n /**\n * How the page number selector is rendered in \"full\" controls mode.\n * - `\"input\"` (default): A text input where users type a page number.\n * - `\"dropdown\"`: A dropdown select with all page numbers as options.\n *\n * **Note:** `\"dropdown\"` renders an option for every page, so it is best\n * suited for small page counts. For large datasets (hundreds of pages or\n * more) prefer `\"input\"` to avoid rendering performance overhead.\n */\n pageSelector?: \"input\" | \"dropdown\";\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationControls({\n controls = KUMO_PAGINATION_DEFAULT_VARIANTS.controls,\n pageSelector = \"input\",\n className,\n}: PaginationControlsProps) {\n const { page, maxPage, setPage, editingPage, setEditingPage, labels } =\n usePaginationContext();\n\n return (\n <div\n data-slot=\"pagination-controls\"\n className={cn(\"grow flex flex-col items-end\", className)}\n >\n <nav aria-label={labels.navigation}>\n <InputGroup>\n {controls === \"full\" && (\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.firstPage}\n disabled={page <= 1}\n onClick={() => {\n setPage(1);\n setEditingPage(1);\n }}\n >\n <CaretDoubleLeftIcon size={16} />\n </InputGroup.Button>\n )}\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.previousPage}\n disabled={page <= 1}\n onClick={() => {\n const previousPage = Math.max(page - 1, 1);\n setPage(previousPage);\n setEditingPage(previousPage);\n }}\n >\n <CaretLeftIcon size={16} />\n </InputGroup.Button>\n {controls === \"full\" &&\n (pageSelector === \"dropdown\" ? (\n <Select\n aria-label={labels.pageNumber}\n className=\"rounded-none ring-kumo-hairline\"\n value={page}\n onValueChange={(value) => {\n const num = value as number;\n setPage(num);\n setEditingPage(num);\n }}\n >\n {Array.from({ length: maxPage }, (_, i) => i + 1).map((p) => (\n <Select.Option key={p} value={p}>\n {p}\n </Select.Option>\n ))}\n </Select>\n ) : (\n <InputGroup.Input\n style={{ width: 50 }}\n className=\"text-center\"\n aria-label={labels.pageNumber}\n value={editingPage}\n onValueChange={(value: string) => {\n setEditingPage(Number(value));\n }}\n onBlur={() => {\n const clamped = clamp(editingPage, 1, maxPage);\n setPage(clamped);\n setEditingPage(clamped);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === \"Enter\") {\n const clamped = clamp(editingPage, 1, maxPage);\n setPage(clamped);\n setEditingPage(clamped);\n }\n }}\n // Prevent password managers from auto-filling\n autoComplete=\"off\"\n data-1p-ignore\n data-lpignore=\"true\"\n data-form-type=\"other\"\n />\n ))}\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.nextPage}\n disabled={page === maxPage}\n onClick={() => {\n const nextPage = Math.min(page + 1, maxPage);\n setPage(nextPage);\n setEditingPage(nextPage);\n }}\n >\n <CaretRightIcon size={16} />\n </InputGroup.Button>\n {controls === \"full\" && (\n <InputGroup.Button\n variant=\"secondary\"\n aria-label={labels.lastPage}\n disabled={page === maxPage}\n onClick={() => {\n setPage(maxPage);\n setEditingPage(maxPage);\n }}\n >\n <CaretDoubleRightIcon size={16} />\n </InputGroup.Button>\n )}\n </InputGroup>\n </nav>\n </div>\n );\n}\n\nPaginationControls.displayName = \"Pagination.Controls\";\n\n// ============================================================================\n// Pagination.Separator\n// ============================================================================\n\nexport interface PaginationSeparatorProps {\n /** Additional CSS classes */\n className?: string;\n}\n\nfunction PaginationSeparator({ className }: PaginationSeparatorProps) {\n return (\n <div\n data-slot=\"pagination-separator\"\n className={cn(\"mx-2 h-6 border-l border-kumo-hairline\", className)}\n />\n );\n}\n\nPaginationSeparator.displayName = \"Pagination.Separator\";\n\n// ============================================================================\n// Pagination Root\n// ============================================================================\n\n/** Base props shared by both compound and legacy Pagination APIs */\ninterface PaginationBaseProps {\n /** Callback fired when the current page changes. */\n setPage: (page: number) => void;\n /**\n * Current page number (1-indexed).\n * @default 1\n */\n page?: number;\n /** Number of items displayed per page. */\n perPage?: number;\n /** Total number of items across all pages. */\n totalCount?: number;\n /** Additional CSS classes for the container */\n className?: string;\n /**\n * Labels for internationalization of aria-labels. All labels have English defaults.\n *\n * For visible text like \"Showing X of Y\", use render props on sub-components:\n * - `Pagination.Info` children for the info text\n * - `Pagination.PageSize` label prop for the \"Per page:\" text\n *\n * @example\n * ```tsx\n * <Pagination\n * labels={{\n * firstPage: \"Première page\",\n * previousPage: \"Page précédente\",\n * nextPage: \"Page suivante\",\n * lastPage: \"Dernière page\",\n * pageNumber: \"Numéro de page\",\n * pageSize: \"Taille de page\",\n * }}\n * // ...\n * />\n * ```\n */\n labels?: PaginationLabels;\n}\n\n/**\n * Props for the compound component API (recommended).\n *\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport interface PaginationCompoundProps extends PaginationBaseProps {\n /**\n * Compound component children for custom layouts.\n * Use Pagination.Info, Pagination.PageSize, Pagination.Controls, and Pagination.Separator.\n */\n children: ReactNode;\n controls?: never;\n text?: never;\n}\n\n/**\n * Props for the legacy API (deprecated, use compound components instead).\n *\n * @deprecated Use the compound component API with children instead:\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * ```tsx\n * // Legacy usage (deprecated)\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nexport interface PaginationLegacyProps\n extends PaginationBaseProps, KumoPaginationVariantsProps {\n children?: never;\n /** @deprecated Use Pagination.Info with children prop instead */\n text?: (props: {\n page?: number;\n perPage?: number;\n totalCount?: number;\n pageShowingRange: string;\n }) => ReactNode;\n}\n\n/**\n * Pagination component props.\n *\n * Prefer the compound component API for new code:\n * @example\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n */\nexport type PaginationProps = PaginationCompoundProps | PaginationLegacyProps;\n\n/**\n * Page navigation controls with page count display.\n *\n * Supports both compound component and legacy patterns. Prefer compound components for new code:\n *\n * @example\n * // Compound component (recommended)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={perPage} totalCount={500}>\n * <Pagination.Info />\n * <Pagination.Separator />\n * <Pagination.PageSize value={perPage} onChange={setPerPage} />\n * <Pagination.Controls />\n * </Pagination>\n * ```\n *\n * @example\n * // Legacy (deprecated)\n * ```tsx\n * <Pagination page={page} setPage={setPage} perPage={10} totalCount={100} />\n * ```\n */\nfunction PaginationRoot(props: PaginationProps) {\n const {\n page = 1,\n perPage,\n totalCount,\n setPage,\n children,\n className,\n labels: labelsProp,\n } = props;\n\n // Extract legacy props (only present when children is not provided)\n const text = \"text\" in props ? props.text : undefined;\n const controls =\n \"controls\" in props\n ? (props.controls ?? KUMO_PAGINATION_DEFAULT_VARIANTS.controls)\n : KUMO_PAGINATION_DEFAULT_VARIANTS.controls;\n const [editingPage, setEditingPage] = useState<number>(1);\n\n // Merge provided labels with defaults\n const labels = useMemo<Required<PaginationLabels>>(\n () => ({ ...DEFAULT_LABELS, ...labelsProp }),\n [labelsProp],\n );\n\n useEffect(() => {\n setEditingPage(page);\n }, [page]);\n\n const pageShowingRange = useMemo(() => {\n let lower = page * (perPage ?? 1) - (perPage ?? 0) + 1;\n let upper = Math.min(page * (perPage ?? 0), totalCount ?? 0);\n\n if (Number.isNaN(lower)) lower = 0;\n if (Number.isNaN(upper)) upper = 0;\n\n return `${lower}-${upper}`;\n }, [page, perPage, totalCount]);\n\n const maxPage = useMemo(() => {\n return Math.ceil((totalCount ?? 1) / (perPage ?? 1));\n }, [totalCount, perPage]);\n\n const contextValue: PaginationContextValue = {\n page,\n perPage,\n totalCount,\n maxPage,\n pageShowingRange,\n setPage,\n editingPage,\n setEditingPage,\n labels,\n };\n\n // Compound component mode: render children within context\n if (children) {\n return (\n <PaginationContext.Provider value={contextValue}>\n <div\n data-slot=\"pagination\"\n className={cn(\"flex items-center gap-2 w-full\", className)}\n >\n {children}\n </div>\n </PaginationContext.Provider>\n );\n }\n\n // Legacy mode: render default layout for backwards compatibility\n const getPaginationText = () => {\n if (text) {\n return text({ page, perPage, totalCount, pageShowingRange });\n } else if (totalCount && totalCount > 0) {\n return (\n <>\n Showing <span className=\"tabular-nums\">{pageShowingRange}</span> of{\" \"}\n <span className=\"tabular-nums\">{totalCount}</span>\n </>\n );\n }\n return null;\n };\n\n return (\n <PaginationContext.Provider value={contextValue}>\n <div\n data-slot=\"pagination\"\n className={cn(\"flex items-center gap-2 w-full\", className)}\n >\n <div\n aria-live=\"polite\"\n aria-atomic=\"true\"\n data-slot=\"pagination-info\"\n className=\"grow text-sm text-kumo-subtle\"\n >\n {getPaginationText()}\n </div>\n <PaginationControls controls={controls} />\n </div>\n </PaginationContext.Provider>\n );\n}\n\nPaginationRoot.displayName = \"Pagination\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nexport const Pagination = Object.assign(PaginationRoot, {\n Info: PaginationInfo,\n PageSize: PaginationPageSize,\n Controls: PaginationControls,\n Separator: PaginationSeparator,\n});\n\nexport {\n PaginationInfo,\n PaginationPageSize,\n PaginationControls,\n PaginationSeparator,\n};\n"],"names":["DEFAULT_PAGE_SIZE_OPTIONS","clamp","value","min","max","DEFAULT_LABELS","KUMO_PAGINATION_DEFAULT_VARIANTS","PaginationContext","createContext","usePaginationContext","context","useContext","PaginationInfo","children","className","page","perPage","totalCount","pageShowingRange","content","jsxs","Fragment","jsx","cn","PaginationPageSize","onChange","options","label","labels","Select","v","size","PaginationControls","controls","pageSelector","maxPage","setPage","editingPage","setEditingPage","InputGroup","CaretDoubleLeftIcon","previousPage","CaretLeftIcon","num","_","i","p","clamped","e","nextPage","CaretRightIcon","CaretDoubleRightIcon","PaginationSeparator","PaginationRoot","props","labelsProp","text","useState","useMemo","useEffect","lower","upper","contextValue","getPaginationText","Pagination"],"mappings":"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"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as e, jsxs as
|
|
3
|
-
import { forwardRef as
|
|
2
|
+
import { jsx as e, jsxs as p } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef as I, createContext as C, useContext as G } from "react";
|
|
4
4
|
import { c as o } from "./cn-ct4n7r74mh8y0f48.js";
|
|
5
|
-
import {
|
|
6
|
-
|
|
5
|
+
import { r as x } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
|
|
6
|
+
import { R as L, U as O, Q as w, br as v, bs as N } from "./vendor-base-ui-ie71jahf0czyf58j.js";
|
|
7
|
+
const R = {
|
|
7
8
|
variant: {
|
|
8
9
|
default: {
|
|
9
10
|
classes: "ring-kumo-hairline",
|
|
@@ -24,23 +25,23 @@ const v = {
|
|
|
24
25
|
description: "Choice card appearance with border, padding, and highlighted selection state"
|
|
25
26
|
}
|
|
26
27
|
}
|
|
27
|
-
},
|
|
28
|
+
}, f = {
|
|
28
29
|
variant: "default",
|
|
29
30
|
appearance: "default"
|
|
30
31
|
};
|
|
31
|
-
function
|
|
32
|
-
variant: t =
|
|
33
|
-
appearance: r =
|
|
32
|
+
function P({
|
|
33
|
+
variant: t = f.variant,
|
|
34
|
+
appearance: r = f.appearance
|
|
34
35
|
} = {}) {
|
|
35
36
|
return o(
|
|
36
|
-
|
|
37
|
-
|
|
37
|
+
x(R.variant, t, f.variant).classes,
|
|
38
|
+
x(R.appearance, r, f.appearance).classes
|
|
38
39
|
);
|
|
39
40
|
}
|
|
40
|
-
const
|
|
41
|
+
const y = C({
|
|
41
42
|
controlPosition: void 0,
|
|
42
43
|
appearance: "default"
|
|
43
|
-
}),
|
|
44
|
+
}), A = I(
|
|
44
45
|
({
|
|
45
46
|
className: t,
|
|
46
47
|
disabled: r,
|
|
@@ -50,8 +51,8 @@ const w = I({
|
|
|
50
51
|
description: i,
|
|
51
52
|
value: c
|
|
52
53
|
}, l) => {
|
|
53
|
-
const { controlPosition: g, appearance: u } =
|
|
54
|
-
return d ? /* @__PURE__ */
|
|
54
|
+
const { controlPosition: g, appearance: u } = G(y), d = (s ?? u) === "card", m = g ?? (d ? "end" : "start");
|
|
55
|
+
return d ? /* @__PURE__ */ p(
|
|
55
56
|
"label",
|
|
56
57
|
{
|
|
57
58
|
className: o(
|
|
@@ -65,12 +66,12 @@ const w = I({
|
|
|
65
66
|
t
|
|
66
67
|
),
|
|
67
68
|
children: [
|
|
68
|
-
/* @__PURE__ */
|
|
69
|
+
/* @__PURE__ */ p("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
|
|
69
70
|
/* @__PURE__ */ e("span", { className: "text-base font-medium text-kumo-default", children: n }),
|
|
70
71
|
i && /* @__PURE__ */ e("span", { className: "text-sm text-kumo-subtle", children: i })
|
|
71
72
|
] }),
|
|
72
73
|
/* @__PURE__ */ e(
|
|
73
|
-
|
|
74
|
+
v,
|
|
74
75
|
{
|
|
75
76
|
ref: l,
|
|
76
77
|
value: c,
|
|
@@ -83,7 +84,7 @@ const w = I({
|
|
|
83
84
|
"data-[checked]:bg-kumo-contrast"
|
|
84
85
|
),
|
|
85
86
|
children: /* @__PURE__ */ e(
|
|
86
|
-
|
|
87
|
+
N,
|
|
87
88
|
{
|
|
88
89
|
keepMounted: !0,
|
|
89
90
|
className: "flex items-center justify-center",
|
|
@@ -94,7 +95,7 @@ const w = I({
|
|
|
94
95
|
)
|
|
95
96
|
]
|
|
96
97
|
}
|
|
97
|
-
) : /* @__PURE__ */
|
|
98
|
+
) : /* @__PURE__ */ p(
|
|
98
99
|
"label",
|
|
99
100
|
{
|
|
100
101
|
className: o(
|
|
@@ -107,7 +108,7 @@ const w = I({
|
|
|
107
108
|
),
|
|
108
109
|
children: [
|
|
109
110
|
/* @__PURE__ */ e(
|
|
110
|
-
|
|
111
|
+
v,
|
|
111
112
|
{
|
|
112
113
|
ref: l,
|
|
113
114
|
value: c,
|
|
@@ -120,7 +121,7 @@ const w = I({
|
|
|
120
121
|
"data-[checked]:bg-kumo-contrast"
|
|
121
122
|
),
|
|
122
123
|
children: /* @__PURE__ */ e(
|
|
123
|
-
|
|
124
|
+
N,
|
|
124
125
|
{
|
|
125
126
|
keepMounted: !0,
|
|
126
127
|
className: "flex items-center justify-center",
|
|
@@ -135,18 +136,18 @@ const w = I({
|
|
|
135
136
|
);
|
|
136
137
|
}
|
|
137
138
|
);
|
|
138
|
-
|
|
139
|
-
function
|
|
139
|
+
A.displayName = "Radio.Item";
|
|
140
|
+
function j({ children: t, className: r }) {
|
|
140
141
|
return /* @__PURE__ */ e(
|
|
141
|
-
|
|
142
|
+
w,
|
|
142
143
|
{
|
|
143
144
|
className: o("text-base font-medium text-kumo-default", r),
|
|
144
145
|
children: t
|
|
145
146
|
}
|
|
146
147
|
);
|
|
147
148
|
}
|
|
148
|
-
|
|
149
|
-
function
|
|
149
|
+
j.displayName = "Radio.Legend";
|
|
150
|
+
function h({
|
|
150
151
|
legend: t,
|
|
151
152
|
children: r,
|
|
152
153
|
orientation: a = "vertical",
|
|
@@ -157,25 +158,25 @@ function p({
|
|
|
157
158
|
value: l,
|
|
158
159
|
onValueChange: g,
|
|
159
160
|
disabled: u,
|
|
160
|
-
controlPosition:
|
|
161
|
+
controlPosition: b,
|
|
161
162
|
name: d,
|
|
162
163
|
className: m
|
|
163
164
|
}) {
|
|
164
|
-
return /* @__PURE__ */ e(
|
|
165
|
-
|
|
165
|
+
return /* @__PURE__ */ e(y.Provider, { value: { controlPosition: b, appearance: s }, children: /* @__PURE__ */ e(
|
|
166
|
+
L,
|
|
166
167
|
{
|
|
167
168
|
defaultValue: c,
|
|
168
169
|
value: l,
|
|
169
|
-
onValueChange: (
|
|
170
|
+
onValueChange: (k) => g?.(k),
|
|
170
171
|
disabled: u,
|
|
171
172
|
name: d,
|
|
172
|
-
children: /* @__PURE__ */
|
|
173
|
-
|
|
173
|
+
children: /* @__PURE__ */ p(
|
|
174
|
+
O,
|
|
174
175
|
{
|
|
175
176
|
disabled: u,
|
|
176
177
|
className: o("flex flex-col gap-4", m),
|
|
177
178
|
children: [
|
|
178
|
-
t && /* @__PURE__ */ e(
|
|
179
|
+
t && /* @__PURE__ */ e(w, { className: "text-base font-medium text-kumo-default", children: t }),
|
|
179
180
|
/* @__PURE__ */ e(
|
|
180
181
|
"div",
|
|
181
182
|
{
|
|
@@ -193,17 +194,17 @@ function p({
|
|
|
193
194
|
}
|
|
194
195
|
) });
|
|
195
196
|
}
|
|
196
|
-
|
|
197
|
-
const
|
|
198
|
-
Item:
|
|
199
|
-
Group:
|
|
200
|
-
Legend:
|
|
197
|
+
h.displayName = "Radio.Group";
|
|
198
|
+
const U = Object.assign(h, {
|
|
199
|
+
Item: A,
|
|
200
|
+
Group: h,
|
|
201
|
+
Legend: j
|
|
201
202
|
});
|
|
202
203
|
export {
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
204
|
+
R as K,
|
|
205
|
+
U as R,
|
|
206
|
+
h as a,
|
|
207
|
+
f as b,
|
|
208
|
+
P as r
|
|
208
209
|
};
|
|
209
|
-
//# sourceMappingURL=radio-
|
|
210
|
+
//# sourceMappingURL=radio-f95mt237ru8fyc03.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"radio-f95mt237ru8fyc03.js","sources":["../../src/components/radio/radio.tsx"],"sourcesContent":["import { forwardRef, createContext, useContext, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport { Fieldset } from \"@base-ui/react/fieldset\";\nimport { RadioGroup as BaseRadioGroup } from \"@base-ui/react/radio-group\";\nimport { Radio as BaseRadio } from \"@base-ui/react/radio\";\n\n/** Radio variant definitions mapping variant names to their Tailwind classes. */\nexport const KUMO_RADIO_VARIANTS = {\n variant: {\n default: {\n classes: \"ring-kumo-hairline\",\n description: \"Default radio appearance\",\n },\n error: {\n classes: \"ring-kumo-danger\",\n description: \"Error state for validation failures\",\n },\n },\n appearance: {\n default: {\n classes: \"\",\n description: \"Standard inline radio item\",\n },\n card: {\n classes:\n \"rounded-lg border border-kumo-hairline bg-kumo-base p-3 transition-colors hover:bg-kumo-tint has-[[data-checked]]:border-kumo-interact has-[[data-checked]]:bg-kumo-tint\",\n description:\n \"Choice card appearance with border, padding, and highlighted selection state\",\n },\n },\n} as const;\n\nexport const KUMO_RADIO_DEFAULT_VARIANTS = {\n variant: \"default\",\n appearance: \"default\",\n} as const;\n\n// Derived types from KUMO_RADIO_VARIANTS\nexport type KumoRadioVariant = keyof typeof KUMO_RADIO_VARIANTS.variant;\nexport type KumoRadioAppearance = keyof typeof KUMO_RADIO_VARIANTS.appearance;\n\nexport interface KumoRadioVariantsProps {\n /**\n * Visual variant.\n * - `\"default\"` — Standard radio appearance\n * - `\"error\"` — Error state for validation failures\n * @default \"default\"\n */\n variant?: KumoRadioVariant;\n /**\n * Visual appearance.\n * - `\"default\"` — Standard inline radio item\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n}\n\nexport function radioVariants({\n variant = KUMO_RADIO_DEFAULT_VARIANTS.variant,\n appearance = KUMO_RADIO_DEFAULT_VARIANTS.appearance,\n}: KumoRadioVariantsProps = {}) {\n return cn(\n resolveVariant(KUMO_RADIO_VARIANTS.variant, variant, KUMO_RADIO_DEFAULT_VARIANTS.variant).classes,\n resolveVariant(KUMO_RADIO_VARIANTS.appearance, appearance, KUMO_RADIO_DEFAULT_VARIANTS.appearance).classes,\n );\n}\n\n// Legacy type alias for backwards compatibility\nexport type RadioVariant = KumoRadioVariant;\n\n/** Position of the radio control relative to its label */\nexport type RadioControlPosition = \"start\" | \"end\";\n\n// Context for passing controlPosition and appearance from Group to Items.\n// `controlPosition` may be undefined so each item can fall back to an\n// appearance-appropriate default (start for default, end for card).\nconst RadioGroupContext = createContext<{\n controlPosition: RadioControlPosition | undefined;\n appearance: KumoRadioAppearance;\n}>({\n controlPosition: undefined,\n appearance: \"default\",\n});\n\n/**\n * Radio group component props (with built-in Fieldset and RadioGroup)\n *\n * @example\n * // Basic usage\n * ```tsx\n * <Radio.Group legend=\"Notification preference\" defaultValue=\"email\">\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * <Radio.Item label=\"Push\" value=\"push\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Horizontal layout\n * ```tsx\n * <Radio.Group legend=\"Size\" orientation=\"horizontal\" defaultValue=\"md\">\n * <Radio.Item label=\"Small\" value=\"sm\" />\n * <Radio.Item label=\"Medium\" value=\"md\" />\n * <Radio.Item label=\"Large\" value=\"lg\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // With error and description\n * ```tsx\n * <Radio.Group\n * legend=\"Payment method\"\n * error=\"Please select a payment method\"\n * description=\"Choose how you'd like to pay\"\n * >\n * <Radio.Item label=\"Credit Card\" value=\"card\" />\n * <Radio.Item label=\"PayPal\" value=\"paypal\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Controlled\n * ```tsx\n * const [value, setValue] = useState(\"email\");\n * <Radio.Group legend=\"Contact\" value={value} onValueChange={setValue}>\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"Phone\" value=\"phone\" />\n * </Radio.Group>\n * ```\n *\n * @example\n * // Label before radio (controlPosition=\"end\")\n * ```tsx\n * <Radio.Group legend=\"Options\" controlPosition=\"end\" defaultValue=\"a\">\n * <Radio.Item label=\"Option A\" value=\"a\" />\n * <Radio.Item label=\"Option B\" value=\"b\" />\n * </Radio.Group>\n * ```\n */\n/**\n * Props for Radio.Legend — a composable sub-component for labeling a Radio.Group.\n *\n * Place as a direct child of `<Radio.Group>` to provide a styled, accessible legend.\n * Accepts `className` for full styling control (e.g. `className=\"sr-only\"` to visually hide).\n *\n * @example\n * ```tsx\n * <Radio.Group>\n * <Radio.Legend className=\"sr-only\">Paths</Radio.Legend>\n * <Radio.Item label=\"Allow all paths\" value=\"all\" />\n * </Radio.Group>\n * ```\n */\nexport interface RadioLegendProps {\n /** Legend content */\n children: ReactNode;\n /** Additional CSS classes (e.g. \"sr-only\" to visually hide the legend) */\n className?: string;\n}\n\nexport interface RadioGroupProps {\n /**\n * Legend text for the group (required for accessibility).\n * For more control over legend styling, omit this prop and use `<Radio.Legend>` as a child instead.\n */\n legend?: string;\n /** Child Radio.Item components (and optionally a Radio.Legend) */\n children: ReactNode;\n /** Layout direction of the radio items */\n orientation?: \"vertical\" | \"horizontal\";\n /**\n * Visual appearance applied to all Radio.Item children.\n * - `\"default\"` — Standard inline radio items\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n *\n * Individual items can override this with their own `appearance` prop.\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n /** Error message for the group */\n error?: string;\n /** Helper text for the group */\n description?: ReactNode;\n /** Value of the radio that should be initially selected (uncontrolled) */\n defaultValue?: string;\n /** Value of the radio that should be selected (controlled) */\n value?: string;\n /** Event handler called when radio value changes */\n onValueChange?: (value: string) => void;\n /** Whether all radios in the group are disabled */\n disabled?: boolean;\n /** Position of radio control relative to label: \"start\" puts radio before label, \"end\" puts label before radio. Defaults to \"start\" for default appearance and \"end\" for card appearance. */\n controlPosition?: RadioControlPosition;\n /** Form submission name for the radio group */\n name?: string;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Individual radio item within a group\n *\n * @example\n * ```tsx\n * <Radio.Item label=\"Option A\" value=\"a\" />\n * ```\n *\n * @example\n * // Disabled item\n * ```tsx\n * <Radio.Item label=\"Unavailable\" value=\"unavailable\" disabled />\n * ```\n */\nexport type RadioItemProps = {\n /** Visual variant: \"default\" or \"error\" for validation failures */\n variant?: RadioVariant;\n /**\n * Visual appearance of the radio item.\n * - `\"default\"` — Standard inline radio item\n * - `\"card\"` — Choice card with border, padding, and highlighted selection state\n *\n * When set on an individual item, overrides the group-level `appearance`.\n * @default \"default\"\n */\n appearance?: KumoRadioAppearance;\n /** Label content displayed next to radio (required). Accepts strings or React nodes for rich content. */\n label: ReactNode;\n /** Description text displayed below the label (only visible in card appearance) */\n description?: ReactNode;\n /** Value of the radio (required) */\n value: string;\n /** Additional CSS classes for the label wrapper */\n className?: string;\n /** Whether the radio is disabled */\n disabled?: boolean;\n};\n\n// Radio.Item for use within Radio.Group\nconst RadioItem = forwardRef<HTMLButtonElement, RadioItemProps>(\n (\n {\n className,\n disabled,\n variant = \"default\",\n appearance: appearanceProp,\n label,\n description,\n value,\n },\n ref,\n ) => {\n const { controlPosition, appearance: groupAppearance } =\n useContext(RadioGroupContext);\n const appearance = appearanceProp ?? groupAppearance;\n const isCard = appearance === \"card\";\n\n // Fall back to an appearance-appropriate default when controlPosition is\n // not provided: card defaults to \"end\" (radio on the right), default\n // appearance defaults to \"start\" (radio on the left).\n const effectiveControlPosition: RadioControlPosition =\n controlPosition ?? (isCard ? \"end\" : \"start\");\n\n if (isCard) {\n const controlAtStart = effectiveControlPosition === \"start\";\n return (\n <label\n className={cn(\n \"m-0 group relative flex items-start gap-3 rounded-lg border border-kumo-hairline bg-kumo-base p-3 transition-colors has-[[data-checked]]:border-kumo-interact has-[[data-checked]]:bg-kumo-tint\",\n controlAtStart && \"flex-row-reverse\",\n variant === \"error\" &&\n \"border-kumo-danger has-[[data-checked]]:border-kumo-danger has-[[data-checked]]:bg-kumo-base\",\n disabled\n ? \"cursor-not-allowed opacity-50\"\n : cn(\n \"has-[[data-disabled]]:cursor-not-allowed has-[[data-disabled]]:opacity-50 cursor-pointer\",\n variant !== \"error\" &&\n \"hover:not-has-[[data-disabled]]:bg-kumo-tint\",\n ),\n className,\n )}\n >\n <div className=\"flex min-w-0 flex-1 flex-col gap-0.5\">\n <span className=\"text-base font-medium text-kumo-default\">\n {label}\n </span>\n {description && (\n <span className=\"text-sm text-kumo-subtle\">{description}</span>\n )}\n </div>\n <BaseRadio.Root\n ref={ref}\n value={value}\n disabled={disabled}\n className={cn(\n \"relative mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-0 bg-kumo-base ring ring-2 focus:outline-none focus:ring-kumo-focus focus-visible:ring-2 focus-visible:ring-kumo-brand\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-line\",\n !disabled &&\n variant !== \"error\" &&\n \"group-hover:ring-kumo-hairline focus-visible:outline-offset-3\",\n !disabled &&\n variant === \"error\" &&\n \"focus-visible:outline-offset-3\",\n \"data-[checked]:bg-kumo-contrast\",\n )}\n >\n <BaseRadio.Indicator\n keepMounted\n className=\"flex items-center justify-center\"\n >\n <span className=\"h-2 w-2 rounded-full bg-kumo-base\" />\n </BaseRadio.Indicator>\n </BaseRadio.Root>\n </label>\n );\n }\n\n return (\n <label\n className={cn(\n \"m-0 group relative inline-flex items-center gap-2\",\n // \"start\" (default): radio before label\n // \"end\": label before radio using flex-row-reverse\n effectiveControlPosition === \"end\" && \"flex-row-reverse justify-end\",\n disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\",\n className,\n )}\n >\n <BaseRadio.Root\n ref={ref}\n value={value}\n disabled={disabled}\n className={cn(\n \"relative flex h-4 w-4 items-center justify-center rounded-full border-0 bg-kumo-base ring focus:outline-none after:absolute after:-inset-x-3 after:-inset-y-2\",\n variant === \"error\" ? \"ring-kumo-danger\" : \"ring-kumo-line\",\n !disabled &&\n variant !== \"error\" &&\n \"group-hover:ring-kumo-hairline focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3\",\n !disabled &&\n variant === \"error\" &&\n \"focus:ring-kumo-focus focus:ring-2 focus-visible:ring-2 focus-visible:ring-kumo-brand focus-visible:outline-offset-3\",\n \"data-[checked]:bg-kumo-contrast\",\n )}\n >\n <BaseRadio.Indicator\n keepMounted\n className=\"flex items-center justify-center\"\n >\n <span className=\"h-2 w-2 rounded-full bg-kumo-base\" />\n </BaseRadio.Indicator>\n </BaseRadio.Root>\n <span className=\"text-base text-kumo-default\">{label}</span>\n </label>\n );\n },\n);\n\nRadioItem.displayName = \"Radio.Item\";\n\n// Radio.Legend — composable legend sub-component for Radio.Group\nfunction RadioLegend({ children, className }: RadioLegendProps) {\n return (\n <Fieldset.Legend\n className={cn(\"text-base font-medium text-kumo-default\", className)}\n >\n {children}\n </Fieldset.Legend>\n );\n}\n\nRadioLegend.displayName = \"Radio.Legend\";\n\n// Radio.Group with built-in Fieldset and RadioGroup\nfunction RadioGroup({\n legend,\n children,\n orientation = \"vertical\",\n appearance = \"default\",\n error,\n description,\n defaultValue,\n value,\n onValueChange,\n disabled,\n controlPosition,\n name,\n className,\n}: RadioGroupProps) {\n return (\n <RadioGroupContext.Provider value={{ controlPosition, appearance }}>\n <BaseRadioGroup\n defaultValue={defaultValue}\n value={value}\n onValueChange={(newValue) => onValueChange?.(newValue)}\n disabled={disabled}\n name={name}\n >\n <Fieldset.Root\n disabled={disabled}\n className={cn(\"flex flex-col gap-4\", className)}\n >\n {legend && (\n <Fieldset.Legend className=\"text-base font-medium text-kumo-default\">\n {legend}\n </Fieldset.Legend>\n )}\n <div\n className={cn(\n orientation === \"vertical\"\n ? cn(\"flex flex-col\", appearance === \"card\" ? \"gap-3\" : \"gap-2\")\n : appearance === \"card\"\n ? \"grid grid-cols-2 gap-3\"\n : \"flex flex-row flex-wrap gap-2\",\n )}\n >\n {children}\n </div>\n {error && <p className=\"text-sm text-kumo-danger\">{error}</p>}\n {description && (\n <p className=\"text-sm text-kumo-subtle\">{description}</p>\n )}\n </Fieldset.Root>\n </BaseRadioGroup>\n </RadioGroupContext.Provider>\n );\n}\n\nRadioGroup.displayName = \"Radio.Group\";\n\n// Export RadioGroup directly for external usage\nexport { RadioGroup };\n\n/**\n * Radio — radio button group for single-select choices.\n *\n * Compound component: `Radio.Group` (with built-in Fieldset), `Radio.Item`, and `Radio.Legend`.\n * Built on `@base-ui/react/radio-group` + `@base-ui/react/radio`.\n *\n * @example\n * ```tsx\n * // Simple: legend as a string prop\n * <Radio.Group legend=\"Notification preference\" defaultValue=\"email\">\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * <Radio.Item label=\"Push\" value=\"push\" />\n * </Radio.Group>\n *\n * // Composable: Radio.Legend for full styling control (e.g. visually hidden)\n * <Radio.Group defaultValue=\"email\">\n * <Radio.Legend className=\"sr-only\">Notification preference</Radio.Legend>\n * <Radio.Item label=\"Email\" value=\"email\" />\n * <Radio.Item label=\"SMS\" value=\"sms\" />\n * </Radio.Group>\n * ```\n */\nexport const Radio = Object.assign(RadioGroup, {\n Item: RadioItem,\n Group: RadioGroup,\n Legend: RadioLegend,\n});\n"],"names":["KUMO_RADIO_VARIANTS","KUMO_RADIO_DEFAULT_VARIANTS","radioVariants","variant","appearance","cn","resolveVariant","RadioGroupContext","createContext","RadioItem","forwardRef","className","disabled","appearanceProp","label","description","value","ref","controlPosition","groupAppearance","useContext","isCard","effectiveControlPosition","jsxs","jsx","BaseRadio.Root","BaseRadio.Indicator","RadioLegend","children","Fieldset.Legend","RadioGroup","legend","orientation","error","defaultValue","onValueChange","name","BaseRadioGroup","newValue","Fieldset.Root","Radio"],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
function t(n, o, e) {
|
|
3
|
+
const r = n[o];
|
|
4
|
+
return r !== void 0 ? r : (process.env.NODE_ENV !== "production" && console.warn(
|
|
5
|
+
`[kumo] Unknown variant "${o}". Expected one of: ${Object.keys(n).join(", ")}. Falling back to "${e}".`
|
|
6
|
+
), n[e]);
|
|
7
|
+
}
|
|
8
|
+
export {
|
|
9
|
+
t as r
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=resolve-variant-gw6eh7fa4st8ej7m.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"resolve-variant-gw6eh7fa4st8ej7m.js","sources":["../../src/utils/resolve-variant.ts"],"sourcesContent":["/**\n * Safely resolve a variant config from a variants map, falling back\n * to a known-good default when the key doesn't match any entry.\n *\n * This prevents `TypeError: Cannot read properties of undefined`\n * when a component receives an invalid variant value at runtime\n * (e.g. from untyped JS consumers, server data, or stale props).\n *\n * @param variants – A dimension of a KUMO_*_VARIANTS object\n * (e.g. `KUMO_BUTTON_VARIANTS.variant`)\n * @param key – The runtime value of the variant prop\n * @param fallback – A key guaranteed to exist (typically from\n * KUMO_*_DEFAULT_VARIANTS)\n * @returns The matched config entry, or the fallback entry\n *\n * @example\n * ```ts\n * const config = resolveVariant(\n * KUMO_BUTTON_VARIANTS.variant,\n * variant,\n * KUMO_BUTTON_DEFAULT_VARIANTS.variant,\n * );\n * // config.classes is always safe to access\n * ```\n */\nexport function resolveVariant<T extends Record<string, unknown>>(\n variants: T,\n key: string,\n fallback: keyof T & string,\n): T[keyof T] {\n const config = (variants as Record<string, unknown>)[key] as\n | T[keyof T]\n | undefined;\n\n if (config !== undefined) return config;\n\n if (process.env.NODE_ENV !== \"production\") {\n console.warn(\n `[kumo] Unknown variant \"${key}\". Expected one of: ${Object.keys(variants).join(\", \")}. Falling back to \"${fallback}\".`,\n );\n }\n\n return variants[fallback];\n}\n"],"names":["resolveVariant","variants","key","fallback","config"],"mappings":";AAyBO,SAASA,EACdC,GACAC,GACAC,GACY;AACZ,QAAMC,IAAUH,EAAqCC,CAAG;AAIxD,SAAIE,MAAW,SAAkBA,KAE7B,QAAQ,IAAI,aAAa,gBAC3B,QAAQ;AAAA,IACN,2BAA2BF,CAAG,uBAAuB,OAAO,KAAKD,CAAQ,EAAE,KAAK,IAAI,CAAC,sBAAsBE,CAAQ;AAAA,EAAA,GAIhHF,EAASE,CAAQ;AAC1B;"}
|
|
@@ -3,10 +3,10 @@ import { jsxs as m, jsx as a } from "react/jsx-runtime";
|
|
|
3
3
|
import { CaretUpDownIcon as R, CheckIcon as B } from "@phosphor-icons/react";
|
|
4
4
|
import { useId as W, forwardRef as p } from "react";
|
|
5
5
|
import { c as o } from "./cn-ct4n7r74mh8y0f48.js";
|
|
6
|
-
import { b as q } from "./button-
|
|
7
|
-
import { K as H } from "./input-
|
|
6
|
+
import { b as q } from "./button-dh366jtvswxj0fw3.js";
|
|
7
|
+
import { K as H } from "./input-2y9vg81trmamkb6k.js";
|
|
8
8
|
import { S as J } from "./skeleton-line-epxenksfesr2fkcv.js";
|
|
9
|
-
import { F as Q } from "./field-
|
|
9
|
+
import { F as Q } from "./field-dgf36p7cmz1crlnu.js";
|
|
10
10
|
import { u as X } from "./portal-provider-hwmkdmkpvct0cb76.js";
|
|
11
11
|
import { a$ as Y, b0 as Z, b1 as ee, b2 as te, b3 as ae, b4 as se, b5 as le, b6 as oe, b7 as ie, b8 as ne, b9 as re, ba as ce, bb as de, S as ue } from "./vendor-base-ui-ie71jahf0czyf58j.js";
|
|
12
12
|
H.size;
|
|
@@ -212,4 +212,4 @@ d.Option.displayName = "Select.Option";
|
|
|
212
212
|
export {
|
|
213
213
|
d as S
|
|
214
214
|
};
|
|
215
|
-
//# sourceMappingURL=select-
|
|
215
|
+
//# sourceMappingURL=select-j8evv2iblgs5fa9s.js.map
|