@pnp/spfx-controls-react 3.20.0-beta.1098871 → 3.20.0-beta.1140273

package/lib/controls/imagePicker/models/IUploadFileResult.d.ts

@@ -0,0 +1,58 @@
+export interface IUploadFileResult {
+    '@odata.context': string;
+    '@content.downloadUrl': string;
+    '@deprecated.Decorator': string;
+    createdBy: CreatedBy;
+    createdDateTime: string;
+    eTag: string;
+    id: string;
+    lastModifiedBy: CreatedBy;
+    lastModifiedDateTime: string;
+    name: string;
+    parentReference: ParentReference;
+    webUrl: string;
+    cTag: string;
+    file: File;
+    fileSystemInfo: FileSystemInfo;
+    image: Image;
+    photo: Image;
+    size: number;
+}
+interface Image {
+}
+interface FileSystemInfo {
+    createdDateTime: string;
+    lastModifiedDateTime: string;
+}
+interface File {
+    hashes: Hashes;
+    irmEffectivelyEnabled: boolean;
+    irmEnabled: boolean;
+    mimeType: string;
+}
+interface Hashes {
+    quickXorHash: string;
+}
+interface ParentReference {
+    driveType: string;
+    driveId: string;
+    id: string;
+    name: string;
+    path: string;
+    siteId: string;
+}
+interface CreatedBy {
+    application: Application;
+    user: User;
+}
+interface User {
+    email: string;
+    id: string;
+    displayName: string;
+}
+interface Application {
+    id: string;
+    displayName: string;
+}
+export {};
+//# sourceMappingURL=IUploadFileResult.d.ts.map

package/lib/controls/imagePicker/models/IUploadFileResult.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IUploadFileResult.d.ts","sourceRoot":"","sources":["../../../../src/controls/imagePicker/models/IUploadFileResult.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,iBAAiB;IAChC,gBAAgB,EAAE,MAAM,CAAC;IACzB,sBAAsB,EAAE,MAAM,CAAC;IAC/B,uBAAuB,EAAE,MAAM,CAAC;IAChC,SAAS,EAAE,SAAS,CAAC;IACrB,eAAe,EAAE,MAAM,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,cAAc,EAAE,SAAS,CAAC;IAC1B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,eAAe,EAAE,eAAe,CAAC;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;IACX,cAAc,EAAE,cAAc,CAAC;IAC/B,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,KAAK;CACd;AAED,UAAU,cAAc;IACtB,eAAe,EAAE,MAAM,CAAC;IACxB,oBAAoB,EAAE,MAAM,CAAC;CAC9B;AAED,UAAU,IAAI;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,qBAAqB,EAAE,OAAO,CAAC;IAC/B,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,MAAM;IACd,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,UAAU,eAAe;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,SAAS;IACjB,WAAW,EAAE,WAAW,CAAC;IACzB,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,UAAU,IAAI;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,UAAU,WAAW;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;CACrB"}

package/lib/controls/imagePicker/models/IUploadFileResult.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=IUploadFileResult.js.map

package/lib/controls/imagePicker/models/IUploadFileResult.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IUploadFileResult.js","sourceRoot":"","sources":["../../../../src/controls/imagePicker/models/IUploadFileResult.ts"],"names":[],"mappings":""}

package/lib/controls/imagePicker/renderHeader/RenderHeader.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+export interface IRenderHeaderProps {
+    onDismiss: (open?: boolean) => void;
+    icon?: string | JSX.Element;
+    title: string | React.ReactNode;
+    description?: string | React.ReactNode;
+}
+export declare const RenderHeader: React.FunctionComponent<IRenderHeaderProps>;
+//# sourceMappingURL=RenderHeader.d.ts.map

package/lib/controls/imagePicker/renderHeader/RenderHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderHeader.d.ts","sourceRoot":"","sources":["../../../../src/controls/imagePicker/renderHeader/RenderHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,CAAC,IAAI,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,IAAI,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC5B,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,WAAW,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;CACxC;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC,kBAAkB,CAsCpE,CAAC"}

