New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details →
react-darkreader
Advanced tools
react-darkreader - npm Package Compare versions
+0
-0
@@ -0,0 +0,0 @@ MIT License |
+1
-1
| { | ||
| "name": "react-darkreader", | ||
| "version": "1.4.8", | ||
| "version": "1.5.0", | ||
| "description": "A React Hook for adding a dark / night mode to your site inspired by darkreader", | ||
@@ -5,0 +5,0 @@ "keywords": [ |
+0
-0
@@ -0,0 +0,0 @@ <p align="center"> |
| import '@testing-library/jest-dom'; |
| import '@testing-library/jest-dom'; |
| export {}; |
| /// <reference types="react" /> | ||
| import { Theme, DynamicThemeFix } from 'darkreader'; | ||
| export interface DarkreaderProps { | ||
| defaultDarken?: boolean; | ||
| theme?: Partial<Theme>; | ||
| fixes?: DynamicThemeFix; | ||
| onChange?: (checked: boolean) => void; | ||
| } | ||
| export default function Darkreader({ defaultDarken, theme, fixes, onChange, }: DarkreaderProps): JSX.Element; |
| import Darkreader from './Darkreader'; | ||
| export { default as Switch } from './Switch'; | ||
| export { default as useDarkreader } from './useDarkreader'; | ||
| export default Darkreader; |
| import React, { useState, useEffect, useMemo } from 'react'; | ||
| import { setFetchMethod, enable, disable, exportGeneratedCSS } from 'darkreader'; | ||
| import ReactSwitch from 'react-switch'; | ||
| function _defineProperty(obj, key, value) { | ||
| if (key in obj) { | ||
| Object.defineProperty(obj, key, { | ||
| value: value, | ||
| enumerable: true, | ||
| configurable: true, | ||
| writable: true | ||
| }); | ||
| } else { | ||
| obj[key] = value; | ||
| } | ||
| return obj; | ||
| } | ||
| function ownKeys(object, enumerableOnly) { | ||
| var keys = Object.keys(object); | ||
| if (Object.getOwnPropertySymbols) { | ||
| var symbols = Object.getOwnPropertySymbols(object); | ||
| if (enumerableOnly) symbols = symbols.filter(function (sym) { | ||
| return Object.getOwnPropertyDescriptor(object, sym).enumerable; | ||
| }); | ||
| keys.push.apply(keys, symbols); | ||
| } | ||
| return keys; | ||
| } | ||
| function _objectSpread2(target) { | ||
| for (var i = 1; i < arguments.length; i++) { | ||
| var source = arguments[i] != null ? arguments[i] : {}; | ||
| if (i % 2) { | ||
| ownKeys(Object(source), true).forEach(function (key) { | ||
| _defineProperty(target, key, source[key]); | ||
| }); | ||
| } else if (Object.getOwnPropertyDescriptors) { | ||
| Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); | ||
| } else { | ||
| ownKeys(Object(source)).forEach(function (key) { | ||
| Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); | ||
| }); | ||
| } | ||
| } | ||
| return target; | ||
| } | ||
| function _slicedToArray(arr, i) { | ||
| return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); | ||
| } | ||
| function _arrayWithHoles(arr) { | ||
| if (Array.isArray(arr)) return arr; | ||
| } | ||
| function _iterableToArrayLimit(arr, i) { | ||
| if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; | ||
| var _arr = []; | ||
| var _n = true; | ||
| var _d = false; | ||
| var _e = undefined; | ||
| try { | ||
| for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { | ||
| _arr.push(_s.value); | ||
| if (i && _arr.length === i) break; | ||
| } | ||
| } catch (err) { | ||
| _d = true; | ||
| _e = err; | ||
| } finally { | ||
| try { | ||
| if (!_n && _i["return"] != null) _i["return"](); | ||
| } finally { | ||
| if (_d) throw _e; | ||
| } | ||
| } | ||
| return _arr; | ||
| } | ||
| function _unsupportedIterableToArray(o, minLen) { | ||
| if (!o) return; | ||
| if (typeof o === "string") return _arrayLikeToArray(o, minLen); | ||
| var n = Object.prototype.toString.call(o).slice(8, -1); | ||
| if (n === "Object" && o.constructor) n = o.constructor.name; | ||
| if (n === "Map" || n === "Set") return Array.from(o); | ||
| if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); | ||
| } | ||
| function _arrayLikeToArray(arr, len) { | ||
| if (len == null || len > arr.length) len = arr.length; | ||
| for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; | ||
| return arr2; | ||
| } | ||
| function _nonIterableRest() { | ||
| throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); | ||
| } | ||
| function useDarkreader() { | ||
| var defaultDarken = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false; | ||
| var theme = arguments.length > 1 ? arguments[1] : undefined; | ||
| var fixes = arguments.length > 2 ? arguments[2] : undefined; | ||
| var _useState = useState(defaultDarken), | ||
| _useState2 = _slicedToArray(_useState, 2), | ||
| isDark = _useState2[0], | ||
| setIsDark = _useState2[1]; | ||
| var defaultTheme = { | ||
| brightness: 100, | ||
| contrast: 90, | ||
| sepia: 10 | ||
| }; | ||
| var defaultFixes = { | ||
| invert: [], | ||
| css: '', | ||
| ignoreInlineStyle: ['.react-switch-handle'], | ||
| ignoreImageAnalysis: [] | ||
| }; | ||
| useEffect(function () { | ||
| setFetchMethod(window.fetch); | ||
| isDark ? enable(_objectSpread2(_objectSpread2({}, defaultTheme), theme), _objectSpread2(_objectSpread2({}, defaultFixes), fixes)) : disable(); // unmount | ||
| return function () { | ||
| disable(); | ||
| }; // TODO: followSystemColorScheme(); | ||
| }, [isDark]); | ||
| var action = useMemo(function () { | ||
| var toggle = function toggle() { | ||
| return setIsDark(function (prevState) { | ||
| return !prevState; | ||
| }); | ||
| }; | ||
| return { | ||
| toggle: toggle, | ||
| collectCSS: exportGeneratedCSS | ||
| }; | ||
| }, [isDark]); | ||
| return [isDark, action]; | ||
| } | ||
| function styleInject(css, ref) { | ||
| if ( ref === void 0 ) ref = {}; | ||
| var insertAt = ref.insertAt; | ||
| if (!css || typeof document === 'undefined') { return; } | ||
| var head = document.head || document.getElementsByTagName('head')[0]; | ||
| var style = document.createElement('style'); | ||
| style.type = 'text/css'; | ||
| if (insertAt === 'top') { | ||
| if (head.firstChild) { | ||
| head.insertBefore(style, head.firstChild); | ||
| } else { | ||
| head.appendChild(style); | ||
| } | ||
| } else { | ||
| head.appendChild(style); | ||
| } | ||
| if (style.styleSheet) { | ||
| style.styleSheet.cssText = css; | ||
| } else { | ||
| style.appendChild(document.createTextNode(css)); | ||
| } | ||
| } | ||
| var css_248z = "body{\r\n color: rgba(0, 0, 0, 0.85);\r\n background-color: #fff;\r\n}\r\n\r\n.react-switch .react-switch-icon{\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n height: 100%;\r\n}\r\n\r\n.react-switch-docusaurus .react-switch-icon{\r\n font-size: 14px;\r\n}\r\n\r\n.react-switch > .react-switch-bg{\r\n box-sizing: border-box;\r\n}\r\n\r\n.react-switch-github__light > .react-switch-bg{\r\n border: 3px solid #d1d5da;\r\n}\r\n\r\n.react-switch-github__dark > .react-switch-bg{\r\n border: 3px solid #3c1e70;\r\n}\r\n\r\n.react-switch-fluent__light > .react-switch-bg{\r\n border: 1px solid #605e5c;\r\n}\r\n\r\n.react-switch-fluent__dark > .react-switch-bg{\r\n border: 1px solid #0078d4;\r\n}\r\n\r\n"; | ||
| styleInject(css_248z); | ||
| function Switch(SwitchProps) { | ||
| if (SwitchProps.styling === 'docusaurus') { | ||
| return /*#__PURE__*/React.createElement(DocusaurusSwitch, Object.assign({}, SwitchProps)); | ||
| } else if (SwitchProps.styling === 'material') { | ||
| return /*#__PURE__*/React.createElement(MaterialSwitch, Object.assign({}, SwitchProps)); | ||
| } else if (SwitchProps.styling === 'github') { | ||
| return /*#__PURE__*/React.createElement(GithubSwitch, Object.assign({}, SwitchProps)); | ||
| } else if (SwitchProps.styling === 'fluent') { | ||
| return /*#__PURE__*/React.createElement(FluentSwitch, Object.assign({}, SwitchProps)); | ||
| } else { | ||
| return /*#__PURE__*/React.createElement(DocusaurusSwitch, Object.assign({}, SwitchProps)); | ||
| } | ||
| } | ||
| function DocusaurusSwitch(reactSwitchProps) { | ||
| return /*#__PURE__*/React.createElement(ReactSwitch, Object.assign({ | ||
| className: "react-switch react-switch-docusaurus", | ||
| handleDiameter: 20, | ||
| onColor: "#4d4d4d", | ||
| offColor: "#4d4d4d", | ||
| onHandleColor: "#ffffff", | ||
| offHandleColor: "#ffffff", | ||
| boxShadow: "0px 1px 5px rgba(0, 0, 0, 0.6)", | ||
| activeBoxShadow: "0 0 2px 3px #2c89a0", | ||
| width: 50, | ||
| height: 24, | ||
| uncheckedIcon: /*#__PURE__*/React.createElement("span", { | ||
| className: "react-switch-icon" | ||
| }, "\uD83C\uDF1E"), | ||
| checkedIcon: /*#__PURE__*/React.createElement("span", { | ||
| className: "react-switch-icon" | ||
| }, "\uD83C\uDF1C") | ||
| }, reactSwitchProps)); | ||
| } | ||
| function MaterialSwitch(reactSwitchProps) { | ||
| return /*#__PURE__*/React.createElement(ReactSwitch, Object.assign({ | ||
| className: "react-switch react-switch-material", | ||
| onColor: "#ee80a7", | ||
| onHandleColor: "#dc004e", | ||
| handleDiameter: 18, | ||
| uncheckedIcon: false, | ||
| checkedIcon: false, | ||
| boxShadow: "0px 1px 5px rgba(0, 0, 0, 0.6)", | ||
| activeBoxShadow: "0px 0px 1px 10px rgba(0, 0, 0, 0.2)", | ||
| height: 12, | ||
| width: 34 | ||
| }, reactSwitchProps)); | ||
| } | ||
| function GithubSwitch(reactSwitchProps) { | ||
| var svg_month = /*#__PURE__*/React.createElement("span", { | ||
| className: "react-switch-icon" | ||
| }, /*#__PURE__*/React.createElement("svg", { | ||
| fill: "#ffdf5d", | ||
| "aria-hidden": "true", | ||
| width: "14", | ||
| height: "13", | ||
| viewBox: "0 0 14 13", | ||
| xmlns: "http://www.w3.org/2000/svg" | ||
| }, /*#__PURE__*/React.createElement("path", { | ||
| fillRule: "evenodd", | ||
| clipRule: "evenodd", | ||
| d: "M4.52208 7.71754C7.5782 7.71754 10.0557 5.24006 10.0557 2.18394C10.0557 1.93498 10.0392 1.68986 10.0074 1.44961C9.95801 1.07727 10.3495 0.771159 10.6474 0.99992C12.1153 2.12716 13.0615 3.89999 13.0615 5.89383C13.0615 9.29958 10.3006 12.0605 6.89485 12.0605C3.95334 12.0605 1.49286 10.001 0.876728 7.24527C0.794841 6.87902 1.23668 6.65289 1.55321 6.85451C2.41106 7.40095 3.4296 7.71754 4.52208 7.71754Z" | ||
| }))); | ||
| return /*#__PURE__*/React.createElement(ReactSwitch, Object.assign({ | ||
| className: "react-switch react-switch-github react-switch-github__".concat((reactSwitchProps === null || reactSwitchProps === void 0 ? void 0 : reactSwitchProps.checked) ? 'dark' : 'light'), | ||
| onColor: "#271052", | ||
| offColor: "#ffffff", | ||
| onHandleColor: "#6e40c9", | ||
| offHandleColor: "#2f363d", | ||
| handleDiameter: 28, | ||
| uncheckedIcon: false, | ||
| checkedIcon: false, | ||
| uncheckedHandleIcon: svg_month, | ||
| checkedHandleIcon: svg_month, | ||
| boxShadow: "0px 1px 5px rgba(0, 0, 0, 0.6)", | ||
| activeBoxShadow: "0px 0px 1px 4px rgba(0, 0, 0, 0.2)", | ||
| height: 24, | ||
| width: 42 | ||
| }, reactSwitchProps)); | ||
| } | ||
| function FluentSwitch(reactSwitchProps) { | ||
| return /*#__PURE__*/React.createElement(ReactSwitch, Object.assign({ | ||
| className: "react-switch react-switch-fluent react-switch-fluent__".concat((reactSwitchProps === null || reactSwitchProps === void 0 ? void 0 : reactSwitchProps.checked) ? 'dark' : 'light'), | ||
| handleDiameter: 12, | ||
| onColor: "#0078d4", | ||
| offColor: "#ffffff", | ||
| onHandleColor: "#ffffff", | ||
| offHandleColor: "#605e5c", | ||
| activeBoxShadow: "0 0 2px 3px #2c89a0", | ||
| width: 40, | ||
| height: 20, | ||
| uncheckedIcon: false, | ||
| checkedIcon: false | ||
| }, reactSwitchProps)); | ||
| } | ||
| function Darkreader(_ref) { | ||
| var _ref$defaultDarken = _ref.defaultDarken, | ||
| defaultDarken = _ref$defaultDarken === void 0 ? false : _ref$defaultDarken, | ||
| theme = _ref.theme, | ||
| fixes = _ref.fixes, | ||
| _onChange = _ref.onChange; | ||
| var _useDarkreader = useDarkreader(defaultDarken, theme, fixes), | ||
| _useDarkreader2 = _slicedToArray(_useDarkreader, 2), | ||
| isDark = _useDarkreader2[0], | ||
| toggle = _useDarkreader2[1].toggle; | ||
| return /*#__PURE__*/React.createElement(Switch, { | ||
| checked: isDark, | ||
| onChange: function onChange(checked) { | ||
| toggle(); | ||
| _onChange === null || _onChange === void 0 ? void 0 : _onChange(checked); | ||
| } | ||
| }); | ||
| } | ||
| export default Darkreader; | ||
| export { Switch, useDarkreader }; |
-315
| 'use strict'; | ||
| Object.defineProperty(exports, '__esModule', { value: true }); | ||
| var React = require('react'); | ||
| var darkreader = require('darkreader'); | ||
| var ReactSwitch = require('react-switch'); | ||
| function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } | ||
| var React__default = /*#__PURE__*/_interopDefaultLegacy(React); | ||
| var ReactSwitch__default = /*#__PURE__*/_interopDefaultLegacy(ReactSwitch); | ||
| function _defineProperty(obj, key, value) { | ||
| if (key in obj) { | ||
| Object.defineProperty(obj, key, { | ||
| value: value, | ||
| enumerable: true, | ||
| configurable: true, | ||
| writable: true | ||
| }); | ||
| } else { | ||
| obj[key] = value; | ||
| } | ||
| return obj; | ||
| } | ||
| function ownKeys(object, enumerableOnly) { | ||
| var keys = Object.keys(object); | ||
| if (Object.getOwnPropertySymbols) { | ||
| var symbols = Object.getOwnPropertySymbols(object); | ||
| if (enumerableOnly) symbols = symbols.filter(function (sym) { | ||
| return Object.getOwnPropertyDescriptor(object, sym).enumerable; | ||
| }); | ||
| keys.push.apply(keys, symbols); | ||
| } | ||
| return keys; | ||
| } | ||
| function _objectSpread2(target) { | ||
| for (var i = 1; i < arguments.length; i++) { | ||
| var source = arguments[i] != null ? arguments[i] : {}; | ||
| if (i % 2) { | ||
| ownKeys(Object(source), true).forEach(function (key) { | ||
| _defineProperty(target, key, source[key]); | ||
| }); | ||
| } else if (Object.getOwnPropertyDescriptors) { | ||
| Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); | ||
| } else { | ||
| ownKeys(Object(source)).forEach(function (key) { | ||
| Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); | ||
| }); | ||
| } | ||
| } | ||
| return target; | ||
| } | ||
| function _slicedToArray(arr, i) { | ||
| return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); | ||
| } | ||
| function _arrayWithHoles(arr) { | ||
| if (Array.isArray(arr)) return arr; | ||
| } | ||
| function _iterableToArrayLimit(arr, i) { | ||
| if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; | ||
| var _arr = []; | ||
| var _n = true; | ||
| var _d = false; | ||
| var _e = undefined; | ||
| try { | ||
| for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { | ||
| _arr.push(_s.value); | ||
| if (i && _arr.length === i) break; | ||
| } | ||
| } catch (err) { | ||
| _d = true; | ||
| _e = err; | ||
| } finally { | ||
| try { | ||
| if (!_n && _i["return"] != null) _i["return"](); | ||
| } finally { | ||
| if (_d) throw _e; | ||
| } | ||
| } | ||
| return _arr; | ||
| } | ||
| function _unsupportedIterableToArray(o, minLen) { | ||
| if (!o) return; | ||
| if (typeof o === "string") return _arrayLikeToArray(o, minLen); | ||
| var n = Object.prototype.toString.call(o).slice(8, -1); | ||
| if (n === "Object" && o.constructor) n = o.constructor.name; | ||
| if (n === "Map" || n === "Set") return Array.from(o); | ||
| if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); | ||
| } | ||
| function _arrayLikeToArray(arr, len) { | ||
| if (len == null || len > arr.length) len = arr.length; | ||
| for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; | ||
| return arr2; | ||
| } | ||
| function _nonIterableRest() { | ||
| throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); | ||
| } | ||
| function useDarkreader() { | ||
| var defaultDarken = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false; | ||
| var theme = arguments.length > 1 ? arguments[1] : undefined; | ||
| var fixes = arguments.length > 2 ? arguments[2] : undefined; | ||
| var _useState = React.useState(defaultDarken), | ||
| _useState2 = _slicedToArray(_useState, 2), | ||
| isDark = _useState2[0], | ||
| setIsDark = _useState2[1]; | ||
| var defaultTheme = { | ||
| brightness: 100, | ||
| contrast: 90, | ||
| sepia: 10 | ||
| }; | ||
| var defaultFixes = { | ||
| invert: [], | ||
| css: '', | ||
| ignoreInlineStyle: ['.react-switch-handle'], | ||
| ignoreImageAnalysis: [] | ||
| }; | ||
| React.useEffect(function () { | ||
| darkreader.setFetchMethod(window.fetch); | ||
| isDark ? darkreader.enable(_objectSpread2(_objectSpread2({}, defaultTheme), theme), _objectSpread2(_objectSpread2({}, defaultFixes), fixes)) : darkreader.disable(); // unmount | ||
| return function () { | ||
| darkreader.disable(); | ||
| }; // TODO: followSystemColorScheme(); | ||
| }, [isDark]); | ||
| var action = React.useMemo(function () { | ||
| var toggle = function toggle() { | ||
| return setIsDark(function (prevState) { | ||
| return !prevState; | ||
| }); | ||
| }; | ||
| return { | ||
| toggle: toggle, | ||
| collectCSS: darkreader.exportGeneratedCSS | ||
| }; | ||
| }, [isDark]); | ||
| return [isDark, action]; | ||
| } | ||
| function styleInject(css, ref) { | ||
| if ( ref === void 0 ) ref = {}; | ||
| var insertAt = ref.insertAt; | ||
| if (!css || typeof document === 'undefined') { return; } | ||
| var head = document.head || document.getElementsByTagName('head')[0]; | ||
| var style = document.createElement('style'); | ||
| style.type = 'text/css'; | ||
| if (insertAt === 'top') { | ||
| if (head.firstChild) { | ||
| head.insertBefore(style, head.firstChild); | ||
| } else { | ||
| head.appendChild(style); | ||
| } | ||
| } else { | ||
| head.appendChild(style); | ||
| } | ||
| if (style.styleSheet) { | ||
| style.styleSheet.cssText = css; | ||
| } else { | ||
| style.appendChild(document.createTextNode(css)); | ||
| } | ||
| } | ||
| var css_248z = "body{\r\n color: rgba(0, 0, 0, 0.85);\r\n background-color: #fff;\r\n}\r\n\r\n.react-switch .react-switch-icon{\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n height: 100%;\r\n}\r\n\r\n.react-switch-docusaurus .react-switch-icon{\r\n font-size: 14px;\r\n}\r\n\r\n.react-switch > .react-switch-bg{\r\n box-sizing: border-box;\r\n}\r\n\r\n.react-switch-github__light > .react-switch-bg{\r\n border: 3px solid #d1d5da;\r\n}\r\n\r\n.react-switch-github__dark > .react-switch-bg{\r\n border: 3px solid #3c1e70;\r\n}\r\n\r\n.react-switch-fluent__light > .react-switch-bg{\r\n border: 1px solid #605e5c;\r\n}\r\n\r\n.react-switch-fluent__dark > .react-switch-bg{\r\n border: 1px solid #0078d4;\r\n}\r\n\r\n"; | ||
| styleInject(css_248z); | ||
| function Switch(SwitchProps) { | ||
| if (SwitchProps.styling === 'docusaurus') { | ||
| return /*#__PURE__*/React__default['default'].createElement(DocusaurusSwitch, Object.assign({}, SwitchProps)); | ||
| } else if (SwitchProps.styling === 'material') { | ||
| return /*#__PURE__*/React__default['default'].createElement(MaterialSwitch, Object.assign({}, SwitchProps)); | ||
| } else if (SwitchProps.styling === 'github') { | ||
| return /*#__PURE__*/React__default['default'].createElement(GithubSwitch, Object.assign({}, SwitchProps)); | ||
| } else if (SwitchProps.styling === 'fluent') { | ||
| return /*#__PURE__*/React__default['default'].createElement(FluentSwitch, Object.assign({}, SwitchProps)); | ||
| } else { | ||
| return /*#__PURE__*/React__default['default'].createElement(DocusaurusSwitch, Object.assign({}, SwitchProps)); | ||
| } | ||
| } | ||
| function DocusaurusSwitch(reactSwitchProps) { | ||
| return /*#__PURE__*/React__default['default'].createElement(ReactSwitch__default['default'], Object.assign({ | ||
| className: "react-switch react-switch-docusaurus", | ||
| handleDiameter: 20, | ||
| onColor: "#4d4d4d", | ||
| offColor: "#4d4d4d", | ||
| onHandleColor: "#ffffff", | ||
| offHandleColor: "#ffffff", | ||
| boxShadow: "0px 1px 5px rgba(0, 0, 0, 0.6)", | ||
| activeBoxShadow: "0 0 2px 3px #2c89a0", | ||
| width: 50, | ||
| height: 24, | ||
| uncheckedIcon: /*#__PURE__*/React__default['default'].createElement("span", { | ||
| className: "react-switch-icon" | ||
| }, "\uD83C\uDF1E"), | ||
| checkedIcon: /*#__PURE__*/React__default['default'].createElement("span", { | ||
| className: "react-switch-icon" | ||
| }, "\uD83C\uDF1C") | ||
| }, reactSwitchProps)); | ||
| } | ||
| function MaterialSwitch(reactSwitchProps) { | ||
| return /*#__PURE__*/React__default['default'].createElement(ReactSwitch__default['default'], Object.assign({ | ||
| className: "react-switch react-switch-material", | ||
| onColor: "#ee80a7", | ||
| onHandleColor: "#dc004e", | ||
| handleDiameter: 18, | ||
| uncheckedIcon: false, | ||
| checkedIcon: false, | ||
| boxShadow: "0px 1px 5px rgba(0, 0, 0, 0.6)", | ||
| activeBoxShadow: "0px 0px 1px 10px rgba(0, 0, 0, 0.2)", | ||
| height: 12, | ||
| width: 34 | ||
| }, reactSwitchProps)); | ||
| } | ||
| function GithubSwitch(reactSwitchProps) { | ||
| var svg_month = /*#__PURE__*/React__default['default'].createElement("span", { | ||
| className: "react-switch-icon" | ||
| }, /*#__PURE__*/React__default['default'].createElement("svg", { | ||
| fill: "#ffdf5d", | ||
| "aria-hidden": "true", | ||
| width: "14", | ||
| height: "13", | ||
| viewBox: "0 0 14 13", | ||
| xmlns: "http://www.w3.org/2000/svg" | ||
| }, /*#__PURE__*/React__default['default'].createElement("path", { | ||
| fillRule: "evenodd", | ||
| clipRule: "evenodd", | ||
| d: "M4.52208 7.71754C7.5782 7.71754 10.0557 5.24006 10.0557 2.18394C10.0557 1.93498 10.0392 1.68986 10.0074 1.44961C9.95801 1.07727 10.3495 0.771159 10.6474 0.99992C12.1153 2.12716 13.0615 3.89999 13.0615 5.89383C13.0615 9.29958 10.3006 12.0605 6.89485 12.0605C3.95334 12.0605 1.49286 10.001 0.876728 7.24527C0.794841 6.87902 1.23668 6.65289 1.55321 6.85451C2.41106 7.40095 3.4296 7.71754 4.52208 7.71754Z" | ||
| }))); | ||
| return /*#__PURE__*/React__default['default'].createElement(ReactSwitch__default['default'], Object.assign({ | ||
| className: "react-switch react-switch-github react-switch-github__".concat((reactSwitchProps === null || reactSwitchProps === void 0 ? void 0 : reactSwitchProps.checked) ? 'dark' : 'light'), | ||
| onColor: "#271052", | ||
| offColor: "#ffffff", | ||
| onHandleColor: "#6e40c9", | ||
| offHandleColor: "#2f363d", | ||
| handleDiameter: 28, | ||
| uncheckedIcon: false, | ||
| checkedIcon: false, | ||
| uncheckedHandleIcon: svg_month, | ||
| checkedHandleIcon: svg_month, | ||
| boxShadow: "0px 1px 5px rgba(0, 0, 0, 0.6)", | ||
| activeBoxShadow: "0px 0px 1px 4px rgba(0, 0, 0, 0.2)", | ||
| height: 24, | ||
| width: 42 | ||
| }, reactSwitchProps)); | ||
| } | ||
| function FluentSwitch(reactSwitchProps) { | ||
| return /*#__PURE__*/React__default['default'].createElement(ReactSwitch__default['default'], Object.assign({ | ||
| className: "react-switch react-switch-fluent react-switch-fluent__".concat((reactSwitchProps === null || reactSwitchProps === void 0 ? void 0 : reactSwitchProps.checked) ? 'dark' : 'light'), | ||
| handleDiameter: 12, | ||
| onColor: "#0078d4", | ||
| offColor: "#ffffff", | ||
| onHandleColor: "#ffffff", | ||
| offHandleColor: "#605e5c", | ||
| activeBoxShadow: "0 0 2px 3px #2c89a0", | ||
| width: 40, | ||
| height: 20, | ||
| uncheckedIcon: false, | ||
| checkedIcon: false | ||
| }, reactSwitchProps)); | ||
| } | ||
| function Darkreader(_ref) { | ||
| var _ref$defaultDarken = _ref.defaultDarken, | ||
| defaultDarken = _ref$defaultDarken === void 0 ? false : _ref$defaultDarken, | ||
| theme = _ref.theme, | ||
| fixes = _ref.fixes, | ||
| _onChange = _ref.onChange; | ||
| var _useDarkreader = useDarkreader(defaultDarken, theme, fixes), | ||
| _useDarkreader2 = _slicedToArray(_useDarkreader, 2), | ||
| isDark = _useDarkreader2[0], | ||
| toggle = _useDarkreader2[1].toggle; | ||
| return /*#__PURE__*/React__default['default'].createElement(Switch, { | ||
| checked: isDark, | ||
| onChange: function onChange(checked) { | ||
| toggle(); | ||
| _onChange === null || _onChange === void 0 ? void 0 : _onChange(checked); | ||
| } | ||
| }); | ||
| } | ||
| exports.Switch = Switch; | ||
| exports.default = Darkreader; | ||
| exports.useDarkreader = useDarkreader; |
| /// <reference types="react" /> | ||
| import { ReactSwitchProps } from 'react-switch'; | ||
| import './Switch.css'; | ||
| export interface SwitchProps extends ReactSwitchProps { | ||
| styling?: 'docusaurus' | 'material' | 'github' | 'fluent'; | ||
| } | ||
| export default function Switch(SwitchProps: SwitchProps): JSX.Element; |
| import { Theme, DynamicThemeFix } from 'darkreader'; | ||
| export declare type Action = { | ||
| toggle: () => void; | ||
| collectCSS: () => Promise<string>; | ||
| }; | ||
| export declare type Result = [boolean, Action]; | ||
| export default function useDarkreader(defaultDarken?: boolean, theme?: Partial<Theme>, fixes?: DynamicThemeFix): Result; |
New alerts
Empty package
Supply chain riskPackage does not contain any code. It may be removed, is name squatting, or the result of a faulty package publish.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Fixed alerts
Network access
Supply chain riskThis module accesses the network.
Found 1 instance in 1 package
URL strings
Supply chain riskPackage contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.
Found 1 instance in 1 package
Improved metrics
- Number of low supply chain risk alerts
0
-100%Worsened metrics
- Total package byte prevSize
8629
-72.78%- Number of package files
3
-75%- Lines of code
0
-100%- Number of medium supply chain risk alerts
3
50%No dependency changes