stimulus-flatpickr - npm Package Compare versions

Comparing version 1.2.0-3 to 1.2.0

.eslintrc.js

@@ -13,2 +13,3 @@ module.exports = {
   },
+  parser: 'babel-eslint',
   parserOptions: {
@@ -15,0 +16,0 @@ ecmaVersion: 2018,

package.json

 {
   "name": "stimulus-flatpickr",
-  "version": "1.2.0-3",
+  "version": "1.2.0",
   "description": "A Stimulus Wrapper for Flatpickr library",
@@ -18,2 +18,3 @@ "keywords": [
   "scripts": {
+    "start:playground": "webpack-dev-server --mode development --open --config playground/webpack.config.js --hot",
     "build": "rollup -c && yarn test",
@@ -29,3 +30,3 @@ "dev": "rollup -wc",
     "flatpickr": ">=4.6.0",
-    "stimulus": "^1.1.1"
+    "stimulus": ">=1.1.1"
   },
@@ -39,2 +40,3 @@ "devDependencies": {
     "@babel/preset-env": "^7.6.0",
+    "babel-eslint": "^10.0.3",
     "babel-loader": "^8.0.5",
@@ -65,3 +67,3 @@ "babel-plugin-istanbul": "^5.1.1",
     "mocha": "^5.2.0",
-    "np": "^5.0.3",
+    "np": "^5.1.3",
     "npm-run-all": "^4.1.3",
@@ -72,3 +74,2 @@ "rollup": "^1.20.3",
     "rollup-plugin-node-resolve": "^5.2.0",
-    "rollup-plugin-uglify": "^6.0.2",
     "sinon": "^6.1.4",
@@ -75,0 +76,0 @@ "sinon-chai": "^3.2.0",

readme.md

@@ -37,5 +37,5 @@ <h1 align="center">📆 Stimulus-Flatpickr Wrapper</h1>
 
-```html+erb
-<%= form_with model: Appointement.new, authenticity_token: true do |f| %>
-  <%= f.text_field :start_time,
+```erb
+<%= form_with model: Appointement.new, authenticity_token: true do |f| %>	<%= form_with model: Appointement.new, authenticity_token: true do |f| %> <%= f.text_field :start_time, data: {
+  <%= f.text_field :start_time,	controller: "flatpickr", flatpickr_min_date: Time.zone.now #disables past dates } %> <% end %>
     data: {
@@ -92,13 +92,13 @@ controller: "flatpickr",
 // ./packs/application.js
-import { Application } from "stimulus";
+import { Application } from 'stimulus'
 // import Flatpickr
-import Flatpickr from "stimulus-flatpickr";
+import Flatpickr from 'stimulus-flatpickr'
 
-import { definitionsFromContext } from "stimulus/webpack-helpers";
-const application = Application.start();
-const context = require.context("../controllers", true, /\.js$/);
-application.load(definitionsFromContext(context));
+import { definitionsFromContext } from 'stimulus/webpack-helpers'
+const application = Application.start()
+const context = require.context('../controllers', true, /\.js$/)
+application.load(definitionsFromContext(context))
 
 // Manually register Flatpickr as a stimulus controller
-application.register("flatpickr", Flatpickr);
+application.register('flatpickr', Flatpickr)
 ```
@@ -110,5 +110,5 @@
 
-```html+erb
-<%= form_with model: Appointement.new, authenticity_token: true do |f| %>
-  <%= f.text_field :start_time,
+```erb
+<%= form_with model: Appointement.new, authenticity_token: true do |f| %>	<%= form_with model: Appointement.new, authenticity_token: true do |f| %> <%= f.text_field :start_time, data: {
+  <%= f.text_field :start_time,	controller: "flatpickr", flatpickr_date_format: "Y-m-d", flatpickr_min_date: Time.zone.now } %> <% end %>
     data: {
@@ -147,3 +147,3 @@ controller: "flatpickr",
 ```html
-<input data-controller="flatpickr" data-flatpickr-enable-time="true" type="text" name="appointement[start_time]" >
+<input data-controller="flatpickr" data-flatpickr-enable-time="true" type="text" name="appointement[start_time]" />
 ```
@@ -172,9 +172,9 @@
 // import stimulus-flatpickr wrapper controller to extend it
-import Flatpickr from "stimulus-flatpickr";
+import Flatpickr from 'stimulus-flatpickr'
 
 // you can also import a translation file
-import { French } from "flatpickr/dist/l10n/fr.js";
+import { French } from 'flatpickr/dist/l10n/fr.js'
 
 // import a theme (could be in your main CSS entry too...)
-import "flatpickr/dist/themes/dark.css";
+import 'flatpickr/dist/themes/dark.css'
 
@@ -187,3 +187,3 @@ // create a new Stimulus controller by extending stimulus-flatpickr wrapper controller
       locale: French
-    };
+    }
   }
@@ -193,5 +193,5 @@
   change(selectedDates, dateStr, instance) {
-    console.log("the callback returns the selected dates", selectedDates);
-    console.log("but returns it also as a string", dateStr);
-    console.log("and the flatpickr instance", instance);
+    console.log('the callback returns the selected dates', selectedDates)
+    console.log('but returns it also as a string', dateStr)
+    console.log('and the flatpickr instance', instance)
   }
@@ -237,11 +237,11 @@ }
 
-```html+erb
+```erb
 <%= form_with model: Appointement.new, authenticity_token: true do |f| %>
   <%= f.text_field :start_time,
-    data: {
-      controller: "flatpickr",
-      flatpickr_date_format: "Y-m-d",
-      flatpickr_min_date: Time.zone.now
-    } %>
-<% end %>
+                    data: {
+                      controller: "flatpickr",
+                      flatpickr_date_format: "Y-m-d",
+                      flatpickr_min_date: Time.zone.now }
+  %>
+  <% end %>
 ```
@@ -340,2 +340,14 @@
 
+### Custom elements
+
+If you need to wrap the Flatpickr controller arround custom elements you can use the predefined target `instance` to specify the input element to attach the date picker to.
+
+Example:
+
+```html
+<div data-controller="flatpickr">
+  <input type="text" placeholder="Select Date.." data-target="flatpickr.instance" />
+</div>
+```
+
 ### Getters
@@ -416,4 +428,6 @@
 
-You can test locally also the results with the playground project [./playground](./playground/readme.md)
+You can test locally also the results with the playground project [./playground](./playground)
 
+`$ yarn start:playground`
+
 **Then :**
@@ -420,0 +434,0 @@

Fixed alerts

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

Total package byte prevSize

334713

increased by0.29%

Lines of code

2356

increased by0.04%

Number of low quality alerts

1

decreased by-50%

Number of lines in readme file

434

increased by3.33%

Dependency changes

• + Added@hotwired/stimulus@3.2.2(transitive)

• + Added@hotwired/stimulus-webpack-helpers@1.0.1(transitive)

• + Addedstimulus@3.2.2(transitive)

• - Removed@stimulus/core@1.1.1(transitive)

• - Removed@stimulus/multimap@1.1.1(transitive)

• - Removed@stimulus/mutation-observers@1.1.1(transitive)

• - Removed@stimulus/webpack-helpers@1.1.1(transitive)

• - Removedstimulus@1.1.1(transitive)

• Updatedstimulus@>=1.1.1