package/lib/controls/imagePicker/renderHeader/RenderHeader.js

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { Button, Caption1, Subtitle1, } from '@fluentui/react-components';
+import { Dismiss24Regular } from '@fluentui/react-icons';
+import { Icon } from '@iconify/react';
+import { useRenderHeaderStyles } from './useRenderHeaderStyles';
+export var RenderHeader = function (props) {
+    var onDismiss = props.onDismiss, title = props.title, description = props.description, icon = props.icon;
+    var styles = useRenderHeaderStyles();
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: styles.renderHeaderContent },
+            React.createElement("div", { className: styles.renderHeaderHeader },
+                React.createElement(Button, { appearance: "subtle", className: styles.closeButton, onClick: function () { return onDismiss(false); }, icon: React.createElement(Dismiss24Regular, null) }),
+                React.createElement("div", { className: styles.renderHeaderTitleContainer },
+                    React.isValidElement(icon) ? icon : React.createElement(Icon, { icon: icon, width: 24, height: 24 }),
+                    React.createElement("div", { className: styles.dialogTitleAndDescriptionContainer },
+                        React.isValidElement(title) ? (title) : (React.createElement(Subtitle1, { className: styles.renderHeaderTitle }, title)),
+                        React.isValidElement(description) ? (description) : (React.createElement(Caption1, { className: styles.renderHeaderDescription }, description))))))));
+};
+//# sourceMappingURL=RenderHeader.js.map

package/lib/controls/imagePicker/renderHeader/RenderHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderHeader.js","sourceRoot":"","sources":["../../../../src/controls/imagePicker/renderHeader/RenderHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,MAAM,EACN,QAAQ,EACR,SAAS,GACV,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAEtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAShE,MAAM,CAAC,IAAM,YAAY,GAAgD,UACvE,KAAkD;IAE1C,IAAA,SAAS,GAA+B,KAAK,UAApC,EAAE,KAAK,GAAwB,KAAK,MAA7B,EAAE,WAAW,GAAW,KAAK,YAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;IACtD,IAAM,MAAM,GAAG,qBAAqB,EAAE,CAAC;IAEvC,OAAO,CACL;QACA,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB;YACxC,6BACE,SAAS,EAAE,MAAM,CAAC,kBAAkB;gBAEpC,oBAAC,MAAM,IACL,UAAU,EAAC,QAAQ,EACnB,SAAS,EAAE,MAAM,CAAC,WAAW,EAC7B,OAAO,EAAE,cAAM,OAAA,SAAS,CAAC,KAAK,CAAC,EAAhB,CAAgB,EAC/B,IAAI,EAAE,oBAAC,gBAAgB,OAAG,GAC1B;gBAEF,6BAAK,SAAS,EAAE,MAAM,CAAC,0BAA0B;oBAC9C,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAc,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAG;oBACzF,6BAAK,SAAS,EAAE,MAAM,CAAC,kCAAkC;wBACtD,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAC7B,KAAK,CACN,CAAC,CAAC,CAAC,CACF,oBAAC,SAAS,IAAC,SAAS,EAAE,MAAM,CAAC,iBAAiB,IAAG,KAAK,CAAa,CACpE;wBACA,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CACnC,WAAW,CACZ,CAAC,CAAC,CAAC,CACF,oBAAC,QAAQ,IAAC,SAAS,EAAE,MAAM,CAAC,uBAAuB,IAAG,WAAW,CAAY,CAC9E,CACG,CACF,CACF,CACF,CACL,CACF,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/imagePicker/renderHeader/useRenderHeaderStyles.d.ts

@@ -0,0 +1,2 @@
+export declare const useRenderHeaderStyles: () => Record<"closeButton" | "divider" | "renderHeaderContent" | "renderHeaderHeader" | "renderHeaderFooter" | "renderHeaderBody" | "renderHeaderTitleContainer" | "renderHeaderTitle" | "renderHeaderDescription" | "dialogTitleAndDescriptionContainer", string>;
+//# sourceMappingURL=useRenderHeaderStyles.d.ts.map

package/lib/controls/imagePicker/renderHeader/useRenderHeaderStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRenderHeaderStyles.d.ts","sourceRoot":"","sources":["../../../../src/controls/imagePicker/renderHeader/useRenderHeaderStyles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,qBAAqB,oQAuFhC,CAAC"}

package/lib/controls/imagePicker/renderHeader/useRenderHeaderStyles.js

