5 lines
4.4 KiB
JavaScript
5 lines
4.4 KiB
JavaScript
(() => {
|
|
window.componentRegistry ||= {};
|
|
window.componentRegistry["src-web/select/index.html"] = {"showcase":"<div class=\"panel\">\n <div class=\"panel-heading\"><div class=\"panel-title\">Select / TreeSelect / CascaderFilter</div><div class=\"spec-row\"><span class=\"spec-chip captured\">OPEN + FOCUS ROW</span></div></div>\n <div class=\"panel-body\" style=\"display:grid;grid-template-columns:1fr 1.1fr;gap:18px;\">\n <div>\n <div class=\"sample-label\">Select · Closed</div>\n <div class=\"field select-field has-select-icon dnf-ui\" style=\"width:100%\"><span class=\"field-label\">所有部位</span></div>\n <div class=\"sample-label\" style=\"margin-top:14px\">Select · Open</div>\n <div class=\"select-demo is-open\" data-select-demo>\n <div class=\"field select-field has-select-icon focus dnf-ui\" style=\"width:100%\" role=\"combobox\" tabindex=\"0\" aria-expanded=\"true\" aria-controls=\"select-demo-menu\"><span class=\"field-label\" data-select-value>名称</span></div>\n <div class=\"select-menu dnf-ui\" id=\"select-demo-menu\" role=\"listbox\" style=\"width:100%\"><div class=\"select-item selected\" role=\"option\" tabindex=\"0\" aria-selected=\"true\">名称</div><div class=\"select-item focused\" role=\"option\" tabindex=\"0\" aria-selected=\"false\">关键词</div><div class=\"select-item\" role=\"option\" tabindex=\"0\" aria-selected=\"false\">更新时间</div></div>\n </div>\n <div class=\"sample-label\" style=\"margin-top:10px\">CascaderFilter · Open + focused row</div>\n <div class=\"cascader-filter is-open dnf-ui\" data-cascader>\n <div class=\"cascader-fields\">\n <button type=\"button\" class=\"cascader-trigger primary\"><span class=\"cascader-value\">天界</span></button>\n <button type=\"button\" class=\"cascader-trigger secondary\"><span>黄昏之海（寂静城）</span></button>\n </div>\n <div class=\"cascader-menu\" role=\"listbox\">\n <button type=\"button\" class=\"cascader-option focused\" role=\"option\">阿拉德大陆</button>\n <button type=\"button\" class=\"cascader-option\" role=\"option\">天界</button>\n <button type=\"button\" class=\"cascader-option\" role=\"option\">魔界</button>\n <button type=\"button\" class=\"cascader-option\" role=\"option\">神界</button>\n </div>\n </div>\n </div>\n <div>\n <div class=\"sample-label\">TreeSelect · Single-column rarity tree</div>\n <div class=\"tree-select-demo is-open\" data-tree-select>\n <div class=\"field select-field has-select-icon dnf-ui\" style=\"width:100%\" role=\"combobox\" tabindex=\"0\" aria-expanded=\"true\" aria-controls=\"tree-select-demo-menu\"><span class=\"field-label\" data-tree-select-value>稀有</span></div>\n <div class=\"select-menu tree-select-menu dnf-ui\" id=\"tree-select-demo-menu\" role=\"tree\" style=\"width:100%\">\n <div class=\"tree-select-item tree-parent\" role=\"treeitem\" tabindex=\"0\" aria-expanded=\"true\" style=\"--depth:0\">所有稀有度</div>\n <div class=\"tree-select-item q-normal\" role=\"treeitem\" tabindex=\"0\" style=\"--depth:1\">普通</div>\n <div class=\"tree-select-item q-advanced\" role=\"treeitem\" tabindex=\"0\" style=\"--depth:1\">高级</div>\n <div class=\"tree-select-item q-rare is-selected\" role=\"treeitem\" tabindex=\"0\" aria-selected=\"true\" style=\"--depth:1\">稀有</div>\n <div class=\"tree-select-item q-artifact\" role=\"treeitem\" tabindex=\"0\" style=\"--depth:1\">神器</div>\n <div class=\"tree-select-item q-legend\" role=\"treeitem\" tabindex=\"0\" style=\"--depth:1\">传说</div>\n <div class=\"tree-select-item q-epic\" role=\"treeitem\" tabindex=\"0\" style=\"--depth:1\">史诗</div>\n <div class=\"tree-select-item q-myth\" role=\"treeitem\" tabindex=\"0\" style=\"--depth:1\">神话</div>\n <div class=\"tree-select-item q-primeval\" role=\"treeitem\" tabindex=\"0\" style=\"--depth:1\">太初</div>\n </div>\n </div>\n </div>\n </div>\n </div>"};
|
|
})();
|