@digigov/ui 1.2.0-a7ffb5dc → 2.0.0-7d9a8d86

package/cjs/app/ThemeOptions/index.js

@@ -1,117 +1,72 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, {get: all[name], enumerable: true});
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? {get: () => module2.default, enumerable: true} : {value: module2, enumerable: true})), module2);
+};
+__markAsModule(exports);
+__export(exports, {
+  ThemeOptions: () => ThemeOptions,
+  default: () => ThemeOptions_default
 });
-exports["default"] = exports.ThemeOptions = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _useFontSize3 = _interopRequireDefault(require("@digigov/ui/app/hooks/useFontSize"));
-var _useHighlightLinks3 = _interopRequireDefault(require("@digigov/ui/app/hooks/useHighlightLinks"));
-var _useLetterSpacing3 = _interopRequireDefault(require("@digigov/ui/app/hooks/useLetterSpacing"));
-var _useLineHeight3 = _interopRequireDefault(require("@digigov/ui/app/hooks/useLineHeight"));
-var _useTheme3 = _interopRequireDefault(require("@digigov/ui/app/hooks/useTheme"));
-var _Button = _interopRequireDefault(require("@digigov/ui/form/Button"));
-var _FieldContainer = _interopRequireWildcard(require("@digigov/ui/form/FieldContainer"));
-var _Form = _interopRequireDefault(require("@digigov/ui/form/Form"));
-var _RadioContainer = require("@digigov/ui/form/RadioContainer");
-var _SectionBreak = _interopRequireDefault(require("@digigov/ui/layouts/SectionBreak"));
-var _VisuallyHidden = require("@digigov/ui/utils/VisuallyHidden");
-var _excluded = ["colorsOption", "fontSizeOption", "lineHeightOption", "letterSpacingOption", "highlightLinksOption", "colorsOptionTitleSize", "fontSizeOptionTitleSize", "lineHeightOptionTitleSize", "letterSpacingOptionTitleSize", "highlightLinksOptionTitleSize", "className"];
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
-var FieldsetLegendTitle = function FieldsetLegendTitle(_ref) {
-  var titleSize = _ref.titleSize,
-    titleValue = _ref.titleValue;
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, titleSize === 'hidden' ? /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, null, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden.VisuallyHidden, null, titleValue)) : /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
+var import_react = __toModule(require("react"));
+var import_clsx = __toModule(require("clsx"));
+var import_useFontSize = __toModule(require("@digigov/ui/app/hooks/useFontSize"));
+var import_useHighlightLinks = __toModule(require("@digigov/ui/app/hooks/useHighlightLinks"));
+var import_useLetterSpacing = __toModule(require("@digigov/ui/app/hooks/useLetterSpacing"));
+var import_useLineHeight = __toModule(require("@digigov/ui/app/hooks/useLineHeight"));
+var import_useTheme = __toModule(require("@digigov/ui/app/hooks/useTheme"));
+var import_Button = __toModule(require("@digigov/ui/form/Button"));
+var import_FieldContainer = __toModule(require("@digigov/ui/form/FieldContainer"));
+var import_Form = __toModule(require("@digigov/ui/form/Form"));
+var import_RadioContainer = __toModule(require("@digigov/ui/form/RadioContainer"));
+var import_SectionBreak = __toModule(require("@digigov/ui/layouts/SectionBreak"));
+var import_VisuallyHidden = __toModule(require("@digigov/ui/utils/VisuallyHidden"));
+const FieldsetLegendTitle = ({titleSize, titleValue}) => {
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, titleSize === "hidden" ? /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.FieldsetLegend, null, /* @__PURE__ */ import_react.default.createElement(import_VisuallyHidden.VisuallyHidden, null, titleValue)) : /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.FieldsetLegend, {
     size: titleSize
   }, titleValue));
 };
