Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Zefyr 1.0 development updates #409

Open
pulyaevskiy opened this issue Sep 29, 2020 · 136 comments
Open

Zefyr 1.0 development updates #409

pulyaevskiy opened this issue Sep 29, 2020 · 136 comments

Comments

@pulyaevskiy
Copy link
Contributor

pulyaevskiy commented Sep 29, 2020

Hi everyone,

I wanted to post this as an announcement that there is currently work in progress on the new version of Zefyr which will be eventually released as a stable 1.0 version.

There is a lot of changes in this version, it's practically an almost complete rewrite of the package, but it comes with quite a few benefits.

You can head over to https://memspace.github.io/zefyr/#/ and see the editor for yourself in its current state.

image

Note that this is a very early dev version so it's buggy. In addition, Flutter's Web support is still not on par with the rest of the platforms and there are some pretty basic limitations in the engine itself. So don't get surprised if formatting text with bold breaks the entire thing (it does).

The main reason I wanted to get it out there is to let everyone know that there has been some progress lately. Also this is the reason I'm not looking at any PRs at the moment. I'd like to get 1.0-dev branch into a good shape first and then go over the open issues and PRs in order to see which ones are still relevant and if they can be incorporated in the 1.0 release.

The best way for you to stay updated on the progress here is to subscribe to this issue. I will be posting updates in comments below.

The first dev release is out on Pub: https://pub.dev/packages/zefyr/versions/1.0.0-dev.1.0

I'd encourage everyone to give it a try and see if things are working well. Make sure to checkout the changelog for migration instructions.

@pulyaevskiy pulyaevskiy pinned this issue Sep 29, 2020
@GyuriMajercsik
Copy link
Contributor

Thanks Anatoly for the update. Congrats for the plugin.

In case we can help with something ( beside using and testing ), let us know.

@eli1stark
Copy link

eli1stark commented Sep 29, 2020

Hello Anatoly! I have a question: is there any solutions to this problem in the new version or in the old one. I need my ZefyrEditor(or ZefyrScaffold) to resize depending on the content. I'm trying to implement it inside a ListView, The mode of this ZefyrEditor is ZefyrMode.view. But I'm getting an error about unbounded height. I tried to dynamically change height depending on the length of the Notus document but in the long run, I have a big space at the end of the listview. This is the only solution I found for myself. I also tried to detect how many lines the document has. But it can become tricky since the whole note can have only 1 line. And something like (lines * 50px) won't work. One note, this ListView is inside DraggableScrollableSheet. So something like ZefyrView won't work.
PS: Actually nevermind, I found a solution: DraggableScrollableSheet -> ListView -> ZefyrView. I search for this almost a month🤭.
Thank you for your package. It's amazing. I made a great app because of it.

@cgestes
Copy link
Collaborator

cgestes commented Sep 29, 2020

Hi @eli1stark, look at the examples linked in the original post, it seems that the rewrite helps fixing all that kind of cases 👍

@pulyaevskiy so cool!!!

some behaviors I noticed:

  • when embedded in a ListView moving the keyboard up/down has funny scrolling effect
  • the selection bubbles really work nicely!!! <3
  • the selection bubbles appear on desktop browser (I believe they should not)
  • selection of rich text on the web is still broken because of [web] Support rich text in CanvasTextMeasurementService flutter/flutter#55587
  • inserting a picture seems to insert an HR (at least on the web)

@cgestes
Copy link
Collaborator

cgestes commented Sep 30, 2020

@pulyaevskiy some questions... :D

Why did you deprecate the NotusDocument.fromDelta constructor?

Can we make the focusNode optional?

@pulyaevskiy
Copy link
Contributor Author

Why did you deprecate the NotusDocument.fromDelta constructor?

This is due to changes in Notus in regards to handling embeds. You can find details in the changelog here: https://github.com/memspace/zefyr/blob/1.0-dev/packages/notus/CHANGELOG.md

I'm relying embeds are stored as data of insert operations (while previously they were in style attributes). To make things a little bit more statically safe there is now EmbeddableObject class which is JSON-serializable and it's stored directly in the Delta, e.g.:

final delta = Delta()..insert(BlockEmbed('hr')); // this inserts a horizontal rule

When converting to JSON everything works automatically because EmbeddableObject implements toJson. However when decoding from JSON by default this data is turned into a Map.