@@ -0,0 +1,49 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { makeStyles, shorthands, tokens, } from '@fluentui/react-components';
+export var useRenderHeaderStyles = makeStyles({
+    closeButton: {
+        marginLeft: "auto",
+        position: "absolute",
+        top: "10px",
+        right: "10px",
+        zIndex: 99999,
+    },
+    divider: {
+        width: "100%",
+        height: "1px",
+        backgroundColor: tokens.colorNeutralStroke1,
+        marginTop: "20px",
+    },
+    renderHeaderContent: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "flex-start",
+        alignItems: "stretch",
+        width: "100%",
+    },
+    renderHeaderHeader: __assign({ minHeight: "50px", display: "flex", flexDirection: "column", justifyContent: "flex-start", alignItems: "start" }, shorthands.gap("20px")),
+    renderHeaderFooter: __assign(__assign({ display: "flex", flexDirection: "row", justifyContent: "flex-start" }, shorthands.padding("20px")), shorthands.gap("20px")),
+    renderHeaderBody: __assign(__assign({ display: "flex", flexDirection: "column", justifyContent: "flex-start" }, shorthands.padding("20px")), shorthands.gap("20px")),
+    renderHeaderTitleContainer: __assign({ display: "flex", flexDirection: "row", justifyContent: "flex-start", alignItems: "center" }, shorthands.gap("0px")),
+    renderHeaderTitle: __assign(__assign({ display: "-webkit-box", "-webkit-line-clamp": "1", "-webkit-box-orient": "vertical" }, shorthands.overflow("hidden")), { textAlign: "start", textOverflow: "ellipsis" }),
+    renderHeaderDescription: __assign(__assign(__assign(__assign({}, shorthands.overflow("hidden")), { display: "-webkit-box", "-webkit-line-clamp": "4", "-webkit-box-orient": "vertical" }), shorthands.overflow("hidden")), { textAlign: "start", textOverflow: "ellipsis" }),
+    dialogTitleAndDescriptionContainer: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "start",
+        alignItems: "start",
+        paddingLeft: "10px",
+        paddingRight: "20px",
+    },
+});
+//# sourceMappingURL=useRenderHeaderStyles.js.map

package/lib/controls/imagePicker/renderHeader/useRenderHeaderStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRenderHeaderStyles.js","sourceRoot":"","sources":["../../../../src/controls/imagePicker/renderHeader/useRenderHeaderStyles.ts"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EACL,UAAU,EACV,UAAU,EACV,MAAM,GACP,MAAM,4BAA4B,CAAC;AAEpC,MAAM,CAAC,IAAM,qBAAqB,GAAG,UAAU,CAAC;IAC9C,WAAW,EAAE;QACX,UAAU,EAAE,MAAM;QAClB,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,MAAM;QACX,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,KAAK;KACd;IAED,OAAO,EAAE;QACP,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,KAAK;QACb,eAAe,EAAE,MAAM,CAAC,mBAAmB;QAC3C,SAAS,EAAE,MAAM;KAElB;IAED,mBAAmB,EAAE;QAGnB,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,cAAc,EAAE,YAAY;QAC5B,UAAU,EAAE,SAAS;QAErB,KAAK,EAAE,MAAM;KACd;IACD,kBAAkB,aAChB,SAAS,EAAE,MAAM,EAEjB,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,cAAc,EAAE,YAAY,EAC5B,UAAU,EAAE,OAAO,IAChB,UAAU,CAAC,GAAG,CAAC,MAAM,CAAC,CAE1B;IACD,kBAAkB,sBAEhB,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,KAAK,EACpB,cAAc,EAAE,YAAY,IACzB,UAAU,CAAC,OAAO,CAAC,MAAM,CAAC,GAC1B,UAAU,CAAC,GAAG,CAAC,MAAM,CAAC,CAC1B;IACD,gBAAgB,sBAEd,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,cAAc,EAAE,YAAY,IACzB,UAAU,CAAC,OAAO,CAAC,MAAM,CAAC,GAC1B,UAAU,CAAC,GAAG,CAAC,MAAM,CAAC,CAC1B;IACD,0BAA0B,aACxB,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,KAAK,EACpB,cAAc,EAAE,YAAY,EAC5B,UAAU,EAAE,QAAQ,IACjB,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC,CACzB;IACD,iBAAiB,sBACf,OAAO,EAAE,aAAa,EACtB,oBAAoB,EAAE,GAAG,EACzB,oBAAoB,EAAE,UAAU,IAC7B,UAAU,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAChC,SAAS,EAAE,OAAO,EAClB,YAAY,EAAE,UAAU,GAEzB;IACD,uBAAuB,0CAClB,UAAU,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAChC,OAAO,EAAE,aAAa,EACtB,oBAAoB,EAAE,GAAG,EACzB,oBAAoB,EAAE,UAAU,KAC7B,UAAU,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAChC,SAAS,EAAE,OAAO,EAClB,YAAY,EAAE,UAAU,GACzB;IACD,kCAAkC,EAAE;QAClC,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,cAAc,EAAE,OAAO;QACvB,UAAU,EAAE,OAAO;QACnB,WAAW,EAAE,MAAM;QACnB,YAAY,EAAE,MAAM;KACrB;CAEF,CAAC,CAAC"}

package/lib/controls/imagePicker/selectFromSharePoint.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { IFilePickerResult } from './IFilePickerResult';
+export interface ISelectFromSharePointProps {
+    onFileSelected: (file: IFilePickerResult) => void;
+    isOpen: boolean;
+    onDismiss: (refresh: boolean) => void;
+}
+export declare const SelectFromSharePoint: React.FunctionComponent<ISelectFromSharePointProps>;
+//# sourceMappingURL=selectFromSharePoint.d.ts.map

