@pigmilcom/a11y 1.0.9 → 1.1.0
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.
Potentially problematic release.
This version of @pigmilcom/a11y might be problematic. Click here for more details.
- package/README.md +107 -18
- package/dist/a11y.cdn.js +28 -9
- package/dist/index.css +23 -4
- package/dist/index.js +74 -9
- package/dist/index.min.css +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.mjs +1 -1
- package/dist/index.mjs +72 -8
- package/package.json +1 -1
- package/src/cdn.jsx +2 -2
package/dist/index.css
CHANGED
|
@@ -69,9 +69,11 @@ accessibility class rules that get toggled on <html> by the widget.
|
|
|
69
69
|
z-index: 9999;
|
|
70
70
|
width: clamp(280px,90vw,360px);
|
|
71
71
|
transform: translate(-50%,-50%);
|
|
72
|
-
border: 1px solid rgba(255,255,255,0.
|
|
72
|
+
border: 1px solid rgba(255,255,255,0.12);
|
|
73
73
|
background: rgba(4,6,10,0.98);
|
|
74
|
-
box-shadow: 0 25px 50px -12px rgba(0,0,0,0.
|
|
74
|
+
box-shadow: 0 25px 50px -12px rgba(0,0,0,0.6);
|
|
75
|
+
border-radius: 0.625rem;
|
|
76
|
+
overflow: hidden;
|
|
75
77
|
}
|
|
76
78
|
@media (max-width: 480px) {
|
|
77
79
|
.pgm-dialog { width: calc(100vw - 2rem); }
|
|
@@ -185,6 +187,23 @@ accessibility class rules that get toggled on <html> by the widget.
|
|
|
185
187
|
.pgm-toggle-list {
|
|
186
188
|
max-height: min(50vh,340px);
|
|
187
189
|
overflow-y: auto;
|
|
190
|
+
/* Modern slim scrollbar — Firefox */
|
|
191
|
+
scrollbar-width: thin;
|
|
192
|
+
scrollbar-color: rgba(255,255,255,0.12) transparent;
|
|
193
|
+
}
|
|
194
|
+
/* Modern slim scrollbar — Webkit (Chrome / Safari / Edge) */
|
|
195
|
+
.pgm-toggle-list::-webkit-scrollbar {
|
|
196
|
+
width: 3px;
|
|
197
|
+
}
|
|
198
|
+
.pgm-toggle-list::-webkit-scrollbar-track {
|
|
199
|
+
background: transparent;
|
|
200
|
+
}
|
|
201
|
+
.pgm-toggle-list::-webkit-scrollbar-thumb {
|
|
202
|
+
background: rgba(255,255,255,0.14);
|
|
203
|
+
border-radius: 9999px;
|
|
204
|
+
}
|
|
205
|
+
.pgm-toggle-list::-webkit-scrollbar-thumb:hover {
|
|
206
|
+
background: rgba(255,255,255,0.28);
|
|
188
207
|
}
|
|
189
208
|
|
|
190
209
|
/* Toggle buttons */
|
|
@@ -227,7 +246,7 @@ accessibility class rules that get toggled on <html> by the widget.
|
|
|
227
246
|
line-height: 1;
|
|
228
247
|
letter-spacing: 0.04em;
|
|
229
248
|
transition: color 150ms;
|
|
230
|
-
color: rgba(255,255,255,0.
|
|
249
|
+
color: rgba(255,255,255,0.72);
|
|
231
250
|
}
|
|
232
251
|
.pgm-toggle-label--on { color: #eef1f8; }
|
|
233
252
|
.pgm-toggle-desc {
|
|
@@ -236,7 +255,7 @@ accessibility class rules that get toggled on <html> by the widget.
|
|
|
236
255
|
font-size: 0.52rem;
|
|
237
256
|
line-height: 1.375;
|
|
238
257
|
letter-spacing: 0.06em;
|
|
239
|
-
color: rgba(255,255,255,0.
|
|
258
|
+
color: rgba(255,255,255,0.38);
|
|
240
259
|
}
|
|
241
260
|
|
|
242
261
|
/* Pill toggle */
|
package/dist/index.js
CHANGED
|
@@ -20,14 +20,70 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
20
20
|
// src/index.js
|
|
21
21
|
var index_exports = {};
|
|
22
22
|
__export(index_exports, {
|
|
23
|
-
A11yWidget: () =>
|
|
24
|
-
|
|
23
|
+
A11yWidget: () => A11y,
|
|
24
|
+
a11y: () => A11y,
|
|
25
|
+
default: () => A11y
|
|
25
26
|
});
|
|
26
27
|
module.exports = __toCommonJS(index_exports);
|
|
27
28
|
|
|
28
29
|
// src/widget.jsx
|
|
29
30
|
var import_react = require("react");
|
|
30
31
|
var import_react_dom = require("react-dom");
|
|
32
|
+
|
|
33
|
+
// src/license.js
|
|
34
|
+
var _LRE = /^(localhost|127\.\d+\.\d+\.\d+|::1|\[::1\]|0\.0\.0\.0)$/i;
|
|
35
|
+
function _isLocalDev() {
|
|
36
|
+
try {
|
|
37
|
+
const { hostname: h, port: p } = location;
|
|
38
|
+
if (_LRE.test(h)) return true;
|
|
39
|
+
if (p && p !== "80" && p !== "443") return true;
|
|
40
|
+
return false;
|
|
41
|
+
} catch {
|
|
42
|
+
return true;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
var _CK = "_pgm_lc";
|
|
46
|
+
function _readCache() {
|
|
47
|
+
try {
|
|
48
|
+
const v = sessionStorage.getItem(_CK);
|
|
49
|
+
if (!v) return null;
|
|
50
|
+
const p = JSON.parse(v);
|
|
51
|
+
return Date.now() - (p._ts || 0) < 18e5 ? p : null;
|
|
52
|
+
} catch {
|
|
53
|
+
return null;
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
function _writeCache(result) {
|
|
57
|
+
try {
|
|
58
|
+
sessionStorage.setItem(_CK, JSON.stringify({ ...result, _ts: Date.now() }));
|
|
59
|
+
} catch {
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
var _mock = () => Promise.resolve({ ok: true, plan: "free", blocked: false });
|
|
63
|
+
async function validateLicense() {
|
|
64
|
+
const cached = _readCache();
|
|
65
|
+
if (cached) return { status: cached.status, plan: cached.plan };
|
|
66
|
+
if (_isLocalDev()) {
|
|
67
|
+
const result2 = { status: "dev", plan: "free" };
|
|
68
|
+
_writeCache(result2);
|
|
69
|
+
return result2;
|
|
70
|
+
}
|
|
71
|
+
const domain = typeof location !== "undefined" ? location.hostname.toLowerCase().replace(/^www\./, "") : "";
|
|
72
|
+
if (!domain) return { status: "error", plan: "free" };
|
|
73
|
+
let result;
|
|
74
|
+
try {
|
|
75
|
+
const data = await _mock();
|
|
76
|
+
if (!(data == null ? void 0 : data.ok)) result = { status: "error", plan: "free" };
|
|
77
|
+
else if (data.blocked) result = { status: "blocked", plan: data.plan || "free" };
|
|
78
|
+
else result = { status: "valid", plan: data.plan || "free" };
|
|
79
|
+
} catch {
|
|
80
|
+
result = { status: "error", plan: "free" };
|
|
81
|
+
}
|
|
82
|
+
_writeCache(result);
|
|
83
|
+
return result;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
// src/widget.jsx
|
|
31
87
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
88
|
var STORAGE_KEY = "pgm-a11y";
|
|
33
89
|
var DEFAULTS = {
|
|
@@ -152,15 +208,19 @@ var TOGGLES = [
|
|
|
152
208
|
] })
|
|
153
209
|
}
|
|
154
210
|
];
|
|
155
|
-
function
|
|
211
|
+
function A11y({ className }) {
|
|
156
212
|
const [open, setOpen] = (0, import_react.useState)(false);
|
|
157
213
|
const [prefs, setPrefs] = (0, import_react.useState)(DEFAULTS);
|
|
158
214
|
const [mounted, setMounted] = (0, import_react.useState)(false);
|
|
159
215
|
const [notice, setNotice] = (0, import_react.useState)(false);
|
|
216
|
+
const [license, setLicense] = (0, import_react.useState)({ status: "checking", plan: "free" });
|
|
160
217
|
const triggerRef = (0, import_react.useRef)(null);
|
|
161
218
|
(0, import_react.useEffect)(() => {
|
|
162
219
|
setMounted(true);
|
|
163
220
|
}, []);
|
|
221
|
+
(0, import_react.useEffect)(() => {
|
|
222
|
+
validateLicense().then(setLicense);
|
|
223
|
+
}, []);
|
|
164
224
|
(0, import_react.useEffect)(() => {
|
|
165
225
|
const saved = load();
|
|
166
226
|
setPrefs(saved);
|
|
@@ -174,6 +234,10 @@ function A11yWidget({ className }) {
|
|
|
174
234
|
document.addEventListener("keydown", onKey);
|
|
175
235
|
return () => document.removeEventListener("keydown", onKey);
|
|
176
236
|
}, [open]);
|
|
237
|
+
if (license.status === "checking" || license.status === "error" || license.status === "blocked") {
|
|
238
|
+
return null;
|
|
239
|
+
}
|
|
240
|
+
const isPro = license.plan === "pro";
|
|
177
241
|
const update = (patch) => {
|
|
178
242
|
setPrefs((prev) => {
|
|
179
243
|
const next = { ...prev, ...patch };
|
|
@@ -198,7 +262,7 @@ function A11yWidget({ className }) {
|
|
|
198
262
|
"aria-expanded": open,
|
|
199
263
|
"aria-haspopup": "dialog",
|
|
200
264
|
onClick: () => setOpen((v) => !v),
|
|
201
|
-
className: `pgm-btn${className ? ` ${className}` : ""}`,
|
|
265
|
+
className: `pgm-btn a11y-widget-btn${className ? ` ${className}` : ""}`,
|
|
202
266
|
children: [
|
|
203
267
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { viewBox: "0 0 24 24", className: "pgm-icon-lg", fill: "none", stroke: "currentColor", strokeWidth: 1.8, "aria-hidden": "true", children: [
|
|
204
268
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "5", r: "1.5", fill: "currentColor", stroke: "none" }),
|
|
@@ -224,7 +288,7 @@ function A11yWidget({ className }) {
|
|
|
224
288
|
role: "dialog",
|
|
225
289
|
"aria-modal": "true",
|
|
226
290
|
"aria-label": "Accessibility settings",
|
|
227
|
-
className: "pgm-dialog",
|
|
291
|
+
className: "pgm-dialog a11y-widget-dialog",
|
|
228
292
|
children: [
|
|
229
293
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pgm-header", children: [
|
|
230
294
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
@@ -268,7 +332,7 @@ function A11yWidget({ className }) {
|
|
|
268
332
|
role: "switch",
|
|
269
333
|
"aria-checked": on,
|
|
270
334
|
onClick: () => update({ [key]: !on }),
|
|
271
|
-
className: `pgm-toggle-btn${on ? " pgm-toggle-btn--on" : ""}`,
|
|
335
|
+
className: `pgm-toggle-btn a11y-widget-toggle-btn${on ? " pgm-toggle-btn--on" : ""}`,
|
|
272
336
|
children: [
|
|
273
337
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `pgm-toggle-icon${on ? " pgm-toggle-icon--on" : ""}`, children: icon }),
|
|
274
338
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "pgm-toggle-text", children: [
|
|
@@ -294,7 +358,7 @@ function A11yWidget({ className }) {
|
|
|
294
358
|
);
|
|
295
359
|
}) }),
|
|
296
360
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pgm-footer", children: [
|
|
297
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
361
|
+
!isPro && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
298
362
|
"button",
|
|
299
363
|
{
|
|
300
364
|
type: "button",
|
|
@@ -327,7 +391,7 @@ function A11yWidget({ className }) {
|
|
|
327
391
|
}
|
|
328
392
|
)
|
|
329
393
|
] }),
|
|
330
|
-
notice && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { id: "pgm-notice", className: "pgm-notice", children: [
|
|
394
|
+
!isPro && notice && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { id: "pgm-notice", className: "pgm-notice", children: [
|
|
331
395
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "pgm-notice-text", children: [
|
|
332
396
|
"This accessibility widget is provided free of charge by",
|
|
333
397
|
" ",
|
|
@@ -368,5 +432,6 @@ function A11yWidget({ className }) {
|
|
|
368
432
|
}
|
|
369
433
|
// Annotate the CommonJS export names for ESM import in node:
|
|
370
434
|
0 && (module.exports = {
|
|
371
|
-
A11yWidget
|
|
435
|
+
A11yWidget,
|
|
436
|
+
a11y
|
|
372
437
|
});
|
package/dist/index.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.pgm-icon{width:1rem;height:1rem}.pgm-icon-lg{width:1.25rem;height:1.25rem}.pgm-icon-sm{width:0.875rem;height:0.875rem}.pgm-btn{position:relative;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border:1px solid rgba(255,255,255,0.1);background:rgba(4,6,10,0.85);color:rgba(255,255,255,0.6);box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -4px rgba(0,0,0,0.1);transition:border-color 200ms,color 200ms,background 200ms;cursor:pointer;border-radius:0.25rem;padding:0}.pgm-btn:hover{border-color:rgba(0,229,160,0.4);background:rgba(0,229,160,0.08);color:#00e5a0}.pgm-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #00e5a0}.pgm-dot{position:absolute;top:0.375rem;right:0.375rem;width:0.375rem;height:0.375rem;border-radius:9999px;background:#00e5a0}.pgm-backdrop{position:fixed;inset:0;z-index:9998;background:rgba(0,0,0,0.6);backdrop-filter:blur(4px)}.pgm-dialog{position:fixed;left:50%;top:50%;z-index:9999;width:clamp(280px,90vw,360px);transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,0.
|
|
1
|
+
.pgm-icon{width:1rem;height:1rem}.pgm-icon-lg{width:1.25rem;height:1.25rem}.pgm-icon-sm{width:0.875rem;height:0.875rem}.pgm-btn{position:relative;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border:1px solid rgba(255,255,255,0.1);background:rgba(4,6,10,0.85);color:rgba(255,255,255,0.6);box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -4px rgba(0,0,0,0.1);transition:border-color 200ms,color 200ms,background 200ms;cursor:pointer;border-radius:0.25rem;padding:0}.pgm-btn:hover{border-color:rgba(0,229,160,0.4);background:rgba(0,229,160,0.08);color:#00e5a0}.pgm-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #00e5a0}.pgm-dot{position:absolute;top:0.375rem;right:0.375rem;width:0.375rem;height:0.375rem;border-radius:9999px;background:#00e5a0}.pgm-backdrop{position:fixed;inset:0;z-index:9998;background:rgba(0,0,0,0.6);backdrop-filter:blur(4px)}.pgm-dialog{position:fixed;left:50%;top:50%;z-index:9999;width:clamp(280px,90vw,360px);transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,0.12);background:rgba(4,6,10,0.98);box-shadow:0 25px 50px -12px rgba(0,0,0,0.6);border-radius:0.625rem;overflow:hidden}@media (max-width:480px){.pgm-dialog{width:calc(100vw - 2rem)}}.pgm-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,0.07);padding:0.75rem 1rem}.pgm-header-title{font-size:0.72rem;font-weight:600;letter-spacing:0.1em;color:#eef1f8;text-transform:uppercase;margin:0}.pgm-header-subtitle{margin-top:0.125rem;margin-bottom:0;font-size:0.52rem;letter-spacing:0.12em;color:rgba(255,255,255,0.35);text-transform:uppercase}.pgm-close-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;color:rgba(255,255,255,0.3);transition:color 150ms;background:none;border:none;cursor:pointer;padding:0;flex-shrink:0}.pgm-close-btn:hover{color:rgba(255,255,255,0.8)}.pgm-close-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #00e5a0}.pgm-size-section{border-bottom:1px solid rgba(255,255,255,0.07);padding:0.75rem 1rem}.pgm-size-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.5rem}.pgm-size-label{font-size:0.6rem;letter-spacing:0.16em;color:rgba(255,255,255,0.5);text-transform:uppercase}.pgm-size-value{font-size:0.56rem;letter-spacing:0.12em;color:#00e5a0;text-transform:uppercase}.pgm-size-btns{display:flex;gap:0.375rem}.pgm-size-btn{flex:1;border:1px solid;padding:0.375rem 0;text-align:center;font-size:0.58rem;text-transform:uppercase;letter-spacing:0.1em;transition:background 150ms,border-color 150ms,color 150ms;background:none;cursor:pointer}.pgm-size-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #00e5a0}.pgm-size-btn--active{border-color:#00e5a0;background:rgba(0,229,160,0.1);color:#00e5a0}.pgm-size-btn--inactive{border-color:rgba(255,255,255,0.1);background:transparent;color:rgba(255,255,255,0.35)}.pgm-size-btn--inactive:hover{border-color:rgba(255,255,255,0.25);color:rgba(255,255,255,0.6)}.pgm-toggle-list{max-height:min(50vh,340px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.12) transparent}.pgm-toggle-list::-webkit-scrollbar{width:3px}.pgm-toggle-list::-webkit-scrollbar-track{background:transparent}.pgm-toggle-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.14);border-radius:9999px}.pgm-toggle-list::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.28)}.pgm-toggle-btn{display:flex;width:100%;align-items:center;gap:0.75rem;padding:0.625rem 1rem;text-align:left;transition:background 150ms;background:none;border:none;cursor:pointer}.pgm-toggle-btn:hover{background:rgba(255,255,255,0.03)}.pgm-toggle-btn:focus-visible{outline:none;box-shadow:inset 0 0 0 2px #00e5a0}.pgm-toggle-btn--on{background:rgba(0,229,160,0.04)}.pgm-toggle-icon{flex-shrink:0;transition:color 150ms;color:rgba(255,255,255,0.3)}.pgm-toggle-icon--on{color:#00e5a0}.pgm-toggle-btn:hover .pgm-toggle-icon:not(.pgm-toggle-icon--on){color:rgba(255,255,255,0.5)}.pgm-toggle-text{min-width:0;flex:1}.pgm-toggle-label{display:block;font-size:0.68rem;font-weight:500;line-height:1;letter-spacing:0.04em;transition:color 150ms;color:rgba(255,255,255,0.72)}.pgm-toggle-label--on{color:#eef1f8}.pgm-toggle-desc{margin-top:0.125rem;display:block;font-size:0.52rem;line-height:1.375;letter-spacing:0.06em;color:rgba(255,255,255,0.38)}.pgm-pill{position:relative;height:1rem;width:1.75rem;flex-shrink:0;border-radius:9999px;border:1px solid;transition:background 200ms,border-color 200ms}.pgm-pill--on{border-color:#00e5a0;background:rgba(0,229,160,0.2)}.pgm-pill--off{border-color:rgba(255,255,255,0.15);background:transparent}.pgm-pill-knob{position:absolute;top:0.125rem;height:0.75rem;width:0.75rem;border-radius:9999px;transition:left 200ms,background 200ms}.pgm-pill-knob--on{left:0.875rem;background:#00e5a0}.pgm-pill-knob--off{left:0.125rem;background:rgba(255,255,255,0.25)}.pgm-footer{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;border-top:1px solid rgba(255,255,255,0.07);padding:0.625rem 1rem}.pgm-reset-btn{font-size:0.56rem;text-transform:uppercase;letter-spacing:0.12em;color:rgba(255,255,255,0.3);text-underline-offset:0.125rem;transition:color 150ms;background:none;border:none;cursor:pointer;padding:0}.pgm-reset-btn:hover{color:#ff6b6b}.pgm-reset-btn:disabled{cursor:not-allowed;opacity:0.3}.pgm-reset-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #00e5a0}.pgm-notice-btn{display:flex;align-items:center;gap:0.375rem;background:none;border:none;cursor:pointer;color:rgba(255,255,255,0.25);font-size:0.5rem;text-transform:uppercase;letter-spacing:0.1em;padding:0;transition:color 150ms}.pgm-notice-btn:hover{color:rgba(255,255,255,0.55)}.pgm-notice-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #00e5a0;border-radius:2px}.pgm-notice-logo{width:0.875rem;height:0.875rem;border-radius:2px;flex-shrink:0}.pgm-notice-chevron{width:0.625rem;height:0.625rem;flex-shrink:0;transition:transform 200ms}.pgm-notice{border-top:1px solid rgba(255,255,255,0.07);padding:0.75rem 1rem 1rem;display:flex;flex-direction:column;gap:0.625rem}.pgm-notice-text{font-size:0.625rem;line-height:1.65;color:rgba(255,255,255,0.4);margin:0}.pgm-notice-link,.pgm-notice-gh{font-size:0.625rem;color:#00e5a0;text-decoration:none;transition:opacity 150ms}.pgm-notice-link:hover,.pgm-notice-gh:hover{opacity:0.75}.pgm-notice-gh{display:inline-flex;align-items:center;gap:0.3rem;font-size:0.56rem;text-transform:uppercase;letter-spacing:0.1em;font-weight:600}html.a11y-text-lg{font-size:118% !important}html.a11y-text-xl{font-size:145% !important}html.a11y-high-contrast body{--foreground:#ffffff;--background:#000000}html.a11y-invert img,html.a11y-invert video,html.a11y-invert canvas,html.a11y-invert svg:not([data-a11y-skip]){filter:invert(1) hue-rotate(180deg)}html.a11y-reduce-motion *,html.a11y-reduce-motion *::before,html.a11y-reduce-motion *::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}html.a11y-highlight-links a,html.a11y-highlight-links [role="link"]{text-decoration:underline !important;text-underline-offset:3px !important;outline:2px solid !important;outline-offset:2px !important}html.a11y-text-spacing *:not(input):not(textarea){letter-spacing:0.12em !important;word-spacing:0.18em !important;line-height:1.85 !important}html.a11y-adhd *,html.a11y-adhd *::before,html.a11y-adhd *::after{animation:none !important;transition:none !important}html.a11y-adhd:focus-visible{outline:3px solid #facc15 !important;outline-offset:3px !important;border-radius:2px !important}html.a11y-dyslexia,html.a11y-dyslexia *{font-family:'Arial','Verdana','Helvetica',sans-serif !important;word-spacing:0.22em !important;line-height:1.95 !important;letter-spacing:0.04em !important}
|
package/dist/index.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var u=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var A=Object.prototype.hasOwnProperty;var B=(t,a)=>{for(var i in a)u(t,i,{get:a[i],enumerable:!0})},E=(t,a,i,s)=>{if(a&&typeof a=="object"||typeof a=="function")for(let n of W(a))!A.call(t,n)&&n!==i&&u(t,n,{get:()=>a[n],enumerable:!(s=z(a,n))||s.enumerable});return t};var I=t=>E(u({},"__esModule",{value:!0}),t);var $={};B($,{A11yWidget:()=>p,default:()=>p});module.exports=I($);var l=require("react"),x=require("react-dom"),e=require("react/jsx-runtime"),N="pgm-a11y",c={textSize:0,highContrast:!1,invertColors:!1,grayscale:!1,reduceMotion:!1,highlightLinks:!1,textSpacing:!1,adhd:!1,dyslexia:!1};function v(t){let a=document.documentElement;a.classList.remove("a11y-text-lg","a11y-text-xl"),t.textSize===1&&a.classList.add("a11y-text-lg"),t.textSize===2&&a.classList.add("a11y-text-xl");let i={"a11y-high-contrast":t.highContrast,"a11y-invert":t.invertColors,"a11y-grayscale":t.grayscale,"a11y-reduce-motion":t.reduceMotion,"a11y-highlight-links":t.highlightLinks,"a11y-text-spacing":t.textSpacing,"a11y-adhd":t.adhd,"a11y-dyslexia":t.dyslexia};for(let[n,m]of Object.entries(i))a.classList.toggle(n,m);let s=[];t.invertColors&&s.push("invert(1) hue-rotate(180deg)"),t.highContrast&&s.push("contrast(1.6)"),t.grayscale&&s.push("grayscale(1)"),a.style.filter=s.join(" ")}function O(){try{let t=localStorage.getItem(N);return t?{...c,...JSON.parse(t)}:{...c}}catch{return{...c}}}function b(t){try{localStorage.setItem(N,JSON.stringify(t))}catch{}}var k=["Normal","Large","X-Large"],T=[{key:"highContrast",label:"High Contrast",desc:"Increase colour contrast for readability",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,e.jsx)("path",{d:"M12 2v20"}),(0,e.jsx)("path",{d:"M12 2a10 10 0 0 1 0 20",fill:"currentColor",stroke:"none"})]})},{key:"invertColors",label:"Invert Colors",desc:"Invert all page colours",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("path",{d:"M12 3v18M3 12h18"}),(0,e.jsx)("path",{d:"M12 3a9 9 0 0 1 0 18",fill:"currentColor",stroke:"none"})]})},{key:"grayscale",label:"Grayscale",desc:"Remove all colour from the page",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("circle",{cx:"12",cy:"12",r:"9"}),(0,e.jsx)("circle",{cx:"12",cy:"12",r:"4",fill:"currentColor",stroke:"none"})]})},{key:"reduceMotion",label:"Reduce Motion",desc:"Stop animations and transitions",icon:(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:(0,e.jsx)("path",{d:"M5 12h14M12 5l-7 7 7 7"})})},{key:"highlightLinks",label:"Highlight Links",desc:"Make all links visible at a glance",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("path",{d:"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"}),(0,e.jsx)("path",{d:"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"})]})},{key:"textSpacing",label:"Text Spacing",desc:"Increase letter, word & line spacing",icon:(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:(0,e.jsx)("path",{d:"M4 6h16M4 10h16M4 14h16M4 18h16"})})},{key:"adhd",label:"ADHD Friendly",desc:"Remove distractions, add focus ring",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("path",{d:"M12 2L2 7l10 5 10-5-10-5z"}),(0,e.jsx)("path",{d:"M2 17l10 5 10-5"}),(0,e.jsx)("path",{d:"M2 12l10 5 10-5"})]})},{key:"dyslexia",label:"Dyslexia Font",desc:"Switch to a high-readability typeface",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("path",{d:"M4 7V4h16v3"}),(0,e.jsx)("path",{d:"M9 20h6"}),(0,e.jsx)("path",{d:"M12 4v16"})]})}];function p({className:t}){let[a,i]=(0,l.useState)(!1),[s,n]=(0,l.useState)(c),[m,C]=(0,l.useState)(!1),[h,M]=(0,l.useState)(!1),S=(0,l.useRef)(null);(0,l.useEffect)(()=>{C(!0)},[]),(0,l.useEffect)(()=>{let o=O();n(o),v(o)},[]),(0,l.useEffect)(()=>{if(!a)return;let o=r=>{r.key==="Escape"&&i(!1)};return document.addEventListener("keydown",o),()=>document.removeEventListener("keydown",o)},[a]);let y=o=>{n(r=>{let g={...r,...o};return v(g),b(g),g})},w=()=>{n(c),v(c),b(c)},f=JSON.stringify(s)!==JSON.stringify(c);return(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("button",{ref:S,type:"button","aria-label":"Accessibility options","aria-expanded":a,"aria-haspopup":"dialog",onClick:()=>i(o=>!o),className:`pgm-btn${t?` ${t}`:""}`,children:[(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon-lg",fill:"none",stroke:"currentColor",strokeWidth:1.8,"aria-hidden":"true",children:[(0,e.jsx)("circle",{cx:"12",cy:"5",r:"1.5",fill:"currentColor",stroke:"none"}),(0,e.jsx)("path",{d:"M5 8.5h14M8 8.5l1 10 3-4 3 4 1-10",strokeLinecap:"round",strokeLinejoin:"round"})]}),f&&(0,e.jsx)("span",{className:"pgm-dot","aria-hidden":"true"})]}),a&&m&&(0,x.createPortal)((0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:"pgm-backdrop",onClick:()=>i(!1),"aria-hidden":"true"}),(0,e.jsxs)("div",{role:"dialog","aria-modal":"true","aria-label":"Accessibility settings",className:"pgm-dialog",children:[(0,e.jsxs)("div",{className:"pgm-header",children:[(0,e.jsxs)("div",{children:[(0,e.jsx)("p",{className:"pgm-header-title",children:"Accessibility"}),(0,e.jsx)("p",{className:"pgm-header-subtitle",children:"WCAG 2.1 \xB7 Personalise your experience"})]}),(0,e.jsx)("button",{type:"button","aria-label":"Close accessibility panel",onClick:()=>i(!1),className:"pgm-close-btn",children:(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-icon-sm",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:(0,e.jsx)("path",{d:"M18 6 6 18M6 6l12 12",strokeLinecap:"round"})})})]}),(0,e.jsxs)("div",{className:"pgm-size-section",children:[(0,e.jsxs)("div",{className:"pgm-size-header",children:[(0,e.jsx)("span",{className:"pgm-size-label",children:"Text Size"}),(0,e.jsx)("span",{className:"pgm-size-value",children:k[s.textSize]})]}),(0,e.jsx)("div",{className:"pgm-size-btns",children:k.map((o,r)=>(0,e.jsx)("button",{type:"button","aria-pressed":s.textSize===r,onClick:()=>y({textSize:r}),className:`pgm-size-btn ${s.textSize===r?"pgm-size-btn--active":"pgm-size-btn--inactive"}`,children:o},o))})]}),(0,e.jsx)("div",{className:"pgm-toggle-list",children:T.map(({key:o,label:r,desc:g,icon:L})=>{let d=s[o];return(0,e.jsxs)("button",{type:"button",role:"switch","aria-checked":d,onClick:()=>y({[o]:!d}),className:`pgm-toggle-btn${d?" pgm-toggle-btn--on":""}`,children:[(0,e.jsx)("span",{className:`pgm-toggle-icon${d?" pgm-toggle-icon--on":""}`,children:L}),(0,e.jsxs)("span",{className:"pgm-toggle-text",children:[(0,e.jsx)("span",{className:`pgm-toggle-label${d?" pgm-toggle-label--on":""}`,children:r}),(0,e.jsx)("span",{className:"pgm-toggle-desc",children:g})]}),(0,e.jsx)("span",{"aria-hidden":"true",className:`pgm-pill${d?" pgm-pill--on":" pgm-pill--off"}`,children:(0,e.jsx)("span",{className:`pgm-pill-knob${d?" pgm-pill-knob--on":" pgm-pill-knob--off"}`})})]},o)})}),(0,e.jsxs)("div",{className:"pgm-footer",children:[(0,e.jsxs)("button",{type:"button","aria-expanded":h,"aria-controls":"pgm-notice",onClick:()=>M(o=>!o),className:"pgm-notice-btn",children:[(0,e.jsx)("img",{src:"https://cdn.pigmil.com/shared/icon.png",alt:"Pigmil",className:"pgm-notice-logo"}),(0,e.jsx)("span",{children:"About this widget"}),(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-notice-chevron",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",style:{transform:h?"rotate(180deg)":"rotate(0deg)"},children:(0,e.jsx)("path",{d:"M6 9l6 6 6-6",strokeLinecap:"round",strokeLinejoin:"round"})})]}),(0,e.jsx)("button",{type:"button",onClick:w,disabled:!f,className:"pgm-reset-btn",children:"Reset all"})]}),h&&(0,e.jsxs)("div",{id:"pgm-notice",className:"pgm-notice",children:[(0,e.jsxs)("p",{className:"pgm-notice-text",children:["This accessibility widget is provided free of charge by"," ",(0,e.jsx)("a",{href:"https://github.com/pigmilcom/a11y",target:"_blank",rel:"noopener noreferrer",className:"pgm-notice-link",children:"PIGMIL"})," ","as an open-source tool to help make the web more accessible. It stores your preferences locally in your browser and sends no data to any server."]}),(0,e.jsxs)("a",{href:"https://github.com/pigmilcom/a11y",target:"_blank",rel:"noopener noreferrer",className:"pgm-notice-gh",children:[(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-icon-sm",fill:"currentColor","aria-hidden":"true",children:(0,e.jsx)("path",{d:"M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2z"})}),"View on GitHub"]})]})]})]}),document.body)]})}0&&(module.exports={A11yWidget});
|
|
1
|
+
var f=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var D=Object.prototype.hasOwnProperty;var R=(t,a)=>{for(var s in a)f(t,s,{get:a[s],enumerable:!0})},$=(t,a,s,o)=>{if(a&&typeof a=="object"||typeof a=="function")for(let r of O(a))!D.call(t,r)&&r!==s&&f(t,r,{get:()=>a[r],enumerable:!(o=E(a,r))||o.enumerable});return t};var P=t=>$(f({},"__esModule",{value:!0}),t);var K={};R(K,{A11yWidget:()=>p,a11y:()=>p,default:()=>p});module.exports=P(K);var i=require("react"),S=require("react-dom");var T=/^(localhost|127\.\d+\.\d+\.\d+|::1|\[::1\]|0\.0\.0\.0)$/i;function G(){try{let{hostname:t,port:a}=location;return!!(T.test(t)||a&&a!=="80"&&a!=="443")}catch{return!0}}var N="_pgm_lc";function J(){try{let t=sessionStorage.getItem(N);if(!t)return null;let a=JSON.parse(t);return Date.now()-(a._ts||0)<18e5?a:null}catch{return null}}function x(t){try{sessionStorage.setItem(N,JSON.stringify({...t,_ts:Date.now()}))}catch{}}var H=()=>Promise.resolve({ok:!0,plan:"free",blocked:!1});async function C(){let t=J();if(t)return{status:t.status,plan:t.plan};if(G()){let o={status:"dev",plan:"free"};return x(o),o}if(!(typeof location<"u"?location.hostname.toLowerCase().replace(/^www\./,""):""))return{status:"error",plan:"free"};let s;try{let o=await H();o!=null&&o.ok?o.blocked?s={status:"blocked",plan:o.plan||"free"}:s={status:"valid",plan:o.plan||"free"}:s={status:"error",plan:"free"}}catch{s={status:"error",plan:"free"}}return x(s),s}var e=require("react/jsx-runtime"),L="pgm-a11y",c={textSize:0,highContrast:!1,invertColors:!1,grayscale:!1,reduceMotion:!1,highlightLinks:!1,textSpacing:!1,adhd:!1,dyslexia:!1};function v(t){let a=document.documentElement;a.classList.remove("a11y-text-lg","a11y-text-xl"),t.textSize===1&&a.classList.add("a11y-text-lg"),t.textSize===2&&a.classList.add("a11y-text-xl");let s={"a11y-high-contrast":t.highContrast,"a11y-invert":t.invertColors,"a11y-grayscale":t.grayscale,"a11y-reduce-motion":t.reduceMotion,"a11y-highlight-links":t.highlightLinks,"a11y-text-spacing":t.textSpacing,"a11y-adhd":t.adhd,"a11y-dyslexia":t.dyslexia};for(let[r,u]of Object.entries(s))a.classList.toggle(r,u);let o=[];t.invertColors&&o.push("invert(1) hue-rotate(180deg)"),t.highContrast&&o.push("contrast(1.6)"),t.grayscale&&o.push("grayscale(1)"),a.style.filter=o.join(" ")}function j(){try{let t=localStorage.getItem(L);return t?{...c,...JSON.parse(t)}:{...c}}catch{return{...c}}}function w(t){try{localStorage.setItem(L,JSON.stringify(t))}catch{}}var M=["Normal","Large","X-Large"],F=[{key:"highContrast",label:"High Contrast",desc:"Increase colour contrast for readability",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,e.jsx)("path",{d:"M12 2v20"}),(0,e.jsx)("path",{d:"M12 2a10 10 0 0 1 0 20",fill:"currentColor",stroke:"none"})]})},{key:"invertColors",label:"Invert Colors",desc:"Invert all page colours",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("path",{d:"M12 3v18M3 12h18"}),(0,e.jsx)("path",{d:"M12 3a9 9 0 0 1 0 18",fill:"currentColor",stroke:"none"})]})},{key:"grayscale",label:"Grayscale",desc:"Remove all colour from the page",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("circle",{cx:"12",cy:"12",r:"9"}),(0,e.jsx)("circle",{cx:"12",cy:"12",r:"4",fill:"currentColor",stroke:"none"})]})},{key:"reduceMotion",label:"Reduce Motion",desc:"Stop animations and transitions",icon:(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:(0,e.jsx)("path",{d:"M5 12h14M12 5l-7 7 7 7"})})},{key:"highlightLinks",label:"Highlight Links",desc:"Make all links visible at a glance",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("path",{d:"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"}),(0,e.jsx)("path",{d:"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"})]})},{key:"textSpacing",label:"Text Spacing",desc:"Increase letter, word & line spacing",icon:(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:(0,e.jsx)("path",{d:"M4 6h16M4 10h16M4 14h16M4 18h16"})})},{key:"adhd",label:"ADHD Friendly",desc:"Remove distractions, add focus ring",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("path",{d:"M12 2L2 7l10 5 10-5-10-5z"}),(0,e.jsx)("path",{d:"M2 17l10 5 10-5"}),(0,e.jsx)("path",{d:"M2 12l10 5 10-5"})]})},{key:"dyslexia",label:"Dyslexia Font",desc:"Switch to a high-readability typeface",icon:(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[(0,e.jsx)("path",{d:"M4 7V4h16v3"}),(0,e.jsx)("path",{d:"M9 20h6"}),(0,e.jsx)("path",{d:"M12 4v16"})]})}];function p({className:t}){let[a,s]=(0,i.useState)(!1),[o,r]=(0,i.useState)(c),[u,_]=(0,i.useState)(!1),[h,z]=(0,i.useState)(!1),[m,A]=(0,i.useState)({status:"checking",plan:"free"}),B=(0,i.useRef)(null);if((0,i.useEffect)(()=>{_(!0)},[]),(0,i.useEffect)(()=>{C().then(A)},[]),(0,i.useEffect)(()=>{let n=j();r(n),v(n)},[]),(0,i.useEffect)(()=>{if(!a)return;let n=l=>{l.key==="Escape"&&s(!1)};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[a]),m.status==="checking"||m.status==="error"||m.status==="blocked")return null;let y=m.plan==="pro",b=n=>{r(l=>{let g={...l,...n};return v(g),w(g),g})},I=()=>{r(c),v(c),w(c)},k=JSON.stringify(o)!==JSON.stringify(c);return(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("button",{ref:B,type:"button","aria-label":"Accessibility options","aria-expanded":a,"aria-haspopup":"dialog",onClick:()=>s(n=>!n),className:`pgm-btn a11y-widget-btn${t?` ${t}`:""}`,children:[(0,e.jsxs)("svg",{viewBox:"0 0 24 24",className:"pgm-icon-lg",fill:"none",stroke:"currentColor",strokeWidth:1.8,"aria-hidden":"true",children:[(0,e.jsx)("circle",{cx:"12",cy:"5",r:"1.5",fill:"currentColor",stroke:"none"}),(0,e.jsx)("path",{d:"M5 8.5h14M8 8.5l1 10 3-4 3 4 1-10",strokeLinecap:"round",strokeLinejoin:"round"})]}),k&&(0,e.jsx)("span",{className:"pgm-dot","aria-hidden":"true"})]}),a&&u&&(0,S.createPortal)((0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:"pgm-backdrop",onClick:()=>s(!1),"aria-hidden":"true"}),(0,e.jsxs)("div",{role:"dialog","aria-modal":"true","aria-label":"Accessibility settings",className:"pgm-dialog a11y-widget-dialog",children:[(0,e.jsxs)("div",{className:"pgm-header",children:[(0,e.jsxs)("div",{children:[(0,e.jsx)("p",{className:"pgm-header-title",children:"Accessibility"}),(0,e.jsx)("p",{className:"pgm-header-subtitle",children:"WCAG 2.1 \xB7 Personalise your experience"})]}),(0,e.jsx)("button",{type:"button","aria-label":"Close accessibility panel",onClick:()=>s(!1),className:"pgm-close-btn",children:(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-icon-sm",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:(0,e.jsx)("path",{d:"M18 6 6 18M6 6l12 12",strokeLinecap:"round"})})})]}),(0,e.jsxs)("div",{className:"pgm-size-section",children:[(0,e.jsxs)("div",{className:"pgm-size-header",children:[(0,e.jsx)("span",{className:"pgm-size-label",children:"Text Size"}),(0,e.jsx)("span",{className:"pgm-size-value",children:M[o.textSize]})]}),(0,e.jsx)("div",{className:"pgm-size-btns",children:M.map((n,l)=>(0,e.jsx)("button",{type:"button","aria-pressed":o.textSize===l,onClick:()=>b({textSize:l}),className:`pgm-size-btn ${o.textSize===l?"pgm-size-btn--active":"pgm-size-btn--inactive"}`,children:n},n))})]}),(0,e.jsx)("div",{className:"pgm-toggle-list",children:F.map(({key:n,label:l,desc:g,icon:W})=>{let d=o[n];return(0,e.jsxs)("button",{type:"button",role:"switch","aria-checked":d,onClick:()=>b({[n]:!d}),className:`pgm-toggle-btn a11y-widget-toggle-btn${d?" pgm-toggle-btn--on":""}`,children:[(0,e.jsx)("span",{className:`pgm-toggle-icon${d?" pgm-toggle-icon--on":""}`,children:W}),(0,e.jsxs)("span",{className:"pgm-toggle-text",children:[(0,e.jsx)("span",{className:`pgm-toggle-label${d?" pgm-toggle-label--on":""}`,children:l}),(0,e.jsx)("span",{className:"pgm-toggle-desc",children:g})]}),(0,e.jsx)("span",{"aria-hidden":"true",className:`pgm-pill${d?" pgm-pill--on":" pgm-pill--off"}`,children:(0,e.jsx)("span",{className:`pgm-pill-knob${d?" pgm-pill-knob--on":" pgm-pill-knob--off"}`})})]},n)})}),(0,e.jsxs)("div",{className:"pgm-footer",children:[!y&&(0,e.jsxs)("button",{type:"button","aria-expanded":h,"aria-controls":"pgm-notice",onClick:()=>z(n=>!n),className:"pgm-notice-btn",children:[(0,e.jsx)("img",{src:"https://cdn.pigmil.com/shared/icon.png",alt:"Pigmil",className:"pgm-notice-logo"}),(0,e.jsx)("span",{children:"About this widget"}),(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-notice-chevron",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",style:{transform:h?"rotate(180deg)":"rotate(0deg)"},children:(0,e.jsx)("path",{d:"M6 9l6 6 6-6",strokeLinecap:"round",strokeLinejoin:"round"})})]}),(0,e.jsx)("button",{type:"button",onClick:I,disabled:!k,className:"pgm-reset-btn",children:"Reset all"})]}),!y&&h&&(0,e.jsxs)("div",{id:"pgm-notice",className:"pgm-notice",children:[(0,e.jsxs)("p",{className:"pgm-notice-text",children:["This accessibility widget is provided free of charge by"," ",(0,e.jsx)("a",{href:"https://github.com/pigmilcom/a11y",target:"_blank",rel:"noopener noreferrer",className:"pgm-notice-link",children:"PIGMIL"})," ","as an open-source tool to help make the web more accessible. It stores your preferences locally in your browser and sends no data to any server."]}),(0,e.jsxs)("a",{href:"https://github.com/pigmilcom/a11y",target:"_blank",rel:"noopener noreferrer",className:"pgm-notice-gh",children:[(0,e.jsx)("svg",{viewBox:"0 0 24 24",className:"pgm-icon-sm",fill:"currentColor","aria-hidden":"true",children:(0,e.jsx)("path",{d:"M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2z"})}),"View on GitHub"]})]})]})]}),document.body)]})}0&&(module.exports={A11yWidget,a11y});
|
package/dist/index.min.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useEffect as u,useRef as
|
|
1
|
+
import{useEffect as u,useRef as P,useState as p}from"react";import{createPortal as T}from"react-dom";var O=/^(localhost|127\.\d+\.\d+\.\d+|::1|\[::1\]|0\.0\.0\.0)$/i;function D(){try{let{hostname:t,port:s}=location;return!!(O.test(t)||s&&s!=="80"&&s!=="443")}catch{return!0}}var C="_pgm_lc";function R(){try{let t=sessionStorage.getItem(C);if(!t)return null;let s=JSON.parse(t);return Date.now()-(s._ts||0)<18e5?s:null}catch{return null}}function N(t){try{sessionStorage.setItem(C,JSON.stringify({...t,_ts:Date.now()}))}catch{}}var $=()=>Promise.resolve({ok:!0,plan:"free",blocked:!1});async function w(){let t=R();if(t)return{status:t.status,plan:t.plan};if(D()){let o={status:"dev",plan:"free"};return N(o),o}if(!(typeof location<"u"?location.hostname.toLowerCase().replace(/^www\./,""):""))return{status:"error",plan:"free"};let i;try{let o=await $();o!=null&&o.ok?o.blocked?i={status:"blocked",plan:o.plan||"free"}:i={status:"valid",plan:o.plan||"free"}:i={status:"error",plan:"free"}}catch{i={status:"error",plan:"free"}}return N(i),i}import{Fragment as L,jsx as e,jsxs as a}from"react/jsx-runtime";var _="pgm-a11y",l={textSize:0,highContrast:!1,invertColors:!1,grayscale:!1,reduceMotion:!1,highlightLinks:!1,textSpacing:!1,adhd:!1,dyslexia:!1};function y(t){let s=document.documentElement;s.classList.remove("a11y-text-lg","a11y-text-xl"),t.textSize===1&&s.classList.add("a11y-text-lg"),t.textSize===2&&s.classList.add("a11y-text-xl");let i={"a11y-high-contrast":t.highContrast,"a11y-invert":t.invertColors,"a11y-grayscale":t.grayscale,"a11y-reduce-motion":t.reduceMotion,"a11y-highlight-links":t.highlightLinks,"a11y-text-spacing":t.textSpacing,"a11y-adhd":t.adhd,"a11y-dyslexia":t.dyslexia};for(let[d,f]of Object.entries(i))s.classList.toggle(d,f);let o=[];t.invertColors&&o.push("invert(1) hue-rotate(180deg)"),t.highContrast&&o.push("contrast(1.6)"),t.grayscale&&o.push("grayscale(1)"),s.style.filter=o.join(" ")}function G(){try{let t=localStorage.getItem(_);return t?{...l,...JSON.parse(t)}:{...l}}catch{return{...l}}}function M(t){try{localStorage.setItem(_,JSON.stringify(t))}catch{}}var S=["Normal","Large","X-Large"],J=[{key:"highContrast",label:"High Contrast",desc:"Increase colour contrast for readability",icon:a("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[e("circle",{cx:"12",cy:"12",r:"10"}),e("path",{d:"M12 2v20"}),e("path",{d:"M12 2a10 10 0 0 1 0 20",fill:"currentColor",stroke:"none"})]})},{key:"invertColors",label:"Invert Colors",desc:"Invert all page colours",icon:a("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[e("path",{d:"M12 3v18M3 12h18"}),e("path",{d:"M12 3a9 9 0 0 1 0 18",fill:"currentColor",stroke:"none"})]})},{key:"grayscale",label:"Grayscale",desc:"Remove all colour from the page",icon:a("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[e("circle",{cx:"12",cy:"12",r:"9"}),e("circle",{cx:"12",cy:"12",r:"4",fill:"currentColor",stroke:"none"})]})},{key:"reduceMotion",label:"Reduce Motion",desc:"Stop animations and transitions",icon:e("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:e("path",{d:"M5 12h14M12 5l-7 7 7 7"})})},{key:"highlightLinks",label:"Highlight Links",desc:"Make all links visible at a glance",icon:a("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[e("path",{d:"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"}),e("path",{d:"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"})]})},{key:"textSpacing",label:"Text Spacing",desc:"Increase letter, word & line spacing",icon:e("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:e("path",{d:"M4 6h16M4 10h16M4 14h16M4 18h16"})})},{key:"adhd",label:"ADHD Friendly",desc:"Remove distractions, add focus ring",icon:a("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[e("path",{d:"M12 2L2 7l10 5 10-5-10-5z"}),e("path",{d:"M2 17l10 5 10-5"}),e("path",{d:"M2 12l10 5 10-5"})]})},{key:"dyslexia",label:"Dyslexia Font",desc:"Switch to a high-readability typeface",icon:a("svg",{viewBox:"0 0 24 24",className:"pgm-icon",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:[e("path",{d:"M4 7V4h16v3"}),e("path",{d:"M9 20h6"}),e("path",{d:"M12 4v16"})]})}];function h({className:t}){let[s,i]=p(!1),[o,d]=p(l),[f,z]=p(!1),[v,A]=p(!1),[m,B]=p({status:"checking",plan:"free"}),I=P(null);if(u(()=>{z(!0)},[]),u(()=>{w().then(B)},[]),u(()=>{let n=G();d(n),y(n)},[]),u(()=>{if(!s)return;let n=r=>{r.key==="Escape"&&i(!1)};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[s]),m.status==="checking"||m.status==="error"||m.status==="blocked")return null;let b=m.plan==="pro",k=n=>{d(r=>{let g={...r,...n};return y(g),M(g),g})},W=()=>{d(l),y(l),M(l)},x=JSON.stringify(o)!==JSON.stringify(l);return a(L,{children:[a("button",{ref:I,type:"button","aria-label":"Accessibility options","aria-expanded":s,"aria-haspopup":"dialog",onClick:()=>i(n=>!n),className:`pgm-btn a11y-widget-btn${t?` ${t}`:""}`,children:[a("svg",{viewBox:"0 0 24 24",className:"pgm-icon-lg",fill:"none",stroke:"currentColor",strokeWidth:1.8,"aria-hidden":"true",children:[e("circle",{cx:"12",cy:"5",r:"1.5",fill:"currentColor",stroke:"none"}),e("path",{d:"M5 8.5h14M8 8.5l1 10 3-4 3 4 1-10",strokeLinecap:"round",strokeLinejoin:"round"})]}),x&&e("span",{className:"pgm-dot","aria-hidden":"true"})]}),s&&f&&T(a(L,{children:[e("div",{className:"pgm-backdrop",onClick:()=>i(!1),"aria-hidden":"true"}),a("div",{role:"dialog","aria-modal":"true","aria-label":"Accessibility settings",className:"pgm-dialog a11y-widget-dialog",children:[a("div",{className:"pgm-header",children:[a("div",{children:[e("p",{className:"pgm-header-title",children:"Accessibility"}),e("p",{className:"pgm-header-subtitle",children:"WCAG 2.1 \xB7 Personalise your experience"})]}),e("button",{type:"button","aria-label":"Close accessibility panel",onClick:()=>i(!1),className:"pgm-close-btn",children:e("svg",{viewBox:"0 0 24 24",className:"pgm-icon-sm",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",children:e("path",{d:"M18 6 6 18M6 6l12 12",strokeLinecap:"round"})})})]}),a("div",{className:"pgm-size-section",children:[a("div",{className:"pgm-size-header",children:[e("span",{className:"pgm-size-label",children:"Text Size"}),e("span",{className:"pgm-size-value",children:S[o.textSize]})]}),e("div",{className:"pgm-size-btns",children:S.map((n,r)=>e("button",{type:"button","aria-pressed":o.textSize===r,onClick:()=>k({textSize:r}),className:`pgm-size-btn ${o.textSize===r?"pgm-size-btn--active":"pgm-size-btn--inactive"}`,children:n},n))})]}),e("div",{className:"pgm-toggle-list",children:J.map(({key:n,label:r,desc:g,icon:E})=>{let c=o[n];return a("button",{type:"button",role:"switch","aria-checked":c,onClick:()=>k({[n]:!c}),className:`pgm-toggle-btn a11y-widget-toggle-btn${c?" pgm-toggle-btn--on":""}`,children:[e("span",{className:`pgm-toggle-icon${c?" pgm-toggle-icon--on":""}`,children:E}),a("span",{className:"pgm-toggle-text",children:[e("span",{className:`pgm-toggle-label${c?" pgm-toggle-label--on":""}`,children:r}),e("span",{className:"pgm-toggle-desc",children:g})]}),e("span",{"aria-hidden":"true",className:`pgm-pill${c?" pgm-pill--on":" pgm-pill--off"}`,children:e("span",{className:`pgm-pill-knob${c?" pgm-pill-knob--on":" pgm-pill-knob--off"}`})})]},n)})}),a("div",{className:"pgm-footer",children:[!b&&a("button",{type:"button","aria-expanded":v,"aria-controls":"pgm-notice",onClick:()=>A(n=>!n),className:"pgm-notice-btn",children:[e("img",{src:"https://cdn.pigmil.com/shared/icon.png",alt:"Pigmil",className:"pgm-notice-logo"}),e("span",{children:"About this widget"}),e("svg",{viewBox:"0 0 24 24",className:"pgm-notice-chevron",fill:"none",stroke:"currentColor",strokeWidth:2,"aria-hidden":"true",style:{transform:v?"rotate(180deg)":"rotate(0deg)"},children:e("path",{d:"M6 9l6 6 6-6",strokeLinecap:"round",strokeLinejoin:"round"})})]}),e("button",{type:"button",onClick:W,disabled:!x,className:"pgm-reset-btn",children:"Reset all"})]}),!b&&v&&a("div",{id:"pgm-notice",className:"pgm-notice",children:[a("p",{className:"pgm-notice-text",children:["This accessibility widget is provided free of charge by"," ",e("a",{href:"https://github.com/pigmilcom/a11y",target:"_blank",rel:"noopener noreferrer",className:"pgm-notice-link",children:"PIGMIL"})," ","as an open-source tool to help make the web more accessible. It stores your preferences locally in your browser and sends no data to any server."]}),a("a",{href:"https://github.com/pigmilcom/a11y",target:"_blank",rel:"noopener noreferrer",className:"pgm-notice-gh",children:[e("svg",{viewBox:"0 0 24 24",className:"pgm-icon-sm",fill:"currentColor","aria-hidden":"true",children:e("path",{d:"M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2z"})}),"View on GitHub"]})]})]})]}),document.body)]})}export{h as A11yWidget,h as a11y,h as default};
|
package/dist/index.mjs
CHANGED
|
@@ -3,6 +3,61 @@
|
|
|
3
3
|
// src/widget.jsx
|
|
4
4
|
import { useEffect, useRef, useState } from "react";
|
|
5
5
|
import { createPortal } from "react-dom";
|
|
6
|
+
|
|
7
|
+
// src/license.js
|
|
8
|
+
var _LRE = /^(localhost|127\.\d+\.\d+\.\d+|::1|\[::1\]|0\.0\.0\.0)$/i;
|
|
9
|
+
function _isLocalDev() {
|
|
10
|
+
try {
|
|
11
|
+
const { hostname: h, port: p } = location;
|
|
12
|
+
if (_LRE.test(h)) return true;
|
|
13
|
+
if (p && p !== "80" && p !== "443") return true;
|
|
14
|
+
return false;
|
|
15
|
+
} catch {
|
|
16
|
+
return true;
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
var _CK = "_pgm_lc";
|
|
20
|
+
function _readCache() {
|
|
21
|
+
try {
|
|
22
|
+
const v = sessionStorage.getItem(_CK);
|
|
23
|
+
if (!v) return null;
|
|
24
|
+
const p = JSON.parse(v);
|
|
25
|
+
return Date.now() - (p._ts || 0) < 18e5 ? p : null;
|
|
26
|
+
} catch {
|
|
27
|
+
return null;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
function _writeCache(result) {
|
|
31
|
+
try {
|
|
32
|
+
sessionStorage.setItem(_CK, JSON.stringify({ ...result, _ts: Date.now() }));
|
|
33
|
+
} catch {
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
var _mock = () => Promise.resolve({ ok: true, plan: "free", blocked: false });
|
|
37
|
+
async function validateLicense() {
|
|
38
|
+
const cached = _readCache();
|
|
39
|
+
if (cached) return { status: cached.status, plan: cached.plan };
|
|
40
|
+
if (_isLocalDev()) {
|
|
41
|
+
const result2 = { status: "dev", plan: "free" };
|
|
42
|
+
_writeCache(result2);
|
|
43
|
+
return result2;
|
|
44
|
+
}
|
|
45
|
+
const domain = typeof location !== "undefined" ? location.hostname.toLowerCase().replace(/^www\./, "") : "";
|
|
46
|
+
if (!domain) return { status: "error", plan: "free" };
|
|
47
|
+
let result;
|
|
48
|
+
try {
|
|
49
|
+
const data = await _mock();
|
|
50
|
+
if (!(data == null ? void 0 : data.ok)) result = { status: "error", plan: "free" };
|
|
51
|
+
else if (data.blocked) result = { status: "blocked", plan: data.plan || "free" };
|
|
52
|
+
else result = { status: "valid", plan: data.plan || "free" };
|
|
53
|
+
} catch {
|
|
54
|
+
result = { status: "error", plan: "free" };
|
|
55
|
+
}
|
|
56
|
+
_writeCache(result);
|
|
57
|
+
return result;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
// src/widget.jsx
|
|
6
61
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
7
62
|
var STORAGE_KEY = "pgm-a11y";
|
|
8
63
|
var DEFAULTS = {
|
|
@@ -127,15 +182,19 @@ var TOGGLES = [
|
|
|
127
182
|
] })
|
|
128
183
|
}
|
|
129
184
|
];
|
|
130
|
-
function
|
|
185
|
+
function A11y({ className }) {
|
|
131
186
|
const [open, setOpen] = useState(false);
|
|
132
187
|
const [prefs, setPrefs] = useState(DEFAULTS);
|
|
133
188
|
const [mounted, setMounted] = useState(false);
|
|
134
189
|
const [notice, setNotice] = useState(false);
|
|
190
|
+
const [license, setLicense] = useState({ status: "checking", plan: "free" });
|
|
135
191
|
const triggerRef = useRef(null);
|
|
136
192
|
useEffect(() => {
|
|
137
193
|
setMounted(true);
|
|
138
194
|
}, []);
|
|
195
|
+
useEffect(() => {
|
|
196
|
+
validateLicense().then(setLicense);
|
|
197
|
+
}, []);
|
|
139
198
|
useEffect(() => {
|
|
140
199
|
const saved = load();
|
|
141
200
|
setPrefs(saved);
|
|
@@ -149,6 +208,10 @@ function A11yWidget({ className }) {
|
|
|
149
208
|
document.addEventListener("keydown", onKey);
|
|
150
209
|
return () => document.removeEventListener("keydown", onKey);
|
|
151
210
|
}, [open]);
|
|
211
|
+
if (license.status === "checking" || license.status === "error" || license.status === "blocked") {
|
|
212
|
+
return null;
|
|
213
|
+
}
|
|
214
|
+
const isPro = license.plan === "pro";
|
|
152
215
|
const update = (patch) => {
|
|
153
216
|
setPrefs((prev) => {
|
|
154
217
|
const next = { ...prev, ...patch };
|
|
@@ -173,7 +236,7 @@ function A11yWidget({ className }) {
|
|
|
173
236
|
"aria-expanded": open,
|
|
174
237
|
"aria-haspopup": "dialog",
|
|
175
238
|
onClick: () => setOpen((v) => !v),
|
|
176
|
-
className: `pgm-btn${className ? ` ${className}` : ""}`,
|
|
239
|
+
className: `pgm-btn a11y-widget-btn${className ? ` ${className}` : ""}`,
|
|
177
240
|
children: [
|
|
178
241
|
/* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", className: "pgm-icon-lg", fill: "none", stroke: "currentColor", strokeWidth: 1.8, "aria-hidden": "true", children: [
|
|
179
242
|
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "5", r: "1.5", fill: "currentColor", stroke: "none" }),
|
|
@@ -199,7 +262,7 @@ function A11yWidget({ className }) {
|
|
|
199
262
|
role: "dialog",
|
|
200
263
|
"aria-modal": "true",
|
|
201
264
|
"aria-label": "Accessibility settings",
|
|
202
|
-
className: "pgm-dialog",
|
|
265
|
+
className: "pgm-dialog a11y-widget-dialog",
|
|
203
266
|
children: [
|
|
204
267
|
/* @__PURE__ */ jsxs("div", { className: "pgm-header", children: [
|
|
205
268
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
@@ -243,7 +306,7 @@ function A11yWidget({ className }) {
|
|
|
243
306
|
role: "switch",
|
|
244
307
|
"aria-checked": on,
|
|
245
308
|
onClick: () => update({ [key]: !on }),
|
|
246
|
-
className: `pgm-toggle-btn${on ? " pgm-toggle-btn--on" : ""}`,
|
|
309
|
+
className: `pgm-toggle-btn a11y-widget-toggle-btn${on ? " pgm-toggle-btn--on" : ""}`,
|
|
247
310
|
children: [
|
|
248
311
|
/* @__PURE__ */ jsx("span", { className: `pgm-toggle-icon${on ? " pgm-toggle-icon--on" : ""}`, children: icon }),
|
|
249
312
|
/* @__PURE__ */ jsxs("span", { className: "pgm-toggle-text", children: [
|
|
@@ -269,7 +332,7 @@ function A11yWidget({ className }) {
|
|
|
269
332
|
);
|
|
270
333
|
}) }),
|
|
271
334
|
/* @__PURE__ */ jsxs("div", { className: "pgm-footer", children: [
|
|
272
|
-
/* @__PURE__ */ jsxs(
|
|
335
|
+
!isPro && /* @__PURE__ */ jsxs(
|
|
273
336
|
"button",
|
|
274
337
|
{
|
|
275
338
|
type: "button",
|
|
@@ -302,7 +365,7 @@ function A11yWidget({ className }) {
|
|
|
302
365
|
}
|
|
303
366
|
)
|
|
304
367
|
] }),
|
|
305
|
-
notice && /* @__PURE__ */ jsxs("div", { id: "pgm-notice", className: "pgm-notice", children: [
|
|
368
|
+
!isPro && notice && /* @__PURE__ */ jsxs("div", { id: "pgm-notice", className: "pgm-notice", children: [
|
|
306
369
|
/* @__PURE__ */ jsxs("p", { className: "pgm-notice-text", children: [
|
|
307
370
|
"This accessibility widget is provided free of charge by",
|
|
308
371
|
" ",
|
|
@@ -342,6 +405,7 @@ function A11yWidget({ className }) {
|
|
|
342
405
|
] });
|
|
343
406
|
}
|
|
344
407
|
export {
|
|
345
|
-
A11yWidget,
|
|
346
|
-
|
|
408
|
+
A11y as A11yWidget,
|
|
409
|
+
A11y as a11y,
|
|
410
|
+
A11y as default
|
|
347
411
|
};
|
package/package.json
CHANGED
package/src/cdn.jsx
CHANGED
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
*/
|
|
16
16
|
|
|
17
17
|
import { createRoot } from 'react-dom/client';
|
|
18
|
-
import
|
|
18
|
+
import A11y from './widget.jsx';
|
|
19
19
|
|
|
20
20
|
// Inline the pre-built CSS (widget UI + a11y modifier rules).
|
|
21
21
|
// Imported as a JS module (generated by scripts/build-css.js) so esbuild bundles
|
|
@@ -60,7 +60,7 @@ function mount() {
|
|
|
60
60
|
container.setAttribute('style', `position:fixed;z-index:9998;line-height:0;font-size:0;${posCSS}`);
|
|
61
61
|
document.body.appendChild(container);
|
|
62
62
|
_root = createRoot(container);
|
|
63
|
-
_root.render(<
|
|
63
|
+
_root.render(<A11y />);
|
|
64
64
|
}
|
|
65
65
|
|
|
66
66
|
function unmount() {
|