To turn it back into our custom type I've added a callback argument to Delta constructor which allows to customize decoding of embedded data. And NotusDocument passes its own in the fromJson constructor:

Delta.fromJson(data, dataDecoder: _deltaDataDecoder)) {

The problem with fromDelta constructor is that the Delta has already been decoded and contains Maps for embeds. To fix this we'd have to run a loop over the entire document and convert embeds from Maps to EmbeddableObjects. Which is maybe not that big of a deal, but it's something that would be nice to avoid.

I also feel like it'd be less confusing for first time users, as I've seen quite a few questions about how to save and load documents back into the editor.

Can we make the focusNode optional?

Possibly yes. I'd keep it required for RawEditor, but can make optional for ZefyrEditor and ZefyrField.

@yeras-is
Copy link

yeras-is commented Oct 2, 2020

please add function NotusDocument to/from HTML as it works in notustohtml, for now it uses Delta to convert, but it will be nice to avoid converting toDelta->toHTML. We need it to share petty formatted data across mobile(Flutter) and Web(React)

@cgestes
Copy link
Collaborator

cgestes commented Oct 2, 2020

Ok. I will think about how I so think and see if I can cover all use case with the new method. (I do apply some transform using delta, for example when highlighting search result)

@dheerajsarwaiya
Copy link

HI,

Thanks for the update.

Given ZefyrScaffold is gone and we need to add toolbar by ourselves, is there an easy way to make ZefyrToolbar.basic(controller: _controller) scroll-able. When I am using ZefyrToolbar as mentioned in one of your example, it is always overflowing.

Any suggestion?

@cgestes
Copy link
Collaborator

cgestes commented Oct 6, 2020 via email

@masewo
Copy link

masewo commented Oct 6, 2020

This is working without any problems for me:

SingleChildScrollView(
  scrollDirection: Axis.horizontal,
  child: ZefyrToolbar.basic(controller: _controller))

@dheerajsarwaiya
Copy link

This is working without any problems for me:

SingleChildScrollView(
  scrollDirection: Axis.horizontal,
  child: ZefyrToolbar.basic(controller: _controller))

This did the trick for me.. Thanks.

@koenhagen
Copy link

koenhagen commented Oct 14, 2020

Would I be able to put Zefyr text in my firebase Cloud Firestore?

@cgestes
Copy link
Collaborator

cgestes commented Oct 14, 2020

Would I be able to put Zefyr text in my firebase Cloud Firestore?
Of course. Same as it is already.

@ciriousjoker
Copy link

Would I be able to put Zefyr text in my firebase Cloud Firestore?

You can use quill-delta to manage the text from your cloud functions. Just make sure to append the \n at the end, it didn't do that automatically for me.

@FelixMittermeier
Copy link

Do you have a paypal donation link or something like that? As my software will heavily depend on this library I would like to help speeding up the development process to be able to integrate the new release version in the near future.

@ElochukwuPrince
Copy link

Me to my software is all about articles and will depend on this package, I will like to contribute as well.

@hnvn
Copy link

hnvn commented Oct 27, 2020

Yep, this is a great package, no doubt, but I think the maintainers need more contributions from our community to speed up the development process. The first I see that we can try to test existing features, report issues and even better that try to investigate and fix them by ourself.

@FelixMittermeier
Copy link

Yep, this is a great package, no doubt, but I think the maintainers need more contributions from our community to speed up the development process. The first I see that we can try to test existing features, report issues and even better that try to investigate and fix them by ourself.

In general you're right but in this case I don't think there is anything the community can currently do. The maintainer wrote above he is not looking at open PR at the moment due to the breaking changes of the complete rewrite of this package:

Also this is the reason I'm not looking at any PRs at the moment. I'd like to get 1.0-dev branch into a good shape first and then go over the open issues and PRs in order to see which ones are still relevant and if they can be incorporated in the 1.0 release.

As a result of this we just have to wait and therefore I thought it would make sense to support him with donations. Unfortunately I found no way of doing that.

@cgestes
Copy link
Collaborator

cgestes commented Oct 27, 2020

I believe PRs are fine, its just that bug reports are not very useful as this is beta quality code, that we know requires more work.  @pulyaevskiy please correct me if I got it wrong.

@singerdmx
Copy link

singerdmx commented Jul 28, 2021

IMHO, to support three different platforms and driving to reduce dependencies, we should export an interface package as follows. If one choose to do desktop, one should import lib, desktop packages. Mobile and web are similar.

lib
┣ reference interface // business logic

interface
┣ define embed and other interfaces

web
┣ reference interface and implement it

mobile
┣ reference interface and implement it

desktop
┣ reference interface and implement it

I can try it out in flutter_quill when I have free time. Also it may be useful to use dependency injection https://medium.com/flutter-community/dependency-injection-in-flutter-f19fb66a0740 https://resocoder.com/2020/02/04/injectable-flutter-dart-equivalent-to-dagger-angular-dependency-injection/

@pulyaevskiy
Copy link
Contributor Author

Hey everyone,

Just to answer this question:

Is Zefyr abandoned?

No. I have not been actively contributing to it, which is true. But ultimately it's still a project I'd like to work on.

And actually there are some recent changes which got merged into 1.0-dev branch including support for Flutter 2.x (stable) and some null-safety improvements. Thanks to contributions from @Amir-P .

I'm still pretty limited with my time, but I'm thinking of a way to enable better collaboration. You can expect a pretty slow pace for the time being though.

@britannio
Copy link
Contributor

@pulyaevskiy the 1.0 announcement was made 10 months ago and 7 months of that time went by without a single commit to the 1.0-dev branch. From the perspective of a developer trying to use this package in production, 7 months of absence does constitute the project being abandoned hence why we're moving on to super_editor. What's to stop these delays from recurring if you're the sole maintainer?

I kindly request that you update https://github.com/memspace/zefyr/projects/1 with all the recent 1.0 issues you'd like to be solved then appoint some maintainers to focus specifically on the issues you've curated there?

@0Vipin0
Copy link

0Vipin0 commented Jul 28, 2021

@pulyaevskiy It's good to see that the creator is still working on the project. And I completely agree with what @britannio said.

I kindly request that you update https://github.com/memspace/zefyr/projects/1 with all the recent 1.0 issues you'd like to be solved then appoint some maintainers to focus specifically on the issues you've curated there?

I believe that no single person can give a large amount of time and have their work of their own but I think the flutter community is sufficiently big and knowledgeable to help you continue to maintain this repo. I think you should get add some contributors to this project who have either have good amount PR's to this repo or whatever way you feel good enough to decide the contributors. But in the end, final decision is yours.

@singerdmx
Copy link

singerdmx commented Jul 28, 2021

My suggestion is to be really selective on contributors. From my personal experience maintaining flutter_quill repo, most contributors do not have a good grasp of the code base. Some does not even know flutter has master, dev, beta channels and send random PRs for their channel.
You don't want them to break your code.

@pulyaevskiy
Copy link
Contributor Author

@britannio @0Vipin0

I kindly request that you update https://github.com/memspace/zefyr/projects/1 with all the recent 1.0 issues you'd like to be solved then appoint some maintainers to focus specifically on the issues you've curated there?

I was thinking about something along these lines as well.

Re: contributors

I'd be happy to add contributors to the project. That said, I'd be hesitant to give push or merge permissions right away. The way I'll likely to approach this is to first get an opportunity to work on a few PRs together so that there is good understanding of the codebase and the design choices that were made and to be made still.

From my end I need to work on better documentation, both architectural and conceptual. As well as some actual tech specs for proposed features. Being a sole maintainer makes it much less critical and allows to focus on just coding. This will have to change.

In short, I'm planning to do what @britannio requested. If there are still volunteers to actively contribute to the project, feel free to reach out to me here or via email, whatever works best. We'll arrange some sort of group for collaboration.

@nipunasudha
Copy link

nipunasudha commented Oct 19, 2021

Any plan to address #305 "Copy text to clipboard with style" in the 1.0 release? I currently cannot copy & paste content with text styles.

@Amir-P
Copy link
Collaborator

Amir-P commented Oct 19, 2021

Any plan to address #305 "Copy text to clipboard with style" in the 1.0 release? I currently cannot copy & paste content with text styles.

There is a limitation by Flutter's engine. Currently it's not supported to set data for clipboard other than plain text. Until that isn't changed, there is not much we can do on Zefyr's side. @nipunasudha

@nipunasudha
Copy link

Any plan to address #305 "Copy text to clipboard with style" in the 1.0 release? I currently cannot copy & paste content with text styles.

There is a limitation by Flutter's engine. Currently it's not supported to set data for clipboard other than plain text. Until that isn't changed, there is not much we can do on Zefyr's side. @nipunasudha

That's too bad! Tradeoff of having to maintain cross platform support, which is understandable. Thank you very much for the quick response.

@pulyaevskiy
Copy link
Contributor Author

Any plan to address #305 "Copy text to clipboard with style" in the 1.0 release? I currently cannot copy & paste content with text styles.

There is a limitation by Flutter's engine. Currently it's not supported to set data for clipboard other than plain text. Until that isn't changed, there is not much we can do on Zefyr's side. @nipunasudha

That's too bad! Tradeoff of having to maintain cross platform support, which is understandable. Thank you very much for the quick response.

There is still an option of writing a custom platform plugin which adds rich text clipboard integration. I believe most platforms which support it use html content to describe rich text. At least from my limited research into this issue a while back.

This would of course depend on whether particular target platform supports setting some form of rich text in the clipboard.

@Amir-P
Copy link
Collaborator

Amir-P commented Oct 20, 2021

Any plan to address #305 "Copy text to clipboard with style" in the 1.0 release? I currently cannot copy & paste content with text styles.

There is a limitation by Flutter's engine. Currently it's not supported to set data for clipboard other than plain text. Until that isn't changed, there is not much we can do on Zefyr's side. @nipunasudha

That's too bad! Tradeoff of having to maintain cross platform support, which is understandable. Thank you very much for the quick response.

There is still an option of writing a custom platform plugin which adds rich text clipboard integration. I believe most platforms which support it use html content to describe rich text. At least from my limited research into this issue a while back.

This would of course depend on whether particular target platform supports setting some form of rich text in the clipboard.

I was thinking about doing this a few weeks ago but didn't have the time. It's possible at least for mobile platforms which I was interested in.

@pulyaevskiy
Copy link
Contributor Author

Thanks to the help the community and especially @Amir-P , @amantoux and @cgestes we just released the first release candidate versions of both Notus and Zefyr packages:

https://pub.dev/packages/zefyr/versions/1.0.0-rc.1
https://pub.dev/packages/notus/versions/1.0.0-rc.1

Please refer to the changelog of both packages for more details. Note that 1.0.0-rc.1 already comes with support for Flutter 2.8 which was just release earlier today.

Does it mean we're getting the stable 1.0 soon?

We're definitely getting closer to the stable release, but it may still be several months away.
That said, with release of a release candidate I'm hoping more people would be willing to try the package since it's in a much more stable state, comparing to the last dev release. It is still not a stable release so incomplete functionality and occasional bugs are to be expected.

@pulyaevskiy
Copy link
Contributor Author

Zefyr 1.0.0.-rc.2 is out: https://pub.dev/packages/zefyr/versions/1.0.0-rc.2

1.0.0-rc.2

  • Inline code improvements: added backgroundColor, radius and style overrides for headings to
    inline code theme (#573)
  • Fixed: Inserting horizontal rule moves cursor on the next line after it (#576)
  • Added Shift + Click support for extending selection on desktop (#577)
  • Added automatic scrolling while selecting text with mouse (#577)
  • Added support for text alignment (#565)
  • Added support for checklists (#579)

@taojoe
Copy link

taojoe commented Dec 23, 2021

#582 is related to 1.0.0-rc.2

@pulyaevskiy
Copy link
Contributor Author

Zefyr 1.0.0.-rc.3 is out: https://pub.dev/packages/zefyr/versions/1.0.0-rc.3

1.0.0-rc.3

  • Added keyboard shortcuts for bold, italic and underline styles. (#580)
  • Launch URL improvements: allow launching links in editing mode (#581)
    • For desktop platforms: links launch on Cmd + Click (macOS) or Ctrl + Click (windows, linux)
    • For mobile platforms: long-pressing a link shows a context menu with multiple actions (Open, Copy, Remove) for the user to choose from.

@taojoe
Copy link

taojoe commented Dec 27, 2021

#583 please consider supporting nested list(inner list) .

@taojoe
Copy link

taojoe commented Dec 28, 2021

@pulyaevskiy I noticed the comment for "SpanEmbed", and I see the editor on quilljs can embed latex inline, does this means "the contract" is settled by quilljs? and the "SpanEmbed" can be supported?

https://quilljs.com/docs/formats

/// An object which can be embedded on the same line (inline) with regular text.
///
/// Span embeds are not currently supported by Notus document model and this
/// class exists to establish the contract for future work.
// TODO: document model currently only supports BlockEmbeds and need to be updated to support SpanEmbeds.

image

@cgestes
Copy link
Collaborator

cgestes commented Dec 28, 2021 via email

@taojoe
Copy link

taojoe commented Dec 29, 2021

On Tue, Dec 28, 2021, 14:05 周向涛 @.> wrote: @pulyaevskiy https://github.com/pulyaevskiy I noticed the comment for "SpanEmbed", and I see the editor on quilljs can embed latex inline, does this means "the contract" is settled by quilljs? and the "SpanEmbed" can be supported?
It means that you need to implements embeds for span. It is currently only implemented for blocks. (Full line). Btw Zefyr doesn't strictly follow quilljs formats. It only use the delta format in a similar way. https://quilljs.com/docs/formats

/// An object which can be embedded on the same line (inline) with regular text. /// /// Span embeds are not currently supported by Notus document model and this /// class exists to establish the contract for future work. // TODO: document model currently only supports BlockEmbeds and need to be updated to support SpanEmbeds. [image: image] https://user-images.githubusercontent.com/545656/147564370-3c7ae680-43f2-4bfe-b1fc-1099017111d1.png — Reply to this email directly, view it on GitHub <#409 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAL75IOHIF4YQ7GRFNTSALUTGRXPANCNFSM4R5LHQ6Q . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub. You are receiving this because you were mentioned.Message ID: @.
>

at zefyr/packages/zefyr/lib/src/widgets/text_line.dart line 122, I think it is restricted the way to build a WidgetSpan as an inline embed, is that correct?

119 @override
120  Widget build(BuildContext context) {
121    assert(debugCheckHasMediaQuery(context));
122    if (widget.node.hasEmbed) {
123      final embed = widget.node.children.single as EmbedNode;
124      return EmbedProxy(child: widget.embedBuilder(context, embed));
125    }

@taojoe
Copy link

taojoe commented Dec 29, 2021

and I modified the code a little, try to make an inline embed widget, it worked. the red frame is where the modify is.
maybe, change function "_segmentToTextSpan" to build inline embed to WidgetSpan will enable inline embed?

image

image

@taojoe
Copy link

taojoe commented Dec 29, 2021

#584 is related to Chinese input method, I think Japanese input method will have the same issue.

@emmggi
Copy link

emmggi commented Jan 4, 2022

I'm following the development of this. I want to make a more complicated note taking app.

Many thanks for not making me make something like this. :D

@Patrick386
Copy link

Zefyr1.0 When can I use this?

@meg4cyberc4t
Copy link

meg4cyberc4t commented May 17, 2022

How are you guys? is work going on?
v1.0.0- rc5 does not launch in flutter 3

@aleripe
Copy link

aleripe commented May 24, 2022

It's definitely dead, I suppose...

@cgestes
Copy link
Collaborator

cgestes commented May 27, 2022

How are you guys? is work going on?

not much happening sadly.

v1.0.0- rc5 does not launch in flutter 3

I may have the fixes you need here (it works with flutter 3): https://github.com/jotshq/zefyr

@edwin-alvarez
Copy link

@cgestes , how do I activate your branch Im trying to migrate from a very old flutter version, and Im having some issues due to missing physics, ZefyrScaffold, ZefyrView

@cracked2626
Copy link

@cgestes , how do I activate your branch Im trying to migrate from a very old flutter version, and Im having some issues due to missing physics, ZefyrScaffold, ZefyrView

Hey , got any solution?

@Amir-P
Copy link
Collaborator

Amir-P commented Jul 17, 2022

@cgestes , how do I activate your branch Im trying to migrate from a very old flutter version, and Im having some issues due to missing physics, ZefyrScaffold, ZefyrView

Hey , got any solution?

Hey, you can use Fleather for now. It's a fork me and @amantoux working on. https://github.com/fleather-editor/fleather

@iamtomsap
Copy link

hello guys.
can anybody help me with ZefyrValidator?
because i'm working with ZefyrEditor in Flutter and I want to add validator (cannot be empty), but I can't find any clue in the documentation.

Thank you in advance

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests