@application-kit/ui 0.0.0-stage → 0.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 application-kit
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,42 @@
-# Temporary Holding Version
+# @application-kit/ui
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Vue-обёртки над UI-вендором, мост токенов оформления (`--p-*` → `--ui-*`) и помощники спеков.
+Пакет не знает ни одного языка, имени иконки и feature-flag'а продукта: всё это приложение передаёт
+при установке плагина.
+
+```ts
+import { UiVendorPlugin } from '@application-kit/ui'
+import '@application-kit/ui/style.css'
+
+app.use(new UiVendorPlugin({
+  darkModeSelector: 'dark-theme',
+  describeRequestError: (error, fallbackMessage) => describe(error, fallbackMessage, i18n.global.t),
+  iconClass: (name) => `app-icon app-icon--${name}`,
+  locale: { overrides: { ru: { accept: 'Да' } }, reference: (vue) => localeRef },
+  messages: () => ({ table: { empty: i18n.global.t('table.empty'), /* … */ } /* … */ }),
+}))
+```
+
+Все четыре обязательные опции (`darkModeSelector`, `describeRequestError`, `iconClass`, `messages`) проверяются
+типом и при создании плагина: без них конструктор бросает ошибку на старте приложения.
+
+## Имена иконок
+
+Реестр пустой — приложение расширяет его своими именами, и без этого ни одна иконка не компилируется:
+
+```ts
+declare module '@application-kit/ui' {
+  interface UiIconRegistryInterface { refresh: true }
+}
+```
+
+## Входы
+
+- `.` — компоненты, composables, `UiVendorPlugin`, листинговые сторы, типы;
+- `/testing` — `installVendorPlugins`, `submitForm`, заглушки браузерных API для jsdom;
+- `/style.css` — стили компонентов (подключить один раз);
+- `/styles/tokens.scss` — мост токенов: приложение сверяет по нему свои `var(--ui-*)`.
+
+## Peer-зависимости
+
+`vue`, `pinia`, `vue-router`, `openvue` — по одному экземпляру на приложение; `vitest` нужен только для `/testing`.

package/dist/_virtual/_plugin-vue_export-helper.js

@@ -0,0 +1,8 @@
+//#region \0plugin-vue:export-helper
+var _plugin_vue_export_helper_default = (sfc, props) => {
+	const target = sfc.__vccOpts || sfc;
+	for (const [key, val] of props) target[key] = val;
+	return target;
+};
+//#endregion
+export { _plugin_vue_export_helper_default as default };

package/dist/accent-color.d.ts

@@ -0,0 +1,2 @@
+export declare const ACCENT_COLORS: readonly ["indigo", "primary", "red", "yellow"];
+export type AccentColor = (typeof ACCENT_COLORS)[number];

package/dist/accent-color.js

@@ -0,0 +1,15 @@
+//#region src/accent-color.ts
+/**
+* Акцентная палитра слоя shared/vue (story 3-7) — собственная, как и `Severity`. Значение
+* union'а — оттенок, у которого в `styles/_tokens.scss` объявлены токены
+* `--ui-accent-<оттенок>-{200,300,500}`; полноту держит спека `styles/tests/tokens.spec.ts`,
+* поэтому новый оттенок нельзя добавить сюда, забыв про токены.
+*/
+var ACCENT_COLORS = [
+	"indigo",
+	"primary",
+	"red",
+	"yellow"
+];
+//#endregion
+export { ACCENT_COLORS };

package/dist/components/avatar/Avatar.js

@@ -0,0 +1,5 @@
+import Avatar_vue_vue_type_script_setup_true_lang_default from "./Avatar.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/avatar/Avatar.vue
+var Avatar_default = Avatar_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { Avatar_default as default };

package/dist/components/avatar/Avatar.vue.d.ts