-
-// export const ThemeOptions = () => {
-var _ref3 = /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
-  size: "sm"
-}, "\u039C\u03AD\u03B3\u03B5\u03B8\u03BF\u03C2 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AC\u03C4\u03C9\u03BD");
-var _ref4 = /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
-  size: "sm"
-}, "\u038E\u03C8\u03BF\u03C2 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AE\u03C2 \u03BA\u03B5\u03B9\u03BC\u03AD\u03BD\u03C9\u03BD");
-var _ref5 = /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
-  size: "sm"
-}, "\u0391\u03C0\u03CC\u03C3\u03C4\u03B1\u03C3\u03B7 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AC\u03C4\u03C9\u03BD");
-var _ref6 = /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
-  size: "sm"
-}, "\u0388\u03BD\u03C4\u03BF\u03BD\u03B7 \u03B5\u03BC\u03C6\u03AC\u03BD\u03B9\u03C3\u03B7 \u03C3\u03C5\u03BD\u03B4\u03AD\u03C3\u03BC\u03C9\u03BD");
-var _ref7 = /*#__PURE__*/_react["default"].createElement(_SectionBreak["default"], {
-  visible: false
-});
-var ThemeOptions = exports.ThemeOptions = /*#__PURE__*/_react["default"].forwardRef(function ThemeOptions(_ref2, ref) {
-  var _ref2$colorsOption = _ref2.colorsOption,
-    colorsOption = _ref2$colorsOption === void 0 ? true : _ref2$colorsOption,
-    _ref2$fontSizeOption = _ref2.fontSizeOption,
-    fontSizeOption = _ref2$fontSizeOption === void 0 ? true : _ref2$fontSizeOption,
-    _ref2$lineHeightOptio = _ref2.lineHeightOption,
-    lineHeightOption = _ref2$lineHeightOptio === void 0 ? true : _ref2$lineHeightOptio,
-    _ref2$letterSpacingOp = _ref2.letterSpacingOption,
-    letterSpacingOption = _ref2$letterSpacingOp === void 0 ? true : _ref2$letterSpacingOp,
-    _ref2$highlightLinksO = _ref2.highlightLinksOption,
-    highlightLinksOption = _ref2$highlightLinksO === void 0 ? true : _ref2$highlightLinksO,
-    _ref2$colorsOptionTit = _ref2.colorsOptionTitleSize,
-    colorsOptionTitleSize = _ref2$colorsOptionTit === void 0 ? 'sm' : _ref2$colorsOptionTit,
-    _ref2$fontSizeOptionT = _ref2.fontSizeOptionTitleSize,
-    fontSizeOptionTitleSize = _ref2$fontSizeOptionT === void 0 ? 'sm' : _ref2$fontSizeOptionT,
-    _ref2$lineHeightOptio2 = _ref2.lineHeightOptionTitleSize,
-    lineHeightOptionTitleSize = _ref2$lineHeightOptio2 === void 0 ? 'sm' : _ref2$lineHeightOptio2,
-    _ref2$letterSpacingOp2 = _ref2.letterSpacingOptionTitleSize,
-    letterSpacingOptionTitleSize = _ref2$letterSpacingOp2 === void 0 ? 'sm' : _ref2$letterSpacingOp2,
-    _ref2$highlightLinksO2 = _ref2.highlightLinksOptionTitleSize,
-    highlightLinksOptionTitleSize = _ref2$highlightLinksO2 === void 0 ? 'sm' : _ref2$highlightLinksO2,
-    className = _ref2.className,
-    props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
-  var _useTheme = (0, _useTheme3["default"])(),
-    _useTheme2 = (0, _slicedToArray2["default"])(_useTheme, 2),
-    theme = _useTheme2[0],
-    changeTheme = _useTheme2[1];
-  var _useState = (0, _react.useState)(theme || 'auto'),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    selectedTheme = _useState2[0],
-    setSelectedTheme = _useState2[1];
-  var _useFontSize = (0, _useFontSize3["default"])(),
-    _useFontSize2 = (0, _slicedToArray2["default"])(_useFontSize, 2),
-    fontSize = _useFontSize2[0],
-    changeFontSize = _useFontSize2[1];
-  var _useState3 = (0, _react.useState)(fontSize || 'default'),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    selectedFontSize = _useState4[0],
-    setSelectedFontSize = _useState4[1];
-  var _useLineHeight = (0, _useLineHeight3["default"])(),
-    _useLineHeight2 = (0, _slicedToArray2["default"])(_useLineHeight, 2),
-    lineHeight = _useLineHeight2[0],
-    changeLineHeight = _useLineHeight2[1];
-  var _useState5 = (0, _react.useState)(lineHeight || 'default'),
-    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
-    selectedLineHeight = _useState6[0],
-    setSelectedLineHeight = _useState6[1];
-  var _useLetterSpacing = (0, _useLetterSpacing3["default"])(),
-    _useLetterSpacing2 = (0, _slicedToArray2["default"])(_useLetterSpacing, 2),
-    letterSpacing = _useLetterSpacing2[0],
-    changeLetterSpacing = _useLetterSpacing2[1];
-  var _useState7 = (0, _react.useState)(letterSpacing || 'default'),
-    _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
-    selectedLetterSpacing = _useState8[0],
-    setSelectedLetterSpacing = _useState8[1];
-  var _useHighlightLinks = (0, _useHighlightLinks3["default"])(),
-    _useHighlightLinks2 = (0, _slicedToArray2["default"])(_useHighlightLinks, 2),
-    highlightLinks = _useHighlightLinks2[0],
-    changeHighlightLinks = _useHighlightLinks2[1];
-  var _useState9 = (0, _react.useState)(highlightLinks || 'default'),
-    _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
-    selectedHighlightLinks = _useState10[0],
-    setSelectedHighlightLinks = _useState10[1];
+const ThemeOptions = import_react.default.forwardRef(function ThemeOptions2({
+  colorsOption = true,
+  fontSizeOption = true,
+  lineHeightOption = true,
+  letterSpacingOption = true,
+  highlightLinksOption = true,
+  colorsOptionTitleSize = "sm",
+  fontSizeOptionTitleSize = "sm",
+  lineHeightOptionTitleSize = "sm",
+  letterSpacingOptionTitleSize = "sm",
+  highlightLinksOptionTitleSize = "sm",
+  className,
+  ...props
+}, ref) {
+  const [theme, changeTheme] = (0, import_useTheme.default)();
+  const [selectedTheme, setSelectedTheme] = (0, import_react.useState)(theme || "auto");
+  const [fontSize, changeFontSize] = (0, import_useFontSize.default)();
+  const [selectedFontSize, setSelectedFontSize] = (0, import_react.useState)(fontSize || "default");
+  const [lineHeight, changeLineHeight] = (0, import_useLineHeight.default)();
+  const [selectedLineHeight, setSelectedLineHeight] = (0, import_react.useState)(lineHeight || "default");
+  const [letterSpacing, changeLetterSpacing] = (0, import_useLetterSpacing.default)();
+  const [selectedLetterSpacing, setSelectedLetterSpacing] = (0, import_react.useState)(letterSpacing || "default");
+  const [highlightLinks, changeHighlightLinks] = (0, import_useHighlightLinks.default)();
+  const [selectedHighlightLinks, setSelectedHighlightLinks] = (0, import_react.useState)(highlightLinks || "default");
   function handleOptions() {
     changeTheme(selectedTheme);
     changeFontSize(selectedFontSize);
@@ -120,11 +75,11 @@ var ThemeOptions = exports.ThemeOptions = /*#__PURE__*/_react["default"].forward
     changeHighlightLinks(selectedHighlightLinks);
   }
   function resetOptions() {
-    setSelectedTheme('light');
-    setSelectedFontSize('default');
-    setSelectedLineHeight('default');
-    setSelectedLetterSpacing('default');
-    setSelectedHighlightLinks('default');
+    setSelectedTheme("light");
+    setSelectedFontSize("default");
+    setSelectedLineHeight("default");
+    setSelectedLetterSpacing("default");
+    setSelectedHighlightLinks("default");
   }
   function optionsHasChanged() {
     if (theme != selectedTheme || fontSize != selectedFontSize || lineHeight != selectedLineHeight || letterSpacing != selectedLetterSpacing || highlightLinks != selectedHighlightLinks) {
@@ -133,113 +88,115 @@ var ThemeOptions = exports.ThemeOptions = /*#__PURE__*/_react["default"].forward
       return false;
     }
   }
-  return /*#__PURE__*/_react["default"].createElement(_Form["default"], (0, _extends2["default"])({}, props, {
-    ref: ref,
-    className: (0, _clsx["default"])(className)
-  }), colorsOption && /*#__PURE__*/_react["default"].createElement(_FieldContainer["default"], {
+  return /* @__PURE__ */ import_react.default.createElement(import_Form.default, {
+    ...props,
+    ref,
+    className: (0, import_clsx.default)(className)
+  }, colorsOption && /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.default, {
     marginBottom: 4
-  }, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, /*#__PURE__*/_react["default"].createElement(FieldsetLegendTitle, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.Fieldset, null, /* @__PURE__ */ import_react.default.createElement(FieldsetLegendTitle, {
     titleSize: colorsOptionTitleSize,
     titleValue: "\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE \u03B8\u03AD\u03BC\u03B1\u03C4\u03BF\u03C2"
-  }), /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioContainer, null, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+  }), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioContainer, null, /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "theme_mode",
     value: "light",
-    onChange: function onChange() {
-      return setSelectedTheme('light');
-    },
-    checked: selectedTheme === 'light'
-  }, "\u03A6\u03C9\u03C4\u03B5\u03B9\u03BD\u03CC \u03B8\u03AD\u03BC\u03B1"), /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+    onChange: () => setSelectedTheme("light"),
+    checked: selectedTheme === "light"
+  }, "\u03A6\u03C9\u03C4\u03B5\u03B9\u03BD\u03CC \u03B8\u03AD\u03BC\u03B1"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "theme_mode",
     value: "dark",
-    onChange: function onChange() {
-      return setSelectedTheme('dark');
-    },
-    checked: selectedTheme === 'dark'
-  }, "\u03A3\u03BA\u03BF\u03CD\u03C1\u03BF \u03B8\u03AD\u03BC\u03B1"), /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+    onChange: () => setSelectedTheme("dark"),
+    checked: selectedTheme === "dark"
+  }, "\u03A3\u03BA\u03BF\u03CD\u03C1\u03BF \u03B8\u03AD\u03BC\u03B1"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "theme_mode",
     value: "auto",
-    onChange: function onChange() {
-      return setSelectedTheme('auto');
-    },
-    checked: selectedTheme === 'auto'
-  }, "\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE \u03C3\u03C5\u03C3\u03C4\u03AE\u03BC\u03B1\u03C4\u03BF\u03C2")))), fontSizeOption && /*#__PURE__*/_react["default"].createElement(_FieldContainer["default"], {
+    onChange: () => setSelectedTheme("auto"),
+    checked: selectedTheme === "auto"
+  }, "\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE \u03C3\u03C5\u03C3\u03C4\u03AE\u03BC\u03B1\u03C4\u03BF\u03C2")))), fontSizeOption && /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.default, {
     marginBottom: 4
-  }, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, _ref3, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioContainer, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.Fieldset, null, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.FieldsetLegend, {
+    size: "sm"
+  }, "\u039C\u03AD\u03B3\u03B5\u03B8\u03BF\u03C2 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AC\u03C4\u03C9\u03BD"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioContainer, {
     layout: "horizontal"
-  }, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "font-size",
     value: "no",