package/lib/controls/imagePicker/selectFromSharePoint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectFromSharePoint.d.ts","sourceRoot":"","sources":["../../../src/controls/imagePicker/selectFromSharePoint.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAuB/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AASxD,MAAM,WAAW,0BAA0B;IACzC,cAAc,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CACvC;AAaD,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,iBAAiB,CAAC,0BAA0B,CA0OpF,CAAC"}

package/lib/controls/imagePicker/selectFromSharePoint.js

@@ -0,0 +1,251 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+/* eslint-disable @typescript-eslint/no-var-requires */
+/* eslint-disable @typescript-eslint/no-unused-vars */
+/* eslint-disable @typescript-eslint/no-floating-promises */
+/* eslint-disable require-atomic-updates */
+import * as React from 'react';
+import strings from 'ControlStrings';
+import { useAtomValue } from 'jotai';
+import { Button, Dialog, DialogActions, DialogBody, DialogContent, DialogSurface, Image, mergeClasses, Spinner, tokens, } from '@fluentui/react-components';
+import { contextState } from './atoms/contextState';
+import { IMG_SUPPORTED_EXTENSIONS } from './constants/constants';
+import { useGraphAPI } from './hooks/useGrapAPI';
+import { useSpAPI } from './hooks/useSpAPI';
+import { useUtils } from './hooks/useUtils';
+import { RenderHeader } from './renderHeader/RenderHeader';
+import { SelectStockImage } from './SelectStokImage';
+import { UploadImageFiles } from './Upload';
+import { useImagePickerStyles } from './useImagePickerStyles';
+var defaultImage = require("./constants/defaultImage.png");
+var TENANT_NAME = window.location.hostname;
+var SOURCE_SHAREPOINT = "AND -path:https://*my.sharepoint.com";
+var SOURCE_ONEDRIVE = "AND path:https://*my.sharepoint.com";
+var SOURCE_STOCK = "stockImages";
+var SOURCE_UPLOAD = "upload";
+var acceptableExtensions = IMG_SUPPORTED_EXTENSIONS.split(",");
+var queryExtensions = acceptableExtensions.map(function (ext) { return "fileType:".concat(ext); }).join(" OR ");
+var PAGE_ITEMS = 50;
+export var SelectFromSharePoint = function (props) {
+    var isOpen = props.isOpen, onDismiss = props.onDismiss, onFileSelected = props.onFileSelected;
+    var _a = React.useState(false), isAdding = _a[0], setIsAdding = _a[1];
+    var _b = React.useState([]), searchResults = _b[0], setSearchResults = _b[1];
+    var appContext = useAtomValue(contextState);
+    var context = appContext.context;
+    var searchImages = useGraphAPI(context).searchImages;
+    var downLoadSpOrOneDriveContent = useSpAPI(context).downLoadSpOrOneDriveContent;
+    var _c = React.useState(null), selectedImage = _c[0], setSelectedImage = _c[1];
+    var refSelectedImage = React.useRef(null);
+    var isScrolling = React.useRef(false);
+    var styles = useImagePickerStyles();
+    var _d = React.useState(false), isLoading = _d[0], setIsLoading = _d[1];
+    var _e = React.useState(SOURCE_SHAREPOINT), source = _e[0], setSource = _e[1];
+    var _f = useUtils(), getFileNameFromUrl = _f.getFileNameFromUrl, getFileNameWithoutExtension = _f.getFileNameWithoutExtension, getScrollPosition = _f.getScrollPosition;
+    var refStart = React.useRef(0);
+    var refHasMore = React.useRef(false);
+    var hasSelectedImage = React.useMemo(function () { return selectedImage !== null; }, [selectedImage]);
+    var getMoreResultsSearch = React.useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
+        var results, fields_1, hasMoreResults, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (source === SOURCE_STOCK || source === SOURCE_UPLOAD)
+                        return [2 /*return*/];
+                    if (!refHasMore.current)
+                        return [2 /*return*/];
+                    refStart.current += PAGE_ITEMS;
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, searchImages("(".concat(queryExtensions, ") ").concat(source), refStart.current)];
+                case 2:
+                    results = _a.sent();
+                    fields_1 = results.fields, hasMoreResults = results.hasMoreResults;
+                    refHasMore.current = hasMoreResults;
+                    setSearchResults(function (prev) { return __spreadArray(__spreadArray([], prev, true), fields_1, true); });
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_1 = _a.sent();
+                    console.error("[getMoreResultsSearch] error:", error_1);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); }, [searchImages, source]);
+    React.useEffect(function () {
+        (function () { return __awaiter(void 0, void 0, void 0, function () {
+            var results, fields, hasMoreResults, error_2;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (!context || source === SOURCE_STOCK || source === SOURCE_UPLOAD)
+                            return [2 /*return*/];
+                        setIsLoading(true);
+                        setSelectedImage(null);
+                        refStart.current = 0;
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 3, 4, 5]);
+                        return [4 /*yield*/, searchImages("(".concat(queryExtensions, ") ").concat(source), refStart.current)];
+                    case 2:
+                        results = _a.sent();
+                        fields = results.fields, hasMoreResults = results.hasMoreResults;
+                        refHasMore.current = hasMoreResults;
+                        setSearchResults(fields);
+                        return [3 /*break*/, 5];
+                    case 3:
+                        error_2 = _a.sent();
+                        console.error("[useEffect] error:", error_2);
+                        return [3 /*break*/, 5];
+                    case 4:
+                        setIsLoading(false);
+                        return [7 /*endfinally*/];
+                    case 5: return [2 /*return*/];
+                }
+            });
+        }); })();
+    }, [source, context, searchImages]);
+    var onSelectFile = React.useCallback(function () {
+        if (!refSelectedImage.current)
+            return;
+        var _a = refSelectedImage.current, defaultEncodingURL = _a.defaultEncodingURL, driveId = _a.driveId, id = _a.id, filename = _a.filename, fileType = _a.fileType;
+        var image = driveId
+            ? "".concat(window.location.origin, "/_api/v2.1/sites/").concat(TENANT_NAME, "/drives/").concat(driveId, "/items/").concat(id, "/thumbnails/0/c400x999/content?prefer=noredirect,closestavailablesize,extendCacheMaxAge")
+            : fileType === "svg"
+                ? defaultEncodingURL
+                : defaultImage;
+        var fileResult = {
+            downloadFileContent: function () { return downLoadSpOrOneDriveContent(driveId, id, filename); },
+            fileAbsoluteUrl: defaultEncodingURL,
+            fileName: getFileNameFromUrl(defaultEncodingURL),
+            fileNameWithoutExtension: getFileNameWithoutExtension(defaultEncodingURL),
+            previewDataUrl: image,
+        };
+        onFileSelected(fileResult);
+        onDismiss(true);
+    }, [downLoadSpOrOneDriveContent, onDismiss, onFileSelected, getFileNameFromUrl, getFileNameWithoutExtension]);
+    var renderDialogActions = React.useMemo(function () { return (React.createElement(React.Fragment, null,
+        React.createElement(Button, { disabled: !hasSelectedImage, appearance: "primary", onClick: onSelectFile }, strings.ImagePickderSelectLabel),
+        React.createElement(Button, { onClick: function () { return onDismiss(false); }, disabled: isAdding }, strings.ImagePickerCancelLabel))); }, [hasSelectedImage, onSelectFile, onDismiss, isAdding]);
+    var onSourceSelected = React.useCallback(function (source) {
+        switch (source) {
+            case "sharePoint":
+                setSource(SOURCE_SHAREPOINT);
+                break;
+            case "onDrive":
+                setSource(SOURCE_ONEDRIVE);
+                break;
+            case "stockImage":
+                setSource(SOURCE_STOCK);
+                break;
+            case "upload":
+                setSource(SOURCE_UPLOAD);
+                break;
+        }
+    }, []);
+    var onScroll = React.useCallback(function (ev) { return __awaiter(void 0, void 0, void 0, function () {
+        var scrollPosition;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    scrollPosition = getScrollPosition(ev.target);
+                    if (!(scrollPosition > 98 && !isScrolling.current)) return [3 /*break*/, 2];
+                    isScrolling.current = true;
+                    return [4 /*yield*/, getMoreResultsSearch()];
+                case 1:
+                    _a.sent();
+                    isScrolling.current = false;
+                    _a.label = 2;
+                case 2: return [2 /*return*/];
+            }
+        });
+    }); }, [getMoreResultsSearch, getScrollPosition]);
+    var imageFallback = React.useCallback(function (e) {
+        e.currentTarget.src = defaultImage;
+    }, []);
+    var renderSharepointOrOnDriveImages = React.useCallback(function () { return (React.createElement("div", { className: styles.grid, onScroll: onScroll }, searchResults &&
+        searchResults.map(function (item) {
+            var src = item.fileType === "svg" || !item.driveId
+                ? item.defaultEncodingURL
+                : "".concat(window.location.origin, "/_api/v2.1/sites/").concat(item.siteID, "/drives/").concat(item.driveId, "/items/").concat(item.id, "/thumbnails/0/c400x999/content?prefer=noredirect,closestavailablesize,extendCacheMaxAge}");
+            return (React.createElement(Image, { key: item.id, src: src, alt: item.title, style: { height: "100px" }, fit: "cover", className: mergeClasses(styles.image, selectedImage === item && styles.selectedImage), onClick: function () {
+                    refSelectedImage.current = item;
+                    setSelectedImage(item);
+                }, onError: imageFallback }));
+        }))); }, [searchResults, selectedImage, styles, onScroll]);
+    var renderSelectedImage = React.useCallback(function () {
+        switch (source) {
+            case SOURCE_SHAREPOINT:
+            case SOURCE_ONEDRIVE:
+                return renderSharepointOrOnDriveImages();
+            case SOURCE_STOCK:
+                return (React.createElement(SelectStockImage, { onFileSelected: function (file) {
+                        onFileSelected(file);
+                        onDismiss(true);
+                    }, onCancel: function () { return onDismiss(false); }, context: context }));
+            case SOURCE_UPLOAD:
+                return (React.createElement(UploadImageFiles, { context: context, onSelectedFile: function (file) {
+                        refSelectedImage.current = file;
+                        setSelectedImage(file);
+                    } }));
+        }
+    }, [source, renderSharepointOrOnDriveImages, context, onDismiss, onFileSelected]);
+    if (!isOpen)
+        return null;
+    return (React.createElement(Dialog, { open: isOpen, modalType: "modal" },
+        React.createElement(DialogSurface, { style: { backgroundColor: tokens.colorNeutralBackground2 } },
+            React.createElement(RenderHeader, { title: strings.ImagePickderSelectLabel, description: strings.ImagePickerPanelHeaderText, icon: "guidance:tools", onDismiss: onDismiss }),
+            React.createElement(DialogBody, { style: { gap: 0 } },
+                React.createElement(DialogContent, { style: { marginBottom: 15, minHeight: 500 } },
+                    React.createElement("div", { className: styles.toolbarContainer },
+                        React.createElement(Button, { appearance: source === SOURCE_SHAREPOINT ? "primary" : "secondary", shape: "circular", onClick: function () { return onSourceSelected("sharePoint"); } }, strings.ImagePickerSharePointTabLabel),
+                        React.createElement(Button, { appearance: source === SOURCE_ONEDRIVE ? "primary" : "secondary", shape: "circular", onClick: function () { return onSourceSelected("onDrive"); } }, strings.ImagePickerOneDriveTabLabel),
+                        React.createElement(Button, { appearance: source === SOURCE_STOCK ? "primary" : "secondary", shape: "circular", onClick: function () { return onSourceSelected("stockImage"); } }, strings.ImagePickerStockImagesTabLabel),
+                        React.createElement(Button, { appearance: source === SOURCE_UPLOAD ? "primary" : "secondary", shape: "circular", onClick: function () { return onSourceSelected("upload"); } }, strings.ImagePickerUploadTabLabel)),
+                    isLoading ? React.createElement(Spinner, { style: { paddingTop: 60 } }) : renderSelectedImage()),
+                source !== SOURCE_STOCK && (React.createElement(DialogActions, { fluid: true, position: "end", style: { marginTop: 10 } }, renderDialogActions))))));
+};
+//# sourceMappingURL=selectFromSharePoint.js.map

