import { computed, ref } from 'vue';
import { SearchListCrudPage } from '@/shared/ui/screen-types';
import { screenTemplateCatalogue } from '@/shared/ui/screen-types/catalogue';
import { KsButton, KsDataGrid, KsSelect, KsStatusTag, KsTextField } from '@/shared/ui/components';
import { useUiAdapter } from '@/shared/ui/adapter/useUiAdapter';
const adapter = useUiAdapter();
const query = ref('');
const status = ref('ALL');
const options = [{ label: '전체', value: 'ALL' }, { label: '검토 필요', value: 'REVIEW' }, { label: '보류', value: 'HOLD' }];
const rows = computed(() => screenTemplateCatalogue.filter(x => !query.value || `${x.id} ${x.name} ${x.component}`.toLowerCase().includes(query.value.toLowerCase())).map(x => ({ id: x.id, name: x.name, component: x.component, evidence: x.mandatoryEvidence.length, state: 'READY' })));
const columns = [{ field: 'id', header: '화면 ID', width: 100 }, { field: 'name', header: '화면 타입' }, { field: 'component', header: '표준 컴포넌트', minWidth: 220 }, { field: 'evidence', header: '필수 증거', width: 110 }, { field: 'state', header: '상태', width: 110 }];
const __VLS_ctx = {
    ...{},
    ...{},
};
let __VLS_components;
let __VLS_intrinsics;
let __VLS_directives;
/** @type {__VLS_StyleScopedClasses['summary']} */ ;
/** @type {__VLS_StyleScopedClasses['summary']} */ ;
/** @type {__VLS_StyleScopedClasses['detail']} */ ;
/** @type {__VLS_StyleScopedClasses['filters']} */ ;
let __VLS_0;
/** @ts-ignore @type { | typeof __VLS_components.SearchListCrudPage | typeof __VLS_components.SearchListCrudPage} */
SearchListCrudPage;
// @ts-ignore
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
    title: "표준 UI 패턴",
    subtitle: "Feature는 공급자 라이브러리를 직접 사용하지 않고, v2 어댑터·레이아웃·화면 계약을 사용한다.",
    state: "READY",
    evidence: ({ asOf: '2026-08-02', version: 'UI-CONTRACT-2.0' }),
}));
const __VLS_2 = __VLS_1({
    title: "표준 UI 패턴",
    subtitle: "Feature는 공급자 라이브러리를 직접 사용하지 않고, v2 어댑터·레이아웃·화면 계약을 사용한다.",
    state: "READY",
    evidence: ({ asOf: '2026-08-02', version: 'UI-CONTRACT-2.0' }),
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
var __VLS_5;
const { default: __VLS_6 } = __VLS_3.slots;
{
    const { actions: __VLS_7 } = __VLS_3.slots;
    let __VLS_8;
    /** @ts-ignore @type { | typeof __VLS_components.KsButton} */
    KsButton;
    // @ts-ignore
    const __VLS_9 = __VLS_asFunctionalComponent1(__VLS_8, new __VLS_8({
        label: "새 화면 패킷",
        severity: "secondary",
    }));
    const __VLS_10 = __VLS_9({
        label: "새 화면 패킷",
        severity: "secondary",
    }, ...__VLS_functionalComponentArgsRest(__VLS_9));
}
{
    const { summary: __VLS_13 } = __VLS_3.slots;
    __VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
        ...{ class: "ks-card summary" },
    });
    /** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
    /** @type {__VLS_StyleScopedClasses['summary']} */ ;
    __VLS_asFunctionalElement1(__VLS_intrinsics.strong, __VLS_intrinsics.strong)({});
    __VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
    __VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
        ...{ class: "ks-card summary" },
    });
    /** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
    /** @type {__VLS_StyleScopedClasses['summary']} */ ;
    __VLS_asFunctionalElement1(__VLS_intrinsics.strong, __VLS_intrinsics.strong)({});
    (__VLS_ctx.adapter.descriptor.capabilities.size);
    __VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
    __VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
        ...{ class: "ks-card summary" },
    });
    /** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
    /** @type {__VLS_StyleScopedClasses['summary']} */ ;
    let __VLS_14;
    /** @ts-ignore @type { | typeof __VLS_components.KsStatusTag} */
    KsStatusTag;
    // @ts-ignore
    const __VLS_15 = __VLS_asFunctionalComponent1(__VLS_14, new __VLS_14({
        value: (__VLS_ctx.adapter.descriptor.id),
        severity: "info",
    }));
    const __VLS_16 = __VLS_15({
        value: (__VLS_ctx.adapter.descriptor.id),
        severity: "info",
    }, ...__VLS_functionalComponentArgsRest(__VLS_15));
    __VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
    (__VLS_ctx.adapter.descriptor.vendor);
    __VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
        ...{ class: "ks-card summary" },
    });
    /** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
    /** @type {__VLS_StyleScopedClasses['summary']} */ ;
    let __VLS_19;
    /** @ts-ignore @type { | typeof __VLS_components.KsStatusTag} */
    KsStatusTag;
    // @ts-ignore
    const __VLS_20 = __VLS_asFunctionalComponent1(__VLS_19, new __VLS_19({
        value: "자동주문 OFF",
        severity: "warning",
    }));
    const __VLS_21 = __VLS_20({
        value: "자동주문 OFF",
        severity: "warning",
    }, ...__VLS_functionalComponentArgsRest(__VLS_20));
    __VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
    // @ts-ignore
    [adapter, adapter, adapter,];
}
{
    const { filters: __VLS_24 } = __VLS_3.slots;
    __VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
        ...{ class: "filters" },
    });
    /** @type {__VLS_StyleScopedClasses['filters']} */ ;
    let __VLS_25;
    /** @ts-ignore @type { | typeof __VLS_components.KsTextField} */
    KsTextField;
    // @ts-ignore
    const __VLS_26 = __VLS_asFunctionalComponent1(__VLS_25, new __VLS_25({
        modelValue: (__VLS_ctx.query),
        label: "검색",
        placeholder: "화면 ID, 타입 또는 컴포넌트",
    }));
    const __VLS_27 = __VLS_26({
        modelValue: (__VLS_ctx.query),
        label: "검색",
        placeholder: "화면 ID, 타입 또는 컴포넌트",
    }, ...__VLS_functionalComponentArgsRest(__VLS_26));
    let __VLS_30;
    /** @ts-ignore @type { | typeof __VLS_components.KsSelect} */
    KsSelect;
    // @ts-ignore
    const __VLS_31 = __VLS_asFunctionalComponent1(__VLS_30, new __VLS_30({
        modelValue: (__VLS_ctx.status),
        label: "상태",
        options: (__VLS_ctx.options),
    }));
    const __VLS_32 = __VLS_31({
        modelValue: (__VLS_ctx.status),
        label: "상태",
        options: (__VLS_ctx.options),
    }, ...__VLS_functionalComponentArgsRest(__VLS_31));
    // @ts-ignore
    [query, status, options,];
}
let __VLS_35;
/** @ts-ignore @type { | typeof __VLS_components.KsDataGrid} */
KsDataGrid;
// @ts-ignore
const __VLS_36 = __VLS_asFunctionalComponent1(__VLS_35, new __VLS_35({
    rows: (__VLS_ctx.rows),
    columns: (__VLS_ctx.columns),
    height: "25rem",
}));
const __VLS_37 = __VLS_36({
    rows: (__VLS_ctx.rows),
    columns: (__VLS_ctx.columns),
    height: "25rem",
}, ...__VLS_functionalComponentArgsRest(__VLS_36));
{
    const { detail: __VLS_40 } = __VLS_3.slots;
    __VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
        ...{ class: "ks-card detail" },
    });
    /** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
    /** @type {__VLS_StyleScopedClasses['detail']} */ ;
    __VLS_asFunctionalElement1(__VLS_intrinsics.h2, __VLS_intrinsics.h2)({});
    __VLS_asFunctionalElement1(__VLS_intrinsics.p, __VLS_intrinsics.p)({});
    __VLS_asFunctionalElement1(__VLS_intrinsics.code, __VLS_intrinsics.code)({});
    __VLS_asFunctionalElement1(__VLS_intrinsics.p, __VLS_intrinsics.p)({});
    __VLS_asFunctionalElement1(__VLS_intrinsics.p, __VLS_intrinsics.p)({});
    // @ts-ignore
    [rows, columns,];
}
// @ts-ignore
[];
var __VLS_3;
// @ts-ignore
[];
const __VLS_export = (await import('vue')).defineComponent({});
export default {};
