accessify-widget 0.1.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/README.md +57 -3
  2. package/dist/accessify.min.js +1 -1
  3. package/dist/accessify.min.js.map +1 -1
  4. package/dist/accessify.mjs +1 -1
  5. package/dist/{alt-text-CLxbmwG6.js → alt-text-CgzNGvdT.js} +2 -2
  6. package/dist/{alt-text-CLxbmwG6.js.map → alt-text-CgzNGvdT.js.map} +1 -1
  7. package/dist/contrast-CqsICAkU.js +139 -0
  8. package/dist/contrast-CqsICAkU.js.map +1 -0
  9. package/dist/{index-CUQfpnwR.js → index-qmiN2JAz.js} +1811 -736
  10. package/dist/index-qmiN2JAz.js.map +1 -0
  11. package/dist/{keyboard-nav-BdPyLaZt.js → keyboard-nav-DH4qBThF.js} +16 -12
  12. package/dist/keyboard-nav-DH4qBThF.js.map +1 -0
  13. package/dist/{page-structure-2X8mOSpC.js → page-structure-DTBqkrYs.js} +11 -7
  14. package/dist/page-structure-DTBqkrYs.js.map +1 -0
  15. package/dist/text-size-C6OFhCGi.js +186 -0
  16. package/dist/text-size-C6OFhCGi.js.map +1 -0
  17. package/dist/widget.js +1 -1
  18. package/dist/widget.js.map +1 -1
  19. package/package.json +1 -1
  20. package/dist/color-blind-0LFng55r.js +0 -108
  21. package/dist/color-blind-0LFng55r.js.map +0 -1
  22. package/dist/contrast-DCkE0NXZ.js +0 -64
  23. package/dist/contrast-DCkE0NXZ.js.map +0 -1
  24. package/dist/dyslexia-font-wONgIy2T.js +0 -77
  25. package/dist/dyslexia-font-wONgIy2T.js.map +0 -1
  26. package/dist/index-CUQfpnwR.js.map +0 -1
  27. package/dist/keyboard-nav-BdPyLaZt.js.map +0 -1
  28. package/dist/line-height-BT98qgEF.js +0 -54
  29. package/dist/line-height-BT98qgEF.js.map +0 -1
  30. package/dist/page-structure-2X8mOSpC.js.map +0 -1
  31. package/dist/saturation-D8ZXpWAN.js +0 -59
  32. package/dist/saturation-D8ZXpWAN.js.map +0 -1
  33. package/dist/spacing-DENai3JU.js +0 -106
  34. package/dist/spacing-DENai3JU.js.map +0 -1
  35. package/dist/text-align-BDRPqPvl.js +0 -51
  36. package/dist/text-align-BDRPqPvl.js.map +0 -1
  37. package/dist/text-size-B-uv436p.js +0 -69
  38. package/dist/text-size-B-uv436p.js.map +0 -1
@@ -279,6 +279,15 @@ https://svelte.dev/e/lifecycle_double_unmount`, bold, normal);
279
279
  console.warn(`https://svelte.dev/e/lifecycle_double_unmount`);
280
280
  }
281
281
  }