@@ -0,0 +1,24 @@
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    icon: {
+        default: undefined;
+        type: import("vue").PropType<"times">;
+    };
+    label: {
+        default: undefined;
+        type: StringConstructor;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    icon: {
+        default: undefined;
+        type: import("vue").PropType<"times">;
+    };
+    label: {
+        default: undefined;
+        type: StringConstructor;
+    };
+}>> & Readonly<{}>, {
+    icon: "times";
+    label: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/avatar/Avatar.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,31 @@
+import { ICON_PROP_TYPE } from "../../icons/ui-icon-registry.js";
+import { useUiIconClass } from "../../plugin/ui-injection.js";
+import { computed, createBlock, defineComponent, openBlock, unref } from "vue";
+import VendorAvatar from "openvue/avatar";
+//#region src/components/avatar/Avatar.vue?vue&type=script&setup=true&lang.ts
+var Avatar_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "Avatar",
+	props: {
+		icon: {
+			default: void 0,
+			type: ICON_PROP_TYPE
+		},
+		label: {
+			default: void 0,
+			type: String
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const iconClass = useUiIconClass();
+		const vendorIcon = computed(() => props.icon === void 0 ? void 0 : iconClass(props.icon));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(VendorAvatar), {
+				icon: vendorIcon.value,
+				label: __props.label
+			}, null, 8, ["icon", "label"]);
+		};
+	}
+});
+//#endregion
+export { Avatar_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/button/Button.js

@@ -0,0 +1,5 @@
+import Button_vue_vue_type_script_setup_true_lang_default from "./Button.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/button/Button.vue
+var Button_default = Button_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { Button_default as default };

package/dist/components/button/Button.vue.d.ts

@@ -0,0 +1,130 @@
+import type { PropType } from 'vue';
+import type { Severity } from '../../severity';
+declare var __VLS_10: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    disabled: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    icon: {
+        default: undefined;
+        type: PropType<"times">;
+    };
+    iconPos: {
+        default: undefined;
+        type: PropType<"left" | "right">;
+    };
+    label: {
+        default: undefined;
+        type: StringConstructor;
+    };
+    link: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    loading: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    outlined: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    rounded: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    severity: {
+        default: undefined;
+        type: PropType<Severity>;
+    };
+    size: {
+        default: undefined;
+        type: PropType<"large" | "small">;
+    };
+    text: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    type: {
+        default: undefined;
+        type: PropType<"button" | "submit">;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    click: (event: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    disabled: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    icon: {
+        default: undefined;
+        type: PropType<"times">;
+    };
+    iconPos: {
+        default: undefined;
+        type: PropType<"left" | "right">;
+    };
+    label: {
+        default: undefined;
+        type: StringConstructor;
+    };
+    link: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    loading: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    outlined: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    rounded: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    severity: {
+        default: undefined;
+        type: PropType<Severity>;
+    };
+    size: {
+        default: undefined;
+        type: PropType<"large" | "small">;
+    };
+    text: {
+        default: undefined;
+        type: BooleanConstructor;
+    };
+    type: {
+        default: undefined;
+        type: PropType<"button" | "submit">;
+    };
+}>> & Readonly<{
+    onClick?: (event: MouseEvent) => any;
+}>, {
+    icon: "times";
+    label: string;
+    type: "button" | "submit";
+    disabled: boolean;
+    iconPos: "left" | "right";
+    link: boolean;
+    loading: boolean;
+    outlined: boolean;
+    rounded: boolean;
+    severity: Severity;
+    size: "large" | "small";
+    text: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/button/Button.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,104 @@
+import { ICON_PROP_TYPE } from "../../icons/ui-icon-registry.js";
+import { useUiIconClass } from "../../plugin/ui-injection.js";
+import { SEVERITY_TO_VENDOR } from "./severity-to-vendor.js";
+import { computed, createBlock, createSlots, defineComponent, mergeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+import VendorButton from "openvue/button";
+//#region src/components/button/Button.vue?vue&type=script&setup=true&lang.ts
+var Button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "Button",
+	props: {
+		disabled: {
+			default: void 0,
+			type: Boolean
+		},
+		icon: {
+			default: void 0,
+			type: ICON_PROP_TYPE
+		},
+		iconPos: {
+			default: void 0,
+			type: String
+		},
+		label: {
+			default: void 0,
+			type: String
+		},
+		link: {
+			default: void 0,
+			type: Boolean
+		},
+		loading: {
+			default: void 0,
+			type: Boolean
+		},
+		outlined: {
+			default: void 0,
+			type: Boolean
+		},
+		rounded: {
+			default: void 0,
+			type: Boolean
+		},
+		severity: {
+			default: void 0,
+			type: String
+		},
+		size: {
+			default: void 0,
+			type: String
+		},
+		text: {
+			default: void 0,
+			type: Boolean
+		},
+		type: {
+			default: void 0,
+			type: String
+		}
+	},
+	emits: ["click"],
+	setup(__props) {
+		const props = __props;
+		const vendorSeverity = computed(() => props.severity === void 0 ? void 0 : SEVERITY_TO_VENDOR[props.severity]);
+		const iconClass = useUiIconClass();
+		const vendorIcon = computed(() => props.icon === void 0 ? void 0 : iconClass(props.icon));
+		const BUTTON_PASS_THROUGH = { icon: { class: "ui-button-icon" } };
+		const nativeAttributes = computed(() => ({
+			...props.disabled !== void 0 && { disabled: props.disabled },
+			...props.type !== void 0 && { type: props.type }
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(VendorButton), mergeProps(nativeAttributes.value, {
+				pt: BUTTON_PASS_THROUGH,
+				icon: vendorIcon.value,
+				"icon-pos": __props.iconPos,
+				label: __props.label,
+				link: __props.link,
+				loading: __props.loading,
+				outlined: __props.outlined,
+				rounded: __props.rounded,
+				severity: vendorSeverity.value,
+				size: __props.size,
+				text: __props.text,
+				onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("click", $event))
+			}), createSlots({ _: 2 }, [_ctx.$slots.default ? {
+				name: "default",
+				fn: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				key: "0"
+			} : void 0]), 1040, [
+				"icon",
+				"icon-pos",
+				"label",
+				"link",
+				"loading",
+				"outlined",
+				"rounded",
+				"severity",
+				"size",
+				"text"
+			]);
+		};
+	}
+});
+//#endregion
+export { Button_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/button/severity-to-vendor.d.ts

@@ -0,0 +1,4 @@
+import type { Severity } from '../../severity';
+type VendorButtonSeverityType = 'contrast' | 'danger' | 'info' | 'secondary' | 'success' | 'warn';
+export declare const SEVERITY_TO_VENDOR: Record<Severity, VendorButtonSeverityType>;
+export {};

package/dist/components/button/severity-to-vendor.js

@@ -0,0 +1,11 @@
+//#region src/components/button/severity-to-vendor.ts
+var SEVERITY_TO_VENDOR = {
+	contrast: "contrast",
+	danger: "danger",
+	info: "info",
+	secondary: "secondary",
+	success: "success",
+	warn: "warn"
+};
+//#endregion
+export { SEVERITY_TO_VENDOR };

package/dist/components/card/Card.js

@@ -0,0 +1,5 @@
+import Card_vue_vue_type_script_setup_true_lang_default from "./Card.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/card/Card.vue
+var Card_default = Card_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { Card_default as default };

package/dist/components/card/Card.vue.d.ts

@@ -0,0 +1,17 @@
+import type { VNode } from 'vue';
+type __VLS_Slots = {
+    content?: () => VNode[];
+    default?: () => VNode[];
+    footer?: () => VNode[];
+    subtitle?: () => VNode[];
+    title?: () => VNode[];
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/card/Card.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,34 @@
+import { createBlock, createSlots, defineComponent, openBlock, renderSlot, unref, withCtx } from "vue";
+import VendorCard from "openvue/card";
+//#region src/components/card/Card.vue?vue&type=script&setup=true&lang.ts
+var Card_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "Card",
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(VendorCard), null, createSlots({ _: 2 }, [
+				_ctx.$slots.title ? {
+					name: "title",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "title")]),
+					key: "0"
+				} : void 0,
+				_ctx.$slots.subtitle ? {
+					name: "subtitle",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "subtitle")]),
+					key: "1"
+				} : void 0,
+				_ctx.$slots.content ?? _ctx.$slots.default ? {
+					name: "content",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "content"), renderSlot(_ctx.$slots, "default")]),
+					key: "2"
+				} : void 0,
+				_ctx.$slots.footer ? {
+					name: "footer",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "footer")]),
+					key: "3"
+				} : void 0
+			]), 1024);
+		};
+	}
+});
+//#endregion
+export { Card_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/confirm/ConfirmHost.js

@@ -0,0 +1,5 @@
+import ConfirmHost_vue_vue_type_script_setup_true_lang_default from "./ConfirmHost.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/confirm/ConfirmHost.vue
+var ConfirmHost_default = ConfirmHost_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ConfirmHost_default as default };