package/lib/controls/imagePicker/selectFromSharePoint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectFromSharePoint.js","sourceRoot":"","sources":["../../../src/controls/imagePicker/selectFromSharePoint.tsx"],"names":[],"mappings":"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"}

package/lib/controls/imagePicker/uploadFiles/DeleteFile.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+export interface IDeleteFileProps {
+    isWhow: boolean;
+    onDeleteFile: () => void;
+}
+export declare const DeleteFile: React.FunctionComponent<IDeleteFileProps>;
+//# sourceMappingURL=DeleteFile.d.ts.map

package/lib/controls/imagePicker/uploadFiles/DeleteFile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeleteFile.d.ts","sourceRoot":"","sources":["../../../../src/controls/imagePicker/uploadFiles/DeleteFile.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CA6BhE,CAAC"}

package/lib/controls/imagePicker/uploadFiles/DeleteFile.js

@@ -0,0 +1,22 @@
+import * as React from "react";
+import strings from "ControlStrings";
+import { Button, Tooltip, } from "@fluentui/react-components";
+import { bundleIcon, Delete16Filled, Delete16Regular, } from "@fluentui/react-icons";
+import { useUploadFilesStyles } from "./useUploadFilesStyles";
+export var DeleteFile = function (props) {
+    var Delete = bundleIcon(Delete16Filled, Delete16Regular);
+    var styles = useUploadFilesStyles();
+    var isWhow = props.isWhow, onDeleteFile = props.onDeleteFile;
+    if (!isWhow) {
+        return null;
+    }
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Tooltip, { content: strings.ImagePickerDeleteLabel, relationship: "label" },
+            React.createElement("div", { "aria-label": strings.ImagePickerDeleteLabel },
+                React.createElement(Button, { icon: React.createElement(Delete, { className: styles.deleteStyle }), size: "small", appearance: "transparent", onClick: function (e) {
+                        e.preventDefault();
+                        e.stopPropagation();
+                        onDeleteFile();
+                    } })))));
+};
+//# sourceMappingURL=DeleteFile.js.map

