.gitea/workflows/publishToNpm.yaml

@@ -4,7 +4,6 @@ on:
   push:
     branches:
       - main
-      - dev
 
 jobs:
   publish:
@@ -23,24 +22,7 @@ jobs:
       - name: Install dependencies
         run: npm install
 
-      - name: Determine package name
-        id: package_name
-        run: |
-          if [ "${{ gitea.ref }}" == "refs/heads/main" ]; then
-            echo "PACKAGE_NAME=datenel-react" >> $GITEA_ENV
-            echo "ACCESS_LEVEL=public" >> $GITEA_ENV
-          elif [ "${{ gitea.ref }}" == "refs/heads/dev" ]; then
-            echo "PACKAGE_NAME=@astrian/datenel-react-dev" >> $GITEA_ENV
-            echo "ACCESS_LEVEL=restricted" >> $GITEA_ENV
-          fi
-
-      - name: Update package.json for dev releases
-        if: GITEA.ref == 'refs/heads/dev'
-        run: |
-          jq --arg name "@astrian/datenel-react-dev" '.name=$name' package.json > temp.json && mv temp.json package.json
-          jq --arg version "0.0.0-dev.$(date +%s)" '.version=$version' package.json > temp.json && mv temp.json package.json
-
       - name: Publish to npm
-        run: npm publish --access $ACCESS_LEVEL
+        run: npm publish
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

README.md