-    onChange: function onChange() {
-      return setSelectedFontSize('default');
-    },
-    checked: selectedFontSize === 'default'
-  }, "\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03CC (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)"), /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+    onChange: () => setSelectedFontSize("default"),
+    checked: selectedFontSize === "default"
+  }, "\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03CC (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "font-size",
     value: "yes",
-    onChange: function onChange() {
-      setSelectedFontSize('large');
+    onChange: () => {
+      setSelectedFontSize("large");
     },
-    checked: selectedFontSize === 'large'
-  }, "\u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03BF")))), lineHeightOption && /*#__PURE__*/_react["default"].createElement(_FieldContainer["default"], {
+    checked: selectedFontSize === "large"
+  }, "\u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03BF")))), lineHeightOption && /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.default, {
     marginBottom: 4
-  }, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, _ref4, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioContainer, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.Fieldset, null, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.FieldsetLegend, {
+    size: "sm"
+  }, "\u038E\u03C8\u03BF\u03C2 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AE\u03C2 \u03BA\u03B5\u03B9\u03BC\u03AD\u03BD\u03C9\u03BD"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioContainer, {
     layout: "horizontal"
-  }, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "line-height",
     value: "no",
-    onChange: function onChange() {
-      return setSelectedLineHeight('default');
-    },
-    checked: selectedLineHeight === 'default'
-  }, "\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03CC (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)"), /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+    onChange: () => setSelectedLineHeight("default"),
+    checked: selectedLineHeight === "default"
+  }, "\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03CC (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "line-height",
     value: "yes",