282
+ function select_multiple_invalid_value() {
283
+ if (DEV) {
284
+ console.warn(`%c[svelte] select_multiple_invalid_value
285
+ %cThe \`value\` property of a \`<select multiple>\` element should be an array, but it received a non-array value. The selection will be kept as is.
286
+ https://svelte.dev/e/select_multiple_invalid_value`, bold, normal);
287
+ } else {
288
+ console.warn(`https://svelte.dev/e/select_multiple_invalid_value`);
289
+ }
290
+ }
282
291
  function state_proxy_equality_mismatch(operator) {
283
292
  if (DEV) {
284
293
  console.warn(`%c[svelte] state_proxy_equality_mismatch
@@ -2310,6 +2319,9 @@ function get_proxied_value(value) {
2310
2319
  }
2311
2320
  return value;
2312
2321
  }
2322
+ function is(a, b) {
2323
+ return Object.is(get_proxied_value(a), get_proxied_value(b));
2324
+ }
2313
2325
  const ARRAY_MUTATING_METHODS = /* @__PURE__ */ new Set([
2314
2326
  "copyWithin",
2315
2327
  "fill",
@@ -2464,7 +2476,7 @@ function clear_text_content(node) {
2464
2476
  function should_defer_append() {
2465
2477
  return false;
2466
2478
  }
2467
- function create_element(tag2, namespace, is) {
2479
+ function create_element(tag2, namespace, is2) {
2468
2480
  let options = void 0;
2469
2481
  return (
2470
2482
  /** @type {T extends keyof HTMLElementTagNameMap ? HTMLElementTagNameMap[T] : Element} */
@@ -4233,6 +4245,75 @@ function html(node, get_value, is_controlled = false, svg = false, mathml = fals
4233
4245
  }
4234
4246
  });
4235
4247
  }
4248
+ function to_class(value, hash, directives) {
4249
+ var classname = value == null ? "" : "" + value;
4250
+ return classname === "" ? null : classname;
4251
+ }
4252
+ function set_class(dom, is_html, value, hash, prev_classes, next_classes) {
4253
+ var prev = dom.__className;
4254
+ if (prev !== value || prev === void 0) {
4255
+ var next_class_name = to_class(value);
4256
+ {
4257
+ if (next_class_name == null) {
4258
+ dom.removeAttribute("class");
4259
+ } else {
4260
+ dom.className = next_class_name;
4261
+ }
4262
+ }
4263
+ dom.__className = value;
4264
+ }
4265
+ return next_classes;
4266
+ }
4267
+ function select_option(select, value, mounting = false) {
4268
+ if (select.multiple) {
4269
+ if (value == void 0) {
4270
+ return;
4271
+ }
4272
+ if (!is_array(value)) {
4273
+ return select_multiple_invalid_value();
4274
+ }
4275
+ for (var option of select.options) {
4276
+ option.selected = value.includes(get_option_value(option));
4277
+ }
4278
+ return;
4279
+ }
4280
+ for (option of select.options) {
4281
+ var option_value = get_option_value(option);
4282
+ if (is(option_value, value)) {
4283
+ option.selected = true;
4284
+ return;
4285
+ }
4286
+ }
4287
+ if (!mounting || value !== void 0) {
4288
+ select.selectedIndex = -1;
4289
+ }
4290
+ }
4291
+ function init_select(select) {
4292
+ var observer = new MutationObserver(() => {
4293
+ select_option(select, select.__value);
4294
+ });
4295
+ observer.observe(select, {
4296
+ // Listen to option element changes
4297
+ childList: true,
4298
+ subtree: true,
4299
+ // because of <optgroup>
4300
+ // Listen to option element value attribute changes
4301
+ // (doesn't get notified of select value changes,
4302
+ // because that property is not reflected as an attribute)
4303
+ attributes: true,
4304
+ attributeFilter: ["value"]
4305
+ });
4306
+ teardown(() => {
4307
+ observer.disconnect();
4308
+ });
4309
+ }
4310
+ function get_option_value(option) {
4311
+ if ("__value" in option) {
4312
+ return option.__value;
4313
+ } else {
4314
+ return option.value;
4315
+ }
4316
+ }
4236
4317
  const IS_CUSTOM_ELEMENT = Symbol("is custom element");
4237
4318
  const IS_HTML = Symbol("is html");
4238
4319
  function set_attribute(element, attribute, value, skip_warning) {
@@ -4671,7 +4752,7 @@ const icons = {
4671
4752
  globe: iconGlobe,
4672
4753
  profile: iconProfile
4673
4754
  };
4674
- const de = {
4755
+ const deJson = {
4675
4756
  "widget.title": "Barrierefreiheit",
4676
4757
  "widget.open": "Barrierefreiheit-Einstellungen öffnen",
4677
4758
  "widget.close": "Schließen",
@@ -4760,7 +4841,7 @@ const de = {
4760
4841
  "footer.github": "GitHub",
4761
4842
  "bfsg.notice": "Hinweis: Dieses Overlay-Tool allein erfüllt nicht die Anforderungen des BFSG. Professionelle Barrierefreiheit erfordert strukturelle Änderungen am Quellcode."
4762
4843
  };
4763
- const en = {
4844
+ const enJson = {
4764
4845
  "widget.title": "Accessibility",
4765
4846
  "widget.open": "Open accessibility settings",
4766
4847
  "widget.close": "Close",
@@ -4849,15 +4930,864 @@ const en = {
4849
4930
  "footer.github": "GitHub",
4850
4931
  "bfsg.notice": "Note: This overlay tool alone does not meet BFSG requirements. Full accessibility requires structural changes to the source code."
4851
4932
  };
4852
- const locales = { de, en };
4933
+ const EN_BASE = {
4934
+ ...enJson,
4935
+ "widget.subtitle": "Adjust contrast, text and navigation on this page",
4936
+ "widget.language": "Language",
4937
+ "widget.poweredBy": "Powered by Accessify-Widget",
4938
+ "section.essentials": "Most used",
4939
+ "section.essentials.desc": "Start with contrast, text size and keyboard support.",
4940
+ "section.support": "Reading and navigation",
4941
+ "section.support.desc": "Tools for focus, reduced motion and page structure.",
4942
+ "section.ai": "AI assistance",
4943
+ "section.ai.desc": "Simplify content, generate alt text and scan the current page.",
4944
+ "control.mostUsed": "Most used",
4945
+ "control.chooseMode": "Choose a mode",
4946
+ "control.default": "Default",
4947
+ "contrast.mode.light": "Light contrast",
4948
+ "contrast.mode.dark": "Dark contrast",
4949
+ "contrast.mode.high": "High contrast",
4950
+ "keyboard.shortcuts": "Keyboard shortcuts",
4951
+ "keyboard.shortcut": "Shortcut",
4952
+ "keyboard.action": "Action",
4953
+ "keyboard.nextHeading": "Go to the next heading",
4954
+ "keyboard.nextLandmark": "Go to the next landmark",
4955
+ "keyboard.toggleHelp": "Open or close this help overlay",
4956
+ "keyboard.nextFocusable": "Move to the next focusable element",
4957
+ "keyboard.closeOverlay": "Close this overlay",
4958
+ "keyboard.skipToContent": "Skip to main content",
4959
+ "pageStructure.title": "Page structure",
4960
+ "pageStructure.headings": "Headings",
4961
+ "pageStructure.landmarks": "Landmarks",
4962
+ "pageStructure.empty": "No headings or landmarks found on this page."
4963
+ };
4964
+ const DE_BASE = {
4965
+ ...deJson,
4966
+ "widget.subtitle": "Passe Kontrast, Text und Navigation auf dieser Seite an",
4967
+ "widget.language": "Sprache",
4968
+ "widget.poweredBy": "Bereitgestellt von Accessify-Widget",
4969
+ "section.essentials": "Am haeufigsten genutzt",
4970
+ "section.essentials.desc": "Starte mit Kontrast, Textgroesse und Tastaturhilfe.",
4971
+ "section.support": "Lesen und Navigation",
4972
+ "section.support.desc": "Hilfen fuer Fokus, reduzierte Bewegung und Seitenstruktur.",
4973
+ "section.ai": "KI-Unterstuetzung",
4974
+ "section.ai.desc": "Inhalte vereinfachen, Alt-Texte erzeugen und die Seite pruefen.",
4975
+ "control.mostUsed": "Meistgenutzt",
4976
+ "control.chooseMode": "Modus waehlen",
4977
+ "control.default": "Standard",
4978
+ "contrast.mode.light": "Heller Kontrast",
4979
+ "contrast.mode.dark": "Dunkler Kontrast",
4980
+ "contrast.mode.high": "Hoher Kontrast",
4981
+ "keyboard.shortcuts": "Tastaturhilfe",
4982
+ "keyboard.shortcut": "Tastaturkuerzel",
4983
+ "keyboard.action": "Aktion",
4984
+ "keyboard.nextHeading": "Zur naechsten Ueberschrift springen",
4985
+ "keyboard.nextLandmark": "Zur naechsten Landmarke springen",
4986
+ "keyboard.toggleHelp": "Diese Hilfe ein- oder ausblenden",
4987
+ "keyboard.nextFocusable": "Zum naechsten fokussierbaren Element wechseln",
4988
+ "keyboard.closeOverlay": "Diese Hilfe schliessen",
4989
+ "keyboard.skipToContent": "Zum Hauptinhalt springen",
4990
+ "pageStructure.title": "Seitenstruktur",
4991
+ "pageStructure.headings": "Ueberschriften",
4992
+ "pageStructure.landmarks": "Landmarken",
4993
+ "pageStructure.empty": "Auf dieser Seite wurden keine Ueberschriften oder Landmarken gefunden."
4994
+ };
4995
+ function withEnglish(overrides) {
4996
+ return { ...EN_BASE, ...overrides };
4997
+ }
4998
+ const locales = {
4999
+ en: EN_BASE,
5000
+ de: DE_BASE,
5001
+ zh: withEnglish({
5002
+ "widget.title": "无障碍",
5003
+ "widget.subtitle": "调整此页面的对比度、文字和导航",
5004
+ "widget.open": "打开无障碍设置",
5005
+ "widget.close": "关闭",
5006
+ "widget.reset": "全部重置",
5007
+ "widget.resetConfirm": "已重置所有调整",
5008
+ "widget.poweredBy": "由 Accessify-Widget 提供支持",
5009
+ "widget.statement": "无障碍声明",
5010
+ "widget.language": "语言",
5011
+ "status.active": "已启用 {count} 项",
5012
+ "status.noActive": "当前未启用调整",
5013
+ "status.activated": "已启用",
5014
+ "status.deactivated": "已关闭",
5015
+ "section.essentials": "最常用",
5016
+ "section.essentials.desc": "先从对比度、文字大小和键盘支持开始。",
5017
+ "section.support": "阅读与导航",
5018
+ "section.support.desc": "用于聚焦、减少动画和查看页面结构的工具。",
5019
+ "section.ai": "AI 辅助",
5020
+ "section.ai.desc": "简化内容、生成替代文本并扫描当前页面。",
5021
+ "control.mostUsed": "最常用",
5022
+ "control.chooseMode": "选择模式",
5023
+ "control.default": "默认",
5024
+ "contrast.mode.light": "浅色高对比",
5025
+ "contrast.mode.dark": "深色高对比",
5026
+ "contrast.mode.high": "高对比",
5027
+ "feature.contrast": "对比度",
5028
+ "feature.textSize": "更大文字",
5029
+ "feature.keyboardNav": "键盘导航",
5030
+ "feature.focusHighlight": "焦点高亮",
5031
+ "feature.linkHighlight": "突出链接",
5032
+ "feature.animationStop": "停止动画",
5033
+ "feature.readingGuide": "阅读指引线",
5034
+ "feature.readingMask": "阅读遮罩",
5035
+ "feature.hideImages": "隐藏图片",
5036
+ "feature.bigCursor": "大号光标",
5037
+ "feature.pageStructure": "页面结构",
5038
+ "feature.tts": "朗读",
5039
+ "feature.textSimplify": "简化文本",
5040
+ "feature.altText": "生成替代文本",
5041
+ "feature.autoScan": "WCAG 扫描"
5042
+ }),
5043
+ hi: withEnglish({
5044
+ "widget.title": "सुलभता",
5045
+ "widget.subtitle": "इस पेज पर कंट्रास्ट, टेक्स्ट और नेविगेशन समायोजित करें",
5046
+ "widget.open": "सुलभता सेटिंग खोलें",
5047
+ "widget.close": "बंद करें",
5048
+ "widget.reset": "सब रीसेट करें",
5049
+ "widget.resetConfirm": "सभी बदलाव रीसेट हो गए",
5050
+ "widget.poweredBy": "Accessify-Widget द्वारा संचालित",
5051
+ "widget.statement": "एक्सेसिबिलिटी स्टेटमेंट",
5052
+ "widget.language": "भाषा",
5053
+ "status.active": "{count} सक्रिय",
5054
+ "status.noActive": "कोई बदलाव सक्रिय नहीं",
5055
+ "status.activated": "सक्रिय",
5056
+ "status.deactivated": "निष्क्रिय",
5057
+ "section.essentials": "सबसे ज्यादा उपयोग",
5058
+ "section.essentials.desc": "कंट्रास्ट, टेक्स्ट साइज और कीबोर्ड सहायता से शुरू करें।",
5059
+ "section.support": "पढ़ना और नेविगेशन",
5060
+ "section.support.desc": "फोकस, कम मोशन और पेज स्ट्रक्चर के लिए टूल।",
5061
+ "section.ai": "AI सहायता",
5062
+ "section.ai.desc": "कंटेंट सरल करें, ऑल्ट टेक्स्ट बनाएं और मौजूदा पेज स्कैन करें।",
5063
+ "control.mostUsed": "सबसे उपयोगी",
5064
+ "control.chooseMode": "मोड चुनें",
5065
+ "control.default": "डिफ़ॉल्ट",
5066
+ "contrast.mode.light": "लाइट कंट्रास्ट",
5067
+ "contrast.mode.dark": "डार्क कंट्रास्ट",
5068
+ "contrast.mode.high": "हाई कंट्रास्ट",
5069
+ "feature.contrast": "कंट्रास्ट",
5070
+ "feature.textSize": "बड़ा टेक्स्ट",
5071
+ "feature.keyboardNav": "कीबोर्ड नेविगेशन",
5072
+ "feature.focusHighlight": "फोकस हाइलाइट",
5073
+ "feature.linkHighlight": "लिंक हाइलाइट",
5074
+ "feature.animationStop": "एनिमेशन रोकें",
5075
+ "feature.readingGuide": "रीडिंग गाइड",
5076
+ "feature.readingMask": "रीडिंग मास्क",
5077
+ "feature.hideImages": "तस्वीरें छिपाएँ",
5078
+ "feature.bigCursor": "बड़ा कर्सर",
5079
+ "feature.pageStructure": "पेज संरचना",
5080
+ "feature.tts": "जोर से पढ़ें",
5081
+ "feature.textSimplify": "टेक्स्ट सरल करें",
5082
+ "feature.altText": "ऑल्ट-टेक्स्ट बनाएँ",
5083
+ "feature.autoScan": "WCAG स्कैन"
5084
+ }),
5085
+ es: withEnglish({
5086
+ "widget.title": "Accesibilidad",
5087
+ "widget.subtitle": "Ajusta contraste, texto y navegacion en esta pagina",
5088
+ "widget.open": "Abrir ajustes de accesibilidad",
5089
+ "widget.close": "Cerrar",
5090
+ "widget.reset": "Restablecer todo",
5091
+ "widget.resetConfirm": "Se restablecieron todos los ajustes",
5092
+ "widget.poweredBy": "Impulsado por Accessify-Widget",
5093
+ "widget.statement": "Declaracion de accesibilidad",
5094
+ "widget.language": "Idioma",
5095
+ "status.active": "{count} activas",
5096
+ "status.noActive": "No hay ajustes activos",
5097
+ "status.activated": "activado",
5098
+ "status.deactivated": "desactivado",
5099
+ "section.essentials": "Lo mas usado",
5100
+ "section.essentials.desc": "Empieza con contraste, tamano de texto y apoyo para teclado.",
5101
+ "section.support": "Lectura y navegacion",
5102
+ "section.support.desc": "Herramientas para foco, menos movimiento y estructura de pagina.",
5103
+ "section.ai": "Asistencia de IA",
5104
+ "section.ai.desc": "Simplifica contenido, genera texto alternativo y analiza la pagina actual.",
5105
+ "control.mostUsed": "Mas usado",
5106
+ "control.chooseMode": "Elegir modo",
5107
+ "control.default": "Predeterminado",
5108
+ "contrast.mode.light": "Contraste claro",
5109
+ "contrast.mode.dark": "Contraste oscuro",
5110
+ "contrast.mode.high": "Alto contraste",
5111
+ "feature.contrast": "Contraste",
5112
+ "feature.textSize": "Texto mas grande",
5113
+ "feature.keyboardNav": "Navegacion por teclado",
5114
+ "feature.focusHighlight": "Resaltar foco",
5115
+ "feature.linkHighlight": "Resaltar enlaces",
5116
+ "feature.animationStop": "Detener animaciones",
5117
+ "feature.readingGuide": "Guia de lectura",
5118
+ "feature.readingMask": "Mascara de lectura",
5119
+ "feature.hideImages": "Ocultar imagenes",
5120
+ "feature.bigCursor": "Cursor grande",
5121
+ "feature.pageStructure": "Estructura de pagina",
5122
+ "feature.tts": "Lectura en voz alta",
5123
+ "feature.textSimplify": "Simplificar texto",
5124
+ "feature.altText": "Generar texto alternativo",
5125
+ "feature.autoScan": "Escaneo WCAG"
5126
+ }),
5127
+ fr: withEnglish({
5128
+ "widget.title": "Accessibilite",
5129
+ "widget.subtitle": "Ajustez le contraste, le texte et la navigation sur cette page",
5130
+ "widget.open": "Ouvrir les reglages d'accessibilite",
5131
+ "widget.close": "Fermer",
5132
+ "widget.reset": "Tout reinitialiser",
5133
+ "widget.resetConfirm": "Tous les ajustements ont ete reinitialises",
5134
+ "widget.poweredBy": "Propulse par Accessify-Widget",
5135
+ "widget.statement": "Declaration d'accessibilite",
5136
+ "widget.language": "Langue",
5137
+ "status.active": "{count} actives",
5138
+ "status.noActive": "Aucun ajustement actif",
5139
+ "status.activated": "active",
5140
+ "status.deactivated": "desactive",
5141
+ "section.essentials": "Les plus utilises",
5142
+ "section.essentials.desc": "Commencez par le contraste, la taille du texte et le clavier.",
5143
+ "section.support": "Lecture et navigation",
5144
+ "section.support.desc": "Outils pour la mise au point, moins de mouvement et la structure de page.",
5145
+ "section.ai": "Assistance IA",
5146
+ "section.ai.desc": "Simplifiez le contenu, generez un texte alternatif et analysez la page.",
5147
+ "control.mostUsed": "Les plus utilises",
5148
+ "control.chooseMode": "Choisir un mode",
5149
+ "control.default": "Par defaut",
5150
+ "contrast.mode.light": "Contraste clair",
5151
+ "contrast.mode.dark": "Contraste sombre",
5152
+ "contrast.mode.high": "Contraste eleve",
5153
+ "feature.contrast": "Contraste",
5154
+ "feature.textSize": "Texte plus grand",
5155
+ "feature.keyboardNav": "Navigation clavier",
5156
+ "feature.focusHighlight": "Mise en evidence du focus",
5157
+ "feature.linkHighlight": "Mettre les liens en evidence",
5158
+ "feature.animationStop": "Arreter les animations",
5159
+ "feature.readingGuide": "Guide de lecture",
5160
+ "feature.readingMask": "Masque de lecture",
5161
+ "feature.hideImages": "Masquer les images",
5162
+ "feature.bigCursor": "Grand curseur",
5163
+ "feature.pageStructure": "Structure de page",
5164
+ "feature.tts": "Lecture audio",
5165
+ "feature.textSimplify": "Simplifier le texte",
5166
+ "feature.altText": "Generer un texte alternatif",
5167
+ "feature.autoScan": "Analyse WCAG"
5168
+ }),
5169
+ ar: withEnglish({
5170
+ "widget.title": "إمكانية الوصول",
5171
+ "widget.subtitle": "اضبط التباين والنص والتنقل في هذه الصفحة",
5172
+ "widget.open": "افتح إعدادات إمكانية الوصول",
5173
+ "widget.close": "إغلاق",
5174
+ "widget.reset": "إعادة ضبط الكل",
5175
+ "widget.resetConfirm": "تمت إعادة ضبط جميع التعديلات",
5176
+ "widget.poweredBy": "مدعوم بواسطة Accessify-Widget",
5177
+ "widget.statement": "بيان إمكانية الوصول",
5178
+ "widget.language": "اللغة",
5179
+ "status.active": "{count} عناصر نشطة",
5180
+ "status.noActive": "لا توجد تعديلات نشطة",
5181
+ "status.activated": "مفعل",
5182
+ "status.deactivated": "معطل",
5183
+ "section.essentials": "الأكثر استخدامًا",
5184
+ "section.essentials.desc": "ابدأ بالتباين وحجم النص ودعم لوحة المفاتيح.",
5185
+ "section.support": "القراءة والتنقل",
5186
+ "section.support.desc": "أدوات للتركيز وتقليل الحركة وبنية الصفحة.",
5187
+ "section.ai": "مساعدة الذكاء الاصطناعي",
5188
+ "section.ai.desc": "بسّط المحتوى وأنشئ نصًا بديلاً وافحص الصفحة الحالية.",
5189
+ "control.mostUsed": "الأكثر استخدامًا",
5190
+ "control.chooseMode": "اختر وضعًا",
5191
+ "control.default": "افتراضي",
5192
+ "contrast.mode.light": "تباين فاتح",
5193
+ "contrast.mode.dark": "تباين داكن",
5194
+ "contrast.mode.high": "تباين عالٍ",
5195
+ "feature.contrast": "التباين",
5196
+ "feature.textSize": "نص أكبر",
5197
+ "feature.keyboardNav": "تنقل بلوحة المفاتيح",
5198
+ "feature.focusHighlight": "إبراز التركيز",
5199
+ "feature.linkHighlight": "إبراز الروابط",
5200
+ "feature.animationStop": "إيقاف الرسوم المتحركة",
5201
+ "feature.readingGuide": "دليل القراءة",
5202
+ "feature.readingMask": "قناع القراءة",
5203
+ "feature.hideImages": "إخفاء الصور",
5204
+ "feature.bigCursor": "مؤشر كبير",
5205
+ "feature.pageStructure": "بنية الصفحة",
5206
+ "feature.tts": "القراءة بصوت عالٍ",
5207
+ "feature.textSimplify": "تبسيط النص",
5208
+ "feature.altText": "إنشاء نص بديل",
5209
+ "feature.autoScan": "فحص WCAG"
5210
+ }),
5211
+ bn: withEnglish({
5212
+ "widget.title": "অ্যাক্সেসিবিলিটি",
5213
+ "widget.subtitle": "এই পাতায় কনট্রাস্ট, টেক্সট এবং নেভিগেশন ঠিক করুন",
5214
+ "widget.open": "অ্যাক্সেসিবিলিটি সেটিংস খুলুন",
5215
+ "widget.close": "বন্ধ করুন",
5216
+ "widget.reset": "সব রিসেট করুন",
5217
+ "widget.resetConfirm": "সব পরিবর্তন রিসেট হয়েছে",
5218
+ "widget.poweredBy": "Accessify-Widget দ্বারা চালিত",
5219
+ "widget.statement": "অ্যাক্সেসিবিলিটি বিবৃতি",
5220
+ "widget.language": "ভাষা",
5221
+ "status.active": "{count} টি সক্রিয়",
5222
+ "status.noActive": "কোনও সমন্বয় সক্রিয় নেই",
5223
+ "status.activated": "সক্রিয়",
5224
+ "status.deactivated": "নিষ্ক্রিয়",
5225
+ "section.essentials": "সবচেয়ে ব্যবহৃত",
5226
+ "section.essentials.desc": "কনট্রাস্ট, টেক্সট সাইজ এবং কিবোর্ড সহায়তা দিয়ে শুরু করুন।",
5227
+ "section.support": "পড়া ও নেভিগেশন",
5228
+ "section.support.desc": "ফোকাস, কম মুভমেন্ট এবং পেজ স্ট্রাকচারের টুল।",
5229
+ "section.ai": "AI সহায়তা",
5230
+ "section.ai.desc": "কনটেন্ট সহজ করুন, অল্ট টেক্সট তৈরি করুন এবং পেজ স্ক্যান করুন।",
5231
+ "control.mostUsed": "সবচেয়ে ব্যবহৃত",
5232
+ "control.chooseMode": "মোড বেছে নিন",
5233
+ "control.default": "ডিফল্ট",
5234
+ "contrast.mode.light": "লাইট কনট্রাস্ট",
5235
+ "contrast.mode.dark": "ডার্ক কনট্রাস্ট",
5236
+ "contrast.mode.high": "হাই কনট্রাস্ট",
5237
+ "feature.contrast": "কনট্রাস্ট",
5238
+ "feature.textSize": "বড় টেক্সট",
5239
+ "feature.keyboardNav": "কিবোর্ড নেভিগেশন",
5240
+ "feature.focusHighlight": "ফোকাস হাইলাইট",
5241
+ "feature.linkHighlight": "লিংক হাইলাইট",
5242
+ "feature.animationStop": "অ্যানিমেশন বন্ধ",
5243
+ "feature.readingGuide": "রিডিং গাইড",
5244
+ "feature.readingMask": "রিডিং মাস্ক",
5245
+ "feature.hideImages": "ছবি লুকান",
5246
+ "feature.bigCursor": "বড় কার্সর",
5247
+ "feature.pageStructure": "পেজ স্ট্রাকচার",
5248
+ "feature.tts": "জোরে পড়া",
5249
+ "feature.textSimplify": "টেক্সট সহজ করুন",
5250
+ "feature.altText": "অল্ট-টেক্সট তৈরি",
5251
+ "feature.autoScan": "WCAG স্ক্যান"
5252
+ }),
5253
+ pt: withEnglish({
5254
+ "widget.title": "Acessibilidade",
5255
+ "widget.subtitle": "Ajuste contraste, texto e navegacao nesta pagina",
5256
+ "widget.open": "Abrir configuracoes de acessibilidade",
5257
+ "widget.close": "Fechar",
5258
+ "widget.reset": "Redefinir tudo",
5259
+ "widget.resetConfirm": "Todos os ajustes foram redefinidos",
5260
+ "widget.poweredBy": "Desenvolvido por Accessify-Widget",
5261
+ "widget.statement": "Declaracao de acessibilidade",
5262
+ "widget.language": "Idioma",
5263
+ "status.active": "{count} ativas",
5264
+ "status.noActive": "Nenhum ajuste ativo",
5265
+ "status.activated": "ativado",
5266
+ "status.deactivated": "desativado",
5267
+ "section.essentials": "Mais usados",
5268
+ "section.essentials.desc": "Comece com contraste, tamanho do texto e apoio ao teclado.",
5269
+ "section.support": "Leitura e navegacao",
5270
+ "section.support.desc": "Ferramentas para foco, menos movimento e estrutura da pagina.",
5271
+ "section.ai": "Assistencia de IA",
5272
+ "section.ai.desc": "Simplifique conteudo, gere texto alternativo e analise a pagina atual.",
5273
+ "control.mostUsed": "Mais usados",
5274
+ "control.chooseMode": "Escolher modo",
5275
+ "control.default": "Padrao",
5276
+ "contrast.mode.light": "Contraste claro",
5277
+ "contrast.mode.dark": "Contraste escuro",
5278
+ "contrast.mode.high": "Alto contraste",
5279
+ "feature.contrast": "Contraste",
5280
+ "feature.textSize": "Texto maior",
5281
+ "feature.keyboardNav": "Navegacao por teclado",
5282
+ "feature.focusHighlight": "Destaque de foco",
5283
+ "feature.linkHighlight": "Destacar links",
5284
+ "feature.animationStop": "Parar animacoes",
5285
+ "feature.readingGuide": "Guia de leitura",
5286
+ "feature.readingMask": "Mascara de leitura",
5287
+ "feature.hideImages": "Ocultar imagens",
5288
+ "feature.bigCursor": "Cursor grande",
5289
+ "feature.pageStructure": "Estrutura da pagina",
5290
+ "feature.tts": "Leitura em voz alta",
5291
+ "feature.textSimplify": "Simplificar texto",
5292
+ "feature.altText": "Gerar texto alternativo",
5293
+ "feature.autoScan": "Varredura WCAG"
5294
+ }),
5295
+ ru: withEnglish({
5296
+ "widget.title": "Доступность",
5297
+ "widget.subtitle": "Настройте контраст, текст и навигацию на этой странице",
5298
+ "widget.open": "Открыть настройки доступности",
5299
+ "widget.close": "Закрыть",
5300
+ "widget.reset": "Сбросить все",
5301
+ "widget.resetConfirm": "Все настройки сброшены",
5302
+ "widget.poweredBy": "Работает на Accessify-Widget",
5303
+ "widget.statement": "Заявление о доступности",
5304
+ "widget.language": "Язык",
5305
+ "status.active": "Активно: {count}",
5306
+ "status.noActive": "Нет активных настроек",
5307
+ "status.activated": "включено",
5308
+ "status.deactivated": "выключено",
5309
+ "section.essentials": "Самое используемое",
5310
+ "section.essentials.desc": "Начните с контраста, размера текста и поддержки клавиатуры.",
5311
+ "section.support": "Чтение и навигация",
5312
+ "section.support.desc": "Инструменты для фокуса, уменьшения движения и структуры страницы.",
5313
+ "section.ai": "Помощь ИИ",
5314
+ "section.ai.desc": "Упрощайте текст, создавайте alt-текст и проверяйте текущую страницу.",
5315
+ "control.mostUsed": "Популярное",
5316
+ "control.chooseMode": "Выберите режим",
5317
+ "control.default": "По умолчанию",
5318
+ "contrast.mode.light": "Светлый контраст",
5319
+ "contrast.mode.dark": "Темный контраст",
5320
+ "contrast.mode.high": "Высокий контраст",
5321
+ "feature.contrast": "Контраст",
5322
+ "feature.textSize": "Крупный текст",
5323
+ "feature.keyboardNav": "Навигация с клавиатуры",
5324
+ "feature.focusHighlight": "Подсветка фокуса",
5325
+ "feature.linkHighlight": "Выделить ссылки",
5326
+ "feature.animationStop": "Остановить анимацию",
5327
+ "feature.readingGuide": "Линейка для чтения",
5328
+ "feature.readingMask": "Маска чтения",
5329
+ "feature.hideImages": "Скрыть изображения",
5330
+ "feature.bigCursor": "Большой курсор",
5331
+ "feature.pageStructure": "Структура страницы",
5332
+ "feature.tts": "Озвучивание",
5333
+ "feature.textSimplify": "Упростить текст",
5334
+ "feature.altText": "Создать alt-текст",
5335
+ "feature.autoScan": "Проверка WCAG"
5336
+ }),
5337
+ ur: withEnglish({
5338
+ "widget.title": "رسائی",
5339
+ "widget.subtitle": "اس صفحے پر کنٹراسٹ، متن اور نیویگیشن کو ایڈجسٹ کریں",
5340
+ "widget.open": "رسائی کی ترتیبات کھولیں",
5341
+ "widget.close": "بند کریں",
5342
+ "widget.reset": "سب ری سیٹ کریں",
5343
+ "widget.resetConfirm": "تمام تبدیلیاں ری سیٹ ہو گئیں",
5344
+ "widget.poweredBy": "Accessify-Widget کے ذریعے",
5345
+ "widget.statement": "رسائی کا بیان",
5346
+ "widget.language": "زبان",
5347
+ "status.active": "{count} فعال",
5348
+ "status.noActive": "کوئی تبدیلی فعال نہیں",
5349
+ "status.activated": "فعال",
5350
+ "status.deactivated": "غیر فعال",
5351
+ "section.essentials": "سب سے زیادہ استعمال",
5352
+ "section.essentials.desc": "کنٹراسٹ، متن کے سائز اور کی بورڈ مدد سے شروع کریں۔",
5353
+ "section.support": "مطالعہ اور نیویگیشن",
5354
+ "section.support.desc": "فوکس، کم حرکت اور صفحہ ساخت کے لیے ٹولز۔",
5355
+ "section.ai": "AI مدد",
5356
+ "section.ai.desc": "مواد آسان کریں، آلٹ ٹیکسٹ بنائیں اور موجودہ صفحہ اسکین کریں۔",
5357
+ "control.mostUsed": "زیادہ استعمال",
5358
+ "control.chooseMode": "موڈ منتخب کریں",
5359
+ "control.default": "ڈیفالٹ",
5360
+ "contrast.mode.light": "لائٹ کنٹراسٹ",
5361
+ "contrast.mode.dark": "ڈارک کنٹراسٹ",
5362
+ "contrast.mode.high": "ہائی کنٹراسٹ",
5363
+ "feature.contrast": "کنٹراسٹ",
5364
+ "feature.textSize": "بڑا متن",
5365
+ "feature.keyboardNav": "کی بورڈ نیویگیشن",
5366
+ "feature.focusHighlight": "فوکس ہائی لائٹ",
5367
+ "feature.linkHighlight": "لنکس نمایاں کریں",
5368
+ "feature.animationStop": "اینیمیشن روکیں",
5369
+ "feature.readingGuide": "مطالعہ گائیڈ",
5370
+ "feature.readingMask": "مطالعہ ماسک",
5371
+ "feature.hideImages": "تصاویر چھپائیں",
5372
+ "feature.bigCursor": "بڑا کرسر",
5373
+ "feature.pageStructure": "صفحہ ساخت",
5374
+ "feature.tts": "بلند آواز میں پڑھیں",
5375
+ "feature.textSimplify": "متن آسان کریں",
5376
+ "feature.altText": "آلٹ ٹیکسٹ بنائیں",
5377
+ "feature.autoScan": "WCAG اسکین"
5378
+ }),
5379
+ id: withEnglish({
5380
+ "widget.title": "Aksesibilitas",
5381
+ "widget.subtitle": "Atur kontras, teks, dan navigasi di halaman ini",
5382
+ "widget.open": "Buka pengaturan aksesibilitas",
5383
+ "widget.close": "Tutup",
5384
+ "widget.reset": "Reset semua",
5385
+ "widget.resetConfirm": "Semua penyesuaian telah direset",
5386
+ "widget.poweredBy": "Didukung oleh Accessify-Widget",
5387
+ "widget.statement": "Pernyataan aksesibilitas",
5388
+ "widget.language": "Bahasa",
5389
+ "status.active": "{count} aktif",
5390
+ "status.noActive": "Tidak ada penyesuaian aktif",
5391
+ "status.activated": "aktif",
5392
+ "status.deactivated": "nonaktif",
5393
+ "section.essentials": "Paling sering dipakai",
5394
+ "section.essentials.desc": "Mulai dari kontras, ukuran teks, dan dukungan keyboard.",
5395
+ "section.support": "Membaca dan navigasi",
5396
+ "section.support.desc": "Alat untuk fokus, gerakan rendah, dan struktur halaman.",
5397
+ "section.ai": "Bantuan AI",
5398
+ "section.ai.desc": "Sederhanakan konten, buat alt text, dan pindai halaman saat ini.",
5399
+ "control.mostUsed": "Paling sering",
5400
+ "control.chooseMode": "Pilih mode",
5401
+ "control.default": "Default",
5402
+ "contrast.mode.light": "Kontras terang",
5403
+ "contrast.mode.dark": "Kontras gelap",
5404
+ "contrast.mode.high": "Kontras tinggi",
5405
+ "feature.contrast": "Kontras",
5406
+ "feature.textSize": "Teks lebih besar",
5407
+ "feature.keyboardNav": "Navigasi keyboard",
5408
+ "feature.focusHighlight": "Sorot fokus",
5409
+ "feature.linkHighlight": "Sorot tautan",
5410
+ "feature.animationStop": "Hentikan animasi",
5411
+ "feature.readingGuide": "Panduan baca",
5412
+ "feature.readingMask": "Masker baca",
5413
+ "feature.hideImages": "Sembunyikan gambar",
5414
+ "feature.bigCursor": "Kursor besar",
5415
+ "feature.pageStructure": "Struktur halaman",
5416
+ "feature.tts": "Bacakan",
5417
+ "feature.textSimplify": "Sederhanakan teks",
5418
+ "feature.altText": "Buat alt-text",
5419
+ "feature.autoScan": "Pindai WCAG"
5420
+ }),
5421
+ ja: withEnglish({
5422
+ "widget.title": "アクセシビリティ",
5423
+ "widget.subtitle": "このページのコントラスト、文字、ナビゲーションを調整します",
5424
+ "widget.open": "アクセシビリティ設定を開く",
5425
+ "widget.close": "閉じる",
5426
+ "widget.reset": "すべてリセット",
5427
+ "widget.resetConfirm": "すべての調整をリセットしました",
5428
+ "widget.poweredBy": "Accessify-Widget 提供",
5429
+ "widget.statement": "アクセシビリティ宣言",
5430
+ "widget.language": "言語",
5431
+ "status.active": "{count} 件が有効",
5432
+ "status.noActive": "有効な調整はありません",
5433
+ "status.activated": "有効",
5434
+ "status.deactivated": "無効",
5435
+ "section.essentials": "よく使う設定",
5436
+ "section.essentials.desc": "まずはコントラスト、文字サイズ、キーボード支援から始めてください。",
5437
+ "section.support": "読みやすさとナビゲーション",
5438
+ "section.support.desc": "フォーカス、動きの抑制、ページ構造のためのツールです。",
5439
+ "section.ai": "AI 支援",
5440
+ "section.ai.desc": "文章を簡単にし、代替テキストを生成し、現在のページを確認します。",
5441
+ "control.mostUsed": "よく使う",
5442
+ "control.chooseMode": "モードを選択",
5443
+ "control.default": "標準",
5444
+ "contrast.mode.light": "ライトコントラスト",
5445
+ "contrast.mode.dark": "ダークコントラスト",
5446
+ "contrast.mode.high": "ハイコントラスト",
5447
+ "feature.contrast": "コントラスト",
5448
+ "feature.textSize": "大きな文字",
5449
+ "feature.keyboardNav": "キーボード操作",
5450
+ "feature.focusHighlight": "フォーカス強調",
5451
+ "feature.linkHighlight": "リンク強調",
5452
+ "feature.animationStop": "アニメーション停止",
5453
+ "feature.readingGuide": "読書ガイド",
5454
+ "feature.readingMask": "読書マスク",
5455
+ "feature.hideImages": "画像を隠す",
5456
+ "feature.bigCursor": "大きいカーソル",
5457
+ "feature.pageStructure": "ページ構造",
5458
+ "feature.tts": "読み上げ",
5459
+ "feature.textSimplify": "文章を簡単にする",
5460
+ "feature.altText": "代替テキスト生成",
5461
+ "feature.autoScan": "WCAG スキャン"
5462
+ }),
5463
+ pcm: withEnglish({
5464
+ "widget.title": "Accessibility",
5465
+ "widget.subtitle": "Adjust contrast, text and navigation for dis page",
5466
+ "widget.open": "Open accessibility settings",
5467
+ "widget.close": "Close",
5468
+ "widget.reset": "Reset all",
5469
+ "widget.resetConfirm": "All adjustments don reset",
5470
+ "widget.poweredBy": "Powered by Accessify-Widget",
5471
+ "widget.statement": "Accessibility statement",
5472
+ "widget.language": "Language",
5473
+ "status.active": "{count} active",
5474
+ "status.noActive": "No adjustment dey active",
5475
+ "status.activated": "activated",
5476
+ "status.deactivated": "deactivated",
5477
+ "section.essentials": "Wetin people use pass",
5478
+ "section.essentials.desc": "Start with contrast, text size and keyboard support.",
5479
+ "section.support": "Reading and navigation",
5480
+ "section.support.desc": "Tools for focus, reduced motion and page structure.",
5481
+ "section.ai": "AI help",
5482
+ "section.ai.desc": "Simplify content, generate alt text and scan dis page.",
5483
+ "control.mostUsed": "Most used",
5484
+ "control.chooseMode": "Choose mode",
5485
+ "control.default": "Default",
5486
+ "contrast.mode.light": "Light contrast",
5487
+ "contrast.mode.dark": "Dark contrast",
5488
+ "contrast.mode.high": "High contrast",
5489
+ "feature.contrast": "Contrast",
5490
+ "feature.textSize": "Bigger text",
5491
+ "feature.keyboardNav": "Keyboard navigation",
5492
+ "feature.focusHighlight": "Focus highlight",
5493
+ "feature.linkHighlight": "Highlight links",
5494
+ "feature.animationStop": "Stop animations",
5495
+ "feature.readingGuide": "Reading guide",
5496
+ "feature.readingMask": "Reading mask",
5497
+ "feature.hideImages": "Hide images",
5498
+ "feature.bigCursor": "Big cursor",
5499
+ "feature.pageStructure": "Page structure",
5500
+ "feature.tts": "Read aloud",
5501
+ "feature.textSimplify": "Simplify text",
5502
+ "feature.altText": "Generate alt-text",
5503
+ "feature.autoScan": "WCAG scan"
5504
+ }),
5505
+ mr: withEnglish({
5506
+ "widget.title": "प्रवेशयोग्यता",
5507
+ "widget.subtitle": "या पानावर कॉन्ट्रास्ट, मजकूर आणि नेव्हिगेशन समायोजित करा",
5508
+ "widget.open": "प्रवेशयोग्यता सेटिंग्ज उघडा",
5509
+ "widget.close": "बंद करा",
5510
+ "widget.reset": "सर्व रीसेट करा",
5511
+ "widget.resetConfirm": "सर्व बदल रीसेट झाले",
5512
+ "widget.poweredBy": "Accessify-Widget द्वारे समर्थित",
5513
+ "widget.statement": "प्रवेशयोग्यता निवेदन",
5514
+ "widget.language": "भाषा",
5515
+ "status.active": "{count} सक्रिय",
5516
+ "status.noActive": "कोणतेही बदल सक्रिय नाहीत",
5517
+ "status.activated": "सक्रिय",
5518
+ "status.deactivated": "निष्क्रिय",
5519
+ "section.essentials": "सर्वात जास्त वापरलेले",
5520
+ "section.essentials.desc": "कॉन्ट्रास्ट, मजकूर आकार आणि कीबोर्ड सहाय्यापासून सुरुवात करा.",
5521
+ "section.support": "वाचन आणि नेव्हिगेशन",
5522
+ "section.support.desc": "फोकस, कमी हालचाल आणि पृष्ठरचना यासाठी साधने.",
5523
+ "section.ai": "AI मदत",
5524
+ "section.ai.desc": "मजकूर सोपा करा, alt-text तयार करा आणि हे पान स्कॅन करा.",
5525
+ "control.mostUsed": "सर्वाधिक वापरलेले",
5526
+ "control.chooseMode": "मोड निवडा",
5527
+ "control.default": "डीफॉल्ट",
5528
+ "contrast.mode.light": "लाईट कॉन्ट्रास्ट",
5529
+ "contrast.mode.dark": "डार्क कॉन्ट्रास्ट",
5530
+ "contrast.mode.high": "हाय कॉन्ट्रास्ट",
5531
+ "feature.contrast": "कॉन्ट्रास्ट",
5532
+ "feature.textSize": "मोठा मजकूर",
5533
+ "feature.keyboardNav": "कीबोर्ड नेव्हिगेशन",
5534
+ "feature.focusHighlight": "फोकस हायलाइट",
5535
+ "feature.linkHighlight": "लिंक हायलाइट",
5536
+ "feature.animationStop": "अ‍ॅनिमेशन थांबवा",
5537
+ "feature.readingGuide": "वाचन मार्गदर्शक",
5538
+ "feature.readingMask": "वाचन मास्क",
5539
+ "feature.hideImages": "प्रतिमा लपवा",
5540
+ "feature.bigCursor": "मोठा कर्सर",
5541
+ "feature.pageStructure": "पृष्ठरचना",
5542
+ "feature.tts": "मोठ्याने वाचा",
5543
+ "feature.textSimplify": "मजकूर सोपा करा",
5544
+ "feature.altText": "alt-text तयार करा",
5545
+ "feature.autoScan": "WCAG स्कॅन"
5546
+ }),
5547
+ te: withEnglish({
5548
+ "widget.title": "అందుబాటు",
5549
+ "widget.subtitle": "ఈ పేజీలో కాంట్రాస్ట్, టెక్స్ట్ మరియు నావిగేషన్‌ను సర్దుబాటు చేయండి",
5550
+ "widget.open": "అందుబాటు సెట్టింగ్స్ తెరువు",
5551
+ "widget.close": "మూసివేయి",
5552
+ "widget.reset": "అన్నీ రీసెట్ చేయి",
5553
+ "widget.resetConfirm": "అన్ని మార్పులు రీసెట్ అయ్యాయి",
5554
+ "widget.poweredBy": "Accessify-Widget ద్వారా",
5555
+ "widget.statement": "అందుబాటు ప్రకటన",
5556
+ "widget.language": "భాష",
5557
+ "status.active": "{count} సక్రియం",
5558
+ "status.noActive": "ఏ మార్పూ సక్రియంగా లేదు",
5559
+ "status.activated": "సక్రియం",
5560
+ "status.deactivated": "నిష్క్రియం",
5561
+ "section.essentials": "ఎక్కువగా ఉపయోగించేవి",
5562
+ "section.essentials.desc": "కాంట్రాస్ట్, టెక్స్ట్ సైజు మరియు కీబోర్డ్ సహాయంతో మొదలుపెట్టండి.",
5563
+ "section.support": "చదువు మరియు నావిగేషన్",
5564
+ "section.support.desc": "ఫోకస్, తక్కువ మోషన్ మరియు పేజీ నిర్మాణానికి టూల్స్.",
5565
+ "section.ai": "AI సహాయం",
5566
+ "section.ai.desc": "కంటెంట్‌ను సులభతరం చేయండి, alt-text తయారు చేయండి, ఈ పేజీని స్కాన్ చేయండి.",
5567
+ "control.mostUsed": "ఎక్కువ ఉపయోగం",
5568
+ "control.chooseMode": "మోడ్ ఎంచుకోండి",
5569
+ "control.default": "డిఫాల్ట్",
5570
+ "contrast.mode.light": "లైట్ కాంట్రాస్ట్",
5571
+ "contrast.mode.dark": "డార్క్ కాంట్రాస్ట్",
5572
+ "contrast.mode.high": "హై కాంట్రాస్ట్",
5573
+ "feature.contrast": "కాంట్రాస్ట్",
5574
+ "feature.textSize": "పెద్ద టెక్స్ట్",
5575
+ "feature.keyboardNav": "కీబోర్డ్ నావిగేషన్",
5576
+ "feature.focusHighlight": "ఫోకస్ హైలైట్",
5577
+ "feature.linkHighlight": "లింక్ హైలైట్",
5578
+ "feature.animationStop": "యానిమేషన్స్ ఆపండి",
5579
+ "feature.readingGuide": "రీడింగ్ గైడ్",
5580
+ "feature.readingMask": "రీడింగ్ మాస్క్",
5581
+ "feature.hideImages": "చిత్రాలు దాచు",
5582
+ "feature.bigCursor": "పెద్ద కర్సర్",
5583
+ "feature.pageStructure": "పేజీ నిర్మాణం",
5584
+ "feature.tts": "గట్టిగా చదవండి",
5585
+ "feature.textSimplify": "టెక్స్ట్ సులభతరం చేయి",
5586
+ "feature.altText": "alt-text రూపొందించు",
5587
+ "feature.autoScan": "WCAG స్కాన్"
5588
+ }),
5589
+ tr: withEnglish({
5590
+ "widget.title": "Erisilebilirlik",
5591
+ "widget.subtitle": "Bu sayfada kontrast, metin ve gezinmeyi ayarlayin",
5592
+ "widget.open": "Erisilebilirlik ayarlarini ac",
5593
+ "widget.close": "Kapat",
5594
+ "widget.reset": "Tumunu sifirla",
5595
+ "widget.resetConfirm": "Tum ayarlar sifirlandi",
5596
+ "widget.poweredBy": "Accessify-Widget ile calisir",
5597
+ "widget.statement": "Erisilebilirlik bildirimi",
5598
+ "widget.language": "Dil",
5599
+ "status.active": "{count} etkin",
5600
+ "status.noActive": "Etkin ayar yok",
5601
+ "status.activated": "etkin",
5602
+ "status.deactivated": "devre disi",
5603
+ "section.essentials": "En cok kullanilanlar",
5604
+ "section.essentials.desc": "Kontrast, yazi boyutu ve klavye destegi ile baslayin.",
5605
+ "section.support": "Okuma ve gezinme",
5606
+ "section.support.desc": "Odak, azaltulmis hareket ve sayfa yapisi icin araclar.",
5607
+ "section.ai": "YZ yardimi",
5608
+ "section.ai.desc": "Icerigi sadeletir, alt metin olusturur ve mevcut sayfayi tarar.",
5609
+ "control.mostUsed": "En cok kullanilan",
5610
+ "control.chooseMode": "Mod sec",
5611
+ "control.default": "Varsayilan",
5612
+ "contrast.mode.light": "Acik kontrast",
5613
+ "contrast.mode.dark": "Koyu kontrast",
5614
+ "contrast.mode.high": "Yuksek kontrast",
5615
+ "feature.contrast": "Kontrast",
5616
+ "feature.textSize": "Buyuk metin",
5617
+ "feature.keyboardNav": "Klavye gezintisi",
5618
+ "feature.focusHighlight": "Odak vurgusu",
5619
+ "feature.linkHighlight": "Baglantilari vurgula",
5620
+ "feature.animationStop": "Animasyonlari durdur",
5621
+ "feature.readingGuide": "Okuma kilavuzu",
5622
+ "feature.readingMask": "Okuma maskesi",
5623
+ "feature.hideImages": "Gorselleri gizle",
5624
+ "feature.bigCursor": "Buyuk imlec",
5625
+ "feature.pageStructure": "Sayfa yapisi",
5626
+ "feature.tts": "Sesli oku",
5627
+ "feature.textSimplify": "Metni sadeletir",
5628
+ "feature.altText": "Alt metin olustur",
5629
+ "feature.autoScan": "WCAG taramasi"
5630
+ }),
5631
+ ta: withEnglish({
5632
+ "widget.title": "அணுகல்திறன்",
5633
+ "widget.subtitle": "இந்த பக்கத்தில் எதிரொலி, உரை மற்றும் வழிசெலுத்தலை மாற்றுங்கள்",
5634
+ "widget.open": "அணுகல்திறன் அமைப்புகளை திறக்கவும்",
5635
+ "widget.close": "மூடு",
5636
+ "widget.reset": "அனைத்தையும் மீட்டமை",
5637
+ "widget.resetConfirm": "அனைத்து மாற்றங்களும் மீட்டமைக்கப்பட்டன",
5638
+ "widget.poweredBy": "Accessify-Widget மூலம்",
5639
+ "widget.statement": "அணுகல்திறன் அறிக்கை",
5640
+ "widget.language": "மொழி",
5641
+ "status.active": "{count} செயலில்",
5642
+ "status.noActive": "செயலில் மாற்றங்கள் இல்லை",
5643
+ "status.activated": "செயலில்",
5644
+ "status.deactivated": "செயலற்றது",
5645
+ "section.essentials": "அதிகம் பயன்படுத்தப்படும்",
5646
+ "section.essentials.desc": "எதிரொலி, எழுத்து அளவு மற்றும் விசைப்பலகை உதவியுடன் தொடங்குங்கள்.",
5647
+ "section.support": "வாசிப்பு மற்றும் வழிசெலுத்தல்",
5648
+ "section.support.desc": "கவனம், குறைந்த இயக்கம் மற்றும் பக்க அமைப்புக்கான கருவிகள்.",
5649
+ "section.ai": "AI உதவி",
5650
+ "section.ai.desc": "உள்ளடக்கத்தை எளிமைப்படுத்தி, alt-text உருவாக்கி, இந்த பக்கத்தை ஸ்கேன் செய்யுங்கள்.",
5651
+ "control.mostUsed": "அதிகம் பயன்படுத்தப்படும்",
5652
+ "control.chooseMode": "முறையை தேர்வு செய்",
5653
+ "control.default": "இயல்புநிலை",
5654
+ "contrast.mode.light": "ஒளி எதிரொலி",
5655
+ "contrast.mode.dark": "இருண்ட எதிரொலி",
5656
+ "contrast.mode.high": "உயர் எதிரொலி",
5657
+ "feature.contrast": "எதிரொலி",
5658
+ "feature.textSize": "பெரிய எழுத்து",
5659
+ "feature.keyboardNav": "விசைப்பலகை வழிசெலுத்தல்",
5660
+ "feature.focusHighlight": "கவனத்தை வெளிப்படுத்து",
5661
+ "feature.linkHighlight": "இணைப்புகளை வெளிப்படுத்து",
5662
+ "feature.animationStop": "அனிமேஷனை நிறுத்து",
5663
+ "feature.readingGuide": "வாசிப்பு வழிகாட்டி",
5664
+ "feature.readingMask": "வாசிப்பு மறைப்பு",
5665
+ "feature.hideImages": "படங்களை மறை",
5666
+ "feature.bigCursor": "பெரிய கர்சர்",
5667
+ "feature.pageStructure": "பக்க அமைப்பு",
5668
+ "feature.tts": "சத்தமாக வாசி",
5669
+ "feature.textSimplify": "உரையை எளிமைப்படுத்து",
5670
+ "feature.altText": "alt-text உருவாக்கு",
5671
+ "feature.autoScan": "WCAG ஸ்கேன்"
5672
+ }),
5673
+ vi: withEnglish({
5674
+ "widget.title": "Tro nang truy cap",
5675
+ "widget.subtitle": "Dieu chinh tuong phan, van ban va dieu huong tren trang nay",
5676
+ "widget.open": "Mo cai dat tro nang truy cap",
5677
+ "widget.close": "Dong",
5678
+ "widget.reset": "Dat lai tat ca",
5679
+ "widget.resetConfirm": "Da dat lai moi dieu chinh",
5680
+ "widget.poweredBy": "Van hanh boi Accessify-Widget",
5681
+ "widget.statement": "Tuyen bo tro nang truy cap",
5682
+ "widget.language": "Ngon ngu",
5683
+ "status.active": "{count} muc dang bat",
5684
+ "status.noActive": "Khong co dieu chinh nao dang bat",
5685
+ "status.activated": "da bat",
5686
+ "status.deactivated": "da tat",
5687
+ "section.essentials": "Dung nhieu nhat",
5688
+ "section.essentials.desc": "Bat dau voi tuong phan, co chu va ho tro ban phim.",
5689
+ "section.support": "Doc va dieu huong",
5690
+ "section.support.desc": "Cong cu cho tap trung, giam chuyen dong va cau truc trang.",
5691
+ "section.ai": "Ho tro AI",
5692
+ "section.ai.desc": "Don gian hoa noi dung, tao alt-text va quet trang hien tai.",
5693
+ "control.mostUsed": "Pho bien",
5694
+ "control.chooseMode": "Chon che do",
5695
+ "control.default": "Mac dinh",
5696
+ "contrast.mode.light": "Tuong phan sang",
5697
+ "contrast.mode.dark": "Tuong phan toi",
5698
+ "contrast.mode.high": "Tuong phan cao",
5699
+ "feature.contrast": "Tuong phan",
5700
+ "feature.textSize": "Chu lon hon",
5701
+ "feature.keyboardNav": "Dieu huong ban phim",
5702
+ "feature.focusHighlight": "Noi bat tieu diem",
5703
+ "feature.linkHighlight": "Noi bat lien ket",
5704
+ "feature.animationStop": "Dung hieu ung",
5705
+ "feature.readingGuide": "Thuoc doc",
5706
+ "feature.readingMask": "Mat na doc",
5707
+ "feature.hideImages": "An hinh anh",
5708
+ "feature.bigCursor": "Con tro lon",
5709
+ "feature.pageStructure": "Cau truc trang",
5710
+ "feature.tts": "Doc thanh tieng",
5711
+ "feature.textSimplify": "Don gian hoa van ban",
5712
+ "feature.altText": "Tao alt-text",
5713
+ "feature.autoScan": "Quet WCAG"
5714
+ }),
5715
+ ko: withEnglish({
5716
+ "widget.title": "접근성",
5717
+ "widget.subtitle": "이 페이지의 대비, 텍스트, 내비게이션을 조정하세요",
5718
+ "widget.open": "접근성 설정 열기",
5719
+ "widget.close": "닫기",
5720
+ "widget.reset": "모두 재설정",
5721
+ "widget.resetConfirm": "모든 조정이 재설정되었습니다",
5722
+ "widget.poweredBy": "Accessify-Widget 제공",
5723
+ "widget.statement": "접근성 안내문",
5724
+ "widget.language": "언어",
5725
+ "status.active": "{count}개 활성",
5726
+ "status.noActive": "활성화된 조정이 없습니다",
5727
+ "status.activated": "활성화됨",
5728
+ "status.deactivated": "비활성화됨",
5729
+ "section.essentials": "가장 많이 사용됨",
5730
+ "section.essentials.desc": "대비, 글자 크기, 키보드 지원부터 시작하세요.",
5731
+ "section.support": "읽기 및 내비게이션",
5732
+ "section.support.desc": "초점, 움직임 감소, 페이지 구조를 위한 도구입니다.",
5733
+ "section.ai": "AI 지원",
5734
+ "section.ai.desc": "콘텐츠를 쉽게 만들고 대체 텍스트를 생성하며 현재 페이지를 검사합니다.",
5735
+ "control.mostUsed": "가장 많이 사용됨",
5736
+ "control.chooseMode": "모드 선택",
5737
+ "control.default": "기본값",
5738
+ "contrast.mode.light": "라이트 대비",
5739
+ "contrast.mode.dark": "다크 대비",
5740
+ "contrast.mode.high": "고대비",
5741
+ "feature.contrast": "대비",
5742
+ "feature.textSize": "큰 글자",
5743
+ "feature.keyboardNav": "키보드 내비게이션",
5744
+ "feature.focusHighlight": "포커스 강조",
5745
+ "feature.linkHighlight": "링크 강조",
5746
+ "feature.animationStop": "애니메이션 중지",
5747
+ "feature.readingGuide": "읽기 가이드",
5748
+ "feature.readingMask": "읽기 마스크",
5749
+ "feature.hideImages": "이미지 숨기기",
5750
+ "feature.bigCursor": "큰 커서",
5751
+ "feature.pageStructure": "페이지 구조",
5752
+ "feature.tts": "소리 내어 읽기",
5753
+ "feature.textSimplify": "텍스트 단순화",
5754
+ "feature.altText": "대체 텍스트 생성",
5755
+ "feature.autoScan": "WCAG 검사"
5756
+ })
5757
+ };
5758
+ const LANGUAGE_OPTIONS = [
5759
+ { code: "de", label: "Deutsch" },
5760
+ { code: "en", label: "English" },
5761
+ { code: "es", label: "Español" },
5762
+ { code: "fr", label: "Français" },
5763
+ { code: "pt", label: "Português" },
5764
+ { code: "tr", label: "Türkçe" },
5765
+ { code: "ar", label: "العربية" },
5766
+ { code: "zh", label: "中文" },
5767
+ { code: "ja", label: "日本語" },
5768
+ { code: "ru", label: "Русский" }
5769
+ ];
5770
+ const RTL_LANGS = /* @__PURE__ */ new Set(["ar", "ur"]);
5771
+ let currentWidgetLang = "en";
4853
5772
  function getSupportedLang(lang) {
4854
5773
  if (!lang) return "en";
4855
- const normalized = lang.toLowerCase().split("-")[0];
4856
- return locales[normalized] ? normalized : "en";
5774
+ const normalized = lang.toLowerCase();
5775
+ if (locales[normalized]) return normalized;
5776
+ const base = normalized.split("-")[0];
5777
+ return locales[base] ? base : "en";
5778
+ }
5779
+ function setCurrentWidgetLang(lang) {
5780
+ currentWidgetLang = getSupportedLang(lang);
5781
+ }
5782
+ function getCurrentWidgetLang() {
5783
+ return currentWidgetLang;
5784
+ }
5785
+ function isRtlLang(lang) {
5786
+ return RTL_LANGS.has(getSupportedLang(lang));
4857
5787
  }
4858
5788
  function t(key, lang = "en") {
4859
5789
  const resolved = getSupportedLang(lang);
4860
- return locales[resolved]?.[key] || locales["en"]?.[key] || key;
5790
+ return locales[resolved]?.[key] || EN_BASE[key] || key;
4861
5791
  }
4862
5792
  var root$5 = /* @__PURE__ */ from_html(`<button class="accessify-trigger"></button>`);
4863
5793
  function TriggerButton($$anchor, $$props) {
@@ -4882,36 +5812,64 @@ function TriggerButton($$anchor, $$props) {
4882
5812
  pop();
4883
5813
  }
4884
5814
  delegate(["click"]);
4885
- var root_1$3 = /* @__PURE__ */ from_html(`<button class="accessify-lang-toggle" title="Switch language"> </button>`);
4886
- var root$4 = /* @__PURE__ */ from_html(`<div class="accessify-header"><h2> </h2> <div class="accessify-header-actions"><!> <button class="accessify-header-btn"><!> <span> </span></button> <button class="accessify-header-btn"></button></div></div>`);
5815
+ var root_2$1 = /* @__PURE__ */ from_html(`<option> </option>`);
5816
+ var root_1$3 = /* @__PURE__ */ from_html(`<label class="accessify-language-picker"><span class="sr-only"> </span> <span class="accessify-language-icon" aria-hidden="true"></span> <select class="accessify-language-select"></select></label>`);
5817
+ var root$4 = /* @__PURE__ */ from_html(`<div class="accessify-header"><div class="accessify-header-top"><div class="accessify-header-title"><h2> </h2> <p> </p></div> <button class="accessify-header-btn accessify-header-btn--icon"></button></div> <div class="accessify-header-toolbar"><!> <button class="accessify-header-btn accessify-header-btn--secondary"><!> <span> </span></button></div></div>`);
4887
5818
  function PanelHeader($$anchor, $$props) {
4888
5819
  push($$props, true);
4889
5820
  let lang = prop($$props, "lang", 3, "en");
4890
- function toggleLang() {
4891
- const next = lang().startsWith("de") ? "en" : "de";
4892
- $$props.onlangchange?.(next);
5821
+ function handleLanguageChange(event2) {
5822
+ const target = event2.currentTarget;
5823
+ $$props.onlangchange?.(target.value);
4893
5824
  }
4894
5825
  var div = root$4();
4895
- var h2 = child(div);
5826
+ var div_1 = child(div);
5827
+ var div_2 = child(div_1);
5828
+ var h2 = child(div_2);
4896
5829
  var text = child(h2);
4897
- var div_1 = sibling(h2, 2);
4898
- var node = child(div_1);
5830
+ var p = sibling(h2, 2);
5831
+ var text_1 = child(p);
5832
+ var button = sibling(div_2, 2);
5833
+ html(button, iconClose, true);
5834
+ var div_3 = sibling(div_1, 2);
5835
+ var node = child(div_3);
4899
5836
  {
4900
5837
  var consequent = ($$anchor2) => {
4901
- var button = root_1$3();
4902
- var text_1 = child(button);
5838
+ var label = root_1$3();
5839
+ var span = child(label);
5840
+ var text_2 = child(span);
5841
+ var span_1 = sibling(span, 2);
5842
+ html(span_1, iconGlobe, true);
5843
+ var select = sibling(span_1, 2);
5844
+ each(select, 21, () => LANGUAGE_OPTIONS, index, ($$anchor3, option) => {
5845
+ var option_1 = root_2$1();
5846
+ var text_3 = child(option_1);
5847
+ var option_1_value = {};
5848
+ template_effect(() => {
5849
+ set_text(text_3, get(option).label);
5850
+ if (option_1_value !== (option_1_value = get(option).code)) {
5851
+ option_1.value = (option_1.__value = get(option).code) ?? "";
5852
+ }
5853
+ });
5854
+ append($$anchor3, option_1);
5855
+ });
5856
+ var select_value;
5857
+ init_select(select);
4903
5858
  template_effect(
4904
5859
  ($0, $1) => {
4905
- set_attribute(button, "aria-label", `Language: ${$0 ?? ""}`);
4906
- set_text(text_1, $1);
5860
+ set_text(text_2, $0);
5861
+ set_attribute(select, "aria-label", $1);
5862
+ if (select_value !== (select_value = lang())) {
5863
+ select.value = (select.__value = lang()) ?? "", select_option(select, lang());
5864
+ }
4907
5865
  },
4908
5866
  [
4909
- () => lang().startsWith("de") ? "Deutsch" : "English",
4910
- () => lang().startsWith("de") ? "DE" : "EN"
5867
+ () => t("widget.language", lang()),
5868
+ () => t("widget.language", lang())
4911
5869
  ]
4912
5870
  );
4913
- delegated("click", button, toggleLang);
4914
- append($$anchor2, button);
5871
+ delegated("change", select, handleLanguageChange);
5872
+ append($$anchor2, label);
4915
5873
  };
4916
5874
  if_block(node, ($$render) => {
4917
5875
  if ($$props.onlangchange) $$render(consequent);
@@ -4920,34 +5878,34 @@ function PanelHeader($$anchor, $$props) {
4920
5878
  var button_1 = sibling(node, 2);
4921
5879
  var node_1 = child(button_1);
4922
5880
  html(node_1, iconReset);
4923
- var span = sibling(node_1, 2);
4924
- var text_2 = child(span);
4925
- var button_2 = sibling(button_1, 2);
4926
- html(button_2, iconClose, true);
5881
+ var span_2 = sibling(node_1, 2);
5882
+ var text_4 = child(span_2);
4927
5883
  template_effect(
4928
- ($0, $1, $2, $3) => {
5884
+ ($0, $1, $2, $3, $4) => {
4929
5885
  set_text(text, $0);
4930
- set_attribute(button_1, "aria-label", $1);
4931
- set_text(text_2, $2);
4932
- set_attribute(button_2, "aria-label", $3);
5886
+ set_text(text_1, $1);
5887
+ set_attribute(button, "aria-label", $2);
5888
+ set_attribute(button_1, "aria-label", $3);
5889
+ set_text(text_4, $4);
4933
5890
  },
4934
5891
  [
4935
5892
  () => t("widget.title", lang()),
5893
+ () => t("widget.subtitle", lang()),
5894
+ () => t("widget.close", lang()),
4936
5895
  () => t("widget.reset", lang()),
4937
- () => t("widget.reset", lang()),
4938
- () => t("widget.close", lang())
5896
+ () => t("widget.reset", lang())
4939
5897
  ]
4940
5898
  );
5899
+ delegated("click", button, function(...$$args) {
5900
+ $$props.onclose?.apply(this, $$args);
5901
+ });
4941
5902
  delegated("click", button_1, function(...$$args) {
4942
5903
  $$props.onreset?.apply(this, $$args);
4943
5904
  });
4944
- delegated("click", button_2, function(...$$args) {
4945
- $$props.onclose?.apply(this, $$args);
4946
- });
4947
5905
  append($$anchor, div);
4948
5906
  pop();
4949
5907
  }
4950
- delegate(["click"]);
5908
+ delegate(["click", "change"]);
4951
5909
  var root_1$2 = /* @__PURE__ */ from_html(`<button class="accessify-status-reset"> </button>`);
4952
5910
  var root$3 = /* @__PURE__ */ from_html(`<div class="accessify-status" role="status" aria-live="polite"><span class="accessify-status-count"> </span> <!></div>`);
4953
5911
  function StatusBar($$anchor, $$props) {
@@ -4980,111 +5938,6 @@ function StatusBar($$anchor, $$props) {
4980
5938
  pop();
4981
5939
  }
4982
5940
  delegate(["click"]);
4983
- const PROFILES = [
4984
- {
4985
- id: "vision-impaired",
4986
- nameKey: "profile.visionImpaired",
4987
- descKey: "profile.visionImpaired.desc",
4988
- iconId: "eye",
4989
- features: ["contrast", "text-size", "big-cursor", "focus-highlight", "link-highlight"],
4990
- featureSettings: { "text-size": 150, contrast: "high" }
4991
- },
4992
- {
4993
- id: "motor-impaired",
4994
- nameKey: "profile.motorImpaired",
4995
- descKey: "profile.motorImpaired.desc",
4996
- iconId: "keyboard",
4997
- features: ["keyboard-nav", "focus-highlight", "big-cursor"]
4998
- },
4999
- {
5000
- id: "cognitive",
5001
- nameKey: "profile.cognitive",
5002
- descKey: "profile.cognitive.desc",
5003
- iconId: "brain",
5004
- features: ["reading-guide", "text-size", "spacing", "dyslexia-font", "animation-stop"],
5005
- featureSettings: { "text-size": 130 }
5006
- },
5007
- {
5008
- id: "seizure-safe",
5009
- nameKey: "profile.seizureSafe",
5010
- descKey: "profile.seizureSafe.desc",
5011
- iconId: "shield",
5012
- features: ["animation-stop", "saturation"],
5013
- featureSettings: { saturation: "low" }
5014
- },
5015
- {
5016
- id: "adhd-friendly",
5017
- nameKey: "profile.adhdFriendly",
5018
- descKey: "profile.adhdFriendly.desc",
5019
- iconId: "focus",
5020
- features: ["animation-stop", "reading-mask", "focus-highlight", "hide-images"]
5021
- }
5022
- ];
5023
- var root_1$1 = /* @__PURE__ */ from_html(`<button class="accessify-profile-card"><span aria-hidden="true"></span> <span> </span></button>`);
5024
- var root$2 = /* @__PURE__ */ from_html(`<div class="accessify-profiles"><div class="accessify-section-title"> </div> <div class="accessify-profile-grid" role="group"></div></div>`);
5025
- function ProfileSection($$anchor, $$props) {
5026
- push($$props, true);
5027
- let lang = prop($$props, "lang", 3, "en"), activeProfileId = prop($$props, "activeProfileId", 3, null);
5028
- function getIcon(iconId) {
5029
- const iconFn = icons[iconId];
5030
- return iconFn ? iconFn() : "";
5031
- }
5032
- var div = root$2();
5033
- var div_1 = child(div);
5034
- var text = child(div_1);
5035
- var div_2 = sibling(div_1, 2);
5036
- each(div_2, 21, () => PROFILES, (profile) => profile.id, ($$anchor2, profile) => {
5037
- var button = root_1$1();
5038
- var span = child(button);
5039
- html(span, () => getIcon(get(profile).iconId), true);
5040
- var span_1 = sibling(span, 2);
5041
- var text_1 = child(span_1);
5042
- template_effect(
5043
- ($0, $1, $2) => {
5044
- set_attribute(button, "aria-pressed", activeProfileId() === get(profile).id);
5045
- set_attribute(button, "aria-label", $0);
5046
- set_attribute(button, "title", $1);
5047
- set_text(text_1, $2);
5048
- },
5049
- [
5050
- () => t(get(profile).nameKey, lang()),
5051
- () => t(get(profile).descKey, lang()),
5052
- () => t(get(profile).nameKey, lang())
5053
- ]
5054
- );
5055
- delegated("click", button, () => $$props.onactivate(get(profile)));
5056
- append($$anchor2, button);
5057
- });
5058
- template_effect(
5059
- ($0, $1) => {
5060
- set_text(text, $0);
5061
- set_attribute(div_2, "aria-label", $1);
5062
- },
5063
- [
5064
- () => t("section.profiles", lang()),
5065
- () => t("section.profiles", lang())
5066
- ]
5067
- );
5068
- append($$anchor, div);
5069
- pop();
5070
- }
5071
- delegate(["click"]);
5072
- const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
5073
- const v = glob[path];
5074
- if (v) {
5075
- return typeof v === "function" ? v() : Promise.resolve(v);
5076
- }
5077
- return new Promise((_, reject) => {
5078
- (typeof queueMicrotask === "function" ? queueMicrotask : setTimeout)(
5079
- reject.bind(
5080
- null,
5081
- new Error(
5082
- "Unknown variable dynamic import: " + path + (path.split("/").length !== segs ? ". Note that variables only represent file names one level deep." : "")
5083
- )
5084
- )
5085
- );
5086
- });
5087
- };
5088
5941
  const DEFAULT_PROXY = "https://accessify-api.accessify.workers.dev";
5089
5942
  const OPENROUTER_BASE = "https://openrouter.ai/api/v1";
5090
5943
  const DEFAULTS = {
@@ -5233,175 +6086,168 @@ function getEnglishSimplificationPrompt() {
5233
6086
 
5234
6087
  Return ONLY the simplified text.`;
5235
6088
  }
5236
- var root_3 = /* @__PURE__ */ from_html(`<button class="accessify-card" role="switch"><span class="accessify-card-icon" aria-hidden="true"></span> <span class="accessify-card-label"> </span> <span class="accessify-card-desc" aria-hidden="true"> </span></button>`);
5237
- var root_2 = /* @__PURE__ */ from_html(`<div class="accessify-category"><div class="accessify-category-title"> </div> <div class="accessify-features" role="group"></div></div>`);
6089
+ var root_3 = /* @__PURE__ */ from_html(`<button class="accessify-chip"> </button>`);
6090
+ var root_2 = /* @__PURE__ */ from_html(`<article class="accessify-control-card accessify-control-card--contrast"><div class="accessify-control-copy"><span class="accessify-card-icon" aria-hidden="true"></span> <div><h4> </h4> <p> </p></div></div> <div class="accessify-chip-group" role="group"></div></article>`);
6091
+ var root_5 = /* @__PURE__ */ from_html(`<button class="accessify-chip"> </button>`);
6092
+ var root_4 = /* @__PURE__ */ from_html(`<article class="accessify-control-card accessify-control-card--text-size"><div class="accessify-control-copy"><span class="accessify-card-icon" aria-hidden="true"></span> <div><h4> </h4> <p> </p></div></div> <div class="accessify-chip-group accessify-chip-group--sizes" role="group"></div></article>`);
6093
+ var root_7 = /* @__PURE__ */ from_html(`<button class="accessify-card" role="switch"><div class="accessify-card-top"><span class="accessify-card-icon" aria-hidden="true"></span></div> <span class="accessify-card-label"> </span> <span class="accessify-card-desc"> </span></button>`);
6094
+ var root_6 = /* @__PURE__ */ from_html(`<div class="accessify-features"></div>`);
6095
+ var root_1$1 = /* @__PURE__ */ from_html(`<section class="accessify-section accessify-section--priority"><div class="accessify-section-head"><div><h3> </h3> <p> </p></div></div> <div class="accessify-control-grid"><!> <!></div> <!></section>`);
6096
+ var root_10 = /* @__PURE__ */ from_html(`<button class="accessify-card" role="switch"><div class="accessify-card-top"><span class="accessify-card-icon" aria-hidden="true"></span></div> <span class="accessify-card-label"> </span> <span class="accessify-card-desc"> </span></button>`);
6097
+ var root_9 = /* @__PURE__ */ from_html(`<section><div class="accessify-section-head"><div><h3> </h3> <p> </p></div></div> <div class="accessify-features"></div></section>`);
6098
+ var root$2 = /* @__PURE__ */ from_html(`<div class="accessify-body"><!> <!></div>`);
5238
6099
  function FeatureGrid($$anchor, $$props) {
5239
6100
  push($$props, true);
5240
6101
  const FEATURE_REGISTRY = {
5241
- contrast: {
5242
- id: "contrast",
5243
- nameKey: "feature.contrast",
5244
- descKey: "feature.contrast.desc",
5245
- iconId: "contrast",
5246
- category: "visual"
5247
- },
5248
- "text-size": {
5249
- id: "text-size",
5250
- nameKey: "feature.textSize",
5251
- descKey: "feature.textSize.desc",
5252
- iconId: "text-size",
5253
- category: "visual"
5254
- },
5255
- spacing: {
5256
- id: "spacing",
5257
- nameKey: "feature.spacing",
5258
- descKey: "feature.spacing.desc",
5259
- iconId: "spacing",
5260
- category: "visual"
5261
- },
5262
- "dyslexia-font": {
5263
- id: "dyslexia-font",
5264
- nameKey: "feature.dyslexiaFont",
5265
- descKey: "feature.dyslexiaFont.desc",
5266
- iconId: "font",
5267
- category: "visual"
6102
+ "keyboard-nav": {
6103
+ id: "keyboard-nav",
6104
+ nameKey: "feature.keyboardNav",
6105
+ descKey: "feature.keyboardNav.desc",
6106
+ iconId: "keyboard"
5268
6107
  },
5269
- "color-blindness": {
5270
- id: "color-blindness",
5271
- nameKey: "feature.colorBlind",
5272
- descKey: "feature.colorBlind.desc",
5273
- iconId: "color-blindness",
5274
- category: "visual"
6108
+ "focus-highlight": {
6109
+ id: "focus-highlight",
6110
+ nameKey: "feature.focusHighlight",
6111
+ descKey: "feature.focusHighlight.desc",
6112
+ iconId: "focus"
5275
6113
  },
5276
6114
  "link-highlight": {
5277
6115
  id: "link-highlight",
5278
6116
  nameKey: "feature.linkHighlight",
5279
6117
  descKey: "feature.linkHighlight.desc",
5280
- iconId: "link-highlight",
5281
- category: "visual"
5282
- },
5283
- saturation: {
5284
- id: "saturation",
5285
- nameKey: "feature.saturation",
5286
- descKey: "feature.saturation.desc",
5287
- iconId: "saturation",
5288
- category: "visual"
5289
- },
5290
- "hide-images": {
5291
- id: "hide-images",
5292
- nameKey: "feature.hideImages",
5293
- descKey: "feature.hideImages.desc",
5294
- iconId: "hide-images",
5295
- category: "visual"
5296
- },
5297
- "text-align": {
5298
- id: "text-align",
5299
- nameKey: "feature.textAlign",
5300
- descKey: "feature.textAlign.desc",
5301
- iconId: "text-align",
5302
- category: "visual"
5303
- },
5304
- "line-height": {
5305
- id: "line-height",
5306
- nameKey: "feature.lineHeight",
5307
- descKey: "feature.lineHeight.desc",
5308
- iconId: "line-height",
5309
- category: "visual"
6118
+ iconId: "link-highlight"
5310
6119
  },
5311
6120
  "reading-guide": {
5312
6121
  id: "reading-guide",
5313
6122
  nameKey: "feature.readingGuide",
5314
6123
  descKey: "feature.readingGuide.desc",
5315
- iconId: "reading-guide",
5316
- category: "motor"
6124
+ iconId: "reading-guide"
5317
6125
  },
5318
6126
  "reading-mask": {
5319
6127
  id: "reading-mask",
5320
6128
  nameKey: "feature.readingMask",
5321
6129
  descKey: "feature.readingMask.desc",
5322
- iconId: "reading-mask",
5323
- category: "motor"
6130
+ iconId: "reading-mask"
5324
6131
  },
5325
- "focus-highlight": {
5326
- id: "focus-highlight",
5327
- nameKey: "feature.focusHighlight",
5328
- descKey: "feature.focusHighlight.desc",
5329
- iconId: "focus",
5330
- category: "motor"
6132
+ "animation-stop": {
6133
+ id: "animation-stop",
6134
+ nameKey: "feature.animationStop",
6135
+ descKey: "feature.animationStop.desc",
6136
+ iconId: "animation-pause"
6137
+ },
6138
+ "hide-images": {
6139
+ id: "hide-images",
6140
+ nameKey: "feature.hideImages",
6141
+ descKey: "feature.hideImages.desc",
6142
+ iconId: "hide-images"
5331
6143
  },
5332
6144
  "big-cursor": {
5333
6145
  id: "big-cursor",
5334
6146
  nameKey: "feature.bigCursor",
5335
6147
  descKey: "feature.bigCursor.desc",
5336
- iconId: "cursor",
5337
- category: "motor"
5338
- },
5339
- "keyboard-nav": {
5340
- id: "keyboard-nav",
5341
- nameKey: "feature.keyboardNav",
5342
- descKey: "feature.keyboardNav.desc",
5343
- iconId: "keyboard",
5344
- category: "motor"
6148
+ iconId: "cursor"
5345
6149
  },
5346
6150
  "page-structure": {
5347
6151
  id: "page-structure",
5348
6152
  nameKey: "feature.pageStructure",
5349
6153
  descKey: "feature.pageStructure.desc",
5350
- iconId: "page-structure",
5351
- category: "motor"
5352
- },
5353
- "animation-stop": {
5354
- id: "animation-stop",
5355
- nameKey: "feature.animationStop",
5356
- descKey: "feature.animationStop.desc",
5357
- iconId: "animation-pause",
5358
- category: "cognitive"
6154
+ iconId: "page-structure"
5359
6155
  },
5360
6156
  tts: {
5361
6157
  id: "tts",
5362
6158
  nameKey: "feature.tts",
5363
6159
  descKey: "feature.tts.desc",
5364
- iconId: "tts",
5365
- category: "cognitive"
6160
+ iconId: "tts"
5366
6161
  },
5367
6162
  "text-simplify": {
5368
6163
  id: "text-simplify",
5369
6164
  nameKey: "feature.textSimplify",
5370
6165
  descKey: "feature.textSimplify.desc",
5371
- iconId: "simplify-text",
5372
- category: "ai"
6166
+ iconId: "simplify-text"
5373
6167
  },
5374
6168
  "alt-text": {
5375
6169
  id: "alt-text",
5376
6170
  nameKey: "feature.altText",
5377
6171
  descKey: "feature.altText.desc",
5378
- iconId: "alt-text",
5379
- category: "ai"
6172
+ iconId: "alt-text"
5380
6173
  },
5381
6174
  "auto-scan": {
5382
6175
  id: "auto-scan",
5383
6176
  nameKey: "feature.autoScan",
5384
6177
  descKey: "feature.autoScan.desc",
5385
- iconId: "scan",
5386
- category: "ai"
6178
+ iconId: "scan"
5387
6179
  }
5388
6180
  };
5389
- const CATEGORIES = [
5390
- { key: "visual", labelKey: "category.visual" },
5391
- { key: "motor", labelKey: "category.motor" },
5392
- { key: "cognitive", labelKey: "category.cognitive" },
5393
- { key: "ai", labelKey: "category.ai" }
6181
+ const SECTIONS = [
6182
+ {
6183
+ id: "essentials",
6184
+ labelKey: "section.essentials",
6185
+ descKey: "section.essentials.desc",
6186
+ featureIds: ["keyboard-nav", "focus-highlight", "link-highlight"]
6187
+ },
6188
+ {
6189
+ id: "support",
6190
+ labelKey: "section.support",
6191
+ descKey: "section.support.desc",
6192
+ featureIds: [
6193
+ "reading-guide",
6194
+ "reading-mask",
6195
+ "animation-stop",
6196
+ "hide-images",
6197
+ "page-structure",
6198
+ "big-cursor",
6199
+ "tts"
6200
+ ]
6201
+ },
6202
+ {
6203
+ id: "ai",
6204
+ labelKey: "section.ai",
6205
+ descKey: "section.ai.desc",
6206
+ featureIds: ["text-simplify", "alt-text", "auto-scan"]
6207
+ }
5394
6208
  ];
5395
- let groupedFeatures = /* @__PURE__ */ user_derived(() => {
5396
- const groups = /* @__PURE__ */ new Map();
5397
- for (const cat of CATEGORIES) groups.set(cat.key, []);
5398
- for (const slug of $$props.config.features) {
5399
- const def = FEATURE_REGISTRY[slug];
5400
- if (def) groups.get(def.category).push(def);
5401
- }
5402
- return groups;
5403
- });
6209
+ const CONTRAST_MODES = [
6210
+ { id: "off", labelKey: "control.default" },
6211
+ { id: "light", labelKey: "contrast.mode.light" },
6212
+ { id: "dark", labelKey: "contrast.mode.dark" },
6213
+ { id: "high", labelKey: "contrast.mode.high" }
6214
+ ];
6215
+ const TEXT_SIZE_PRESETS = [100, 120, 140, 160, 180];
6216
+ const AI_FEATURES = /* @__PURE__ */ new Set(["text-simplify", "alt-text"]);
6217
+ const loadedModules = /* @__PURE__ */ new Map();
6218
+ const FEATURE_LOADERS = {
6219
+ contrast: () => import("./contrast-CqsICAkU.js"),
6220
+ "text-size": () => import("./text-size-C6OFhCGi.js"),
6221
+ "keyboard-nav": () => import("./keyboard-nav-DH4qBThF.js"),
6222
+ "focus-highlight": () => import("./focus-highlight-CjERyyUF.js"),
6223
+ "link-highlight": () => import("./link-highlight-DBGm067Y.js"),
6224
+ "reading-guide": () => import("./reading-guide-VT8NciIL.js"),
6225
+ "reading-mask": () => import("./reading-mask-BABChuCz.js"),
6226
+ "animation-stop": () => import("./animation-stop-DXebPS8D.js"),
6227
+ "hide-images": () => import("./hide-images-DJwmsV2C.js"),
6228
+ "big-cursor": () => import("./big-cursor-B2UKu9dQ.js"),
6229
+ "page-structure": () => import("./page-structure-DTBqkrYs.js"),
6230
+ tts: () => import("./tts-02b9iV0h.js"),
6231
+ "text-simplify": () => import("./text-simplify-CELklw5A.js"),
6232
+ "alt-text": () => import("./alt-text-CgzNGvdT.js"),
6233
+ "auto-scan": () => import("./auto-scan-pg-09o7A.js")
6234
+ };
6235
+ let contrastMode = /* @__PURE__ */ state(proxy(readStoredContrastMode()));
6236
+ let textSize = /* @__PURE__ */ state(proxy(readStoredTextSize()));
6237
+ let visibleFeatureIds = /* @__PURE__ */ user_derived(() => new Set($$props.config.features));
6238
+ let essentialFeatures = /* @__PURE__ */ user_derived(() => getFeatureDefs(SECTIONS[0].featureIds));
6239
+ let activeSignature = /* @__PURE__ */ user_derived(() => Array.from($$props.activeFeatures.entries()).sort(([left], [right]) => left.localeCompare(right)).map(([id, enabled]) => `${id}:${enabled}`).join("|"));
5404
6240
  let aiService;
6241
+ function readStoredContrastMode() {
6242
+ if (typeof window === "undefined") return "off";
6243
+ const stored = localStorage.getItem("accessify-contrast-mode");
6244
+ return stored === "light" || stored === "dark" || stored === "high" ? stored : "off";
6245
+ }
6246
+ function readStoredTextSize() {
6247
+ if (typeof window === "undefined") return 100;
6248
+ const stored = Number.parseInt(localStorage.getItem("accessify-text-size") || "100", 10);
6249
+ return Number.isFinite(stored) ? Math.max(100, Math.min(200, stored)) : 100;
6250
+ }
5405
6251
  function getAIService() {
5406
6252
  if (!aiService) {
5407
6253
  aiService = createAIService({
@@ -5412,78 +6258,299 @@ function FeatureGrid($$anchor, $$props) {
5412
6258
  }
5413
6259
  return aiService;
5414
6260
  }
5415
- const AI_FEATURES = /* @__PURE__ */ new Set(["text-simplify", "alt-text"]);
5416
- const loadedModules = /* @__PURE__ */ new Map();
6261
+ function getIcon(iconId) {
6262
+ const iconFn = icons[iconId];
6263
+ return iconFn ? iconFn() : "";
6264
+ }
6265
+ function getFeatureDefs(ids) {
6266
+ return ids.filter((id) => get(visibleFeatureIds).has(id)).map((id) => FEATURE_REGISTRY[id]).filter(Boolean);
6267
+ }
6268
+ function updateControlState(id, module) {
6269
+ if (!module) return;
6270
+ const state2 = module.getState();
6271
+ if (id === "contrast") {
6272
+ set(contrastMode, state2.value === "light" || state2.value === "dark" || state2.value === "high" ? state2.value : "off", true);
6273
+ }
6274
+ if (id === "text-size") {
6275
+ set(textSize, typeof state2.value === "number" ? state2.value : 100, true);
6276
+ }
6277
+ }
5417
6278
  function handleReset() {
5418
- for (const [, mod] of loadedModules) {
6279
+ for (const [, module] of loadedModules) {
5419
6280
  try {
5420
- mod.deactivate();
6281
+ module.deactivate();
5421
6282
  } catch {
5422
6283
  }
5423
6284
  }
6285
+ set(contrastMode, "off");
6286
+ set(textSize, 100);
5424
6287
  }
5425
6288
  if (typeof window !== "undefined") {
5426
6289
  window.addEventListener("accessify:reset", handleReset);
5427
6290
  }
5428
6291
  async function loadFeatureModule(id) {
5429
6292
  if (loadedModules.has(id)) return loadedModules.get(id);
6293
+ const loader = FEATURE_LOADERS[id];
6294
+ if (!loader) return null;
5430
6295
  try {
5431
- const mod = await __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "../features/alt-text.ts": () => import("./alt-text-CLxbmwG6.js"), "../features/animation-stop.ts": () => import("./animation-stop-DXebPS8D.js"), "../features/auto-scan.ts": () => import("./auto-scan-pg-09o7A.js"), "../features/big-cursor.ts": () => import("./big-cursor-B2UKu9dQ.js"), "../features/color-blind.ts": () => import("./color-blind-0LFng55r.js"), "../features/contrast.ts": () => import("./contrast-DCkE0NXZ.js"), "../features/dyslexia-font.ts": () => import("./dyslexia-font-wONgIy2T.js"), "../features/focus-highlight.ts": () => import("./focus-highlight-CjERyyUF.js"), "../features/hide-images.ts": () => import("./hide-images-DJwmsV2C.js"), "../features/keyboard-nav.ts": () => import("./keyboard-nav-BdPyLaZt.js"), "../features/line-height.ts": () => import("./line-height-BT98qgEF.js"), "../features/link-highlight.ts": () => import("./link-highlight-DBGm067Y.js"), "../features/page-structure.ts": () => import("./page-structure-2X8mOSpC.js"), "../features/reading-guide.ts": () => import("./reading-guide-VT8NciIL.js"), "../features/reading-mask.ts": () => import("./reading-mask-BABChuCz.js"), "../features/saturation.ts": () => import("./saturation-D8ZXpWAN.js"), "../features/spacing.ts": () => import("./spacing-DENai3JU.js"), "../features/text-align.ts": () => import("./text-align-BDRPqPvl.js"), "../features/text-simplify.ts": () => import("./text-simplify-CELklw5A.js"), "../features/text-size.ts": () => import("./text-size-B-uv436p.js"), "../features/tts.ts": () => import("./tts-02b9iV0h.js") }), `../features/${id}.ts`, 3);
6296
+ const mod = await loader();
5432
6297
  const exported = mod.default ?? mod;
5433
- let featureModule;
5434
- if (typeof exported === "function") {
5435
- featureModule = AI_FEATURES.has(id) ? exported(getAIService(), $$props.config.lang) : exported();
5436
- } else {
5437
- featureModule = exported;
5438
- }
6298
+ const featureModule = typeof exported === "function" ? AI_FEATURES.has(id) ? exported(getAIService(), $$props.config.lang) : exported() : exported;
5439
6299
  loadedModules.set(id, featureModule);
5440
6300
  return featureModule;
5441
- } catch (err) {
5442
- console.warn(`[Accessify] Failed to load feature module "${id}":`, err);
6301
+ } catch (error) {
6302
+ console.warn(`[Accessify] Failed to load feature module "${id}":`, error);
5443
6303
  return null;
5444
6304
  }
5445
6305
  }
6306
+ async function syncActiveModules(_) {
6307
+ const idsToSync = /* @__PURE__ */ new Set(["contrast", "text-size", ...$$props.config.features]);
6308
+ for (const id of idsToSync) {
6309
+ const shouldBeEnabled = $$props.activeFeatures.get(id) ?? false;
6310
+ const alreadyLoaded = loadedModules.get(id);
6311
+ if (!shouldBeEnabled && !alreadyLoaded) {
6312
+ if (id === "contrast") set(contrastMode, "off");
6313
+ if (id === "text-size") set(textSize, 100);
6314
+ continue;
6315
+ }
6316
+ const module = shouldBeEnabled ? await loadFeatureModule(id) : alreadyLoaded;
6317
+ if (!module) continue;
6318
+ const isEnabled = module.getState().enabled;
6319
+ if (shouldBeEnabled && !isEnabled) module.activate();
6320
+ if (!shouldBeEnabled && isEnabled) module.deactivate();
6321
+ updateControlState(id, module);
6322
+ }
6323
+ }
5446
6324
  async function handleToggle(id) {
5447
- const isCurrentlyActive = $$props.activeFeatures.get(id) ?? false;
5448
- const newState = !isCurrentlyActive;
5449
- const mod = await loadFeatureModule(id);
5450
- if (mod) {
5451
- if (newState) mod.activate();
5452
- else mod.deactivate();
6325
+ const isActive = $$props.activeFeatures.get(id) ?? false;
6326
+ const nextState = !isActive;
6327
+ const module = await loadFeatureModule(id);
6328
+ if (module) {
6329
+ if (nextState) module.activate();
6330
+ else module.deactivate();
6331
+ updateControlState(id, module);
6332
+ }
6333
+ $$props.ontoggle(id, nextState);
6334
+ }
6335
+ async function setContrastMode(mode) {
6336
+ const module = await loadFeatureModule("contrast");
6337
+ if (!module) return;
6338
+ if (mode === "off") {
6339
+ module.deactivate();
6340
+ set(contrastMode, "off");
6341
+ $$props.ontoggle("contrast", false);
6342
+ return;
5453
6343
  }
5454
- $$props.ontoggle(id, newState);
6344
+ if (!module.getState().enabled) module.activate();
6345
+ module.setState?.(mode);
6346
+ set(contrastMode, mode, true);
6347
+ $$props.ontoggle("contrast", true);
6348
+ }
6349
+ async function setTextSize(value) {
6350
+ const module = await loadFeatureModule("text-size");
6351
+ if (!module) return;
6352
+ if (value === 100) {
6353
+ module.deactivate();
6354
+ set(textSize, 100);
6355
+ $$props.ontoggle("text-size", false);
6356
+ return;
6357
+ }
6358
+ if (!module.getState().enabled) module.activate();
6359
+ module.setState?.(value);
6360
+ set(textSize, value, true);
6361
+ $$props.ontoggle("text-size", true);
5455
6362
  }
5456
- function getIcon(iconId) {
5457
- const iconFn = icons[iconId];
5458
- return iconFn ? iconFn() : "";
6363
+ user_effect(() => {
6364
+ `${$$props.config.features.join("|")}|${get(activeSignature)}`;
6365
+ void syncActiveModules();
6366
+ });
6367
+ var div = root$2();
6368
+ var node = child(div);
6369
+ {
6370
+ var consequent_3 = ($$anchor2) => {
6371
+ var section_1 = root_1$1();
6372
+ var div_1 = child(section_1);
6373
+ var div_2 = child(div_1);
6374
+ var h3 = child(div_2);
6375
+ var text = child(h3);
6376
+ var p = sibling(h3, 2);
6377
+ var text_1 = child(p);
6378
+ var div_3 = sibling(div_1, 2);
6379
+ var node_1 = child(div_3);
6380
+ {
6381
+ var consequent = ($$anchor3) => {
6382
+ var article = root_2();
6383
+ var div_4 = child(article);
6384
+ var span = child(div_4);
6385
+ html(span, () => getIcon("contrast"), true);
6386
+ var div_5 = sibling(span, 2);
6387
+ var h4 = child(div_5);
6388
+ var text_2 = child(h4);
6389
+ var p_1 = sibling(h4, 2);
6390
+ var text_3 = child(p_1);
6391
+ var div_6 = sibling(div_4, 2);
6392
+ each(div_6, 21, () => CONTRAST_MODES, index, ($$anchor4, mode) => {
6393
+ var button = root_3();
6394
+ var text_4 = child(button);
6395
+ template_effect(
6396
+ ($0) => {
6397
+ set_attribute(button, "data-active", get(contrastMode) === get(mode).id);
6398
+ set_attribute(button, "aria-pressed", get(contrastMode) === get(mode).id);
6399
+ set_text(text_4, $0);
6400
+ },
6401
+ [() => t(get(mode).labelKey, $$props.config.lang)]
6402
+ );
6403
+ delegated("click", button, () => setContrastMode(get(mode).id));
6404
+ append($$anchor4, button);
6405
+ });
6406
+ template_effect(
6407
+ ($0, $1, $2) => {
6408
+ set_text(text_2, $0);
6409
+ set_text(text_3, $1);
6410
+ set_attribute(div_6, "aria-label", $2);
6411
+ },
6412
+ [
6413
+ () => t("feature.contrast", $$props.config.lang),
6414
+ () => t("feature.contrast.desc", $$props.config.lang),
6415
+ () => t("control.chooseMode", $$props.config.lang)
6416
+ ]
6417
+ );
6418
+ append($$anchor3, article);
6419
+ };
6420
+ var d = /* @__PURE__ */ user_derived(() => get(visibleFeatureIds).has("contrast"));
6421
+ if_block(node_1, ($$render) => {
6422
+ if (get(d)) $$render(consequent);
6423
+ });
6424
+ }
6425
+ var node_2 = sibling(node_1, 2);
6426
+ {
6427
+ var consequent_1 = ($$anchor3) => {
6428
+ var article_1 = root_4();
6429
+ var div_7 = child(article_1);
6430
+ var span_1 = child(div_7);
6431
+ html(span_1, () => getIcon("text-size"), true);
6432
+ var div_8 = sibling(span_1, 2);
6433
+ var h4_1 = child(div_8);
6434
+ var text_5 = child(h4_1);
6435
+ var p_2 = sibling(h4_1, 2);
6436
+ var text_6 = child(p_2);
6437
+ var div_9 = sibling(div_7, 2);
6438
+ each(div_9, 21, () => TEXT_SIZE_PRESETS, index, ($$anchor4, preset) => {
6439
+ var button_1 = root_5();
6440
+ var text_7 = child(button_1);
6441
+ template_effect(() => {
6442
+ set_attribute(button_1, "data-active", get(textSize) === get(preset));
6443
+ set_attribute(button_1, "aria-pressed", get(textSize) === get(preset));
6444
+ set_text(text_7, `${get(preset) ?? ""}%`);
6445
+ });
6446
+ delegated("click", button_1, () => setTextSize(get(preset)));
6447
+ append($$anchor4, button_1);
6448
+ });
6449
+ template_effect(
6450
+ ($0, $1, $2) => {
6451
+ set_text(text_5, $0);
6452
+ set_text(text_6, $1);
6453
+ set_attribute(div_9, "aria-label", $2);
6454
+ },
6455
+ [
6456
+ () => t("feature.textSize", $$props.config.lang),
6457
+ () => t("feature.textSize.desc", $$props.config.lang),
6458
+ () => t("feature.textSize", $$props.config.lang)
6459
+ ]
6460
+ );
6461
+ append($$anchor3, article_1);
6462
+ };
6463
+ var d_1 = /* @__PURE__ */ user_derived(() => get(visibleFeatureIds).has("text-size"));
6464
+ if_block(node_2, ($$render) => {
6465
+ if (get(d_1)) $$render(consequent_1);
6466
+ });
6467
+ }
6468
+ var node_3 = sibling(div_3, 2);
6469
+ {
6470
+ var consequent_2 = ($$anchor3) => {
6471
+ var div_10 = root_6();
6472
+ each(div_10, 21, () => get(essentialFeatures), (feature) => feature.id, ($$anchor4, feature) => {
6473
+ const isActive = /* @__PURE__ */ user_derived(() => $$props.activeFeatures.get(get(feature).id) ?? false);
6474
+ var button_2 = root_7();
6475
+ var div_11 = child(button_2);
6476
+ var span_2 = child(div_11);
6477
+ html(span_2, () => getIcon(get(feature).iconId), true);
6478
+ var span_3 = sibling(div_11, 2);
6479
+ var text_8 = child(span_3);
6480
+ var span_4 = sibling(span_3, 2);
6481
+ var text_9 = child(span_4);
6482
+ template_effect(
6483
+ ($0, $1, $2) => {
6484
+ set_attribute(button_2, "data-active", get(isActive));
6485
+ set_attribute(button_2, "aria-checked", get(isActive));
6486
+ set_attribute(button_2, "aria-label", $0);
6487
+ set_text(text_8, $1);
6488
+ set_text(text_9, $2);
6489
+ },
6490
+ [
6491
+ () => t(get(feature).nameKey, $$props.config.lang),
6492
+ () => t(get(feature).nameKey, $$props.config.lang),
6493
+ () => t(get(feature).descKey, $$props.config.lang)
6494
+ ]
6495
+ );
6496
+ delegated("click", button_2, () => handleToggle(get(feature).id));
6497
+ append($$anchor4, button_2);
6498
+ });
6499
+ append($$anchor3, div_10);
6500
+ };
6501
+ if_block(node_3, ($$render) => {
6502
+ if (get(essentialFeatures).length > 0) $$render(consequent_2);
6503
+ });
6504
+ }
6505
+ template_effect(
6506
+ ($0, $1) => {
6507
+ set_text(text, $0);
6508
+ set_text(text_1, $1);
6509
+ },
6510
+ [
6511
+ () => t(SECTIONS[0].labelKey, $$props.config.lang),
6512
+ () => t(SECTIONS[0].descKey, $$props.config.lang)
6513
+ ]
6514
+ );
6515
+ append($$anchor2, section_1);
6516
+ };
6517
+ var d_2 = /* @__PURE__ */ user_derived(() => get(visibleFeatureIds).has("contrast") || get(visibleFeatureIds).has("text-size") || getFeatureDefs(SECTIONS[0].featureIds).length > 0);
6518
+ if_block(node, ($$render) => {
6519
+ if (get(d_2)) $$render(consequent_3);
6520
+ });
5459
6521
  }
5460
- var fragment = comment();
5461
- var node = first_child(fragment);
5462
- each(node, 17, () => CATEGORIES, index, ($$anchor2, category) => {
5463
- const features = /* @__PURE__ */ user_derived(() => get(groupedFeatures).get(get(category).key) ?? []);
5464
- var fragment_1 = comment();
5465
- var node_1 = first_child(fragment_1);
6522
+ var node_4 = sibling(node, 2);
6523
+ each(node_4, 17, () => SECTIONS.slice(1), index, ($$anchor2, section) => {
6524
+ const features = /* @__PURE__ */ user_derived(() => getFeatureDefs(get(section).featureIds));
6525
+ var fragment = comment();
6526
+ var node_5 = first_child(fragment);
5466
6527
  {
5467
- var consequent = ($$anchor3) => {
5468
- var div = root_2();
5469
- var div_1 = child(div);
5470
- var text = child(div_1);
5471
- var div_2 = sibling(div_1, 2);
5472
- each(div_2, 21, () => get(features), (feature) => feature.id, ($$anchor4, feature) => {
6528
+ var consequent_4 = ($$anchor3) => {
6529
+ var section_2 = root_9();
6530
+ var div_12 = child(section_2);
6531
+ var div_13 = child(div_12);
6532
+ var h3_1 = child(div_13);
6533
+ var text_10 = child(h3_1);
6534
+ var p_3 = sibling(h3_1, 2);
6535
+ var text_11 = child(p_3);
6536
+ var div_14 = sibling(div_12, 2);
6537
+ each(div_14, 21, () => get(features), (feature) => feature.id, ($$anchor4, feature) => {
5473
6538
  const isActive = /* @__PURE__ */ user_derived(() => $$props.activeFeatures.get(get(feature).id) ?? false);
5474
- var button = root_3();
5475
- var span = child(button);
5476
- html(span, () => getIcon(get(feature).iconId), true);
5477
- var span_1 = sibling(span, 2);
5478
- var text_1 = child(span_1);
5479
- var span_2 = sibling(span_1, 2);
5480
- var text_2 = child(span_2);
6539
+ var button_3 = root_10();
6540
+ var div_15 = child(button_3);
6541
+ var span_5 = child(div_15);
6542
+ html(span_5, () => getIcon(get(feature).iconId), true);
6543
+ var span_6 = sibling(div_15, 2);
6544
+ var text_12 = child(span_6);
6545
+ var span_7 = sibling(span_6, 2);
6546
+ var text_13 = child(span_7);
5481
6547
  template_effect(
5482
6548
  ($0, $1, $2) => {
5483
- set_attribute(button, "aria-checked", get(isActive));
5484
- set_attribute(button, "aria-label", $0);
5485
- set_text(text_1, $1);
5486
- set_text(text_2, $2);
6549
+ set_attribute(button_3, "data-active", get(isActive));
6550
+ set_attribute(button_3, "aria-checked", get(isActive));
6551
+ set_attribute(button_3, "aria-label", $0);
6552
+ set_text(text_12, $1);
6553
+ set_text(text_13, $2);
5487
6554
  },
5488
6555
  [
5489
6556
  () => t(get(feature).nameKey, $$props.config.lang),
@@ -5491,28 +6558,29 @@ function FeatureGrid($$anchor, $$props) {
5491
6558
  () => t(get(feature).descKey, $$props.config.lang)
5492
6559
  ]
5493
6560
  );
5494
- delegated("click", button, () => handleToggle(get(feature).id));
5495
- append($$anchor4, button);
6561
+ delegated("click", button_3, () => handleToggle(get(feature).id));
6562
+ append($$anchor4, button_3);
5496
6563
  });
5497
6564
  template_effect(
5498
6565
  ($0, $1) => {
5499
- set_text(text, $0);
5500
- set_attribute(div_2, "aria-label", $1);
6566
+ set_class(section_2, 1, `accessify-section accessify-section--${get(section).id}`);
6567
+ set_text(text_10, $0);
6568
+ set_text(text_11, $1);
5501
6569
  },
5502
6570
  [
5503
- () => t(get(category).labelKey, $$props.config.lang),
5504
- () => t(get(category).labelKey, $$props.config.lang)
6571
+ () => t(get(section).labelKey, $$props.config.lang),
6572
+ () => t(get(section).descKey, $$props.config.lang)
5505
6573
  ]
5506
6574
  );
5507
- append($$anchor3, div);
6575
+ append($$anchor3, section_2);
5508
6576
  };
5509
- if_block(node_1, ($$render) => {
5510
- if (get(features).length > 0) $$render(consequent);
6577
+ if_block(node_5, ($$render) => {
6578
+ if (get(features).length > 0) $$render(consequent_4);
5511
6579
  });
5512
6580
  }
5513
- append($$anchor2, fragment_1);
6581
+ append($$anchor2, fragment);
5514
6582
  });
5515
- append($$anchor, fragment);
6583
+ append($$anchor, div);
5516
6584
  pop();
5517
6585
  }
5518
6586
  delegate(["click"]);
@@ -5547,7 +6615,7 @@ function PanelFooter($$anchor, $$props) {
5547
6615
  append($$anchor, div);
5548
6616
  pop();
5549
6617
  }
5550
- var root = /* @__PURE__ */ from_html(`<div class="sr-only" role="status" aria-live="polite" aria-atomic="true"> </div> <!> <div class="accessify-panel" role="dialog"><!> <!> <!> <!> <!></div>`, 1);
6618
+ var root = /* @__PURE__ */ from_html(`<div class="sr-only" role="status" aria-live="polite" aria-atomic="true"> </div> <!> <div class="accessify-panel" role="dialog"><!> <!> <!> <!></div>`, 1);
5551
6619
  function WidgetApp($$anchor, $$props) {
5552
6620
  push($$props, true);
5553
6621
  let config2 = prop($$props, "config", 7);
@@ -5557,10 +6625,8 @@ function WidgetApp($$anchor, $$props) {
5557
6625
  let panelEl = /* @__PURE__ */ state(null);
5558
6626
  let triggerEl = /* @__PURE__ */ state(null);
5559
6627
  let announcement = /* @__PURE__ */ state("");
5560
- let activeProfileId = /* @__PURE__ */ state(null);
5561
- let widgetLang = /* @__PURE__ */ state(proxy(config2().lang || "en"));
6628
+ let widgetLang = /* @__PURE__ */ state("en");
5562
6629
  const STORAGE_KEY = "accessify-prefs";
5563
- const PROFILE_STORAGE_KEY = "accessify-profile";
5564
6630
  let activeCount = /* @__PURE__ */ user_derived(() => Array.from(get(activeFeatures).values()).filter(Boolean).length);
5565
6631
  function announce(message) {
5566
6632
  set(announcement, "");
@@ -5575,8 +6641,6 @@ function WidgetApp($$anchor, $$props) {
5575
6641
  const prefs = JSON.parse(saved);
5576
6642
  set(activeFeatures, new Map(Object.entries(prefs)), true);
5577
6643
  }
5578
- const savedProfile = localStorage.getItem(PROFILE_STORAGE_KEY);
5579
- if (savedProfile) set(activeProfileId, savedProfile, true);
5580
6644
  } catch {
5581
6645
  }
5582
6646
  }
@@ -5584,11 +6648,6 @@ function WidgetApp($$anchor, $$props) {
5584
6648
  try {
5585
6649
  const obj = Object.fromEntries(get(activeFeatures));
5586
6650
  localStorage.setItem(STORAGE_KEY, JSON.stringify(obj));
5587
- if (get(activeProfileId)) {
5588
- localStorage.setItem(PROFILE_STORAGE_KEY, get(activeProfileId));
5589
- } else {
5590
- localStorage.removeItem(PROFILE_STORAGE_KEY);
5591
- }
5592
6651
  } catch {
5593
6652
  }
5594
6653
  }
@@ -5613,6 +6672,17 @@ function WidgetApp($$anchor, $$props) {
5613
6672
  else mount2.setAttribute("data-theme", get(currentTheme));
5614
6673
  }
5615
6674
  }
6675
+ function applyLanguage() {
6676
+ const mount2 = $$props.shadow.getElementById("accessify-mount");
6677
+ const dir = isRtlLang(get(widgetLang)) ? "rtl" : "ltr";
6678
+ if (mount2) {
6679
+ mount2.setAttribute("lang", get(widgetLang));
6680
+ mount2.setAttribute("dir", dir);
6681
+ }
6682
+ $$props.shadow.host.setAttribute("lang", get(widgetLang));
6683
+ $$props.shadow.host.setAttribute("dir", dir);
6684
+ setCurrentWidgetLang(get(widgetLang));
6685
+ }
5616
6686
  function open() {
5617
6687
  set(isOpen, true);
5618
6688
  requestAnimationFrame(() => {
@@ -5634,7 +6704,6 @@ function WidgetApp($$anchor, $$props) {
5634
6704
  function handleFeatureToggle(id, enabled) {
5635
6705
  get(activeFeatures).set(id, enabled);
5636
6706
  set(activeFeatures, new Map(get(activeFeatures)), true);
5637
- set(activeProfileId, null);
5638
6707
  savePrefs();
5639
6708
  const featureKey = `feature.${id.replace(/-([a-z])/g, (_, c) => c.toUpperCase())}`;
5640
6709
  const name = t(featureKey, get(widgetLang)) || id;
@@ -5643,33 +6712,14 @@ function WidgetApp($$anchor, $$props) {
5643
6712
  }
5644
6713
  function resetAll() {
5645
6714
  set(activeFeatures, /* @__PURE__ */ new Map(), true);
5646
- set(activeProfileId, null);
5647
6715
  savePrefs();
5648
6716
  window.dispatchEvent(new CustomEvent("accessify:reset"));
5649
6717
  announce(t("widget.resetConfirm", get(widgetLang)));
5650
6718
  }
5651
- function handleProfileActivate(profile) {
5652
- if (get(activeProfileId) === profile.id) {
5653
- resetAll();
5654
- return;
5655
- }
5656
- window.dispatchEvent(new CustomEvent("accessify:reset"));
5657
- const newActive = /* @__PURE__ */ new Map();
5658
- for (const featureId of profile.features) {
5659
- newActive.set(featureId, true);
5660
- }
5661
- set(activeFeatures, newActive, true);
5662
- set(activeProfileId, profile.id, true);
5663
- savePrefs();
5664
- for (const featureId of profile.features) {
5665
- window.dispatchEvent(new CustomEvent("accessify:feature-activate", { detail: { id: featureId } }));
5666
- }
5667
- const profileName = t(profile.nameKey, get(widgetLang));
5668
- announce(`${profileName} ${t("status.activated", get(widgetLang))}`);
5669
- }
5670
6719
  function handleLangChange(newLang) {
5671
- set(widgetLang, newLang, true);
5672
- config2().lang = newLang;
6720
+ set(widgetLang, getSupportedLang(newLang), true);
6721
+ config2().lang = get(widgetLang);
6722
+ applyLanguage();
5673
6723
  }
5674
6724
  function handleKeydown(e) {
5675
6725
  if (e.key === "Escape" && get(isOpen)) {
@@ -5692,20 +6742,12 @@ function WidgetApp($$anchor, $$props) {
5692
6742
  }
5693
6743
  }
5694
6744
  }
5695
- function restoreSavedFeatures() {
5696
- for (const [id, enabled] of get(activeFeatures)) {
5697
- if (enabled) {
5698
- window.dispatchEvent(new CustomEvent("accessify:feature-activate", { detail: { id } }));
5699
- }
5700
- }
5701
- }
5702
6745
  onMount(() => {
6746
+ set(widgetLang, getSupportedLang(config2().lang || "en"), true);
5703
6747
  detectTheme();
5704
6748
  applyTheme();
5705
6749
  loadPrefs();
5706
- queueMicrotask(() => {
5707
- restoreSavedFeatures();
5708
- });
6750
+ applyLanguage();
5709
6751
  });
5710
6752
  var $$exports = { open, close };
5711
6753
  var fragment = root();
@@ -5749,19 +6791,9 @@ function WidgetApp($$anchor, $$props) {
5749
6791
  onreset: resetAll
5750
6792
  });
5751
6793
  var node_3 = sibling(node_2, 2);
5752
- ProfileSection(node_3, {
5753
- get lang() {
5754
- return get(widgetLang);
5755
- },
5756
- get activeProfileId() {
5757
- return get(activeProfileId);
5758
- },
5759
- onactivate: handleProfileActivate
5760
- });
5761
- var node_4 = sibling(node_3, 2);
5762
6794
  {
5763
6795
  let $0 = /* @__PURE__ */ user_derived(() => ({ ...config2(), lang: get(widgetLang) }));
5764
- FeatureGrid(node_4, {
6796
+ FeatureGrid(node_3, {
5765
6797
  get config() {
5766
6798
  return get($0);
5767
6799
  },
@@ -5771,8 +6803,8 @@ function WidgetApp($$anchor, $$props) {
5771
6803
  ontoggle: handleFeatureToggle
5772
6804
  });
5773
6805
  }
5774
- var node_5 = sibling(node_4, 2);
5775
- PanelFooter(node_5, {
6806
+ var node_4 = sibling(node_3, 2);
6807
+ PanelFooter(node_4, {
5776
6808
  get lang() {
5777
6809
  return get(widgetLang);
5778
6810
  },
@@ -5782,12 +6814,17 @@ function WidgetApp($$anchor, $$props) {
5782
6814
  });
5783
6815
  bind_this(div_1, ($$value) => set(panelEl, $$value), () => get(panelEl));
5784
6816
  template_effect(
5785
- ($0) => {
6817
+ ($0, $1) => {
5786
6818
  set_text(text, get(announcement));
5787
6819
  set_attribute(div_1, "aria-label", $0);
5788
6820
  set_attribute(div_1, "aria-hidden", !get(isOpen));
6821
+ set_attribute(div_1, "dir", $1);
6822
+ div_1.dir = div_1.dir;
5789
6823
  },
5790
- [() => t("widget.title", get(widgetLang))]
6824
+ [
6825
+ () => t("widget.title", get(widgetLang)),
6826
+ () => isRtlLang(get(widgetLang)) ? "rtl" : "ltr"
6827
+ ]
5791
6828
  );
5792
6829
  append($$anchor, fragment);
5793
6830
  return pop($$exports);
@@ -5800,15 +6837,12 @@ function createWidgetStyles(config2) {
5800
6837
  const isRight = pos.includes("right");
5801
6838
  const isBottom = pos.includes("bottom");
5802
6839
  const z = config2.zIndex || 999999;
6840
+ const panelRadius = isRight ? "28px 0 0 28px" : "0 28px 28px 0";
6841
+ const hiddenTransform = isRight ? "translateX(24px)" : "translateX(-24px)";
5803
6842
  return `
5804
- /* ===================================================================
5805
- DESIGN TOKENS
5806
- =================================================================== */
5807
-
5808
6843
  :host {
5809
6844
  all: initial;
5810
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
5811
- 'Helvetica Neue', Arial, sans-serif;
6845
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
5812
6846
  font-size: 15px;
5813
6847
  line-height: 1.5;
5814
6848
  color-scheme: light dark;
@@ -5821,7 +6855,6 @@ function createWidgetStyles(config2) {
5821
6855
  }
5822
6856
 
5823
6857
  #accessify-mount {
5824
- /* Spacing scale (4px base) */
5825
6858
  --space-1: 4px;
5826
6859
  --space-2: 8px;
5827
6860
  --space-3: 12px;
@@ -5829,84 +6862,71 @@ function createWidgetStyles(config2) {
5829
6862
  --space-5: 20px;
5830
6863
  --space-6: 24px;
5831
6864
  --space-7: 32px;
5832
- --space-8: 40px;
5833
-
5834
- /* Radius system */
5835
- --radius-sm: 6px;
5836
- --radius-md: 10px;
5837
- --radius-lg: 14px;
5838
- --radius-full: 9999px;
5839
-
5840
- /* Typography */
5841
- --text-xs: 11px;
5842
- --text-sm: 13px;
6865
+ --radius-sm: 12px;
6866
+ --radius-md: 18px;
6867
+ --radius-lg: 24px;
6868
+ --radius-xl: 28px;
6869
+ --radius-pill: 999px;
6870
+ --text-xs: 12px;
6871
+ --text-sm: 14px;
5843
6872
  --text-base: 15px;
5844
- --text-lg: 17px;
5845
- --text-xl: 20px;
5846
- --font-normal: 400;
6873
+ --text-lg: 18px;
6874
+ --text-xl: 26px;
5847
6875
  --font-medium: 500;
5848
6876
  --font-semibold: 600;
5849
-
5850
- /* Shadows */
5851
- --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
5852
- --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.10);
5853
- --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.14);
5854
-
5855
- /* Colors: Light mode (default) */
5856
- --primary: #0055CC;
5857
- --primary-hover: #003D99;
5858
- --primary-soft: color-mix(in srgb, #0055CC 10%, #ffffff);
5859
- --surface: #ffffff;
5860
- --surface-raised: #f7f7f8;
5861
- --text: #1a1a1a;
5862
- --text-secondary: #5c5c5c;
5863
- --text-on-primary: #ffffff;
5864
- --border: #e2e2e5;
5865
- --border-strong: #c8c8cc;
5866
- --success: #008A00;
5867
- --warning: #B95000;
5868
- --error: #CC0000;
5869
-
5870
- /* Transition */
5871
- --transition-fast: 120ms ease;
5872
- --transition-normal: 200ms ease;
6877
+ --font-bold: 700;
6878
+ --surface: #eff4f8;
6879
+ --surface-strong: #ffffff;
6880
+ --surface-muted: #f7f9fc;
6881
+ --surface-tint: #ecf3fb;
6882
+ --text: #152031;
6883
+ --text-secondary: #5c6a79;
6884
+ --border: rgba(21, 32, 49, 0.12);
6885
+ --border-strong: rgba(21, 32, 49, 0.22);
6886
+ --accent: #0e6bd8;
6887
+ --accent-strong: #0a56a7;
6888
+ --accent-soft: rgba(14, 107, 216, 0.1);
6889
+ --text-on-accent: #ffffff;
6890
+ --shadow-sm: 0 14px 32px rgba(15, 23, 42, 0.08);
6891
+ --shadow-lg: 0 28px 72px rgba(15, 23, 42, 0.18);
6892
+ --transition-fast: 160ms ease;
6893
+ --transition-normal: 240ms ease;
5873
6894
  }
5874
6895
 
5875
- /* ── Dark mode ── */
5876
6896
  @media (prefers-color-scheme: dark) {
5877
6897
  #accessify-mount:not([data-theme="light"]) {
5878
- --primary: #4D9FFF;
5879
- --primary-hover: #3385E6;
5880
- --primary-soft: color-mix(in srgb, #4D9FFF 12%, #1a1a1a);
5881
- --surface: #1a1a1a;
5882
- --surface-raised: #242428;
5883
- --text: #f0f0f0;
5884
- --text-secondary: #a0a0a5;
5885
- --text-on-primary: #ffffff;
5886
- --border: #38383c;
5887
- --border-strong: #505055;
5888
- --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
6898
+ --surface: #101a27;
6899
+ --surface-strong: #142233;
6900
+ --surface-muted: #0f1825;
6901
+ --surface-tint: #1a314c;
6902
+ --text: #f5f8fb;
6903
+ --text-secondary: #b3c0cd;
6904
+ --border: rgba(245, 248, 251, 0.12);
6905
+ --border-strong: rgba(245, 248, 251, 0.22);
6906
+ --accent: #49a0ff;
6907
+ --accent-strong: #1c7cde;
6908
+ --accent-soft: rgba(73, 160, 255, 0.16);
6909
+ --shadow-sm: 0 16px 36px rgba(0, 0, 0, 0.24);
6910
+ --shadow-lg: 0 28px 80px rgba(0, 0, 0, 0.44);
5889
6911
  }
5890
6912
  }
5891
6913
 
5892
6914
  #accessify-mount[data-theme="dark"] {
5893
- --primary: #4D9FFF;
5894
- --primary-hover: #3385E6;
5895
- --primary-soft: color-mix(in srgb, #4D9FFF 12%, #1a1a1a);
5896
- --surface: #1a1a1a;
5897
- --surface-raised: #242428;
5898
- --text: #f0f0f0;
5899
- --text-secondary: #a0a0a5;
5900
- --text-on-primary: #ffffff;
5901
- --border: #38383c;
5902
- --border-strong: #505055;
5903
- --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
6915
+ --surface: #101a27;
6916
+ --surface-strong: #142233;
6917
+ --surface-muted: #0f1825;
6918
+ --surface-tint: #1a314c;
6919
+ --text: #f5f8fb;
6920
+ --text-secondary: #b3c0cd;
6921
+ --border: rgba(245, 248, 251, 0.12);
6922
+ --border-strong: rgba(245, 248, 251, 0.22);
6923
+ --accent: #49a0ff;
6924
+ --accent-strong: #1c7cde;
6925
+ --accent-soft: rgba(73, 160, 255, 0.16);
6926
+ --shadow-sm: 0 16px 36px rgba(0, 0, 0, 0.24);
6927
+ --shadow-lg: 0 28px 80px rgba(0, 0, 0, 0.44);
5904
6928
  }
5905
6929
 
5906
- /* ===================================================================
5907
- UTILITIES
5908
- =================================================================== */
5909
-
5910
6930
  .sr-only {
5911
6931
  position: absolute;
5912
6932
  width: 1px;
@@ -5920,42 +6940,43 @@ function createWidgetStyles(config2) {
5920
6940
  }
5921
6941
 
5922
6942
  *:focus-visible {
5923
- outline: 3px solid var(--primary);
5924
- outline-offset: 2px;
5925
- border-radius: var(--radius-sm);
6943
+ outline: 3px solid var(--accent);
6944
+ outline-offset: 3px;
6945
+ border-radius: 12px;
5926
6946
  }
5927
6947
 
5928
- /* ===================================================================
5929
- TRIGGER BUTTON (FAB)
5930
- =================================================================== */
5931
-
5932
6948
  .accessify-trigger {
5933
6949
  position: fixed;
5934
6950
  ${isBottom ? "bottom: 20px" : "top: 20px"};
5935
6951
  ${isRight ? "right: 20px" : "left: 20px"};
5936
6952
  z-index: ${z};
5937
- width: 56px;
5938
- height: 56px;
5939
- border-radius: var(--radius-full);
6953
+ width: 60px;
6954
+ height: 60px;
5940
6955
  border: none;
5941
- background: var(--primary);
5942
- color: var(--text-on-primary);
6956
+ border-radius: 20px;
6957
+ background: linear-gradient(180deg, #1681f2 0%, #0e6bd8 100%);
6958
+ color: #ffffff;
5943
6959
  cursor: pointer;
5944
6960
  display: flex;
5945
6961
  align-items: center;
5946
6962
  justify-content: center;
5947
- box-shadow: var(--shadow-md);
5948
- transition: transform var(--transition-fast), box-shadow var(--transition-fast);
6963
+ box-shadow: 0 18px 36px rgba(14, 107, 216, 0.28);
6964
+ transition: transform var(--transition-fast), box-shadow var(--transition-fast), opacity var(--transition-fast);
5949
6965
  }
5950
6966
 
5951
6967
  .accessify-trigger:hover {
5952
- transform: scale(1.05);
5953
- box-shadow: var(--shadow-lg);
5954
- background: var(--primary-hover);
6968
+ transform: translateY(-1px);
6969
+ box-shadow: 0 20px 40px rgba(14, 107, 216, 0.32);
5955
6970
  }
5956
6971
 
5957
6972
  .accessify-trigger:active {
5958
- transform: scale(0.95);
6973
+ transform: scale(0.98);
6974
+ }
6975
+
6976
+ .accessify-trigger[aria-expanded="true"] {
6977
+ opacity: 0;
6978
+ pointer-events: none;
6979
+ transform: scale(0.92);
5959
6980
  }
5960
6981
 
5961
6982
  .accessify-trigger svg {
@@ -5963,309 +6984,371 @@ function createWidgetStyles(config2) {
5963
6984
  height: 28px;
5964
6985
  }
5965
6986
 
5966
- /* ===================================================================
5967
- PANEL
5968
- =================================================================== */
5969
-
5970
6987
  .accessify-panel {
5971
6988
  position: fixed;
5972
- ${isBottom ? "bottom: 90px" : "top: 90px"};
5973
- ${isRight ? "right: 20px" : "left: 20px"};
6989
+ top: 0;
6990
+ bottom: 0;
6991
+ ${isRight ? "right: 0" : "left: 0"};
5974
6992
  z-index: ${z - 1};
5975
- width: 440px;
5976
- max-height: calc(100vh - 110px);
5977
- overflow-y: auto;
5978
- overflow-x: hidden;
5979
- background: var(--surface);
5980
- border-radius: var(--radius-lg);
6993
+ width: min(440px, 100vw);
6994
+ height: 100vh;
6995
+ display: flex;
6996
+ flex-direction: column;
6997
+ overflow: hidden;
6998
+ border-radius: ${panelRadius};
6999
+ ${isRight ? "border-left" : "border-right"}: 1px solid var(--border);
7000
+ background: linear-gradient(180deg, var(--surface-strong) 0%, var(--surface) 100%);
7001
+ color: var(--text);
5981
7002
  box-shadow: var(--shadow-lg);
5982
- border: 1px solid var(--border);
5983
- transform-origin: ${isBottom ? "bottom" : "top"} ${isRight ? "right" : "left"};
5984
7003
  transition: opacity var(--transition-normal), transform var(--transition-normal);
5985
7004
  }
5986
7005
 
5987
7006
  .accessify-panel[aria-hidden="true"] {
5988
7007
  opacity: 0;
5989
- transform: scale(0.96) translateY(${isBottom ? "8px" : "-8px"});
7008
+ transform: ${hiddenTransform};
5990
7009
  pointer-events: none;
5991
7010
  display: none;
5992
7011
  }
5993
7012
 
5994
7013
  .accessify-panel[aria-hidden="false"] {
5995
7014
  opacity: 1;
5996
- transform: scale(1) translateY(0);
5997
- }
5998
-
5999
- /* Scroll indicator (only visible if panel overflows) */
6000
- .accessify-panel-scroll {
6001
- position: relative;
7015
+ transform: translateX(0);
6002
7016
  }
6003
7017
 
6004
- /* ===================================================================
6005
- HEADER (Utility Bar)
6006
- =================================================================== */
6007
-
6008
7018
  .accessify-header {
6009
- display: flex;
6010
- align-items: center;
6011
- gap: var(--space-2);
6012
- padding: var(--space-2) var(--space-3);
6013
- border-bottom: 1px solid var(--border);
6014
- background: var(--surface);
6015
7019
  position: sticky;
6016
7020
  top: 0;
6017
- z-index: 2;
7021
+ z-index: 1;
7022
+ display: grid;
7023
+ gap: var(--space-4);
7024
+ padding: var(--space-6) var(--space-6) var(--space-5);
7025
+ border-bottom: 1px solid var(--border);
7026
+ background: color-mix(in srgb, var(--surface-strong) 94%, transparent);
7027
+ backdrop-filter: blur(16px);
7028
+ }
7029
+
7030
+ .accessify-header-top {
7031
+ display: flex;
7032
+ align-items: flex-start;
7033
+ justify-content: space-between;
7034
+ gap: var(--space-4);
7035
+ }
7036
+
7037
+ .accessify-header-title {
7038
+ display: grid;
7039
+ gap: 6px;
6018
7040
  }
6019
7041
 
6020
7042
  .accessify-header h2 {
6021
- font-size: var(--text-base);
6022
- font-weight: var(--font-semibold);
7043
+ font-size: var(--text-xl);
7044
+ font-weight: var(--font-bold);
7045
+ line-height: 1.08;
7046
+ letter-spacing: -0.02em;
6023
7047
  color: var(--text);
6024
- margin: 0;
6025
- flex: 1;
6026
- min-width: 0;
6027
7048
  }
6028
7049
 
6029
- .accessify-header-actions {
6030
- display: flex;
7050
+ .accessify-header p {
7051
+ color: var(--text-secondary);
7052
+ font-size: var(--text-sm);
7053
+ max-width: 34ch;
7054
+ }
7055
+
7056
+ .accessify-header-toolbar {
7057
+ display: grid;
7058
+ grid-template-columns: minmax(0, 1fr) auto;
6031
7059
  align-items: center;
6032
- gap: var(--space-2);
6033
- flex-shrink: 0;
7060
+ gap: var(--space-3);
6034
7061
  }
6035
7062
 
6036
- /* Small pill buttons in header */
6037
- .accessify-header-btn {
6038
- background: var(--surface-raised);
7063
+ .accessify-language-picker {
7064
+ position: relative;
7065
+ display: inline-flex;
7066
+ align-items: center;
7067
+ gap: 10px;
7068
+ min-width: 0;
7069
+ min-height: 48px;
7070
+ padding: 0 14px;
7071
+ border-radius: 16px;
6039
7072
  border: 1px solid var(--border);
6040
- border-radius: var(--radius-sm);
6041
- padding: var(--space-1) var(--space-2);
6042
- cursor: pointer;
6043
- color: var(--text-secondary);
6044
- display: flex;
7073
+ background: var(--surface-strong);
7074
+ color: var(--text);
7075
+ }
7076
+
7077
+ .accessify-language-icon {
7078
+ display: inline-flex;
6045
7079
  align-items: center;
6046
- gap: var(--space-1);
6047
- font-size: var(--text-xs);
6048
- font-weight: var(--font-medium);
6049
- transition: background var(--transition-fast), color var(--transition-fast);
6050
- white-space: nowrap;
7080
+ justify-content: center;
7081
+ color: var(--accent-strong);
7082
+ flex-shrink: 0;
6051
7083
  }
6052
7084
 
6053
- .accessify-header-btn:hover {
6054
- background: var(--border);
7085
+ .accessify-language-icon svg {
7086
+ width: 16px;
7087
+ height: 16px;
7088
+ }
7089
+
7090
+ .accessify-language-select {
7091
+ appearance: none;
7092
+ width: 100%;
7093
+ border: none;
7094
+ background: transparent;
6055
7095
  color: var(--text);
7096
+ padding: 12px 0;
7097
+ font-size: var(--text-sm);
7098
+ font-weight: var(--font-medium);
7099
+ cursor: pointer;
7100
+ min-width: 0;
6056
7101
  }
6057
7102
 
6058
- .accessify-header-btn svg {
6059
- width: 14px;
6060
- height: 14px;
7103
+ .accessify-language-select option {
7104
+ color: #152031;
6061
7105
  }
6062
7106
 
6063
- /* Language toggle */
6064
- .accessify-lang-toggle {
6065
- background: var(--surface-raised);
7107
+ .accessify-header-btn {
7108
+ display: inline-flex;
7109
+ align-items: center;
7110
+ justify-content: center;
7111
+ gap: 8px;
7112
+ min-height: 48px;
7113
+ padding: 0 16px;
6066
7114
  border: 1px solid var(--border);
6067
- border-radius: var(--radius-sm);
6068
- padding: var(--space-1) var(--space-2);
7115
+ border-radius: 16px;
7116
+ background: var(--surface-strong);
7117
+ color: var(--text);
6069
7118
  cursor: pointer;
6070
- color: var(--text-secondary);
6071
- font-size: var(--text-xs);
7119
+ font-size: var(--text-sm);
6072
7120
  font-weight: var(--font-semibold);
6073
- text-transform: uppercase;
6074
- letter-spacing: 0.5px;
6075
- transition: background var(--transition-fast);
6076
- min-width: 32px;
6077
- text-align: center;
7121
+ transition: background var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
6078
7122
  }
6079
7123
 
6080
- .accessify-lang-toggle:hover {
6081
- background: var(--border);
6082
- color: var(--text);
7124
+ .accessify-header-btn:hover {
7125
+ background: var(--surface-muted);
7126
+ border-color: var(--border-strong);
7127
+ transform: translateY(-1px);
7128
+ }
7129
+
7130
+ .accessify-header-btn--secondary {
7131
+ background: var(--surface-muted);
6083
7132
  }
6084
7133
 
6085
- /* ===================================================================
6086
- STATUS BAR
6087
- =================================================================== */
7134
+ .accessify-header-btn svg {
7135
+ width: 16px;
7136
+ height: 16px;
7137
+ }
7138
+
7139
+ .accessify-header-btn--icon {
7140
+ width: 48px;
7141
+ min-width: 48px;
7142
+ padding-inline: 0;
7143
+ flex-shrink: 0;
7144
+ }
6088
7145
 
6089
7146
  .accessify-status {
6090
7147
  display: flex;
6091
7148
  align-items: center;
6092
7149
  justify-content: space-between;
6093
- padding: var(--space-1) var(--space-3);
6094
- background: var(--surface-raised);
7150
+ gap: var(--space-3);
7151
+ padding: 14px var(--space-6);
6095
7152
  border-bottom: 1px solid var(--border);
6096
- font-size: 10px;
6097
- color: var(--text-secondary);
7153
+ background: linear-gradient(180deg, var(--accent-soft) 0%, transparent 100%);
6098
7154
  }
6099
7155
 
6100
7156
  .accessify-status-count {
7157
+ display: inline-flex;
7158
+ align-items: center;
7159
+ gap: 8px;
7160
+ min-height: 36px;
7161
+ padding: 0 14px;
7162
+ border-radius: var(--radius-pill);
7163
+ background: var(--accent-soft);
7164
+ color: var(--accent-strong);
7165
+ font-size: var(--text-sm);
6101
7166
  font-weight: var(--font-semibold);
6102
- color: var(--primary);
6103
7167
  }
6104
7168
 
6105
7169
  .accessify-status-count[data-count="0"] {
7170
+ background: var(--surface-muted);
6106
7171
  color: var(--text-secondary);
6107
7172
  }
6108
7173
 
6109
7174
  .accessify-status-reset {
6110
- background: none;
6111
7175
  border: none;
7176
+ background: none;
6112
7177
  color: var(--text-secondary);
6113
7178
  cursor: pointer;
6114
- font-size: var(--text-xs);
6115
- padding: var(--space-1) var(--space-2);
6116
- border-radius: var(--radius-sm);
6117
- transition: color var(--transition-fast), background var(--transition-fast);
7179
+ font-size: var(--text-sm);
7180
+ font-weight: var(--font-medium);
7181
+ padding: 8px 0;
7182
+ transition: color var(--transition-fast);
6118
7183
  }
6119
7184
 
6120
7185
  .accessify-status-reset:hover {
6121
- color: var(--error);
6122
- background: color-mix(in srgb, var(--error) 8%, transparent);
7186
+ color: var(--accent-strong);
6123
7187
  }
6124
7188
 
6125
- /* ===================================================================
6126
- PROFILES SECTION
6127
- =================================================================== */
6128
-
6129
- .accessify-profiles {
6130
- padding: var(--space-2) var(--space-3);
6131
- border-bottom: 1px solid var(--border);
7189
+ .accessify-body {
7190
+ flex: 1 1 auto;
7191
+ display: grid;
7192
+ gap: var(--space-4);
7193
+ padding: var(--space-4);
7194
+ overflow-y: auto;
7195
+ overscroll-behavior: contain;
7196
+ background: var(--surface);
6132
7197
  }
6133
7198
 
6134
- .accessify-section-title {
6135
- font-size: 10px;
6136
- font-weight: var(--font-semibold);
6137
- text-transform: uppercase;
6138
- letter-spacing: 0.6px;
6139
- color: var(--text-secondary);
6140
- margin-bottom: var(--space-1);
7199
+ .accessify-section {
7200
+ display: grid;
7201
+ gap: var(--space-4);
7202
+ padding: var(--space-5);
7203
+ border-radius: var(--radius-xl);
7204
+ border: 1px solid var(--border);
7205
+ background: var(--surface-strong);
7206
+ box-shadow: var(--shadow-sm);
6141
7207
  }
6142
7208
 
6143
- .accessify-profile-grid {
6144
- display: flex;
6145
- gap: var(--space-1);
6146
- overflow-x: auto;
6147
- scrollbar-width: none;
6148
- -webkit-overflow-scrolling: touch;
7209
+ .accessify-section--priority {
7210
+ background: linear-gradient(180deg, var(--surface-strong) 0%, var(--surface-muted) 100%);
6149
7211
  }
6150
7212
 
6151
- .accessify-profile-grid::-webkit-scrollbar {
6152
- display: none;
7213
+ .accessify-section-head {
7214
+ display: grid;
7215
+ gap: 6px;
6153
7216
  }
6154
7217
 
6155
- .accessify-profile-card {
6156
- display: flex;
6157
- flex-direction: column;
6158
- align-items: center;
6159
- gap: 2px;
6160
- padding: var(--space-1) var(--space-2);
6161
- border: 1.5px solid var(--border);
6162
- border-radius: var(--radius-sm);
6163
- background: var(--surface);
7218
+ .accessify-section-head h3 {
7219
+ font-size: var(--text-lg);
7220
+ font-weight: var(--font-bold);
7221
+ line-height: 1.15;
6164
7222
  color: var(--text);
6165
- cursor: pointer;
6166
- transition: all var(--transition-fast);
6167
- min-width: 68px;
6168
- text-align: center;
6169
- flex-shrink: 0;
6170
- font-size: 10px;
6171
- line-height: 1.2;
6172
7223
  }
6173
7224
 
6174
- .accessify-profile-card:hover {
6175
- border-color: var(--primary);
6176
- background: var(--surface-raised);
7225
+ .accessify-section-head p {
7226
+ color: var(--text-secondary);
7227
+ font-size: var(--text-sm);
7228
+ line-height: 1.45;
7229
+ max-width: 46ch;
6177
7230
  }
6178
7231
 
6179
- .accessify-profile-card[aria-pressed="true"] {
6180
- background: var(--primary-soft);
6181
- border-color: var(--primary);
6182
- color: var(--primary);
6183
- font-weight: var(--font-medium);
7232
+ .accessify-control-grid {
7233
+ display: grid;
7234
+ grid-template-columns: repeat(2, minmax(0, 1fr));
7235
+ gap: var(--space-3);
6184
7236
  }
6185
7237
 
6186
- .accessify-profile-card svg {
6187
- width: 16px;
6188
- height: 16px;
7238
+ .accessify-control-card {
7239
+ display: grid;
7240
+ gap: var(--space-4);
7241
+ min-height: 176px;
7242
+ padding: var(--space-4);
7243
+ border-radius: 22px;
7244
+ border: 1px solid var(--border);
7245
+ background: var(--surface-muted);
6189
7246
  }
6190
7247
 
6191
- /* ===================================================================
6192
- CATEGORY SECTIONS
6193
- =================================================================== */
7248
+ .accessify-control-copy {
7249
+ display: grid;
7250
+ grid-template-columns: auto 1fr;
7251
+ gap: var(--space-3);
7252
+ align-items: start;
7253
+ }
6194
7254
 
6195
- .accessify-category {
6196
- padding: var(--space-1) var(--space-3);
7255
+ .accessify-control-copy h4 {
7256
+ font-size: var(--text-base);
7257
+ font-weight: var(--font-bold);
7258
+ color: var(--text);
6197
7259
  }
6198
7260
 
6199
- .accessify-category + .accessify-category {
6200
- border-top: 1px solid var(--border);
7261
+ .accessify-control-copy p {
7262
+ margin-top: 4px;
7263
+ color: var(--text-secondary);
7264
+ font-size: var(--text-sm);
7265
+ line-height: 1.45;
7266
+ }
7267
+
7268
+ .accessify-chip-group {
7269
+ display: flex;
7270
+ flex-wrap: wrap;
7271
+ gap: 10px;
6201
7272
  }
6202
7273
 
6203
- .accessify-category-title {
6204
- font-size: 10px;
7274
+ .accessify-chip {
7275
+ min-height: 42px;
7276
+ padding: 0 14px;
7277
+ border-radius: 16px;
7278
+ border: 1px solid var(--border);
7279
+ background: var(--surface-strong);
7280
+ color: var(--text);
7281
+ cursor: pointer;
7282
+ font-size: var(--text-sm);
6205
7283
  font-weight: var(--font-semibold);
6206
- text-transform: uppercase;
6207
- letter-spacing: 0.6px;
6208
- color: var(--text-secondary);
6209
- margin-bottom: var(--space-1);
6210
- padding-left: var(--space-1);
7284
+ display: inline-flex;
7285
+ align-items: center;
7286
+ justify-content: center;
7287
+ transition: transform var(--transition-fast), background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
6211
7288
  }
6212
7289
 
6213
- /* ===================================================================
6214
- FEATURE CARDS
6215
- =================================================================== */
7290
+ .accessify-chip:hover {
7291
+ transform: translateY(-1px);
7292
+ border-color: var(--border-strong);
7293
+ background: var(--surface);
7294
+ }
7295
+
7296
+ .accessify-chip[data-active="true"] {
7297
+ background: linear-gradient(180deg, var(--accent) 0%, var(--accent-strong) 100%);
7298
+ color: var(--text-on-accent);
7299
+ border-color: var(--accent);
7300
+ box-shadow: 0 12px 20px rgba(14, 107, 216, 0.2);
7301
+ }
7302
+
7303
+ .accessify-chip-group--sizes .accessify-chip {
7304
+ min-width: 68px;
7305
+ }
6216
7306
 
6217
7307
  .accessify-features {
6218
7308
  display: grid;
6219
- grid-template-columns: repeat(3, 1fr);
6220
- gap: 4px;
7309
+ grid-template-columns: repeat(2, minmax(0, 1fr));
7310
+ gap: var(--space-3);
6221
7311
  }
6222
7312
 
6223
7313
  .accessify-card {
6224
7314
  position: relative;
6225
- display: flex;
6226
- flex-direction: column;
6227
- align-items: center;
6228
- justify-content: center;
6229
- gap: 1px;
6230
- padding: 6px var(--space-1);
6231
- border: 1.5px solid var(--border);
6232
- border-radius: var(--radius-sm);
6233
- background: var(--surface);
7315
+ display: grid;
7316
+ align-content: start;
7317
+ gap: 12px;
7318
+ min-height: 164px;
7319
+ padding: var(--space-4);
7320
+ border-radius: 24px;
7321
+ border: 1px solid var(--border);
7322
+ background: var(--surface-strong);
6234
7323
  color: var(--text);
6235
7324
  cursor: pointer;
6236
- transition: all var(--transition-fast);
6237
- text-align: center;
6238
- min-height: 48px;
7325
+ text-align: left;
6239
7326
  font-family: inherit;
6240
7327
  font-size: inherit;
6241
- line-height: inherit;
7328
+ transition: transform var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast);
6242
7329
  }
6243
7330
 
6244
7331
  .accessify-card:hover {
6245
- border-color: var(--primary);
6246
- background: var(--surface-raised);
7332
+ transform: translateY(-2px);
7333
+ border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
6247
7334
  box-shadow: var(--shadow-sm);
6248
7335
  }
6249
7336
 
6250
- /* ── Active card: bold, unmistakable ── */
6251
- .accessify-card[aria-checked="true"] {
6252
- background: var(--primary-soft);
6253
- border-color: var(--primary);
6254
- border-width: 2px;
6255
- /* Compensate for thicker border to prevent layout shift */
6256
- padding: calc(6px - 0.5px) calc(var(--space-1) - 0.5px);
7337
+ .accessify-card[data-active="true"] {
7338
+ border-color: color-mix(in srgb, var(--accent) 48%, var(--border));
7339
+ background: linear-gradient(180deg, var(--accent-soft) 0%, var(--surface-strong) 100%);
7340
+ box-shadow: 0 16px 30px rgba(14, 107, 216, 0.12);
6257
7341
  }
6258
7342
 
6259
- /* Checkmark badge */
6260
- .accessify-card[aria-checked="true"]::after {
7343
+ .accessify-card[data-active="true"]::after {
6261
7344
  content: '';
6262
7345
  position: absolute;
6263
- top: var(--space-1);
6264
- right: var(--space-1);
6265
- width: 18px;
6266
- height: 18px;
6267
- border-radius: var(--radius-full);
6268
- background: var(--primary);
7346
+ top: 14px;
7347
+ right: 14px;
7348
+ width: 22px;
7349
+ height: 22px;
7350
+ border-radius: 999px;
7351
+ background: var(--accent);
6269
7352
  mask-image: url("data:image/svg+xml,${CHECKMARK_SVG}");
6270
7353
  mask-size: 12px;
6271
7354
  mask-repeat: no-repeat;
@@ -6276,91 +7359,66 @@ function createWidgetStyles(config2) {
6276
7359
  -webkit-mask-position: center;
6277
7360
  }
6278
7361
 
6279
- .accessify-card[aria-checked="true"] .accessify-card-icon {
6280
- color: var(--primary);
6281
- }
6282
-
6283
- .accessify-card[aria-checked="true"] .accessify-card-label {
6284
- color: var(--primary);
6285
- font-weight: var(--font-semibold);
7362
+ .accessify-card-top {
7363
+ display: flex;
7364
+ align-items: center;
7365
+ justify-content: space-between;
7366
+ gap: var(--space-2);
6286
7367
  }
6287
7368
 
6288
7369
  .accessify-card-icon {
6289
- color: var(--text-secondary);
6290
- transition: color var(--transition-fast);
7370
+ display: inline-flex;
7371
+ align-items: center;
7372
+ justify-content: center;
7373
+ width: 52px;
7374
+ height: 52px;
7375
+ border-radius: 18px;
7376
+ background: var(--surface-tint);
7377
+ color: var(--accent-strong);
7378
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
6291
7379
  }
6292
7380
 
6293
7381
  .accessify-card-icon svg {
6294
- width: 18px;
6295
- height: 18px;
7382
+ width: 22px;
7383
+ height: 22px;
6296
7384
  }
6297
7385
 
6298
7386
  .accessify-card-label {
6299
- font-size: 10px;
6300
- font-weight: var(--font-medium);
6301
- line-height: 1.15;
6302
- word-break: break-word;
6303
- transition: color var(--transition-fast);
7387
+ font-size: 16px;
7388
+ font-weight: var(--font-bold);
7389
+ line-height: 1.22;
7390
+ color: var(--text);
6304
7391
  }
6305
7392
 
6306
7393
  .accessify-card-desc {
6307
- display: none;
7394
+ color: var(--text-secondary);
7395
+ font-size: var(--text-sm);
7396
+ line-height: 1.5;
6308
7397
  }
6309
7398
 
6310
- /* ===================================================================
6311
- FOOTER
6312
- =================================================================== */
6313
-
6314
7399
  .accessify-footer {
6315
- padding: var(--space-1) var(--space-3);
6316
- border-top: 1px solid var(--border);
6317
- font-size: 10px;
6318
- color: var(--text-secondary);
6319
- text-align: center;
6320
7400
  display: flex;
6321
7401
  align-items: center;
6322
7402
  justify-content: center;
6323
7403
  gap: var(--space-2);
7404
+ padding: 16px var(--space-6) 20px;
7405
+ border-top: 1px solid var(--border);
7406
+ color: var(--text-secondary);
7407
+ font-size: var(--text-xs);
7408
+ text-align: center;
7409
+ background: color-mix(in srgb, var(--surface-strong) 95%, transparent);
6324
7410
  }
6325
7411
 
6326
7412
  .accessify-footer a {
6327
- color: var(--primary);
7413
+ color: var(--accent-strong);
6328
7414
  text-decoration: none;
7415
+ font-weight: var(--font-medium);
6329
7416
  }
6330
7417
 
6331
7418
  .accessify-footer a:hover {
6332
7419
  text-decoration: underline;
6333
7420
  }
6334
7421
 
6335
- /* ===================================================================
6336
- SUB-PANELS (sliders, selects)
6337
- =================================================================== */
6338
-
6339
- .accessify-subpanel {
6340
- padding: var(--space-3) var(--space-5);
6341
- background: var(--surface-raised);
6342
- border-top: 1px solid var(--border);
6343
- }
6344
-
6345
- .accessify-slider {
6346
- width: 100%;
6347
- accent-color: var(--primary);
6348
- }
6349
-
6350
- .accessify-select {
6351
- width: 100%;
6352
- padding: var(--space-2) var(--space-3);
6353
- border: 1px solid var(--border);
6354
- border-radius: var(--radius-sm);
6355
- background: var(--surface);
6356
- color: var(--text);
6357
- font-size: var(--text-sm);
6358
- }
6359
-
6360
- /* ===================================================================
6361
- REDUCED MOTION
6362
- =================================================================== */
6363
-
6364
7422
  @media (prefers-reduced-motion: reduce) {
6365
7423
  *, *::before, *::after {
6366
7424
  animation-duration: 0.01ms !important;
@@ -6368,40 +7426,63 @@ function createWidgetStyles(config2) {
6368
7426
  }
6369
7427
  }
6370
7428
 
6371
- /* ===================================================================
6372
- MOBILE RESPONSIVE
6373
- =================================================================== */
6374
-
6375
- @media (max-width: 480px) {
7429
+ @media (max-width: 640px) {
6376
7430
  .accessify-panel {
6377
- width: 100%;
6378
- left: 0;
6379
- right: 0;
6380
- ${isBottom ? "bottom: 0" : "top: 0"};
6381
- border-radius: ${isBottom ? "var(--radius-lg) var(--radius-lg) 0 0" : "0 0 var(--radius-lg) var(--radius-lg)"};
6382
- max-height: 85vh;
7431
+ width: 100vw;
7432
+ border-radius: 0;
7433
+ }
7434
+
7435
+ .accessify-header,
7436
+ .accessify-status,
7437
+ .accessify-footer {
7438
+ padding-inline: var(--space-4);
6383
7439
  }
6384
7440
 
7441
+ .accessify-header {
7442
+ padding-top: var(--space-5);
7443
+ }
7444
+
7445
+ .accessify-header p {
7446
+ max-width: none;
7447
+ }
7448
+
7449
+ .accessify-header-toolbar {
7450
+ grid-template-columns: 1fr;
7451
+ }
7452
+
7453
+ .accessify-body {
7454
+ padding: var(--space-3);
7455
+ }
7456
+
7457
+ .accessify-control-grid,
6385
7458
  .accessify-features {
6386
- grid-template-columns: repeat(2, 1fr);
7459
+ grid-template-columns: 1fr;
6387
7460
  }
6388
7461
 
7462
+ .accessify-control-card,
6389
7463
  .accessify-card {
6390
- min-height: 88px;
6391
- padding: var(--space-3);
7464
+ min-height: 0;
6392
7465
  }
6393
7466
 
6394
7467
  .accessify-trigger {
6395
7468
  ${isBottom ? "bottom: 16px" : "top: 16px"};
6396
7469
  ${isRight ? "right: 16px" : "left: 16px"};
6397
- }
6398
-
6399
- .accessify-card-desc {
6400
- display: none;
7470
+ width: 56px;
7471
+ height: 56px;
7472
+ border-radius: 18px;
6401
7473
  }
6402
7474
  }
6403
7475
  `;
6404
7476
  }
7477
+ const REMOVED_FEATURES = /* @__PURE__ */ new Set([
7478
+ "spacing",
7479
+ "dyslexia-font",
7480
+ "color-blind",
7481
+ "color-blindness",
7482
+ "saturation",
7483
+ "text-align",
7484
+ "line-height"
7485
+ ]);
6405
7486
  const DEFAULT_CONFIG = {
6406
7487
  position: "bottom-right",
6407
7488
  theme: "auto",
@@ -6409,14 +7490,8 @@ const DEFAULT_CONFIG = {
6409
7490
  features: [
6410
7491
  "contrast",
6411
7492
  "text-size",
6412
- "spacing",
6413
- "dyslexia-font",
6414
- "color-blindness",
6415
7493
  "link-highlight",
6416
- "saturation",
6417
7494
  "hide-images",
6418
- "text-align",
6419
- "line-height",
6420
7495
  "reading-guide",
6421
7496
  "reading-mask",
6422
7497
  "focus-highlight",
@@ -6439,13 +7514,11 @@ function init(userConfig = {}) {
6439
7514
  if (widgetInstance) return;
6440
7515
  const dataConfig = window.__accessify_dataConfig || {};
6441
7516
  config = { ...DEFAULT_CONFIG, ...dataConfig, ...userConfig };
7517
+ config.features = (config.features || DEFAULT_CONFIG.features).filter((feature) => !REMOVED_FEATURES.has(feature));
6442
7518
  containerEl = document.createElement("div");
6443
7519
  containerEl.id = "accessify-root";
6444
7520
  containerEl.setAttribute("role", "complementary");
6445
- containerEl.setAttribute(
6446
- "aria-label",
6447
- config.lang?.startsWith("de") ? "Barrierefreiheit-Einstellungen" : "Accessibility settings"
6448
- );
7521
+ containerEl.setAttribute("aria-label", t("widget.title", config.lang));
6449
7522
  const shadow = containerEl.attachShadow({ mode: "open", delegatesFocus: true });
6450
7523
  const sheet = new CSSStyleSheet();
6451
7524
  sheet.replaceSync(createWidgetStyles(config));
@@ -6515,6 +7588,8 @@ window.A11yPlus = window.Accessify;
6515
7588
  export {
6516
7589
  RateLimitError as R,
6517
7590
  destroy as d,
6518
- init as i
7591
+ getCurrentWidgetLang as g,
7592
+ init as i,
7593
+ t
6519
7594
  };
6520
- //# sourceMappingURL=index-CUQfpnwR.js.map
7595
+ //# sourceMappingURL=index-qmiN2JAz.js.map