The theme was renamed Zibll/子比 → AKSRT → Jio, but upstream branding survived the sweeps in CSS classes, the SVG sprite prefix, a persisted widget field ID, JS events, admin Vue class names, test infrastructure and docblocks. Renames: - zib-widget / zib-widget-wrap / zib-slider → jio-widget-box / jio-widget-box-wrap / jio-slider-box (jio-widget is taken by the modern widget shell, jio-box-* by the card primitives) - zib-partners-scroll + zps-* → jio-partners-scroll + jps-* - zib-combo-info-card + zci-* → jio-combo-info-card + jci-* - zibsvg- → jiosvg-, including the exported picker helpers and the fa-zibsvg- family-prefix guard - zibpay_type → pay_type; the dual-read fallback in PostQuery collapses to a single key - [zibajax="submit"] dropped (no PHP emitter); zib_ajax.success → jio_ajax.success - aks-* admin Vue classes → jio-* - zib_palette() → palette() User-facing vendor traces are gone: the floating "more" button default no longer ships a zibll.com link or 子比主题 marketing copy, the notice widget ships no preset promo entries, and the four 官网教程 links are removed from the post-list admin schema. Test infrastructure renamed to neutral names (docker-compose.reference.yml, Caddyfile, article-baseline.json, modern-widgets-contract.test.cjs) with their DB/volume/env/slug identifiers following. Kept intentionally, documented in tests/fixtures/README.md: the golden fixture reference fingerprint (a SHA-256 record of an external directory, read by validate-widget-golden / generate-widget-golden-fixture / audit-widget-system), the doesNotMatch guards that prove the old tokens are gone, and the reference theme's own meta key in the visual fixtures. No backward-compat or data migration: saved widget configs holding old icon keys or the old field ID silently lose them, per the project's rewrite-over-compatibility rule. Verified: 132/132 node contract tests, php tests/widget-system/run.php (146 assertions), audit-admin-contracts, audit-psr4-paths and validate-widget-golden all green; tracked bundles regenerated and in sync. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
106 lines
2.6 KiB
Vue
106 lines
2.6 KiB
Vue
<template>
|
|
<div ref="editorRef" class="jio-code-editor" :class="{ 'is-disabled': disabled }" />
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, watch, onMounted, onBeforeUnmount, shallowRef } from 'vue'
|
|
import { EditorView, basicSetup } from 'codemirror'
|
|
import { EditorState } from '@codemirror/state'
|
|
import { html } from '@codemirror/lang-html'
|
|
import { css } from '@codemirror/lang-css'
|
|
import { javascript } from '@codemirror/lang-javascript'
|
|
import { oneDark } from '@codemirror/theme-one-dark'
|
|
|
|
const props = defineProps({
|
|
modelValue: { type: String, default: '' },
|
|
language: { type: String, default: 'html' },
|
|
disabled: { type: Boolean, default: false },
|
|
rows: { type: Number, default: 8 },
|
|
})
|
|
|
|
const emit = defineEmits(['update:modelValue'])
|
|
|
|
const editorRef = ref(null)
|
|
const view = shallowRef(null)
|
|
let updating = false
|
|
|
|
function resolveLang(lang) {
|
|
switch (lang) {
|
|
case 'css': return css()
|
|
case 'js':
|
|
case 'javascript': return javascript()
|
|
case 'html':
|
|
default: return html()
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
if (!editorRef.value) return
|
|
const state = EditorState.create({
|
|
doc: props.modelValue || '',
|
|
extensions: [
|
|
basicSetup,
|
|
resolveLang(props.language),
|
|
oneDark,
|
|
EditorView.updateListener.of((update) => {
|
|
if (update.docChanged && !updating) {
|
|
const val = update.state.doc.toString()
|
|
emit('update:modelValue', val)
|
|
}
|
|
}),
|
|
EditorView.editable.of(!props.disabled),
|
|
EditorState.readOnly.of(props.disabled),
|
|
],
|
|
})
|
|
view.value = new EditorView({ state, parent: editorRef.value })
|
|
})
|
|
|
|
watch(() => props.modelValue, (newVal) => {
|
|
if (!view.value) return
|
|
const current = view.value.state.doc.toString()
|
|
if (newVal !== current) {
|
|
updating = true
|
|
view.value.dispatch({
|
|
changes: { from: 0, to: current.length, insert: newVal || '' },
|
|
})
|
|
updating = false
|
|
}
|
|
})
|
|
|
|
watch(() => props.disabled, (val) => {
|
|
if (!view.value) return
|
|
view.value.dispatch({
|
|
effects: [
|
|
EditorView.editable.reconfigure(EditorView.editable.of(!val)),
|
|
EditorState.readOnly.reconfigure(EditorState.readOnly.of(val)),
|
|
],
|
|
})
|
|
})
|
|
|
|
onBeforeUnmount(() => {
|
|
if (view.value) {
|
|
view.value.destroy()
|
|
view.value = null
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.jio-code-editor {
|
|
border: 1px solid var(--n-border-color, #e0e0e6);
|
|
border-radius: 4px;
|
|
overflow: hidden;
|
|
min-height: calc(var(--rows, 8) * 22px);
|
|
}
|
|
.jio-code-editor :deep(.cm-editor) {
|
|
font-size: 13px;
|
|
}
|
|
.jio-code-editor :deep(.cm-editor.cm-focused) {
|
|
outline: none;
|
|
}
|
|
.jio-code-editor.is-disabled {
|
|
opacity: 0.6;
|
|
pointer-events: none;
|
|
}
|
|
</style>
|