-    onChange: function onChange() {
-      setSelectedLineHeight('large');
+    onChange: () => {
+      setSelectedLineHeight("large");
     },
-    checked: selectedLineHeight === 'large'
-  }, "\u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03BF")))), letterSpacingOption && /*#__PURE__*/_react["default"].createElement(_FieldContainer["default"], {
+    checked: selectedLineHeight === "large"
+  }, "\u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03BF")))), letterSpacingOption && /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.default, {
     marginBottom: 4
-  }, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, _ref5, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioContainer, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.Fieldset, null, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.FieldsetLegend, {
+    size: "sm"
+  }, "\u0391\u03C0\u03CC\u03C3\u03C4\u03B1\u03C3\u03B7 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AC\u03C4\u03C9\u03BD"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioContainer, {
     layout: "horizontal"
-  }, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "letter-spacing",
     value: "no",
-    onChange: function onChange() {
-      return setSelectedLetterSpacing('default');
-    },
-    checked: selectedLetterSpacing === 'default'
-  }, "\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03AE (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)"), /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+    onChange: () => setSelectedLetterSpacing("default"),
+    checked: selectedLetterSpacing === "default"
+  }, "\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03AE (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "letter-spacing",
     value: "yes",
-    onChange: function onChange() {
-      setSelectedLetterSpacing('extra');
+    onChange: () => {
+      setSelectedLetterSpacing("extra");
     },
-    checked: selectedLetterSpacing === 'extra'
-  }, "\u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03B7")))), highlightLinksOption && /*#__PURE__*/_react["default"].createElement(_FieldContainer["default"], {
+    checked: selectedLetterSpacing === "extra"
+  }, "\u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03B7")))), highlightLinksOption && /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.default, {
     marginBottom: 4
-  }, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, _ref6, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioContainer, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.Fieldset, null, /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.FieldsetLegend, {
+    size: "sm"
+  }, "\u0388\u03BD\u03C4\u03BF\u03BD\u03B7 \u03B5\u03BC\u03C6\u03AC\u03BD\u03B9\u03C3\u03B7 \u03C3\u03C5\u03BD\u03B4\u03AD\u03C3\u03BC\u03C9\u03BD"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioContainer, {
     layout: "horizontal"
-  }, /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "highlight-links",
     value: "no",