package/dist/components/confirm/ConfirmHost.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/confirm/ConfirmHost.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,13 @@
+import { createBlock, defineComponent, openBlock, unref } from "vue";
+import ConfirmDialog from "openvue/confirmdialog";
+//#region src/components/confirm/ConfirmHost.vue?vue&type=script&setup=true&lang.ts
+var ConfirmHost_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "ConfirmHost",
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(ConfirmDialog));
+		};
+	}
+});
+//#endregion
+export { ConfirmHost_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/confirm/install-confirmation-service.d.ts

@@ -0,0 +1,2 @@
+import type { App as VueApp } from 'vue';
+export declare const installConfirmationService: (app: VueApp) => void;

package/dist/components/confirm/install-confirmation-service.js

@@ -0,0 +1,16 @@
+import ConfirmationService from "openvue/confirmationservice";
+//#region src/components/confirm/install-confirmation-service.ts
+/**
+* Runtime dependency of the `useConfirm()` facade and of `<ConfirmHost>`: the vendor
+* confirmation service is installed here, inside the shared layer, instead of the app-level
+* plugin or a spec — otherwise `openvue/confirmationservice` leaks into `src/modules`
+* (story 3-7; the page spec of the users screen installed it itself).
+* @param app - Vue.js app (module VendorPlugin or the test harness).
+* @example
+* installConfirmationService(vue)
+*/
+var installConfirmationService = (app) => {
+	app.use(ConfirmationService);
+};
+//#endregion
+export { installConfirmationService };

package/dist/components/date-range-filter/DateRangeFilter.js

@@ -0,0 +1,7 @@
+import DateRangeFilter_vue_vue_type_script_setup_true_lang_default from "./DateRangeFilter.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                */
+import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.js";
+//#region src/components/date-range-filter/DateRangeFilter.vue
+var DateRangeFilter_default = /*#__PURE__*/ _plugin_vue_export_helper_default(DateRangeFilter_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-30d77bcb"]]);
+//#endregion
+export { DateRangeFilter_default as default };

package/dist/components/date-range-filter/DateRangeFilter.vue.d.ts

@@ -0,0 +1,13 @@
+import type { FilterInterface } from '@application-kit/typeorm/listing';
+type __VLS_Props = {
+    field?: string;
+};
+declare const __VLS_export: import("*.vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:filters": (filters: FilterInterface[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:filters"?: (filters: FilterInterface[]) => any;
+}>, {
+    field: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;