npm - ngp-accessibility - Versions diffs - 1.0.2 → 1.0.3 - Mend

ngp-accessibility 1.0.2 → 1.0.3

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 (11) hide show

package/README.md +78 -5
package/dist/AccessibilityContext.d.ts +3 -3
package/dist/AccessibilityDropdown.d.ts +24 -2
package/dist/AccessibilityToolbar.d.ts +14 -2
package/dist/index.d.ts +8 -6
package/dist/index.esm.js +80 -61
package/dist/index.esm.js.map +1 -1
package/dist/index.js +80 -61
package/dist/index.js.map +1 -1
package/dist/styles.css +49 -31
package/package.json +1 -1

package/README.md CHANGED Viewed

@@ -26,8 +26,8 @@ npm install ngp-accessibility
 ### Option 1: Toolbar (Horizontal)
 ```jsx
-import { AccessibilityProvider, AccessibilityToolbar } from 'ngp-accessibility';
-import 'ngp-accessibility/dist/styles.css';
+import { AccessibilityProvider, AccessibilityToolbar } from "ngp-accessibility";
+import "ngp-accessibility/dist/styles.css";
 function App() {
   return (
@@ -42,13 +42,16 @@ function App() {
 ### Option 2: Dropdown Button
 ```jsx
-import { AccessibilityProvider, AccessibilityDropdown } from 'ngp-accessibility';
-import 'ngp-accessibility/dist/styles.css';
+import {
+  AccessibilityProvider,
+  AccessibilityDropdown,
+} from "ngp-accessibility";
+import "ngp-accessibility/dist/styles.css";
 function App() {
   return (
     <AccessibilityProvider>
-      <div style={{ textAlign: 'right', padding: '10px' }}>
+      <div style={{ textAlign: "right", padding: "10px" }}>
         <AccessibilityDropdown />
       </div>
       <YourContent />
@@ -60,6 +63,7 @@ function App() {
 ## Voice Commands
 When voice command is enabled, you can use:
 - "increase text" / "palakihin"
 - "decrease text" / "paliitin"
 - "high contrast" / "mataas"
@@ -71,10 +75,13 @@ When voice command is enabled, you can use:
 ## API
 ### AccessibilityProvider
 Wrap your app with this provider.
 ### useAccessibility()
 Hook that returns:
 - `language`, `setLanguage(lang)`
 - `textSize`, `increaseText()`, `decreaseText()`
 - `highContrast`, `toggleHighContrast()`
@@ -86,11 +93,77 @@ Hook that returns:
 - `translate(key)` - Get translated text
 ### AccessibilityToolbar
 Pre-built toolbar component with all controls.
+## Redesign And Theming
+You can fully redesign the package UI in 3 ways:
+### 1. Override CSS variables (fastest)
+```css
+:root {
+  --ngp-a11y-bg: #101418;
+  --ngp-a11y-surface: #1b232c;
+  --ngp-a11y-surface-hover: #243241;
+  --ngp-a11y-text: #f2f6fa;
+  --ngp-a11y-border: #2d3a48;
+  --ngp-a11y-accent: #16a34a;
+  --ngp-a11y-accent-hover: #15803d;
+  --ngp-a11y-accent-text: #ffffff;
+  --ngp-a11y-radius: 999px;
+}
+```
+### 2. Pass custom classes to sub-elements
+```tsx
+<AccessibilityToolbar
+  className="my-toolbar"
+  classes={{
+    button: "my-btn",
+    activeButton: "my-btn-active",
+    select: "my-select",
+  }}
+/>
+```
+```tsx
+<AccessibilityDropdown
+  classes={{
+    toggle: "my-toggle",
+    menu: "my-menu",
+    section: "my-section",
+    button: "my-btn",
+    activeButton: "my-btn-active",
+  }}
+/>
+```
+### 3. Replace the dropdown trigger UI entirely
+```tsx
+<AccessibilityDropdown
+  renderTrigger={({ isOpen, toggle, className }) => (
+    <button className={`${className} custom-trigger`} onClick={toggle}>
+      {isOpen ? "Close Tools" : "Open Accessibility"}
+    </button>
+  )}
+/>
+```
+TypeScript users can import the prop types directly:
+- `AccessibilityToolbarProps`
+- `AccessibilityToolbarClasses`
+- `AccessibilityDropdownProps`
+- `AccessibilityDropdownClasses`
 ## Full Documentation
 For complete documentation including:
 - Full page translation guide
 - Custom toolbar examples
 - TypeScript support

package/dist/AccessibilityContext.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import React, { ReactNode } from 'react';
-import { Language, TranslationKey } from './translations';
+import React, { ReactNode } from "react";
+import { Language, TranslationKey } from "./translations";
 interface AccessibilityState {
     language: Language;
     textSize: number;
@@ -25,7 +25,7 @@ interface AccessibilityContextType extends AccessibilityState {
 }
 interface AccessibilityProviderProps {
     children: ReactNode;
-    translations?: Record<string, Record<string, any>>;
+    translations?: Partial<Record<Language, Record<string, string>>>;
 }
 export declare const AccessibilityProvider: React.FC<AccessibilityProviderProps>;
 export declare const useAccessibility: () => AccessibilityContextType;

package/dist/AccessibilityDropdown.d.ts CHANGED Viewed

@@ -1,2 +1,24 @@
-import React from 'react';
-export declare const AccessibilityDropdown: React.FC;
+import React from "react";
+export interface AccessibilityDropdownClasses {
+    root?: string;
+    toggle?: string;
+    menu?: string;
+    section?: string;
+    label?: string;
+    select?: string;
+    button?: string;
+    activeButton?: string;
+    voiceButton?: string;
+}
+export interface AccessibilityDropdownProps {
+    className?: string;
+    style?: React.CSSProperties;
+    classes?: AccessibilityDropdownClasses;
+    triggerLabel?: React.ReactNode;
+    renderTrigger?: (params: {
+        isOpen: boolean;
+        toggle: () => void;
+        className: string;
+    }) => React.ReactNode;
+}
+export declare const AccessibilityDropdown: React.FC<AccessibilityDropdownProps>;

package/dist/AccessibilityToolbar.d.ts CHANGED Viewed

@@ -1,2 +1,14 @@
-import React from 'react';
-export declare const AccessibilityToolbar: React.FC;
+import React from "react";
+export interface AccessibilityToolbarClasses {
+    root?: string;
+    select?: string;
+    button?: string;
+    activeButton?: string;
+    voiceButton?: string;
+}
+export interface AccessibilityToolbarProps {
+    className?: string;
+    style?: React.CSSProperties;
+    classes?: AccessibilityToolbarClasses;
+}
+export declare const AccessibilityToolbar: React.FC<AccessibilityToolbarProps>;

package/dist/index.d.ts CHANGED Viewed

@@ -1,6 +1,8 @@
-export { AccessibilityProvider, useAccessibility } from './AccessibilityContext';
-export { AccessibilityToolbar } from './AccessibilityToolbar';
-export { AccessibilityDropdown } from './AccessibilityDropdown';
-export { T } from './T';
-export { translations, type Language, type TranslationKey } from './translations';
-export type { default as React } from 'react';
+export { AccessibilityProvider, useAccessibility, } from "./AccessibilityContext";
+export { AccessibilityToolbar } from "./AccessibilityToolbar";
+export { AccessibilityDropdown } from "./AccessibilityDropdown";
+export { T } from "./T";
+export { translations, type Language, type TranslationKey, } from "./translations";
+export type { AccessibilityToolbarProps, AccessibilityToolbarClasses, } from "./AccessibilityToolbar";
+export type { AccessibilityDropdownProps, AccessibilityDropdownClasses, } from "./AccessibilityDropdown";
+export type { default as React } from "react";

package/dist/index.esm.js CHANGED Viewed

@@ -34,9 +34,9 @@ const translations = {
 };
 const AccessibilityContext = createContext(undefined);
-const AccessibilityProvider = ({ children, translations: customTranslations }) => {
+const AccessibilityProvider = ({ children, translations: customTranslations, }) => {
     const [state, setState] = useState({
-        language: 'en',
+        language: "en",
         textSize: 100,
         highContrast: false,
         negativeContrast: false,
@@ -49,48 +49,60 @@ const AccessibilityProvider = ({ children, translations: customTranslations }) =
     useEffect(() => {
         const root = document.documentElement;
         root.style.fontSize = `${state.textSize}%`;
-        root.classList.toggle('high-contrast', state.highContrast);
-        root.classList.toggle('negative-contrast', state.negativeContrast);
-        root.classList.toggle('light-background', state.lightBackground);
-        root.classList.toggle('underline-links', state.underlineLinks);
-        root.classList.toggle('readable-font', state.readableFont);
+        root.classList.toggle("high-contrast", state.highContrast);
+        root.classList.toggle("negative-contrast", state.negativeContrast);
+        root.classList.toggle("light-background", state.lightBackground);
+        root.classList.toggle("underline-links", state.underlineLinks);
+        root.classList.toggle("readable-font", state.readableFont);
     }, [state]);
     useEffect(() => {
-        if (!state.voiceEnabled || !('webkitSpeechRecognition' in window || 'SpeechRecognition' in window))
+        if (!state.voiceEnabled ||
+            !("webkitSpeechRecognition" in window || "SpeechRecognition" in window))
             return;
-        const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
+        const SpeechRecognition = window.SpeechRecognition ||
+            window.webkitSpeechRecognition;
         const recognition = new SpeechRecognition();
         recognition.continuous = true;
-        recognition.lang = state.language === 'tl' ? 'tl-PH' : state.language === 'ceb' ? 'ceb-PH' : 'en-US';
+        recognition.lang =
+            state.language === "tl"
+                ? "tl-PH"
+                : state.language === "ceb"
+                    ? "ceb-PH"
+                    : "en-US";
         recognition.onresult = (event) => {
             const transcript = event.results[event.results.length - 1][0].transcript.toLowerCase();
-            if (transcript.includes('increase text') || transcript.includes('palakihin'))
+            if (transcript.includes("increase text") ||
+                transcript.includes("palakihin"))
                 increaseText();
-            if (transcript.includes('decrease text') || transcript.includes('paliitin'))
+            if (transcript.includes("decrease text") ||
+                transcript.includes("paliitin"))
                 decreaseText();
-            if (transcript.includes('high contrast') || transcript.includes('mataas'))
+            if (transcript.includes("high contrast") || transcript.includes("mataas"))
                 toggleHighContrast();
-            if (transcript.includes('negative contrast') || transcript.includes('negatibo'))
+            if (transcript.includes("negative contrast") ||
+                transcript.includes("negatibo"))
                 toggleNegativeContrast();
-            if (transcript.includes('light background') || transcript.includes('maliwanag'))
+            if (transcript.includes("light background") ||
+                transcript.includes("maliwanag"))
                 toggleLightBackground();
-            if (transcript.includes('underline') || transcript.includes('guhit'))
+            if (transcript.includes("underline") || transcript.includes("guhit"))
                 toggleUnderlineLinks();
-            if (transcript.includes('readable font') || transcript.includes('madaling'))
+            if (transcript.includes("readable font") ||
+                transcript.includes("madaling"))
                 toggleReadableFont();
         };
         recognition.start();
         return () => recognition.stop();
     }, [state.voiceEnabled, state.language]);
-    const setLanguage = (lang) => setState(s => (Object.assign(Object.assign({}, s), { language: lang })));
-    const increaseText = () => setState(s => (Object.assign(Object.assign({}, s), { textSize: Math.min(s.textSize + 10, 200) })));
-    const decreaseText = () => setState(s => (Object.assign(Object.assign({}, s), { textSize: Math.max(s.textSize - 10, 80) })));
-    const toggleHighContrast = () => setState(s => (Object.assign(Object.assign({}, s), { highContrast: !s.highContrast, negativeContrast: false })));
-    const toggleNegativeContrast = () => setState(s => (Object.assign(Object.assign({}, s), { negativeContrast: !s.negativeContrast, highContrast: false })));
-    const toggleLightBackground = () => setState(s => (Object.assign(Object.assign({}, s), { lightBackground: !s.lightBackground })));
-    const toggleUnderlineLinks = () => setState(s => (Object.assign(Object.assign({}, s), { underlineLinks: !s.underlineLinks })));
-    const toggleReadableFont = () => setState(s => (Object.assign(Object.assign({}, s), { readableFont: !s.readableFont })));
-    const toggleVoice = () => setState(s => (Object.assign(Object.assign({}, s), { voiceEnabled: !s.voiceEnabled })));
+    const setLanguage = (lang) => setState((s) => (Object.assign(Object.assign({}, s), { language: lang })));
+    const increaseText = () => setState((s) => (Object.assign(Object.assign({}, s), { textSize: Math.min(s.textSize + 10, 200) })));
+    const decreaseText = () => setState((s) => (Object.assign(Object.assign({}, s), { textSize: Math.max(s.textSize - 10, 80) })));
+    const toggleHighContrast = () => setState((s) => (Object.assign(Object.assign({}, s), { highContrast: !s.highContrast, negativeContrast: false })));
+    const toggleNegativeContrast = () => setState((s) => (Object.assign(Object.assign({}, s), { negativeContrast: !s.negativeContrast, highContrast: false })));
+    const toggleLightBackground = () => setState((s) => (Object.assign(Object.assign({}, s), { lightBackground: !s.lightBackground })));
+    const toggleUnderlineLinks = () => setState((s) => (Object.assign(Object.assign({}, s), { underlineLinks: !s.underlineLinks })));
+    const toggleReadableFont = () => setState((s) => (Object.assign(Object.assign({}, s), { readableFont: !s.readableFont })));
+    const toggleVoice = () => setState((s) => (Object.assign(Object.assign({}, s), { voiceEnabled: !s.voiceEnabled })));
     const translate = (key) => translations[state.language][key];
     const t = (key) => { var _a; return ((_a = allTranslations[state.language]) === null || _a === void 0 ? void 0 : _a[key]) || key; };
     return (React.createElement(AccessibilityContext.Provider, { value: Object.assign(Object.assign({}, state), { setLanguage,
@@ -108,61 +120,68 @@ const AccessibilityProvider = ({ children, translations: customTranslations }) =
 const useAccessibility = () => {
     const context = useContext(AccessibilityContext);
     if (!context)
-        throw new Error('useAccessibility must be used within AccessibilityProvider');
+        throw new Error("useAccessibility must be used within AccessibilityProvider");
     return context;
 };
-const AccessibilityToolbar = () => {
+const cn$1 = (...parts) => parts.filter(Boolean).join(" ");
+const AccessibilityToolbar = ({ className, style, classes, }) => {
     const { language, setLanguage, increaseText, decreaseText, toggleHighContrast, toggleNegativeContrast, toggleLightBackground, toggleUnderlineLinks, toggleReadableFont, toggleVoice, translate, highContrast, negativeContrast, lightBackground, underlineLinks, readableFont, voiceEnabled, } = useAccessibility();
-    return (React.createElement("div", { className: "accessibility-toolbar" },
-        React.createElement("select", { value: language, onChange: (e) => setLanguage(e.target.value) },
+    return (React.createElement("div", { className: cn$1("accessibility-toolbar", classes === null || classes === void 0 ? void 0 : classes.root, className), style: style },
+        React.createElement("select", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.select), value: language, onChange: (e) => setLanguage(e.target.value) },
             React.createElement("option", { value: "en" }, "English"),
             React.createElement("option", { value: "tl" }, "Tagalog"),
             React.createElement("option", { value: "ceb" }, "Cebuano")),
-        React.createElement("button", { onClick: increaseText },
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button), onClick: increaseText },
             "+ ",
-            translate('increaseText')),
-        React.createElement("button", { onClick: decreaseText },
+            translate("increaseText")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button), onClick: decreaseText },
             "- ",
-            translate('decreaseText')),
-        React.createElement("button", { onClick: toggleHighContrast, className: highContrast ? 'active' : '' }, translate('highContrast')),
-        React.createElement("button", { onClick: toggleNegativeContrast, className: negativeContrast ? 'active' : '' }, translate('negativeContrast')),
-        React.createElement("button", { onClick: toggleLightBackground, className: lightBackground ? 'active' : '' }, translate('lightBackground')),
-        React.createElement("button", { onClick: toggleUnderlineLinks, className: underlineLinks ? 'active' : '' }, translate('underlineLinks')),
-        React.createElement("button", { onClick: toggleReadableFont, className: readableFont ? 'active' : '' }, translate('readableFont')),
-        React.createElement("button", { onClick: toggleVoice, className: voiceEnabled ? 'active' : '' },
+            translate("decreaseText")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, highContrast && "active", highContrast && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": highContrast, onClick: toggleHighContrast }, translate("highContrast")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, negativeContrast && "active", negativeContrast && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": negativeContrast, onClick: toggleNegativeContrast }, translate("negativeContrast")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, lightBackground && "active", lightBackground && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": lightBackground, onClick: toggleLightBackground }, translate("lightBackground")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, underlineLinks && "active", underlineLinks && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": underlineLinks, onClick: toggleUnderlineLinks }, translate("underlineLinks")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, readableFont && "active", readableFont && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": readableFont, onClick: toggleReadableFont }, translate("readableFont")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, classes === null || classes === void 0 ? void 0 : classes.voiceButton, voiceEnabled && "active", voiceEnabled && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": voiceEnabled, onClick: toggleVoice },
             "\uD83C\uDFA4 ",
-            translate('voiceCommand'))));
+            translate("voiceCommand"))));
 };
-const AccessibilityDropdown = () => {
+const cn = (...parts) => parts.filter(Boolean).join(" ");
+const AccessibilityDropdown = ({ className, style, classes, triggerLabel = "♿ Accessibility", renderTrigger, }) => {
     const [isOpen, setIsOpen] = useState(false);
     const { language, setLanguage, increaseText, decreaseText, toggleHighContrast, toggleNegativeContrast, toggleLightBackground, toggleUnderlineLinks, toggleReadableFont, toggleVoice, translate, highContrast, negativeContrast, lightBackground, underlineLinks, readableFont, voiceEnabled, } = useAccessibility();
-    return (React.createElement("div", { className: "accessibility-dropdown" },
-        React.createElement("button", { className: "accessibility-dropdown-toggle", onClick: () => setIsOpen(!isOpen) }, "\u267F Accessibility"),
-        isOpen && (React.createElement("div", { className: "accessibility-dropdown-menu" },
-            React.createElement("div", { className: "accessibility-dropdown-section" },
-                React.createElement("label", null, "Language:"),
-                React.createElement("select", { value: language, onChange: (e) => setLanguage(e.target.value) },
+    const toggle = () => setIsOpen(!isOpen);
+    return (React.createElement("div", { className: cn("accessibility-dropdown", classes === null || classes === void 0 ? void 0 : classes.root, className), style: style },
+        renderTrigger ? (renderTrigger({
+            isOpen,
+            toggle,
+            className: cn("accessibility-dropdown-toggle", classes === null || classes === void 0 ? void 0 : classes.toggle),
+        })) : (React.createElement("button", { className: cn("accessibility-dropdown-toggle", classes === null || classes === void 0 ? void 0 : classes.toggle), onClick: toggle }, triggerLabel)),
+        isOpen && (React.createElement("div", { className: cn("accessibility-dropdown-menu", classes === null || classes === void 0 ? void 0 : classes.menu) },
+            React.createElement("div", { className: cn("accessibility-dropdown-section", classes === null || classes === void 0 ? void 0 : classes.section) },
+                React.createElement("label", { className: cn(classes === null || classes === void 0 ? void 0 : classes.label) }, "Language:"),
+                React.createElement("select", { className: cn(classes === null || classes === void 0 ? void 0 : classes.select), value: language, onChange: (e) => setLanguage(e.target.value) },
                     React.createElement("option", { value: "en" }, "English"),
                     React.createElement("option", { value: "tl" }, "Tagalog"),
                     React.createElement("option", { value: "ceb" }, "Cebuano"))),
-            React.createElement("div", { className: "accessibility-dropdown-section" },
-                React.createElement("button", { onClick: increaseText },
+            React.createElement("div", { className: cn("accessibility-dropdown-section", classes === null || classes === void 0 ? void 0 : classes.section) },
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button), onClick: increaseText },
                     "+ ",
-                    translate('increaseText')),
-                React.createElement("button", { onClick: decreaseText },
+                    translate("increaseText")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button), onClick: decreaseText },
                     "- ",
-                    translate('decreaseText'))),
-            React.createElement("div", { className: "accessibility-dropdown-section" },
-                React.createElement("button", { onClick: toggleHighContrast, className: highContrast ? 'active' : '' }, translate('highContrast')),
-                React.createElement("button", { onClick: toggleNegativeContrast, className: negativeContrast ? 'active' : '' }, translate('negativeContrast')),
-                React.createElement("button", { onClick: toggleLightBackground, className: lightBackground ? 'active' : '' }, translate('lightBackground')),
-                React.createElement("button", { onClick: toggleUnderlineLinks, className: underlineLinks ? 'active' : '' }, translate('underlineLinks')),
-                React.createElement("button", { onClick: toggleReadableFont, className: readableFont ? 'active' : '' }, translate('readableFont')),
-                React.createElement("button", { onClick: toggleVoice, className: voiceEnabled ? 'active' : '' },
+                    translate("decreaseText"))),
+            React.createElement("div", { className: cn("accessibility-dropdown-section", classes === null || classes === void 0 ? void 0 : classes.section) },
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, highContrast && "active", highContrast && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": highContrast, onClick: toggleHighContrast }, translate("highContrast")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, negativeContrast && "active", negativeContrast && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": negativeContrast, onClick: toggleNegativeContrast }, translate("negativeContrast")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, lightBackground && "active", lightBackground && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": lightBackground, onClick: toggleLightBackground }, translate("lightBackground")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, underlineLinks && "active", underlineLinks && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": underlineLinks, onClick: toggleUnderlineLinks }, translate("underlineLinks")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, readableFont && "active", readableFont && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": readableFont, onClick: toggleReadableFont }, translate("readableFont")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, classes === null || classes === void 0 ? void 0 : classes.voiceButton, voiceEnabled && "active", voiceEnabled && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": voiceEnabled, onClick: toggleVoice },
                     "\uD83C\uDFA4 ",
-                    translate('voiceCommand')))))));
+                    translate("voiceCommand")))))));
 };
 const T = ({ k, children }) => {

package/dist/index.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.esm.js","sources":["../src/translations.ts","../src/AccessibilityContext.tsx","../src/AccessibilityToolbar.tsx","../src/AccessibilityDropdown.tsx","../src/T.tsx"],"sourcesContent":["export const translations = {\n en: {\n increaseText: 'Increase Text',\n decreaseText: 'Decrease Text',\n highContrast: 'High Contrast',\n negativeContrast: 'Negative Contrast',\n lightBackground: 'Light Background',\n underlineLinks: 'Underline Links',\n readableFont: 'Readable Font',\n voiceCommand: 'Voice Command',\n },\n tl: {\n increaseText: 'Palakihin ang Teksto',\n decreaseText: 'Paliitin ang Teksto',\n highContrast: 'Mataas na Contrast',\n negativeContrast: 'Negatibong Contrast',\n lightBackground: 'Maliwanag na Background',\n underlineLinks: 'May Guhit na Links',\n readableFont: 'Madaling Basahin na Font',\n voiceCommand: 'Voice Command',\n },\n ceb: {\n increaseText: 'Padak-on ang Teksto',\n decreaseText: 'Pagamay-on ang Teksto',\n highContrast: 'Taas nga Contrast',\n negativeContrast: 'Negatibo nga Contrast',\n lightBackground: 'Hayag nga Background',\n underlineLinks: 'Linya sa Ubos sa Links',\n readableFont: 'Sayon Basahon nga Font',\n voiceCommand: 'Voice Command',\n },\n};\n\nexport type Language = keyof typeof translations;\nexport type TranslationKey = keyof typeof translations.en;\n","import React, { createContext, useContext, useState, useEffect, ReactNode } from 'react';\nimport { Language, translations, TranslationKey } from './translations';\n\ninterface AccessibilityState {\n language: Language;\n textSize: number;\n highContrast: boolean;\n negativeContrast: boolean;\n lightBackground: boolean;\n underlineLinks: boolean;\n readableFont: boolean;\n voiceEnabled: boolean;\n}\n\ninterface AccessibilityContextType extends AccessibilityState {\n setLanguage: (lang: Language) => void;\n increaseText: () => void;\n decreaseText: () => void;\n toggleHighContrast: () => void;\n toggleNegativeContrast: () => void;\n toggleLightBackground: () => void;\n toggleUnderlineLinks: () => void;\n toggleReadableFont: () => void;\n toggleVoice: () => void;\n translate: (key: TranslationKey) => string;\n t: (key: string) => string;\n}\n\nconst AccessibilityContext = createContext<AccessibilityContextType \| undefined>(undefined);\n\ninterface AccessibilityProviderProps {\n children: ReactNode;\n translations?: Record<string, Record<string, any>>;\n}\n\nexport const AccessibilityProvider: React.FC<AccessibilityProviderProps> = ({ children, translations: customTranslations }) => {\n const [state, setState] = useState<AccessibilityState>({\n language: 'en',\n textSize: 100,\n highContrast: false,\n negativeContrast: false,\n lightBackground: false,\n underlineLinks: false,\n readableFont: false,\n voiceEnabled: false,\n });\n\n const allTranslations = customTranslations \|\| translations;\n\n useEffect(() => {\n const root = document.documentElement;\n root.style.fontSize = `${state.textSize}%`;\n \n root.classList.toggle('high-contrast', state.highContrast);\n root.classList.toggle('negative-contrast', state.negativeContrast);\n root.classList.toggle('light-background', state.lightBackground);\n root.classList.toggle('underline-links', state.underlineLinks);\n root.classList.toggle('readable-font', state.readableFont);\n }, [state]);\n\n useEffect(() => {\n if (!state.voiceEnabled \|\| !('webkitSpeechRecognition' in window \|\| 'SpeechRecognition' in window)) return;\n\n const SpeechRecognition = (window as any).SpeechRecognition \|\| (window as any).webkitSpeechRecognition;\n const recognition = new SpeechRecognition();\n recognition.continuous = true;\n recognition.lang = state.language === 'tl' ? 'tl-PH' : state.language === 'ceb' ? 'ceb-PH' : 'en-US';\n\n recognition.onresult = (event: any) => {\n const transcript = event.results[event.results.length - 1][0].transcript.toLowerCase();\n \n if (transcript.includes('increase text') \|\| transcript.includes('palakihin')) increaseText();\n if (transcript.includes('decrease text') \|\| transcript.includes('paliitin')) decreaseText();\n if (transcript.includes('high contrast') \|\| transcript.includes('mataas')) toggleHighContrast();\n if (transcript.includes('negative contrast') \|\| transcript.includes('negatibo')) toggleNegativeContrast();\n if (transcript.includes('light background') \|\| transcript.includes('maliwanag')) toggleLightBackground();\n if (transcript.includes('underline') \|\| transcript.includes('guhit')) toggleUnderlineLinks();\n if (transcript.includes('readable font') \|\| transcript.includes('madaling')) toggleReadableFont();\n };\n\n recognition.start();\n return () => recognition.stop();\n }, [state.voiceEnabled, state.language]);\n\n const setLanguage = (lang: Language) => setState(s => ({ ...s, language: lang }));\n const increaseText = () => setState(s => ({ ...s, textSize: Math.min(s.textSize + 10, 200) }));\n const decreaseText = () => setState(s => ({ ...s, textSize: Math.max(s.textSize - 10, 80) }));\n const toggleHighContrast = () => setState(s => ({ ...s, highContrast: !s.highContrast, negativeContrast: false }));\n const toggleNegativeContrast = () => setState(s => ({ ...s, negativeContrast: !s.negativeContrast, highContrast: false }));\n const toggleLightBackground = () => setState(s => ({ ...s, lightBackground: !s.lightBackground }));\n const toggleUnderlineLinks = () => setState(s => ({ ...s, underlineLinks: !s.underlineLinks }));\n const toggleReadableFont = () => setState(s => ({ ...s, readableFont: !s.readableFont }));\n const toggleVoice = () => setState(s => ({ ...s, voiceEnabled: !s.voiceEnabled }));\n const translate = (key: TranslationKey) => translations[state.language][key];\n const t = (key: string) => allTranslations[state.language]?.[key] \|\| key;\n\n return (\n <AccessibilityContext.Provider value={{\n ...state,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n t,\n }}>\n {children}\n </AccessibilityContext.Provider>\n );\n};\n\nexport const useAccessibility = () => {\n const context = useContext(AccessibilityContext);\n if (!context) throw new Error('useAccessibility must be used within AccessibilityProvider');\n return context;\n};\n","import React from 'react';\nimport { useAccessibility } from './AccessibilityContext';\n\nexport const AccessibilityToolbar: React.FC = () => {\n const {\n language,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n highContrast,\n negativeContrast,\n lightBackground,\n underlineLinks,\n readableFont,\n voiceEnabled,\n } = useAccessibility();\n\n return (\n <div className=\"accessibility-toolbar\">\n <select value={language} onChange={(e) => setLanguage(e.target.value as any)}>\n <option value=\"en\">English</option>\n <option value=\"tl\">Tagalog</option>\n <option value=\"ceb\">Cebuano</option>\n </select>\n <button onClick={increaseText}>+ {translate('increaseText')}</button>\n <button onClick={decreaseText}>- {translate('decreaseText')}</button>\n <button onClick={toggleHighContrast} className={highContrast ? 'active' : ''}>\n {translate('highContrast')}\n </button>\n <button onClick={toggleNegativeContrast} className={negativeContrast ? 'active' : ''}>\n {translate('negativeContrast')}\n </button>\n <button onClick={toggleLightBackground} className={lightBackground ? 'active' : ''}>\n {translate('lightBackground')}\n </button>\n <button onClick={toggleUnderlineLinks} className={underlineLinks ? 'active' : ''}>\n {translate('underlineLinks')}\n </button>\n <button onClick={toggleReadableFont} className={readableFont ? 'active' : ''}>\n {translate('readableFont')}\n </button>\n <button onClick={toggleVoice} className={voiceEnabled ? 'active' : ''}>\n 🎤 {translate('voiceCommand')}\n </button>\n </div>\n );\n};\n","import React, { useState } from 'react';\nimport { useAccessibility } from './AccessibilityContext';\n\nexport const AccessibilityDropdown: React.FC = () => {\n const [isOpen, setIsOpen] = useState(false);\n const {\n language,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n highContrast,\n negativeContrast,\n lightBackground,\n underlineLinks,\n readableFont,\n voiceEnabled,\n } = useAccessibility();\n\n return (\n <div className=\"accessibility-dropdown\">\n <button \n className=\"accessibility-dropdown-toggle\"\n onClick={() => setIsOpen(!isOpen)}\n >\n ♿ Accessibility\n </button>\n \n {isOpen && (\n <div className=\"accessibility-dropdown-menu\">\n <div className=\"accessibility-dropdown-section\">\n <label>Language:</label>\n <select value={language} onChange={(e) => setLanguage(e.target.value as any)}>\n <option value=\"en\">English</option>\n <option value=\"tl\">Tagalog</option>\n <option value=\"ceb\">Cebuano</option>\n </select>\n </div>\n\n <div className=\"accessibility-dropdown-section\">\n <button onClick={increaseText}>+ {translate('increaseText')}</button>\n <button onClick={decreaseText}>- {translate('decreaseText')}</button>\n </div>\n\n <div className=\"accessibility-dropdown-section\">\n <button onClick={toggleHighContrast} className={highContrast ? 'active' : ''}>\n {translate('highContrast')}\n </button>\n <button onClick={toggleNegativeContrast} className={negativeContrast ? 'active' : ''}>\n {translate('negativeContrast')}\n </button>\n <button onClick={toggleLightBackground} className={lightBackground ? 'active' : ''}>\n {translate('lightBackground')}\n </button>\n <button onClick={toggleUnderlineLinks} className={underlineLinks ? 'active' : ''}>\n {translate('underlineLinks')}\n </button>\n <button onClick={toggleReadableFont} className={readableFont ? 'active' : ''}>\n {translate('readableFont')}\n </button>\n <button onClick={toggleVoice} className={voiceEnabled ? 'active' : ''}>\n 🎤 {translate('voiceCommand')}\n </button>\n </div>\n </div>\n )}\n </div>\n );\n};\n","import React from 'react';\nimport { useAccessibility } from './AccessibilityContext';\nimport { TranslationKey } from './translations';\n\ninterface TProps {\n k: TranslationKey \| string;\n children?: React.ReactNode;\n}\n\nexport const T: React.FC<TProps> = ({ k, children }) => {\n const { translate, language } = useAccessibility();\n \n if (children && typeof children === 'string') {\n return <>{children}</>;\n }\n \n return <>{translate(k as TranslationKey)}</>;\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"index.esm.js","sources":["../src/translations.ts","../src/AccessibilityContext.tsx","../src/AccessibilityToolbar.tsx","../src/AccessibilityDropdown.tsx","../src/T.tsx"],"sourcesContent":["export const translations = {\n en: {\n increaseText: 'Increase Text',\n decreaseText: 'Decrease Text',\n highContrast: 'High Contrast',\n negativeContrast: 'Negative Contrast',\n lightBackground: 'Light Background',\n underlineLinks: 'Underline Links',\n readableFont: 'Readable Font',\n voiceCommand: 'Voice Command',\n },\n tl: {\n increaseText: 'Palakihin ang Teksto',\n decreaseText: 'Paliitin ang Teksto',\n highContrast: 'Mataas na Contrast',\n negativeContrast: 'Negatibong Contrast',\n lightBackground: 'Maliwanag na Background',\n underlineLinks: 'May Guhit na Links',\n readableFont: 'Madaling Basahin na Font',\n voiceCommand: 'Voice Command',\n },\n ceb: {\n increaseText: 'Padak-on ang Teksto',\n decreaseText: 'Pagamay-on ang Teksto',\n highContrast: 'Taas nga Contrast',\n negativeContrast: 'Negatibo nga Contrast',\n lightBackground: 'Hayag nga Background',\n underlineLinks: 'Linya sa Ubos sa Links',\n readableFont: 'Sayon Basahon nga Font',\n voiceCommand: 'Voice Command',\n },\n};\n\nexport type Language = keyof typeof translations;\nexport type TranslationKey = keyof typeof translations.en;\n","import React, {\n createContext,\n useContext,\n useState,\n useEffect,\n ReactNode,\n} from \"react\";\nimport { Language, translations, TranslationKey } from \"./translations\";\n\ninterface AccessibilityState {\n language: Language;\n textSize: number;\n highContrast: boolean;\n negativeContrast: boolean;\n lightBackground: boolean;\n underlineLinks: boolean;\n readableFont: boolean;\n voiceEnabled: boolean;\n}\n\ninterface AccessibilityContextType extends AccessibilityState {\n setLanguage: (lang: Language) => void;\n increaseText: () => void;\n decreaseText: () => void;\n toggleHighContrast: () => void;\n toggleNegativeContrast: () => void;\n toggleLightBackground: () => void;\n toggleUnderlineLinks: () => void;\n toggleReadableFont: () => void;\n toggleVoice: () => void;\n translate: (key: TranslationKey) => string;\n t: (key: string) => string;\n}\n\nconst AccessibilityContext = createContext<\n AccessibilityContextType \| undefined\n>(undefined);\n\ninterface AccessibilityProviderProps {\n children: ReactNode;\n translations?: Partial<Record<Language, Record<string, string>>>;\n}\n\nexport const AccessibilityProvider: React.FC<AccessibilityProviderProps> = ({\n children,\n translations: customTranslations,\n}) => {\n const [state, setState] = useState<AccessibilityState>({\n language: \"en\",\n textSize: 100,\n highContrast: false,\n negativeContrast: false,\n lightBackground: false,\n underlineLinks: false,\n readableFont: false,\n voiceEnabled: false,\n });\n\n const allTranslations: Partial<Record<Language, Record<string, string>>> =\n customTranslations \|\| translations;\n\n useEffect(() => {\n const root = document.documentElement;\n root.style.fontSize = `${state.textSize}%`;\n\n root.classList.toggle(\"high-contrast\", state.highContrast);\n root.classList.toggle(\"negative-contrast\", state.negativeContrast);\n root.classList.toggle(\"light-background\", state.lightBackground);\n root.classList.toggle(\"underline-links\", state.underlineLinks);\n root.classList.toggle(\"readable-font\", state.readableFont);\n }, [state]);\n\n useEffect(() => {\n if (\n !state.voiceEnabled \|\|\n !(\"webkitSpeechRecognition\" in window \|\| \"SpeechRecognition\" in window)\n )\n return;\n\n const SpeechRecognition =\n (window as any).SpeechRecognition \|\|\n (window as any).webkitSpeechRecognition;\n const recognition = new SpeechRecognition();\n recognition.continuous = true;\n recognition.lang =\n state.language === \"tl\"\n ? \"tl-PH\"\n : state.language === \"ceb\"\n ? \"ceb-PH\"\n : \"en-US\";\n\n recognition.onresult = (event: any) => {\n const transcript =\n event.results[event.results.length - 1][0].transcript.toLowerCase();\n\n if (\n transcript.includes(\"increase text\") \|\|\n transcript.includes(\"palakihin\")\n )\n increaseText();\n if (\n transcript.includes(\"decrease text\") \|\|\n transcript.includes(\"paliitin\")\n )\n decreaseText();\n if (transcript.includes(\"high contrast\") \|\| transcript.includes(\"mataas\"))\n toggleHighContrast();\n if (\n transcript.includes(\"negative contrast\") \|\|\n transcript.includes(\"negatibo\")\n )\n toggleNegativeContrast();\n if (\n transcript.includes(\"light background\") \|\|\n transcript.includes(\"maliwanag\")\n )\n toggleLightBackground();\n if (transcript.includes(\"underline\") \|\| transcript.includes(\"guhit\"))\n toggleUnderlineLinks();\n if (\n transcript.includes(\"readable font\") \|\|\n transcript.includes(\"madaling\")\n )\n toggleReadableFont();\n };\n\n recognition.start();\n return () => recognition.stop();\n }, [state.voiceEnabled, state.language]);\n\n const setLanguage = (lang: Language) =>\n setState((s) => ({ ...s, language: lang }));\n const increaseText = () =>\n setState((s) => ({ ...s, textSize: Math.min(s.textSize + 10, 200) }));\n const decreaseText = () =>\n setState((s) => ({ ...s, textSize: Math.max(s.textSize - 10, 80) }));\n const toggleHighContrast = () =>\n setState((s) => ({\n ...s,\n highContrast: !s.highContrast,\n negativeContrast: false,\n }));\n const toggleNegativeContrast = () =>\n setState((s) => ({\n ...s,\n negativeContrast: !s.negativeContrast,\n highContrast: false,\n }));\n const toggleLightBackground = () =>\n setState((s) => ({ ...s, lightBackground: !s.lightBackground }));\n const toggleUnderlineLinks = () =>\n setState((s) => ({ ...s, underlineLinks: !s.underlineLinks }));\n const toggleReadableFont = () =>\n setState((s) => ({ ...s, readableFont: !s.readableFont }));\n const toggleVoice = () =>\n setState((s) => ({ ...s, voiceEnabled: !s.voiceEnabled }));\n const translate = (key: TranslationKey) => translations[state.language][key];\n const t = (key: string) => allTranslations[state.language]?.[key] \|\| key;\n\n return (\n <AccessibilityContext.Provider\n value={{\n ...state,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n t,\n }}\n >\n {children}\n </AccessibilityContext.Provider>\n );\n};\n\nexport const useAccessibility = () => {\n const context = useContext(AccessibilityContext);\n if (!context)\n throw new Error(\n \"useAccessibility must be used within AccessibilityProvider\",\n );\n return context;\n};\n","import React from \"react\";\nimport { useAccessibility } from \"./AccessibilityContext\";\n\nexport interface AccessibilityToolbarClasses {\n root?: string;\n select?: string;\n button?: string;\n activeButton?: string;\n voiceButton?: string;\n}\n\nexport interface AccessibilityToolbarProps {\n className?: string;\n style?: React.CSSProperties;\n classes?: AccessibilityToolbarClasses;\n}\n\nconst cn = (...parts: Array<string \| false \| undefined>) =>\n parts.filter(Boolean).join(\" \");\n\nexport const AccessibilityToolbar: React.FC<AccessibilityToolbarProps> = ({\n className,\n style,\n classes,\n}) => {\n const {\n language,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n highContrast,\n negativeContrast,\n lightBackground,\n underlineLinks,\n readableFont,\n voiceEnabled,\n } = useAccessibility();\n\n return (\n <div\n className={cn(\"accessibility-toolbar\", classes?.root, className)}\n style={style}\n >\n <select\n className={cn(classes?.select)}\n value={language}\n onChange={(e) => setLanguage(e.target.value as any)}\n >\n <option value=\"en\">English</option>\n <option value=\"tl\">Tagalog</option>\n <option value=\"ceb\">Cebuano</option>\n </select>\n <button className={cn(classes?.button)} onClick={increaseText}>\n + {translate(\"increaseText\")}\n </button>\n <button className={cn(classes?.button)} onClick={decreaseText}>\n - {translate(\"decreaseText\")}\n </button>\n <button\n className={cn(\n classes?.button,\n highContrast && \"active\",\n highContrast && classes?.activeButton,\n )}\n data-active={highContrast}\n onClick={toggleHighContrast}\n >\n {translate(\"highContrast\")}\n </button>\n <button\n className={cn(\n classes?.button,\n negativeContrast && \"active\",\n negativeContrast && classes?.activeButton,\n )}\n data-active={negativeContrast}\n onClick={toggleNegativeContrast}\n >\n {translate(\"negativeContrast\")}\n </button>\n <button\n className={cn(\n classes?.button,\n lightBackground && \"active\",\n lightBackground && classes?.activeButton,\n )}\n data-active={lightBackground}\n onClick={toggleLightBackground}\n >\n {translate(\"lightBackground\")}\n </button>\n <button\n className={cn(\n classes?.button,\n underlineLinks && \"active\",\n underlineLinks && classes?.activeButton,\n )}\n data-active={underlineLinks}\n onClick={toggleUnderlineLinks}\n >\n {translate(\"underlineLinks\")}\n </button>\n <button\n className={cn(\n classes?.button,\n readableFont && \"active\",\n readableFont && classes?.activeButton,\n )}\n data-active={readableFont}\n onClick={toggleReadableFont}\n >\n {translate(\"readableFont\")}\n </button>\n <button\n className={cn(\n classes?.button,\n classes?.voiceButton,\n voiceEnabled && \"active\",\n voiceEnabled && classes?.activeButton,\n )}\n data-active={voiceEnabled}\n onClick={toggleVoice}\n >\n 🎤 {translate(\"voiceCommand\")}\n </button>\n </div>\n );\n};\n","import React, { useState } from \"react\";\nimport { useAccessibility } from \"./AccessibilityContext\";\n\nexport interface AccessibilityDropdownClasses {\n root?: string;\n toggle?: string;\n menu?: string;\n section?: string;\n label?: string;\n select?: string;\n button?: string;\n activeButton?: string;\n voiceButton?: string;\n}\n\nexport interface AccessibilityDropdownProps {\n className?: string;\n style?: React.CSSProperties;\n classes?: AccessibilityDropdownClasses;\n triggerLabel?: React.ReactNode;\n renderTrigger?: (params: {\n isOpen: boolean;\n toggle: () => void;\n className: string;\n }) => React.ReactNode;\n}\n\nconst cn = (...parts: Array<string \| false \| undefined>) =>\n parts.filter(Boolean).join(\" \");\n\nexport const AccessibilityDropdown: React.FC<AccessibilityDropdownProps> = ({\n className,\n style,\n classes,\n triggerLabel = \"♿ Accessibility\",\n renderTrigger,\n}) => {\n const [isOpen, setIsOpen] = useState(false);\n const {\n language,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n highContrast,\n negativeContrast,\n lightBackground,\n underlineLinks,\n readableFont,\n voiceEnabled,\n } = useAccessibility();\n\n const toggle = () => setIsOpen(!isOpen);\n\n return (\n <div\n className={cn(\"accessibility-dropdown\", classes?.root, className)}\n style={style}\n >\n {renderTrigger ? (\n renderTrigger({\n isOpen,\n toggle,\n className: cn(\"accessibility-dropdown-toggle\", classes?.toggle),\n })\n ) : (\n <button\n className={cn(\"accessibility-dropdown-toggle\", classes?.toggle)}\n onClick={toggle}\n >\n {triggerLabel}\n </button>\n )}\n\n {isOpen && (\n <div className={cn(\"accessibility-dropdown-menu\", classes?.menu)}>\n <div\n className={cn(\"accessibility-dropdown-section\", classes?.section)}\n >\n <label className={cn(classes?.label)}>Language:</label>\n <select\n className={cn(classes?.select)}\n value={language}\n onChange={(e) => setLanguage(e.target.value as any)}\n >\n <option value=\"en\">English</option>\n <option value=\"tl\">Tagalog</option>\n <option value=\"ceb\">Cebuano</option>\n </select>\n </div>\n\n <div\n className={cn(\"accessibility-dropdown-section\", classes?.section)}\n >\n <button className={cn(classes?.button)} onClick={increaseText}>\n + {translate(\"increaseText\")}\n </button>\n <button className={cn(classes?.button)} onClick={decreaseText}>\n - {translate(\"decreaseText\")}\n </button>\n </div>\n\n <div\n className={cn(\"accessibility-dropdown-section\", classes?.section)}\n >\n <button\n className={cn(\n classes?.button,\n highContrast && \"active\",\n highContrast && classes?.activeButton,\n )}\n data-active={highContrast}\n onClick={toggleHighContrast}\n >\n {translate(\"highContrast\")}\n </button>\n <button\n className={cn(\n classes?.button,\n negativeContrast && \"active\",\n negativeContrast && classes?.activeButton,\n )}\n data-active={negativeContrast}\n onClick={toggleNegativeContrast}\n >\n {translate(\"negativeContrast\")}\n </button>\n <button\n className={cn(\n classes?.button,\n lightBackground && \"active\",\n lightBackground && classes?.activeButton,\n )}\n data-active={lightBackground}\n onClick={toggleLightBackground}\n >\n {translate(\"lightBackground\")}\n </button>\n <button\n className={cn(\n classes?.button,\n underlineLinks && \"active\",\n underlineLinks && classes?.activeButton,\n )}\n data-active={underlineLinks}\n onClick={toggleUnderlineLinks}\n >\n {translate(\"underlineLinks\")}\n </button>\n <button\n className={cn(\n classes?.button,\n readableFont && \"active\",\n readableFont && classes?.activeButton,\n )}\n data-active={readableFont}\n onClick={toggleReadableFont}\n >\n {translate(\"readableFont\")}\n </button>\n <button\n className={cn(\n classes?.button,\n classes?.voiceButton,\n voiceEnabled && \"active\",\n voiceEnabled && classes?.activeButton,\n )}\n data-active={voiceEnabled}\n onClick={toggleVoice}\n >\n 🎤 {translate(\"voiceCommand\")}\n </button>\n </div>\n </div>\n )}\n </div>\n );\n};\n","import React from 'react';\nimport { useAccessibility } from './AccessibilityContext';\nimport { TranslationKey } from './translations';\n\ninterface TProps {\n k: TranslationKey \| string;\n children?: React.ReactNode;\n}\n\nexport const T: React.FC<TProps> = ({ k, children }) => {\n const { translate, language } = useAccessibility();\n \n if (children && typeof children === 'string') {\n return <>{children}</>;\n }\n \n return <>{translate(k as TranslationKey)}</>;\n};\n"],"names":["cn"],"mappings":"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"}

package/dist/index.js CHANGED Viewed

@@ -36,9 +36,9 @@ const translations = {
 };
 const AccessibilityContext = React.createContext(undefined);
-const AccessibilityProvider = ({ children, translations: customTranslations }) => {
+const AccessibilityProvider = ({ children, translations: customTranslations, }) => {
     const [state, setState] = React.useState({
-        language: 'en',
+        language: "en",
         textSize: 100,
         highContrast: false,
         negativeContrast: false,
@@ -51,48 +51,60 @@ const AccessibilityProvider = ({ children, translations: customTranslations }) =
     React.useEffect(() => {
         const root = document.documentElement;
         root.style.fontSize = `${state.textSize}%`;
-        root.classList.toggle('high-contrast', state.highContrast);
-        root.classList.toggle('negative-contrast', state.negativeContrast);
-        root.classList.toggle('light-background', state.lightBackground);
-        root.classList.toggle('underline-links', state.underlineLinks);
-        root.classList.toggle('readable-font', state.readableFont);
+        root.classList.toggle("high-contrast", state.highContrast);
+        root.classList.toggle("negative-contrast", state.negativeContrast);
+        root.classList.toggle("light-background", state.lightBackground);
+        root.classList.toggle("underline-links", state.underlineLinks);
+        root.classList.toggle("readable-font", state.readableFont);
     }, [state]);
     React.useEffect(() => {
-        if (!state.voiceEnabled || !('webkitSpeechRecognition' in window || 'SpeechRecognition' in window))
+        if (!state.voiceEnabled ||
+            !("webkitSpeechRecognition" in window || "SpeechRecognition" in window))
             return;
-        const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
+        const SpeechRecognition = window.SpeechRecognition ||
+            window.webkitSpeechRecognition;
         const recognition = new SpeechRecognition();
         recognition.continuous = true;
-        recognition.lang = state.language === 'tl' ? 'tl-PH' : state.language === 'ceb' ? 'ceb-PH' : 'en-US';
+        recognition.lang =
+            state.language === "tl"
+                ? "tl-PH"
+                : state.language === "ceb"
+                    ? "ceb-PH"
+                    : "en-US";
         recognition.onresult = (event) => {
             const transcript = event.results[event.results.length - 1][0].transcript.toLowerCase();
-            if (transcript.includes('increase text') || transcript.includes('palakihin'))
+            if (transcript.includes("increase text") ||
+                transcript.includes("palakihin"))
                 increaseText();
-            if (transcript.includes('decrease text') || transcript.includes('paliitin'))
+            if (transcript.includes("decrease text") ||
+                transcript.includes("paliitin"))
                 decreaseText();
-            if (transcript.includes('high contrast') || transcript.includes('mataas'))
+            if (transcript.includes("high contrast") || transcript.includes("mataas"))
                 toggleHighContrast();
-            if (transcript.includes('negative contrast') || transcript.includes('negatibo'))
+            if (transcript.includes("negative contrast") ||
+                transcript.includes("negatibo"))
                 toggleNegativeContrast();
-            if (transcript.includes('light background') || transcript.includes('maliwanag'))
+            if (transcript.includes("light background") ||
+                transcript.includes("maliwanag"))
                 toggleLightBackground();
-            if (transcript.includes('underline') || transcript.includes('guhit'))
+            if (transcript.includes("underline") || transcript.includes("guhit"))
                 toggleUnderlineLinks();
-            if (transcript.includes('readable font') || transcript.includes('madaling'))
+            if (transcript.includes("readable font") ||
+                transcript.includes("madaling"))
                 toggleReadableFont();
         };
         recognition.start();
         return () => recognition.stop();
     }, [state.voiceEnabled, state.language]);
-    const setLanguage = (lang) => setState(s => (Object.assign(Object.assign({}, s), { language: lang })));
-    const increaseText = () => setState(s => (Object.assign(Object.assign({}, s), { textSize: Math.min(s.textSize + 10, 200) })));
-    const decreaseText = () => setState(s => (Object.assign(Object.assign({}, s), { textSize: Math.max(s.textSize - 10, 80) })));
-    const toggleHighContrast = () => setState(s => (Object.assign(Object.assign({}, s), { highContrast: !s.highContrast, negativeContrast: false })));
-    const toggleNegativeContrast = () => setState(s => (Object.assign(Object.assign({}, s), { negativeContrast: !s.negativeContrast, highContrast: false })));
-    const toggleLightBackground = () => setState(s => (Object.assign(Object.assign({}, s), { lightBackground: !s.lightBackground })));
-    const toggleUnderlineLinks = () => setState(s => (Object.assign(Object.assign({}, s), { underlineLinks: !s.underlineLinks })));
-    const toggleReadableFont = () => setState(s => (Object.assign(Object.assign({}, s), { readableFont: !s.readableFont })));
-    const toggleVoice = () => setState(s => (Object.assign(Object.assign({}, s), { voiceEnabled: !s.voiceEnabled })));
+    const setLanguage = (lang) => setState((s) => (Object.assign(Object.assign({}, s), { language: lang })));
+    const increaseText = () => setState((s) => (Object.assign(Object.assign({}, s), { textSize: Math.min(s.textSize + 10, 200) })));
+    const decreaseText = () => setState((s) => (Object.assign(Object.assign({}, s), { textSize: Math.max(s.textSize - 10, 80) })));
+    const toggleHighContrast = () => setState((s) => (Object.assign(Object.assign({}, s), { highContrast: !s.highContrast, negativeContrast: false })));
+    const toggleNegativeContrast = () => setState((s) => (Object.assign(Object.assign({}, s), { negativeContrast: !s.negativeContrast, highContrast: false })));
+    const toggleLightBackground = () => setState((s) => (Object.assign(Object.assign({}, s), { lightBackground: !s.lightBackground })));
+    const toggleUnderlineLinks = () => setState((s) => (Object.assign(Object.assign({}, s), { underlineLinks: !s.underlineLinks })));
+    const toggleReadableFont = () => setState((s) => (Object.assign(Object.assign({}, s), { readableFont: !s.readableFont })));
+    const toggleVoice = () => setState((s) => (Object.assign(Object.assign({}, s), { voiceEnabled: !s.voiceEnabled })));
     const translate = (key) => translations[state.language][key];
     const t = (key) => { var _a; return ((_a = allTranslations[state.language]) === null || _a === void 0 ? void 0 : _a[key]) || key; };
     return (React.createElement(AccessibilityContext.Provider, { value: Object.assign(Object.assign({}, state), { setLanguage,
@@ -110,61 +122,68 @@ const AccessibilityProvider = ({ children, translations: customTranslations }) =
 const useAccessibility = () => {
     const context = React.useContext(AccessibilityContext);
     if (!context)
-        throw new Error('useAccessibility must be used within AccessibilityProvider');
+        throw new Error("useAccessibility must be used within AccessibilityProvider");
     return context;
 };
-const AccessibilityToolbar = () => {
+const cn$1 = (...parts) => parts.filter(Boolean).join(" ");
+const AccessibilityToolbar = ({ className, style, classes, }) => {
     const { language, setLanguage, increaseText, decreaseText, toggleHighContrast, toggleNegativeContrast, toggleLightBackground, toggleUnderlineLinks, toggleReadableFont, toggleVoice, translate, highContrast, negativeContrast, lightBackground, underlineLinks, readableFont, voiceEnabled, } = useAccessibility();
-    return (React.createElement("div", { className: "accessibility-toolbar" },
-        React.createElement("select", { value: language, onChange: (e) => setLanguage(e.target.value) },
+    return (React.createElement("div", { className: cn$1("accessibility-toolbar", classes === null || classes === void 0 ? void 0 : classes.root, className), style: style },
+        React.createElement("select", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.select), value: language, onChange: (e) => setLanguage(e.target.value) },
             React.createElement("option", { value: "en" }, "English"),
             React.createElement("option", { value: "tl" }, "Tagalog"),
             React.createElement("option", { value: "ceb" }, "Cebuano")),
-        React.createElement("button", { onClick: increaseText },
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button), onClick: increaseText },
             "+ ",
-            translate('increaseText')),
-        React.createElement("button", { onClick: decreaseText },
+            translate("increaseText")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button), onClick: decreaseText },
             "- ",
-            translate('decreaseText')),
-        React.createElement("button", { onClick: toggleHighContrast, className: highContrast ? 'active' : '' }, translate('highContrast')),
-        React.createElement("button", { onClick: toggleNegativeContrast, className: negativeContrast ? 'active' : '' }, translate('negativeContrast')),
-        React.createElement("button", { onClick: toggleLightBackground, className: lightBackground ? 'active' : '' }, translate('lightBackground')),
-        React.createElement("button", { onClick: toggleUnderlineLinks, className: underlineLinks ? 'active' : '' }, translate('underlineLinks')),
-        React.createElement("button", { onClick: toggleReadableFont, className: readableFont ? 'active' : '' }, translate('readableFont')),
-        React.createElement("button", { onClick: toggleVoice, className: voiceEnabled ? 'active' : '' },
+            translate("decreaseText")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, highContrast && "active", highContrast && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": highContrast, onClick: toggleHighContrast }, translate("highContrast")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, negativeContrast && "active", negativeContrast && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": negativeContrast, onClick: toggleNegativeContrast }, translate("negativeContrast")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, lightBackground && "active", lightBackground && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": lightBackground, onClick: toggleLightBackground }, translate("lightBackground")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, underlineLinks && "active", underlineLinks && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": underlineLinks, onClick: toggleUnderlineLinks }, translate("underlineLinks")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, readableFont && "active", readableFont && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": readableFont, onClick: toggleReadableFont }, translate("readableFont")),
+        React.createElement("button", { className: cn$1(classes === null || classes === void 0 ? void 0 : classes.button, classes === null || classes === void 0 ? void 0 : classes.voiceButton, voiceEnabled && "active", voiceEnabled && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": voiceEnabled, onClick: toggleVoice },
             "\uD83C\uDFA4 ",
-            translate('voiceCommand'))));
+            translate("voiceCommand"))));
 };
-const AccessibilityDropdown = () => {
+const cn = (...parts) => parts.filter(Boolean).join(" ");
+const AccessibilityDropdown = ({ className, style, classes, triggerLabel = "♿ Accessibility", renderTrigger, }) => {
     const [isOpen, setIsOpen] = React.useState(false);
     const { language, setLanguage, increaseText, decreaseText, toggleHighContrast, toggleNegativeContrast, toggleLightBackground, toggleUnderlineLinks, toggleReadableFont, toggleVoice, translate, highContrast, negativeContrast, lightBackground, underlineLinks, readableFont, voiceEnabled, } = useAccessibility();
-    return (React.createElement("div", { className: "accessibility-dropdown" },
-        React.createElement("button", { className: "accessibility-dropdown-toggle", onClick: () => setIsOpen(!isOpen) }, "\u267F Accessibility"),
-        isOpen && (React.createElement("div", { className: "accessibility-dropdown-menu" },
-            React.createElement("div", { className: "accessibility-dropdown-section" },
-                React.createElement("label", null, "Language:"),
-                React.createElement("select", { value: language, onChange: (e) => setLanguage(e.target.value) },
+    const toggle = () => setIsOpen(!isOpen);
+    return (React.createElement("div", { className: cn("accessibility-dropdown", classes === null || classes === void 0 ? void 0 : classes.root, className), style: style },
+        renderTrigger ? (renderTrigger({
+            isOpen,
+            toggle,
+            className: cn("accessibility-dropdown-toggle", classes === null || classes === void 0 ? void 0 : classes.toggle),
+        })) : (React.createElement("button", { className: cn("accessibility-dropdown-toggle", classes === null || classes === void 0 ? void 0 : classes.toggle), onClick: toggle }, triggerLabel)),
+        isOpen && (React.createElement("div", { className: cn("accessibility-dropdown-menu", classes === null || classes === void 0 ? void 0 : classes.menu) },
+            React.createElement("div", { className: cn("accessibility-dropdown-section", classes === null || classes === void 0 ? void 0 : classes.section) },
+                React.createElement("label", { className: cn(classes === null || classes === void 0 ? void 0 : classes.label) }, "Language:"),
+                React.createElement("select", { className: cn(classes === null || classes === void 0 ? void 0 : classes.select), value: language, onChange: (e) => setLanguage(e.target.value) },
                     React.createElement("option", { value: "en" }, "English"),
                     React.createElement("option", { value: "tl" }, "Tagalog"),
                     React.createElement("option", { value: "ceb" }, "Cebuano"))),
-            React.createElement("div", { className: "accessibility-dropdown-section" },
-                React.createElement("button", { onClick: increaseText },
+            React.createElement("div", { className: cn("accessibility-dropdown-section", classes === null || classes === void 0 ? void 0 : classes.section) },
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button), onClick: increaseText },
                     "+ ",
-                    translate('increaseText')),
-                React.createElement("button", { onClick: decreaseText },
+                    translate("increaseText")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button), onClick: decreaseText },
                     "- ",
-                    translate('decreaseText'))),
-            React.createElement("div", { className: "accessibility-dropdown-section" },
-                React.createElement("button", { onClick: toggleHighContrast, className: highContrast ? 'active' : '' }, translate('highContrast')),
-                React.createElement("button", { onClick: toggleNegativeContrast, className: negativeContrast ? 'active' : '' }, translate('negativeContrast')),
-                React.createElement("button", { onClick: toggleLightBackground, className: lightBackground ? 'active' : '' }, translate('lightBackground')),
-                React.createElement("button", { onClick: toggleUnderlineLinks, className: underlineLinks ? 'active' : '' }, translate('underlineLinks')),
-                React.createElement("button", { onClick: toggleReadableFont, className: readableFont ? 'active' : '' }, translate('readableFont')),
-                React.createElement("button", { onClick: toggleVoice, className: voiceEnabled ? 'active' : '' },
+                    translate("decreaseText"))),
+            React.createElement("div", { className: cn("accessibility-dropdown-section", classes === null || classes === void 0 ? void 0 : classes.section) },
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, highContrast && "active", highContrast && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": highContrast, onClick: toggleHighContrast }, translate("highContrast")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, negativeContrast && "active", negativeContrast && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": negativeContrast, onClick: toggleNegativeContrast }, translate("negativeContrast")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, lightBackground && "active", lightBackground && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": lightBackground, onClick: toggleLightBackground }, translate("lightBackground")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, underlineLinks && "active", underlineLinks && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": underlineLinks, onClick: toggleUnderlineLinks }, translate("underlineLinks")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, readableFont && "active", readableFont && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": readableFont, onClick: toggleReadableFont }, translate("readableFont")),
+                React.createElement("button", { className: cn(classes === null || classes === void 0 ? void 0 : classes.button, classes === null || classes === void 0 ? void 0 : classes.voiceButton, voiceEnabled && "active", voiceEnabled && (classes === null || classes === void 0 ? void 0 : classes.activeButton)), "data-active": voiceEnabled, onClick: toggleVoice },
                     "\uD83C\uDFA4 ",
-                    translate('voiceCommand')))))));
+                    translate("voiceCommand")))))));
 };
 const T = ({ k, children }) => {

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../src/translations.ts","../src/AccessibilityContext.tsx","../src/AccessibilityToolbar.tsx","../src/AccessibilityDropdown.tsx","../src/T.tsx"],"sourcesContent":["export const translations = {\n en: {\n increaseText: 'Increase Text',\n decreaseText: 'Decrease Text',\n highContrast: 'High Contrast',\n negativeContrast: 'Negative Contrast',\n lightBackground: 'Light Background',\n underlineLinks: 'Underline Links',\n readableFont: 'Readable Font',\n voiceCommand: 'Voice Command',\n },\n tl: {\n increaseText: 'Palakihin ang Teksto',\n decreaseText: 'Paliitin ang Teksto',\n highContrast: 'Mataas na Contrast',\n negativeContrast: 'Negatibong Contrast',\n lightBackground: 'Maliwanag na Background',\n underlineLinks: 'May Guhit na Links',\n readableFont: 'Madaling Basahin na Font',\n voiceCommand: 'Voice Command',\n },\n ceb: {\n increaseText: 'Padak-on ang Teksto',\n decreaseText: 'Pagamay-on ang Teksto',\n highContrast: 'Taas nga Contrast',\n negativeContrast: 'Negatibo nga Contrast',\n lightBackground: 'Hayag nga Background',\n underlineLinks: 'Linya sa Ubos sa Links',\n readableFont: 'Sayon Basahon nga Font',\n voiceCommand: 'Voice Command',\n },\n};\n\nexport type Language = keyof typeof translations;\nexport type TranslationKey = keyof typeof translations.en;\n","import React, { createContext, useContext, useState, useEffect, ReactNode } from 'react';\nimport { Language, translations, TranslationKey } from './translations';\n\ninterface AccessibilityState {\n language: Language;\n textSize: number;\n highContrast: boolean;\n negativeContrast: boolean;\n lightBackground: boolean;\n underlineLinks: boolean;\n readableFont: boolean;\n voiceEnabled: boolean;\n}\n\ninterface AccessibilityContextType extends AccessibilityState {\n setLanguage: (lang: Language) => void;\n increaseText: () => void;\n decreaseText: () => void;\n toggleHighContrast: () => void;\n toggleNegativeContrast: () => void;\n toggleLightBackground: () => void;\n toggleUnderlineLinks: () => void;\n toggleReadableFont: () => void;\n toggleVoice: () => void;\n translate: (key: TranslationKey) => string;\n t: (key: string) => string;\n}\n\nconst AccessibilityContext = createContext<AccessibilityContextType \| undefined>(undefined);\n\ninterface AccessibilityProviderProps {\n children: ReactNode;\n translations?: Record<string, Record<string, any>>;\n}\n\nexport const AccessibilityProvider: React.FC<AccessibilityProviderProps> = ({ children, translations: customTranslations }) => {\n const [state, setState] = useState<AccessibilityState>({\n language: 'en',\n textSize: 100,\n highContrast: false,\n negativeContrast: false,\n lightBackground: false,\n underlineLinks: false,\n readableFont: false,\n voiceEnabled: false,\n });\n\n const allTranslations = customTranslations \|\| translations;\n\n useEffect(() => {\n const root = document.documentElement;\n root.style.fontSize = `${state.textSize}%`;\n \n root.classList.toggle('high-contrast', state.highContrast);\n root.classList.toggle('negative-contrast', state.negativeContrast);\n root.classList.toggle('light-background', state.lightBackground);\n root.classList.toggle('underline-links', state.underlineLinks);\n root.classList.toggle('readable-font', state.readableFont);\n }, [state]);\n\n useEffect(() => {\n if (!state.voiceEnabled \|\| !('webkitSpeechRecognition' in window \|\| 'SpeechRecognition' in window)) return;\n\n const SpeechRecognition = (window as any).SpeechRecognition \|\| (window as any).webkitSpeechRecognition;\n const recognition = new SpeechRecognition();\n recognition.continuous = true;\n recognition.lang = state.language === 'tl' ? 'tl-PH' : state.language === 'ceb' ? 'ceb-PH' : 'en-US';\n\n recognition.onresult = (event: any) => {\n const transcript = event.results[event.results.length - 1][0].transcript.toLowerCase();\n \n if (transcript.includes('increase text') \|\| transcript.includes('palakihin')) increaseText();\n if (transcript.includes('decrease text') \|\| transcript.includes('paliitin')) decreaseText();\n if (transcript.includes('high contrast') \|\| transcript.includes('mataas')) toggleHighContrast();\n if (transcript.includes('negative contrast') \|\| transcript.includes('negatibo')) toggleNegativeContrast();\n if (transcript.includes('light background') \|\| transcript.includes('maliwanag')) toggleLightBackground();\n if (transcript.includes('underline') \|\| transcript.includes('guhit')) toggleUnderlineLinks();\n if (transcript.includes('readable font') \|\| transcript.includes('madaling')) toggleReadableFont();\n };\n\n recognition.start();\n return () => recognition.stop();\n }, [state.voiceEnabled, state.language]);\n\n const setLanguage = (lang: Language) => setState(s => ({ ...s, language: lang }));\n const increaseText = () => setState(s => ({ ...s, textSize: Math.min(s.textSize + 10, 200) }));\n const decreaseText = () => setState(s => ({ ...s, textSize: Math.max(s.textSize - 10, 80) }));\n const toggleHighContrast = () => setState(s => ({ ...s, highContrast: !s.highContrast, negativeContrast: false }));\n const toggleNegativeContrast = () => setState(s => ({ ...s, negativeContrast: !s.negativeContrast, highContrast: false }));\n const toggleLightBackground = () => setState(s => ({ ...s, lightBackground: !s.lightBackground }));\n const toggleUnderlineLinks = () => setState(s => ({ ...s, underlineLinks: !s.underlineLinks }));\n const toggleReadableFont = () => setState(s => ({ ...s, readableFont: !s.readableFont }));\n const toggleVoice = () => setState(s => ({ ...s, voiceEnabled: !s.voiceEnabled }));\n const translate = (key: TranslationKey) => translations[state.language][key];\n const t = (key: string) => allTranslations[state.language]?.[key] \|\| key;\n\n return (\n <AccessibilityContext.Provider value={{\n ...state,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n t,\n }}>\n {children}\n </AccessibilityContext.Provider>\n );\n};\n\nexport const useAccessibility = () => {\n const context = useContext(AccessibilityContext);\n if (!context) throw new Error('useAccessibility must be used within AccessibilityProvider');\n return context;\n};\n","import React from 'react';\nimport { useAccessibility } from './AccessibilityContext';\n\nexport const AccessibilityToolbar: React.FC = () => {\n const {\n language,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n highContrast,\n negativeContrast,\n lightBackground,\n underlineLinks,\n readableFont,\n voiceEnabled,\n } = useAccessibility();\n\n return (\n <div className=\"accessibility-toolbar\">\n <select value={language} onChange={(e) => setLanguage(e.target.value as any)}>\n <option value=\"en\">English</option>\n <option value=\"tl\">Tagalog</option>\n <option value=\"ceb\">Cebuano</option>\n </select>\n <button onClick={increaseText}>+ {translate('increaseText')}</button>\n <button onClick={decreaseText}>- {translate('decreaseText')}</button>\n <button onClick={toggleHighContrast} className={highContrast ? 'active' : ''}>\n {translate('highContrast')}\n </button>\n <button onClick={toggleNegativeContrast} className={negativeContrast ? 'active' : ''}>\n {translate('negativeContrast')}\n </button>\n <button onClick={toggleLightBackground} className={lightBackground ? 'active' : ''}>\n {translate('lightBackground')}\n </button>\n <button onClick={toggleUnderlineLinks} className={underlineLinks ? 'active' : ''}>\n {translate('underlineLinks')}\n </button>\n <button onClick={toggleReadableFont} className={readableFont ? 'active' : ''}>\n {translate('readableFont')}\n </button>\n <button onClick={toggleVoice} className={voiceEnabled ? 'active' : ''}>\n 🎤 {translate('voiceCommand')}\n </button>\n </div>\n );\n};\n","import React, { useState } from 'react';\nimport { useAccessibility } from './AccessibilityContext';\n\nexport const AccessibilityDropdown: React.FC = () => {\n const [isOpen, setIsOpen] = useState(false);\n const {\n language,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n highContrast,\n negativeContrast,\n lightBackground,\n underlineLinks,\n readableFont,\n voiceEnabled,\n } = useAccessibility();\n\n return (\n <div className=\"accessibility-dropdown\">\n <button \n className=\"accessibility-dropdown-toggle\"\n onClick={() => setIsOpen(!isOpen)}\n >\n ♿ Accessibility\n </button>\n \n {isOpen && (\n <div className=\"accessibility-dropdown-menu\">\n <div className=\"accessibility-dropdown-section\">\n <label>Language:</label>\n <select value={language} onChange={(e) => setLanguage(e.target.value as any)}>\n <option value=\"en\">English</option>\n <option value=\"tl\">Tagalog</option>\n <option value=\"ceb\">Cebuano</option>\n </select>\n </div>\n\n <div className=\"accessibility-dropdown-section\">\n <button onClick={increaseText}>+ {translate('increaseText')}</button>\n <button onClick={decreaseText}>- {translate('decreaseText')}</button>\n </div>\n\n <div className=\"accessibility-dropdown-section\">\n <button onClick={toggleHighContrast} className={highContrast ? 'active' : ''}>\n {translate('highContrast')}\n </button>\n <button onClick={toggleNegativeContrast} className={negativeContrast ? 'active' : ''}>\n {translate('negativeContrast')}\n </button>\n <button onClick={toggleLightBackground} className={lightBackground ? 'active' : ''}>\n {translate('lightBackground')}\n </button>\n <button onClick={toggleUnderlineLinks} className={underlineLinks ? 'active' : ''}>\n {translate('underlineLinks')}\n </button>\n <button onClick={toggleReadableFont} className={readableFont ? 'active' : ''}>\n {translate('readableFont')}\n </button>\n <button onClick={toggleVoice} className={voiceEnabled ? 'active' : ''}>\n 🎤 {translate('voiceCommand')}\n </button>\n </div>\n </div>\n )}\n </div>\n );\n};\n","import React from 'react';\nimport { useAccessibility } from './AccessibilityContext';\nimport { TranslationKey } from './translations';\n\ninterface TProps {\n k: TranslationKey \| string;\n children?: React.ReactNode;\n}\n\nexport const T: React.FC<TProps> = ({ k, children }) => {\n const { translate, language } = useAccessibility();\n \n if (children && typeof children === 'string') {\n return <>{children}</>;\n }\n \n return <>{translate(k as TranslationKey)}</>;\n};\n"],"names":["createContext","useState","useEffect","useContext"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../src/translations.ts","../src/AccessibilityContext.tsx","../src/AccessibilityToolbar.tsx","../src/AccessibilityDropdown.tsx","../src/T.tsx"],"sourcesContent":["export const translations = {\n en: {\n increaseText: 'Increase Text',\n decreaseText: 'Decrease Text',\n highContrast: 'High Contrast',\n negativeContrast: 'Negative Contrast',\n lightBackground: 'Light Background',\n underlineLinks: 'Underline Links',\n readableFont: 'Readable Font',\n voiceCommand: 'Voice Command',\n },\n tl: {\n increaseText: 'Palakihin ang Teksto',\n decreaseText: 'Paliitin ang Teksto',\n highContrast: 'Mataas na Contrast',\n negativeContrast: 'Negatibong Contrast',\n lightBackground: 'Maliwanag na Background',\n underlineLinks: 'May Guhit na Links',\n readableFont: 'Madaling Basahin na Font',\n voiceCommand: 'Voice Command',\n },\n ceb: {\n increaseText: 'Padak-on ang Teksto',\n decreaseText: 'Pagamay-on ang Teksto',\n highContrast: 'Taas nga Contrast',\n negativeContrast: 'Negatibo nga Contrast',\n lightBackground: 'Hayag nga Background',\n underlineLinks: 'Linya sa Ubos sa Links',\n readableFont: 'Sayon Basahon nga Font',\n voiceCommand: 'Voice Command',\n },\n};\n\nexport type Language = keyof typeof translations;\nexport type TranslationKey = keyof typeof translations.en;\n","import React, {\n createContext,\n useContext,\n useState,\n useEffect,\n ReactNode,\n} from \"react\";\nimport { Language, translations, TranslationKey } from \"./translations\";\n\ninterface AccessibilityState {\n language: Language;\n textSize: number;\n highContrast: boolean;\n negativeContrast: boolean;\n lightBackground: boolean;\n underlineLinks: boolean;\n readableFont: boolean;\n voiceEnabled: boolean;\n}\n\ninterface AccessibilityContextType extends AccessibilityState {\n setLanguage: (lang: Language) => void;\n increaseText: () => void;\n decreaseText: () => void;\n toggleHighContrast: () => void;\n toggleNegativeContrast: () => void;\n toggleLightBackground: () => void;\n toggleUnderlineLinks: () => void;\n toggleReadableFont: () => void;\n toggleVoice: () => void;\n translate: (key: TranslationKey) => string;\n t: (key: string) => string;\n}\n\nconst AccessibilityContext = createContext<\n AccessibilityContextType \| undefined\n>(undefined);\n\ninterface AccessibilityProviderProps {\n children: ReactNode;\n translations?: Partial<Record<Language, Record<string, string>>>;\n}\n\nexport const AccessibilityProvider: React.FC<AccessibilityProviderProps> = ({\n children,\n translations: customTranslations,\n}) => {\n const [state, setState] = useState<AccessibilityState>({\n language: \"en\",\n textSize: 100,\n highContrast: false,\n negativeContrast: false,\n lightBackground: false,\n underlineLinks: false,\n readableFont: false,\n voiceEnabled: false,\n });\n\n const allTranslations: Partial<Record<Language, Record<string, string>>> =\n customTranslations \|\| translations;\n\n useEffect(() => {\n const root = document.documentElement;\n root.style.fontSize = `${state.textSize}%`;\n\n root.classList.toggle(\"high-contrast\", state.highContrast);\n root.classList.toggle(\"negative-contrast\", state.negativeContrast);\n root.classList.toggle(\"light-background\", state.lightBackground);\n root.classList.toggle(\"underline-links\", state.underlineLinks);\n root.classList.toggle(\"readable-font\", state.readableFont);\n }, [state]);\n\n useEffect(() => {\n if (\n !state.voiceEnabled \|\|\n !(\"webkitSpeechRecognition\" in window \|\| \"SpeechRecognition\" in window)\n )\n return;\n\n const SpeechRecognition =\n (window as any).SpeechRecognition \|\|\n (window as any).webkitSpeechRecognition;\n const recognition = new SpeechRecognition();\n recognition.continuous = true;\n recognition.lang =\n state.language === \"tl\"\n ? \"tl-PH\"\n : state.language === \"ceb\"\n ? \"ceb-PH\"\n : \"en-US\";\n\n recognition.onresult = (event: any) => {\n const transcript =\n event.results[event.results.length - 1][0].transcript.toLowerCase();\n\n if (\n transcript.includes(\"increase text\") \|\|\n transcript.includes(\"palakihin\")\n )\n increaseText();\n if (\n transcript.includes(\"decrease text\") \|\|\n transcript.includes(\"paliitin\")\n )\n decreaseText();\n if (transcript.includes(\"high contrast\") \|\| transcript.includes(\"mataas\"))\n toggleHighContrast();\n if (\n transcript.includes(\"negative contrast\") \|\|\n transcript.includes(\"negatibo\")\n )\n toggleNegativeContrast();\n if (\n transcript.includes(\"light background\") \|\|\n transcript.includes(\"maliwanag\")\n )\n toggleLightBackground();\n if (transcript.includes(\"underline\") \|\| transcript.includes(\"guhit\"))\n toggleUnderlineLinks();\n if (\n transcript.includes(\"readable font\") \|\|\n transcript.includes(\"madaling\")\n )\n toggleReadableFont();\n };\n\n recognition.start();\n return () => recognition.stop();\n }, [state.voiceEnabled, state.language]);\n\n const setLanguage = (lang: Language) =>\n setState((s) => ({ ...s, language: lang }));\n const increaseText = () =>\n setState((s) => ({ ...s, textSize: Math.min(s.textSize + 10, 200) }));\n const decreaseText = () =>\n setState((s) => ({ ...s, textSize: Math.max(s.textSize - 10, 80) }));\n const toggleHighContrast = () =>\n setState((s) => ({\n ...s,\n highContrast: !s.highContrast,\n negativeContrast: false,\n }));\n const toggleNegativeContrast = () =>\n setState((s) => ({\n ...s,\n negativeContrast: !s.negativeContrast,\n highContrast: false,\n }));\n const toggleLightBackground = () =>\n setState((s) => ({ ...s, lightBackground: !s.lightBackground }));\n const toggleUnderlineLinks = () =>\n setState((s) => ({ ...s, underlineLinks: !s.underlineLinks }));\n const toggleReadableFont = () =>\n setState((s) => ({ ...s, readableFont: !s.readableFont }));\n const toggleVoice = () =>\n setState((s) => ({ ...s, voiceEnabled: !s.voiceEnabled }));\n const translate = (key: TranslationKey) => translations[state.language][key];\n const t = (key: string) => allTranslations[state.language]?.[key] \|\| key;\n\n return (\n <AccessibilityContext.Provider\n value={{\n ...state,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n t,\n }}\n >\n {children}\n </AccessibilityContext.Provider>\n );\n};\n\nexport const useAccessibility = () => {\n const context = useContext(AccessibilityContext);\n if (!context)\n throw new Error(\n \"useAccessibility must be used within AccessibilityProvider\",\n );\n return context;\n};\n","import React from \"react\";\nimport { useAccessibility } from \"./AccessibilityContext\";\n\nexport interface AccessibilityToolbarClasses {\n root?: string;\n select?: string;\n button?: string;\n activeButton?: string;\n voiceButton?: string;\n}\n\nexport interface AccessibilityToolbarProps {\n className?: string;\n style?: React.CSSProperties;\n classes?: AccessibilityToolbarClasses;\n}\n\nconst cn = (...parts: Array<string \| false \| undefined>) =>\n parts.filter(Boolean).join(\" \");\n\nexport const AccessibilityToolbar: React.FC<AccessibilityToolbarProps> = ({\n className,\n style,\n classes,\n}) => {\n const {\n language,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n highContrast,\n negativeContrast,\n lightBackground,\n underlineLinks,\n readableFont,\n voiceEnabled,\n } = useAccessibility();\n\n return (\n <div\n className={cn(\"accessibility-toolbar\", classes?.root, className)}\n style={style}\n >\n <select\n className={cn(classes?.select)}\n value={language}\n onChange={(e) => setLanguage(e.target.value as any)}\n >\n <option value=\"en\">English</option>\n <option value=\"tl\">Tagalog</option>\n <option value=\"ceb\">Cebuano</option>\n </select>\n <button className={cn(classes?.button)} onClick={increaseText}>\n + {translate(\"increaseText\")}\n </button>\n <button className={cn(classes?.button)} onClick={decreaseText}>\n - {translate(\"decreaseText\")}\n </button>\n <button\n className={cn(\n classes?.button,\n highContrast && \"active\",\n highContrast && classes?.activeButton,\n )}\n data-active={highContrast}\n onClick={toggleHighContrast}\n >\n {translate(\"highContrast\")}\n </button>\n <button\n className={cn(\n classes?.button,\n negativeContrast && \"active\",\n negativeContrast && classes?.activeButton,\n )}\n data-active={negativeContrast}\n onClick={toggleNegativeContrast}\n >\n {translate(\"negativeContrast\")}\n </button>\n <button\n className={cn(\n classes?.button,\n lightBackground && \"active\",\n lightBackground && classes?.activeButton,\n )}\n data-active={lightBackground}\n onClick={toggleLightBackground}\n >\n {translate(\"lightBackground\")}\n </button>\n <button\n className={cn(\n classes?.button,\n underlineLinks && \"active\",\n underlineLinks && classes?.activeButton,\n )}\n data-active={underlineLinks}\n onClick={toggleUnderlineLinks}\n >\n {translate(\"underlineLinks\")}\n </button>\n <button\n className={cn(\n classes?.button,\n readableFont && \"active\",\n readableFont && classes?.activeButton,\n )}\n data-active={readableFont}\n onClick={toggleReadableFont}\n >\n {translate(\"readableFont\")}\n </button>\n <button\n className={cn(\n classes?.button,\n classes?.voiceButton,\n voiceEnabled && \"active\",\n voiceEnabled && classes?.activeButton,\n )}\n data-active={voiceEnabled}\n onClick={toggleVoice}\n >\n 🎤 {translate(\"voiceCommand\")}\n </button>\n </div>\n );\n};\n","import React, { useState } from \"react\";\nimport { useAccessibility } from \"./AccessibilityContext\";\n\nexport interface AccessibilityDropdownClasses {\n root?: string;\n toggle?: string;\n menu?: string;\n section?: string;\n label?: string;\n select?: string;\n button?: string;\n activeButton?: string;\n voiceButton?: string;\n}\n\nexport interface AccessibilityDropdownProps {\n className?: string;\n style?: React.CSSProperties;\n classes?: AccessibilityDropdownClasses;\n triggerLabel?: React.ReactNode;\n renderTrigger?: (params: {\n isOpen: boolean;\n toggle: () => void;\n className: string;\n }) => React.ReactNode;\n}\n\nconst cn = (...parts: Array<string \| false \| undefined>) =>\n parts.filter(Boolean).join(\" \");\n\nexport const AccessibilityDropdown: React.FC<AccessibilityDropdownProps> = ({\n className,\n style,\n classes,\n triggerLabel = \"♿ Accessibility\",\n renderTrigger,\n}) => {\n const [isOpen, setIsOpen] = useState(false);\n const {\n language,\n setLanguage,\n increaseText,\n decreaseText,\n toggleHighContrast,\n toggleNegativeContrast,\n toggleLightBackground,\n toggleUnderlineLinks,\n toggleReadableFont,\n toggleVoice,\n translate,\n highContrast,\n negativeContrast,\n lightBackground,\n underlineLinks,\n readableFont,\n voiceEnabled,\n } = useAccessibility();\n\n const toggle = () => setIsOpen(!isOpen);\n\n return (\n <div\n className={cn(\"accessibility-dropdown\", classes?.root, className)}\n style={style}\n >\n {renderTrigger ? (\n renderTrigger({\n isOpen,\n toggle,\n className: cn(\"accessibility-dropdown-toggle\", classes?.toggle),\n })\n ) : (\n <button\n className={cn(\"accessibility-dropdown-toggle\", classes?.toggle)}\n onClick={toggle}\n >\n {triggerLabel}\n </button>\n )}\n\n {isOpen && (\n <div className={cn(\"accessibility-dropdown-menu\", classes?.menu)}>\n <div\n className={cn(\"accessibility-dropdown-section\", classes?.section)}\n >\n <label className={cn(classes?.label)}>Language:</label>\n <select\n className={cn(classes?.select)}\n value={language}\n onChange={(e) => setLanguage(e.target.value as any)}\n >\n <option value=\"en\">English</option>\n <option value=\"tl\">Tagalog</option>\n <option value=\"ceb\">Cebuano</option>\n </select>\n </div>\n\n <div\n className={cn(\"accessibility-dropdown-section\", classes?.section)}\n >\n <button className={cn(classes?.button)} onClick={increaseText}>\n + {translate(\"increaseText\")}\n </button>\n <button className={cn(classes?.button)} onClick={decreaseText}>\n - {translate(\"decreaseText\")}\n </button>\n </div>\n\n <div\n className={cn(\"accessibility-dropdown-section\", classes?.section)}\n >\n <button\n className={cn(\n classes?.button,\n highContrast && \"active\",\n highContrast && classes?.activeButton,\n )}\n data-active={highContrast}\n onClick={toggleHighContrast}\n >\n {translate(\"highContrast\")}\n </button>\n <button\n className={cn(\n classes?.button,\n negativeContrast && \"active\",\n negativeContrast && classes?.activeButton,\n )}\n data-active={negativeContrast}\n onClick={toggleNegativeContrast}\n >\n {translate(\"negativeContrast\")}\n </button>\n <button\n className={cn(\n classes?.button,\n lightBackground && \"active\",\n lightBackground && classes?.activeButton,\n )}\n data-active={lightBackground}\n onClick={toggleLightBackground}\n >\n {translate(\"lightBackground\")}\n </button>\n <button\n className={cn(\n classes?.button,\n underlineLinks && \"active\",\n underlineLinks && classes?.activeButton,\n )}\n data-active={underlineLinks}\n onClick={toggleUnderlineLinks}\n >\n {translate(\"underlineLinks\")}\n </button>\n <button\n className={cn(\n classes?.button,\n readableFont && \"active\",\n readableFont && classes?.activeButton,\n )}\n data-active={readableFont}\n onClick={toggleReadableFont}\n >\n {translate(\"readableFont\")}\n </button>\n <button\n className={cn(\n classes?.button,\n classes?.voiceButton,\n voiceEnabled && \"active\",\n voiceEnabled && classes?.activeButton,\n )}\n data-active={voiceEnabled}\n onClick={toggleVoice}\n >\n 🎤 {translate(\"voiceCommand\")}\n </button>\n </div>\n </div>\n )}\n </div>\n );\n};\n","import React from 'react';\nimport { useAccessibility } from './AccessibilityContext';\nimport { TranslationKey } from './translations';\n\ninterface TProps {\n k: TranslationKey \| string;\n children?: React.ReactNode;\n}\n\nexport const T: React.FC<TProps> = ({ k, children }) => {\n const { translate, language } = useAccessibility();\n \n if (children && typeof children === 'string') {\n return <>{children}</>;\n }\n \n return <>{translate(k as TranslationKey)}</>;\n};\n"],"names":["createContext","useState","useEffect","useContext","cn"],"mappings":"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"}

package/dist/styles.css CHANGED Viewed

@@ -1,30 +1,47 @@
+:root {
+  --ngp-a11y-gap: 8px;
+  --ngp-a11y-padding: 12px;
+  --ngp-a11y-radius: 4px;
+  --ngp-a11y-font-size: 14px;
+  --ngp-a11y-border: #ccc;
+  --ngp-a11y-bg: #f5f5f5;
+  --ngp-a11y-surface: #ffffff;
+  --ngp-a11y-surface-hover: #f5f5f5;
+  --ngp-a11y-text: #111111;
+  --ngp-a11y-accent: #007bff;
+  --ngp-a11y-accent-hover: #0056b3;
+  --ngp-a11y-accent-text: #ffffff;
+  --ngp-a11y-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+}
 .accessibility-toolbar {
   display: flex;
-  gap: 8px;
-  padding: 12px;
-  background: #f5f5f5;
-  border-bottom: 1px solid #ddd;
+  gap: var(--ngp-a11y-gap);
+  padding: var(--ngp-a11y-padding);
+  background: var(--ngp-a11y-bg);
+  border-bottom: 1px solid var(--ngp-a11y-border);
   flex-wrap: wrap;
 }
 .accessibility-toolbar button,
 .accessibility-toolbar select {
   padding: 8px 12px;
-  border: 1px solid #ccc;
-  background: white;
+  border: 1px solid var(--ngp-a11y-border);
+  background: var(--ngp-a11y-surface);
+  color: var(--ngp-a11y-text);
   cursor: pointer;
-  border-radius: 4px;
-  font-size: 14px;
+  border-radius: var(--ngp-a11y-radius);
+  font-size: var(--ngp-a11y-font-size);
 }
 .accessibility-toolbar button:hover {
-  background: #e9e9e9;
+  background: var(--ngp-a11y-surface-hover);
 }
 .accessibility-toolbar button.active {
-  background: #007bff;
-  color: white;
-  border-color: #007bff;
+  background: var(--ngp-a11y-accent);
+  color: var(--ngp-a11y-accent-text);
+  border-color: var(--ngp-a11y-accent);
 }
 /* Dropdown Styles */
@@ -35,17 +52,17 @@
 .accessibility-dropdown-toggle {
   padding: 10px 16px;
-  background: #007bff;
-  color: white;
+  background: var(--ngp-a11y-accent);
+  color: var(--ngp-a11y-accent-text);
   border: none;
-  border-radius: 4px;
+  border-radius: var(--ngp-a11y-radius);
   cursor: pointer;
   font-size: 16px;
   font-weight: 500;
 }
 .accessibility-dropdown-toggle:hover {
-  background: #0056b3;
+  background: var(--ngp-a11y-accent-hover);
 }
 .accessibility-dropdown-menu {
@@ -53,10 +70,10 @@
   top: 100%;
   right: 0;
   margin-top: 8px;
-  background: white;
-  border: 1px solid #ddd;
-  border-radius: 4px;
-  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
+  background: var(--ngp-a11y-surface);
+  border: 1px solid var(--ngp-a11y-border);
+  border-radius: var(--ngp-a11y-radius);
+  box-shadow: var(--ngp-a11y-shadow);
   min-width: 280px;
   z-index: 1000;
   padding: 12px;
@@ -65,9 +82,9 @@
 .accessibility-dropdown-section {
   display: flex;
   flex-direction: column;
-  gap: 8px;
+  gap: var(--ngp-a11y-gap);
   padding: 8px 0;
-  border-bottom: 1px solid #eee;
+  border-bottom: 1px solid var(--ngp-a11y-border);
 }
 .accessibility-dropdown-section:last-child {
@@ -83,22 +100,23 @@
 .accessibility-dropdown-section button,
 .accessibility-dropdown-section select {
   padding: 8px 12px;
-  border: 1px solid #ccc;
-  background: white;
+  border: 1px solid var(--ngp-a11y-border);
+  background: var(--ngp-a11y-surface);
+  color: var(--ngp-a11y-text);
   cursor: pointer;
-  border-radius: 4px;
-  font-size: 14px;
+  border-radius: var(--ngp-a11y-radius);
+  font-size: var(--ngp-a11y-font-size);
   text-align: left;
 }
 .accessibility-dropdown-section button:hover {
-  background: #f5f5f5;
+  background: var(--ngp-a11y-surface-hover);
 }
 .accessibility-dropdown-section button.active {
-  background: #007bff;
-  color: white;
-  border-color: #007bff;
+  background: var(--ngp-a11y-accent);
+  color: var(--ngp-a11y-accent-text);
+  border-color: var(--ngp-a11y-accent);
 }
 .high-contrast {
@@ -121,7 +139,7 @@
 .readable-font,
 .readable-font * {
-  font-family: 'Arial', 'Helvetica', sans-serif !important;
+  font-family: "Arial", "Helvetica", sans-serif !important;
   letter-spacing: 0.05em !important;
   line-height: 1.6 !important;
 }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "ngp-accessibility",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "React accessibility package with translation, text sizing, contrast modes, and voice commands",
   "author": {
     "name": "Rodolfo Miclat Jr."