-    onChange: function onChange() {
-      return setSelectedHighlightLinks('default');
-    },
-    checked: selectedHighlightLinks === 'default'
-  }, "\u038C\u03C7\u03B9 (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)"), /*#__PURE__*/_react["default"].createElement(_RadioContainer.RadioItem, {
+    onChange: () => setSelectedHighlightLinks("default"),
+    checked: selectedHighlightLinks === "default"
+  }, "\u038C\u03C7\u03B9 (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)"), /* @__PURE__ */ import_react.default.createElement(import_RadioContainer.RadioItem, {
     name: "highlight-links",
     value: "yes",
-    onChange: function onChange() {
-      setSelectedHighlightLinks('highlight');
+    onChange: () => {
+      setSelectedHighlightLinks("highlight");
     },
-    checked: selectedHighlightLinks === 'highlight'
-  }, "\u039D\u03B1\u03B9")))), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+    checked: selectedHighlightLinks === "highlight"
+  }, "\u039D\u03B1\u03B9")))), /* @__PURE__ */ import_react.default.createElement(import_Button.default, {
     onClick: resetOptions,
     variant: "link"
-  }, "\u0395\u03C0\u03B1\u03BD\u03B1\u03C6\u03BF\u03C1\u03AC \u03CC\u03BB\u03C9\u03BD \u03C4\u03C9\u03BD \u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03CE\u03BD"), _ref7, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+  }, "\u0395\u03C0\u03B1\u03BD\u03B1\u03C6\u03BF\u03C1\u03AC \u03CC\u03BB\u03C9\u03BD \u03C4\u03C9\u03BD \u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03CE\u03BD"), /* @__PURE__ */ import_react.default.createElement(import_SectionBreak.default, {
+    visible: false
+  }), /* @__PURE__ */ import_react.default.createElement(import_Button.default, {
     onClick: handleOptions,
     disabled: !optionsHasChanged()
   }, "\u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE"));
 });
-var _default = exports["default"] = ThemeOptions;
+var ThemeOptions_default = ThemeOptions;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ThemeOptions
+});
+//# sourceMappingURL=index.js.map

