5 lines
3.6 KiB
JavaScript
5 lines
3.6 KiB
JavaScript
(() => {
|
||
window.componentRegistry ||= {};
|
||
window.componentRegistry["src-web/form-controls/index.html"] = {"showcase":"<div class=\"panel\">\n <div class=\"panel-heading\"><div class=\"panel-title\">Checkbox / RadioGroup / Switch / Rate</div><div class=\"panel-note\">Value state is independent from interaction</div></div>\n <div class=\"panel-body\">\n <div class=\"grid cols-4\" style=\"gap:18px\">\n <div>\n <div class=\"rule-label\">Checkbox</div>\n <div class=\"check-row dnf-ui\" data-checkbox role=\"checkbox\" tabindex=\"0\" aria-checked=\"false\"><span class=\"checkbox-control\"></span><span data-control-label>交互示例 · 未选择</span></div>\n <div class=\"check-row dnf-ui is-emphasized\"><span class=\"checkbox-control\"></span> Emphasized</div>\n <div class=\"check-row dnf-ui\"><span class=\"checkbox-control is-checked\"></span> 已选择</div>\n <div class=\"check-row dnf-ui control-disabled\"><span class=\"checkbox-control\"></span> 已禁用</div>\n </div>\n <div data-radio-group role=\"radiogroup\" aria-label=\"效果强度\">\n <div class=\"rule-label\">RadioGroup</div>\n <div class=\"radio-row dnf-ui\" data-radio role=\"radio\" tabindex=\"0\" aria-checked=\"true\">关闭</div>\n <div class=\"radio-row dnf-ui\" data-radio role=\"radio\" tabindex=\"-1\" aria-checked=\"false\">弱</div>\n <div class=\"radio-row dnf-ui\" data-radio role=\"radio\" tabindex=\"-1\" aria-checked=\"false\">强</div>\n <div class=\"radio-row dnf-ui control-disabled\">禁用</div>\n </div>\n <div>\n <div class=\"rule-label\">Switch</div>\n <div class=\"switch-row dnf-ui\" data-switch role=\"switch\" tabindex=\"0\" aria-checked=\"false\"><span data-control-label>Interactive · Off</span></div>\n <div class=\"switch-row dnf-ui is-hover\">Hover</div>\n <div class=\"switch-row dnf-ui is-on\">On</div>\n <div class=\"switch-row dnf-ui control-disabled\">Disabled</div>\n </div>\n <div>\n <div class=\"rule-label\">Rate · Value = 1 / 5</div>\n <div class=\"rate dnf-ui\" data-rate role=\"slider\" tabindex=\"0\" aria-label=\"评分\" aria-valuemin=\"0\" aria-valuemax=\"5\" aria-valuenow=\"1\">\n <img data-rate-item src=\"src-web/form-controls/img/sprite_interface2_popup_menu.NPK/popup_icon_npc.img/126.PNG\" alt=\"第 1 星\">\n <img data-rate-item src=\"src-web/form-controls/img/sprite_interface2_popup_menu.NPK/popup_icon_npc.img/149.PNG\" alt=\"第 2 星\">\n <img data-rate-item src=\"src-web/form-controls/img/sprite_interface2_popup_menu.NPK/popup_icon_npc.img/149.PNG\" alt=\"第 3 星\">\n <img data-rate-item src=\"src-web/form-controls/img/sprite_interface2_popup_menu.NPK/popup_icon_npc.img/149.PNG\" alt=\"第 4 星\">\n <img data-rate-item src=\"src-web/form-controls/img/sprite_interface2_popup_menu.NPK/popup_icon_npc.img/149.PNG\" alt=\"第 5 星\">\n </div>\n <div class=\"token-label\" style=\"margin-top:12px\">Value = Number 0–5<br>Readonly = Boolean<br>Star = raster asset</div>\n </div>\n </div>\n <div class=\"divider\"></div>\n <div class=\"spec-row\"><span class=\"spec-chip\">Checked = Off · On · Mixed</span><span class=\"spec-chip\">Interaction = Rest · Hover · Focus · Disabled</span></div>\n </div>\n </div>"};
|
||
})();
|