@@ -30,7 +30,8 @@ Here is an example of how to use Datenel in your React application:
 
 ```tsx
 import React from 'react'
-import { SingleDatePicker } from 'datenel-react'
+import { WeekPicker } from 'datenel-react'
+import './app.scss'
 
 export default () => {
 	function onSelect(value) {
@@ -40,7 +41,7 @@ export default () => {
 	return (
 		<div className='app'>
 			<div className="border">
-        <SingleDatePicker 
+				<WeekPicker 
 					value={{
 						year: 2025,
 						month: 1,
@@ -63,15 +64,6 @@ export default () => {
 
 More features are on the roadmap.
 
-## Contribution & Development
-
-```zsh
-npm i # or `yarn`
-npm run dev # or `yarn dev`
-```
-
-Then the package will launch a testing React hot-reload server on `localhost:1926`. The server file is available in the `playground` folder, feel free to modify the content inside it.
-
 ## License
 
 MIT

package-lock.json

@@ -23,7 +23,6 @@
         "typescript": "~5.7.2",
         "typescript-eslint": "^8.22.0",
         "vite": "^6.1.0",
-        "vite-plugin-css-injected-by-js": "^3.5.2",
         "vite-plugin-dts": "^4.5.0"
       },
       "peerDependencies": {
@@ -4524,16 +4523,6 @@
         }
       }
     },
-    "node_modules/vite-plugin-css-injected-by-js": {
-      "version": "3.5.2",
-      "resolved": "https://registry.npmjs.org/vite-plugin-css-injected-by-js/-/vite-plugin-css-injected-by-js-3.5.2.tgz",
-      "integrity": "sha512-2MpU/Y+SCZyWUB6ua3HbJCrgnF0KACAsmzOQt1UvRVJCGF6S8xdA3ZUhWcWdM9ivG4I5az8PnQmwwrkC2CAQrQ==",
-      "dev": true,
-      "license": "MIT",
-      "peerDependencies": {
-        "vite": ">2.0.0-0"
-      }
-    },
     "node_modules/vite-plugin-dts": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/vite-plugin-dts/-/vite-plugin-dts-4.5.0.tgz",

package.json

@@ -22,25 +22,21 @@
     "eslint-plugin-react-hooks": "^5.0.0",
     "eslint-plugin-react-refresh": "^0.4.18",
     "globals": "^15.14.0",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
     "sass-embedded": "^1.85.0",
     "typescript": "~5.7.2",
     "typescript-eslint": "^8.22.0",
     "vite": "^6.1.0",
-    "vite-plugin-css-injected-by-js": "^3.5.2",
+    "vite-plugin-dts": "^4.5.0",
-    "vite-plugin-dts": "^4.5.0"
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "exports": {
-    "types": "./dist/src/index.d.ts",
+    "import": "./dist/datenel.es.js",
-    "import": "./dist/index.es.js",
     "require": "./dist/index.cjs.js",
-    "default": "./dist/index.es.js"
+    "default": "./dist/datenel.es.js"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.es.js",
+  "module": "dist/datenel.es.js",
   "types": "dist/index.d.ts",
-  "files": [
+  "files": ["dist"]
-    "dist"
-  ]
 }

playground/app.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { SingleDatePicker } from "../dist/index.es"
+import { WeekPicker } from "../src/index.ts"
 import './app.scss'
 
 export default () => {
@@ -11,7 +11,7 @@ export default () => {
 	return (<div className='app'>
 
 		<div className="border">
-			<SingleDatePicker 
+			<WeekPicker 
 				value={{
 					year: 2025,
 					month: 1,

src/components/SingleDatePicker.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react'
 import { getCalendarDates, getL10Weekday, generateUniqueId, applyColor } from '../utils'
 
-export interface SingleDatePickerProps {
+interface Props {
 	/**
 	 	* Control the selected
 		* date programmatically, including situations like provide a default value or control the selected 
@@ -78,9 +78,9 @@ export interface SingleDatePickerProps {
  * 
  * @component
  * 
- * @param {SingleDatePickerProps} props
+ * @param {Props} props
  */
-const SingleDatePicker: React.FC = ({ value, onSelect, localization, onClose, mainColor = '#000000', accentColor = '#000000', reversedColor = '#ffffff', hoverColor = '#00000017', borderColor = '#e0e0e0' }: SingleDatePickerProps) => {
+export default ({ value, onSelect, localization, onClose, mainColor = '#000000', accentColor = '#000000', reversedColor = '#ffffff', hoverColor = '#00000017', borderColor = '#e0e0e0' }: Props) => {
 	const [currentMonth, setCurrentMonth] = useState(new Date().getMonth())
 	const [currentYear, setCurrentYear] = useState(new Date().getFullYear())
 	const [selectedDate, setSelectedDate] = useState(new Date())
@@ -225,5 +225,3 @@ const SingleDatePicker: React.FC = ({ value, onSelect, localization, onClose, ma
 		</div>
 	)
 }
-
-export default SingleDatePicker

src/index.ts

@@ -1,3 +1,3 @@
 import './style.scss'
 
-export {default as SingleDatePicker} from './components/SingleDatePicker'
+export {default as WeekPicker} from './components/SingleDatePicker.tsx'

tsconfig.app.json

@@ -10,10 +10,9 @@
     /* Bundler mode */
     "moduleResolution": "bundler",
     "allowImportingTsExtensions": true,
-    "emitDeclarationOnly": true,
-    "declaration": true,
     "isolatedModules": true,
     "moduleDetection": "force",
+    "noEmit": true,
     "jsx": "react-jsx",
 
     /* Linting */
@@ -21,10 +20,7 @@
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true,
+    "noUncheckedSideEffectImports": true
-
-    "composite": true,
-    "outDir": "./dist" // 指定输出目录
   },
-  "include": ["src", "tsconfig.app.json", "tsconfig.node.json"]
+  "include": ["src"]
 }

tsconfig.json

@@ -9,9 +9,6 @@
     "baseUrl": ".",
     "paths": {
       "@/*": ["src/*"]
-    },
+    }
-    "declaration": true,
+  }
-    "outDir": "./dist"
-  },
-  "include": ["src/**/*", "tsconfig.app.json", "tsconfig.node.json"]
 }

tsconfig.node.json

@@ -9,19 +9,16 @@
     /* Bundler mode */
     "moduleResolution": "bundler",
     "allowImportingTsExtensions": true,
-    "emitDeclarationOnly": true,
-    "declaration": true,
     "isolatedModules": true,
     "moduleDetection": "force",
+    "noEmit": true,
 
     /* Linting */
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true,
+    "noUncheckedSideEffectImports": true
-
-    "composite": true
   },
   "include": ["vite.config.ts"]
 }

vite.config.ts

@@ -2,39 +2,24 @@ import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 import dts from 'vite-plugin-dts'
 import path from "path"
-import cssInjectedByJsPlugin from "vite-plugin-css-injected-by-js"
 
 export default defineConfig(({mode}) => ({
   build: {
     lib: {
       entry: "src/index.ts",
       name: "datenel-react",
-      fileName: format => `index.${format}.js`,
+      fileName: format => `datenel.${format}.js`,
     },
     rollupOptions: {
-      preserveEntrySignatures: "strict",
       external: ["react"],
       output: {
         globals: {
           react: "React",
-          "react-dom": "ReactDOM",
-        },
-        assetFileNames: assetInfo => {
-          if (assetInfo.names[0].endsWith(".css")) {
-            return "index.css";
-          }
-          return `assets/${assetInfo.names[0]}`;
-        }
         },
       },
     },
-  plugins: [
+  },
-    react(),
+  plugins: [react(), dts()],
-    dts({
-      tsconfigPath: "./tsconfig.app.json"
-    }),
-    cssInjectedByJsPlugin()
-  ],
   resolve: {
     alias: {
       "@": path.resolve(__dirname, "./src"),