package/lib/controls/imagePicker/uploadFiles/DeleteFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeleteFile.js","sourceRoot":"","sources":["../../../../src/controls/imagePicker/uploadFiles/DeleteFile.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,OAAO,MAAM,gBAAgB,CAAC;AAErC,OAAO,EACL,MAAM,EACN,OAAO,GACR,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,UAAU,EACV,cAAc,EACd,eAAe,GAChB,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAO9D,MAAM,CAAC,IAAM,UAAU,GAA8C,UAEnE,KAAgD;IAEhD,IAAM,MAAM,GAAG,UAAU,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;IAC3D,IAAM,MAAM,GAAG,oBAAoB,EAAE,CAAC;IAC9B,IAAA,MAAM,GAAmB,KAAK,OAAxB,EAAG,YAAY,GAAI,KAAK,aAAT,CAAU;IACvC,IAAI,CAAC,MAAM,EAAE;QACX,OAAO,IAAI,CAAC;KACb;IACD,OAAO,CACL;QACE,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO,CAAC,sBAAsB,EAAE,YAAY,EAAE,OAAO;YACrE,2CAAiB,OAAO,CAAC,sBAAsB;gBAC7C,oBAAC,MAAM,IACL,IAAI,EAAE,oBAAC,MAAM,IAAC,SAAS,EAAE,MAAM,CAAC,WAAW,GAAI,EAC/C,IAAI,EAAC,OAAO,EACZ,UAAU,EAAC,aAAa,EACxB,OAAO,EAAE,UAAC,CAAC;wBACT,CAAC,CAAC,cAAc,EAAE,CAAC;wBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;wBACpB,YAAY,EAAE,CAAC;oBACjB,CAAC,GACD,CAEE,CACE,CACT,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/imagePicker/uploadFiles/FileError.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+export interface IFileErrorProps {
+    error: string;
+    isShow: boolean;
+}
+export declare const FileError: React.FunctionComponent<IFileErrorProps>;
+//# sourceMappingURL=FileError.d.ts.map