package/cjs/app/ThemeOptions/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/app/ThemeOptions/index.tsx"],
+  "sourcesContent": ["import React, { useState } from 'react';\nimport clsx from 'clsx';\nimport { BaseProps } from '@digigov/react-core/Base';\nimport useFontSize, {\n  FontSizeOptions,\n} from '@digigov/ui/app/hooks/useFontSize';\nimport useHighlightLinks, {\n  HighlightLinksOptions,\n} from '@digigov/ui/app/hooks/useHighlightLinks';\nimport useLetterSpacing, {\n  LetterSpacingOptions,\n} from '@digigov/ui/app/hooks/useLetterSpacing';\nimport useLineHeight, {\n  LineHeightOptions,\n} from '@digigov/ui/app/hooks/useLineHeight';\nimport useTheme, { ThemeSelectOptions } from '@digigov/ui/app/hooks/useTheme';\nimport Button from '@digigov/ui/form/Button';\nimport FieldContainer, {\n  Fieldset,\n  FieldsetLegend,\n} from '@digigov/ui/form/FieldContainer';\nimport Form from '@digigov/ui/form/Form';\nimport { RadioContainer, RadioItem } from '@digigov/ui/form/RadioContainer';\nimport SectionBreak from '@digigov/ui/layouts/SectionBreak';\n\nimport { VisuallyHidden } from '@digigov/ui/utils/VisuallyHidden';\n\nexport interface ThemeOptionsProps extends BaseProps<'form'> {\n  colorsOption?: boolean;\n  fontSizeOption?: boolean;\n  lineHeightOption?: boolean;\n  letterSpacingOption?: boolean;\n  highlightLinksOption?: boolean;\n\n  colorsOptionTitleSize?: TitleSize;\n  fontSizeOptionTitleSize?: TitleSize;\n  lineHeightOptionTitleSize?: TitleSize;\n  letterSpacingOptionTitleSize?: TitleSize;\n  highlightLinksOptionTitleSize?: TitleSize;\n}\n\ntype TitleSize = 'xl' | 'lg' | 'md' | 'sm' | 'hidden';\n\nconst FieldsetLegendTitle = ({ titleSize, titleValue }) => {\n  return (\n    <>\n      {titleSize === 'hidden' ? (\n        <FieldsetLegend>\n          <VisuallyHidden>{titleValue}</VisuallyHidden>\n        </FieldsetLegend>\n      ) : (\n        <FieldsetLegend size={titleSize}>{titleValue}</FieldsetLegend>\n      )}\n    </>\n  );\n};\n\n// export const ThemeOptions = () => {\nexport const ThemeOptions = React.forwardRef<\n  HTMLFormElement,\n  ThemeOptionsProps\n>(function ThemeOptions(\n  {\n    colorsOption = true,\n    fontSizeOption = true,\n    lineHeightOption = true,\n    letterSpacingOption = true,\n    highlightLinksOption = true,\n\n    colorsOptionTitleSize = 'sm',\n    fontSizeOptionTitleSize = 'sm',\n    lineHeightOptionTitleSize = 'sm',\n    letterSpacingOptionTitleSize = 'sm',\n    highlightLinksOptionTitleSize = 'sm',\n\n    className,\n    ...props\n  },\n  ref\n) {\n  const [theme, changeTheme] = useTheme();\n  const [selectedTheme, setSelectedTheme] = useState<ThemeSelectOptions>(\n    theme || 'auto'\n  );\n  const [fontSize, changeFontSize] = useFontSize();\n  const [selectedFontSize, setSelectedFontSize] = useState<FontSizeOptions>(\n    fontSize || 'default'\n  );\n  const [lineHeight, changeLineHeight] = useLineHeight();\n  const [selectedLineHeight, setSelectedLineHeight] = useState<\n    LineHeightOptions\n  >(lineHeight || 'default');\n  const [letterSpacing, changeLetterSpacing] = useLetterSpacing();\n  const [selectedLetterSpacing, setSelectedLetterSpacing] = useState<\n    LetterSpacingOptions\n  >(letterSpacing || 'default');\n\n  const [highlightLinks, changeHighlightLinks] = useHighlightLinks();\n  const [selectedHighlightLinks, setSelectedHighlightLinks] = useState<\n    HighlightLinksOptions\n  >(highlightLinks || 'default');\n\n  function handleOptions() {\n    changeTheme(selectedTheme);\n    changeFontSize(selectedFontSize);\n    changeLineHeight(selectedLineHeight);\n    changeLetterSpacing(selectedLetterSpacing);\n    changeHighlightLinks(selectedHighlightLinks);\n  }\n  function resetOptions() {\n    setSelectedTheme('light');\n    setSelectedFontSize('default');\n    setSelectedLineHeight('default');\n    setSelectedLetterSpacing('default');\n    setSelectedHighlightLinks('default');\n  }\n  function optionsHasChanged() {\n    if (\n      theme != selectedTheme ||\n      fontSize != selectedFontSize ||\n      lineHeight != selectedLineHeight ||\n      letterSpacing != selectedLetterSpacing ||\n      highlightLinks != selectedHighlightLinks\n    ) {\n      return true;\n    } else {\n      return false;\n    }\n  }\n\n  return (\n    <Form {...props} ref={ref} className={clsx(className)}>\n      {colorsOption && (\n        <FieldContainer marginBottom={4}>\n          <Fieldset>\n            <FieldsetLegendTitle\n              titleSize={colorsOptionTitleSize}\n              titleValue=\"\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE \u03B8\u03AD\u03BC\u03B1\u03C4\u03BF\u03C2\"\n            />\n            <RadioContainer>\n              <RadioItem\n                name=\"theme_mode\"\n                value=\"light\"\n                onChange={() => setSelectedTheme('light')}\n                checked={selectedTheme === 'light'}\n              >\n                \u03A6\u03C9\u03C4\u03B5\u03B9\u03BD\u03CC \u03B8\u03AD\u03BC\u03B1\n              </RadioItem>\n              <RadioItem\n                name=\"theme_mode\"\n                value=\"dark\"\n                onChange={() => setSelectedTheme('dark')}\n                checked={selectedTheme === 'dark'}\n              >\n                \u03A3\u03BA\u03BF\u03CD\u03C1\u03BF \u03B8\u03AD\u03BC\u03B1\n              </RadioItem>\n              <RadioItem\n                name=\"theme_mode\"\n                value=\"auto\"\n                onChange={() => setSelectedTheme('auto')}\n                checked={selectedTheme === 'auto'}\n              >\n                \u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE \u03C3\u03C5\u03C3\u03C4\u03AE\u03BC\u03B1\u03C4\u03BF\u03C2\n              </RadioItem>\n            </RadioContainer>\n          </Fieldset>\n        </FieldContainer>\n      )}\n      {fontSizeOption && (\n        <FieldContainer marginBottom={4}>\n          <Fieldset>\n            <FieldsetLegend size=\"sm\">\u039C\u03AD\u03B3\u03B5\u03B8\u03BF\u03C2 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AC\u03C4\u03C9\u03BD</FieldsetLegend>\n            <RadioContainer layout=\"horizontal\">\n              <RadioItem\n                name=\"font-size\"\n                value=\"no\"\n                onChange={() => setSelectedFontSize('default')}\n                checked={selectedFontSize === 'default'}\n              >\n                \u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03CC (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)\n              </RadioItem>\n              <RadioItem\n                name=\"font-size\"\n                value=\"yes\"\n                onChange={() => {\n                  setSelectedFontSize('large');\n                }}\n                checked={selectedFontSize === 'large'}\n              >\n                \u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03BF\n              </RadioItem>\n            </RadioContainer>\n          </Fieldset>\n        </FieldContainer>\n      )}\n      {lineHeightOption && (\n        <FieldContainer marginBottom={4}>\n          <Fieldset>\n            <FieldsetLegend size=\"sm\">\u038E\u03C8\u03BF\u03C2 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AE\u03C2 \u03BA\u03B5\u03B9\u03BC\u03AD\u03BD\u03C9\u03BD</FieldsetLegend>\n            <RadioContainer layout=\"horizontal\">\n              <RadioItem\n                name=\"line-height\"\n                value=\"no\"\n                onChange={() => setSelectedLineHeight('default')}\n                checked={selectedLineHeight === 'default'}\n              >\n                \u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03CC (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)\n              </RadioItem>\n              <RadioItem\n                name=\"line-height\"\n                value=\"yes\"\n                onChange={() => {\n                  setSelectedLineHeight('large');\n                }}\n                checked={selectedLineHeight === 'large'}\n              >\n                \u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03BF\n              </RadioItem>\n            </RadioContainer>\n          </Fieldset>\n        </FieldContainer>\n      )}\n      {letterSpacingOption && (\n        <FieldContainer marginBottom={4}>\n          <Fieldset>\n            <FieldsetLegend size=\"sm\">\u0391\u03C0\u03CC\u03C3\u03C4\u03B1\u03C3\u03B7 \u03B3\u03C1\u03B1\u03BC\u03BC\u03AC\u03C4\u03C9\u03BD</FieldsetLegend>\n            <RadioContainer layout=\"horizontal\">\n              <RadioItem\n                name=\"letter-spacing\"\n                value=\"no\"\n                onChange={() => setSelectedLetterSpacing('default')}\n                checked={selectedLetterSpacing === 'default'}\n              >\n                \u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03BA\u03AE (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)\n              </RadioItem>\n              <RadioItem\n                name=\"letter-spacing\"\n                value=\"yes\"\n                onChange={() => {\n                  setSelectedLetterSpacing('extra');\n                }}\n                checked={selectedLetterSpacing === 'extra'}\n              >\n                \u039C\u03B5\u03B3\u03B1\u03BB\u03CD\u03C4\u03B5\u03C1\u03B7\n              </RadioItem>\n            </RadioContainer>\n          </Fieldset>\n        </FieldContainer>\n      )}\n      {highlightLinksOption && (\n        <FieldContainer marginBottom={4}>\n          <Fieldset>\n            <FieldsetLegend size=\"sm\">\u0388\u03BD\u03C4\u03BF\u03BD\u03B7 \u03B5\u03BC\u03C6\u03AC\u03BD\u03B9\u03C3\u03B7 \u03C3\u03C5\u03BD\u03B4\u03AD\u03C3\u03BC\u03C9\u03BD</FieldsetLegend>\n            <RadioContainer layout=\"horizontal\">\n              <RadioItem\n                name=\"highlight-links\"\n                value=\"no\"\n                onChange={() => setSelectedHighlightLinks('default')}\n                checked={selectedHighlightLinks === 'default'}\n              >\n                \u038C\u03C7\u03B9 (\u03C0\u03C1\u03BF\u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE)\n              </RadioItem>\n              <RadioItem\n                name=\"highlight-links\"\n                value=\"yes\"\n                onChange={() => {\n                  setSelectedHighlightLinks('highlight');\n                }}\n                checked={selectedHighlightLinks === 'highlight'}\n              >\n                \u039D\u03B1\u03B9\n              </RadioItem>\n            </RadioContainer>\n          </Fieldset>\n        </FieldContainer>\n      )}\n      <Button onClick={resetOptions} variant=\"link\">\n        \u0395\u03C0\u03B1\u03BD\u03B1\u03C6\u03BF\u03C1\u03AC \u03CC\u03BB\u03C9\u03BD \u03C4\u03C9\u03BD \u03B5\u03C0\u03B9\u03BB\u03BF\u03B3\u03CE\u03BD\n      </Button>\n      <SectionBreak visible={false} />\n      <Button onClick={handleOptions} disabled={!optionsHasChanged()}>\n        \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE\n      </Button>\n    </Form>\n  );\n});\nexport default ThemeOptions;\n"],
+  "mappings": "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",
+  "names": []
+}

