@svelte-plugins/datepicker - npm Package Compare versions

Comparing version 0.1.3 to 1.0.0

package.json

 {
   "name": "@svelte-plugins/datepicker",
-  "version": "0.1.3",
+  "description": "A simple datepicker component designed for Svelte.",
+  "version": "1.0.0",
   "license": "MIT",
-  "description": "A simple datepicker component designed for Svelte.",
   "author": "Kieran Boyle (https://github.com/dysfunc)",
-  "svelte": "./src/index.js",
-  "types": "./src/index.d.ts",
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
-  "type": "module",
-  "sideEffects": false,
+  "homepage": "https://github.com/svelte-plugins/datepicker",
   "repository": {
@@ -17,4 +12,17 @@ "type": "git",
   },
-  "homepage": "https://github.com/svelte-plugins/datepicker",
-  "bugs": "https://github.com/svelte-plugins/datepicker/issues",
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "svelte": "./dist/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "svelte": "./dist/index.js",
+      "import": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "src"
+  ],
   "keywords": [
@@ -30,22 +38,22 @@ "datepicker",
   ],
-  "files": [
-    "/src",
-    "/dist"
-  ],
   "scripts": {
-    "dev": "vite",
-    "bundle": "vite build",
+    "start": "vite & npm --prefix ./docs install && npm --prefix ./docs run dev",
+    "build": "svelte-package --input ./src && pnpm lint:package",
+    "check": "svelte-check --tsconfig ./tsconfig.json",
     "deploy": "npx gh-pages -d docs/build",
-    "lint": "eslint -c ./.eslintrc.json --fix \"src/**/*.{.js,svelte}\"",
-    "format": "prettier --write \"src/**/*.{js,json,svelte}\"",
-    "test": "vitest --run --coverage"
+    "lint": "eslint -c ./.eslintrc.json --fix \"src/**/*.{test.js,js,ts,json,svelte}\"",
+    "lint:package": "publint --strict",
+    "format": "prettier --write \"src/**/*.{test.js,js,ts,json,svelte}\"",
+    "test": "vitest --run --coverage",
+    "test:watch": "vitest",
+    "test:coverage": "vitest --run --coverage && open ./coverage/index.html"
   },
   "devDependencies": {
-    "@babel/core": "^7.23.3",
-    "@babel/eslint-parser": "^7.23.3",
-    "@babel/preset-env": "^7.23.3",
-    "@babel/runtime": "^7.23.4",
+    "@sveltejs/package": "^2.2.4",
     "@sveltejs/vite-plugin-svelte": "^3.0.1",
     "@testing-library/jest-dom": "^6.1.4",
     "@testing-library/svelte": "^4.0.5",
+    "@tsconfig/svelte": "^5.0.2",
+    "@types/node": "^20.10.5",
+    "@typescript-eslint/parser": "^6.18.1",
     "@vitest/coverage-v8": "^0.34.6",
@@ -56,19 +64,14 @@ "eslint": "^8.54.0",
     "husky": "^6.0.0",
+    "jsdom": "^23.0.0",
     "lint-staged": "^10.5.4",
     "prettier": "^3.1.0",
     "prettier-plugin-svelte": "^3.1.2",
-    "svelte": "^4.2.7",
+    "publint": "^0.2.7",
+    "svelte": "^4.2.8",
+    "svelte-check": "^3.6.2",
+    "svelte-preprocess": "^5.1.3",
     "typescript": "^5.2.2",
     "vite": "^5.0.2",
     "vitest": "^0.34.6"
-  },
-  "exports": {
-    ".": {
-      "types": "./src/index.d.ts",
-      "svelte": "./src/index.js",
-      "require": "./dist/index.js",
-      "module": "./dist/index.mjs",
-      "default": "./src/index.js"
-    }
   }
 }

README.md

@@ -10,7 +10,10 @@ # @svelte-plugins/datepicker
 ```bash
-yarn add -D @svelte-plugins/datepicker
+# npm
+> npm install svelte @svelte-plugins/datepicker
 
-# or with NPM
+# pnpm
+> pnpm install svelte @svelte-plugins/datepicker
 
-npm i -D @svelte-plugins/datepicker
+# yarn
+> yarn add svelte @svelte-plugins/datepicker
 ```
@@ -66,2 +69,4 @@
 | align	            | The edge alignment of the datepicker.                                                 | `string` (default: `left`)
+| enabledDates      | An array of date strings to enable only.                                              | `array` (default: [...])
+| disabledDates     | An array of date strings to disable.                                                  | `array` (default: [...])
 | isRange	          |	Changes the date picker into a range picker and allows start and end date selection.  | `boolean` (default: `false`)
@@ -68,0 +73,0 @@ | isMultipane	      |	If true, two calendar months will be shown side-by-side instead of one.               | `boolean` (default: `false`)

src/datepicker.d.ts

 import type { SvelteComponent } from 'svelte';
 
