fafruch / react-rrule-generator Goto Github PK
View Code? Open in Web Editor NEW[NO LONGER MAINTAINED] Recurrence rules generator form built with React
Home Page: https://fafruch.github.io/react-rrule-generator/
License: MIT License
[NO LONGER MAINTAINED] Recurrence rules generator form built with React
Home Page: https://fafruch.github.io/react-rrule-generator/
License: MIT License
For example, 1st and 3rd Monday of every month.
FREQ=MONTHLY;INTERVAL=1;BYDAY=1MO,3MO
I guess I can somewhat mitigate by using every other Monday instead although that's not quite exactly the same.
Happy to create PR for this but I'll be able to get to it in a couple of week time at best.
Has anyone tried to run it using "vue-react" or something similar?
For example:
Every week , on Sunday at 4am
Hi,
This packages overrides my bootstrap (v3) with newer version. It corrupts all styles on my site. I think bootstrap shouldn't be included in this package (user should be able to choose by installing it manually).
Thanks,
Daniel
I want to use it in others languages. But I couldn't find any way to do that.
In most cases we dont want to show the generated rrule and the COPY button. We rather want to i.e. send that rule to backend.
Hello,
I cloned the code from the current master
branch of the GitHub repository because I wanted to extend the component with translatable labels for different languages. But I can't get the demo to run. I get the following error message on the demo page:
RangeError: Invalid array length
RepeatYearlyOn
src/lib/components/Repeat/Yearly/On.js:63
60 | disabled={!isActive}
61 | onChange={numericalFieldHandler(handleChange)}
62 | >
> 63 | {[...new Array(daysInMonth)].map((day, i) => (
64 | <option key={i} value={i + 1}>{i + 1}</option>
65 | ))}
66 | </select>
The daysInMonth
variable seems to be set to undefined
because the input rrule is not parsed correctly. The latest version published on npm(1.1.1) does not seem to have this bug. I haven't found any tagged version in this repository so I'm not sure which version on npm corresponds to which revision on GitHub.
Greetings
Marcel
I was amazed to find that adding rrule generator to our library added over 850kb to the build size of our application. Considering the library folder only contains 258kb of code the overall larger size was a shock.
The vast majority of which looks to be the moment locale files. Importing moment/locale/all
accounts for over 380kb (See https://github.com/moment/moment/blob/develop/min/locales.js). Moment is a popular library and is likely already included in many projects. It would make sense to give users to ability to include the localisation support they require instead of bundling them all. Perhaps moving moment to a peer dependancy would reduce the size of this library and providing documentation on how to support more locales would improve usage and reduce file size.
Try to test the value, onChange and settings using http://facebook.github.io/jest/docs/en/snapshot-testing.html
You can also try setup method pattern, see https://medium.com/selleo/testing-react-components-best-practices-2f77ac302d12
Use pattern similar to CustomInputComponent in https://github.com/jaredpalmer/formik#field-
When using this component with the Bootstrap v4.1.3 JavaScript, the day of the week selection for weekly RRules does not trigger the onChange
callback. This appear to be Bootstrap's JS interfering with the btn-group
surrounding the day of the week labels and checkboxes.
Removing the data-toggle="buttons"
from this (disabling Bootstrap's JS) seems to work around the issue.
Implement value and onChange like in https://github.com/JedWatson/react-select#usage
When you do it, you can consider i.e. moving react-copy-to-clipboard code out of lib to demo app. After all its the lib user who decides how to use the edited rrule. It can be copied colipboard but can be also stored via API.
Hi! I'm with an error when trying to import the component into my React Project.
When I import the component and try to render it into the page, it throws an error to my component:
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in. Check the render method of 'Scheduler'.
But when I try to console.log(RRuleGenerator) it sends an empty object, instead the React Component with the proptypes and the other things.
Could you help me with that? I just installed the package and imported as in the documentation.
Thanks.
After examining the code I found that component looks for config.repeat
instead of config.frequency
. Maybe it makes sense to replace frequency
with repeat
in README.md ?
I'm using RRuleGenerator as a full controlled component within a Redux Field:
const RecurrenceInput = ({ input: { value, onChange }}) => (
<div>
<RRuleGenerator value={value} onChange={onChange} />
<div>VALUE: {value}</div>
</div>
);
Using React 16.5.1, the component initially renders correctly but then never rerenders, so clicking the interface updates the displayed value but doesn't actually update the interface.
Stepping through the code, when you change something in the interface, componentWillReceiveProps gets called with the updated value and it calls setState to store the new rrule. Then shouldComponentUpdate is called with the updated value, but it ends up comparing the new value to the ALREADY UPDATED this.state.rrule, which at that point is the same, so the function returns false and then component is never re-rendered.
As a quick workaround, I'm just removing shouldComponentUpdate entirely and marking the component as a PureComponent, but not sure if that's a valid fix...
Hi,
A feature request: it would be great, if there will be an option to hide the output (raw rrules).
I want to use it, as an input in my event creation form, and I don't want to show technical details (rrules) to my users (it's enough I had possibility to capture rrules in onChange event).
Thanks,
Daniel
The prop should be called calendarComponent. Please update the docs
Hi everyone,
I've just did npm install --save react-rrule-generator
.
It generates the following package.json
dependency:
"react-rrule-generator": "^0.1.5",
Seems like this installation is corrupted by missing some files. After installation, in node_modules/react-rrule-generator/package.json
there is: "main": "build/index.js"
, but the build
folder is missing. This causes package is not working with webpack
etc.
The temporary fix is to use the following in package.json
dependencies:
"react-rrule-generator": "github:fafruch/react-rrule-generator",
Can you please look into it? I bet everyone just do npm install react-rrule-generator
which is not working well.
Thanks,
Daniel
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.