PR 6: Database migration validation - fresh/upgrade test complete

 Database Setup:
- Created PostgreSQL kartselldb with kartsell user
- SSH port forward established (localhost:5432 → 178.104.200.7:5432)

 DbMigrator Fixes:
- Fixed migration path discovery (AppContext.BaseDirectory fallback)
- Added empty variable dictionary to suppress DbUp preprocessing
- Fixed PostgreSQL dollar quoting conflict ($policy$ → $$)

 Migration Results:
- All 21 migrations executed successfully
- Schema versions journal created and tracked
- 21 scripts processed in order, no rollback needed

Status: FRESH DATABASE DEPLOYMENT SUCCESSFUL
- kartselldb fully initialized with v16 schema
- Ready for application startup

Next: Deploy application and run integration tests

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-08-02 06:45:20 +09:00
parent fc39c8d4bf
commit 3b76070394
135 changed files with 6673 additions and 2 deletions
@@ -0,0 +1,29 @@
const componentByCapability = {
'button': 'Button', 'text-field': 'TextField', 'text-area': 'TextArea', 'select': 'Select',
'multi-select': 'MultiSelect', 'checkbox': 'Checkbox', 'date-field': 'DateField',
'number-field': 'NumberField', 'dialog': 'Dialog', 'status-tag': 'StatusTag',
'inline-message': 'InlineMessage', 'paginator': 'Paginator', 'tabs': 'Tabs', 'data-grid': 'DataGrid'
};
export function evaluateUiAdapterCompatibility(adapter, requiredCapabilities, requireProductionEligible = false) {
const issues = [];
if (adapter.descriptor.contractVersion !== '4.0') {
issues.push({ code: 'CONTRACT_VERSION', severity: 'ERROR', detail: `Expected 4.0, got ${adapter.descriptor.contractVersion}` });
}
for (const capability of requiredCapabilities) {
if (!adapter.descriptor.capabilities.has(capability)) {
issues.push({ code: 'MISSING_CAPABILITY', severity: 'ERROR', detail: capability });
continue;
}
const component = adapter.components[componentByCapability[capability]];
if (!component)
issues.push({ code: 'MISSING_COMPONENT', severity: 'ERROR', detail: capability });
}
if (requireProductionEligible && !adapter.descriptor.productionEligible) {
issues.push({ code: 'PRODUCTION_INELIGIBLE', severity: 'ERROR', detail: adapter.descriptor.id });
}
return { adapterId: adapter.descriptor.id, contractVersion: adapter.descriptor.contractVersion, compatible: !issues.some(x => x.severity === 'ERROR'), issues };
}
export function assertUiAdapterCompatibility(report) {
if (!report.compatible)
throw new Error(`UI adapter ${report.adapterId} is incompatible: ${report.issues.map(x => `${x.code}:${x.detail}`).join(', ')}`);
}
@@ -0,0 +1,22 @@
export const requiredUiAdapterCapabilities = Object.freeze([
'button', 'text-field', 'text-area', 'select', 'multi-select', 'checkbox', 'date-field',
'number-field', 'dialog', 'status-tag', 'inline-message', 'paginator', 'tabs', 'data-grid'
]);
export function assertUiAdapterContract(adapter) {
if (adapter.descriptor.contractVersion !== '4.0') {
throw new Error(`Unsupported UI adapter contract: ${adapter.descriptor.contractVersion}`);
}
const missing = requiredUiAdapterCapabilities.filter(x => !adapter.descriptor.capabilities.has(x));
if (missing.length > 0) {
throw new Error(`UI adapter ${adapter.descriptor.id} is missing capabilities: ${missing.join(', ')}`);
}
const componentNames = [
'Button', 'TextField', 'TextArea', 'Select', 'MultiSelect', 'Checkbox', 'DateField',
'NumberField', 'Dialog', 'StatusTag', 'InlineMessage', 'Paginator', 'Tabs', 'DataGrid'
];
for (const name of componentNames) {
if (!adapter.components[name])
throw new Error(`UI adapter ${adapter.descriptor.id} has no component for ${name}`);
}
}
export const uiAdapterKey = Symbol('KArtSellUiAdapterV4');
@@ -0,0 +1,43 @@
const __VLS_props = withDefaults(defineProps(), { severity: 'primary', type: 'button', disabled: false, loading: false });
const emit = defineEmits();
const __VLS_defaults = { severity: 'primary', type: 'button', disabled: false, loading: false };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.button, __VLS_intrinsics.button)({
...{ onClick: (...[$event]) => {
return (__VLS_ctx.emit('activate', $event));
// @ts-ignore
[emit,];
} },
...{ class: "ks-native-button" },
...{ class: (`is-${__VLS_ctx.severity}`) },
type: (__VLS_ctx.type),
disabled: (__VLS_ctx.disabled || __VLS_ctx.loading),
});
/** @type {__VLS_StyleScopedClasses['ks-native-button']} */ ;
if (__VLS_ctx.loading) {
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({
'aria-hidden': "true",
});
}
var __VLS_0 = {};
(__VLS_ctx.label);
// @ts-ignore
var __VLS_1 = __VLS_0;
// @ts-ignore
[severity, type, disabled, loading, loading, label,];
const __VLS_base = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
const __VLS_export = {};
export default {};
@@ -0,0 +1,38 @@
const __VLS_props = defineProps();
const emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.input)({
...{ onChange: (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', $event.target.checked));
// @ts-ignore
[emit,];
} },
...{ onBlur: (...[$event]) => {
return (__VLS_ctx.emit('blur', $event));
// @ts-ignore
[emit,];
} },
id: (__VLS_ctx.inputId),
...{ class: "ks-native-checkbox" },
type: "checkbox",
checked: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
'aria-invalid': (__VLS_ctx.invalid || undefined),
});
/** @type {__VLS_StyleScopedClasses['ks-native-checkbox']} */ ;
// @ts-ignore
[inputId, modelValue, disabled, invalid,];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,79 @@
const __VLS_props = withDefaults(defineProps(), { loading: false, height: '32rem', rowSelection: 'single' });
const emit = defineEmits();
function value(row, field) { return typeof row === 'object' && row !== null ? row[field] : undefined; }
const __VLS_defaults = { loading: false, height: '32rem', rowSelection: 'single' };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
...{ class: "ks-native-grid" },
...{ style: ({ maxHeight: __VLS_ctx.height }) },
'aria-busy': (__VLS_ctx.loading),
});
/** @type {__VLS_StyleScopedClasses['ks-native-grid']} */ ;
if (__VLS_ctx.loading) {
__VLS_asFunctionalElement1(__VLS_intrinsics.p, __VLS_intrinsics.p)({
role: "status",
});
}
__VLS_asFunctionalElement1(__VLS_intrinsics.table, __VLS_intrinsics.table)({});
__VLS_asFunctionalElement1(__VLS_intrinsics.thead, __VLS_intrinsics.thead)({});
__VLS_asFunctionalElement1(__VLS_intrinsics.tr, __VLS_intrinsics.tr)({});
for (const [column] of __VLS_vFor((__VLS_ctx.columns))) {
__VLS_asFunctionalElement1(__VLS_intrinsics.th, __VLS_intrinsics.th)({
key: (column.field),
scope: "col",
...{ style: ({ width: column.width ? `${column.width}px` : undefined, minWidth: column.minWidth ? `${column.minWidth}px` : undefined }) },
});
(column.header);
// @ts-ignore
[height, loading, loading, columns,];
}
__VLS_asFunctionalElement1(__VLS_intrinsics.tbody, __VLS_intrinsics.tbody)({});
for (const [row, index] of __VLS_vFor((__VLS_ctx.rows))) {
__VLS_asFunctionalElement1(__VLS_intrinsics.tr, __VLS_intrinsics.tr)({
...{ onClick: (...[$event]) => {
return (__VLS_ctx.emit('row-selected', row));
// @ts-ignore
[rows, emit,];
} },
...{ onKeydown: (...[$event]) => {
return (__VLS_ctx.emit('row-selected', row));
// @ts-ignore
[emit,];
} },
key: (index),
tabindex: "0",
});
for (const [column] of __VLS_vFor((__VLS_ctx.columns))) {
__VLS_asFunctionalElement1(__VLS_intrinsics.td, __VLS_intrinsics.td)({
key: (column.field),
});
(column.formatter ? column.formatter(__VLS_ctx.value(row, column.field), row) : __VLS_ctx.value(row, column.field));
// @ts-ignore
[columns, value, value,];
}
// @ts-ignore
[];
}
if (!__VLS_ctx.loading && __VLS_ctx.rows.length === 0) {
__VLS_asFunctionalElement1(__VLS_intrinsics.tr, __VLS_intrinsics.tr)({});
__VLS_asFunctionalElement1(__VLS_intrinsics.td, __VLS_intrinsics.td)({
colspan: (__VLS_ctx.columns.length),
});
}
// @ts-ignore
[loading, columns, rows,];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,44 @@
const __VLS_props = defineProps();
const emit = defineEmits();
function toDateValue(value) { if (!value)
return ''; if (value instanceof Date)
return value.toISOString().slice(0, 10); return value.slice(0, 10); }
function boundary(value) { return value?.toISOString().slice(0, 10); }
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.input)({
...{ onInput: (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', $event.target.value || null));
// @ts-ignore
[emit,];
} },
...{ onBlur: (...[$event]) => {
return (__VLS_ctx.emit('blur', $event));
// @ts-ignore
[emit,];
} },
id: (__VLS_ctx.inputId),
...{ class: "ks-native-input" },
type: "date",
value: (__VLS_ctx.toDateValue(__VLS_ctx.modelValue)),
disabled: (__VLS_ctx.disabled),
'aria-invalid': (__VLS_ctx.invalid || undefined),
min: (__VLS_ctx.boundary(__VLS_ctx.min)),
max: (__VLS_ctx.boundary(__VLS_ctx.max)),
});
/** @type {__VLS_StyleScopedClasses['ks-native-input']} */ ;
// @ts-ignore
[inputId, toDateValue, modelValue, disabled, invalid, boundary, boundary, min, max,];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,48 @@
import { nextTick, ref, watch } from 'vue';
const props = defineProps();
const emit = defineEmits();
const element = ref(null);
watch(() => props.visible, async (visible) => { await nextTick(); const dialog = element.value; if (!dialog)
return; if (visible && !dialog.open)
props.modal === false ? dialog.show() : dialog.showModal(); if (!visible && dialog.open)
dialog.close(); }, { immediate: true });
function close() { emit('update:visible', false); }
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.dialog, __VLS_intrinsics.dialog)({
...{ onClose: (__VLS_ctx.close) },
...{ onCancel: (__VLS_ctx.close) },
ref: "element",
...{ class: "ks-native-dialog" },
});
/** @type {__VLS_StyleScopedClasses['ks-native-dialog']} */ ;
__VLS_asFunctionalElement1(__VLS_intrinsics.header, __VLS_intrinsics.header)({});
__VLS_asFunctionalElement1(__VLS_intrinsics.h2, __VLS_intrinsics.h2)({});
(__VLS_ctx.title);
__VLS_asFunctionalElement1(__VLS_intrinsics.button, __VLS_intrinsics.button)({
...{ onClick: (__VLS_ctx.close) },
type: "button",
'aria-label': "닫기",
});
__VLS_asFunctionalElement1(__VLS_intrinsics.section, __VLS_intrinsics.section)({});
var __VLS_0 = {};
__VLS_asFunctionalElement1(__VLS_intrinsics.footer, __VLS_intrinsics.footer)({});
var __VLS_2 = {};
// @ts-ignore
var __VLS_1 = __VLS_0, __VLS_3 = __VLS_2;
// @ts-ignore
[close, close, close, title,];
const __VLS_base = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
const __VLS_export = {};
export default {};
@@ -0,0 +1,46 @@
const __VLS_props = withDefaults(defineProps(), { severity: 'info', dismissible: false });
const emit = defineEmits();
const __VLS_defaults = { severity: 'info', dismissible: false };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
...{ class: "ks-inline-message" },
'data-severity': (__VLS_ctx.severity),
role: (__VLS_ctx.severity === 'danger' ? 'alert' : 'status'),
});
/** @type {__VLS_StyleScopedClasses['ks-inline-message']} */ ;
if (__VLS_ctx.title) {
__VLS_asFunctionalElement1(__VLS_intrinsics.strong, __VLS_intrinsics.strong)({});
(__VLS_ctx.title);
}
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
(__VLS_ctx.message);
if (__VLS_ctx.dismissible) {
__VLS_asFunctionalElement1(__VLS_intrinsics.button, __VLS_intrinsics.button)({
...{ onClick: (...[$event]) => {
if (!(__VLS_ctx.dismissible))
throw 0;
return (__VLS_ctx.emit('dismiss'));
// @ts-ignore
[severity, severity, title, title, message, dismissible, emit,];
} },
type: "button",
'aria-label': "메시지 닫기",
});
}
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,58 @@
const props = withDefaults(defineProps(), { modelValue: () => [] });
const emit = defineEmits();
function update(event) {
const selected = Array.from(event.target.selectedOptions).map(x => {
const option = props.options[Number(x.value)];
return option?.value ?? null;
});
emit('update:modelValue', selected);
}
const __VLS_defaults = { modelValue: () => [] };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.label, __VLS_intrinsics.label)({
...{ class: "ks-field" },
});
/** @type {__VLS_StyleScopedClasses['ks-field']} */ ;
if (__VLS_ctx.label) {
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
(__VLS_ctx.label);
if (__VLS_ctx.required) {
__VLS_asFunctionalElement1(__VLS_intrinsics.b, __VLS_intrinsics.b)({
'aria-hidden': "true",
});
}
}
__VLS_asFunctionalElement1(__VLS_intrinsics.select, __VLS_intrinsics.select)({
...{ onChange: (__VLS_ctx.update) },
multiple: true,
disabled: (__VLS_ctx.disabled),
required: (__VLS_ctx.required),
});
for (const [option, index] of __VLS_vFor((__VLS_ctx.options))) {
__VLS_asFunctionalElement1(__VLS_intrinsics.option, __VLS_intrinsics.option)({
key: (`${index}:${option.label}`),
value: (index),
disabled: (option.disabled),
selected: (__VLS_ctx.modelValue.includes(option.value)),
});
(option.label);
// @ts-ignore
[label, label, required, required, update, disabled, options, modelValue,];
}
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,43 @@
const __VLS_props = defineProps();
const emit = defineEmits();
function parse(raw) { if (raw.trim() === '')
return null; const value = Number(raw); return Number.isFinite(value) ? value : null; }
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.input)({
...{ onInput: (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', __VLS_ctx.parse($event.target.value)));
// @ts-ignore
[emit, parse,];
} },
...{ onBlur: (...[$event]) => {
return (__VLS_ctx.emit('blur', $event));
// @ts-ignore
[emit,];
} },
id: (__VLS_ctx.inputId),
...{ class: "ks-native-input" },
type: "number",
value: (__VLS_ctx.modelValue ?? ''),
disabled: (__VLS_ctx.disabled),
'aria-invalid': (__VLS_ctx.invalid || undefined),
min: (__VLS_ctx.min),
max: (__VLS_ctx.max),
step: (__VLS_ctx.maxFractionDigits ? 1 / 10 ** __VLS_ctx.maxFractionDigits : 1),
});
/** @type {__VLS_StyleScopedClasses['ks-native-input']} */ ;
// @ts-ignore
[inputId, modelValue, disabled, invalid, min, max, maxFractionDigits, maxFractionDigits,];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,66 @@
const props = withDefaults(defineProps(), { pageSizes: () => [20, 50, 100], disabled: false });
const emit = defineEmits();
const pageCount = () => Math.max(1, Math.ceil(props.total / props.pageSize));
function move(page) { emit('pageChange', { page: Math.min(Math.max(1, page), pageCount()), pageSize: props.pageSize }); }
function size(event) { emit('pageChange', { page: 1, pageSize: Number(event.target.value) }); }
const __VLS_defaults = { pageSizes: () => [20, 50, 100], disabled: false };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.nav, __VLS_intrinsics.nav)({
...{ class: "ks-paginator" },
'aria-label': "목록 페이지",
});
/** @type {__VLS_StyleScopedClasses['ks-paginator']} */ ;
__VLS_asFunctionalElement1(__VLS_intrinsics.button, __VLS_intrinsics.button)({
...{ onClick: (...[$event]) => {
return (__VLS_ctx.move(__VLS_ctx.page - 1));
// @ts-ignore
[move, page,];
} },
type: "button",
disabled: (__VLS_ctx.disabled || __VLS_ctx.page <= 1),
});
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
(__VLS_ctx.page);
(__VLS_ctx.pageCount());
(__VLS_ctx.total);
__VLS_asFunctionalElement1(__VLS_intrinsics.button, __VLS_intrinsics.button)({
...{ onClick: (...[$event]) => {
return (__VLS_ctx.move(__VLS_ctx.page + 1));
// @ts-ignore
[move, page, page, page, disabled, pageCount, total,];
} },
type: "button",
disabled: (__VLS_ctx.disabled || __VLS_ctx.page >= __VLS_ctx.pageCount()),
});
__VLS_asFunctionalElement1(__VLS_intrinsics.label, __VLS_intrinsics.label)({});
__VLS_asFunctionalElement1(__VLS_intrinsics.select, __VLS_intrinsics.select)({
...{ onChange: (__VLS_ctx.size) },
value: (__VLS_ctx.pageSize),
disabled: (__VLS_ctx.disabled),
});
for (const [item] of __VLS_vFor((__VLS_ctx.pageSizes))) {
__VLS_asFunctionalElement1(__VLS_intrinsics.option, __VLS_intrinsics.option)({
key: (item),
value: (item),
});
(item);
// @ts-ignore
[page, disabled, disabled, pageCount, size, pageSize, pageSizes,];
}
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,56 @@
const props = defineProps();
const emit = defineEmits();
function encode(value) { return JSON.stringify(value); }
function decode(raw) { const option = props.options.find(x => encode(x.value) === raw); return option?.value ?? null; }
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.select, __VLS_intrinsics.select)({
...{ onChange: (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', __VLS_ctx.decode($event.target.value)));
// @ts-ignore
[emit, decode,];
} },
...{ onBlur: (...[$event]) => {
return (__VLS_ctx.emit('blur', $event));
// @ts-ignore
[emit,];
} },
id: (__VLS_ctx.inputId),
...{ class: "ks-native-input" },
value: (__VLS_ctx.encode(__VLS_ctx.modelValue)),
disabled: (__VLS_ctx.disabled),
'aria-invalid': (__VLS_ctx.invalid || undefined),
});
/** @type {__VLS_StyleScopedClasses['ks-native-input']} */ ;
if (__VLS_ctx.placeholder) {
__VLS_asFunctionalElement1(__VLS_intrinsics.option, __VLS_intrinsics.option)({
value: "",
disabled: true,
});
(__VLS_ctx.placeholder);
}
for (const [option] of __VLS_vFor((__VLS_ctx.options))) {
__VLS_asFunctionalElement1(__VLS_intrinsics.option, __VLS_intrinsics.option)({
key: (__VLS_ctx.encode(option.value)),
value: (__VLS_ctx.encode(option.value)),
disabled: (option.disabled),
});
(option.label);
// @ts-ignore
[inputId, encode, encode, encode, modelValue, disabled, invalid, placeholder, placeholder, options,];
}
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,23 @@
const __VLS_props = withDefaults(defineProps(), { severity: 'info' });
const __VLS_defaults = { severity: 'info' };
const __VLS_ctx = {
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({
...{ class: "ks-native-tag" },
...{ class: (`is-${__VLS_ctx.severity}`) },
});
/** @type {__VLS_StyleScopedClasses['ks-native-tag']} */ ;
(__VLS_ctx.value);
// @ts-ignore
[severity, value,];
const __VLS_export = (await import('vue')).defineComponent({
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,58 @@
const __VLS_props = withDefaults(defineProps(), { ariaLabel: '탭' });
const emit = defineEmits();
const __VLS_defaults = { ariaLabel: '탭' };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({});
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
...{ class: "ks-tabs" },
role: "tablist",
'aria-label': (__VLS_ctx.ariaLabel),
});
/** @type {__VLS_StyleScopedClasses['ks-tabs']} */ ;
for (const [item] of __VLS_vFor((__VLS_ctx.items))) {
__VLS_asFunctionalElement1(__VLS_intrinsics.button, __VLS_intrinsics.button)({
...{ onClick: (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', item.id));
// @ts-ignore
[ariaLabel, items, emit,];
} },
key: (item.id),
type: "button",
role: "tab",
'aria-selected': (__VLS_ctx.modelValue === item.id),
disabled: (item.disabled),
});
(item.label);
if (item.badge) {
__VLS_asFunctionalElement1(__VLS_intrinsics.small, __VLS_intrinsics.small)({});
(item.badge);
}
// @ts-ignore
[modelValue,];
}
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
role: "tabpanel",
});
var __VLS_0 = {
activeId: (__VLS_ctx.modelValue),
};
// @ts-ignore
var __VLS_1 = __VLS_0;
// @ts-ignore
[modelValue,];
const __VLS_base = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
const __VLS_export = {};
export default {};
@@ -0,0 +1,39 @@
const __VLS_props = defineProps();
const emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.textarea)({
...{ onInput: (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', $event.target.value));
// @ts-ignore
[emit,];
} },
...{ onBlur: (...[$event]) => {
return (__VLS_ctx.emit('blur', $event));
// @ts-ignore
[emit,];
} },
id: (__VLS_ctx.inputId),
...{ class: "ks-native-input" },
value: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
'aria-invalid': (__VLS_ctx.invalid || undefined),
rows: (__VLS_ctx.rows ?? 4),
placeholder: (__VLS_ctx.placeholder),
});
/** @type {__VLS_StyleScopedClasses['ks-native-input']} */ ;
// @ts-ignore
[inputId, modelValue, disabled, invalid, rows, placeholder,];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,39 @@
const __VLS_props = defineProps();
const emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.input)({
...{ onInput: (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', $event.target.value));
// @ts-ignore
[emit,];
} },
...{ onBlur: (...[$event]) => {
return (__VLS_ctx.emit('blur', $event));
// @ts-ignore
[emit,];
} },
id: (__VLS_ctx.inputId),
...{ class: "ks-native-input" },
type: "text",
value: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
'aria-invalid': (__VLS_ctx.invalid || undefined),
placeholder: (__VLS_ctx.placeholder),
});
/** @type {__VLS_StyleScopedClasses['ks-native-input']} */ ;
// @ts-ignore
[inputId, modelValue, disabled, invalid, placeholder,];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,22 @@
import Button from './NativeButtonAdapter.vue';
import TextField from './NativeTextFieldAdapter.vue';
import TextArea from './NativeTextAreaAdapter.vue';
import Select from './NativeSelectAdapter.vue';
import MultiSelect from './NativeMultiSelectAdapter.vue';
import Checkbox from './NativeCheckboxAdapter.vue';
import DateField from './NativeDateFieldAdapter.vue';
import NumberField from './NativeNumberFieldAdapter.vue';
import Dialog from './NativeDialogAdapter.vue';
import StatusTag from './NativeStatusTagAdapter.vue';
import InlineMessage from './NativeInlineMessageAdapter.vue';
import Paginator from './NativePaginatorAdapter.vue';
import Tabs from './NativeTabsAdapter.vue';
import DataGrid from './NativeDataGridAdapter.vue';
const capabilities = new Set([
'button', 'text-field', 'text-area', 'select', 'multi-select', 'checkbox', 'date-field', 'number-field',
'dialog', 'status-tag', 'inline-message', 'paginator', 'tabs', 'data-grid'
]);
export const nativeUiAdapter = Object.freeze({
descriptor: Object.freeze({ id: 'native-accessible', version: '2.0.0', contractVersion: '4.0', vendor: 'HTML platform primitives', capabilities, productionEligible: false, accessibilityBaseline: 'WCAG_2_2_AA_TARGET' }),
components: Object.freeze({ Button, TextField, TextArea, Select, MultiSelect, Checkbox, DateField, NumberField, Dialog, StatusTag, InlineMessage, Paginator, Tabs, DataGrid })
});
@@ -0,0 +1,7 @@
import { installUiAdapter } from '../useUiAdapter';
import { nativeUiAdapter } from './index';
import './native.css';
export const nativeUiProvider = {
id: 'native-accessible',
install(app) { installUiAdapter(app, nativeUiAdapter); }
};
@@ -0,0 +1,82 @@
import { computed } from 'vue';
import { AgGridVue } from 'ag-grid-vue3';
import { AllCommunityModule, ModuleRegistry, themeQuartz } from 'ag-grid-community';
ModuleRegistry.registerModules([AllCommunityModule]);
const props = withDefaults(defineProps(), { loading: false, height: '32rem', rowSelection: 'single' });
const emit = defineEmits();
const columnDefs = computed(() => props.columns.map(column => ({
field: column.field,
headerName: column.header,
width: column.width,
minWidth: column.minWidth ?? 120,
sortable: column.sortable ?? true,
filter: column.filterable ?? true,
valueFormatter: column.formatter
? params => column.formatter?.(params.value, params.data) ?? ''
: undefined
})));
const rowSelectionOptions = computed(() => {
if (props.rowSelection === 'none')
return undefined;
return props.rowSelection === 'multiple'
? { mode: 'multiRow' }
: { mode: 'singleRow' };
});
function onRowClicked(event) {
if (event.data)
emit('rowSelected', event.data);
}
const __VLS_defaults = { loading: false, height: '32rem', rowSelection: 'single' };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
...{ class: "ks-grid" },
...{ style: ({ height: __VLS_ctx.height }) },
'aria-busy': (__VLS_ctx.loading),
});
/** @type {__VLS_StyleScopedClasses['ks-grid']} */ ;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.AgGridVue} */
AgGridVue;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onRowClicked': {} },
...{ style: {} },
theme: (__VLS_ctx.themeQuartz),
rowData: (__VLS_ctx.rows),
columnDefs: (__VLS_ctx.columnDefs),
rowSelection: (__VLS_ctx.rowSelectionOptions),
loading: (__VLS_ctx.loading),
}));
const __VLS_2 = __VLS_1({
...{ 'onRowClicked': {} },
...{ style: {} },
theme: (__VLS_ctx.themeQuartz),
rowData: (__VLS_ctx.rows),
columnDefs: (__VLS_ctx.columnDefs),
rowSelection: (__VLS_ctx.rowSelectionOptions),
loading: (__VLS_ctx.loading),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.rowClicked} */
onRowClicked: (__VLS_ctx.onRowClicked),
};
var __VLS_3;
var __VLS_4;
// @ts-ignore
[height, loading, loading, themeQuartz, rows, columnDefs, rowSelectionOptions, onRowClicked,];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,66 @@
import Button from 'primevue/button';
const __VLS_props = withDefaults(defineProps(), { severity: 'primary', type: 'button', disabled: false, loading: false });
const __VLS_emit = defineEmits();
const __VLS_defaults = { severity: 'primary', type: 'button', disabled: false, loading: false };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
/** @type {__VLS_StyleScopedClasses['ks-button']} */ ;
/** @type {__VLS_StyleScopedClasses['ks-button']} */ ;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.Button | typeof __VLS_components.Button} */
Button;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onClick': {} },
...{ class: "ks-button" },
label: (__VLS_ctx.label),
severity: (__VLS_ctx.severity),
type: (__VLS_ctx.type),
disabled: (__VLS_ctx.disabled),
loading: (__VLS_ctx.loading),
}));
const __VLS_2 = __VLS_1({
...{ 'onClick': {} },
...{ class: "ks-button" },
label: (__VLS_ctx.label),
severity: (__VLS_ctx.severity),
type: (__VLS_ctx.type),
disabled: (__VLS_ctx.disabled),
loading: (__VLS_ctx.loading),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.click} */
onClick: (...[$event]) => {
return (__VLS_ctx.$emit('activate', $event));
// @ts-ignore
[label, severity, type, disabled, loading, $emit,];
},
};
var __VLS_7;
/** @type {__VLS_StyleScopedClasses['ks-button']} */ ;
const { default: __VLS_8 } = __VLS_3.slots;
var __VLS_9 = {};
// @ts-ignore
[];
var __VLS_3;
var __VLS_4;
// @ts-ignore
var __VLS_10 = __VLS_9;
// @ts-ignore
[];
const __VLS_base = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
const __VLS_export = {};
export default {};
@@ -0,0 +1,53 @@
import Checkbox from 'primevue/checkbox';
const __VLS_props = defineProps();
const __VLS_emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.Checkbox} */
Checkbox;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onUpdate:modelValue': {} },
...{ class: "ks-checkbox" },
inputId: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
binary: true,
disabled: (__VLS_ctx.disabled),
}));
const __VLS_2 = __VLS_1({
...{ 'onUpdate:modelValue': {} },
...{ class: "ks-checkbox" },
inputId: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
binary: true,
disabled: (__VLS_ctx.disabled),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.'update:modelValue'} */
'onUpdate:modelValue': (...[$event]) => {
return (__VLS_ctx.$emit('update:modelValue', Boolean($event)));
// @ts-ignore
[inputId, modelValue, disabled, $emit,];
},
};
var __VLS_7;
/** @type {__VLS_StyleScopedClasses['ks-checkbox']} */ ;
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,80 @@
import DatePicker from 'primevue/datepicker';
import { computed } from 'vue';
const props = defineProps();
const emit = defineEmits();
const dateValue = computed(() => {
if (props.modelValue instanceof Date)
return props.modelValue;
if (typeof props.modelValue === 'string')
return new Date(props.modelValue);
return null;
});
const handleDateChange = (value) => {
if (value instanceof Date)
emit('update:modelValue', value);
else if (value === null || value === undefined)
emit('update:modelValue', null);
else
emit('update:modelValue', value[0] ?? null);
};
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.DatePicker} */
DatePicker;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
inputId: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.dateValue),
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
minDate: (__VLS_ctx.min),
maxDate: (__VLS_ctx.max),
dateFormat: "yy-mm-dd",
showIcon: true,
}));
const __VLS_2 = __VLS_1({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
inputId: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.dateValue),
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
minDate: (__VLS_ctx.min),
maxDate: (__VLS_ctx.max),
dateFormat: "yy-mm-dd",
showIcon: true,
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.'update:modelValue'} */
'onUpdate:modelValue': (__VLS_ctx.handleDateChange),
};
const __VLS_7 = {
/** @type {typeof __VLS_5.blur} */
onBlur: (...[$event]) => {
return (__VLS_ctx.emit('blur', $event));
// @ts-ignore
[inputId, dateValue, disabled, invalid, min, max, handleDateChange, emit,];
},
};
var __VLS_8;
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,66 @@
import Dialog from 'primevue/dialog';
const __VLS_props = defineProps();
const __VLS_emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.Dialog | typeof __VLS_components.Dialog} */
Dialog;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onUpdate:visible': {} },
...{ class: "ks-dialog" },
visible: (__VLS_ctx.visible),
header: (__VLS_ctx.title),
modal: (__VLS_ctx.modal ?? true),
closable: (__VLS_ctx.closable ?? true),
}));
const __VLS_2 = __VLS_1({
...{ 'onUpdate:visible': {} },
...{ class: "ks-dialog" },
visible: (__VLS_ctx.visible),
header: (__VLS_ctx.title),
modal: (__VLS_ctx.modal ?? true),
closable: (__VLS_ctx.closable ?? true),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.'update:visible'} */
'onUpdate:visible': (...[$event]) => {
return (__VLS_ctx.$emit('update:visible', $event));
// @ts-ignore
[visible, title, modal, closable, $emit,];
},
};
var __VLS_7;
/** @type {__VLS_StyleScopedClasses['ks-dialog']} */ ;
const { default: __VLS_8 } = __VLS_3.slots;
var __VLS_9 = {};
{
const { footer: __VLS_11 } = __VLS_3.slots;
var __VLS_12 = {};
// @ts-ignore
[];
}
// @ts-ignore
[];
var __VLS_3;
var __VLS_4;
// @ts-ignore
var __VLS_10 = __VLS_9, __VLS_13 = __VLS_12;
// @ts-ignore
[];
const __VLS_base = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
const __VLS_export = {};
export default {};
@@ -0,0 +1,57 @@
import Message from 'primevue/message';
const __VLS_props = withDefaults(defineProps(), { severity: 'info', dismissible: false });
const emit = defineEmits();
const map = { primary: 'info', secondary: 'secondary', success: 'success', info: 'info', warning: 'warn', danger: 'error' };
const __VLS_defaults = { severity: 'info', dismissible: false };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.Message | typeof __VLS_components.Message} */
Message;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onClose': {} },
severity: (__VLS_ctx.map[__VLS_ctx.severity]),
closable: (__VLS_ctx.dismissible),
}));
const __VLS_2 = __VLS_1({
...{ 'onClose': {} },
severity: (__VLS_ctx.map[__VLS_ctx.severity]),
closable: (__VLS_ctx.dismissible),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.close} */
onClose: (...[$event]) => {
return (__VLS_ctx.emit('dismiss'));
// @ts-ignore
[map, severity, dismissible, emit,];
},
};
var __VLS_7;
const { default: __VLS_8 } = __VLS_3.slots;
if (__VLS_ctx.title) {
__VLS_asFunctionalElement1(__VLS_intrinsics.strong, __VLS_intrinsics.strong)({});
(__VLS_ctx.title);
}
(__VLS_ctx.message);
// @ts-ignore
[title, title, message,];
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,68 @@
import MultiSelect from 'primevue/multiselect';
const __VLS_props = withDefaults(defineProps(), { modelValue: () => [] });
const emit = defineEmits();
const __VLS_defaults = { modelValue: () => [] };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.label, __VLS_intrinsics.label)({
...{ class: "ks-field" },
});
/** @type {__VLS_StyleScopedClasses['ks-field']} */ ;
if (__VLS_ctx.label) {
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
(__VLS_ctx.label);
if (__VLS_ctx.required) {
__VLS_asFunctionalElement1(__VLS_intrinsics.b, __VLS_intrinsics.b)({
'aria-hidden': "true",
});
}
}
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.MultiSelect} */
MultiSelect;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onUpdate:modelValue': {} },
modelValue: (__VLS_ctx.modelValue),
options: (__VLS_ctx.options),
optionLabel: "label",
optionValue: "value",
optionDisabled: "disabled",
disabled: (__VLS_ctx.disabled),
}));
const __VLS_2 = __VLS_1({
...{ 'onUpdate:modelValue': {} },
modelValue: (__VLS_ctx.modelValue),
options: (__VLS_ctx.options),
optionLabel: "label",
optionValue: "value",
optionDisabled: "disabled",
disabled: (__VLS_ctx.disabled),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.'update:modelValue'} */
'onUpdate:modelValue': (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', $event));
// @ts-ignore
[label, label, required, modelValue, options, disabled, emit,];
},
};
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,68 @@
import InputNumber from 'primevue/inputnumber';
const __VLS_props = defineProps();
const emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.InputNumber} */
InputNumber;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
inputId: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
min: (__VLS_ctx.min),
max: (__VLS_ctx.max),
minFractionDigits: (__VLS_ctx.minFractionDigits),
maxFractionDigits: (__VLS_ctx.maxFractionDigits),
}));
const __VLS_2 = __VLS_1({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
inputId: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
min: (__VLS_ctx.min),
max: (__VLS_ctx.max),
minFractionDigits: (__VLS_ctx.minFractionDigits),
maxFractionDigits: (__VLS_ctx.maxFractionDigits),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.'update:modelValue'} */
'onUpdate:modelValue': (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', $event));
// @ts-ignore
[inputId, modelValue, disabled, invalid, min, max, minFractionDigits, maxFractionDigits, emit,];
},
};
const __VLS_7 = {
/** @type {typeof __VLS_5.blur} */
onBlur: (...[$event]) => {
return (__VLS_ctx.emit('blur', $event));
// @ts-ignore
[emit,];
},
};
var __VLS_8;
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,54 @@
import Paginator from 'primevue/paginator';
const __VLS_props = withDefaults(defineProps(), { pageSizes: () => [20, 50, 100], disabled: false });
const emit = defineEmits();
const __VLS_defaults = { pageSizes: () => [20, 50, 100], disabled: false };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.Paginator} */
Paginator;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onPage': {} },
first: ((__VLS_ctx.page - 1) * __VLS_ctx.pageSize),
rows: (__VLS_ctx.pageSize),
totalRecords: (__VLS_ctx.total),
rowsPerPageOptions: (__VLS_ctx.pageSizes),
disabled: (__VLS_ctx.disabled),
}));
const __VLS_2 = __VLS_1({
...{ 'onPage': {} },
first: ((__VLS_ctx.page - 1) * __VLS_ctx.pageSize),
rows: (__VLS_ctx.pageSize),
totalRecords: (__VLS_ctx.total),
rowsPerPageOptions: (__VLS_ctx.pageSizes),
disabled: (__VLS_ctx.disabled),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.page} */
onPage: (...[$event]) => {
return (__VLS_ctx.emit('pageChange', { page: $event.page + 1, pageSize: $event.rows }));
// @ts-ignore
[page, pageSize, pageSize, total, pageSizes, disabled, emit,];
},
};
var __VLS_7;
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
export default {};
@@ -0,0 +1,73 @@
import Select from 'primevue/select';
const __VLS_props = defineProps();
const __VLS_emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.Select} */
Select;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
...{ class: "ks-select" },
inputId: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
options: (__VLS_ctx.options),
optionLabel: "label",
optionValue: "value",
optionDisabled: "disabled",
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
placeholder: (__VLS_ctx.placeholder),
}));
const __VLS_2 = __VLS_1({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
...{ class: "ks-select" },
inputId: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
options: (__VLS_ctx.options),
optionLabel: "label",
optionValue: "value",
optionDisabled: "disabled",
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
placeholder: (__VLS_ctx.placeholder),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.'update:modelValue'} */
'onUpdate:modelValue': (...[$event]) => {
return (__VLS_ctx.$emit('update:modelValue', $event));
// @ts-ignore
[inputId, modelValue, options, disabled, invalid, placeholder, $emit,];
},
};
const __VLS_7 = {
/** @type {typeof __VLS_5.blur} */
onBlur: (...[$event]) => {
return (__VLS_ctx.$emit('blur', $event));
// @ts-ignore
[$emit,];
},
};
var __VLS_8;
/** @type {__VLS_StyleScopedClasses['ks-select']} */ ;
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,43 @@
import Tag from 'primevue/tag';
const __VLS_props = defineProps();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.Tag | typeof __VLS_components.Tag} */
Tag;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ class: "ks-status-tag" },
severity: (__VLS_ctx.severity ?? 'info'),
}));
const __VLS_2 = __VLS_1({
...{ class: "ks-status-tag" },
severity: (__VLS_ctx.severity ?? 'info'),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
var __VLS_5;
/** @type {__VLS_StyleScopedClasses['ks-status-tag']} */ ;
const { default: __VLS_6 } = __VLS_3.slots;
if (__VLS_ctx.iconLabel) {
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({
'aria-hidden': "true",
});
(__VLS_ctx.iconLabel);
}
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
(__VLS_ctx.value);
// @ts-ignore
[severity, iconLabel, iconLabel, value,];
var __VLS_3;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeProps: {},
});
export default {};
@@ -0,0 +1,58 @@
const __VLS_props = withDefaults(defineProps(), { ariaLabel: '탭' });
const emit = defineEmits();
const __VLS_defaults = { ariaLabel: '탭' };
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({});
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
...{ class: "ks-tabs" },
role: "tablist",
'aria-label': (__VLS_ctx.ariaLabel),
});
/** @type {__VLS_StyleScopedClasses['ks-tabs']} */ ;
for (const [item] of __VLS_vFor((__VLS_ctx.items))) {
__VLS_asFunctionalElement1(__VLS_intrinsics.button, __VLS_intrinsics.button)({
...{ onClick: (...[$event]) => {
return (__VLS_ctx.emit('update:modelValue', item.id));
// @ts-ignore
[ariaLabel, items, emit,];
} },
key: (item.id),
type: "button",
role: "tab",
'aria-selected': (__VLS_ctx.modelValue === item.id),
disabled: (item.disabled),
});
(item.label);
if (item.badge) {
__VLS_asFunctionalElement1(__VLS_intrinsics.small, __VLS_intrinsics.small)({});
(item.badge);
}
// @ts-ignore
[modelValue,];
}
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
role: "tabpanel",
});
var __VLS_0 = {
activeId: (__VLS_ctx.modelValue),
};
// @ts-ignore
var __VLS_1 = __VLS_0;
// @ts-ignore
[modelValue,];
const __VLS_base = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
props: {},
});
const __VLS_export = {};
export default {};
@@ -0,0 +1,67 @@
import Textarea from 'primevue/textarea';
const __VLS_props = defineProps();
const __VLS_emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.Textarea} */
Textarea;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
...{ class: "ks-textarea" },
id: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
rows: (__VLS_ctx.rows ?? 4),
placeholder: (__VLS_ctx.placeholder),
}));
const __VLS_2 = __VLS_1({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
...{ class: "ks-textarea" },
id: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
rows: (__VLS_ctx.rows ?? 4),
placeholder: (__VLS_ctx.placeholder),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.'update:modelValue'} */
'onUpdate:modelValue': (...[$event]) => {
return (__VLS_ctx.$emit('update:modelValue', String($event ?? '')));
// @ts-ignore
[inputId, modelValue, disabled, invalid, rows, placeholder, $emit,];
},
};
const __VLS_7 = {
/** @type {typeof __VLS_5.blur} */
onBlur: (...[$event]) => {
return (__VLS_ctx.$emit('blur', $event));
// @ts-ignore
[$emit,];
},
};
var __VLS_8;
/** @type {__VLS_StyleScopedClasses['ks-textarea']} */ ;
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,66 @@
import InputText from 'primevue/inputtext';
const __VLS_props = defineProps();
const __VLS_emit = defineEmits();
const __VLS_ctx = {
...{},
...{},
...{},
...{},
...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
/** @type {__VLS_StyleScopedClasses['ks-input']} */ ;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.InputText} */
InputText;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
...{ class: "ks-input" },
id: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
placeholder: (__VLS_ctx.placeholder),
}));
const __VLS_2 = __VLS_1({
...{ 'onUpdate:modelValue': {} },
...{ 'onBlur': {} },
...{ class: "ks-input" },
id: (__VLS_ctx.inputId),
modelValue: (__VLS_ctx.modelValue),
disabled: (__VLS_ctx.disabled),
invalid: (__VLS_ctx.invalid),
placeholder: (__VLS_ctx.placeholder),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
let __VLS_5;
const __VLS_6 = {
/** @type {typeof __VLS_5.'update:modelValue'} */
'onUpdate:modelValue': (...[$event]) => {
return (__VLS_ctx.$emit('update:modelValue', String($event ?? '')));
// @ts-ignore
[inputId, modelValue, disabled, invalid, placeholder, $emit,];
},
};
const __VLS_7 = {
/** @type {typeof __VLS_5.blur} */
onBlur: (...[$event]) => {
return (__VLS_ctx.$emit('blur', $event));
// @ts-ignore
[$emit,];
},
};
var __VLS_8;
/** @type {__VLS_StyleScopedClasses['ks-input']} */ ;
var __VLS_3;
var __VLS_4;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({
__typeEmits: {},
__typeProps: {},
});
export default {};
@@ -0,0 +1,22 @@
import Button from './PrimeButtonAdapter.vue';
import TextField from './PrimeTextFieldAdapter.vue';
import TextArea from './PrimeTextAreaAdapter.vue';
import Select from './PrimeSelectAdapter.vue';
import MultiSelect from './PrimeMultiSelectAdapter.vue';
import Checkbox from './PrimeCheckboxAdapter.vue';
import DateField from './PrimeDateFieldAdapter.vue';
import NumberField from './PrimeNumberFieldAdapter.vue';
import Dialog from './PrimeDialogAdapter.vue';
import StatusTag from './PrimeStatusTagAdapter.vue';
import InlineMessage from './PrimeInlineMessageAdapter.vue';
import Paginator from './PrimePaginatorAdapter.vue';
import Tabs from './PrimeTabsAdapter.vue';
import DataGrid from './AgGridAdapter.vue';
const capabilities = new Set([
'button', 'text-field', 'text-area', 'select', 'multi-select', 'checkbox', 'date-field', 'number-field',
'dialog', 'status-tag', 'inline-message', 'paginator', 'tabs', 'data-grid'
]);
export const primeVueUiAdapter = Object.freeze({
descriptor: Object.freeze({ id: 'primevue-aggrid', version: '4.x+34.x', contractVersion: '4.0', vendor: 'PrimeVue + AG Grid Community', capabilities, productionEligible: true, accessibilityBaseline: 'WCAG_2_2_AA_TARGET' }),
components: Object.freeze({ Button, TextField, TextArea, Select, MultiSelect, Checkbox, DateField, NumberField, Dialog, StatusTag, InlineMessage, Paginator, Tabs, DataGrid })
});
@@ -0,0 +1,14 @@
import PrimeVue from 'primevue/config';
import { installUiAdapter } from '../useUiAdapter';
import { primeVueUiAdapter } from './index';
import './adapter.css';
export const primeVueUiProvider = {
id: 'primevue-aggrid',
install(app) {
app.use(PrimeVue, { unstyled: true });
installUiAdapter(app, primeVueUiAdapter);
}
};
export function installPrimeVueAdapter(app) {
primeVueUiProvider.install(app);
}
@@ -0,0 +1,12 @@
import { describe, expect, it } from 'vitest';
import { assertUiAdapterContract, requiredUiAdapterCapabilities } from '../contracts';
import { nativeUiAdapter } from '../native';
import { primeVueUiAdapter } from '../primevue';
describe.each([nativeUiAdapter, primeVueUiAdapter])('UI adapter $descriptor.id', adapter => {
it('implements the complete v4 normalized contract', () => {
expect(() => assertUiAdapterContract(adapter)).not.toThrow();
expect(adapter.descriptor.contractVersion).toBe('4.0');
expect(adapter.descriptor.capabilities.size).toBe(requiredUiAdapterCapabilities.length);
expect(adapter.descriptor.accessibilityBaseline).toBe('WCAG_2_2_AA_TARGET');
});
});
@@ -0,0 +1,13 @@
import { inject } from 'vue';
import { assertUiAdapterContract, uiAdapterKey } from './contracts';
export function installUiAdapter(app, adapter) {
assertUiAdapterContract(adapter);
app.provide(uiAdapterKey, adapter);
}
export function useUiAdapter() {
const adapter = inject(uiAdapterKey);
if (!adapter) {
throw new Error('UI adapter is not installed. Install a validated provider during app bootstrap.');
}
return adapter;
}