working - v0.27

tradeloop-ai · Apr 22, 2024 · 0769adf · 0769adf
1 parent 2c4f6e7
commit 0769adf
Show file tree

Hide file tree

Showing 11 changed files with 51 additions and 25 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,4 @@
-node_modules
-dist
 .idea
+dist
+node_modules
+bun.lockb
diff --git a/.npmignore b/.npmignore
@@ -0,0 +1,7 @@
+.idea
+dist
+node_modules
+src
+.gitignore
+bun.lockb
+tsconfig.json
diff --git a/package.json b/package.json
@@ -1,12 +1,12 @@
 {
   "name": "next-infinite-themes",
-  "version": "0.0.1",
-  "description": "",
+  "version": "0.0.27",
+  "description": "Simple theme switcher for Next.js that supports the basic light/dark/system mode along with an infinite number of color themes for each.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
   "scripts": {
-    "build": "tsup index.ts --format cjs,esm --dts",
+    "build": "tsup",
     "lint": "tsc"
   },
   "repository": {
@@ -19,13 +19,29 @@
     "url": "https://github.com/tradeloop-ai/next-infinite-themes/issues"
   },
   "homepage": "https://github.com/tradeloop-ai/next-infinite-themes#readme",
+  "tsup": {
+    "entry": ["src/index.tsx"],
+    "sourcemap": false,
+    "minify": true,
+    "dts": true,
+    "clean": true,
+    "external": ["react"],
+    "format": ["esm", "cjs"],
+    "splitting": false,
+    "bundle": true
+  },
   "devDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "@types/react": "^18.2.79",
     "tsup": "^8.0.2",
     "typescript": "^5.4.5"
   },
+  "peerDependencies": {
+    "react": "^16.8 || ^17 || ^18",
+    "react-dom": "^16.8 || ^17 || ^18"
+  },
   "dependencies": {
-    "react": "^18.2.0",
     "zustand": "^4.5.2"
   }
 }
diff --git a/create-theme-store.ts → src/create-theme-store.ts b/create-theme-store.ts → src/create-theme-store.ts
@@ -6,11 +6,11 @@ import {
   ThemeStoreProps,
 } from "./types";
 import { getSystemTheme, setDocumentTheme } from "./utils";
-import { createContext } from "react";
+import * as React from "react";
 import { createStore } from "zustand";
 import { persist } from "zustand/middleware";
 
-export const ThemeContext = createContext<ReturnType<
+export const ThemeContext = React.createContext<ReturnType<
   typeof createThemeStore
 > | null>(null);
 

diff --git a/index.ts → src/index.tsx b/index.ts → src/index.tsx
@@ -1,2 +1,4 @@
+"use client";
+
 export { ThemeProvider } from "./theme-provider";
 export { useThemeStore } from "./use-theme-store";
diff --git a/theme-provider.tsx → src/theme-provider.tsx b/theme-provider.tsx → src/theme-provider.tsx
@@ -1,18 +1,18 @@
 "use client";
 
+import * as React from "react";
 import { createThemeStore, ThemeContext } from "./create-theme-store";
 import { ThemeScript } from "./theme-script";
 import { ThemeProviderDefaults, ThemeProviderProps } from "./types";
