@chelone/vue 0.5.0 → 0.7.0

package/dist/components/admin/buttons/save-button.js

@@ -0,0 +1,4 @@
+import save_button_vue_vue_type_script_setup_true_lang_default from "./save-button.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/buttons/save-button.vue
+var save_button_default = save_button_vue_vue_type_script_setup_true_lang_default;
+export { save_button_default as default };

package/dist/components/admin/buttons/save-button.vue.d.ts

@@ -6,9 +6,10 @@ export interface SaveButtonProps {
     variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
     class?: string;
 }
-declare const _default: import("vue").DefineComponent<SaveButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SaveButtonProps> & Readonly<{}>, {
-    variant: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<SaveButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SaveButtonProps> & Readonly<{}>, {
+    variant: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost";
     label: string;
     alwaysEnable: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/components/admin/buttons/save-button.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,73 @@
+import { useCheloneFormContext } from "../../../form/form-context.js";
+import { subscribeStore } from "../../../form/subscribe-ref.js";
+import { useTranslate } from "../../../i18n/use-translate.js";
+import button_default from "../../ui/button.js";
+import { computed, createBlock, createCommentVNode, createElementBlock, createTextVNode, defineComponent, normalizeClass, onScopeDispose, openBlock, shallowRef, toDisplayString, withCtx } from "vue";
+// src/components/admin/buttons/save-button.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	key: 0,
+	"data-slot": "save-spinner",
+	class: "animate-spin"
+};
+var save_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "save-button",
+	props: {
+		label: { default: "ra.action.save" },
+		alwaysEnable: {
+			type: Boolean,
+			default: false
+		},
+		disabled: { type: Boolean },
+		variant: { default: "default" },
+		class: {}
+	},
+	setup(__props) {
+		/**
+		* `<SaveButton>` — submits the ambient CRUD form, the Vue analog of
+		* `@chelone/react`'s `buttons/save-button.tsx`. Chelone views render no native
+		* `<form>` element, so this reads the ambient `submit` off the form context
+		* (mounted by `<Edit>`/`<Create>` via `useForm`'s provider) and invokes it on
+		* click. Disabled state derives from the reactive form-store slices
+		* (`isSubmitting` / `isValidating` / `canSubmit`), the React twin's
+		* `useSelector(form.ambient.store, …)` mapped to a Vue `shallowRef` bridge over the
+		* form-core store (a plain read — no mount, the form is already mounted).
+		*/
+		const props = __props;
+		const { form, submit } = useCheloneFormContext();
+		const translate = useTranslate();
+		const state = shallowRef(form.ambient.store.state);
+		onScopeDispose(subscribeStore(form.ambient.store, () => {
+			state.value = form.ambient.store.state;
+		}));
+		const saving = computed(() => state.value.isSubmitting);
+		const disabled = computed(() => {
+			if (props.alwaysEnable) return props.disabled ?? false;
+			return (props.disabled ?? false) || state.value.isValidating || state.value.isSubmitting || !state.value.canSubmit;
+		});
+		const displayedLabel = computed(() => translate(props.label, { _: props.label === "ra.action.save" ? "Save" : props.label }));
+		async function onClick() {
+			if (submit) await submit();
+			else await form.ambient.handleSubmit();
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(button_default, {
+				type: "submit",
+				variant: __props.variant,
+				disabled: disabled.value,
+				class: normalizeClass(props.class),
+				"aria-label": displayedLabel.value,
+				"data-slot": "save-button",
+				onClick
+			}, {
+				default: withCtx(() => [saving.value ? (openBlock(), createElementBlock("span", _hoisted_1, "…")) : createCommentVNode("", true), createTextVNode(" " + toDisplayString(displayedLabel.value), 1)]),
+				_: 1
+			}, 8, [
+				"variant",
+				"disabled",
+				"class",
+				"aria-label"
+			]);
+		};
+	}
+});
+export { save_button_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/buttons/select-all-button.js

@@ -0,0 +1,4 @@
+import select_all_button_vue_vue_type_script_setup_true_lang_default from "./select-all-button.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/buttons/select-all-button.vue
+var select_all_button_default = select_all_button_vue_vue_type_script_setup_true_lang_default;
+export { select_all_button_default as default };

package/dist/components/admin/buttons/select-all-button.vue.d.ts

@@ -1,13 +1,15 @@
 /** Props for {@link SelectAllButton}. */
 export interface SelectAllButtonProps {
-    /** A message key, translated with "Select all" as the fallback. */
+    /** A message key, translated with itself as the fallback. */
     label?: string;
     /** The most rows to select. */
     limit?: number;
     /** Extra CSS class appended to the button. */
     class?: string;
 }
-declare const _default: import("vue").DefineComponent<SelectAllButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<SelectAllButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: () => any;
 }, string, import("vue").PublicProps, Readonly<SelectAllButtonProps> & Readonly<{
     onClick?: (() => any) | undefined;
@@ -15,4 +17,3 @@ declare const _default: import("vue").DefineComponent<SelectAllButtonProps, {},
     label: string;
     limit: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/components/admin/buttons/select-all-button.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,56 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { useListContext } from "../../../list/list-context.js";
+import button_default from "../../ui/button.js";
+import { computed, createBlock, createCommentVNode, createTextVNode, defineComponent, normalizeClass, openBlock, toDisplayString, withCtx } from "vue";
+// src/components/admin/buttons/select-all-button.vue?vue&type=script&setup=true&lang.ts
+var defaultLabel = "ra.action.select_all";
+var select_all_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "select-all-button",
+	props: {
+		label: { default: defaultLabel },
+		limit: { default: 250 },
+		class: {}
+	},
+	emits: ["click"],
+	setup(__props, { emit: __emit }) {
+		/**
+		* `<SelectAllButton>` — selects up to `limit` rows of the list, beyond the
+		* current page. The Vue twin of `@chelone/react`'s `buttons/select-all-button.tsx`.
+		* Renders nothing until every row of the current page is selected, and again once
+		* the whole list or `limit` rows are selected. Emits `click` once the selection
+		* has landed.
+		*/
+		const props = __props;
+		const emit = __emit;
+		const list = useListContext();
+		const translate = useTranslate();
+		const text = computed(() => translate(props.label, { _: props.label === defaultLabel ? "Select all" : props.label }));
+		const visible = computed(() => {
+			const { data, total, selectedIds } = list;
+			if (data === void 0) return false;
+			if (total === selectedIds.length) return false;
+			if (selectedIds.length >= props.limit) return false;
+			return data.every((record) => selectedIds.includes(record.id));
+		});
+		async function onClick(event) {
+			event.preventDefault();
+			await list.selectAll({ limit: props.limit });
+			emit("click");
+		}
+		return (_ctx, _cache) => {
+			return visible.value ? (openBlock(), createBlock(button_default, {
+				key: 0,
+				type: "button",
+				variant: "ghost",
+				size: "sm",
+				class: normalizeClass(props.class),
+				"data-slot": "select-all-button",
+				onClick
+			}, {
+				default: withCtx(() => [createTextVNode(toDisplayString(text.value), 1)]),
+				_: 1
+			}, 8, ["class"])) : createCommentVNode("", true);
+		};
+	}
+});
+export { select_all_button_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/buttons/show-button.js

@@ -0,0 +1,4 @@
+import show_button_vue_vue_type_script_setup_true_lang_default from "./show-button.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/buttons/show-button.vue
+var show_button_default = show_button_vue_vue_type_script_setup_true_lang_default;
+export { show_button_default as default };

package/dist/components/admin/buttons/show-button.vue.d.ts

@@ -1,4 +1,4 @@
-import type { LooseRecord } from "@chelone/core";
+import { type LooseRecord } from "@chelone/core";
 /** Props for {@link ShowButton}. */
 export interface ShowButtonProps {
     /** Override the ambient record. */
@@ -10,10 +10,11 @@ export interface ShowButtonProps {
     /** Extra CSS class appended to the anchor. */
     class?: string;
 }
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ShowButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ShowButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ShowButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ShowButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     icon?: (props: {}) => any;
 }>;
-export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/components/admin/buttons/show-button.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,80 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { useGetResourceLabel } from "../../../label/use-get-resource-label.js";
+import { RecordContextKey } from "../../../record/record-context.js";
+import { useResourceContext } from "../../../resource-context.js";
+import { useCreatePath } from "../../../router/nav-composables.js";
+import { useMenuAccess } from "../layout/use-menu-access.js";
+import { buttonVariants } from "../../ui/button-variants.js";
+import { EyeIcon } from "./icons.js";
+import { computed, createBlock, createCommentVNode, createTextVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, renderSlot, toDisplayString, unref, withCtx, withModifiers } from "vue";
+import { definedParams } from "@chelone/core";
+import { RouterLink } from "vue-router";
+// src/components/admin/buttons/show-button.vue?vue&type=script&setup=true&lang.ts
+var show_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "show-button",
+	props: {
+		record: {},
+		resource: {},
+		label: {},
+		class: {}
+	},
+	setup(__props) {
+		/**
+		* `<ShowButton>` — navigates to a record's show page. The Vue twin of
+		* `@chelone/react`'s `buttons/show-button.tsx`. Reads the record from the
+		* ambient `RecordContext` to build `useCreatePath({ resource, type: 'show', id })`
+		* and renders a `<RouterLink>` styled as an outline button. Renders nothing
+		* without a record id. See `<CreateButton>` for the shared `translate(...)`
+		* label note.
+		*
+		* R2: gated by `useMenuAccess` on the record — hides while the `show` access
+		* check is pending and when denied (allow when access control is unconfigured).
+		*/
+		const props = __props;
+		const resource = useResourceContext(props);
+		const injectedRecord = inject(RecordContextKey, null);
+		const record = computed(() => props.record ?? injectedRecord?.value);
+		const createPath = useCreatePath();
+		const getResourceLabel = useGetResourceLabel();
+		const translate = useTranslate();
+		const { canAccess, isPending: isAccessPending } = useMenuAccess(computed(() => ({
+			action: "show",
+			resource: resource ?? "",
+			record: record.value
+		})));
+		const to = computed(() => {
+			const id = record.value?.id;
+			return id == null ? "" : createPath({
+				resource,
+				type: "show",
+				id
+			});
+		});
+		const label = computed(() => translate("ra.action.show", definedParams({
+			_: "Show",
+			name: resource ? getResourceLabel(resource, 1) : void 0
+		})));
+		const classes = computed(() => buttonVariants({
+			variant: "outline",
+			class: props.class
+		}));
+		return (_ctx, _cache) => {
+			return record.value && record.value.id != null && !unref(isAccessPending) && unref(canAccess) ? (openBlock(), createBlock(unref(RouterLink), {
+				key: 0,
+				to: to.value,
+				class: normalizeClass(classes.value),
+				"aria-label": label.value,
+				"data-slot": "show-button",
+				onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"]))
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "icon", {}, () => [createVNode(unref(EyeIcon))]), createTextVNode(" " + toDisplayString(label.value), 1)]),
+				_: 3
+			}, 8, [
+				"to",
+				"class",
+				"aria-label"
+			])) : createCommentVNode("", true);
+		};
+	}
+});
+export { show_button_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/buttons/sidebar-toggle-button.js

@@ -0,0 +1,4 @@
+import sidebar_toggle_button_vue_vue_type_script_setup_true_lang_default from "./sidebar-toggle-button.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/buttons/sidebar-toggle-button.vue
+var sidebar_toggle_button_default = sidebar_toggle_button_vue_vue_type_script_setup_true_lang_default;
+export { sidebar_toggle_button_default as default };

package/dist/components/admin/buttons/sidebar-toggle-button.vue.d.ts

@@ -3,5 +3,6 @@ export interface SidebarToggleButtonProps {
     /** Extra CSS class appended to the button. */
     class?: string;
 }
-declare const _default: import("vue").DefineComponent<SidebarToggleButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SidebarToggleButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<SidebarToggleButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SidebarToggleButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/admin/buttons/sidebar-toggle-button.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,47 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import button_default from "../../ui/button.js";
+import { useSidebar } from "../../ui/sidebar/sidebar-context.js";
+import { PanelLeftIcon } from "./icons.js";
+import { computed, createBlock, createVNode, defineComponent, normalizeClass, openBlock, unref, withCtx } from "vue";
+// src/components/admin/buttons/sidebar-toggle-button.vue?vue&type=script&setup=true&lang.ts
+var sidebar_toggle_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "sidebar-toggle-button",
+	props: { class: {} },
+	setup(__props) {
+		/**
+		* `<SidebarToggleButton>` — a standalone button that opens/closes the sidebar.
+		* The Vue twin of `@chelone/react`'s `buttons/sidebar-toggle-button.tsx`, for
+		* use in custom headers. Wired to `useSidebar().toggleSidebar`; the aria-label
+		* flips between the translated "Open menu" / "Close menu" (mirroring the React
+		* twin's tooltip text).
+		*
+		* Divergence: the React twin wraps the shadcn `<SidebarTrigger>` in a
+		* `<Tooltip>`; the Vue slice has no `<Tooltip>` primitive yet (see
+		* `menu-item-link.vue`), so this renders the button directly with the label as
+		* `aria-label` and defers the visible tooltip to a later surface-parity wave.
+		*/
+		const props = __props;
+		const { open, toggleSidebar } = useSidebar();
+		const translate = useTranslate();
+		const label = computed(() => open.value ? translate("ra.action.close_menu", { _: "Close menu" }) : translate("ra.action.open_menu", { _: "Open menu" }));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(button_default, {
+				type: "button",
+				variant: "ghost",
+				size: "icon",
+				class: normalizeClass(["scale-125 sm:scale-100", props.class]),
+				"aria-label": label.value,
+				"data-slot": "sidebar-toggle-button",
+				onClick: unref(toggleSidebar)
+			}, {
+				default: withCtx(() => [createVNode(unref(PanelLeftIcon))]),
+				_: 1
+			}, 8, [
+				"class",
+				"aria-label",
+				"onClick"
+			]);
+		};
+	}
+});
+export { sidebar_toggle_button_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/buttons/skip-navigation-button.js

@@ -0,0 +1,4 @@
+import skip_navigation_button_vue_vue_type_script_setup_true_lang_default from "./skip-navigation-button.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/buttons/skip-navigation-button.vue
+var skip_navigation_button_default = skip_navigation_button_vue_vue_type_script_setup_true_lang_default;
+export { skip_navigation_button_default as default };

package/dist/components/admin/buttons/skip-navigation-button.vue.d.ts

@@ -5,12 +5,13 @@ export interface SkipNavigationButtonProps {
     /** Extra CSS class appended to the button. */
     class?: string;
 }
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<SkipNavigationButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SkipNavigationButtonProps> & Readonly<{}>, {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<SkipNavigationButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SkipNavigationButtonProps> & Readonly<{}>, {
     label: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;
 }>;
-export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/components/admin/buttons/skip-navigation-button.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,48 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import button_default from "../../ui/button.js";
+import { computed, createBlock, createTextVNode, defineComponent, normalizeClass, openBlock, renderSlot, toDisplayString, withCtx } from "vue";
+// src/components/admin/buttons/skip-navigation-button.vue?vue&type=script&setup=true&lang.ts
+var skip_navigation_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "skip-navigation-button",
+	props: {
+		label: { default: "ra.navigation.skip_nav" },
+		class: {}
+	},
+	setup(__props) {
+		/**
+		* `<SkipNavigationButton>` — an off-screen button that appears on focus and
+		* moves keyboard focus to the page content (`#main-content`), past the menu.
+		* The Vue twin of `@chelone/react`'s `buttons/skip-navigation-button.tsx`.
+		*
+		* Vue divergence: the default slot replaces the label text, where the React twin
+		* takes a node as `label`.
+		*/
+		const props = __props;
+		const translate = useTranslate();
+		const text = computed(() => props.label.includes(".") ? translate(props.label, { _: "Skip to content" }) : props.label);
+		function skip() {
+			if (typeof document === "undefined") return;
+			const element = document.getElementById("main-content");
+			if (!element) {
+				if ((typeof process !== "undefined" ? process.env.NODE_ENV : void 0) !== "production") console.warn("No element with id 'main-content' found. To use the SkipNavigationButton, make sure your main content element has the id 'main-content'.");
+				return;
+			}
+			element.setAttribute("tabindex", "-1");
+			element.focus();
+			element.blur();
+			element.removeAttribute("tabindex");
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(button_default, {
+				type: "button",
+				class: normalizeClass(["fixed left-4 -top-24 z-5000 transition-all focus:top-4 duration-300 ease-in-out", props.class]),
+				"data-slot": "skip-navigation-button",
+				onClick: skip
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(text.value), 1)])]),
+				_: 3
+			}, 8, ["class"]);
+		};
+	}
+});
+export { skip_navigation_button_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/buttons/sort-button.js

@@ -0,0 +1,4 @@
+import sort_button_vue_vue_type_script_setup_true_lang_default from "./sort-button.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/buttons/sort-button.vue
+var sort_button_default = sort_button_vue_vue_type_script_setup_true_lang_default;
+export { sort_button_default as default };

package/dist/components/admin/buttons/sort-button.vue.d.ts

@@ -8,5 +8,6 @@ export interface SortButtonProps {
     /** Extra CSS class appended to the trigger. */
     class?: string;
 }
-declare const _default: import("vue").DefineComponent<SortButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SortButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<SortButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SortButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/admin/buttons/sort-button.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,94 @@
+import { useTranslate } from "../../../i18n/use-translate.js";
+import { useListContext } from "../../../list/list-context.js";
+import { humanizeSource } from "../inputs/label-text.js";
+import button_default from "../../ui/button.js";
+import dropdown_menu_default from "../../ui/dropdown-menu/dropdown-menu.js";
+import dropdown_menu_content_default from "../../ui/dropdown-menu/dropdown-menu-content.js";
+import dropdown_menu_item_default from "../../ui/dropdown-menu/dropdown-menu-item.js";
+import dropdown_menu_trigger_default from "../../ui/dropdown-menu/dropdown-menu-trigger.js";
+import { ArrowUpDownIcon, ChevronDownIcon } from "./icons.js";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, renderList, toDisplayString, unref, withCtx } from "vue";
+// src/components/admin/buttons/sort-button.vue?vue&type=script&setup=true&lang.ts
+var sort_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "sort-button",
+	props: {
+		fields: {},
+		label: {},
+		class: {}
+	},
+	setup(__props) {
+		/**
+		* `<SortButton>` — a dropdown to change the list sort. The Vue twin of
+		* `@chelone/react`'s `buttons/sort-button.tsx`, rebridged onto chelone's
+		* first-class multi-sort slice: it reads the PRIMARY column via
+		* `useListContext().sort[0]` (falling back to a default) and calls the
+		* controller `setSort({ field, order })`. The controller itself toggles
+		* ASC/DESC when the same single field is re-selected (ra-core column-header
+		* semantics), so this only computes the NEXT order for the menu-item labels.
+		*
+		* Divergence from the React twin: field labels come from `humanizeSource(...)`
+		* (the Vue slice has no `useTranslateLabel` chain yet), and the mobile
+		* icon-only / tooltip variants are not ported (no Vue `<Tooltip>` primitive).
+		*/
+		const props = __props;
+		const DEFAULT_SORT = {
+			field: "id",
+			order: "DESC"
+		};
+		const inverse = (order) => order === "ASC" ? "DESC" : "ASC";
+		const list = useListContext();
+		const translate = useTranslate();
+		const primary = computed(() => list.sort[0] ?? DEFAULT_SORT);
+		const orderLabel = (order) => translate(`ra.sort.${order}`, { _: order });
+		const buttonLabel = computed(() => translate("ra.sort.sort_by", {
+			_: props.label ?? `Sort by ${humanizeSource(primary.value.field)} ${orderLabel(primary.value.order)}`,
+			field: humanizeSource(primary.value.field),
+			order: orderLabel(primary.value.order)
+		}));
+		/** The order a click on `field` would apply (for the menu-item label). */
+		function nextOrder(field) {
+			return field === primary.value.field ? inverse(primary.value.order) : "ASC";
+		}
+		function onSelect(field) {
+			list.setSort({
+				field,
+				order: nextOrder(field)
+			});
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(dropdown_menu_default), null, {
+				default: withCtx(() => [createVNode(unref(dropdown_menu_trigger_default), null, {
+					default: withCtx(() => [createVNode(button_default, {
+						variant: "outline",
+						size: "sm",
+						class: normalizeClass(["h-9", props.class]),
+						"aria-label": buttonLabel.value,
+						"data-slot": "sort-button"
+					}, {
+						default: withCtx(() => [
+							createVNode(unref(ArrowUpDownIcon)),
+							createElementVNode("span", null, toDisplayString(buttonLabel.value), 1),
+							createVNode(unref(ChevronDownIcon))
+						]),
+						_: 1
+					}, 8, ["class", "aria-label"])]),
+					_: 1
+				}), createVNode(unref(dropdown_menu_content_default), { align: "start" }, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.fields, (field) => {
+						return openBlock(), createBlock(unref(dropdown_menu_item_default), {
+							key: field,
+							"data-field": field,
+							onSelect: ($event) => onSelect(field)
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(humanizeSource)(field)) + " " + toDisplayString(orderLabel(nextOrder(field))), 1)]),
+							_: 2
+						}, 1032, ["data-field", "onSelect"]);
+					}), 128))]),
+					_: 1
+				})]),
+				_: 1
+			});
+		};
+	}
+});
+export { sort_button_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/buttons/status-transition-button.js

@@ -0,0 +1,4 @@
+import status_transition_button_vue_vue_type_script_setup_true_lang_default from "./status-transition-button.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/buttons/status-transition-button.vue
+var status_transition_button_default = status_transition_button_vue_vue_type_script_setup_true_lang_default;
+export { status_transition_button_default as default };

package/dist/components/admin/buttons/status-transition-button.vue.d.ts

@@ -1,12 +1,12 @@
-import type { MutationMode, SourceKey } from "@chelone/core";
+import type { MutationMode, RegisteredRecord, RegisteredResourceName, ResourceRecord } from "@chelone/core";
 /** Props for {@link StatusTransitionButton}. */
-export interface StatusTransitionButtonProps<TRecord extends Record<string, unknown> = Record<string, unknown>> {
+export interface StatusTransitionButtonProps<TRecord extends ResourceRecord = RegisteredRecord<RegisteredResourceName>> {
     /** Record field holding the status, a top-level key. Default `"status"`. */
-    source?: SourceKey<TRecord>;
+    source?: keyof TRecord & string;
     /** Next states by current state. */
     transitions: Record<string, readonly string[]>;
     /** Predicates keyed `"<from>-><to>"`. A transition with no guard is allowed. */
-    guards?: Record<string, (record: Record<string, unknown>) => boolean>;
+    guards?: Record<string, (record: TRecord) => boolean>;
     /** Display text by state. A state with no entry shows as itself. */
     labels?: Record<string, string>;
     /** Override the ambient `<Resource>`. */
@@ -20,18 +20,23 @@ export interface StatusTransitionButtonProps<TRecord extends Record<string, unkn
     /** Extra CSS class appended to the trigger. */
     class?: string;
 }
-declare const _default: <TRecord extends Record<string, unknown> = Record<string, unknown>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly onTransition?: ((from: string, to: string, record: TRecord) => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onTransition"> & StatusTransitionButtonProps<TRecord> & Partial<{}>> & import("vue").PublicProps;
-    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: <TRecord extends ResourceRecord = RegisteredRecord<RegisteredResourceName>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<StatusTransitionButtonProps<TRecord> & {
+        onTransition?: ((from: string, to: string, record: TRecord) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
     attrs: any;
     slots: {};
     emit: (event: "transition", from: string, to: string, record: TRecord) => void;
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
-export default _default;
-type __VLS_PrettifyLocal<T> = {
+type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];
-} & {};
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};