[REF]: Update changelog and package.json due to evolution to files-ui

Author: JinSSJ3

CHANGELOG.md

@@ -9,6 +9,50 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [Dropzone-ui(7.0.0) = Files-ui(1.0.0)](https://github.com/files-ui/files-ui-react/releases/tag/v1.0.0) (2023-03-28)
+
+## 🧪 New features and 🐛🔨 Improvements
+
+- [\<FileMosaic/\>](https://www.files-ui.com/components/filemosaic): This new component replaces the old "FileItem" component.
+
+  - Darkmode: Now component can be adpted to a dark mode pages with the respective prop.
+  - New icons: Icons for delete were changed.
+  - For uploading, the loader can support to display the current progress.
+
+- [\<FileCard/\>](https://www.files-ui.com/components/filecard): This new component is an alternative version of FileMosaic. It displays the file info in a card. Receives the same props as FileMosaic plus `elevation`.
+
+- [\<FileInputButton/\>](https://www.files-ui.com/components/dropzone): This component replaces the old "InputButton" component. The features are the same as the dropzone except the header and footer related features. That means that this component now can trigger the upload progress.
+  Validation is optional, so non valid files can be uploaded.
+
+- [\<Avatar/\>](https://www.files-ui.com/components/avatar): This new component is designed tohandle the selection of images for changing the avatar. Can recieve as source an string url or even a File.
+
+- [\<FullScreen/\>](https://www.files-ui.com/api/fullscreen): The old components "FullScreenImage" and "FullScreenVideo" have been separated into FUllScreen, ImagePreview and VideoPreview.
+
+  - FullScreen: component for display in a fullscreen backdrop other components.
+  - [ImagePreview](https://www.files-ui.com/api/imagepreview): component is an \<img/\> tag enhanced to allow as `src` a string url or a ile object.
+  - [VideoPreview](https://www.files-ui.com/api/videopreview): component is an \<video/\> tag enhanced to allow as `src` a string url or a ile object.
+
+- [\<Dropzone/\>](https://www.files-ui.com/components/dropzone): This component has been refactored to improve the design, colors and internal components such us headeror footer.
+
+  - Header and footer can be handled through 2 new props: `headerConfig` and `footerConfig`
+  - Action buttons: these are external buttons thta can trigger the default operations in dropzone.
+  - Uploading: The upload operation now is completele handled using pure javascript without external libraries wich means `axios` is no longer a dependency.
+
+- `smartImgFit`: This is a special prop for FileMosaic, FileCard and Avatar components that makes someway "smart" the components to fit the images depeding on their orientation ("landscape" or protrait). Square images are hardly afected.
+
+  - How it works?
+
+    - If false, image width will be set to 100%.
+      If present, image will be analized and displayed according to its heigh and width. Image with height greater than its width has a "portrait" orientation. Otherwise it has a "landscape" orientation. .
+
+          - If value is "orientation", image will be displayed complete by giving 100% to width prop if the orientation is "landscape". When orientation is "portrait", height prop will be set to 100%. Some images will show an empty space.
+
+          - If value is "center", image will be centered and will not be displayed complete. This the empty space is avoided. This is achived by giving 100% to width prop if the orientation is "portrait". When orientation is "landscape", height prop will be set to 100%.
+
+## 📚 Improved documentation.
+
+- The complete documentation can be found in files-ui [web page](https://www.files-ui.com).
+
 <a name="6.4.0"></a>
 
 ## [6.4.0](https://github.com/dropzone-ui/react-dropzone/releases/tag/v6.4.0) (2021-12-12)

README.md

@@ -15,10 +15,9 @@
 [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
 [![GitHub Repo stars](https://img.shields.io/github/stars/dropzone-ui/react?label=Star%20me%20please%20:D&style=social)](https://github.com/dropzone-ui/react)
 
-
-
 Thank you so much for using dropzone-ui/react ❤️ !
-Dropzone UI has grown very fast and has exceeded its original scope. That's why we find reasonable to rebrand it and create a new package taking the best of this one and adding more features and new components. This new package is here and its name is Files UI ⚡
+
+Dropzone UI has grown very fast and has exceeded its original scope. That's why we find reasonable to rebrand it and create a new package taking the best of this one and adding more features and new components. This new package is here and its name is Files UI ⚡.
 In an very near future we'll stop giving support to dropzone-ui, so we enforce you to upgrade to this new package. In the meanwhile this package will become a wrapper for files-ui.
 
 :zap: Live demos and full documentation : [files-ui.com](https://files-ui.vercel.app)
@@ -33,11 +32,12 @@ In an very near future we'll stop giving support to dropzone-ui, so we enforce y
 
 ## Important
 
-From now on [@files-ui/react](https://www.npmjs.com/package/@files-ui/react)  is the only dependency. Check out the changelog file to know what's new.
+From now on [@files-ui/react](https://www.npmjs.com/package/@files-ui/react) is the only dependency. Check out the changelog file to know what's new.
 
 ## Sample result:
 
 This is a small part of what you can find on files-ui :eyes:
+
 <p align="center">
 <a href="https://www.files-ui.com">
 <img src="https://user-images.githubusercontent.com/43678736/228052494-99d970c0-1eb7-42c6-b22c-8c2295b8dc4a.gif"  width="80%" alt="fui-logo"/>
@@ -46,7 +46,6 @@ This is a small part of what you can find on files-ui :eyes:
 
 - More previews [here](#more-previews).
 
-
 ## Requirement
 
 `@dropzone-ui/react` is based on [React Hooks](https://reactjs.org/docs/hooks-intro.html). It requires `react v16.8+`.
@@ -66,7 +65,13 @@ yarn add @dropzone-ui/react
 ```
 
 ## API documentation
-The complete documentation of every component has been moved to files-ui.com [API page](https://www.files-ui.com/api/dropzone). However if you are still using dropzone-ui version 6 or less you can find the documentation [here](https://www.npmjs.com/package/@dropzone-ui/react/v/6.7.20#dropzone-ui-react-components-api).
+
+The complete documentation of every component has been moved to files-ui.com [API page](https://www.files-ui.com/api/dropzone).
+
+However if you are still using dropzone-ui version 6.7.0 or lower, you can find the documentation and demos here:
+
+- ⚡ [Samples](https://www.npmjs.com/package/@dropzone-ui/react/v/6.7.20?activeTab=readme#Usage-and-examples)
+- 📚 [Docs](https://www.npmjs.com/package/@dropzone-ui/react/v/6.7.20#dropzone-ui-react-components-api).
 
 ## Supporters
 
@@ -82,24 +87,28 @@ Special thanks to these amazing people :star: :
 
 ## More Previews
 
-### Image full screen preview
-
-<p align="center"><img src="https://user-images.githubusercontent.com/43678736/228066199-fb7a5bd3-9c7e-4f72-b0ef-7f11d236d38e.png" alt="Image full screen preview" width="100%"/></p>
-
-### Video full screen preview
+<details>
+  <summary>Image full screen preview 🖼️ </summary>
+  <p align="center"><img src="https://user-images.githubusercontent.com/43678736/228066199-fb7a5bd3-9c7e-4f72-b0ef-7f11d236d38e.png" alt="Image full screen preview" width="100%"/></p>
 
+</details>
+<details>
+ <summary>Video full screen preview 🎞️ </summary>
 <p align="center"><img src="https://user-images.githubusercontent.com/43678736/228066195-62063300-21e0-48fd-80d8-31b566562fde.png" alt="Video full screen preview" width="100%"/></p>
+</details>
 
-### File Mosaic, FileInputButotn and Avatar preview
-
+<details>
+ <summary>FileCard, FileInputButton and Avatar preview 🎴 </summary>
 <p align="center"><img src="https://user-images.githubusercontent.com/43678736/228063876-5b6d00fe-f0ba-453f-a7ce-c44ba7444417.png" alt="Video full screen preview" width="100%"/></p>
 
-### DarkMode
+</details>
 
+<details>
+ <summary>DarkMode 🌙 🌞 </summary> 
 <p align="center"><img src="https://user-images.githubusercontent.com/43678736/228063883-569ca6f1-6959-45bc-9882-2c447162a00f.png" alt="darkmode 1 preview" width="100%"/></p>
 
 <p align="center"><img src="https://user-images.githubusercontent.com/43678736/228066720-e0bb96ac-3c00-4aa6-80b9-e0b4d0c5f947.png" alt="darkmode 2 preview" width="100%"/></p>
-
+</details>
 
 ## License