package/lib/controls/imagePicker/uploadFiles/FileError.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileError.d.ts","sourceRoot":"","sources":["../../../../src/controls/imagePicker/uploadFiles/FileError.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;CACjB;AAuBD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,iBAAiB,CAAC,eAAe,CAiB9D,CAAC"}

package/lib/controls/imagePicker/uploadFiles/FileError.js

@@ -0,0 +1,38 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import * as React from "react";
+import { Caption1Strong, makeStyles, shorthands, tokens, } from "@fluentui/react-components";
+import { ErrorCircleRegular } from "@fluentui/react-icons";
+var useStyles = makeStyles({
+    root: __assign(__assign({ display: "flex", flexDirection: "row", alignItems: "center", justifyContent: "start" }, shorthands.gap("5px")), { paddingTop: "10px" }),
+    iconErrorStyle: {
+        width: "18px",
+        height: "18px",
+        color: tokens.colorStatusWarningForeground1,
+    },
+    errorTextStyles: {
+        color: tokens.colorStatusWarningForeground1,
+        paddingLeft: "5px",
+    },
+});
+export var FileError = function (props) {
+    var isShow = props.isShow, error = props.error;
+    if (!isShow) {
+        return null;
+    }
+    var styles = useStyles();
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: styles.root },
+            React.createElement(ErrorCircleRegular, { className: styles.iconErrorStyle }),
+            React.createElement(Caption1Strong, { className: styles.errorTextStyles }, error))));
+};
+//# sourceMappingURL=FileError.js.map