-export interface ComponentProps {
- /**
+export interface DatePickerProps {
+  /**
    * Represents the start date for a date picker.
    * @default null
    */
-  startDate: any;
+  startDate?: any;
 
@@ -14,3 +14,3 @@ /**
    */
-  endDate: any;
+  endDate?: any;
 
@@ -21,3 +21,3 @@ /**
    */
-  startDateTime: string;
+  startDateTime?: string;
 
@@ -28,3 +28,3 @@ /**
    */
-  endDateTime: string;
+  endDateTime?: string;
 
@@ -34,3 +34,3 @@ /**
    */
-  today: Date;
+  today?: Date;
 
@@ -40,3 +40,3 @@ /**
    */
-  defaultYear: number;
+  defaultYear?: number;
 
@@ -46,3 +46,3 @@ /**
    */
-  defaultMonth: number;
+  defaultMonth?: number;
 
@@ -52,3 +52,3 @@ /**
    */
-  startOfWeek: number;
+  startOfWeek?: number;
 
@@ -58,3 +58,3 @@ /**
    */
-  isMultipane: boolean;
+  isMultipane?: boolean;
 
@@ -64,3 +64,3 @@ /**
    */
-  isRange: boolean;
+  isRange?: boolean;
 
@@ -70,3 +70,3 @@ /**
    */
-  isOpen: boolean;
+  isOpen?: boolean;
 
@@ -76,3 +76,3 @@ /**
    */
-  align: string;
+  align?: string;
 
@@ -82,3 +82,3 @@ /**
    */
-  theme: string;
+  theme?: string;
 
@@ -88,8 +88,13 @@ /**
    */
-  disabledDates: string[];
+  disabledDates?: string[];
 
   /**
+   * An array of enabled dates.
+   */
+  enabledDates?: string[];
+
+  /**
    * Callback function to handle day click events.
    */
-  onDayClick: (event: Object) => void;
+  onDayClick?: (event: Object) => void;
 
@@ -99,3 +104,3 @@ /**
    */
-  alwaysShow: boolean;
+  alwaysShow?: boolean;
 
@@ -105,3 +110,3 @@ /**
    */
-  showYearControls: boolean;
+  showYearControls?: boolean;
 
@@ -111,3 +116,3 @@ /**
    */
-  showPresets: boolean;
+  showPresets?: boolean;
 
@@ -117,3 +122,3 @@ /**
    */
-  showTimePicker: boolean;
+  showTimePicker?: boolean;
 
@@ -123,3 +128,3 @@ /**
    */
-  enableFutureDates: boolean;
+  enableFutureDates?: boolean;
 
@@ -129,3 +134,3 @@ /**
    */
-  enablePastDates: boolean;
+  enablePastDates?: boolean;
 
@@ -135,3 +140,3 @@ /**
    */
-  presetLabels: string[];
+  presetLabels?: string[];
 
@@ -141,3 +146,3 @@ /**
    */
-  presetRanges: Object[];
+  presetRanges?: Object[];
 
@@ -147,3 +152,3 @@ /**
    */
-  dowLabels: string[];
+  dowLabels?: string[];
 
@@ -153,9 +158,13 @@ /**
    */
-  monthLabels: string[];
+  monthLabels?: string[];
 }
 
-export default class Component extends SvelteComponent<
-  ComponentProps,
-  Record<string, any>,
-  { default: {} }
-> {}
+export interface DatePickerEvents {
+  [key: string]: any;
+}
+
+export interface DatePickerSlots {
+  default: {};
+}
+
+export default class DatePicker extends SvelteComponent<DatePickerProps, DatePickerEvents, DatePickerSlots> {}

src/datepicker.snap.js

@@ -36,5 +36,5 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
               >
-                November
+                January
                  
-                2023
+                2020
               </div>
@@ -139,3 +139,3 @@
             <button
-              class="date svelte-1nmg4fl first"
+              class="date svelte-1nmg4fl today start end range first"
             >
@@ -152,3 +152,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -165,3 +165,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -178,3 +178,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -194,3 +194,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -207,3 +207,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -220,3 +220,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -233,3 +233,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -246,3 +246,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -259,3 +259,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -272,3 +272,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -288,3 +288,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -301,3 +301,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -314,3 +314,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -327,3 +327,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -340,3 +340,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -353,3 +353,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -366,3 +366,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -382,3 +382,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -395,3 +395,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -408,3 +408,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -421,3 +421,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -434,3 +434,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -447,3 +447,3 @@ <span
             <button
-              class="date svelte-1nmg4fl"
+              class="date svelte-1nmg4fl future"
             >
@@ -460,3 +460,3 @@ <span
             <button
-              class="date svelte-1nmg4fl today"
+              class="date svelte-1nmg4fl future"
             >
@@ -524,3 +524,3 @@ <span
             <button
-              class="date svelte-1nmg4fl future last"
+              class="date svelte-1nmg4fl future"
             >
@@ -536,7 +536,12 @@ <span
             
-            <div
-              class="date other svelte-1nmg4fl"
+            <button
+              class="date svelte-1nmg4fl future last"
             >
-               
-            </div>
+              <span
+                class="svelte-1nmg4fl"
+              >
+                31
+              </span>
+               
+            </button>
             
@@ -543,0 +548,0 @@

src/datepicker.test.js

@@ -18,2 +18,3 @@ import { render } from '@testing-library/svelte';
   disabledDates: [],
+  enabledDates: [],
   onDayClick: () => {},
@@ -43,2 +44,4 @@ showYearControls: true,
 
+vi.setSystemTime(today);
+
 describe('Components: DatePicker', () => {
@@ -45,0 +48,0 @@ let TestHarness;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package 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

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Number of package files

17

increased by41.67%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

451

increased by1.12%

Worsened metrics

Total package byte prevSize

190435

decreased by-29.46%

Dev dependency count

23

increased by21.05%

Lines of code

1194

decreased by-66.49%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes