@jobber/components 2.84.4-pre.11 → 2.85.1

package/CHANGELOG.md

@@ -8,6 +8,25 @@ menu: Changelog
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.85.1](https://github.com/GetJobber/atlantis/compare/@jobber/components@2.85.0...@jobber/components@2.85.1) (2022-06-29)
+
+**Note:** Version bump only for package @jobber/components
+
+
+
+
+
+# [2.85.0](https://github.com/GetJobber/atlantis/compare/@jobber/components@2.84.3...@jobber/components@2.85.0) (2022-06-21)
+
+
+### Features
+
+* **components:** Atlantis Component For Gallery ([#891](https://github.com/GetJobber/atlantis/issues/891)) ([266d2c8](https://github.com/GetJobber/atlantis/commit/266d2c897156b50859bf996d19ae972e305ac092))
+
+
+
+
+
 ## [2.84.3](https://github.com/GetJobber/atlantis/compare/@jobber/components@2.84.2...@jobber/components@2.84.3) (2022-06-13)
 
 **Note:** Version bump only for package @jobber/components

package/dist/Gallery/GalleryTypes.d.ts

@@ -0,0 +1,31 @@
+import { IconNames } from "../Icon";
+import { FileUpload } from "../InputFile";
+export declare type Sizes = "small" | "base" | "large" | "extraLarge";
+export declare type FileIconsNames = Extract<IconNames, "file" | "excel" | "pdf" | "video" | "word">;
+export interface GalleryProps {
+    /**
+     * The size of the files and their spacing in the gallery
+     * @default "base"
+     */
+    size?: "base" | "large";
+    /**
+     * The files for the Gallery to display
+     */
+    files: File[];
+    /**
+     * The max number of thumbnails before no more thumbnails are displayed
+     * unless the user clicks an action to display the rest
+     */
+    max?: number;
+    /**
+     * onDelete callback - this function will be called when the delete action is
+     * triggered on a Gallery image
+     */
+    onDelete?(file: File): void;
+}
+export interface File extends Pick<FileUpload, "key" | "name" | "type" | "size" | "progress"> {
+    /**
+     * The data url of the file.
+     */
+    readonly src: string;
+}

package/dist/Gallery/index.js

@@ -8,7 +8,7 @@ var __chunk_1 = require('../chunk-b67af3cb.js');
 var React = require('react');
 var React__default = _interopDefault(React);
 var __chunk_2 = require('../chunk-17e02351.js');
-require('classnames');
+var classnames = _interopDefault(require('classnames'));
 require('../Typography/index.js');
 require('../Text/index.js');
 require('@jobber/design');
@@ -33,8 +33,8 @@ require('react-image-lightbox');
 var index$9 = require('../LightBox/index.js');
 require('react-image-lightbox/style.css');
 
-var css = ".oLHYkzv718LqMvtqFZFcZ,\n._2JSG0uYj1HSXFads63nptQ {\n  display: -ms-flexbox;\n  display: flex;\n  -ms-flex-wrap: wrap;\n      flex-wrap: wrap;\n  grid-gap: var(--space-small);\n  grid-gap: var(--space-small);\n  gap: var(--space-small);\n}\n\n._2JSG0uYj1HSXFads63nptQ {\n  grid-gap: var(--space-base);\n  grid-gap: var(--space-base);\n  gap: var(--space-base);\n}\n\n.FG8mZ6UcMPRsMC9HQinY2 {\n  display: -ms-flexbox;\n  display: flex;\n  width: 56px;\n}\n\n._1cTzKosWc22qxWZSiI0CzZ {\n  display: -ms-flexbox;\n  display: flex;\n  width: 168px;\n}\n";
-var styles = {"gallery":"oLHYkzv718LqMvtqFZFcZ","galleryLarge":"_2JSG0uYj1HSXFads63nptQ","baseShowMoreButton":"FG8mZ6UcMPRsMC9HQinY2","largeShowMoreButton":"_1cTzKosWc22qxWZSiI0CzZ"};
+var css = ".oLHYkzv718LqMvtqFZFcZ,\n._2JSG0uYj1HSXFads63nptQ {\n  display: -ms-flexbox;\n  display: flex;\n  -ms-flex-wrap: wrap;\n      flex-wrap: wrap;\n  grid-gap: var(--space-small);\n  grid-gap: var(--space-small);\n  gap: var(--space-small);\n}\n\n._2JSG0uYj1HSXFads63nptQ {\n  grid-gap: var(--space-base);\n  grid-gap: var(--space-base);\n  gap: var(--space-base);\n}\n\n._3LkQj1p9wvHbrfXfz2nUYp {\n  display: -ms-flexbox;\n  display: flex;\n}\n\n.FG8mZ6UcMPRsMC9HQinY2 {\n  width: 56px;\n  height: 56px;\n}\n\n._1cTzKosWc22qxWZSiI0CzZ {\n  width: 168px;\n  height: 168px;\n  box-shadow: var(--shadow-base);\n}\n";
+var styles = {"gallery":"oLHYkzv718LqMvtqFZFcZ","galleryLarge":"_2JSG0uYj1HSXFads63nptQ","showMoreButton":"_3LkQj1p9wvHbrfXfz2nUYp","baseShowMoreButton":"FG8mZ6UcMPRsMC9HQinY2","largeShowMoreButton":"_1cTzKosWc22qxWZSiI0CzZ"};
 __chunk_2.styleInject(css);
 
 function Gallery(_a) {
@@ -49,9 +49,9 @@ function Gallery(_a) {
             visibleFiles.map(function (file, index) {
                 return (React__default.createElement(index$8.FormatFile, { key: file.key, file: __chunk_1.__assign(__chunk_1.__assign({}, file), { src: function () { return Promise.resolve(file.src); } }), display: "compact", displaySize: size, onClick: function () {
                         handleThumbnailClicked(index);
-                    }, onDelete: function () { return onDelete === null || onDelete === void 0 ? void 0 : onDelete(file); } }));
+                    }, onDelete: onDelete ? function () { return onDelete === null || onDelete === void 0 ? void 0 : onDelete(file); } : undefined }));
             }),
-            max && files.length > max && !displayPastMax && (React__default.createElement("div", { className: styles[size + "ShowMoreButton"] },
+            max && files.length > max && !displayPastMax && (React__default.createElement("div", { className: classnames(styles.showMoreButton, styles[size + "ShowMoreButton"]) },
                 React__default.createElement(index$5.Button, { type: "tertiary", size: size, label: "+ " + (files.length - max), fullWidth: true, onClick: function () {
                         setDisplayPastMax(true);
                     } })))),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "2.84.4-pre.11+0bc09bbd",
+  "version": "2.85.1",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -85,5 +85,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "0bc09bbdf03734cf84ec041512ce6ecc4a2481d5"
+  "gitHead": "db1e956a1ebe6b004c55bfae41df3c09029175d0"
 }