package/cjs/app/hooks/useFontSize/index.js

@@ -1,17 +1,51 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, {get: all[name], enumerable: true});
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? {get: () => module2.default, enumerable: true} : {value: module2, enumerable: true})), module2);
+};
+__markAsModule(exports);
+__export(exports, {
+  default: () => useFontSize_default,
+  useFontSize: () => useFontSize
 });
-exports.useFontSize = exports["default"] = void 0;
-var _useVariantVars = _interopRequireDefault(require("@digigov/ui/app/hooks/useVariantVars"));
-var useFontSize = exports.useFontSize = function useFontSize() {
-  var config = {
-    name: 'font-size',
-    variables: ['text-sm', 'text-base', 'text-lg', 'text-xl', 'text-2xl', 'text-3xl', 'text-4xl', 'text-5xl'],
-    variants: ['default', 'large']
+var import_useVariantVars = __toModule(require("@digigov/ui/app/hooks/useVariantVars"));
+const useFontSize = () => {
+  const config = {
+    name: "font-size",
+    variables: [
+      "text-sm",
+      "text-base",
+      "text-lg",
+      "text-xl",
+      "text-2xl",
+      "text-3xl",
+      "text-4xl",
+      "text-5xl"
+    ],
+    variants: ["default", "large"]
   };
-  return (0, _useVariantVars["default"])(config);
+  return (0, import_useVariantVars.default)(config);
 };
-var _default = exports["default"] = useFontSize;
+var useFontSize_default = useFontSize;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useFontSize
+});
+//# sourceMappingURL=useFontSize.js.map

