@logicplanes/kaeso-ui 0.4.4 → 0.4.5

package/ai/icons.md

@@ -1,6 +1,6 @@
 # Icon vocabulary
 
-Version 0.4.4. Generated from `src/icons/vocabulary.ts`; do not edit. Use the name, never an icon picked by look: `icons.key` always means a key. Hugeicons, Stroke Rounded. Rules: `foundations/icons.md`.
+Version 0.4.5. Generated from `src/icons/vocabulary.ts`; do not edit. Use the name, never an icon picked by look: `icons.key` always means a key. Hugeicons, Stroke Rounded. Rules: `foundations/icons.md`.
 
 ## Kaeso objects
 

package/ai/tokens.md

@@ -1,6 +1,6 @@
 # @logicplanes/kaeso-ui tokens
 
-Version 0.4.4. Generated from `@logicplanes/kaeso-tokens`; do not edit. Components use these through role names (`bg-panel`, `text-fg-secondary`, `h-36`, `rounded-pill`); a raw value never appears in a component. How to use them: `foundations/*.md`.
+Version 0.4.5. Generated from `@logicplanes/kaeso-tokens`; do not edit. Components use these through role names (`bg-panel`, `text-fg-secondary`, `h-36`, `rounded-pill`); a raw value never appears in a component. How to use them: `foundations/*.md`.
 
 ## Neutrals
 
@@ -13,16 +13,18 @@ Version 0.4.4. Generated from `@logicplanes/kaeso-tokens`; do not edit. Componen
 | `--k-fill-2` | #ebebeb | #1c1c1c |
 | `--k-fill-3` | #e0e0e0 | #262626 |
 | `--k-line-subtle` | #f0f0f0 | #171717 |
-| `--k-line` | #e5e5e5 | #222222 |
-| `--k-line-strong` | #d4d4d4 | #333333 |
+| `--k-line` | #e5e5e5 | #2a2a2a |
+| `--k-line-strong` | #d4d4d4 | #3a3a3a |
 | `--k-line-field` | #858585 | #757575 |
 | `--k-line-field-hover` | #707070 | #858585 |
 | `--k-switch-thumb` | #ffffff | #c7c7c7 |
 | `--k-text` | #0a0a0a | #fafafa |
-| `--k-text-secondary` | #666666 | #a3a3a3 |
-| `--k-text-tertiary` | #707070 | #858585 |
-| `--k-text-disabled` | #b8b8b8 | #4d4d4d |
+| `--k-text-secondary` | #595959 | #b3b3b3 |
+| `--k-text-tertiary` | #696969 | #999999 |
+| `--k-text-disabled` | #b8b8b8 | #5c5c5c |
 | `--k-ink` | #0a0a0a | #fafafa |
+| `--k-ink-hover` | #262626 | #e0e0e0 |
+| `--k-ink-pressed` | #1a1a1a | #d4d4d4 |
 | `--k-on-ink` | #ffffff | #000000 |
 | `--k-focus` | #0a0a0a | #fafafa |
 | `--k-overlay` | rgb(0 0 0 / 0.24) | rgb(0 0 0 / 0.72) |
@@ -38,6 +40,8 @@ Version 0.4.4. Generated from `@logicplanes/kaeso-tokens`; do not edit. Componen
 | `--k-toast-danger` | #f87171 | #f87171 |
 | `--k-item-hover` | #f5f5f5 | #222222 |
 | `--k-item-pressed` | #ebebeb | #2b2b2b |
+| `--k-raised-hover` | #f5f5f5 | #1c1c1c |
+| `--k-raised-pressed` | #ebebeb | #262626 |
 | `--k-control-on-fill` | #ffffff | #222222 |
 | `--k-control-on-fill-hover` | #fafafa | #2b2b2b |
 | `--k-bg-tooltip` | #ffffff | #1c1c1c |
@@ -48,28 +52,28 @@ Version 0.4.4. Generated from `@logicplanes/kaeso-tokens`; do not edit. Componen
 |---|---|---|
 | `--k-success` | #22c55e | #22c55e |
 | `--k-success-text` | #166534 | #4ade80 |
-| `--k-success-tint` | #f0fdf4 | color-mix(in oklab, #22c55e 20%, #000) |
+| `--k-success-tint` | #f0fdf4 | #18231a |
 | `--k-warning` | #f59e0b | #f59e0b |
 | `--k-warning-text` | #92400e | #fbbf24 |
-| `--k-warning-tint` | #fffbeb | color-mix(in oklab, #f59e0b 20%, #000) |
+| `--k-warning-tint` | #fffbeb | #272017 |
 | `--k-danger` | #ef4444 | #ef4444 |
 | `--k-danger-text` | #b91c1c | #f87171 |
-| `--k-danger-tint` | #fef2f2 | color-mix(in oklab, #ef4444 22%, #000) |
+| `--k-danger-tint` | #fef2f2 | #281918 |
 | `--k-info` | #3b82f6 | #3b82f6 |
 | `--k-info-text` | #1d4ed8 | #60a5fa |
-| `--k-info-tint` | #eff6ff | color-mix(in oklab, #3b82f6 22%, #000) |
+| `--k-info-tint` | #eff6ff | #171d28 |
 
 ## Data
 
 | Variable | Series | Light | Dark |
 |---|---|---|---|
 | `--k-viz-1` | blue | #3b82f6 | #60a5fa |
-| `--k-viz-2` | amber | #f59e0b | #fbbf24 |
-| `--k-viz-3` | emerald | #10b981 | #34d399 |
+| `--k-viz-2` | amber | #cc6d05 | #fbbf24 |
+| `--k-viz-3` | emerald | #059669 | #34d399 |
 | `--k-viz-4` | rose | #f43f5e | #fb7185 |
 | `--k-viz-5` | violet | #8b5cf6 | #a78bfa |
-| `--k-viz-6` | teal | #14b8a6 | #2dd4bf |
-| `--k-viz-7` | orange | #f97316 | #fb923c |
+| `--k-viz-6` | teal | #0d9488 | #2dd4bf |
+| `--k-viz-7` | orange | #ea580c | #fb923c |
 | `--k-viz-8` | fuchsia | #d946ef | #e879f9 |
 
 ## Type

package/dist/blocks/delete-resource.js

@@ -1,6 +1,6 @@
 "use client";
 import { i as e } from "../chunks/context-BELWW79w.js";
-import { t } from "../chunks/dialog-Cg9A_6SF.js";
+import { t } from "../chunks/dialog-2zb6ClNR.js";
 import { forwardRef as n } from "react";
 import { jsx as r } from "react/jsx-runtime";
 //#region src/blocks/delete-resource/delete-resource.tsx
