Component: Date picker

This commit is contained in:
navaneeth 2021-04-12 19:36:54 +05:30
parent a1ed49b736
commit 3700e142c4
6 changed files with 255 additions and 2 deletions

View file

@ -3,5 +3,5 @@ class App < ApplicationRecord
has_many :data_queries
has_many :app_users
has_many :app_versions
belongs_to :current_version, class_name: 'AppVersion'
belongs_to :current_version, class_name: 'AppVersion', optional: true
end

View file

@ -2661,6 +2661,22 @@
"indent-string": "^4.0.0"
}
},
"airbnb-prop-types": {
"version": "2.16.0",
"resolved": "https://registry.npmjs.org/airbnb-prop-types/-/airbnb-prop-types-2.16.0.tgz",
"integrity": "sha512-7WHOFolP/6cS96PhKNrslCLMYAI8yB1Pp6u6XmxozQOiZbsI5ycglZr5cHhBFfuRcQQjzCMith5ZPZdYiJCxUg==",
"requires": {
"array.prototype.find": "^2.1.1",
"function.prototype.name": "^1.1.2",
"is-regex": "^1.1.0",
"object-is": "^1.1.2",
"object.assign": "^4.1.0",
"object.entries": "^1.1.2",
"prop-types": "^15.7.2",
"prop-types-exact": "^1.2.0",
"react-is": "^16.13.1"
}
},
"ajv": {
"version": "6.12.6",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
@ -2840,6 +2856,15 @@
"resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
"integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
},
"array.prototype.find": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/array.prototype.find/-/array.prototype.find-2.1.1.tgz",
"integrity": "sha512-mi+MYNJYLTx2eNYy+Yh6raoQacCsNeeMUaspFPh9Y141lFSsWxxB8V9mM2ye+eqiRs917J6/pJ4M9ZPzenWckA==",
"requires": {
"define-properties": "^1.1.3",
"es-abstract": "^1.17.4"
}
},
"array.prototype.flat": {
"version": "1.2.4",
"resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.2.4.tgz",
@ -3659,6 +3684,11 @@
}
}
},
"brcast": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/brcast/-/brcast-2.0.2.tgz",
"integrity": "sha512-Tfn5JSE7hrUlFcOoaLzVvkbgIemIorMIyoMr3TgvszWW7jFt2C9PdeMLtysYD9RU0MmU17b69+XJG1eRY2OBRg=="
},
"brorand": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
@ -4388,6 +4418,11 @@
"resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
"integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
},
"consolidated-events": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/consolidated-events/-/consolidated-events-2.0.2.tgz",
"integrity": "sha512-2/uRVMdRypf5z/TW/ncD/66l75P5hH2vM/GR8Jf8HLc2xnfJtmina6F6du8+v4Z2vTrMo7jC+W1tmEEuuELgkQ=="
},
"constants-browserify": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
@ -4933,6 +4968,11 @@
"resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
"integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
},
"deepmerge": {
"version": "1.5.2",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.2.tgz",
"integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ=="
},
"default-gateway": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-4.2.0.tgz",
@ -5152,6 +5192,11 @@
}
}
},
"direction": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/direction/-/direction-1.0.4.tgz",
"integrity": "sha512-GYqKi1aH7PJXxdhTeZBFrg8vUBeKXi+cNprXsC1kpJcbcVnV9wBsrOu1cQEdG0WeQwlfHiy3XvnKfIrJ2R0NzQ=="
},
"dnd-core": {
"version": "14.0.0",
"resolved": "https://registry.npmjs.org/dnd-core/-/dnd-core-14.0.0.tgz",
@ -5192,6 +5237,14 @@
"esutils": "^2.0.2"
}
},
"document.contains": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/document.contains/-/document.contains-1.0.2.tgz",
"integrity": "sha512-YcvYFs15mX8m3AO1QNQy3BlIpSMfNRj3Ujk2BEJxsZG+HZf7/hZ6jr7mDpXrF8q+ff95Vef5yjhiZxm8CGJr6Q==",
"requires": {
"define-properties": "^1.1.3"
}
},
"dom-accessibility-api": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.3.0.tgz",
@ -5409,6 +5462,15 @@
"resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
"integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A=="
},
"enzyme-shallow-equal": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/enzyme-shallow-equal/-/enzyme-shallow-equal-1.0.4.tgz",
"integrity": "sha512-MttIwB8kKxypwHvRynuC3ahyNc+cFbR8mjVIltnmzQ0uKGqmsfO4bfBuLxb0beLNPhjblUEYvEbsg+VSygvF1Q==",
"requires": {
"has": "^1.0.3",
"object-is": "^1.1.2"
}
},
"errno": {
"version": "0.1.8",
"resolved": "https://registry.npmjs.org/errno/-/errno-0.1.8.tgz",
@ -6771,11 +6833,27 @@
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
"integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
},
"function.prototype.name": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.4.tgz",
"integrity": "sha512-iqy1pIotY/RmhdFZygSSlW0wko2yxkSCKqsuv4pr8QESohpYyG/Z7B/XXvPRKTJS//960rgguE5mSRUsDdaJrQ==",
"requires": {
"call-bind": "^1.0.2",
"define-properties": "^1.1.3",
"es-abstract": "^1.18.0-next.2",
"functions-have-names": "^1.2.2"
}
},
"functional-red-black-tree": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz",
"integrity": "sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc="
},
"functions-have-names": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.2.tgz",
"integrity": "sha512-bLgc3asbWdwPbx2mNk2S49kmJCuQeu0nfmaOgbs8WIyzzkw3r4htszdIi9Q9EMezDPTYuJx2wvjZ/EwgAthpnA=="
},
"fuse.js": {
"version": "3.6.1",
"resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-3.6.1.tgz",
@ -6882,6 +6960,15 @@
"resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.3.0.tgz",
"integrity": "sha1-jFoUlNIGbFcMw7/kSWF1rMTVAqs="
},
"global-cache": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/global-cache/-/global-cache-1.2.1.tgz",
"integrity": "sha512-EOeUaup5DgWKlCMhA9YFqNRIlZwoxt731jCh47WBV9fQqHgXhr3Fa55hfgIUqilIcPsfdNKN7LHjrNY+Km40KA==",
"requires": {
"define-properties": "^1.1.2",
"is-symbol": "^1.0.1"
}
},
"global-modules": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz",
@ -7983,6 +8070,11 @@
"has-symbols": "^1.0.1"
}
},
"is-touch-device": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-touch-device/-/is-touch-device-1.0.1.tgz",
"integrity": "sha512-LAYzo9kMT1b2p19L/1ATGt2XcSilnzNlyvq6c0pbPRVisLbAPpLqr53tIJS00kvrTkj0HtR8U7+u8X0yR8lPSw=="
},
"is-typedarray": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
@ -9431,6 +9523,11 @@
"minimist": "^1.2.5"
}
},
"moment": {
"version": "2.29.1",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz",
"integrity": "sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ=="
},
"move-concurrently": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz",
@ -11401,6 +11498,16 @@
"react-is": "^16.8.1"
}
},
"prop-types-exact": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/prop-types-exact/-/prop-types-exact-1.2.0.tgz",
"integrity": "sha512-K+Tk3Kd9V0odiXFP9fwDHUYRyvK3Nun3GVyPapSIs5OBkITAm15W0CPFD/YKTkMUAbc0b9CUwRQp2ybiBIq+eA==",
"requires": {
"has": "^1.0.3",
"object.assign": "^4.1.0",
"reflect.ownkeys": "^0.2.0"
}
},
"prop-types-extra": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/prop-types-extra/-/prop-types-extra-1.1.1.tgz",
@ -11673,6 +11780,28 @@
"prop-types": "^15.5.8"
}
},
"react-dates": {
"version": "21.8.0",
"resolved": "https://registry.npmjs.org/react-dates/-/react-dates-21.8.0.tgz",
"integrity": "sha512-PPriGqi30CtzZmoHiGdhlA++YPYPYGCZrhydYmXXQ6RAvAsaONcPtYgXRTLozIOrsQ5mSo40+DiA5eOFHnZ6xw==",
"requires": {
"airbnb-prop-types": "^2.15.0",
"consolidated-events": "^1.1.1 || ^2.0.0",
"enzyme-shallow-equal": "^1.0.0",
"is-touch-device": "^1.0.1",
"lodash": "^4.1.1",
"object.assign": "^4.1.0",
"object.values": "^1.1.0",
"prop-types": "^15.7.2",
"raf": "^3.4.1",
"react-moment-proptypes": "^1.6.0",
"react-outside-click-handler": "^1.2.4",
"react-portal": "^4.2.0",
"react-with-direction": "^1.3.1",
"react-with-styles": "^4.1.0",
"react-with-styles-interface-css": "^6.0.0"
}
},
"react-dev-utils": {
"version": "10.2.1",
"resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-10.2.1.tgz",
@ -11982,6 +12111,26 @@
"@emotion/core": "^10.0.22"
}
},
"react-moment-proptypes": {
"version": "1.8.1",
"resolved": "https://registry.npmjs.org/react-moment-proptypes/-/react-moment-proptypes-1.8.1.tgz",
"integrity": "sha512-Er940DxWoObfIqPrZNfwXKugjxMIuk1LAuEzn23gytzV6hKS/sw108wibi9QubfMN4h+nrlje8eUCSbQRJo2fQ==",
"requires": {
"moment": ">=1.6.0"
}
},
"react-outside-click-handler": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/react-outside-click-handler/-/react-outside-click-handler-1.3.0.tgz",
"integrity": "sha512-Te/7zFU0oHpAnctl//pP3hEAeobfeHMyygHB8MnjP6sX5OR8KHT1G3jmLsV3U9RnIYo+Yn+peJYWu+D5tUS8qQ==",
"requires": {
"airbnb-prop-types": "^2.15.0",
"consolidated-events": "^1.1.1 || ^2.0.0",
"document.contains": "^1.0.1",
"object.values": "^1.1.0",
"prop-types": "^15.7.2"
}
},
"react-overlays": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-5.0.0.tgz",
@ -11997,6 +12146,14 @@
"warning": "^4.0.3"
}
},
"react-portal": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/react-portal/-/react-portal-4.2.1.tgz",
"integrity": "sha512-fE9kOBagwmTXZ3YGRYb4gcMy+kSA+yLO0xnPankjRlfBv4uCpFXqKPfkpsGQQR15wkZ9EssnvTOl1yMzbkxhPQ==",
"requires": {
"prop-types": "^15.5.8"
}
},
"react-resizable": {
"version": "1.11.1",
"resolved": "https://registry.npmjs.org/react-resizable/-/react-resizable-1.11.1.tgz",
@ -12181,6 +12338,42 @@
"prop-types": "^15.6.2"
}
},
"react-with-direction": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/react-with-direction/-/react-with-direction-1.3.1.tgz",
"integrity": "sha512-aGcM21ZzhqeXFvDCfPj0rVNYuaVXfTz5D3Rbn0QMz/unZe+CCiLHthrjQWO7s6qdfXORgYFtmS7OVsRgSk5LXQ==",
"requires": {
"airbnb-prop-types": "^2.10.0",
"brcast": "^2.0.2",
"deepmerge": "^1.5.2",
"direction": "^1.0.2",
"hoist-non-react-statics": "^3.3.0",
"object.assign": "^4.1.0",
"object.values": "^1.0.4",
"prop-types": "^15.6.2"
}
},
"react-with-styles": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/react-with-styles/-/react-with-styles-4.2.0.tgz",
"integrity": "sha512-tZCTY27KriRNhwHIbg1NkSdTTOSfXDg6Z7s+Q37mtz0Ym7Sc7IOr3PzVt4qJhJMW6Nkvfi3g34FuhtiGAJCBQA==",
"requires": {
"airbnb-prop-types": "^2.14.0",
"hoist-non-react-statics": "^3.2.1",
"object.assign": "^4.1.0",
"prop-types": "^15.7.2",
"react-with-direction": "^1.3.1"
}
},
"react-with-styles-interface-css": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/react-with-styles-interface-css/-/react-with-styles-interface-css-6.0.0.tgz",
"integrity": "sha512-6khSG1Trf4L/uXOge/ZAlBnq2O2PEXlQEqAhCRbvzaQU4sksIkdwpCPEl6d+DtP3+IdhyffTWuHDO9lhe1iYvA==",
"requires": {
"array.prototype.flat": "^1.2.1",
"global-cache": "^1.2.1"
}
},
"reactcss": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/reactcss/-/reactcss-1.2.3.tgz",
@ -12264,6 +12457,11 @@
"symbol-observable": "^1.2.0"
}
},
"reflect.ownkeys": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz",
"integrity": "sha1-dJrO7H8/34tj+SegSAnpDFwLNGA="
},
"regenerate": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",

