feat: add box select

[llaenowyd]

Note that the original version of the above was first submitted by @mishkaio under #57.

[ericfennis]

I reopened this issue, I don't get any response on #57 .
So @llaenowyd feel free to submit your versions.

[llaenowyd]

I reopened this issue, I don't get any response on #57 .
So @llaenowyd feel free to submit your versions.

Ok. I'm completely busy through the end of this week.

I took a look at the other PR. I think the latest feedback is to try something more of a dashed-line rectangle.

What I might do is focus the change down to the selection rectangle.

Is the version with cursor semantically different or a stylistic option?

Unless I'm missing something about it, I might bring in the box-with-cursor as an alternative possibility for box-select, rather than a request for 2 icons for box-select.

[ericfennis]

@llaenowyd No problem, take your time!

[llaenowyd]

The latest review feedback was when @ericfennis said

Btw we can also go more this way? ...

[llaenowyd]

[ericfennis]

@llaenowyd Nice work, looks awesome!!
I think we can optimize the code a bit by replacing some line elements with polylines.

[ericfennis]

@llaenowyd We always add an space before the end of the tag. Sorry I missed those.

[llaenowyd]

np - missed that - updated

[ericfennis]

I checked the guidelines, I think we forgot one thing.
We have 2px rounded corners.

What do you think? I think this looks better.

100%

Here is the code

<svg
  xmlns="http://www.w3.org/2000/svg"
  width="24"
  height="24"
  viewBox="0 0 24 24"
  fill="none"
  stroke="currentColor"
  stroke-width="2"
  stroke-linecap="round"
  stroke-linejoin="round"
>
  <path d="M4 2a2 2 0 00-2 2" />
  <line x1="8" y1="2" x2="10" y2="2" />
  <line x1="14" y1="2" x2="16" y2="2" />
  <path d="M4 22a2 2 0 01-2-2" />
  <line x1="22" y1="8" x2="22" y2="10" />
  <line x1="22" y1="14" x2="22" y2="16" />
  <path d="M22 20a2 2 0 01-2 2" />
  <line x1="14" y1="22" x2="16" y2="22" />
  <line x1="8" y1="22" x2="10" y2="22" />
  <path d="M20 2a2 2 0 012 2" />
  <line x1="2" y1="14" x2="2" y2="16" />
  <line x1="2" y1="8" x2="2" y2="10" />
</svg>

[moeenio]

Yup, rounded looks better.

[llaenowyd]

same, looks good!

[llaenowyd]

🎉

I think I can consider this done for my part right?

What's the rough estimated timeline for it showing up in npm feather-icons?

[ericfennis]

@llaenowyd unfortunately maybe never.
The author of feather-icons stopped maintaining the feather-icons projects 😔.
Featherity is just an independent fork runned by the community some of people worked on Feather icons.
See this thread, how it all started.

[ericfennis]

@llaenowyd But we are launching our own package soon!

[llaenowyd]

Ok, I see, interesting. I've seen dead packages and live packages, but I've never watched what looks to be a well motivated community effort to resuscitate a package. Hope to see it land. 👍