@aspprev/versi-ds 0.2.0 → 0.3.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.
@@ -320,29 +320,127 @@ var InputSwitch = (_a) => {
320
320
  };
321
321
  var InputSwitch_default = InputSwitch;
322
322
 
323
- // src/components/accessibility-preferences/AccessibilityPreferencesPanel.tsx
324
- import { useId, useState as useState2 } from "react";
323
+ // src/components/accessibility-preferences/ContrastPreference.tsx
324
+ import { MdContrast } from "react-icons/md";
325
+
326
+ // src/components/accessibility-preferences/PreferenceSection.tsx
327
+ import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
328
+ function PreferenceSection({
329
+ title,
330
+ description,
331
+ icon: Icon,
332
+ children,
333
+ className
334
+ }) {
335
+ return /* @__PURE__ */ jsxs3(
336
+ "fieldset",
337
+ {
338
+ className: `rounded-md border border-border-default bg-surface-subtle p-4 tablet:p-5 ${className != null ? className : ""}`.trim(),
339
+ children: [
340
+ /* @__PURE__ */ jsx3("legend", { className: "sr-only", children: title }),
341
+ /* @__PURE__ */ jsxs3("div", { className: "mb-4 flex items-start gap-3", children: [
342
+ /* @__PURE__ */ jsx3("span", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-primary-5 text-primary-1", children: /* @__PURE__ */ jsx3(Icon, { "aria-hidden": "true", className: "h-5 w-5" }) }),
343
+ /* @__PURE__ */ jsxs3("div", { children: [
344
+ /* @__PURE__ */ jsx3("h3", { className: "font-bold", children: title }),
345
+ /* @__PURE__ */ jsx3("p", { className: "text-sm text-content-secondary", children: description })
346
+ ] })
347
+ ] }),
348
+ children
349
+ ]
350
+ }
351
+ );
352
+ }
353
+
354
+ // src/components/accessibility-preferences/ContrastPreference.tsx
355
+ import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
356
+ function ContrastPreference({
357
+ checked,
358
+ onChange,
359
+ className
360
+ }) {
361
+ return /* @__PURE__ */ jsx4(
362
+ PreferenceSection,
363
+ {
364
+ title: "Contraste",
365
+ description: "Aumente a diferencia\xE7\xE3o entre conte\xFAdo e superf\xEDcie.",
366
+ icon: MdContrast,
367
+ className,
368
+ children: /* @__PURE__ */ jsxs4("div", { className: "flex min-h-16 items-center justify-between gap-4 rounded-sm border border-border-default bg-surface-card px-3 py-3", children: [
369
+ /* @__PURE__ */ jsxs4("span", { className: "flex items-center gap-1.5 font-semibold", children: [
370
+ /* @__PURE__ */ jsx4(MdContrast, { "aria-hidden": "true", className: "h-4 w-4" }),
371
+ "Alto contraste"
372
+ ] }),
373
+ /* @__PURE__ */ jsx4(
374
+ InputSwitch_default,
375
+ {
376
+ "aria-label": "Alternar alto contraste",
377
+ checked,
378
+ size: "lg",
379
+ onChange
380
+ }
381
+ )
382
+ ] })
383
+ }
384
+ );
385
+ }
386
+
387
+ // src/components/accessibility-preferences/FontSizePreference.tsx
388
+ import { useId } from "react";
389
+ import { MdTextFields } from "react-icons/md";
390
+ import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
391
+ var FONT_SCALE_OPTIONS = [
392
+ { value: "standard", label: "Padr\xE3o" },
393
+ { value: "large", label: "Grande" },
394
+ { value: "extra-large", label: "Muito grande" }
395
+ ];
396
+ function FontSizePreference({
397
+ value,
398
+ onChange,
399
+ className
400
+ }) {
401
+ const groupId = useId();
402
+ return /* @__PURE__ */ jsx5(
403
+ PreferenceSection,
404
+ {
405
+ title: "Tamanho do texto",
406
+ description: "Amplie os textos para facilitar a leitura.",
407
+ icon: MdTextFields,
408
+ className,
409
+ children: /* @__PURE__ */ jsx5("div", { className: "grid gap-2", children: FONT_SCALE_OPTIONS.map((option) => /* @__PURE__ */ jsxs5(
410
+ "label",
411
+ {
412
+ className: "flex min-h-11 cursor-pointer items-center gap-3 rounded-sm border border-border-default bg-surface-card p-3 text-content-primary transition-colors hover:border-border-strong hover:bg-surface-muted",
413
+ children: [
414
+ /* @__PURE__ */ jsx5(
415
+ "input",
416
+ {
417
+ type: "radio",
418
+ name: `${groupId}-font-scale`,
419
+ value: option.value,
420
+ checked: value === option.value,
421
+ onChange: () => onChange(option.value),
422
+ className: "radio-control shrink-0"
423
+ }
424
+ ),
425
+ /* @__PURE__ */ jsx5("span", { className: "flex w-9 shrink-0 justify-center font-extrabold text-primary-1", children: "Aa" }),
426
+ /* @__PURE__ */ jsx5("span", { className: "font-semibold", children: option.label })
427
+ ]
428
+ },
429
+ option.value
430
+ )) })
431
+ }
432
+ );
433
+ }
434
+
435
+ // src/components/accessibility-preferences/ReadingPreferences.tsx
325
436
  import {
326
437
  MdAccessibilityNew,
327
438
  MdAnimation,
328
439
  MdCenterFocusStrong,
329
- MdContrast,
330
- MdLink,
331
- MdPalette,
332
- MdRestartAlt,
333
- MdTextFields
440
+ MdLink
334
441
  } from "react-icons/md";
335
- import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
336
- var DEFAULT_ACCESSIBILITY_PREFERENCES = {
337
- colorScheme: "light",
338
- highContrast: false,
339
- highContrastTheme: "light",
340
- fontScale: "standard",
341
- reduceMotion: false,
342
- emphasizeFocus: false,
343
- underlineLinks: false
344
- };
345
- var readingOptions = [
442
+ import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
443
+ var READING_OPTIONS = [
346
444
  {
347
445
  key: "reduceMotion",
348
446
  label: "Reduzir anima\xE7\xF5es",
@@ -362,8 +460,107 @@ var readingOptions = [
362
460
  Icon: MdLink
363
461
  }
364
462
  ];
365
- var sectionClass = "rounded-md border border-border-default bg-surface-subtle p-4 tablet:p-5";
366
- var choiceClass = "flex min-h-11 cursor-pointer gap-3 rounded-sm border border-border-default bg-surface-card p-3 text-content-primary transition-colors hover:border-border-strong hover:bg-surface-muted";
463
+ function ReadingPreferences({
464
+ reduceMotion,
465
+ emphasizeFocus,
466
+ underlineLinks,
467
+ onChange,
468
+ className
469
+ }) {
470
+ const values = { reduceMotion, emphasizeFocus, underlineLinks };
471
+ return /* @__PURE__ */ jsx6(
472
+ PreferenceSection,
473
+ {
474
+ title: "Leitura e navega\xE7\xE3o",
475
+ description: "Ajustes para reduzir distra\xE7\xF5es e facilitar a orienta\xE7\xE3o.",
476
+ icon: MdAccessibilityNew,
477
+ className: `desktop:col-span-2 ${className != null ? className : ""}`.trim(),
478
+ children: /* @__PURE__ */ jsx6("div", { className: "grid gap-3 tablet:grid-cols-3", children: READING_OPTIONS.map(({ key, label, description, Icon }) => /* @__PURE__ */ jsxs6(
479
+ "label",
480
+ {
481
+ className: "flex min-h-11 cursor-pointer items-start gap-3 rounded-sm border border-border-default bg-surface-card p-3 text-content-primary transition-colors hover:border-border-strong hover:bg-surface-muted",
482
+ children: [
483
+ /* @__PURE__ */ jsx6(
484
+ "input",
485
+ {
486
+ type: "checkbox",
487
+ "aria-label": label,
488
+ checked: values[key],
489
+ onChange: (event) => onChange({ [key]: event.target.checked }),
490
+ className: "checkbox-control mt-1"
491
+ }
492
+ ),
493
+ /* @__PURE__ */ jsxs6("span", { children: [
494
+ /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-2 font-semibold", children: [
495
+ /* @__PURE__ */ jsx6(Icon, { "aria-hidden": "true", className: "h-5 w-5 shrink-0 text-primary-1" }),
496
+ label
497
+ ] }),
498
+ /* @__PURE__ */ jsx6("span", { className: "mt-1 block text-sm text-content-secondary", children: description })
499
+ ] })
500
+ ]
501
+ },
502
+ key
503
+ )) })
504
+ }
505
+ );
506
+ }
507
+
508
+ // src/components/accessibility-preferences/ThemePreference.tsx
509
+ import { MdPalette } from "react-icons/md";
510
+ import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
511
+ function ThemePreference({
512
+ value,
513
+ onChange,
514
+ className
515
+ }) {
516
+ const isDark = value === "dark";
517
+ const isSystem = value === "system";
518
+ return /* @__PURE__ */ jsx7(
519
+ PreferenceSection,
520
+ {
521
+ title: "Apar\xEAncia",
522
+ description: "Tema e esquema de cores da interface.",
523
+ icon: MdPalette,
524
+ className,
525
+ children: /* @__PURE__ */ jsxs7("div", { className: "divide-y divide-border-subtle rounded-sm border border-border-default bg-surface-card px-3", children: [
526
+ /* @__PURE__ */ jsxs7("div", { className: "flex min-h-16 items-center justify-between gap-4 py-3", children: [
527
+ /* @__PURE__ */ jsxs7("span", { className: "font-semibold", children: [
528
+ "Tema ",
529
+ isDark ? "escuro" : "claro"
530
+ ] }),
531
+ /* @__PURE__ */ jsx7(
532
+ InputSwitch_default,
533
+ {
534
+ "aria-label": "Alternar tema claro ou escuro",
535
+ variant: "theme",
536
+ size: "lg",
537
+ checked: isDark,
538
+ disabled: isSystem,
539
+ onChange: (enabled) => onChange(enabled ? "dark" : "light")
540
+ }
541
+ )
542
+ ] }),
543
+ /* @__PURE__ */ jsxs7("label", { className: "flex min-h-14 cursor-pointer items-start gap-3 py-3", children: [
544
+ /* @__PURE__ */ jsx7(
545
+ "input",
546
+ {
547
+ type: "checkbox",
548
+ className: "checkbox-control mt-0.5",
549
+ checked: isSystem,
550
+ onChange: (event) => onChange(event.target.checked ? "system" : isDark ? "dark" : "light")
551
+ }
552
+ ),
553
+ /* @__PURE__ */ jsx7("span", { className: "font-semibold", children: "Usar configura\xE7\xE3o do dispositivo" })
554
+ ] })
555
+ ] })
556
+ }
557
+ );
558
+ }
559
+
560
+ // src/components/accessibility-preferences/AccessibilityPreferencesPanel.tsx
561
+ import { useState as useState2 } from "react";
562
+ import { MdAccessibilityNew as MdAccessibilityNew2, MdRestartAlt } from "react-icons/md";
563
+ import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
367
564
  function AccessibilityPreferencesPanel({
368
565
  preferences,
369
566
  onPreferencesChange,
@@ -376,7 +573,6 @@ function AccessibilityPreferencesPanel({
376
573
  }) {
377
574
  const [internalOpen, setInternalOpen] = useState2(false);
378
575
  const [announcement, setAnnouncement] = useState2("");
379
- const titleId = useId();
380
576
  const isOpen = controlledOpen != null ? controlledOpen : internalOpen;
381
577
  const setOpen = (open) => {
382
578
  if (controlledOpen === void 0) setInternalOpen(open);
@@ -386,9 +582,8 @@ function AccessibilityPreferencesPanel({
386
582
  onPreferencesChange(changes);
387
583
  setAnnouncement(message);
388
584
  };
389
- const isDark = preferences.colorScheme === "dark";
390
- return /* @__PURE__ */ jsxs3(Fragment2, { children: [
391
- showTrigger && /* @__PURE__ */ jsxs3(
585
+ return /* @__PURE__ */ jsxs8(Fragment2, { children: [
586
+ showTrigger && /* @__PURE__ */ jsxs8(
392
587
  "button",
393
588
  {
394
589
  type: "button",
@@ -397,12 +592,12 @@ function AccessibilityPreferencesPanel({
397
592
  onClick: () => setOpen(true),
398
593
  className: `inline-flex min-h-11 items-center justify-center gap-2 rounded-sm border-2 border-action-primary-content bg-action-primary px-3 text-sm font-bold text-action-primary-content shadow-sm hover:bg-action-primary-hover focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ${className != null ? className : ""}`.trim(),
399
594
  children: [
400
- /* @__PURE__ */ jsx3(MdAccessibilityNew, { "aria-hidden": "true", className: "h-5 w-5" }),
401
- /* @__PURE__ */ jsx3("span", { children: triggerLabel })
595
+ /* @__PURE__ */ jsx8(MdAccessibilityNew2, { "aria-hidden": "true", className: "h-5 w-5" }),
596
+ /* @__PURE__ */ jsx8("span", { children: triggerLabel })
402
597
  ]
403
598
  }
404
599
  ),
405
- /* @__PURE__ */ jsxs3(
600
+ /* @__PURE__ */ jsxs8(
406
601
  Modal_default,
407
602
  {
408
603
  isOpen,
@@ -411,130 +606,99 @@ function AccessibilityPreferencesPanel({
411
606
  showIcon: false,
412
607
  size: "large",
413
608
  children: [
414
- /* @__PURE__ */ jsx3("p", { className: "mt-2 text-center text-sm text-content-secondary", children: "As altera\xE7\xF5es s\xE3o aplicadas pelo consumidor do componente." }),
415
- /* @__PURE__ */ jsxs3("div", { className: "mt-5 grid gap-4 desktop:grid-cols-2", children: [
416
- /* @__PURE__ */ jsxs3("fieldset", { className: sectionClass, children: [
417
- /* @__PURE__ */ jsx3("legend", { className: "sr-only", children: "Apar\xEAncia" }),
418
- /* @__PURE__ */ jsxs3("div", { className: "mb-4 flex items-start gap-3", children: [
419
- /* @__PURE__ */ jsx3("span", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-primary-5 text-primary-1", children: /* @__PURE__ */ jsx3(MdPalette, { "aria-hidden": "true", className: "h-5 w-5" }) }),
420
- /* @__PURE__ */ jsxs3("div", { children: [
421
- /* @__PURE__ */ jsx3("h3", { className: "font-bold", children: "Apar\xEAncia" }),
422
- /* @__PURE__ */ jsx3("p", { className: "text-sm text-content-secondary", children: "Tema e contraste visual." })
423
- ] })
424
- ] }),
425
- /* @__PURE__ */ jsxs3("div", { className: "divide-y divide-border-subtle rounded-sm border border-border-default bg-surface-card px-3", children: [
426
- /* @__PURE__ */ jsxs3("div", { className: "flex min-h-16 items-center justify-between gap-4 py-3", children: [
427
- /* @__PURE__ */ jsxs3("span", { className: "font-semibold", children: [
428
- "Tema ",
429
- isDark ? "escuro" : "claro"
430
- ] }),
431
- /* @__PURE__ */ jsx3(
432
- InputSwitch_default,
433
- {
434
- "aria-label": "Alternar tema claro ou escuro",
435
- variant: "theme",
436
- size: "lg",
437
- checked: isDark,
438
- disabled: preferences.colorScheme === "system",
439
- onChange: (enabled) => update(
440
- { colorScheme: enabled ? "dark" : "light", highContrastTheme: enabled ? "dark" : "light" },
441
- `Tema ${enabled ? "escuro" : "claro"} ativado.`
442
- )
443
- }
444
- )
445
- ] }),
446
- /* @__PURE__ */ jsxs3("label", { className: "flex min-h-14 cursor-pointer items-start gap-3 py-3", children: [
447
- /* @__PURE__ */ jsx3(
448
- "input",
449
- {
450
- type: "checkbox",
451
- className: "checkbox-control mt-0.5",
452
- checked: preferences.colorScheme === "system",
453
- onChange: (event) => update(
454
- { colorScheme: event.target.checked ? "system" : isDark ? "dark" : "light" },
455
- event.target.checked ? "Tema definido pelo dispositivo." : "Tema do dispositivo desativado."
456
- )
457
- }
458
- ),
459
- /* @__PURE__ */ jsx3("span", { className: "font-semibold", children: "Usar configura\xE7\xE3o do dispositivo" })
460
- ] }),
461
- /* @__PURE__ */ jsxs3("div", { className: "flex min-h-16 items-center justify-between gap-4 py-3", children: [
462
- /* @__PURE__ */ jsxs3("span", { className: "flex items-center gap-1.5 font-semibold", children: [
463
- /* @__PURE__ */ jsx3(MdContrast, { "aria-hidden": "true", className: "h-4 w-4" }),
464
- "Alto contraste"
465
- ] }),
466
- /* @__PURE__ */ jsx3(
467
- InputSwitch_default,
468
- {
469
- "aria-label": "Alternar alto contraste",
470
- checked: preferences.highContrast,
471
- size: "lg",
472
- onChange: (enabled) => update({ highContrast: enabled }, `Alto contraste ${enabled ? "ativado" : "desativado"}.`)
473
- }
474
- )
475
- ] })
476
- ] })
477
- ] }),
478
- /* @__PURE__ */ jsxs3("fieldset", { className: sectionClass, children: [
479
- /* @__PURE__ */ jsx3("legend", { className: "sr-only", children: "Tamanho do texto" }),
480
- /* @__PURE__ */ jsxs3("div", { className: "mb-4 flex items-start gap-3", children: [
481
- /* @__PURE__ */ jsx3("span", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-primary-5 text-primary-1", children: /* @__PURE__ */ jsx3(MdTextFields, { "aria-hidden": "true", className: "h-5 w-5" }) }),
482
- /* @__PURE__ */ jsxs3("div", { children: [
483
- /* @__PURE__ */ jsx3("h3", { className: "font-bold", children: "Tamanho do texto" }),
484
- /* @__PURE__ */ jsx3("p", { className: "text-sm text-content-secondary", children: "Amplie os textos para facilitar a leitura." })
485
- ] })
486
- ] }),
487
- /* @__PURE__ */ jsx3("div", { className: "grid gap-2", children: ["standard", "large", "extra-large"].map((scale) => /* @__PURE__ */ jsxs3("label", { className: `${choiceClass} items-center`, children: [
488
- /* @__PURE__ */ jsx3("input", { type: "radio", name: `${titleId}-font-scale`, value: scale, checked: preferences.fontScale === scale, onChange: () => update({ fontScale: scale }, `Tamanho do texto alterado.`), className: "radio-control shrink-0" }),
489
- /* @__PURE__ */ jsx3("span", { className: "flex w-9 shrink-0 justify-center font-extrabold text-primary-1", children: "Aa" }),
490
- /* @__PURE__ */ jsx3("span", { className: "font-semibold", children: scale === "standard" ? "Padr\xE3o" : scale === "large" ? "Grande" : "Muito grande" })
491
- ] }, scale)) })
492
- ] }),
493
- /* @__PURE__ */ jsxs3("fieldset", { className: `${sectionClass} desktop:col-span-2`, children: [
494
- /* @__PURE__ */ jsx3("legend", { className: "sr-only", children: "Leitura e navega\xE7\xE3o" }),
495
- /* @__PURE__ */ jsxs3("div", { className: "mb-4 flex items-start gap-3", children: [
496
- /* @__PURE__ */ jsx3("span", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-primary-5 text-primary-1", children: /* @__PURE__ */ jsx3(MdAccessibilityNew, { "aria-hidden": "true", className: "h-5 w-5" }) }),
497
- /* @__PURE__ */ jsxs3("div", { children: [
498
- /* @__PURE__ */ jsx3("h3", { className: "font-bold", children: "Leitura e navega\xE7\xE3o" }),
499
- /* @__PURE__ */ jsx3("p", { className: "text-sm text-content-secondary", children: "Ajustes para reduzir distra\xE7\xF5es e facilitar a orienta\xE7\xE3o." })
500
- ] })
501
- ] }),
502
- /* @__PURE__ */ jsx3("div", { className: "grid gap-3 tablet:grid-cols-3", children: readingOptions.map(({ key, label, description, Icon }) => /* @__PURE__ */ jsxs3("label", { className: `${choiceClass} items-start`, children: [
503
- /* @__PURE__ */ jsx3("input", { type: "checkbox", checked: preferences[key], onChange: (event) => update({ [key]: event.target.checked }, `${label} ${event.target.checked ? "ativado" : "desativado"}.`), className: "checkbox-control mt-1" }),
504
- /* @__PURE__ */ jsxs3("span", { children: [
505
- /* @__PURE__ */ jsxs3("span", { className: "flex items-center gap-2 font-semibold", children: [
506
- /* @__PURE__ */ jsx3(Icon, { "aria-hidden": "true", className: "h-5 w-5 shrink-0 text-primary-1" }),
507
- label
508
- ] }),
509
- /* @__PURE__ */ jsx3("span", { className: "mt-1 block text-sm text-content-secondary", children: description })
510
- ] })
511
- ] }, key)) })
512
- ] })
609
+ /* @__PURE__ */ jsx8("p", { className: "mt-2 text-center text-sm text-content-secondary", children: "As altera\xE7\xF5es s\xE3o aplicadas pelo consumidor do componente." }),
610
+ /* @__PURE__ */ jsxs8("div", { className: "mt-5 grid gap-4 desktop:grid-cols-2", children: [
611
+ /* @__PURE__ */ jsx8(
612
+ ThemePreference,
613
+ {
614
+ value: preferences.colorScheme,
615
+ onChange: (colorScheme) => update(
616
+ __spreadValues({
617
+ colorScheme
618
+ }, colorScheme === "system" ? {} : {
619
+ highContrastTheme: colorScheme === "dark" ? "dark" : "light"
620
+ }),
621
+ `Tema ${colorScheme === "dark" ? "escuro" : colorScheme === "light" ? "claro" : "do dispositivo"} ativado.`
622
+ )
623
+ }
624
+ ),
625
+ /* @__PURE__ */ jsx8(
626
+ ContrastPreference,
627
+ {
628
+ checked: preferences.highContrast,
629
+ onChange: (highContrast) => update(
630
+ { highContrast },
631
+ `Alto contraste ${highContrast ? "ativado" : "desativado"}.`
632
+ )
633
+ }
634
+ ),
635
+ /* @__PURE__ */ jsx8(
636
+ FontSizePreference,
637
+ {
638
+ value: preferences.fontScale,
639
+ onChange: (fontScale) => update({ fontScale }, "Tamanho do texto alterado.")
640
+ }
641
+ ),
642
+ /* @__PURE__ */ jsx8(
643
+ ReadingPreferences,
644
+ {
645
+ reduceMotion: preferences.reduceMotion,
646
+ emphasizeFocus: preferences.emphasizeFocus,
647
+ underlineLinks: preferences.underlineLinks,
648
+ onChange: (changes) => {
649
+ const key = Object.keys(changes)[0];
650
+ const label = key === "reduceMotion" ? "Reduzir anima\xE7\xF5es" : key === "emphasizeFocus" ? "Destacar foco" : "Sublinhar links";
651
+ update(
652
+ changes,
653
+ `${label} ${changes[key] ? "ativado" : "desativado"}.`
654
+ );
655
+ }
656
+ }
657
+ )
513
658
  ] }),
514
- /* @__PURE__ */ jsx3("div", { className: "mt-5 flex justify-center border-t border-border-subtle pt-4 tablet:justify-start", children: /* @__PURE__ */ jsxs3("button", { type: "button", onClick: () => {
515
- onReset == null ? void 0 : onReset();
516
- setAnnouncement("Configura\xE7\xF5es padr\xE3o restauradas.");
517
- }, className: "inline-flex min-h-11 items-center gap-2 rounded-sm border-2 border-action-primary px-4 font-bold text-content-link hover:bg-surface-muted focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring", children: [
518
- /* @__PURE__ */ jsx3(MdRestartAlt, { "aria-hidden": "true", className: "h-5 w-5" }),
519
- "Restaurar configura\xE7\xF5es padr\xE3o"
520
- ] }) }),
521
- /* @__PURE__ */ jsx3("p", { className: "sr-only", role: "status", "aria-live": "polite", children: announcement })
659
+ /* @__PURE__ */ jsx8("div", { className: "mt-5 flex justify-center border-t border-border-subtle pt-4 tablet:justify-start", children: /* @__PURE__ */ jsxs8(
660
+ "button",
661
+ {
662
+ type: "button",
663
+ onClick: () => {
664
+ onReset == null ? void 0 : onReset();
665
+ setAnnouncement("Configura\xE7\xF5es padr\xE3o restauradas.");
666
+ },
667
+ className: "inline-flex min-h-11 items-center gap-2 rounded-sm border-2 border-action-primary px-4 font-bold text-content-link hover:bg-surface-muted focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring",
668
+ children: [
669
+ /* @__PURE__ */ jsx8(MdRestartAlt, { "aria-hidden": "true", className: "h-5 w-5" }),
670
+ "Restaurar configura\xE7\xF5es padr\xE3o"
671
+ ]
672
+ }
673
+ ) }),
674
+ /* @__PURE__ */ jsx8("p", { className: "sr-only", role: "status", "aria-live": "polite", children: announcement })
522
675
  ]
523
676
  }
524
677
  )
525
678
  ] });
526
679
  }
527
680
 
681
+ // src/components/accessibility-preferences/types.ts
682
+ var DEFAULT_ACCESSIBILITY_PREFERENCES = {
683
+ colorScheme: "light",
684
+ highContrast: false,
685
+ highContrastTheme: "light",
686
+ fontScale: "standard",
687
+ reduceMotion: false,
688
+ emphasizeFocus: false,
689
+ underlineLinks: false
690
+ };
691
+
528
692
  // src/components/accessibility-preferences/HighContrastToggle.tsx
529
693
  import { MdContrast as MdContrast2 } from "react-icons/md";
530
- import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
694
+ import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
531
695
  function HighContrastToggle({
532
696
  checked,
533
697
  onChange,
534
698
  label = "Alto contraste",
535
699
  className
536
700
  }) {
537
- return /* @__PURE__ */ jsxs4(
701
+ return /* @__PURE__ */ jsxs9(
538
702
  "button",
539
703
  {
540
704
  type: "button",
@@ -542,9 +706,9 @@ function HighContrastToggle({
542
706
  onClick: () => onChange(!checked),
543
707
  className: `inline-flex min-h-11 items-center justify-center gap-2 rounded-sm border-2 border-action-primary-content bg-action-primary px-3 text-sm font-bold text-action-primary-content shadow-sm hover:bg-action-primary-hover active:bg-action-primary-active focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ${className != null ? className : ""}`.trim(),
544
708
  children: [
545
- /* @__PURE__ */ jsx4(MdContrast2, { "aria-hidden": "true", className: "h-5 w-5" }),
546
- /* @__PURE__ */ jsx4("span", { children: label }),
547
- /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", className: "rounded-sm bg-surface-card px-1.5 py-0.5 text-xs text-content-primary", children: checked ? "Ativado" : "Desativado" })
709
+ /* @__PURE__ */ jsx9(MdContrast2, { "aria-hidden": "true", className: "h-5 w-5" }),
710
+ /* @__PURE__ */ jsx9("span", { children: label }),
711
+ /* @__PURE__ */ jsx9("span", { "aria-hidden": "true", className: "rounded-sm bg-surface-card px-1.5 py-0.5 text-xs text-content-primary", children: checked ? "Ativado" : "Desativado" })
548
712
  ]
549
713
  }
550
714
  );
@@ -553,8 +717,12 @@ function HighContrastToggle({
553
717
  export {
554
718
  Modal_default,
555
719
  InputSwitch_default,
556
- DEFAULT_ACCESSIBILITY_PREFERENCES,
720
+ ContrastPreference,
721
+ FontSizePreference,
722
+ ReadingPreferences,
723
+ ThemePreference,
557
724
  AccessibilityPreferencesPanel,
725
+ DEFAULT_ACCESSIBILITY_PREFERENCES,
558
726
  HighContrastToggle
559
727
  };
560
- //# sourceMappingURL=chunk-JSPXVXUY.js.map
728
+ //# sourceMappingURL=chunk-DO5C67KS.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/Modal/Modal.tsx","../src/components/InputSwitch/InputSwitch.tsx","../src/components/InputSwitch/InputSwitch.style.ts","../src/components/accessibility-preferences/ContrastPreference.tsx","../src/components/accessibility-preferences/PreferenceSection.tsx","../src/components/accessibility-preferences/FontSizePreference.tsx","../src/components/accessibility-preferences/ReadingPreferences.tsx","../src/components/accessibility-preferences/ThemePreference.tsx","../src/components/accessibility-preferences/AccessibilityPreferencesPanel.tsx","../src/components/accessibility-preferences/types.ts","../src/components/accessibility-preferences/HighContrastToggle.tsx"],"sourcesContent":["\"use client\";\n\nimport React, { Fragment } from \"react\";\nimport {\n MdCheckCircle,\n MdCancel,\n MdDeleteForever,\n MdOutlineClose,\n MdDownload,\n MdSend,\n MdErrorOutline,\n} from \"react-icons/md\";\nimport {\n Transition,\n Dialog,\n TransitionChild,\n DialogTitle,\n DialogPanel,\n} from \"@headlessui/react\";\n\nexport type ModalProps = {\n children?: React.ReactNode;\n isOpen: boolean;\n title?: string;\n onClose: () => void;\n showIcon?: boolean;\n variant?:\n | \"success\"\n | \"error\"\n | \"warning\"\n | \"delete\"\n | \"downloading\"\n | \"sendMessage\";\n size?: \"small\" | \"medium\" | \"large\" | \"viewer\" | \"full\";\n className?: string;\n} & React.HTMLAttributes<HTMLDivElement>;\n\nconst modalMaxWidths = {\n small: \"28rem\",\n medium: \"42rem\",\n large: \"56rem\",\n viewer: \"72rem\",\n full: \"calc(100vw - 40px)\",\n} as const;\n\nconst Modal = ({\n children,\n isOpen,\n onClose,\n className,\n style,\n title,\n showIcon = true,\n variant = \"success\",\n size = \"small\",\n}: ModalProps) => {\n const variantStyles = {\n success: {\n bgColor: \"bg-feedback-success-soft\",\n icon: <MdCheckCircle className=\"h-6 w-6 text-feedback-success-content\" />,\n },\n error: {\n bgColor: \"bg-feedback-danger-soft\",\n icon: <MdCancel className=\"h-6 w-6 text-feedback-danger-content\" />,\n },\n warning: {\n bgColor: \"bg-feedback-warning-soft\",\n icon: (\n <MdErrorOutline className=\"h-6 w-6 text-feedback-warning-content\" />\n ),\n },\n downloading: {\n bgColor: \"bg-feedback-info-soft\",\n icon: <MdDownload className=\"h-6 w-6 text-feedback-info-content\" />,\n },\n delete: {\n bgColor: \"bg-feedback-info-soft\",\n icon: <MdDeleteForever className=\"h-6 w-6 text-feedback-info-content\" />,\n },\n sendMessage: {\n bgColor: \"bg-feedback-info-soft\",\n icon: <MdSend className=\"h-6 w-6 text-feedback-info-content\" />,\n },\n };\n\n const { bgColor, icon } = variantStyles[variant];\n\n return (\n <Transition appear show={isOpen} as={Fragment}>\n <Dialog\n as=\"div\"\n className=\"relative z-modal gap-0\"\n aria-label={title ? undefined : \"Janela de diálogo\"}\n onClose={onClose}\n >\n <TransitionChild\n as={Fragment}\n enter=\"ease-out duration-300\"\n enterFrom=\"opacity-0\"\n enterTo=\"opacity-100\"\n leave=\"ease-in duration-200\"\n leaveFrom=\"opacity-100\"\n leaveTo=\"opacity-0\"\n >\n <div className=\"fixed inset-0 bg-overlay/50 backdrop-blur-[1px]\" />\n </TransitionChild>\n <div className=\"portal-safe-modal fixed inset-0 overflow-y-auto gap-0\">\n <div className=\"flex min-h-full items-center justify-center p-5 gap-0\">\n <DialogPanel\n className={`relative flex max-h-[calc(100dvh-40px)] max-w-[calc(100vw-40px)] flex-col space-y-5 overflow-x-hidden overflow-y-auto rounded-sm bg-surface-card p-5 shadow-md transition-all ${className ?? \"\"}`}\n style={{\n ...style,\n width: \"100%\",\n maxWidth: modalMaxWidths[size],\n }}\n >\n <div className=\"absolute right-5 top-5 flex items-center justify-end\">\n <button\n type=\"button\"\n aria-label=\"Fechar janela\"\n onClick={onClose}\n className=\"inline-flex h-6 w-6 touch-manipulation items-center justify-center rounded-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring\"\n >\n <MdOutlineClose\n aria-hidden=\"true\"\n size={20}\n className=\"text-content-secondary\"\n />\n </button>\n </div>\n\n {showIcon && (\n <div aria-hidden=\"true\" className=\"flex justify-center p-0\">\n <div\n className={`inline-flex items-center justify-center w-12 h-12 rounded-full ${bgColor}`}\n >\n {icon}\n </div>\n </div>\n )}\n\n <div className=\"space-y-3\">\n {title && (\n <DialogTitle\n as=\"h3\"\n className=\"text-xl font-extrabold text-center\"\n >\n {title}\n </DialogTitle>\n )}\n {children}\n </div>\n </DialogPanel>\n </div>\n </div>\n </Dialog>\n </Transition>\n );\n};\n\nexport default Modal;\n\n","\"use client\";\n\nimport {\n Switch as HeadlessSwitch,\n} from \"@headlessui/react\";\nimport React, { useState } from \"react\";\nimport useStyle from \"./InputSwitch.style\";\nimport { MdCheck, MdOutlineClose, MdSunny, MdNightsStay } from \"react-icons/md\";\nimport type { IconType } from \"react-icons\";\n\ntype NativeSwitchProps = {\n id?: string;\n name?: string;\n value?: string;\n form?: string;\n autoFocus?: boolean;\n tabIndex?: number;\n} & (\n | {\n \"aria-label\": string;\n \"aria-labelledby\"?: never;\n }\n | {\n \"aria-label\"?: never;\n \"aria-labelledby\": string;\n }\n);\n\nexport type InputSwitchProps = {\n defaultEnable?: boolean;\n checked?: boolean;\n variant?: \"primary\" | \"secondary\" | \"tertiary\" | \"contract\" | \"theme\";\n size?: \"sm\" | \"md\" | \"lg\";\n disabled?: boolean;\n onChange?: (enabled: boolean) => void;\n icon?: IconType;\n} & NativeSwitchProps;\n\nexport type InputSwitchStyleProps = Pick<\n InputSwitchProps,\n \"variant\" | \"disabled\" | \"size\"\n> & {\n enabled: boolean;\n};\n\nexport type SwitchProps = InputSwitchProps;\n\nconst InputSwitch: React.FC<InputSwitchProps> = ({\n defaultEnable: enabledByDefault,\n variant = \"primary\",\n size = \"md\",\n disabled,\n onChange,\n checked,\n icon: Icon,\n ...rest\n}) => {\n const [enabled, setEnabled] = useState(enabledByDefault ?? false);\n const resolvedEnabled = typeof checked === \"boolean\" ? checked : enabled;\n const style = useStyle({\n variant,\n enabled: resolvedEnabled,\n disabled,\n size,\n });\n\n const toggle = () => {\n const newState = !resolvedEnabled;\n if (typeof checked !== \"boolean\") {\n setEnabled(newState);\n }\n onChange?.(newState);\n };\n return (\n <HeadlessSwitch\n checked={resolvedEnabled}\n onChange={toggle}\n disabled={disabled ?? false}\n className={style.Container}\n {...rest}\n >\n {variant !== \"contract\" && variant !== \"theme\" && (\n <span className={style.Switch}>\n {Icon && <Icon aria-hidden=\"true\" className={style.Icon} />}\n </span>\n )}\n {variant === \"contract\" && (\n <span className={style.Switch}>\n {resolvedEnabled && (\n <MdCheck className={style.Icon} aria-disabled={disabled} />\n )}\n {resolvedEnabled || (\n <MdOutlineClose className={style.Icon} aria-disabled={disabled} />\n )}\n </span>\n )}\n\n {variant === \"theme\" && (\n <span className={style.SwitchTheme}>\n {resolvedEnabled && (\n <MdNightsStay\n className={style.IconTheme}\n aria-disabled={disabled}\n />\n )}\n {resolvedEnabled || (\n <MdSunny className={style.IconTheme} aria-disabled={disabled} />\n )}\n </span>\n )}\n </HeadlessSwitch>\n );\n};\n\nexport default InputSwitch;\n\n","import { cva } from \"class-variance-authority\";\nimport classNames from \"classnames\";\nimport { InputSwitchProps, InputSwitchStyleProps } from \"./InputSwitch\";\n\nconst SIZE_STYLES: Record<\n NonNullable<InputSwitchProps[\"size\"]>,\n {\n container: string;\n knob: string;\n icon: string;\n }\n> = {\n sm: {\n container:\n \"h-[1rem] w-[1.75rem] [--switch-padding:2px] [--switch-knob-size:0.75rem] [--switch-width:1.75rem]\",\n knob: \"h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]\",\n icon: \"h-2 w-2\",\n },\n md: {\n container:\n \"h-[1.25rem] w-[3rem] [--switch-padding:2px] [--switch-knob-size:1rem] [--switch-width:3rem]\",\n knob: \"h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]\",\n icon: \"h-3 w-3\",\n },\n lg: {\n container:\n \"h-[1.5rem] w-[3.5rem] [--switch-padding:2px] [--switch-knob-size:1.25rem] [--switch-width:3.5rem]\",\n knob: \"h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]\",\n icon: \"h-4 w-4\",\n },\n};\n\nconst getInputSwitchStyles = ({\n variant,\n enabled,\n disabled,\n size = \"md\",\n}: InputSwitchStyleProps) => {\n const sizeStyle = SIZE_STYLES[size];\n const containerVariant = cva(\n classNames(\n \"switch-control relative inline-flex shrink-0 items-center rounded-full transition-colors before:absolute before:left-1/2 before:top-1/2 before:h-5 before:w-full before:min-w-5 before:-translate-x-1/2 before:-translate-y-1/2 before:content-[''] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-1 disabled:bg-switch-track-disabled\",\n sizeStyle.container,\n { \"pointer-events-none\": disabled },\n ),\n {\n variants: {\n variant: {\n primary: classNames(\n \"[--switch-state-layer:var(--switch-track-primary-on)]\",\n { \"bg-switch-track-primary-on\": enabled },\n { \"bg-switch-track-off\": !enabled },\n ),\n secondary: classNames(\n \"[--switch-state-layer:var(--switch-track-secondary-on)]\",\n { \"bg-switch-track-secondary-on\": enabled },\n { \"bg-switch-track-off\": !enabled },\n ),\n tertiary: classNames(\n \"[--switch-state-layer:var(--switch-track-tertiary-on)]\",\n { \"bg-switch-track-tertiary-on\": enabled },\n { \"bg-switch-track-off\": !enabled },\n ),\n contract: classNames(\n enabled\n ? \"bg-switch-track-contract-on [--switch-state-layer:var(--switch-track-contract-on)]\"\n : \"bg-switch-track-contract-off [--switch-state-layer:var(--switch-track-contract-off)]\",\n ),\n theme: classNames(\n enabled\n ? \"bg-switch-track-theme-on [--switch-state-layer:var(--switch-track-theme-on)]\"\n : \"bg-switch-track-theme-off [--switch-state-layer:var(--switch-track-theme-off)]\",\n ),\n },\n },\n defaultVariants: {\n variant: \"primary\",\n },\n },\n );\n const containerClasses = containerVariant({ variant });\n\n const switchClasses = classNames(\n \"switch-knob absolute left-[var(--switch-padding)] top-1/2 flex items-center justify-center rounded-full transition-[transform,box-shadow,background-color] duration-200 ease-in-out -translate-y-1/2\",\n sizeStyle.knob,\n disabled ? \"bg-switch-knob-disabled\" : \"bg-switch-knob\",\n enabled\n ? \"translate-x-[calc(var(--switch-width)-var(--switch-knob-size)-var(--switch-padding)*2)]\"\n : \"translate-x-0\",\n );\n\n const switchClassesTheme = classNames(\n \"switch-knob absolute left-[var(--switch-padding)] top-1/2 flex items-center justify-center rounded-full transition-[transform,box-shadow,background-color] duration-200 ease-in-out -translate-y-1/2\",\n sizeStyle.knob,\n {\n \"bg-switch-knob-theme-on\": enabled && !disabled,\n \"bg-switch-knob\": !enabled && !disabled,\n \"bg-switch-knob-disabled\": disabled,\n \"translate-x-[calc(var(--switch-width)-var(--switch-knob-size)-var(--switch-padding)*2)]\":\n enabled,\n \"translate-x-0\": !enabled,\n },\n );\n\n const iconClasses = classNames(\n \"aria-disabled:text-font-disabled\",\n sizeStyle.icon,\n { \"text-feedback-success-content\": enabled && !disabled },\n { \"text-feedback-danger-content\": !enabled && !disabled },\n { \"text-content-disabled\": disabled },\n );\n\n const iconClassesTheme = classNames(\n \"aria-disabled:text-font-disabled\",\n sizeStyle.icon,\n { \"text-content-inverse\": enabled && !disabled },\n { \"text-feedback-warning-content\": !enabled && !disabled },\n { \"text-content-disabled\": disabled },\n );\n\n return {\n Icon: iconClasses,\n IconTheme: iconClassesTheme,\n Switch: switchClasses,\n SwitchTheme: switchClassesTheme,\n Container: containerClasses,\n };\n};\n\nexport default getInputSwitchStyles;\n\n","import { MdContrast } from \"react-icons/md\";\nimport InputSwitch from \"../InputSwitch/InputSwitch\";\nimport PreferenceSection from \"./PreferenceSection\";\n\nexport type ContrastPreferenceProps = {\n checked: boolean;\n onChange: (checked: boolean) => void;\n className?: string;\n};\n\nexport default function ContrastPreference({\n checked,\n onChange,\n className,\n}: ContrastPreferenceProps) {\n return (\n <PreferenceSection\n title=\"Contraste\"\n description=\"Aumente a diferenciação entre conteúdo e superfície.\"\n icon={MdContrast}\n className={className}\n >\n <div className=\"flex min-h-16 items-center justify-between gap-4 rounded-sm border border-border-default bg-surface-card px-3 py-3\">\n <span className=\"flex items-center gap-1.5 font-semibold\">\n <MdContrast aria-hidden=\"true\" className=\"h-4 w-4\" />\n Alto contraste\n </span>\n <InputSwitch\n aria-label=\"Alternar alto contraste\"\n checked={checked}\n size=\"lg\"\n onChange={onChange}\n />\n </div>\n </PreferenceSection>\n );\n}\n","import type { IconType } from \"react-icons\";\n\nexport type PreferenceSectionProps = {\n title: string;\n description: string;\n icon: IconType;\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function PreferenceSection({\n title,\n description,\n icon: Icon,\n children,\n className,\n}: PreferenceSectionProps) {\n return (\n <fieldset\n className={`rounded-md border border-border-default bg-surface-subtle p-4 tablet:p-5 ${className ?? \"\"}`.trim()}\n >\n <legend className=\"sr-only\">{title}</legend>\n <div className=\"mb-4 flex items-start gap-3\">\n <span className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-primary-5 text-primary-1\">\n <Icon aria-hidden=\"true\" className=\"h-5 w-5\" />\n </span>\n <div>\n <h3 className=\"font-bold\">{title}</h3>\n <p className=\"text-sm text-content-secondary\">{description}</p>\n </div>\n </div>\n {children}\n </fieldset>\n );\n}\n","import { useId } from \"react\";\nimport { MdTextFields } from \"react-icons/md\";\nimport PreferenceSection from \"./PreferenceSection\";\nimport type { AccessibilityFontScale } from \"./types\";\n\nconst FONT_SCALE_OPTIONS: Array<{\n value: AccessibilityFontScale;\n label: string;\n}> = [\n { value: \"standard\", label: \"Padrão\" },\n { value: \"large\", label: \"Grande\" },\n { value: \"extra-large\", label: \"Muito grande\" },\n];\n\nexport type FontSizePreferenceProps = {\n value: AccessibilityFontScale;\n onChange: (value: AccessibilityFontScale) => void;\n className?: string;\n};\n\nexport default function FontSizePreference({\n value,\n onChange,\n className,\n}: FontSizePreferenceProps) {\n const groupId = useId();\n\n return (\n <PreferenceSection\n title=\"Tamanho do texto\"\n description=\"Amplie os textos para facilitar a leitura.\"\n icon={MdTextFields}\n className={className}\n >\n <div className=\"grid gap-2\">\n {FONT_SCALE_OPTIONS.map((option) => (\n <label\n key={option.value}\n className=\"flex min-h-11 cursor-pointer items-center gap-3 rounded-sm border border-border-default bg-surface-card p-3 text-content-primary transition-colors hover:border-border-strong hover:bg-surface-muted\"\n >\n <input\n type=\"radio\"\n name={`${groupId}-font-scale`}\n value={option.value}\n checked={value === option.value}\n onChange={() => onChange(option.value)}\n className=\"radio-control shrink-0\"\n />\n <span className=\"flex w-9 shrink-0 justify-center font-extrabold text-primary-1\">\n Aa\n </span>\n <span className=\"font-semibold\">{option.label}</span>\n </label>\n ))}\n </div>\n </PreferenceSection>\n );\n}\n","import {\n MdAccessibilityNew,\n MdAnimation,\n MdCenterFocusStrong,\n MdLink,\n} from \"react-icons/md\";\nimport PreferenceSection from \"./PreferenceSection\";\nimport type { AccessibilityPreferences } from \"./types\";\n\ntype ReadingPreferenceKey =\n | \"reduceMotion\"\n | \"emphasizeFocus\"\n | \"underlineLinks\";\n\nconst READING_OPTIONS: Array<{\n key: ReadingPreferenceKey;\n label: string;\n description: string;\n Icon: typeof MdAnimation;\n}> = [\n {\n key: \"reduceMotion\",\n label: \"Reduzir animações\",\n description: \"Minimiza animações, transições e rolagens suaves.\",\n Icon: MdAnimation,\n },\n {\n key: \"emphasizeFocus\",\n label: \"Destacar foco\",\n description: \"Evidencia o elemento selecionado durante o uso do teclado.\",\n Icon: MdCenterFocusStrong,\n },\n {\n key: \"underlineLinks\",\n label: \"Sublinhar links\",\n description: \"Mantém links de texto sublinhados fora do foco.\",\n Icon: MdLink,\n },\n];\n\nexport type ReadingPreferencesProps = Pick<\n AccessibilityPreferences,\n ReadingPreferenceKey\n> & {\n onChange: (\n changes: Partial<Pick<AccessibilityPreferences, ReadingPreferenceKey>>,\n ) => void;\n className?: string;\n};\n\nexport default function ReadingPreferences({\n reduceMotion,\n emphasizeFocus,\n underlineLinks,\n onChange,\n className,\n}: ReadingPreferencesProps) {\n const values = { reduceMotion, emphasizeFocus, underlineLinks };\n\n return (\n <PreferenceSection\n title=\"Leitura e navegação\"\n description=\"Ajustes para reduzir distrações e facilitar a orientação.\"\n icon={MdAccessibilityNew}\n className={`desktop:col-span-2 ${className ?? \"\"}`.trim()}\n >\n <div className=\"grid gap-3 tablet:grid-cols-3\">\n {READING_OPTIONS.map(({ key, label, description, Icon }) => (\n <label\n key={key}\n className=\"flex min-h-11 cursor-pointer items-start gap-3 rounded-sm border border-border-default bg-surface-card p-3 text-content-primary transition-colors hover:border-border-strong hover:bg-surface-muted\"\n >\n <input\n type=\"checkbox\"\n aria-label={label}\n checked={values[key]}\n onChange={(event) => onChange({ [key]: event.target.checked })}\n className=\"checkbox-control mt-1\"\n />\n <span>\n <span className=\"flex items-center gap-2 font-semibold\">\n <Icon aria-hidden=\"true\" className=\"h-5 w-5 shrink-0 text-primary-1\" />\n {label}\n </span>\n <span className=\"mt-1 block text-sm text-content-secondary\">\n {description}\n </span>\n </span>\n </label>\n ))}\n </div>\n </PreferenceSection>\n );\n}\n","import { MdPalette } from \"react-icons/md\";\nimport InputSwitch from \"../InputSwitch/InputSwitch\";\nimport PreferenceSection from \"./PreferenceSection\";\nimport type { AccessibilityColorScheme } from \"./types\";\n\nexport type ThemePreferenceProps = {\n value: AccessibilityColorScheme;\n onChange: (value: AccessibilityColorScheme) => void;\n className?: string;\n};\n\nexport default function ThemePreference({\n value,\n onChange,\n className,\n}: ThemePreferenceProps) {\n const isDark = value === \"dark\";\n const isSystem = value === \"system\";\n\n return (\n <PreferenceSection\n title=\"Aparência\"\n description=\"Tema e esquema de cores da interface.\"\n icon={MdPalette}\n className={className}\n >\n <div className=\"divide-y divide-border-subtle rounded-sm border border-border-default bg-surface-card px-3\">\n <div className=\"flex min-h-16 items-center justify-between gap-4 py-3\">\n <span className=\"font-semibold\">Tema {isDark ? \"escuro\" : \"claro\"}</span>\n <InputSwitch\n aria-label=\"Alternar tema claro ou escuro\"\n variant=\"theme\"\n size=\"lg\"\n checked={isDark}\n disabled={isSystem}\n onChange={(enabled) => onChange(enabled ? \"dark\" : \"light\")}\n />\n </div>\n <label className=\"flex min-h-14 cursor-pointer items-start gap-3 py-3\">\n <input\n type=\"checkbox\"\n className=\"checkbox-control mt-0.5\"\n checked={isSystem}\n onChange={(event) =>\n onChange(event.target.checked ? \"system\" : isDark ? \"dark\" : \"light\")\n }\n />\n <span className=\"font-semibold\">Usar configuração do dispositivo</span>\n </label>\n </div>\n </PreferenceSection>\n );\n}\n","\"use client\";\n\nimport { useState } from \"react\";\nimport { MdAccessibilityNew, MdRestartAlt } from \"react-icons/md\";\nimport Modal from \"../Modal/Modal\";\nimport ContrastPreference from \"./ContrastPreference\";\nimport FontSizePreference from \"./FontSizePreference\";\nimport ReadingPreferences from \"./ReadingPreferences\";\nimport ThemePreference from \"./ThemePreference\";\nimport type { AccessibilityPreferences } from \"./types\";\n\nexport type AccessibilityPreferencesPanelProps = {\n preferences: AccessibilityPreferences;\n onPreferencesChange: (\n changes: Partial<AccessibilityPreferences>,\n ) => void;\n onReset?: () => void;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n showTrigger?: boolean;\n triggerLabel?: string;\n className?: string;\n};\n\nexport default function AccessibilityPreferencesPanel({\n preferences,\n onPreferencesChange,\n onReset,\n isOpen: controlledOpen,\n onOpenChange,\n showTrigger = true,\n triggerLabel = \"Preferências de acessibilidade\",\n className,\n}: AccessibilityPreferencesPanelProps) {\n const [internalOpen, setInternalOpen] = useState(false);\n const [announcement, setAnnouncement] = useState(\"\");\n const isOpen = controlledOpen ?? internalOpen;\n\n const setOpen = (open: boolean) => {\n if (controlledOpen === undefined) setInternalOpen(open);\n onOpenChange?.(open);\n };\n\n const update = (\n changes: Partial<AccessibilityPreferences>,\n message: string,\n ) => {\n onPreferencesChange(changes);\n setAnnouncement(message);\n };\n\n return (\n <>\n {showTrigger && (\n <button\n type=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={isOpen}\n onClick={() => setOpen(true)}\n className={`inline-flex min-h-11 items-center justify-center gap-2 rounded-sm border-2 border-action-primary-content bg-action-primary px-3 text-sm font-bold text-action-primary-content shadow-sm hover:bg-action-primary-hover focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ${className ?? \"\"}`.trim()}\n >\n <MdAccessibilityNew aria-hidden=\"true\" className=\"h-5 w-5\" />\n <span>{triggerLabel}</span>\n </button>\n )}\n\n <Modal\n isOpen={isOpen}\n onClose={() => setOpen(false)}\n title={triggerLabel}\n showIcon={false}\n size=\"large\"\n >\n <p className=\"mt-2 text-center text-sm text-content-secondary\">\n As alterações são aplicadas pelo consumidor do componente.\n </p>\n\n <div className=\"mt-5 grid gap-4 desktop:grid-cols-2\">\n <ThemePreference\n value={preferences.colorScheme}\n onChange={(colorScheme) =>\n update(\n {\n colorScheme,\n ...(colorScheme === \"system\"\n ? {}\n : {\n highContrastTheme:\n colorScheme === \"dark\" ? \"dark\" : \"light\",\n }),\n },\n `Tema ${colorScheme === \"dark\" ? \"escuro\" : colorScheme === \"light\" ? \"claro\" : \"do dispositivo\"} ativado.`,\n )\n }\n />\n <ContrastPreference\n checked={preferences.highContrast}\n onChange={(highContrast) =>\n update(\n { highContrast },\n `Alto contraste ${highContrast ? \"ativado\" : \"desativado\"}.`,\n )\n }\n />\n <FontSizePreference\n value={preferences.fontScale}\n onChange={(fontScale) =>\n update({ fontScale }, \"Tamanho do texto alterado.\")\n }\n />\n <ReadingPreferences\n reduceMotion={preferences.reduceMotion}\n emphasizeFocus={preferences.emphasizeFocus}\n underlineLinks={preferences.underlineLinks}\n onChange={(changes) => {\n const key = Object.keys(changes)[0] as\n | \"reduceMotion\"\n | \"emphasizeFocus\"\n | \"underlineLinks\";\n const label =\n key === \"reduceMotion\"\n ? \"Reduzir animações\"\n : key === \"emphasizeFocus\"\n ? \"Destacar foco\"\n : \"Sublinhar links\";\n update(\n changes,\n `${label} ${changes[key] ? \"ativado\" : \"desativado\"}.`,\n );\n }}\n />\n </div>\n <div className=\"mt-5 flex justify-center border-t border-border-subtle pt-4 tablet:justify-start\">\n <button\n type=\"button\"\n onClick={() => {\n onReset?.();\n setAnnouncement(\"Configurações padrão restauradas.\");\n }}\n className=\"inline-flex min-h-11 items-center gap-2 rounded-sm border-2 border-action-primary px-4 font-bold text-content-link hover:bg-surface-muted focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring\"\n >\n <MdRestartAlt aria-hidden=\"true\" className=\"h-5 w-5\" />\n Restaurar configurações padrão\n </button>\n </div>\n <p className=\"sr-only\" role=\"status\" aria-live=\"polite\">\n {announcement}\n </p>\n </Modal>\n </>\n );\n}\n","export type AccessibilityColorScheme = \"system\" | \"light\" | \"dark\";\nexport type AccessibilityHighContrastTheme = \"light\" | \"dark\";\nexport type AccessibilityFontScale = \"standard\" | \"large\" | \"extra-large\";\n\nexport interface AccessibilityPreferences {\n colorScheme: AccessibilityColorScheme;\n highContrast: boolean;\n highContrastTheme: AccessibilityHighContrastTheme;\n fontScale: AccessibilityFontScale;\n reduceMotion: boolean;\n emphasizeFocus: boolean;\n underlineLinks: boolean;\n}\n\nexport const DEFAULT_ACCESSIBILITY_PREFERENCES: AccessibilityPreferences = {\n colorScheme: \"light\",\n highContrast: false,\n highContrastTheme: \"light\",\n fontScale: \"standard\",\n reduceMotion: false,\n emphasizeFocus: false,\n underlineLinks: false,\n};\n","\"use client\";\n\nimport { MdContrast } from \"react-icons/md\";\n\nexport interface HighContrastToggleProps {\n checked: boolean;\n onChange: (checked: boolean) => void;\n label?: string;\n className?: string;\n}\n\nexport default function HighContrastToggle({\n checked,\n onChange,\n label = \"Alto contraste\",\n className,\n}: HighContrastToggleProps) {\n return (\n <button\n type=\"button\"\n aria-pressed={checked}\n onClick={() => onChange(!checked)}\n className={`inline-flex min-h-11 items-center justify-center gap-2 rounded-sm border-2 border-action-primary-content bg-action-primary px-3 text-sm font-bold text-action-primary-content shadow-sm hover:bg-action-primary-hover active:bg-action-primary-active focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ${className ?? \"\"}`.trim()}\n >\n <MdContrast aria-hidden=\"true\" className=\"h-5 w-5\" />\n <span>{label}</span>\n <span aria-hidden=\"true\" className=\"rounded-sm bg-surface-card px-1.5 py-0.5 text-xs text-content-primary\">\n {checked ? \"Ativado\" : \"Desativado\"}\n </span>\n </button>\n );\n}\n"],"mappings":"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","names":["MdOutlineClose","jsx","jsxs","MdOutlineClose","jsx","jsxs","jsx","jsxs","jsx","jsxs","jsx","jsxs","jsx","jsxs","useState","MdAccessibilityNew","Fragment","jsx","jsxs","useState","MdAccessibilityNew","MdContrast","jsx","jsxs"]}