@svelte-plugins/datepicker - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

dist/datepicker.d.ts

@@ -89,2 +89,8 @@ import type { SvelteComponent } from 'svelte';
   /**
+   * Callback function to handle the navigation click event for months and years
+   * @type {(event: Object) => void}
+   */
+  onNavigationChange?: (event: Object) => void;
+
+  /**
    * Indicates whether the date picker should always be shown.
@@ -145,5 +151,5 @@ */
 export interface DatePickerSlots {
-  default: {};
+  default?: {};
 }
 
 export default class DatePicker extends SvelteComponent<DatePickerProps, DatePickerEvents, DatePickerSlots> {}

dist/datepicker.test.js

@@ -52,6 +52,54 @@ import { render } from '@testing-library/svelte';
 
-  it('should render the component', () => {
+  it('should render a single datepicker', () => {
     const { container } = TestHarness(config);
     expect(container).toMatchSnapshot();
   });
+
+  it('should render a range picker', () => {
+    const { container } = TestHarness({ ...config, isRange: true, isMultipane: true });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a date picker with time selection', () => {
+    const { container } = TestHarness({ ...config, showTimePicker: true });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a range picker with presets', () => {
+    const { container } = TestHarness({ ...config, isRange: true, showPresets: true });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a date picker without year controls', () => {
+    const { container } = TestHarness({ ...config, showYearControls: false });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a date picker with Monday as start of week', () => {
+    const { container } = TestHarness({ ...config, startOfWeek: 1 });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a date picker with my custom locale', () => {
+    const { container } = TestHarness({
+      ...config,
+      dowLabels: ['Au', 'Bo', 'Cu', 'De', 'Eh', 'Fr', 'Ga'],
+      monthLabels: [
+        'Qanuary',
+        'Webruary',
+        'Earch',
+        'Rpril',
+        'Tay',
+        'Yune',
+        'Uuly',
+        'Iugust',
+        'Oeptember',
+        'Pctober',
+        'Aovember',
+        'Secember'
+      ]
+    });
+
+    expect(container).toMatchSnapshot();
+  });
 });

package.json

 {
   "name": "@svelte-plugins/datepicker",
   "description": "A simple datepicker component designed for Svelte.",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "license": "MIT",
@@ -29,6 +29,11 @@ "author": "Kieran Boyle (https://github.com/dysfunc)",
     "datepicker",
-    "rangepicker",
+    "timepicker",
     "daterange",
-    "timepicker",
+    "date picker",
+    "time picker",
+    "range picker",
+    "date range",
     "calendar",
+    "date-time",
+    "picker",
     "svelte",
@@ -42,3 +47,3 @@ "components",
     "build:docs": "npm --prefix ./docs run build",
-    "deploy": "pnpm build:docs && npx gh-pages -d docs/build",
+    "deploy:docs": "pnpm build:docs && npx gh-pages -d docs/build",
     "check": "svelte-check --tsconfig ./tsconfig.json",
@@ -45,0 +50,0 @@ "lint": "eslint -c ./.eslintrc.json --fix \"src/**/*.{test.js,js,ts,json,svelte}\"",

README.md

@@ -81,2 +81,8 @@ # @svelte-plugins/datepicker
 
+### Events
+| Prop               | Description                                                                           | Default                     |
+| :----------------- | :------------------------------------------------------------------------------------ | :-------------------------- |
+| onDayClick	       | Callback function to handle day click events.	                                       | `function`
+| onNavigationChange | Callback function to handle the navigation click event for months and years           | `function`
+
 ## Theming
@@ -83,0 +89,0 @@ You can customize DatePicker theme using several methods:

src/datepicker.d.ts

@@ -89,2 +89,8 @@ import type { SvelteComponent } from 'svelte';
   /**
+   * Callback function to handle the navigation click event for months and years
+   * @type {(event: Object) => void}
+   */
+  onNavigationChange?: (event: Object) => void;
+
+  /**
    * Indicates whether the date picker should always be shown.
@@ -91,0 +97,0 @@ */

src/datepicker.test.js

@@ -52,6 +52,54 @@ import { render } from '@testing-library/svelte';
 
-  it('should render the component', () => {
+  it('should render a single datepicker', () => {
     const { container } = TestHarness(config);
     expect(container).toMatchSnapshot();
   });
+
+  it('should render a range picker', () => {
+    const { container } = TestHarness({ ...config, isRange: true, isMultipane: true });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a date picker with time selection', () => {
+    const { container } = TestHarness({ ...config, showTimePicker: true });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a range picker with presets', () => {
+    const { container } = TestHarness({ ...config, isRange: true, showPresets: true });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a date picker without year controls', () => {
+    const { container } = TestHarness({ ...config, showYearControls: false });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a date picker with Monday as start of week', () => {
+    const { container } = TestHarness({ ...config, startOfWeek: 1 });
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should render a date picker with my custom locale', () => {
+    const { container } = TestHarness({
+      ...config,
+      dowLabels: ['Au', 'Bo', 'Cu', 'De', 'Eh', 'Fr', 'Ga'],
+      monthLabels: [
+        'Qanuary',
+        'Webruary',
+        'Earch',
+        'Rpril',
+        'Tay',
+        'Yune',
+        'Uuly',
+        'Iugust',
+        'Oeptember',
+        'Pctober',
+        'Aovember',
+        'Secember'
+      ]
+    });
+
+    expect(container).toMatchSnapshot();
+  });
 });

New alerts

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

Improved metrics

Total package byte prevSize

361890

89.96%

Lines of code

6994

485.76%

Number of lines in readme file

457

1.33%

Worsened metrics

Number of medium supply chain risk alerts

1

Infinity%

No dependency changes