@@ -11,9 +11,9 @@ var i = { confirm: {
 	let m = e();
 	return /* @__PURE__ */ r(t, {
 		ref: p,
-		title: o === void 0 ? m("deleteResource.deleteTitle", "Delete this {kind}?", { kind: n }) : m("deleteResource.title", "{verb} this {kind}?", {
+		title: o === void 0 ? m("deleteResource.deleteTitle", "Delete “{name}”?", { name: i }) : m("deleteResource.title", "{verb} “{name}”?", {
 			verb: o,
-			kind: n
+			name: i
 		}),
 		description: a,
 		confirmLabel: o === void 0 ? m("deleteResource.deleteConfirm", "Delete {kind}", { kind: n }) : m("deleteResource.confirm", "{verb} {kind}", {

package/dist/blocks/delete-resource.js.map

@@ -1 +1 @@
-{"version":3,"file":"delete-resource.js","names":["useUiText","KAESO_DELETE_RESOURCE_VARIANTS","KAESO_DELETE_RESOURCE_DEFAULT_VARIANTS","DeleteResource","t","AlertDialog","verb","consequence","confirm","name","trigger","open","onOpenChange","inline"],"sources":["../../src/blocks/delete-resource/delete-resource.tsx"],"sourcesContent":["import { forwardRef, type ReactElement, type ReactNode } from \"react\";\nimport { AlertDialog } from \"../../components/dialog/dialog.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_DELETE_RESOURCE_VARIANTS = {\n  confirm: {\n    typed: { classes: \"\" },\n    simple: { classes: \"\" },\n  },\n} as const;\nexport const KAESO_DELETE_RESOURCE_DEFAULT_VARIANTS = { confirm: \"typed\" } as const;\n\nexport interface DeleteResourceProps {\n  kind: string;\n  name: string;\n  consequence: ReactNode;\n  verb?: string | undefined;\n  confirm?: keyof typeof KAESO_DELETE_RESOURCE_VARIANTS.confirm | undefined;\n  onConfirm: () => void | Promise<void>;\n  trigger?: ReactElement | undefined;\n  open?: boolean | undefined;\n  onOpenChange?: ((open: boolean) => void) | undefined;\n  inline?: boolean | undefined;\n}\n\nexport const DeleteResource = /* @__PURE__ */ forwardRef<HTMLDivElement, DeleteResourceProps>(function DeleteResource(\n  { kind, name, consequence, verb, confirm = \"typed\", onConfirm, trigger, open, onOpenChange, inline },\n  ref,\n) {\n  const t = useUiText();\n  return (\n    <AlertDialog\n      ref={ref}\n      title={\n        verb === undefined ? t(\"deleteResource.deleteTitle\", \"Delete this {kind}?\", { kind }) : t(\"deleteResource.title\", \"{verb} this {kind}?\", { verb, kind })\n      }\n      description={consequence}\n      confirmLabel={\n        verb === undefined ? t(\"deleteResource.deleteConfirm\", \"Delete {kind}\", { kind }) : t(\"deleteResource.confirm\", \"{verb} {kind}\", { verb, kind })\n      }\n      onConfirm={onConfirm}\n      tone=\"danger\"\n      {...(confirm === \"typed\" ? { confirmText: name } : {})}\n      {...(trigger ? { trigger } : {})}\n      {...(open !== undefined ? { open } : {})}\n      {...(onOpenChange ? { onOpenChange } : {})}\n      {...(inline ? { inline } : {})}\n    />\n  );\n});\nif (process.env.NODE_ENV !== \"production\") DeleteResource.displayName = \"DeleteResource\";\n"],"mappings":";;;;;;AAIA,IAAaC,IAAiC,EAC5C,SAAS;CACP,OAAO,EAAE,SAAS,GAAG;CACrB,QAAQ,EAAE,SAAS,GAAG;AACxB,EACF,GACaC,IAAyC,EAAE,SAAS,QAAQ,GAe5DC,IAAiC,kBAAgD,SAC5F,EAAE,SAAM,SAAM,gBAAa,SAAM,aAAU,SAAS,cAAW,YAAS,SAAM,iBAAc,aAC5F,GACA;CACA,IAAMC,IAAIJ,EAAU;CACpB,OACE,kBAACK,GAAD;EACO;EACL,OACEC,MAAS,KAAA,IAAYF,EAAE,8BAA8B,uBAAuB,EAAE,QAAK,CAAC,IAAIA,EAAE,wBAAwB,uBAAuB;GAAE;GAAM;EAAK,CAAC;EAEzJ,aAAaG;EACb,cACED,MAAS,KAAA,IAAYF,EAAE,gCAAgC,iBAAiB,EAAE,QAAK,CAAC,IAAIA,EAAE,0BAA0B,iBAAiB;GAAE;GAAM;EAAK,CAAC;EAEtI;EACX,MAAK;EACL,GAAKI,MAAY,UAAU,EAAE,aAAaC,EAAK,IAAI,CAAC;EACpD,GAAKC,IAAU,EAAE,WAAQ,IAAI,CAAC;EAC9B,GAAKC,MAAS,KAAA,IAAuB,CAAC,IAAZ,EAAE,QAAK;EACjC,GAAKC,IAAe,EAAE,gBAAa,IAAI,CAAC;EACxC,GAAKC,IAAS,EAAE,UAAO,IAAI,CAAC;CAC7B,CAAA;AAEL,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAe,cAAc"}
+{"version":3,"file":"delete-resource.js","names":["useUiText","KAESO_DELETE_RESOURCE_VARIANTS","KAESO_DELETE_RESOURCE_DEFAULT_VARIANTS","DeleteResource","t","AlertDialog","verb","consequence","confirm","name","trigger","open","onOpenChange","inline"],"sources":["../../src/blocks/delete-resource/delete-resource.tsx"],"sourcesContent":["import { forwardRef, type ReactElement, type ReactNode } from \"react\";\nimport { AlertDialog } from \"../../components/dialog/dialog.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_DELETE_RESOURCE_VARIANTS = {\n  confirm: {\n    typed: { classes: \"\" },\n    simple: { classes: \"\" },\n  },\n} as const;\nexport const KAESO_DELETE_RESOURCE_DEFAULT_VARIANTS = { confirm: \"typed\" } as const;\n\nexport interface DeleteResourceProps {\n  kind: string;\n  name: string;\n  consequence: ReactNode;\n  verb?: string | undefined;\n  confirm?: keyof typeof KAESO_DELETE_RESOURCE_VARIANTS.confirm | undefined;\n  onConfirm: () => void | Promise<void>;\n  trigger?: ReactElement | undefined;\n  open?: boolean | undefined;\n  onOpenChange?: ((open: boolean) => void) | undefined;\n  inline?: boolean | undefined;\n}\n\nexport const DeleteResource = /* @__PURE__ */ forwardRef<HTMLDivElement, DeleteResourceProps>(function DeleteResource(\n  { kind, name, consequence, verb, confirm = \"typed\", onConfirm, trigger, open, onOpenChange, inline },\n  ref,\n) {\n  const t = useUiText();\n  return (\n    <AlertDialog\n      ref={ref}\n      title={verb === undefined ? t(\"deleteResource.deleteTitle\", \"Delete “{name}”?\", { name }) : t(\"deleteResource.title\", \"{verb} “{name}”?\", { verb, name })}\n      description={consequence}\n      confirmLabel={\n        verb === undefined ? t(\"deleteResource.deleteConfirm\", \"Delete {kind}\", { kind }) : t(\"deleteResource.confirm\", \"{verb} {kind}\", { verb, kind })\n      }\n      onConfirm={onConfirm}\n      tone=\"danger\"\n      {...(confirm === \"typed\" ? { confirmText: name } : {})}\n      {...(trigger ? { trigger } : {})}\n      {...(open !== undefined ? { open } : {})}\n      {...(onOpenChange ? { onOpenChange } : {})}\n      {...(inline ? { inline } : {})}\n    />\n  );\n});\nif (process.env.NODE_ENV !== \"production\") DeleteResource.displayName = \"DeleteResource\";\n"],"mappings":";;;;;;AAIA,IAAaC,IAAiC,EAC5C,SAAS;CACP,OAAO,EAAE,SAAS,GAAG;CACrB,QAAQ,EAAE,SAAS,GAAG;AACxB,EACF,GACaC,IAAyC,EAAE,SAAS,QAAQ,GAe5DC,IAAiC,kBAAgD,SAC5F,EAAE,SAAM,SAAM,gBAAa,SAAM,aAAU,SAAS,cAAW,YAAS,SAAM,iBAAc,aAC5F,GACA;CACA,IAAMC,IAAIJ,EAAU;CACpB,OACE,kBAACK,GAAD;EACO;EACL,OAAOC,MAAS,KAAA,IAAYF,EAAE,8BAA8B,oBAAoB,EAAE,QAAK,CAAC,IAAIA,EAAE,wBAAwB,oBAAoB;GAAE;GAAM;EAAK,CAAC;EACxJ,aAAaG;EACb,cACED,MAAS,KAAA,IAAYF,EAAE,gCAAgC,iBAAiB,EAAE,QAAK,CAAC,IAAIA,EAAE,0BAA0B,iBAAiB;GAAE;GAAM;EAAK,CAAC;EAEtI;EACX,MAAK;EACL,GAAKI,MAAY,UAAU,EAAE,aAAaC,EAAK,IAAI,CAAC;EACpD,GAAKC,IAAU,EAAE,WAAQ,IAAI,CAAC;EAC9B,GAAKC,MAAS,KAAA,IAAuB,CAAC,IAAZ,EAAE,QAAK;EACjC,GAAKC,IAAe,EAAE,gBAAa,IAAI,CAAC;EACxC,GAAKC,IAAS,EAAE,UAAO,IAAI,CAAC;CAC7B,CAAA;AAEL,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAe,cAAc"}

package/dist/blocks/pages.js

@@ -1,70 +1,75 @@
 "use client";
-import { t as e } from "../chunks/cn-Dj6sRgkF.js";
-import { t } from "../chunks/app-frame-DogGRmsu.js";
-import { r as n } from "../chunks/page-header-DL2y2iZp.js";
-import { t as r } from "../chunks/empty-DvhyMXQq.js";
-import { a as i, t as a } from "../chunks/section-Ce1efbsP.js";
-import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import { t as e } from "../chunks/app-frame-DysOel2X.js";
+import { r as t } from "../chunks/page-header-kS5tdmvb.js";
+import { t as n } from "../chunks/empty-BpiUgGzm.js";
+import { a as r, t as i } from "../chunks/section-CFBYhsUi.js";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/blocks/pages/pages.tsx
-var l = { page: {
+var c = { page: {
 	list: { classes: "" },
 	table: { classes: "" },
 	overview: { classes: "" },
 	empty: { classes: "" },
 	auth: { classes: "" }
-} }, u = { page: "list" };
-function d({ header: e, toolbar: r, children: i, sheet: a }) {
-	return /* @__PURE__ */ c(o, { children: [
-		/* @__PURE__ */ s(n, {
-			start: /* @__PURE__ */ s(t.MenuButton, {}),
-			...e
+} }, l = { page: "list" };
+function u({ header: n, toolbar: r, children: i, sheet: c }) {
+	return /* @__PURE__ */ s(a, { children: [
+		/* @__PURE__ */ o(t, {
+			start: /* @__PURE__ */ o(e.MenuButton, {}),
+			...n
 		}),
 		r,
-		/* @__PURE__ */ s(t.Body, { children: i }),
-		a
+		/* @__PURE__ */ o(e.Body, {
+			padding: "list",
+			children: i
+		}),
+		c
 	] });
 }
-process.env.NODE_ENV !== "production" && (d.displayName = "ListPage");
-var f = d;
-function p({ header: e, metrics: r, controls: a, chart: l, children: u, aside: d }) {
-	let f = /* @__PURE__ */ c("div", {
-		className: "flex flex-col gap-40",
+process.env.NODE_ENV !== "production" && (u.displayName = "ListPage");
+var d = u;
+function f({ header: n, metrics: i, controls: c, chart: l, children: u, aside: d }) {
+	let f = /* @__PURE__ */ s("div", {
+		className: "flex flex-col gap-48",
 		children: [
-			/* @__PURE__ */ c("div", {
+			/* @__PURE__ */ s("div", {
 				className: "flex flex-wrap items-end justify-between gap-16",
-				children: [r, a && /* @__PURE__ */ s("div", {
+				children: [i, c && /* @__PURE__ */ o("div", {
 					className: "flex items-center gap-8",
-					children: a
+					children: c
 				})]
 			}),
 			l,
 			u
 		]
 	});
-	return /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s(n, {
-		start: /* @__PURE__ */ s(t.MenuButton, {}),
-		...e
-	}), /* @__PURE__ */ s(t.Body, { children: /* @__PURE__ */ s("div", {
-		className: "px-24 pt-24 pb-64",
-		children: d ? /* @__PURE__ */ s(i, {
+	return /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o(t, {
+		start: /* @__PURE__ */ o(e.MenuButton, {}),
+		...n
+	}), /* @__PURE__ */ o(e.Body, {
+		padding: "page",
+		children: d ? /* @__PURE__ */ o(r, {
 			aside: d,
 			children: f
 		}) : f
-	}) })] });
+	})] });
 }
-process.env.NODE_ENV !== "production" && (p.displayName = "OverviewPage");
-function m({ header: i, ...a }) {
-	return /* @__PURE__ */ c(o, { children: [i && /* @__PURE__ */ s(n, {
-		start: /* @__PURE__ */ s(t.MenuButton, {}),
-		...i
-	}), /* @__PURE__ */ s(t.Body, { children: /* @__PURE__ */ s("div", {
-		className: e("flex min-h-full items-center justify-center px-24"),
-		children: /* @__PURE__ */ s(r, { ...a })
-	}) })] });
+process.env.NODE_ENV !== "production" && (f.displayName = "OverviewPage");
+function p({ header: r, ...i }) {
+	return /* @__PURE__ */ s(a, { children: [r && /* @__PURE__ */ o(t, {
+		start: /* @__PURE__ */ o(e.MenuButton, {}),
+		...r
+	}), /* @__PURE__ */ s(e.Body, {
+		className: "relative",
+		children: [!r && /* @__PURE__ */ o(e.MenuButton, { className: "absolute top-10 left-24 z-10" }), /* @__PURE__ */ o("div", {
+			className: "flex min-h-full items-center justify-center px-24",
+			children: /* @__PURE__ */ o(n, { ...i })
+		})]
+	})] });
 }
-process.env.NODE_ENV !== "production" && (m.displayName = "EmptyPage");
-var h = a;
+process.env.NODE_ENV !== "production" && (p.displayName = "EmptyPage");
+var m = i;
 //#endregion
-export { h as AuthPage, m as EmptyPage, u as KAESO_PAGES_DEFAULT_VARIANTS, l as KAESO_PAGES_VARIANTS, d as ListPage, p as OverviewPage, f as TablePage };
+export { m as AuthPage, p as EmptyPage, l as KAESO_PAGES_DEFAULT_VARIANTS, c as KAESO_PAGES_VARIANTS, u as ListPage, f as OverviewPage, d as TablePage };
 
 //# sourceMappingURL=pages.js.map

package/dist/blocks/pages.js.map

@@ -1 +1 @@
-{"version":3,"file":"pages.js","names":["_Fragment","cn","PageHeader","Empty","SplitView","AuthLayout","KAESO_PAGES_VARIANTS","KAESO_PAGES_DEFAULT_VARIANTS","ListPage","Fragment","AppFrame","header","toolbar","sheet","TablePage","OverviewPage","main","metrics","controls","chart","children","aside","EmptyPage","empty","AuthPage"],"sources":["../../src/blocks/pages/pages.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { AppFrame } from \"../../components/app-frame/app-frame.js\";\nimport { PageHeader, type PageHeaderProps } from \"../../components/page-header/page-header.js\";\nimport { Empty, type EmptyProps } from \"../../components/empty/empty.js\";\nimport { AuthLayout } from \"../../components/section/section.js\";\nimport { SplitView } from \"../../components/section/section.js\";\n\nexport const KAESO_PAGES_VARIANTS = {\n  page: {\n    list: { classes: \"\" },\n    table: { classes: \"\" },\n    overview: { classes: \"\" },\n    empty: { classes: \"\" },\n    auth: { classes: \"\" },\n  },\n} as const;\nexport const KAESO_PAGES_DEFAULT_VARIANTS = { page: \"list\" } as const;\n\nexport interface ListPageProps {\n  header: PageHeaderProps;\n  toolbar?: ReactNode | undefined;\n  children: ReactNode;\n  sheet?: ReactNode | undefined;\n}\n\nexport function ListPage({ header, toolbar, children, sheet }: ListPageProps) {\n  return (\n    <>\n      <PageHeader start={<AppFrame.MenuButton />} {...header} />\n      {toolbar}\n      <AppFrame.Body>{children}</AppFrame.Body>\n      {sheet}\n    </>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") ListPage.displayName = \"ListPage\";\n\nexport const TablePage = ListPage;\n\nexport function OverviewPage({\n  header,\n  metrics,\n  controls,\n  chart,\n  children,\n  aside,\n}: {\n  header: PageHeaderProps;\n  metrics: ReactNode;\n  controls?: ReactNode | undefined;\n  chart?: ReactNode | undefined;\n  children?: ReactNode | undefined;\n  aside?: ReactNode | undefined;\n}) {\n  const main = (\n    <div className=\"flex flex-col gap-40\">\n      <div className=\"flex flex-wrap items-end justify-between gap-16\">\n        {metrics}\n        {controls && <div className=\"flex items-center gap-8\">{controls}</div>}\n      </div>\n      {chart}\n      {children}\n    </div>\n  );\n  return (\n    <>\n      <PageHeader start={<AppFrame.MenuButton />} {...header} />\n      <AppFrame.Body>\n        <div className=\"px-24 pt-24 pb-64\">{aside ? <SplitView aside={aside}>{main}</SplitView> : main}</div>\n      </AppFrame.Body>\n    </>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") OverviewPage.displayName = \"OverviewPage\";\n\nexport function EmptyPage({ header, ...empty }: { header?: PageHeaderProps | undefined } & EmptyProps) {\n  return (\n    <>\n      {header && <PageHeader start={<AppFrame.MenuButton />} {...header} />}\n      <AppFrame.Body>\n        <div className={cn(\"flex min-h-full items-center justify-center px-24\")}>\n          <Empty {...empty} />\n        </div>\n      </AppFrame.Body>\n    </>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") EmptyPage.displayName = \"EmptyPage\";\n\nexport const AuthPage = AuthLayout;\n"],"mappings":";;;;;;;;AAQA,IAAaM,IAAuB,EAClC,MAAM;CACJ,MAAM,EAAE,SAAS,GAAG;CACpB,OAAO,EAAE,SAAS,GAAG;CACrB,UAAU,EAAE,SAAS,GAAG;CACxB,OAAO,EAAE,SAAS,GAAG;CACrB,MAAM,EAAE,SAAS,GAAG;AACtB,EACF,GACaC,IAA+B,EAAE,MAAM,OAAO;AAS3D,SAAgBC,EAAS,EAAE,WAAQ,YAAS,aAAU,YAAwB;CAC5E,OACE,kBAAAR,GAAA,EAAA,UAAA;EACE,kBAACE,GAAD;GAAY,OAAO,kBAACQ,EAAS,YAAV,CAAsB,CAAA;GAAG,GAAIC;EAAS,CAAA;EACxDC;EACD,kBAACF,EAAS,MAAV,EAAgB,YAAwB,CAAA;EACvCG;CACD,EAAA,CAAA;AAEN;AACA,QAAA,IAAA,aAA6B,iBAAc,EAAS,cAAc;AAElE,IAAaC,IAAYN;AAEzB,SAAgBO,EAAa,EAC3B,WACA,YACA,aACA,UACA,aACA,YAQC;CACD,IAAMC,IACJ,kBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACE,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACGC,GACAC,KAAY,kBAAC,OAAD;KAAK,WAAU;KAA2B,UAAAA;IAAc,CAAA,CAClE;;GACJC;GACAC;EACE;;CAEP,OACE,kBAAApB,GAAA,EAAA,UAAA,CACE,kBAACE,GAAD;EAAY,OAAO,kBAACQ,EAAS,YAAV,CAAsB,CAAA;EAAG,GAAIC;CAAS,CAAA,GACzD,kBAACD,EAAS,MAAV,EAAA,UACE,kBAAC,OAAD;EAAK,WAAU;EAAqB,UAAAW,IAAQ,kBAACjB,GAAD;GAAkB;GAAQ,UAAAY;EAAgB,CAAA,IAAIA;CAAU,CAAA,EACvF,CAAA,CACf,EAAA,CAAA;AAEN;AACA,QAAA,IAAA,aAA6B,iBAAc,EAAa,cAAc;AAEtE,SAAgBM,EAAU,EAAE,WAAQ,GAAGC,KAAgE;CACrG,OACE,kBAAAvB,GAAA,EAAA,UAAA,CACGW,KAAU,kBAACT,GAAD;EAAY,OAAO,kBAACQ,EAAS,YAAV,CAAsB,CAAA;EAAG,GAAIC;CAAS,CAAA,GACpE,kBAACD,EAAS,MAAV,EAAA,UACE,kBAAC,OAAD;EAAK,WAAWT,EAAG,mDAAmD;EACpE,UAAA,kBAACE,GAAD,EAAO,GAAIoB,EAAQ,CAAA;CAChB,CAAA,EACQ,CAAA,CACf,EAAA,CAAA;AAEN;AACA,QAAA,IAAA,aAA6B,iBAAc,EAAU,cAAc;AAEnE,IAAaC,IAAWnB"}
+{"version":3,"file":"pages.js","names":["_Fragment","AppFrame","PageHeader","Empty","SplitView","AuthLayout","KAESO_PAGES_VARIANTS","KAESO_PAGES_DEFAULT_VARIANTS","ListPage","Fragment","header","toolbar","sheet","TablePage","OverviewPage","main","metrics","controls","chart","children","aside","EmptyPage","empty","AuthPage"],"sources":["../../src/blocks/pages/pages.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { AppFrame } from \"../../components/app-frame/app-frame.js\";\nimport { PageHeader, type PageHeaderProps } from \"../../components/page-header/page-header.js\";\nimport { Empty, type EmptyProps } from \"../../components/empty/empty.js\";\nimport { AuthLayout } from \"../../components/section/section.js\";\nimport { SplitView } from \"../../components/section/section.js\";\n\nexport const KAESO_PAGES_VARIANTS = {\n  page: {\n    list: { classes: \"\" },\n    table: { classes: \"\" },\n    overview: { classes: \"\" },\n    empty: { classes: \"\" },\n    auth: { classes: \"\" },\n  },\n} as const;\nexport const KAESO_PAGES_DEFAULT_VARIANTS = { page: \"list\" } as const;\n\nexport interface ListPageProps {\n  header: PageHeaderProps;\n  toolbar?: ReactNode | undefined;\n  children: ReactNode;\n  sheet?: ReactNode | undefined;\n}\n\nexport function ListPage({ header, toolbar, children, sheet }: ListPageProps) {\n  return (\n    <>\n      <PageHeader start={<AppFrame.MenuButton />} {...header} />\n      {toolbar}\n      <AppFrame.Body padding=\"list\">{children}</AppFrame.Body>\n      {sheet}\n    </>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") ListPage.displayName = \"ListPage\";\n\nexport const TablePage = ListPage;\n\nexport function OverviewPage({\n  header,\n  metrics,\n  controls,\n  chart,\n  children,\n  aside,\n}: {\n  header: PageHeaderProps;\n  metrics: ReactNode;\n  controls?: ReactNode | undefined;\n  chart?: ReactNode | undefined;\n  children?: ReactNode | undefined;\n  aside?: ReactNode | undefined;\n}) {\n  const main = (\n    <div className=\"flex flex-col gap-48\">\n      <div className=\"flex flex-wrap items-end justify-between gap-16\">\n        {metrics}\n        {controls && <div className=\"flex items-center gap-8\">{controls}</div>}\n      </div>\n      {chart}\n      {children}\n    </div>\n  );\n  return (\n    <>\n      <PageHeader start={<AppFrame.MenuButton />} {...header} />\n      <AppFrame.Body padding=\"page\">{aside ? <SplitView aside={aside}>{main}</SplitView> : main}</AppFrame.Body>\n    </>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") OverviewPage.displayName = \"OverviewPage\";\n\nexport function EmptyPage({ header, ...empty }: { header?: PageHeaderProps | undefined } & EmptyProps) {\n  return (\n    <>\n      {header && <PageHeader start={<AppFrame.MenuButton />} {...header} />}\n      <AppFrame.Body className=\"relative\">\n        {!header && <AppFrame.MenuButton className=\"absolute top-10 left-24 z-10\" />}\n        <div className=\"flex min-h-full items-center justify-center px-24\">\n          <Empty {...empty} />\n        </div>\n      </AppFrame.Body>\n    </>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") EmptyPage.displayName = \"EmptyPage\";\n\nexport const AuthPage = AuthLayout;\n"],"mappings":";;;;;;;AAOA,IAAaM,IAAuB,EAClC,MAAM;CACJ,MAAM,EAAE,SAAS,GAAG;CACpB,OAAO,EAAE,SAAS,GAAG;CACrB,UAAU,EAAE,SAAS,GAAG;CACxB,OAAO,EAAE,SAAS,GAAG;CACrB,MAAM,EAAE,SAAS,GAAG;AACtB,EACF,GACaC,IAA+B,EAAE,MAAM,OAAO;AAS3D,SAAgBC,EAAS,EAAE,WAAQ,YAAS,aAAU,YAAwB;CAC5E,OACE,kBAAAR,GAAA,EAAA,UAAA;EACE,kBAACE,GAAD;GAAY,OAAO,kBAACD,EAAS,YAAV,CAAsB,CAAA;GAAG,GAAIS;EAAS,CAAA;EACxDC;EACD,kBAACV,EAAS,MAAV;GAAe,SAAQ;GAAQ;EAAwB,CAAA;EACtDW;CACD,EAAA,CAAA;AAEN;AACA,QAAA,IAAA,aAA6B,iBAAc,EAAS,cAAc;AAElE,IAAaC,IAAYL;AAEzB,SAAgBM,EAAa,EAC3B,WACA,YACA,aACA,UACA,aACA,YAQC;CACD,IAAMC,IACJ,kBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACE,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACGC,GACAC,KAAY,kBAAC,OAAD;KAAK,WAAU;KAA2B,UAAAA;IAAc,CAAA,CAClE;;GACJC;GACAC;EACE;;CAEP,OACE,kBAAAnB,GAAA,EAAA,UAAA,CACE,kBAACE,GAAD;EAAY,OAAO,kBAACD,EAAS,YAAV,CAAsB,CAAA;EAAG,GAAIS;CAAS,CAAA,GACzD,kBAACT,EAAS,MAAV;EAAe,SAAQ;EAAQ,UAAAmB,IAAQ,kBAAChB,GAAD;GAAkB;GAAQ,UAAAW;EAAgB,CAAA,IAAIA;CAAoB,CAAA,CACzG,EAAA,CAAA;AAEN;AACA,QAAA,IAAA,aAA6B,iBAAc,EAAa,cAAc;AAEtE,SAAgBM,EAAU,EAAE,WAAQ,GAAGC,KAAgE;CACrG,OACE,kBAAAtB,GAAA,EAAA,UAAA,CACGU,KAAU,kBAACR,GAAD;EAAY,OAAO,kBAACD,EAAS,YAAV,CAAsB,CAAA;EAAG,GAAIS;CAAS,CAAA,GACpE,kBAACT,EAAS,MAAV;EAAe,WAAU;EAAzB,UAAA,CACG,CAACS,KAAU,kBAACT,EAAS,YAAV,EAAqB,WAAU,+BAAgC,CAAA,GAC3E,kBAAC,OAAD;GAAK,WAAU;GACb,UAAA,kBAACE,GAAD,EAAO,GAAImB,EAAQ,CAAA;EAChB,CAAA,CACQ;CACf,CAAA,CAAA,EAAA,CAAA;AAEN;AACA,QAAA,IAAA,aAA6B,iBAAc,EAAU,cAAc;AAEnE,IAAaC,IAAWlB"}

package/dist/blocks/resource-list.js

@@ -1,69 +1,82 @@
 "use client";
-import { i as e } from "../chunks/context-BELWW79w.js";
-import { o as t } from "../chunks/input-2VJuj_M4.js";
-import { r as n } from "../chunks/toolbar-WA_oZgu-.js";
-import { t as r } from "../chunks/empty-DvhyMXQq.js";
-import { i, o as a } from "../chunks/list-M1csq-d4.js";
-import { forwardRef as o, useMemo as s, useState as c } from "react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { i as e, r as t } from "../chunks/context-BELWW79w.js";
+import { n } from "../chunks/button-IblhXUyZ.js";
+import { o as r } from "../chunks/input-Bo5-UZg2.js";
+import { r as i } from "../chunks/toolbar-u0Gm7Q7-.js";
+import { t as a } from "../chunks/empty-BpiUgGzm.js";
+import { i as o, o as s } from "../chunks/list-B4G-sWwV.js";
+import { forwardRef as c, useMemo as l, useState as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/blocks/resource-list/resource-list.tsx
-var d = { grouping: {
+var p = { grouping: {
 	grouped: { classes: "" },
 	flat: { classes: "" }
-} }, f = { grouping: "grouped" };
-function p(e) {
+} }, m = { grouping: "grouped" };
+function h(e) {
 	return `${e.textValue ?? (typeof e.title == "string" ? e.title : "")} ${e.displayId ?? ""}`.toLowerCase();
 }
-var m = /* @__PURE__ */ o(function({ groups: o, onOpen: d, bulkActions: f = [], toolbar: m, emptyTitle: h, emptyDescription: g, emptyAction: _, "aria-label": v }, y) {
-	let b = e(), [x, S] = c(""), [C, w] = c(/* @__PURE__ */ new Set()), T = x.trim().toLowerCase(), E = s(() => o.map((e) => ({
+var g = /* @__PURE__ */ c(function({ groups: c, onOpen: p, bulkActions: m = [], toolbar: g, emptyTitle: _, emptyDescription: v, emptyAction: y, "aria-label": b }, x) {
+	let S = e(), C = t(), [w, T] = u(""), [E, D] = u(/* @__PURE__ */ new Set()), O = w.trim().toLowerCase(), k = l(() => c.map((e) => ({
 		...e,
-		items: e.items.filter((e) => !T || p(e).includes(T))
-	})).filter((e) => e.items.length > 0), [o, T]), D = s(() => {
-		let e = new Set(E.flatMap((e) => e.items.map((e) => e.id)));
-		return new Set([...C].filter((t) => e.has(t)));
-	}, [E, C]);
-	return /* @__PURE__ */ u("div", {
-		ref: y,
+		items: e.items.filter((e) => !O || h(e).includes(O))
+	})).filter((e) => e.items.length > 0), [c, O]), A = l(() => {
+		let e = new Set(k.flatMap((e) => e.items.map((e) => e.id)));
+		return new Set([...E].filter((t) => e.has(t)));
+	}, [k, E]), j = k.reduce((e, t) => e + t.items.length, 0), M = C === "en" && /^[A-Z][a-z]/.test(b) ? b[0].toLowerCase() + b.slice(1) : b;
+	return /* @__PURE__ */ f("div", {
+		ref: x,
 		className: "flex flex-col",
-		children: [/* @__PURE__ */ u(n, {
-			"aria-label": b("resourceList.filters", "Filters"),
-			children: [
-				m,
-				/* @__PURE__ */ l(n.Spacer, {}),
-				/* @__PURE__ */ l("div", {
-					className: "w-240",
-					children: /* @__PURE__ */ l(t, {
-						"aria-label": b("resourceList.search", "Search"),
-						placeholder: b("resourceList.search", "Search"),
-						value: x,
-						onChange: (e) => S(e.target.value),
-						onClear: () => S(""),
-						shortcut: ["/"]
+		children: [
+			/* @__PURE__ */ d("span", {
+				role: "status",
+				className: "sr-only",
+				children: O ? S("resourceList.results", "{count, plural, =0 {No results} one {# result} other {# results}}", { count: j }) : ""
+			}),
+			/* @__PURE__ */ f(i, {
+				"aria-label": S("resourceList.filters", "Filters"),
+				children: [
+					g,
+					/* @__PURE__ */ d(i.Spacer, {}),
+					/* @__PURE__ */ d("div", {
+						className: "w-240",
+						children: /* @__PURE__ */ d(r, {
+							"aria-label": S("resourceList.search", "Search"),
+							placeholder: S("resourceList.search", "Search"),
+							value: w,
+							onChange: (e) => T(e.target.value),
+							onClear: () => T(""),
+							shortcut: ["/"]
+						})
 					})
-				})
-			]
-		}), E.length === 0 ? /* @__PURE__ */ l(r, {
-			size: "md",
-			title: T ? b("resourceList.noMatches", "No matches") : h ?? b("resourceList.nothingHereYet", "Nothing here yet"),
-			...T ? { description: b("resourceList.tryShorterSearch", "Try a shorter search.") } : g ? { description: g } : {},
-			...!T && _ ? { actions: _ } : {}
-		}) : /* @__PURE__ */ l(i, {
-			"aria-label": v,
-			groups: E,
-			selectable: f.length > 0,
-			selected: D,
-			onSelectedChange: w,
-			...d ? { onOpen: d } : {},
-			selectionActions: f.map((e) => /* @__PURE__ */ l(a, {
-				...e.icon ? { icon: e.icon } : {},
-				onClick: () => e.onClick([...D]),
-				children: e.label
-			}, e.label))
-		})]
+				]
+			}),
+			k.length === 0 ? /* @__PURE__ */ d(a, {
+				size: "md",
+				title: O ? S("resourceList.noMatches", "No matches") : _ ?? S("resourceList.noneYet", "No {label} yet", { label: M }),
+				...O ? { description: S("resourceList.tryShorterSearch", "Try a shorter search.") } : v ? { description: v } : {},
+				...O ? { actions: /* @__PURE__ */ d(n, {
+					size: "sm",
+					onClick: () => T(""),
+					children: S("resourceList.clearSearch", "Clear search")
+				}) } : y ? { actions: y } : {}
+			}) : /* @__PURE__ */ d(o, {
+				"aria-label": b,
+				groups: k,
+				selectable: m.length > 0,
+				selected: A,
+				onSelectedChange: D,
+				...p ? { onOpen: p } : {},
+				selectionActions: m.map((e) => /* @__PURE__ */ d(s, {
+					...e.icon ? { icon: e.icon } : {},
+					onClick: () => e.onClick([...A]),
+					children: e.label
+				}, e.label))
+			})
+		]
 	});
 });
-process.env.NODE_ENV !== "production" && (m.displayName = "ResourceList");
+process.env.NODE_ENV !== "production" && (g.displayName = "ResourceList");
 //#endregion
-export { f as KAESO_RESOURCE_LIST_DEFAULT_VARIANTS, d as KAESO_RESOURCE_LIST_VARIANTS, m as ResourceList };
+export { m as KAESO_RESOURCE_LIST_DEFAULT_VARIANTS, p as KAESO_RESOURCE_LIST_VARIANTS, g as ResourceList };
 
 //# sourceMappingURL=resource-list.js.map

package/dist/blocks/resource-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"resource-list.js","names":["useUiText","SearchInput","Toolbar","Empty","SelectionAction","KAESO_RESOURCE_LIST_VARIANTS","KAESO_RESOURCE_LIST_DEFAULT_VARIANTS","searchText","i","ResourceList","ariaLabel","t","query","setQuery","useState","selected","setSelected","q","filtered","useMemo","groups","g","visibleSelection","shown","id","toolbar","emptyTitle","emptyDescription","emptyAction","List","bulkActions","onOpen","a"],"sources":["../../src/blocks/resource-list/resource-list.tsx"],"sourcesContent":["import { forwardRef, useMemo, useState, type ReactNode } from \"react\";\nimport { List, SelectionAction, type ListGroup, type ListItemData } from \"../../components/list/list.js\";\nimport { Toolbar } from \"../../components/toolbar/toolbar.js\";\nimport { SearchInput } from \"../../components/input/input.js\";\nimport { Empty } from \"../../components/empty/empty.js\";\nimport type { IconData } from \"../../components/icon/icon.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_RESOURCE_LIST_VARIANTS = {\n  grouping: {\n    grouped: { classes: \"\" },\n    flat: { classes: \"\" },\n  },\n} as const;\nexport const KAESO_RESOURCE_LIST_DEFAULT_VARIANTS = { grouping: \"grouped\" } as const;\n\nexport interface ResourceListProps {\n  groups: ListGroup[];\n  \"aria-label\": string;\n  onOpen?: ((item: ListItemData) => void) | undefined;\n  bulkActions?: { label: string; icon?: IconData | undefined; onClick: (ids: string[]) => void }[] | undefined;\n  toolbar?: ReactNode | undefined;\n  emptyTitle?: string | undefined;\n  emptyDescription?: string | undefined;\n  emptyAction?: ReactNode | undefined;\n}\n\nfunction searchText(i: ListItemData) {\n  return `${i.textValue ?? (typeof i.title === \"string\" ? i.title : \"\")} ${i.displayId ?? \"\"}`.toLowerCase();\n}\n\nexport const ResourceList = /* @__PURE__ */ forwardRef<HTMLDivElement, ResourceListProps>(function ResourceList(\n  { groups, onOpen, bulkActions = [], toolbar, emptyTitle, emptyDescription, emptyAction, \"aria-label\": ariaLabel },\n  ref,\n) {\n  const t = useUiText();\n  const [query, setQuery] = useState(\"\");\n  const [selected, setSelected] = useState<Set<string>>(new Set());\n  const q = query.trim().toLowerCase();\n  const filtered = useMemo(\n    () => groups.map((g) => ({ ...g, items: g.items.filter((i) => !q || searchText(i).includes(q)) })).filter((g) => g.items.length > 0),\n    [groups, q],\n  );\n  const visibleSelection = useMemo(() => {\n    const shown = new Set(filtered.flatMap((g) => g.items.map((i) => i.id)));\n    return new Set([...selected].filter((id) => shown.has(id)));\n  }, [filtered, selected]);\n  return (\n    <div ref={ref} className=\"flex flex-col\">\n      <Toolbar aria-label={t(\"resourceList.filters\", \"Filters\")}>\n        {toolbar}\n        <Toolbar.Spacer />\n        <div className=\"w-240\">\n          <SearchInput\n            aria-label={t(\"resourceList.search\", \"Search\")}\n            placeholder={t(\"resourceList.search\", \"Search\")}\n            value={query}\n            onChange={(e) => setQuery(e.target.value)}\n            onClear={() => setQuery(\"\")}\n            shortcut={[\"/\"]}\n          />\n        </div>\n      </Toolbar>\n      {filtered.length === 0 ? (\n        <Empty\n          size=\"md\"\n          title={q ? t(\"resourceList.noMatches\", \"No matches\") : (emptyTitle ?? t(\"resourceList.nothingHereYet\", \"Nothing here yet\"))}\n          {...(q ? { description: t(\"resourceList.tryShorterSearch\", \"Try a shorter search.\") } : emptyDescription ? { description: emptyDescription } : {})}\n          {...(!q && emptyAction ? { actions: emptyAction } : {})}\n        />\n      ) : (\n        <List\n          aria-label={ariaLabel}\n          groups={filtered}\n          selectable={bulkActions.length > 0}\n          selected={visibleSelection}\n          onSelectedChange={setSelected}\n          {...(onOpen ? { onOpen } : {})}\n          selectionActions={bulkActions.map((a) => (\n            <SelectionAction key={a.label} {...(a.icon ? { icon: a.icon } : {})} onClick={() => a.onClick([...visibleSelection])}>\n              {a.label}\n            </SelectionAction>\n          ))}\n        />\n      )}\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") ResourceList.displayName = \"ResourceList\";\n"],"mappings":";;;;;;;;;AAQA,IAAaK,IAA+B,EAC1C,UAAU;CACR,SAAS,EAAE,SAAS,GAAG;CACvB,MAAM,EAAE,SAAS,GAAG;AACtB,EACF,GACaC,IAAuC,EAAE,UAAU,UAAU;AAa1E,SAASC,EAAW,GAAiB;CACnC,OAAO,GAAGC,EAAE,cAAc,OAAOA,EAAE,SAAU,WAAWA,EAAE,QAAQ,IAAI,GAAGA,EAAE,aAAa,KAAK,YAAY;AAC3G;AAEA,IAAaC,IAA+B,kBAA8C,SACxF,EAAE,WAAQ,WAAQ,iBAAc,CAAC,GAAG,YAAS,eAAY,qBAAkB,gBAAa,cAAcC,KACtG,GACA;CACA,IAAMC,IAAIX,EAAU,GACd,CAACY,GAAOC,KAAYC,EAAS,EAAE,GAC/B,CAACC,GAAUC,KAAeF,kBAAsB,IAAI,IAAI,CAAC,GACzDG,IAAIL,EAAM,KAAK,CAAC,CAAC,YAAY,GAC7BM,IAAWC,QACTC,EAAO,KAAK,OAAO;EAAE,GAAGC;EAAG,OAAOA,EAAE,MAAM,QAAQ,MAAM,CAACJ,KAAKV,EAAWC,CAAC,CAAC,CAAC,SAASS,CAAC,CAAC;CAAE,EAAE,CAAC,CAAC,QAAQ,MAAMI,EAAE,MAAM,SAAS,CAAC,GACnI,CAACD,GAAQH,CAAC,CACZ,GACMK,IAAmBH,QAAc;EACrC,IAAMI,IAAQ,IAAI,IAAIL,EAAS,SAAS,MAAMG,EAAE,MAAM,KAAK,MAAMb,EAAE,EAAE,CAAC,CAAC;EACvE,OAAO,IAAI,IAAI,CAAC,GAAGO,CAAQ,CAAC,CAAC,QAAQ,MAAOQ,EAAM,IAAIC,CAAE,CAAC,CAAC;CAC5D,GAAG,CAACN,GAAUH,CAAQ,CAAC;CACvB,OACE,kBAAC,OAAD;EAAU;EAAK,WAAU;EAAzB,UAAA,CACE,kBAACb,GAAD;GAAS,cAAYS,EAAE,wBAAwB,SAAS;GAAxD,UAAA;IACGc;IACD,kBAACvB,EAAQ,QAAT,CAAiB,CAAA;IACjB,kBAAC,OAAD;KAAK,WAAU;KACb,UAAA,kBAACD,GAAD;MACE,cAAYU,EAAE,uBAAuB,QAAQ;MAC7C,aAAaA,EAAE,uBAAuB,QAAQ;MAC9C,OAAOC;MACP,WAAW,MAAMC,EAAS,EAAE,OAAO,KAAK;MACxC,eAAeA,EAAS,EAAE;MAC1B,UAAU,CAAC,GAAG;KACf,CAAA;IACE,CAAA;GACE;EACR,CAAA,GAAAK,EAAS,WAAW,IACnB,kBAACf,GAAD;GACE,MAAK;GACL,OAAOc,IAAIN,EAAE,0BAA0B,YAAY,IAAKe,KAAcf,EAAE,+BAA+B,kBAAkB;GACzH,GAAKM,IAAI,EAAE,aAAaN,EAAE,iCAAiC,uBAAuB,EAAE,IAAIgB,IAAmB,EAAE,aAAaA,EAAiB,IAAI,CAAC;GAChJ,GAAK,CAACV,KAAKW,IAAc,EAAE,SAASA,EAAY,IAAI,CAAC;EACtD,CAAA,IAED,kBAACC,GAAD;GACE,cAAYnB;GACZ,QAAQQ;GACR,YAAYY,EAAY,SAAS;GACjC,UAAUR;GACV,kBAAkBN;GAClB,GAAKe,IAAS,EAAE,UAAO,IAAI,CAAC;GAC5B,kBAAkBD,EAAY,KAAK,MACjC,kBAAC1B,GAAD;IAA+B,GAAK4B,EAAE,OAAO,EAAE,MAAMA,EAAE,KAAK,IAAI,CAAC;IAAI,eAAeA,EAAE,QAAQ,CAAC,GAAGV,CAAgB,CAAC;IAChH,UAAAU,EAAE;GACY,GAFKA,EAAE,KAEP,CAClB;EACF,CAAA,CAEA;;AAET,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAa,cAAc"}
+{"version":3,"file":"resource-list.js","names":["useUiText","useLocale","SearchInput","Toolbar","Empty","List","SelectionAction","KAESO_RESOURCE_LIST_VARIANTS","KAESO_RESOURCE_LIST_DEFAULT_VARIANTS","searchText","i","ResourceList","ariaLabel","t","locale","query","setQuery","useState","selected","setSelected","q","filtered","useMemo","groups","g","visibleSelection","shown","id","n","noun","toolbar","emptyTitle","emptyDescription","Button","emptyAction","bulkActions","onOpen","a"],"sources":["../../src/blocks/resource-list/resource-list.tsx"],"sourcesContent":["import { forwardRef, useMemo, useState, type ReactNode } from \"react\";\nimport { List, SelectionAction, type ListGroup, type ListItemData } from \"../../components/list/list.js\";\nimport { Toolbar } from \"../../components/toolbar/toolbar.js\";\nimport { SearchInput } from \"../../components/input/input.js\";\nimport { Empty } from \"../../components/empty/empty.js\";\nimport type { IconData } from \"../../components/icon/icon.js\";\nimport { useLocale, useUiText } from \"../../i18n/context.js\";\nimport { Button } from \"../../components/button/button.js\";\n\nexport const KAESO_RESOURCE_LIST_VARIANTS = {\n  grouping: {\n    grouped: { classes: \"\" },\n    flat: { classes: \"\" },\n  },\n} as const;\nexport const KAESO_RESOURCE_LIST_DEFAULT_VARIANTS = { grouping: \"grouped\" } as const;\n\nexport interface ResourceListProps {\n  groups: ListGroup[];\n  \"aria-label\": string;\n  onOpen?: ((item: ListItemData) => void) | undefined;\n  bulkActions?: { label: string; icon?: IconData | undefined; onClick: (ids: string[]) => void }[] | undefined;\n  toolbar?: ReactNode | undefined;\n  emptyTitle?: string | undefined;\n  emptyDescription?: string | undefined;\n  emptyAction?: ReactNode | undefined;\n}\n\nfunction searchText(i: ListItemData) {\n  return `${i.textValue ?? (typeof i.title === \"string\" ? i.title : \"\")} ${i.displayId ?? \"\"}`.toLowerCase();\n}\n\nexport const ResourceList = /* @__PURE__ */ forwardRef<HTMLDivElement, ResourceListProps>(function ResourceList(\n  { groups, onOpen, bulkActions = [], toolbar, emptyTitle, emptyDescription, emptyAction, \"aria-label\": ariaLabel },\n  ref,\n) {\n  const t = useUiText();\n  const locale = useLocale();\n  const [query, setQuery] = useState(\"\");\n  const [selected, setSelected] = useState<Set<string>>(new Set());\n  const q = query.trim().toLowerCase();\n  const filtered = useMemo(\n    () => groups.map((g) => ({ ...g, items: g.items.filter((i) => !q || searchText(i).includes(q)) })).filter((g) => g.items.length > 0),\n    [groups, q],\n  );\n  const visibleSelection = useMemo(() => {\n    const shown = new Set(filtered.flatMap((g) => g.items.map((i) => i.id)));\n    return new Set([...selected].filter((id) => shown.has(id)));\n  }, [filtered, selected]);\n  const shown = filtered.reduce((n, g) => n + g.items.length, 0);\n  const noun = locale === \"en\" && /^[A-Z][a-z]/.test(ariaLabel) ? ariaLabel[0]!.toLowerCase() + ariaLabel.slice(1) : ariaLabel;\n  return (\n    <div ref={ref} className=\"flex flex-col\">\n      <span role=\"status\" className=\"sr-only\">\n        {q ? t(\"resourceList.results\", \"{count, plural, =0 {No results} one {# result} other {# results}}\", { count: shown }) : \"\"}\n      </span>\n      <Toolbar aria-label={t(\"resourceList.filters\", \"Filters\")}>\n        {toolbar}\n        <Toolbar.Spacer />\n        <div className=\"w-240\">\n          <SearchInput\n            aria-label={t(\"resourceList.search\", \"Search\")}\n            placeholder={t(\"resourceList.search\", \"Search\")}\n            value={query}\n            onChange={(e) => setQuery(e.target.value)}\n            onClear={() => setQuery(\"\")}\n            shortcut={[\"/\"]}\n          />\n        </div>\n      </Toolbar>\n      {filtered.length === 0 ? (\n        <Empty\n          size=\"md\"\n          title={q ? t(\"resourceList.noMatches\", \"No matches\") : (emptyTitle ?? t(\"resourceList.noneYet\", \"No {label} yet\", { label: noun }))}\n          {...(q ? { description: t(\"resourceList.tryShorterSearch\", \"Try a shorter search.\") } : emptyDescription ? { description: emptyDescription } : {})}\n          {...(q\n            ? {\n                actions: (\n                  <Button size=\"sm\" onClick={() => setQuery(\"\")}>\n                    {t(\"resourceList.clearSearch\", \"Clear search\")}\n                  </Button>\n                ),\n              }\n            : emptyAction\n              ? { actions: emptyAction }\n              : {})}\n        />\n      ) : (\n        <List\n          aria-label={ariaLabel}\n          groups={filtered}\n          selectable={bulkActions.length > 0}\n          selected={visibleSelection}\n          onSelectedChange={setSelected}\n          {...(onOpen ? { onOpen } : {})}\n          selectionActions={bulkActions.map((a) => (\n            <SelectionAction key={a.label} {...(a.icon ? { icon: a.icon } : {})} onClick={() => a.onClick([...visibleSelection])}>\n              {a.label}\n            </SelectionAction>\n          ))}\n        />\n      )}\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") ResourceList.displayName = \"ResourceList\";\n"],"mappings":"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"}