@aspprev/versi-ds 0.1.0

package/dist/chunk-2ACDV5D5.js

@@ -0,0 +1,560 @@
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-2NMEKWO5.js";
+
+// src/components/Modal/Modal.tsx
+import { Fragment } from "react";
+import {
+  MdCheckCircle,
+  MdCancel,
+  MdDeleteForever,
+  MdOutlineClose,
+  MdDownload,
+  MdSend,
+  MdErrorOutline
+} from "react-icons/md";
+import {
+  Transition,
+  Dialog,
+  TransitionChild,
+  DialogTitle,
+  DialogPanel
+} from "@headlessui/react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var modalMaxWidths = {
+  small: "28rem",
+  medium: "42rem",
+  large: "56rem",
+  viewer: "72rem",
+  full: "calc(100vw - 40px)"
+};
+var Modal = ({
+  children,
+  isOpen,
+  onClose,
+  className,
+  style,
+  title,
+  showIcon = true,
+  variant = "success",
+  size = "small"
+}) => {
+  const variantStyles = {
+    success: {
+      bgColor: "bg-feedback-success-soft",
+      icon: /* @__PURE__ */ jsx(MdCheckCircle, { className: "h-6 w-6 text-feedback-success-content" })
+    },
+    error: {
+      bgColor: "bg-feedback-danger-soft",
+      icon: /* @__PURE__ */ jsx(MdCancel, { className: "h-6 w-6 text-feedback-danger-content" })
+    },
+    warning: {
+      bgColor: "bg-feedback-warning-soft",
+      icon: /* @__PURE__ */ jsx(MdErrorOutline, { className: "h-6 w-6 text-feedback-warning-content" })
+    },
+    downloading: {
+      bgColor: "bg-feedback-info-soft",
+      icon: /* @__PURE__ */ jsx(MdDownload, { className: "h-6 w-6 text-feedback-info-content" })
+    },
+    delete: {
+      bgColor: "bg-feedback-info-soft",
+      icon: /* @__PURE__ */ jsx(MdDeleteForever, { className: "h-6 w-6 text-feedback-info-content" })
+    },
+    sendMessage: {
+      bgColor: "bg-feedback-info-soft",
+      icon: /* @__PURE__ */ jsx(MdSend, { className: "h-6 w-6 text-feedback-info-content" })
+    }
+  };
+  const { bgColor, icon } = variantStyles[variant];
+  return /* @__PURE__ */ jsx(Transition, { appear: true, show: isOpen, as: Fragment, children: /* @__PURE__ */ jsxs(
+    Dialog,
+    {
+      as: "div",
+      className: "relative z-modal gap-0",
+      "aria-label": title ? void 0 : "Janela de di\xE1logo",
+      onClose,
+      children: [
+        /* @__PURE__ */ jsx(
+          TransitionChild,
+          {
+            as: Fragment,
+            enter: "ease-out duration-300",
+            enterFrom: "opacity-0",
+            enterTo: "opacity-100",
+            leave: "ease-in duration-200",
+            leaveFrom: "opacity-100",
+            leaveTo: "opacity-0",
+            children: /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-overlay/50 backdrop-blur-[1px]" })
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "portal-safe-modal fixed inset-0 overflow-y-auto gap-0", children: /* @__PURE__ */ jsx("div", { className: "flex min-h-full items-center justify-center p-5 gap-0", children: /* @__PURE__ */ jsxs(
+          DialogPanel,
+          {
+            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 != null ? className : ""}`,
+            style: __spreadProps(__spreadValues({}, style), {
+              width: "100%",
+              maxWidth: modalMaxWidths[size]
+            }),
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "absolute right-5 top-5 flex items-center justify-end", children: /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": "Fechar janela",
+                  onClick: onClose,
+                  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",
+                  children: /* @__PURE__ */ jsx(
+                    MdOutlineClose,
+                    {
+                      "aria-hidden": "true",
+                      size: 20,
+                      className: "text-content-secondary"
+                    }
+                  )
+                }
+              ) }),
+              showIcon && /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "flex justify-center p-0", children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: `inline-flex items-center justify-center w-12 h-12 rounded-full ${bgColor}`,
+                  children: icon
+                }
+              ) }),
+              /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                title && /* @__PURE__ */ jsx(
+                  DialogTitle,
+                  {
+                    as: "h3",
+                    className: "text-xl font-extrabold text-center",
+                    children: title
+                  }
+                ),
+                children
+              ] })
+            ]
+          }
+        ) }) })
+      ]
+    }
+  ) });
+};
+var Modal_default = Modal;
+
+// src/components/InputSwitch/InputSwitch.tsx
+import {
+  Switch as HeadlessSwitch
+} from "@headlessui/react";
+import { useState } from "react";
+
+// src/components/InputSwitch/InputSwitch.style.ts
+import { cva } from "class-variance-authority";
+import classNames from "classnames";
+var SIZE_STYLES = {
+  sm: {
+    container: "h-[1rem] w-[1.75rem] [--switch-padding:2px] [--switch-knob-size:0.75rem] [--switch-width:1.75rem]",
+    knob: "h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]",
+    icon: "h-2 w-2"
+  },
+  md: {
+    container: "h-[1.25rem] w-[3rem] [--switch-padding:2px] [--switch-knob-size:1rem] [--switch-width:3rem]",
+    knob: "h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]",
+    icon: "h-3 w-3"
+  },
+  lg: {
+    container: "h-[1.5rem] w-[3.5rem] [--switch-padding:2px] [--switch-knob-size:1.25rem] [--switch-width:3.5rem]",
+    knob: "h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]",
+    icon: "h-4 w-4"
+  }
+};
+var getInputSwitchStyles = ({
+  variant,
+  enabled,
+  disabled,
+  size = "md"
+}) => {
+  const sizeStyle = SIZE_STYLES[size];
+  const containerVariant = cva(
+    classNames(
+      "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",
+      sizeStyle.container,
+      { "pointer-events-none": disabled }
+    ),
+    {
+      variants: {
+        variant: {
+          primary: classNames(
+            "[--switch-state-layer:var(--switch-track-primary-on)]",
+            { "bg-switch-track-primary-on": enabled },
+            { "bg-switch-track-off": !enabled }
+          ),
+          secondary: classNames(
+            "[--switch-state-layer:var(--switch-track-secondary-on)]",
+            { "bg-switch-track-secondary-on": enabled },
+            { "bg-switch-track-off": !enabled }
+          ),
+          tertiary: classNames(
+            "[--switch-state-layer:var(--switch-track-tertiary-on)]",
+            { "bg-switch-track-tertiary-on": enabled },
+            { "bg-switch-track-off": !enabled }
+          ),
+          contract: classNames(
+            enabled ? "bg-switch-track-contract-on [--switch-state-layer:var(--switch-track-contract-on)]" : "bg-switch-track-contract-off [--switch-state-layer:var(--switch-track-contract-off)]"
+          ),
+          theme: classNames(
+            enabled ? "bg-switch-track-theme-on [--switch-state-layer:var(--switch-track-theme-on)]" : "bg-switch-track-theme-off [--switch-state-layer:var(--switch-track-theme-off)]"
+          )
+        }
+      },
+      defaultVariants: {
+        variant: "primary"
+      }
+    }
+  );
+  const containerClasses = containerVariant({ variant });
+  const switchClasses = classNames(
+    "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",
+    sizeStyle.knob,
+    disabled ? "bg-switch-knob-disabled" : "bg-switch-knob",
+    enabled ? "translate-x-[calc(var(--switch-width)-var(--switch-knob-size)-var(--switch-padding)*2)]" : "translate-x-0"
+  );
+  const switchClassesTheme = classNames(
+    "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",
+    sizeStyle.knob,
+    {
+      "bg-switch-knob-theme-on": enabled && !disabled,
+      "bg-switch-knob": !enabled && !disabled,
+      "bg-switch-knob-disabled": disabled,
+      "translate-x-[calc(var(--switch-width)-var(--switch-knob-size)-var(--switch-padding)*2)]": enabled,
+      "translate-x-0": !enabled
+    }
+  );
+  const iconClasses = classNames(
+    "aria-disabled:text-font-disabled",
+    sizeStyle.icon,
+    { "text-feedback-success-content": enabled && !disabled },
+    { "text-feedback-danger-content": !enabled && !disabled },
+    { "text-content-disabled": disabled }
+  );
+  const iconClassesTheme = classNames(
+    "aria-disabled:text-font-disabled",
+    sizeStyle.icon,
+    { "text-content-inverse": enabled && !disabled },
+    { "text-feedback-warning-content": !enabled && !disabled },
+    { "text-content-disabled": disabled }
+  );
+  return {
+    Icon: iconClasses,
+    IconTheme: iconClassesTheme,
+    Switch: switchClasses,
+    SwitchTheme: switchClassesTheme,
+    Container: containerClasses
+  };
+};
+var InputSwitch_style_default = getInputSwitchStyles;
+
+// src/components/InputSwitch/InputSwitch.tsx
+import { MdCheck, MdOutlineClose as MdOutlineClose2, MdSunny, MdNightsStay } from "react-icons/md";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var InputSwitch = (_a) => {
+  var _b = _a, {
+    defaultEnable: enabledByDefault,
+    variant = "primary",
+    size = "md",
+    disabled,
+    onChange,
+    checked,
+    icon: Icon
+  } = _b, rest = __objRest(_b, [
+    "defaultEnable",
+    "variant",
+    "size",
+    "disabled",
+    "onChange",
+    "checked",
+    "icon"
+  ]);
+  const [enabled, setEnabled] = useState(enabledByDefault != null ? enabledByDefault : false);
+  const resolvedEnabled = typeof checked === "boolean" ? checked : enabled;
+  const style = InputSwitch_style_default({
+    variant,
+    enabled: resolvedEnabled,
+    disabled,
+    size
+  });
+  const toggle = () => {
+    const newState = !resolvedEnabled;
+    if (typeof checked !== "boolean") {
+      setEnabled(newState);
+    }
+    onChange == null ? void 0 : onChange(newState);
+  };
+  return /* @__PURE__ */ jsxs2(
+    HeadlessSwitch,
+    __spreadProps(__spreadValues({
+      checked: resolvedEnabled,
+      onChange: toggle,
+      disabled: disabled != null ? disabled : false,
+      className: style.Container
+    }, rest), {
+      children: [
+        variant !== "contract" && variant !== "theme" && /* @__PURE__ */ jsx2("span", { className: style.Switch, children: Icon && /* @__PURE__ */ jsx2(Icon, { "aria-hidden": "true", className: style.Icon }) }),
+        variant === "contract" && /* @__PURE__ */ jsxs2("span", { className: style.Switch, children: [
+          resolvedEnabled && /* @__PURE__ */ jsx2(MdCheck, { className: style.Icon, "aria-disabled": disabled }),
+          resolvedEnabled || /* @__PURE__ */ jsx2(MdOutlineClose2, { className: style.Icon, "aria-disabled": disabled })
+        ] }),
+        variant === "theme" && /* @__PURE__ */ jsxs2("span", { className: style.SwitchTheme, children: [
+          resolvedEnabled && /* @__PURE__ */ jsx2(
+            MdNightsStay,
+            {
+              className: style.IconTheme,
+              "aria-disabled": disabled
+            }
+          ),
+          resolvedEnabled || /* @__PURE__ */ jsx2(MdSunny, { className: style.IconTheme, "aria-disabled": disabled })
+        ] })
+      ]
+    })
+  );
+};
+var InputSwitch_default = InputSwitch;
+
+// src/components/accessibility-preferences/AccessibilityPreferencesPanel.tsx
+import { useId, useState as useState2 } from "react";
+import {
+  MdAccessibilityNew,
+  MdAnimation,
+  MdCenterFocusStrong,
+  MdContrast,
+  MdLink,
+  MdPalette,
+  MdRestartAlt,
+  MdTextFields
+} from "react-icons/md";
+import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var DEFAULT_ACCESSIBILITY_PREFERENCES = {
+  colorScheme: "light",
+  highContrast: false,
+  highContrastTheme: "light",
+  fontScale: "standard",
+  reduceMotion: false,
+  emphasizeFocus: false,
+  underlineLinks: false
+};
+var readingOptions = [
+  {
+    key: "reduceMotion",
+    label: "Reduzir anima\xE7\xF5es",
+    description: "Minimiza anima\xE7\xF5es, transi\xE7\xF5es e rolagens suaves.",
+    Icon: MdAnimation
+  },
+  {
+    key: "emphasizeFocus",
+    label: "Destacar foco",
+    description: "Evidencia o elemento selecionado durante o uso do teclado.",
+    Icon: MdCenterFocusStrong
+  },
+  {
+    key: "underlineLinks",
+    label: "Sublinhar links",
+    description: "Mant\xE9m links de texto sublinhados fora do foco.",
+    Icon: MdLink
+  }
+];
+var sectionClass = "rounded-md border border-border-default bg-surface-subtle p-4 tablet:p-5";
+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";
+function AccessibilityPreferencesPanel({
+  preferences,
+  onPreferencesChange,
+  onReset,
+  isOpen: controlledOpen,
+  onOpenChange,
+  showTrigger = true,
+  triggerLabel = "Prefer\xEAncias de acessibilidade",
+  className
+}) {
+  const [internalOpen, setInternalOpen] = useState2(false);
+  const [announcement, setAnnouncement] = useState2("");
+  const titleId = useId();
+  const isOpen = controlledOpen != null ? controlledOpen : internalOpen;
+  const setOpen = (open) => {
+    if (controlledOpen === void 0) setInternalOpen(open);
+    onOpenChange == null ? void 0 : onOpenChange(open);
+  };
+  const update = (changes, message) => {
+    onPreferencesChange(changes);
+    setAnnouncement(message);
+  };
+  const isDark = preferences.colorScheme === "dark";
+  return /* @__PURE__ */ jsxs3(Fragment2, { children: [
+    showTrigger && /* @__PURE__ */ jsxs3(
+      "button",
+      {
+        type: "button",
+        "aria-haspopup": "dialog",
+        "aria-expanded": isOpen,
+        onClick: () => setOpen(true),
+        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(),
+        children: [
+          /* @__PURE__ */ jsx3(MdAccessibilityNew, { "aria-hidden": "true", className: "h-5 w-5" }),
+          /* @__PURE__ */ jsx3("span", { children: triggerLabel })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs3(
+      Modal_default,
+      {
+        isOpen,
+        onClose: () => setOpen(false),
+        title: triggerLabel,
+        showIcon: false,
+        size: "large",
+        children: [
+          /* @__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." }),
+          /* @__PURE__ */ jsxs3("div", { className: "mt-5 grid gap-4 desktop:grid-cols-2", children: [
+            /* @__PURE__ */ jsxs3("fieldset", { className: sectionClass, children: [
+              /* @__PURE__ */ jsx3("legend", { className: "sr-only", children: "Apar\xEAncia" }),
+              /* @__PURE__ */ jsxs3("div", { className: "mb-4 flex items-start gap-3", children: [
+                /* @__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" }) }),
+                /* @__PURE__ */ jsxs3("div", { children: [
+                  /* @__PURE__ */ jsx3("h3", { className: "font-bold", children: "Apar\xEAncia" }),
+                  /* @__PURE__ */ jsx3("p", { className: "text-sm text-content-secondary", children: "Tema e contraste visual." })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs3("div", { className: "divide-y divide-border-subtle rounded-sm border border-border-default bg-surface-card px-3", children: [
+                /* @__PURE__ */ jsxs3("div", { className: "flex min-h-16 items-center justify-between gap-4 py-3", children: [
+                  /* @__PURE__ */ jsxs3("span", { className: "font-semibold", children: [
+                    "Tema ",
+                    isDark ? "escuro" : "claro"
+                  ] }),
+                  /* @__PURE__ */ jsx3(
+                    InputSwitch_default,
+                    {
+                      "aria-label": "Alternar tema claro ou escuro",
+                      variant: "theme",
+                      size: "lg",
+                      checked: isDark,
+                      disabled: preferences.colorScheme === "system",
+                      onChange: (enabled) => update(
+                        { colorScheme: enabled ? "dark" : "light", highContrastTheme: enabled ? "dark" : "light" },
+                        `Tema ${enabled ? "escuro" : "claro"} ativado.`
+                      )
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs3("label", { className: "flex min-h-14 cursor-pointer items-start gap-3 py-3", children: [
+                  /* @__PURE__ */ jsx3(
+                    "input",
+                    {
+                      type: "checkbox",
+                      className: "checkbox-control mt-0.5",
+                      checked: preferences.colorScheme === "system",
+                      onChange: (event) => update(
+                        { colorScheme: event.target.checked ? "system" : isDark ? "dark" : "light" },
+                        event.target.checked ? "Tema definido pelo dispositivo." : "Tema do dispositivo desativado."
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsx3("span", { className: "font-semibold", children: "Usar configura\xE7\xE3o do dispositivo" })
+                ] }),
+                /* @__PURE__ */ jsxs3("div", { className: "flex min-h-16 items-center justify-between gap-4 py-3", children: [
+                  /* @__PURE__ */ jsxs3("span", { className: "flex items-center gap-1.5 font-semibold", children: [
+                    /* @__PURE__ */ jsx3(MdContrast, { "aria-hidden": "true", className: "h-4 w-4" }),
+                    "Alto contraste"
+                  ] }),
+                  /* @__PURE__ */ jsx3(
+                    InputSwitch_default,
+                    {
+                      "aria-label": "Alternar alto contraste",
+                      checked: preferences.highContrast,
+                      size: "lg",
+                      onChange: (enabled) => update({ highContrast: enabled }, `Alto contraste ${enabled ? "ativado" : "desativado"}.`)
+                    }
+                  )
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs3("fieldset", { className: sectionClass, children: [
+              /* @__PURE__ */ jsx3("legend", { className: "sr-only", children: "Tamanho do texto" }),
+              /* @__PURE__ */ jsxs3("div", { className: "mb-4 flex items-start gap-3", children: [
+                /* @__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" }) }),
+                /* @__PURE__ */ jsxs3("div", { children: [
+                  /* @__PURE__ */ jsx3("h3", { className: "font-bold", children: "Tamanho do texto" }),
+                  /* @__PURE__ */ jsx3("p", { className: "text-sm text-content-secondary", children: "Amplie os textos para facilitar a leitura." })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx3("div", { className: "grid gap-2", children: ["standard", "large", "extra-large"].map((scale) => /* @__PURE__ */ jsxs3("label", { className: `${choiceClass} items-center`, children: [
+                /* @__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" }),
+                /* @__PURE__ */ jsx3("span", { className: "flex w-9 shrink-0 justify-center font-extrabold text-primary-1", children: "Aa" }),
+                /* @__PURE__ */ jsx3("span", { className: "font-semibold", children: scale === "standard" ? "Padr\xE3o" : scale === "large" ? "Grande" : "Muito grande" })
+              ] }, scale)) })
+            ] }),
+            /* @__PURE__ */ jsxs3("fieldset", { className: `${sectionClass} desktop:col-span-2`, children: [
+              /* @__PURE__ */ jsx3("legend", { className: "sr-only", children: "Leitura e navega\xE7\xE3o" }),
+              /* @__PURE__ */ jsxs3("div", { className: "mb-4 flex items-start gap-3", children: [
+                /* @__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" }) }),
+                /* @__PURE__ */ jsxs3("div", { children: [
+                  /* @__PURE__ */ jsx3("h3", { className: "font-bold", children: "Leitura e navega\xE7\xE3o" }),
+                  /* @__PURE__ */ jsx3("p", { className: "text-sm text-content-secondary", children: "Ajustes para reduzir distra\xE7\xF5es e facilitar a orienta\xE7\xE3o." })
+                ] })
+              ] }),
+              /* @__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: [
+                /* @__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" }),
+                /* @__PURE__ */ jsxs3("span", { children: [
+                  /* @__PURE__ */ jsxs3("span", { className: "flex items-center gap-2 font-semibold", children: [
+                    /* @__PURE__ */ jsx3(Icon, { "aria-hidden": "true", className: "h-5 w-5 shrink-0 text-primary-1" }),
+                    label
+                  ] }),
+                  /* @__PURE__ */ jsx3("span", { className: "mt-1 block text-sm text-content-secondary", children: description })
+                ] })
+              ] }, key)) })
+            ] })
+          ] }),
+          /* @__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: () => {
+            onReset == null ? void 0 : onReset();
+            setAnnouncement("Configura\xE7\xF5es padr\xE3o restauradas.");
+          }, 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: [
+            /* @__PURE__ */ jsx3(MdRestartAlt, { "aria-hidden": "true", className: "h-5 w-5" }),
+            "Restaurar configura\xE7\xF5es padr\xE3o"
+          ] }) }),
+          /* @__PURE__ */ jsx3("p", { className: "sr-only", role: "status", "aria-live": "polite", children: announcement })
+        ]
+      }
+    )
+  ] });
+}
+
+// src/components/accessibility-preferences/HighContrastToggle.tsx
+import { MdContrast as MdContrast2 } from "react-icons/md";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function HighContrastToggle({
+  checked,
+  onChange,
+  label = "Alto contraste",
+  className
+}) {
+  return /* @__PURE__ */ jsxs4(
+    "button",
+    {
+      type: "button",
+      "aria-pressed": checked,
+      onClick: () => onChange(!checked),
+      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(),
+      children: [
+        /* @__PURE__ */ jsx4(MdContrast2, { "aria-hidden": "true", className: "h-5 w-5" }),
+        /* @__PURE__ */ jsx4("span", { children: label }),
+        /* @__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" })
+      ]
+    }
+  );
+}
+
+export {
+  Modal_default,
+  InputSwitch_default,
+  DEFAULT_ACCESSIBILITY_PREFERENCES,
+  AccessibilityPreferencesPanel,
+  HighContrastToggle
+};
+//# sourceMappingURL=chunk-2ACDV5D5.js.map

package/dist/chunk-2ACDV5D5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Modal/Modal.tsx","../src/components/InputSwitch/InputSwitch.tsx","../src/components/InputSwitch/InputSwitch.style.ts","../src/components/accessibility-preferences/AccessibilityPreferencesPanel.tsx","../src/components/accessibility-preferences/HighContrastToggle.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, { Fragment } from \"react\";\r\nimport {\r\n  MdCheckCircle,\r\n  MdCancel,\r\n  MdDeleteForever,\r\n  MdOutlineClose,\r\n  MdDownload,\r\n  MdSend,\r\n  MdErrorOutline,\r\n} from \"react-icons/md\";\r\nimport {\r\n  Transition,\r\n  Dialog,\r\n  TransitionChild,\r\n  DialogTitle,\r\n  DialogPanel,\r\n} from \"@headlessui/react\";\r\n\r\nexport type ModalProps = {\r\n  children?: React.ReactNode;\r\n  isOpen: boolean;\r\n  title?: string;\r\n  onClose: () => void;\r\n  showIcon?: boolean;\r\n  variant?:\r\n    | \"success\"\r\n    | \"error\"\r\n    | \"warning\"\r\n    | \"delete\"\r\n    | \"downloading\"\r\n    | \"sendMessage\";\r\n  size?: \"small\" | \"medium\" | \"large\" | \"viewer\" | \"full\";\r\n  className?: string;\r\n} & React.HTMLAttributes<HTMLDivElement>;\r\n\r\nconst modalMaxWidths = {\r\n  small: \"28rem\",\r\n  medium: \"42rem\",\r\n  large: \"56rem\",\r\n  viewer: \"72rem\",\r\n  full: \"calc(100vw - 40px)\",\r\n} as const;\r\n\r\nconst Modal = ({\r\n  children,\r\n  isOpen,\r\n  onClose,\r\n  className,\r\n  style,\r\n  title,\r\n  showIcon = true,\r\n  variant = \"success\",\r\n  size = \"small\",\r\n}: ModalProps) => {\r\n  const variantStyles = {\r\n    success: {\r\n      bgColor: \"bg-feedback-success-soft\",\r\n      icon: <MdCheckCircle className=\"h-6 w-6 text-feedback-success-content\" />,\r\n    },\r\n    error: {\r\n      bgColor: \"bg-feedback-danger-soft\",\r\n      icon: <MdCancel className=\"h-6 w-6 text-feedback-danger-content\" />,\r\n    },\r\n    warning: {\r\n      bgColor: \"bg-feedback-warning-soft\",\r\n      icon: (\r\n        <MdErrorOutline className=\"h-6 w-6 text-feedback-warning-content\" />\r\n      ),\r\n    },\r\n    downloading: {\r\n      bgColor: \"bg-feedback-info-soft\",\r\n      icon: <MdDownload className=\"h-6 w-6 text-feedback-info-content\" />,\r\n    },\r\n    delete: {\r\n      bgColor: \"bg-feedback-info-soft\",\r\n      icon: <MdDeleteForever className=\"h-6 w-6 text-feedback-info-content\" />,\r\n    },\r\n    sendMessage: {\r\n      bgColor: \"bg-feedback-info-soft\",\r\n      icon: <MdSend className=\"h-6 w-6 text-feedback-info-content\" />,\r\n    },\r\n  };\r\n\r\n  const { bgColor, icon } = variantStyles[variant];\r\n\r\n  return (\r\n    <Transition appear show={isOpen} as={Fragment}>\r\n      <Dialog\r\n        as=\"div\"\r\n        className=\"relative z-modal gap-0\"\r\n        aria-label={title ? undefined : \"Janela de diálogo\"}\n        onClose={onClose}\r\n      >\r\n        <TransitionChild\r\n          as={Fragment}\r\n          enter=\"ease-out duration-300\"\r\n          enterFrom=\"opacity-0\"\r\n          enterTo=\"opacity-100\"\r\n          leave=\"ease-in duration-200\"\r\n          leaveFrom=\"opacity-100\"\r\n          leaveTo=\"opacity-0\"\r\n        >\r\n          <div className=\"fixed inset-0 bg-overlay/50 backdrop-blur-[1px]\" />\r\n        </TransitionChild>\r\n        <div className=\"portal-safe-modal fixed inset-0 overflow-y-auto gap-0\">\r\n          <div className=\"flex min-h-full items-center justify-center p-5 gap-0\">\r\n            <DialogPanel\r\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 ?? \"\"}`}\r\n              style={{\r\n                ...style,\r\n                width: \"100%\",\r\n                maxWidth: modalMaxWidths[size],\r\n              }}\r\n            >\r\n              <div className=\"absolute right-5 top-5 flex items-center justify-end\">\r\n                <button\r\n                  type=\"button\"\r\n                  aria-label=\"Fechar janela\"\r\n                  onClick={onClose}\r\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\"\r\n                >\r\n                  <MdOutlineClose\r\n                    aria-hidden=\"true\"\r\n                    size={20}\r\n                    className=\"text-content-secondary\"\r\n                  />\r\n                </button>\r\n              </div>\r\n\r\n              {showIcon && (\r\n                <div aria-hidden=\"true\" className=\"flex justify-center p-0\">\r\n                  <div\r\n                    className={`inline-flex items-center justify-center w-12 h-12 rounded-full ${bgColor}`}\r\n                  >\r\n                    {icon}\r\n                  </div>\r\n                </div>\r\n              )}\r\n\r\n              <div className=\"space-y-3\">\r\n                {title && (\r\n                  <DialogTitle\r\n                    as=\"h3\"\r\n                    className=\"text-xl font-extrabold text-center\"\r\n                  >\r\n                    {title}\r\n                  </DialogTitle>\r\n                )}\r\n                {children}\r\n              </div>\r\n            </DialogPanel>\r\n          </div>\r\n        </div>\r\n      </Dialog>\r\n    </Transition>\r\n  );\r\n};\r\n\r\nexport default Modal;\r\n\r\n","\"use client\";\r\n\r\nimport {\r\n  Switch as HeadlessSwitch,\r\n} from \"@headlessui/react\";\r\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\r\ntype NativeSwitchProps = {\r\n  id?: string;\r\n  name?: string;\r\n  value?: string;\r\n  form?: string;\r\n  autoFocus?: boolean;\r\n  tabIndex?: number;\r\n} & (\r\n  | {\r\n      \"aria-label\": string;\r\n      \"aria-labelledby\"?: never;\r\n    }\r\n  | {\r\n      \"aria-label\"?: never;\r\n      \"aria-labelledby\": string;\r\n    }\r\n);\r\n\r\nexport type InputSwitchProps = {\r\n  defaultEnable?: boolean;\r\n  checked?: boolean;\r\n  variant?: \"primary\" | \"secondary\" | \"tertiary\" | \"contract\" | \"theme\";\r\n  size?: \"sm\" | \"md\" | \"lg\";\r\n  disabled?: boolean;\n  onChange?: (enabled: boolean) => void;\n  icon?: IconType;\n} & NativeSwitchProps;\n\r\nexport type InputSwitchStyleProps = Pick<\r\n  InputSwitchProps,\r\n  \"variant\" | \"disabled\" | \"size\"\r\n> & {\r\n  enabled: boolean;\r\n};\r\n\r\nexport type SwitchProps = InputSwitchProps;\r\n\r\nconst InputSwitch: React.FC<InputSwitchProps> = ({\r\n  defaultEnable: enabledByDefault,\r\n  variant = \"primary\",\r\n  size = \"md\",\r\n  disabled,\r\n  onChange,\n  checked,\n  icon: Icon,\n  ...rest\n}) => {\r\n  const [enabled, setEnabled] = useState(enabledByDefault ?? false);\n  const resolvedEnabled = typeof checked === \"boolean\" ? checked : enabled;\r\n  const style = useStyle({\r\n    variant,\r\n    enabled: resolvedEnabled,\r\n    disabled,\r\n    size,\r\n  });\r\n\r\n  const toggle = () => {\r\n    const newState = !resolvedEnabled;\r\n    if (typeof checked !== \"boolean\") {\r\n      setEnabled(newState);\r\n    }\r\n    onChange?.(newState);\r\n  };\r\n  return (\r\n    <HeadlessSwitch\r\n      checked={resolvedEnabled}\r\n      onChange={toggle}\r\n      disabled={disabled ?? false}\n      className={style.Container}\r\n      {...rest}\r\n    >\r\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\" && (\r\n        <span className={style.Switch}>\r\n          {resolvedEnabled && (\r\n            <MdCheck className={style.Icon} aria-disabled={disabled} />\r\n          )}\r\n          {resolvedEnabled || (\r\n            <MdOutlineClose className={style.Icon} aria-disabled={disabled} />\r\n          )}\r\n        </span>\r\n      )}\r\n\r\n      {variant === \"theme\" && (\r\n        <span className={style.SwitchTheme}>\r\n          {resolvedEnabled && (\r\n            <MdNightsStay\r\n              className={style.IconTheme}\r\n              aria-disabled={disabled}\r\n            />\r\n          )}\r\n          {resolvedEnabled || (\r\n            <MdSunny className={style.IconTheme} aria-disabled={disabled} />\r\n          )}\r\n        </span>\r\n      )}\r\n    </HeadlessSwitch>\r\n  );\r\n};\r\n\r\nexport default InputSwitch;\r\n\r\n","import { cva } from \"class-variance-authority\";\r\nimport classNames from \"classnames\";\r\nimport { InputSwitchProps, InputSwitchStyleProps } from \"./InputSwitch\";\r\n\r\nconst SIZE_STYLES: Record<\r\n  NonNullable<InputSwitchProps[\"size\"]>,\r\n  {\r\n    container: string;\r\n    knob: string;\r\n    icon: string;\r\n  }\r\n> = {\r\n  sm: {\r\n    container:\r\n      \"h-[1rem] w-[1.75rem] [--switch-padding:2px] [--switch-knob-size:0.75rem] [--switch-width:1.75rem]\",\r\n    knob: \"h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]\",\r\n    icon: \"h-2 w-2\",\r\n  },\r\n  md: {\r\n    container:\r\n      \"h-[1.25rem] w-[3rem] [--switch-padding:2px] [--switch-knob-size:1rem] [--switch-width:3rem]\",\r\n    knob: \"h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]\",\r\n    icon: \"h-3 w-3\",\r\n  },\r\n  lg: {\r\n    container:\r\n      \"h-[1.5rem] w-[3.5rem] [--switch-padding:2px] [--switch-knob-size:1.25rem] [--switch-width:3.5rem]\",\r\n    knob: \"h-[var(--switch-knob-size)] w-[var(--switch-knob-size)]\",\r\n    icon: \"h-4 w-4\",\r\n  },\r\n};\r\n\r\nconst getInputSwitchStyles = ({\r\n  variant,\r\n  enabled,\r\n  disabled,\r\n  size = \"md\",\r\n}: InputSwitchStyleProps) => {\r\n  const sizeStyle = SIZE_STYLES[size];\r\n  const containerVariant = cva(\r\n    classNames(\r\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\",\r\n      sizeStyle.container,\r\n      { \"pointer-events-none\": disabled },\r\n    ),\r\n    {\r\n      variants: {\r\n        variant: {\r\n          primary: classNames(\r\n            \"[--switch-state-layer:var(--switch-track-primary-on)]\",\r\n            { \"bg-switch-track-primary-on\": enabled },\r\n            { \"bg-switch-track-off\": !enabled },\r\n          ),\r\n          secondary: classNames(\r\n            \"[--switch-state-layer:var(--switch-track-secondary-on)]\",\r\n            { \"bg-switch-track-secondary-on\": enabled },\r\n            { \"bg-switch-track-off\": !enabled },\r\n          ),\r\n          tertiary: classNames(\r\n            \"[--switch-state-layer:var(--switch-track-tertiary-on)]\",\r\n            { \"bg-switch-track-tertiary-on\": enabled },\r\n            { \"bg-switch-track-off\": !enabled },\r\n          ),\r\n          contract: classNames(\r\n            enabled\r\n              ? \"bg-switch-track-contract-on [--switch-state-layer:var(--switch-track-contract-on)]\"\r\n              : \"bg-switch-track-contract-off [--switch-state-layer:var(--switch-track-contract-off)]\",\r\n          ),\r\n          theme: classNames(\r\n            enabled\r\n              ? \"bg-switch-track-theme-on [--switch-state-layer:var(--switch-track-theme-on)]\"\r\n              : \"bg-switch-track-theme-off [--switch-state-layer:var(--switch-track-theme-off)]\",\r\n          ),\r\n        },\r\n      },\r\n      defaultVariants: {\r\n        variant: \"primary\",\r\n      },\r\n    },\r\n  );\r\n  const containerClasses = containerVariant({ variant });\r\n\r\n  const switchClasses = classNames(\r\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\",\r\n    sizeStyle.knob,\r\n    disabled ? \"bg-switch-knob-disabled\" : \"bg-switch-knob\",\r\n    enabled\r\n      ? \"translate-x-[calc(var(--switch-width)-var(--switch-knob-size)-var(--switch-padding)*2)]\"\r\n      : \"translate-x-0\",\r\n  );\r\n\r\n  const switchClassesTheme = classNames(\r\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\",\r\n    sizeStyle.knob,\r\n    {\r\n      \"bg-switch-knob-theme-on\": enabled && !disabled,\r\n      \"bg-switch-knob\": !enabled && !disabled,\r\n      \"bg-switch-knob-disabled\": disabled,\r\n      \"translate-x-[calc(var(--switch-width)-var(--switch-knob-size)-var(--switch-padding)*2)]\":\r\n        enabled,\r\n      \"translate-x-0\": !enabled,\r\n    },\r\n  );\r\n\r\n  const iconClasses = classNames(\r\n    \"aria-disabled:text-font-disabled\",\r\n    sizeStyle.icon,\r\n    { \"text-feedback-success-content\": enabled && !disabled },\r\n    { \"text-feedback-danger-content\": !enabled && !disabled },\r\n    { \"text-content-disabled\": disabled },\r\n  );\r\n\r\n  const iconClassesTheme = classNames(\r\n    \"aria-disabled:text-font-disabled\",\r\n    sizeStyle.icon,\r\n    { \"text-content-inverse\": enabled && !disabled },\r\n    { \"text-feedback-warning-content\": !enabled && !disabled },\r\n    { \"text-content-disabled\": disabled },\r\n  );\r\n\r\n  return {\r\n    Icon: iconClasses,\r\n    IconTheme: iconClassesTheme,\r\n    Switch: switchClasses,\r\n    SwitchTheme: switchClassesTheme,\r\n    Container: containerClasses,\r\n  };\r\n};\r\n\r\nexport default getInputSwitchStyles;\r\n\r\n","\"use client\";\n\nimport { useId, useState } from \"react\";\nimport {\n  MdAccessibilityNew,\n  MdAnimation,\n  MdCenterFocusStrong,\n  MdContrast,\n  MdLink,\n  MdPalette,\n  MdRestartAlt,\n  MdTextFields,\n} from \"react-icons/md\";\nimport InputSwitch from \"../InputSwitch/InputSwitch\";\nimport Modal from \"../Modal/Modal\";\n\nexport 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\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\nconst readingOptions = [\n  {\n    key: \"reduceMotion\" as const,\n    label: \"Reduzir animações\",\n    description: \"Minimiza animações, transições e rolagens suaves.\",\n    Icon: MdAnimation,\n  },\n  {\n    key: \"emphasizeFocus\" as const,\n    label: \"Destacar foco\",\n    description: \"Evidencia o elemento selecionado durante o uso do teclado.\",\n    Icon: MdCenterFocusStrong,\n  },\n  {\n    key: \"underlineLinks\" as const,\n    label: \"Sublinhar links\",\n    description: \"Mantém links de texto sublinhados fora do foco.\",\n    Icon: MdLink,\n  },\n];\n\nconst sectionClass =\n  \"rounded-md border border-border-default bg-surface-subtle p-4 tablet:p-5\";\nconst choiceClass =\n  \"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\";\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 titleId = useId();\n  const isOpen = controlledOpen ?? internalOpen;\n  const setOpen = (open: boolean) => {\n    if (controlledOpen === undefined) setInternalOpen(open);\n    onOpenChange?.(open);\n  };\n  const update = (changes: Partial<AccessibilityPreferences>, message: string) => {\n    onPreferencesChange(changes);\n    setAnnouncement(message);\n  };\n  const isDark = preferences.colorScheme === \"dark\";\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          <fieldset className={sectionClass}>\n            <legend className=\"sr-only\">Aparência</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                <MdPalette aria-hidden=\"true\" className=\"h-5 w-5\" />\n              </span>\n              <div>\n                <h3 className=\"font-bold\">Aparência</h3>\n                <p className=\"text-sm text-content-secondary\">Tema e contraste visual.</p>\n              </div>\n            </div>\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={preferences.colorScheme === \"system\"}\n                  onChange={(enabled) =>\n                    update(\n                      { colorScheme: enabled ? \"dark\" : \"light\", highContrastTheme: enabled ? \"dark\" : \"light\" },\n                      `Tema ${enabled ? \"escuro\" : \"claro\"} ativado.`,\n                    )\n                  }\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={preferences.colorScheme === \"system\"}\n                  onChange={(event) =>\n                    update(\n                      { colorScheme: event.target.checked ? \"system\" : isDark ? \"dark\" : \"light\" },\n                      event.target.checked ? \"Tema definido pelo dispositivo.\" : \"Tema do dispositivo desativado.\",\n                    )\n                  }\n                />\n                <span className=\"font-semibold\">Usar configuração do dispositivo</span>\n              </label>\n              <div className=\"flex min-h-16 items-center justify-between gap-4 py-3\">\n                <span className=\"flex items-center gap-1.5 font-semibold\"><MdContrast aria-hidden=\"true\" className=\"h-4 w-4\" />Alto contraste</span>\n                <InputSwitch\n                  aria-label=\"Alternar alto contraste\"\n                  checked={preferences.highContrast}\n                  size=\"lg\"\n                  onChange={(enabled) => update({ highContrast: enabled }, `Alto contraste ${enabled ? \"ativado\" : \"desativado\"}.`)}\n                />\n              </div>\n            </div>\n          </fieldset>\n\n          <fieldset className={sectionClass}>\n            <legend className=\"sr-only\">Tamanho do texto</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\"><MdTextFields aria-hidden=\"true\" className=\"h-5 w-5\" /></span>\n              <div><h3 className=\"font-bold\">Tamanho do texto</h3><p className=\"text-sm text-content-secondary\">Amplie os textos para facilitar a leitura.</p></div>\n            </div>\n            <div className=\"grid gap-2\">\n              {([\"standard\", \"large\", \"extra-large\"] as const).map((scale) => (\n                <label key={scale} className={`${choiceClass} items-center`}>\n                  <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\" />\n                  <span className=\"flex w-9 shrink-0 justify-center font-extrabold text-primary-1\">Aa</span>\n                  <span className=\"font-semibold\">{scale === \"standard\" ? \"Padrão\" : scale === \"large\" ? \"Grande\" : \"Muito grande\"}</span>\n                </label>\n              ))}\n            </div>\n          </fieldset>\n\n          <fieldset className={`${sectionClass} desktop:col-span-2`}>\n            <legend className=\"sr-only\">Leitura e navegação</legend>\n            <div className=\"mb-4 flex items-start gap-3\"><span className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-primary-5 text-primary-1\"><MdAccessibilityNew aria-hidden=\"true\" className=\"h-5 w-5\" /></span><div><h3 className=\"font-bold\">Leitura e navegação</h3><p className=\"text-sm text-content-secondary\">Ajustes para reduzir distrações e facilitar a orientação.</p></div></div>\n            <div className=\"grid gap-3 tablet:grid-cols-3\">\n              {readingOptions.map(({ key, label, description, Icon }) => (\n                <label key={key} className={`${choiceClass} items-start`}>\n                  <input type=\"checkbox\" checked={preferences[key]} onChange={(event) => update({ [key]: event.target.checked }, `${label} ${event.target.checked ? \"ativado\" : \"desativado\"}.`)} className=\"checkbox-control mt-1\" />\n                  <span><span className=\"flex items-center gap-2 font-semibold\"><Icon aria-hidden=\"true\" className=\"h-5 w-5 shrink-0 text-primary-1\" />{label}</span><span className=\"mt-1 block text-sm text-content-secondary\">{description}</span></span>\n                </label>\n              ))}\n            </div>\n          </fieldset>\n        </div>\n        <div className=\"mt-5 flex justify-center border-t border-border-subtle pt-4 tablet:justify-start\">\n          <button type=\"button\" onClick={() => { onReset?.(); setAnnouncement(\"Configurações padrão restauradas.\"); }} 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\"><MdRestartAlt aria-hidden=\"true\" className=\"h-5 w-5\" />Restaurar configurações padrão</button>\n        </div>\n        <p className=\"sr-only\" role=\"status\" aria-live=\"polite\">{announcement}</p>\n      </Modal>\n    </>\n  );\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":";;;;;;;AAEA,SAAgB,gBAAgB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAyCK,cAkFE,YAlFF;AAtBZ,IAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AACR;AAEA,IAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,UAAU;AAAA,EACV,OAAO;AACT,MAAkB;AAChB,QAAM,gBAAgB;AAAA,IACpB,SAAS;AAAA,MACP,SAAS;AAAA,MACT,MAAM,oBAAC,iBAAc,WAAU,yCAAwC;AAAA,IACzE;AAAA,IACA,OAAO;AAAA,MACL,SAAS;AAAA,MACT,MAAM,oBAAC,YAAS,WAAU,wCAAuC;AAAA,IACnE;AAAA,IACA,SAAS;AAAA,MACP,SAAS;AAAA,MACT,MACE,oBAAC,kBAAe,WAAU,yCAAwC;AAAA,IAEtE;AAAA,IACA,aAAa;AAAA,MACX,SAAS;AAAA,MACT,MAAM,oBAAC,cAAW,WAAU,sCAAqC;AAAA,IACnE;AAAA,IACA,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,MAAM,oBAAC,mBAAgB,WAAU,sCAAqC;AAAA,IACxE;AAAA,IACA,aAAa;AAAA,MACX,SAAS;AAAA,MACT,MAAM,oBAAC,UAAO,WAAU,sCAAqC;AAAA,IAC/D;AAAA,EACF;AAEA,QAAM,EAAE,SAAS,KAAK,IAAI,cAAc,OAAO;AAE/C,SACE,oBAAC,cAAW,QAAM,MAAC,MAAM,QAAQ,IAAI,UACnC;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH,WAAU;AAAA,MACV,cAAY,QAAQ,SAAY;AAAA,MAChC;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,YACJ,OAAM;AAAA,YACN,WAAU;AAAA,YACV,SAAQ;AAAA,YACR,OAAM;AAAA,YACN,WAAU;AAAA,YACV,SAAQ;AAAA,YAER,8BAAC,SAAI,WAAU,mDAAkD;AAAA;AAAA,QACnE;AAAA,QACA,oBAAC,SAAI,WAAU,yDACb,8BAAC,SAAI,WAAU,yDACb;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,iLAAiL,gCAAa,EAAE;AAAA,YAC3M,OAAO,iCACF,QADE;AAAA,cAEL,OAAO;AAAA,cACP,UAAU,eAAe,IAAI;AAAA,YAC/B;AAAA,YAEA;AAAA,kCAAC,SAAI,WAAU,wDACb;AAAA,gBAAC;AAAA;AAAA,kBACC,MAAK;AAAA,kBACL,cAAW;AAAA,kBACX,SAAS;AAAA,kBACT,WAAU;AAAA,kBAEV;AAAA,oBAAC;AAAA;AAAA,sBACC,eAAY;AAAA,sBACZ,MAAM;AAAA,sBACN,WAAU;AAAA;AAAA,kBACZ;AAAA;AAAA,cACF,GACF;AAAA,cAEC,YACC,oBAAC,SAAI,eAAY,QAAO,WAAU,2BAChC;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAW,kEAAkE,OAAO;AAAA,kBAEnF;AAAA;AAAA,cACH,GACF;AAAA,cAGF,qBAAC,SAAI,WAAU,aACZ;AAAA,yBACC;AAAA,kBAAC;AAAA;AAAA,oBACC,IAAG;AAAA,oBACH,WAAU;AAAA,oBAET;AAAA;AAAA,gBACH;AAAA,gBAED;AAAA,iBACH;AAAA;AAAA;AAAA,QACF,GACF,GACF;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;AAEA,IAAO,gBAAQ;;;AC9Jf;AAAA,EACE,UAAU;AAAA,OACL;AACP,SAAgB,gBAAgB;;;ACL/B,SAAS,WAAW;AACrB,OAAO,gBAAgB;AAGvB,IAAM,cAOF;AAAA,EACF,IAAI;AAAA,IACF,WACE;AAAA,IACF,MAAM;AAAA,IACN,MAAM;AAAA,EACR;AAAA,EACA,IAAI;AAAA,IACF,WACE;AAAA,IACF,MAAM;AAAA,IACN,MAAM;AAAA,EACR;AAAA,EACA,IAAI;AAAA,IACF,WACE;AAAA,IACF,MAAM;AAAA,IACN,MAAM;AAAA,EACR;AACF;AAEA,IAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AACT,MAA6B;AAC3B,QAAM,YAAY,YAAY,IAAI;AAClC,QAAM,mBAAmB;AAAA,IACvB;AAAA,MACE;AAAA,MACA,UAAU;AAAA,MACV,EAAE,uBAAuB,SAAS;AAAA,IACpC;AAAA,IACA;AAAA,MACE,UAAU;AAAA,QACR,SAAS;AAAA,UACP,SAAS;AAAA,YACP;AAAA,YACA,EAAE,8BAA8B,QAAQ;AAAA,YACxC,EAAE,uBAAuB,CAAC,QAAQ;AAAA,UACpC;AAAA,UACA,WAAW;AAAA,YACT;AAAA,YACA,EAAE,gCAAgC,QAAQ;AAAA,YAC1C,EAAE,uBAAuB,CAAC,QAAQ;AAAA,UACpC;AAAA,UACA,UAAU;AAAA,YACR;AAAA,YACA,EAAE,+BAA+B,QAAQ;AAAA,YACzC,EAAE,uBAAuB,CAAC,QAAQ;AAAA,UACpC;AAAA,UACA,UAAU;AAAA,YACR,UACI,uFACA;AAAA,UACN;AAAA,UACA,OAAO;AAAA,YACL,UACI,iFACA;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAAA,MACA,iBAAiB;AAAA,QACf,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AACA,QAAM,mBAAmB,iBAAiB,EAAE,QAAQ,CAAC;AAErD,QAAM,gBAAgB;AAAA,IACpB;AAAA,IACA,UAAU;AAAA,IACV,WAAW,4BAA4B;AAAA,IACvC,UACI,4FACA;AAAA,EACN;AAEA,QAAM,qBAAqB;AAAA,IACzB;AAAA,IACA,UAAU;AAAA,IACV;AAAA,MACE,2BAA2B,WAAW,CAAC;AAAA,MACvC,kBAAkB,CAAC,WAAW,CAAC;AAAA,MAC/B,2BAA2B;AAAA,MAC3B,2FACE;AAAA,MACF,iBAAiB,CAAC;AAAA,IACpB;AAAA,EACF;AAEA,QAAM,cAAc;AAAA,IAClB;AAAA,IACA,UAAU;AAAA,IACV,EAAE,iCAAiC,WAAW,CAAC,SAAS;AAAA,IACxD,EAAE,gCAAgC,CAAC,WAAW,CAAC,SAAS;AAAA,IACxD,EAAE,yBAAyB,SAAS;AAAA,EACtC;AAEA,QAAM,mBAAmB;AAAA,IACvB;AAAA,IACA,UAAU;AAAA,IACV,EAAE,wBAAwB,WAAW,CAAC,SAAS;AAAA,IAC/C,EAAE,iCAAiC,CAAC,WAAW,CAAC,SAAS;AAAA,IACzD,EAAE,yBAAyB,SAAS;AAAA,EACtC;AAEA,SAAO;AAAA,IACL,MAAM;AAAA,IACN,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,WAAW;AAAA,EACb;AACF;AAEA,IAAO,4BAAQ;;;AD1Hf,SAAS,SAAS,kBAAAA,iBAAgB,SAAS,oBAAoB;AA4E5C,gBAAAC,MAIX,QAAAC,aAJW;AApCnB,IAAM,cAA0C,CAAC,OAS3C;AAT2C,eAC/C;AAAA,mBAAe;AAAA,IACf,UAAU;AAAA,IACV,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,EAtDR,IA+CiD,IAQ5C,iBAR4C,IAQ5C;AAAA,IAPH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,8CAAoB,KAAK;AAChE,QAAM,kBAAkB,OAAO,YAAY,YAAY,UAAU;AACjE,QAAM,QAAQ,0BAAS;AAAA,IACrB;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,SAAS,MAAM;AACnB,UAAM,WAAW,CAAC;AAClB,QAAI,OAAO,YAAY,WAAW;AAChC,iBAAW,QAAQ;AAAA,IACrB;AACA,yCAAW;AAAA,EACb;AACA,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU,8BAAY;AAAA,MACtB,WAAW,MAAM;AAAA,OACb,OALL;AAAA,MAOE;AAAA,oBAAY,cAAc,YAAY,WACrC,gBAAAD,KAAC,UAAK,WAAW,MAAM,QACpB,kBAAQ,gBAAAA,KAAC,QAAK,eAAY,QAAO,WAAW,MAAM,MAAM,GAC3D;AAAA,QAED,YAAY,cACX,gBAAAC,MAAC,UAAK,WAAW,MAAM,QACpB;AAAA,6BACC,gBAAAD,KAAC,WAAQ,WAAW,MAAM,MAAM,iBAAe,UAAU;AAAA,UAE1D,mBACC,gBAAAA,KAACE,iBAAA,EAAe,WAAW,MAAM,MAAM,iBAAe,UAAU;AAAA,WAEpE;AAAA,QAGD,YAAY,WACX,gBAAAD,MAAC,UAAK,WAAW,MAAM,aACpB;AAAA,6BACC,gBAAAD;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,MAAM;AAAA,cACjB,iBAAe;AAAA;AAAA,UACjB;AAAA,UAED,mBACC,gBAAAA,KAAC,WAAQ,WAAW,MAAM,WAAW,iBAAe,UAAU;AAAA,WAElE;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEA,IAAO,sBAAQ;;;AEhHf,SAAS,OAAO,YAAAG,iBAAgB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AA4FH,qBAAAC,WASM,OAAAC,MAPF,QAAAC,aAFJ;AA1EG,IAAM,oCAA8D;AAAA,EACzE,aAAa;AAAA,EACb,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,WAAW;AAAA,EACX,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,gBAAgB;AAClB;AAeA,IAAM,iBAAiB;AAAA,EACrB;AAAA,IACE,KAAK;AAAA,IACL,OAAO;AAAA,IACP,aAAa;AAAA,IACb,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,KAAK;AAAA,IACL,OAAO;AAAA,IACP,aAAa;AAAA,IACb,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,KAAK;AAAA,IACL,OAAO;AAAA,IACP,aAAa;AAAA,IACb,MAAM;AAAA,EACR;AACF;AAEA,IAAM,eACJ;AACF,IAAM,cACJ;AAEa,SAAR,8BAA+C;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AAAA,EACf;AACF,GAAuC;AACrC,QAAM,CAAC,cAAc,eAAe,IAAIC,UAAS,KAAK;AACtD,QAAM,CAAC,cAAc,eAAe,IAAIA,UAAS,EAAE;AACnD,QAAM,UAAU,MAAM;AACtB,QAAM,SAAS,0CAAkB;AACjC,QAAM,UAAU,CAAC,SAAkB;AACjC,QAAI,mBAAmB,OAAW,iBAAgB,IAAI;AACtD,iDAAe;AAAA,EACjB;AACA,QAAM,SAAS,CAAC,SAA4C,YAAoB;AAC9E,wBAAoB,OAAO;AAC3B,oBAAgB,OAAO;AAAA,EACzB;AACA,QAAM,SAAS,YAAY,gBAAgB;AAE3C,SACE,gBAAAD,MAAAF,WAAA,EACG;AAAA,mBACC,gBAAAE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,iBAAc;AAAA,QACd,iBAAe;AAAA,QACf,SAAS,MAAM,QAAQ,IAAI;AAAA,QAC3B,WAAW,uUAAuU,gCAAa,EAAE,GAAG,KAAK;AAAA,QAEzW;AAAA,0BAAAD,KAAC,sBAAmB,eAAY,QAAO,WAAU,WAAU;AAAA,UAC3D,gBAAAA,KAAC,UAAM,wBAAa;AAAA;AAAA;AAAA,IACtB;AAAA,IAGF,gBAAAC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,SAAS,MAAM,QAAQ,KAAK;AAAA,QAC5B,OAAO;AAAA,QACP,UAAU;AAAA,QACV,MAAK;AAAA,QAEL;AAAA,0BAAAD,KAAC,OAAE,WAAU,mDAAkD,iFAE/D;AAAA,UAEA,gBAAAC,MAAC,SAAI,WAAU,uCACb;AAAA,4BAAAA,MAAC,cAAS,WAAW,cACnB;AAAA,8BAAAD,KAAC,YAAO,WAAU,WAAU,0BAAS;AAAA,cACrC,gBAAAC,MAAC,SAAI,WAAU,+BACb;AAAA,gCAAAD,KAAC,UAAK,WAAU,gGACd,0BAAAA,KAAC,aAAU,eAAY,QAAO,WAAU,WAAU,GACpD;AAAA,gBACA,gBAAAC,MAAC,SACC;AAAA,kCAAAD,KAAC,QAAG,WAAU,aAAY,0BAAS;AAAA,kBACnC,gBAAAA,KAAC,OAAE,WAAU,kCAAiC,sCAAwB;AAAA,mBACxE;AAAA,iBACF;AAAA,cACA,gBAAAC,MAAC,SAAI,WAAU,8FACb;AAAA,gCAAAA,MAAC,SAAI,WAAU,yDACb;AAAA,kCAAAA,MAAC,UAAK,WAAU,iBAAgB;AAAA;AAAA,oBAAM,SAAS,WAAW;AAAA,qBAAQ;AAAA,kBAClE,gBAAAD;AAAA,oBAAC;AAAA;AAAA,sBACC,cAAW;AAAA,sBACX,SAAQ;AAAA,sBACR,MAAK;AAAA,sBACL,SAAS;AAAA,sBACT,UAAU,YAAY,gBAAgB;AAAA,sBACtC,UAAU,CAAC,YACT;AAAA,wBACE,EAAE,aAAa,UAAU,SAAS,SAAS,mBAAmB,UAAU,SAAS,QAAQ;AAAA,wBACzF,QAAQ,UAAU,WAAW,OAAO;AAAA,sBACtC;AAAA;AAAA,kBAEJ;AAAA,mBACF;AAAA,gBACA,gBAAAC,MAAC,WAAM,WAAU,uDACf;AAAA,kCAAAD;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAK;AAAA,sBACL,WAAU;AAAA,sBACV,SAAS,YAAY,gBAAgB;AAAA,sBACrC,UAAU,CAAC,UACT;AAAA,wBACE,EAAE,aAAa,MAAM,OAAO,UAAU,WAAW,SAAS,SAAS,QAAQ;AAAA,wBAC3E,MAAM,OAAO,UAAU,oCAAoC;AAAA,sBAC7D;AAAA;AAAA,kBAEJ;AAAA,kBACA,gBAAAA,KAAC,UAAK,WAAU,iBAAgB,oDAAgC;AAAA,mBAClE;AAAA,gBACA,gBAAAC,MAAC,SAAI,WAAU,yDACb;AAAA,kCAAAA,MAAC,UAAK,WAAU,2CAA0C;AAAA,oCAAAD,KAAC,cAAW,eAAY,QAAO,WAAU,WAAU;AAAA,oBAAE;AAAA,qBAAc;AAAA,kBAC7H,gBAAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,cAAW;AAAA,sBACX,SAAS,YAAY;AAAA,sBACrB,MAAK;AAAA,sBACL,UAAU,CAAC,YAAY,OAAO,EAAE,cAAc,QAAQ,GAAG,kBAAkB,UAAU,YAAY,YAAY,GAAG;AAAA;AAAA,kBAClH;AAAA,mBACF;AAAA,iBACF;AAAA,eACF;AAAA,YAEA,gBAAAC,MAAC,cAAS,WAAW,cACnB;AAAA,8BAAAD,KAAC,YAAO,WAAU,WAAU,8BAAgB;AAAA,cAC5C,gBAAAC,MAAC,SAAI,WAAU,+BACb;AAAA,gCAAAD,KAAC,UAAK,WAAU,gGAA+F,0BAAAA,KAAC,gBAAa,eAAY,QAAO,WAAU,WAAU,GAAE;AAAA,gBACtK,gBAAAC,MAAC,SAAI;AAAA,kCAAAD,KAAC,QAAG,WAAU,aAAY,8BAAgB;AAAA,kBAAK,gBAAAA,KAAC,OAAE,WAAU,kCAAiC,wDAA0C;AAAA,mBAAI;AAAA,iBAClJ;AAAA,cACA,gBAAAA,KAAC,SAAI,WAAU,cACX,WAAC,YAAY,SAAS,aAAa,EAAY,IAAI,CAAC,UACpD,gBAAAC,MAAC,WAAkB,WAAW,GAAG,WAAW,iBAC1C;AAAA,gCAAAD,KAAC,WAAM,MAAK,SAAQ,MAAM,GAAG,OAAO,eAAe,OAAO,OAAO,SAAS,YAAY,cAAc,OAAO,UAAU,MAAM,OAAO,EAAE,WAAW,MAAM,GAAG,4BAA4B,GAAG,WAAU,0BAAyB;AAAA,gBAC1N,gBAAAA,KAAC,UAAK,WAAU,kEAAiE,gBAAE;AAAA,gBACnF,gBAAAA,KAAC,UAAK,WAAU,iBAAiB,oBAAU,aAAa,cAAW,UAAU,UAAU,WAAW,gBAAe;AAAA,mBAHvG,KAIZ,CACD,GACH;AAAA,eACF;AAAA,YAEA,gBAAAC,MAAC,cAAS,WAAW,GAAG,YAAY,uBAClC;AAAA,8BAAAD,KAAC,YAAO,WAAU,WAAU,uCAAmB;AAAA,cAC/C,gBAAAC,MAAC,SAAI,WAAU,+BAA8B;AAAA,gCAAAD,KAAC,UAAK,WAAU,gGAA+F,0BAAAA,KAAC,sBAAmB,eAAY,QAAO,WAAU,WAAU,GAAE;AAAA,gBAAO,gBAAAC,MAAC,SAAI;AAAA,kCAAAD,KAAC,QAAG,WAAU,aAAY,uCAAmB;AAAA,kBAAK,gBAAAA,KAAC,OAAE,WAAU,kCAAiC,mFAAyD;AAAA,mBAAI;AAAA,iBAAM;AAAA,cACxY,gBAAAA,KAAC,SAAI,WAAU,iCACZ,yBAAe,IAAI,CAAC,EAAE,KAAK,OAAO,aAAa,KAAK,MACnD,gBAAAC,MAAC,WAAgB,WAAW,GAAG,WAAW,gBACxC;AAAA,gCAAAD,KAAC,WAAM,MAAK,YAAW,SAAS,YAAY,GAAG,GAAG,UAAU,CAAC,UAAU,OAAO,EAAE,CAAC,GAAG,GAAG,MAAM,OAAO,QAAQ,GAAG,GAAG,KAAK,IAAI,MAAM,OAAO,UAAU,YAAY,YAAY,GAAG,GAAG,WAAU,yBAAwB;AAAA,gBAClN,gBAAAC,MAAC,UAAK;AAAA,kCAAAA,MAAC,UAAK,WAAU,yCAAwC;AAAA,oCAAAD,KAAC,QAAK,eAAY,QAAO,WAAU,mCAAkC;AAAA,oBAAG;AAAA,qBAAM;AAAA,kBAAO,gBAAAA,KAAC,UAAK,WAAU,6CAA6C,uBAAY;AAAA,mBAAO;AAAA,mBAFzN,GAGZ,CACD,GACH;AAAA,eACF;AAAA,aACF;AAAA,UACA,gBAAAA,KAAC,SAAI,WAAU,oFACb,0BAAAC,MAAC,YAAO,MAAK,UAAS,SAAS,MAAM;AAAE;AAAa,4BAAgB,4CAAmC;AAAA,UAAG,GAAG,WAAU,2PAA0P;AAAA,4BAAAD,KAAC,gBAAa,eAAY,QAAO,WAAU,WAAU;AAAA,YAAE;AAAA,aAA8B,GACxc;AAAA,UACA,gBAAAA,KAAC,OAAE,WAAU,WAAU,MAAK,UAAS,aAAU,UAAU,wBAAa;AAAA;AAAA;AAAA,IACxE;AAAA,KACF;AAEJ;;;AC3NA,SAAS,cAAAG,mBAAkB;AAgBvB,SAME,OAAAC,MANF,QAAAC,aAAA;AAPW,SAAR,mBAAoC;AAAA,EACzC;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR;AACF,GAA4B;AAC1B,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,gBAAc;AAAA,MACd,SAAS,MAAM,SAAS,CAAC,OAAO;AAAA,MAChC,WAAW,uWAAuW,gCAAa,EAAE,GAAG,KAAK;AAAA,MAEzY;AAAA,wBAAAD,KAACD,aAAA,EAAW,eAAY,QAAO,WAAU,WAAU;AAAA,QACnD,gBAAAC,KAAC,UAAM,iBAAM;AAAA,QACb,gBAAAA,KAAC,UAAK,eAAY,QAAO,WAAU,yEAChC,oBAAU,YAAY,cACzB;AAAA;AAAA;AAAA,EACF;AAEJ;","names":["MdOutlineClose","jsx","jsxs","MdOutlineClose","useState","Fragment","jsx","jsxs","useState","MdContrast","jsx","jsxs"]}