View file

@ -14,6 +14,7 @@
"dompurify": "^2.2.7",
"history": "^4.9.0",
"immutability-helper": "^3.1.1",
"moment": "^2.29.1",
"node-sass": "^4.14.1",
"query-string": "^6.13.6",
"re-resizable": "^6.9.0",
@ -21,6 +22,7 @@
"react-bootstrap": "^1.5.2",
"react-color": "^2.19.3",
"react-copy-to-clipboard": "^5.0.3",
"react-dates": "^21.8.0",
"react-dnd": "^14.0.2",
"react-dnd-html5-backend": "^14.0.0",
"react-dom": "^16.13.1",

View file

@ -9,6 +9,7 @@ import { Container } from './Components/Container';
import { RichTextEditor } from './Components/RichTextEditor';
import { DropDown } from './Components/DropDown';
import { Checkbox } from './Components/Checkbox';
import { Datepicker } from './Components/Datepicker';
const AllComponents = {
Button,
@ -20,7 +21,8 @@ const AllComponents = {
Container,
RichTextEditor,
DropDown,
Checkbox
Checkbox,
Datepicker
}
let styles = {

View file

@ -0,0 +1,19 @@
import React from 'react';
import Datetime from 'react-datetime';
import "react-datetime/css/react-datetime.css";
export const Datepicker = function Datepicker({ id, width, height, component, onComponentClick, currentState, onComponentOptionChanged }) {
console.log('currentState', currentState);
function onDateChange(event) {
onComponentOptionChanged(component, 'value', event.format())
}
return (
<Datetime
onChange={onDateChange}
/>
);
};

View file

@ -153,6 +153,38 @@ export const componentTypes = [
}
}
},
{
icon: 'https://www.svgrepo.com/show/14690/calendar.svg',
name: 'Datepicker',
description: 'Select a date and time',
component: 'Datepicker',
defaultSize: {
width: 100,
height: 60
},
properties: {
},
events: [
],
styles: {
},
exposedVariables: {},
definition: {
properties: {
},
events: {
},
styles: {
}
}
},
{
icon: 'https://www.svgrepo.com/show/309414/checkbox-checked.svg',
name: 'Checkbox',