package/lib/controls/imagePicker/uploadFiles/FileError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileError.js","sourceRoot":"","sources":["../../../../src/controls/imagePicker/uploadFiles/FileError.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EACd,UAAU,EACV,UAAU,EACV,MAAM,GACP,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAO3D,IAAM,SAAS,GAAG,UAAU,CAAC;IAC3B,IAAI,sBACF,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,KAAK,EACpB,UAAU,EAAE,QAAQ,EACpB,cAAc,EAAE,OAAO,IACpB,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC,KACxB,UAAU,EAAE,MAAM,GACnB;IACD,cAAc,EAAE;QACd,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,KAAK,EAAE,MAAM,CAAC,6BAA6B;KAC5C;IAED,eAAe,EAAE;QACf,KAAK,EAAE,MAAM,CAAC,6BAA6B;QAC3C,WAAW,EAAE,KAAK;KACnB;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,SAAS,GAA6C,UACjE,KAA+C;IAEvC,IAAA,MAAM,GAAY,KAAK,OAAjB,EAAG,KAAK,GAAI,KAAK,MAAT,CAAU;IAChC,IAAI,CAAC,MAAM,EAAE;QACX,OAAO,IAAI,CAAC;KACb;IACD,IAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAE3B,OAAO,CACL;QACE,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI;YACzB,oBAAC,kBAAkB,IAAC,SAAS,EAAE,MAAM,CAAC,cAAc,GAAI;YACxD,oBAAC,cAAc,IAAC,SAAS,EAAE,MAAM,CAAC,eAAe,IAAG,KAAK,CAAkB,CACvE,CACL,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/imagePicker/uploadFiles/FileProgress.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+export interface IFileProgressProps {
+    percentageCompleted: number;
+    isShow: boolean;
+}
+export declare const FileProgress: React.FunctionComponent<IFileProgressProps>;
+//# sourceMappingURL=FileProgress.d.ts.map

package/lib/controls/imagePicker/uploadFiles/FileProgress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileProgress.d.ts","sourceRoot":"","sources":["../../../../src/controls/imagePicker/uploadFiles/FileProgress.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,MAAM,WAAW,kBAAkB;IACjC,mBAAmB,EAAE,MAAM,CAAC;IAC5B,MAAM,EAAE,OAAO,CAAC;CACjB;AAWD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC,kBAAkB,CAoBpE,CAAC"}

package/lib/controls/imagePicker/uploadFiles/FileProgress.js

@@ -0,0 +1,32 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import * as React from "react";
+import { Caption1, makeStyles, ProgressBar, shorthands, } from "@fluentui/react-components";
+var useStyles = makeStyles({
+    root: __assign(__assign({ paddingTop: "15px", display: "flex" }, shorthands.gap("5px")), { alignItems: "center" }),
+});
+export var FileProgress = function (props) {
+    var percentageCompleted = props.percentageCompleted, isShow = props.isShow;
+    var percentage = percentageCompleted * 100;
+    var styles = useStyles();
+    if (!isShow) {
+        return null;
+    }
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: styles.root },
+            React.createElement(ProgressBar, { thickness: "medium", max: 100, value: percentage }),
+            React.createElement(Caption1, null,
+                " ",
+                percentage.toFixed(0),
+                "%"))));
+};
+//# sourceMappingURL=FileProgress.js.map

package/lib/controls/imagePicker/uploadFiles/FileProgress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileProgress.js","sourceRoot":"","sources":["../../../../src/controls/imagePicker/uploadFiles/FileProgress.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,QAAQ,EACR,UAAU,EACV,WAAW,EACX,UAAU,GACX,MAAM,4BAA4B,CAAC;AAOpC,IAAM,SAAS,GAAG,UAAU,CAAC;IAC3B,IAAI,sBACF,UAAU,EAAE,MAAM,EAClB,OAAO,EAAE,MAAM,IACZ,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC,KACxB,UAAU,EAAE,QAAQ,GACrB;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,YAAY,GAAgD,UACvE,KAAkD;IAE1C,IAAA,mBAAmB,GAAa,KAAK,oBAAlB,EAAE,MAAM,GAAK,KAAK,OAAV,CAAW;IAE9C,IAAM,UAAU,GAAG,mBAAmB,GAAG,GAAG,CAAC;IAE7C,IAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAE3B,IAAI,CAAC,MAAM,EAAE;QACX,OAAO,IAAI,CAAC;KACb;IACD,OAAO,CACL;QACE,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI;YACzB,oBAAC,WAAW,IAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,UAAU,GAAI;YAC/D,oBAAC,QAAQ;;gBAAG,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC;oBAAa,CAC1C,CACL,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/imagePicker/uploadFiles/RetryUpload.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+export interface IRetryUplaodProps {
+    isShow: boolean;
+    onRetry: () => void;
+}
+export declare const RetryUpload: React.FunctionComponent<IRetryUplaodProps>;
+//# sourceMappingURL=RetryUpload.d.ts.map

package/lib/controls/imagePicker/uploadFiles/RetryUpload.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RetryUpload.d.ts","sourceRoot":"","sources":["../../../../src/controls/imagePicker/uploadFiles/RetryUpload.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CA6BlE,CAAC"}