package/cjs/app/hooks/useFontSize.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/app/hooks/useFontSize.ts"],
+  "sourcesContent": ["import useVariantVars, {\n  UseVariantVarsResult,\n} from '@digigov/ui/app/hooks/useVariantVars';\n\nexport type FontSizeOptions = 'default' | 'large';\nexport type StoredFontSizeOptions = FontSizeOptions | null;\n\nexport type UseFontSizeResult = UseVariantVarsResult<FontSizeOptions>;\n\nexport const useFontSize = (): UseFontSizeResult => {\n  const config = {\n    name: 'font-size',\n    variables: [\n      'text-sm',\n      'text-base',\n      'text-lg',\n      'text-xl',\n      'text-2xl',\n      'text-3xl',\n      'text-4xl',\n      'text-5xl',\n    ],\n    variants: ['default', 'large'],\n  };\n  return useVariantVars(config);\n};\n\nexport default useFontSize;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAEO;AAOA,MAAM,cAAc,MAAyB;AAClD,QAAM,SAAS;AAAA,IACb,MAAM;AAAA,IACN,WAAW;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF,UAAU,CAAC,WAAW;AAAA;AAExB,SAAO,mCAAe;AAAA;AAGxB,IAAO,sBAAQ;",
+  "names": []
+}

package/cjs/app/hooks/useHighlightLinks/index.js

@@ -1,40 +1,61 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, {get: all[name], enumerable: true});
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? {get: () => module2.default, enumerable: true} : {value: module2, enumerable: true})), module2);
+};
+__markAsModule(exports);
+__export(exports, {
+  default: () => useHighlightLinks_default,
+  useHighlightLinks: () => useHighlightLinks
 });
-exports.useHighlightLinks = exports["default"] = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = require("react");
-var useHighlightLinks = exports.useHighlightLinks = function useHighlightLinks() {
-  var storedHighlightLinks = localStorage.getItem('--theme-highlight-links');
-  var _useState = (0, _react.useState)(storedHighlightLinks || 'default'),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    highlightLinks = _useState2[0],
-    changeHighlightLinks = _useState2[1];
-  (0, _react.useEffect)(function () {
-    if (highlightLinks === 'highlight') {
-      document.documentElement.classList.add("ds-highlight-links");
+var import_react = __toModule(require("react"));
+const useHighlightLinks = () => {
+  const storedHighlightLinks = localStorage.getItem("--theme-highlight-links");
+  const [highlightLinks, changeHighlightLinks] = (0, import_react.useState)(storedHighlightLinks || "default");
+  (0, import_react.useEffect)(() => {
+    if (highlightLinks === "highlight") {
+      document.documentElement.classList.add(`ds-highlight-links`);
     } else {
-      document.documentElement.classList.remove("ds-highlight-links");
+      document.documentElement.classList.remove(`ds-highlight-links`);
     }
-    localStorage.setItem('--theme-highlight-links', highlightLinks);
+    localStorage.setItem("--theme-highlight-links", highlightLinks);
   }, [highlightLinks]);
-  (0, _react.useEffect)(function () {
-    var beforePrintListener = function beforePrintListener() {
-      document.documentElement.classList.remove("ds-highlight-links");
+  (0, import_react.useEffect)(() => {
+    const beforePrintListener = () => {
+      document.documentElement.classList.remove(`ds-highlight-links`);
     };
-    var afterPrintListener = function afterPrintListener() {
-      document.documentElement.classList.add(localStorage.getItem('--theme-highlight-links') === 'highlight' ? "ds-highlight-links" : '');
+    const afterPrintListener = () => {
+      document.documentElement.classList.add(localStorage.getItem("--theme-highlight-links") === "highlight" ? `ds-highlight-links` : "");
     };
-    window.addEventListener('beforeprint', beforePrintListener);
-    window.addEventListener('afterprint', afterPrintListener);
-    return function () {
-      window.removeEventListener('beforeprint', beforePrintListener);
-      window.removeEventListener('afterprint', afterPrintListener);
+    window.addEventListener("beforeprint", beforePrintListener);
+    window.addEventListener("afterprint", afterPrintListener);
+    return () => {
+      window.removeEventListener("beforeprint", beforePrintListener);
+      window.removeEventListener("afterprint", afterPrintListener);
     };
   }, []);
   return [highlightLinks, changeHighlightLinks];
 };
-var _default = exports["default"] = useHighlightLinks;
+var useHighlightLinks_default = useHighlightLinks;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useHighlightLinks
+});
+//# sourceMappingURL=useHighlightLinks.js.map