-import { ReactNode, useEffect, useRef } from "react";
 import { useStore } from "zustand";
 
 export function ThemeProvider({
   children,
   ...props
-}: { children?: ReactNode } & Partial<ThemeProviderProps>) {
+}: { children?: React.ReactNode } & Partial<ThemeProviderProps>) {
   const settings: ThemeProviderProps = { ...ThemeProviderDefaults, ...props };
 
-  const store = useRef(createThemeStore(settings)).current;
+  const store = React.useRef(createThemeStore(settings)).current;
 
   const [system, mode, setMode] = useStore(store, (s) => [
     s.system,
@@ -21,7 +21,7 @@ export function ThemeProvider({
   ]);
 
   // system theme listener
-  useEffect(() => {
+  React.useEffect(() => {
     function handleSystemChange(event: MediaQueryListEvent | MediaQueryList) {
       // !system or !mode or system and ui in same mode
       if (

diff --git a/theme-script.tsx → src/theme-script.tsx b/theme-script.tsx → src/theme-script.tsx
@@ -1,9 +1,9 @@
 "use client";
 
 import { LocalThemeStore, ThemeProviderProps, ThemeStoreProps } from "./types";
-import { memo } from "react";
+import * as React from "react";
 
-export const ThemeScript = memo((settings: ThemeProviderProps) => {
+export const ThemeScript = React.memo((settings: ThemeProviderProps) => {
   return (
     <script
       suppressHydrationWarning

diff --git a/types.ts → src/types.ts b/types.ts → src/types.ts
diff --git a/use-theme-store.ts → src/use-theme-store.ts b/use-theme-store.ts → src/use-theme-store.ts
@@ -2,7 +2,7 @@
 
 import { ThemeContext } from "./create-theme-store";
 import { ThemeStoreProps } from "./types";
-import { useContext } from "react";
+import * as React from "react";
 import { useStore } from "zustand";
 
 /**
@@ -27,7 +27,7 @@ import { useStore } from "zustand";
  * @throws {Error} Throws if `ThemeProvider` is not found in the component tree.
  */
 export function useThemeStore<T>(selector: (state: ThemeStoreProps) => T): T {
-  const store = useContext(ThemeContext);
+  const store = React.useContext(ThemeContext);
   if (!store) throw new Error("Missing ThemeProvider in the tree");
   return useStore(store, selector);
 }
diff --git a/utils.ts → src/utils.ts b/utils.ts → src/utils.ts
diff --git a/tsconfig.json b/tsconfig.json
@@ -11,9 +11,9 @@
     // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
 
     /* Language and Environment */
-    "target": "es2016" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
+    "target": "es2016",                                  /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
     // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
-    "jsx": "preserve" /* Specify what JSX code is generated. */,
+    "jsx": "preserve",                                /* Specify what JSX code is generated. */
     // "experimentalDecorators": true,                   /* Enable experimental support for legacy experimental decorators. */
     // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
     // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
@@ -25,7 +25,7 @@
     // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
 
     /* Modules */
-    "module": "commonjs" /* Specify what module code is generated. */,
+    "module": "commonjs",                                /* Specify what module code is generated. */
     // "rootDir": "./",                                  /* Specify the root folder within your source files. */
     // "moduleResolution": "node10",                     /* Specify how TypeScript looks up a file from a given module specifier. */
     // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
@@ -57,7 +57,7 @@
     // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
     // "outDir": "./",                                   /* Specify an output folder for all emitted files. */
     // "removeComments": true,                           /* Disable emitting comments. */
-    "noEmit": true /* Disable emitting files from a compilation. */,
+    // "noEmit": true,                                   /* Disable emitting files from a compilation. */
     // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
     // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types. */
     // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
@@ -77,12 +77,12 @@
     // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
     // "verbatimModuleSyntax": true,                     /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
     // "allowSyntheticDefaultImports": true,             /* Allow 'import x from y' when a module doesn't have a default export. */
-    "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
+    "esModuleInterop": true,                             /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
     // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
-    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
+    "forceConsistentCasingInFileNames": true,            /* Ensure that casing is correct in imports. */
 
     /* Type Checking */
-    "strict": true /* Enable all strict type-checking options. */,
+    "strict": true,                                      /* Enable all strict type-checking options. */
     // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied 'any' type. */
     // "strictNullChecks": true,                         /* When type checking, take into account 'null' and 'undefined'. */
     // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
@@ -96,14 +96,14 @@
     // "exactOptionalPropertyTypes": true,               /* Interpret optional property types as written, rather than adding 'undefined'. */
     // "noImplicitReturns": true,                        /* Enable error reporting for codepaths that do not explicitly return in a function. */
     // "noFallthroughCasesInSwitch": true,               /* Enable error reporting for fallthrough cases in switch statements. */
-    "noUncheckedIndexedAccess": true /* Add 'undefined' to a type when accessed using an index. */,
+    // "noUncheckedIndexedAccess": true,                 /* Add 'undefined' to a type when accessed using an index. */
     // "noImplicitOverride": true,                       /* Ensure overriding members in derived classes are marked with an override modifier. */
     // "noPropertyAccessFromIndexSignature": true,       /* Enforces using indexed accessors for keys declared using an indexed type. */
     // "allowUnusedLabels": true,                        /* Disable error reporting for unused labels. */
     // "allowUnreachableCode": true,                     /* Disable error reporting for unreachable code. */
 
     /* Completeness */
     // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
-    "skipLibCheck": true /* Skip type checking all .d.ts files. */
+    "skipLibCheck": true                                 /* Skip type checking all .d.ts files. */
   }
 }