glints-aries 4.0.260 → 4.0.261

package/es/@next/Upload/Upload.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface UploadProps {
+    file: File | null;
+    handleSetFile: (file: File | null) => void;
+    loading?: boolean;
+    objectFit?: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down';
+    uploadMessage?: React.ReactNode;
+    loadingMessage?: React.ReactNode;
+}
+export declare const Upload: React.ForwardRefExoticComponent<UploadProps & React.RefAttributes<HTMLInputElement>>;

package/es/@next/Upload/Upload.js

@@ -0,0 +1,109 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["file", "handleSetFile", "loading", "objectFit", "uploadMessage", "loadingMessage"];
+import React, { useEffect, useRef, useState } from 'react';
+import { Icon } from '../Icon';
+import { StyledInvisibleInput, StyledUploadContainer, StyledTextContainer, StyledIconContainer, StyledUploadedImage, StyledDeleteButtonContainer, StyledDeleteIconContainer, StyledErrorContainer, StyledErrorIconContainer, StyledErrorTextContainer } from './UploadStyle';
+import { Spinner } from '../Spinner';
+import { Typography } from '../Typography';
+export var Upload = /*#__PURE__*/React.forwardRef(function Upload(_ref, ref) {
+  var file = _ref.file,
+    handleSetFile = _ref.handleSetFile,
+    _ref$loading = _ref.loading,
+    loading = _ref$loading === void 0 ? false : _ref$loading,
+    _ref$objectFit = _ref.objectFit,
+    objectFit = _ref$objectFit === void 0 ? 'cover' : _ref$objectFit,
+    _ref$uploadMessage = _ref.uploadMessage,
+    uploadMessage = _ref$uploadMessage === void 0 ? 'Upload' : _ref$uploadMessage,
+    _ref$loadingMessage = _ref.loadingMessage,
+    loadingMessage = _ref$loadingMessage === void 0 ? 'loading...' : _ref$loadingMessage,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var MAX_FILE_SIZE = 5; // in MB
+
+  var _useState = useState(''),
+    attachmentUrl = _useState[0],
+    setAttachmentUrl = _useState[1];
+  var _useState2 = useState(loading),
+    isLoading = _useState2[0],
+    setIsLoading = _useState2[1];
+  var _useState3 = useState(''),
+    error = _useState3[0],
+    setError = _useState3[1];
+  var fileInputRef = useRef(null);
+  useEffect(function () {
+    var reader = new FileReader();
+    reader.onloadend = function () {
+      setAttachmentUrl(reader.result);
+      setIsLoading(false);
+    };
+    if (file) reader.readAsDataURL(file);
+  }, [file]);
+  var handleClick = function handleClick() {
+    if (fileInputRef.current) {
+      fileInputRef.current.click();
+    }
+  };
+  var handleChange = function handleChange(event) {
+    var _event$target$files;
+    setIsLoading(true);
+    var newFile = (_event$target$files = event.target.files) == null ? void 0 : _event$target$files[0];
+    if (newFile && !newFile.type.startsWith('image')) {
+      setError('Image required');
+      handleSetFile(null);
+      setIsLoading(false);
+    } else if (newFile && newFile.size > MAX_FILE_SIZE * 1024 * 1024) {
+      setError('File too big');
+      handleSetFile(null);
+      setIsLoading(false);
+    } else {
+      setError('');
+      handleSetFile(newFile);
+    }
+  };
+  var handleDelete = function handleDelete() {
+    setAttachmentUrl('');
+    handleSetFile(null);
+  };
+  var unuploadedComponent = /*#__PURE__*/React.createElement(StyledUploadContainer, {
+    onClick: handleClick,
+    "data-type": "initial",
+    "data-error": !!error,
+    "data-testid": "upload-container"
+  }, /*#__PURE__*/React.createElement(StyledIconContainer, null, /*#__PURE__*/React.createElement(Icon, {
+    name: "ri-add"
+  })), /*#__PURE__*/React.createElement(StyledTextContainer, null, /*#__PURE__*/React.createElement(Typography, {
+    as: "span",
+    variant: "button"
+  }, uploadMessage)));
+  var loadingComponent = /*#__PURE__*/React.createElement(StyledUploadContainer, {
+    "data-type": "loading"
+  }, /*#__PURE__*/React.createElement(StyledIconContainer, {
+    "data-type": "loading"
+  }, /*#__PURE__*/React.createElement(Spinner, null)), /*#__PURE__*/React.createElement(StyledTextContainer, null, /*#__PURE__*/React.createElement(Typography, {
+    as: "span",
+    variant: "overline"
+  }, loadingMessage)));
+  var errorComponent = /*#__PURE__*/React.createElement(StyledErrorContainer, null, /*#__PURE__*/React.createElement(StyledErrorIconContainer, null, /*#__PURE__*/React.createElement(Icon, {
+    name: "ri-error-warning-fill"
+  })), /*#__PURE__*/React.createElement(StyledErrorTextContainer, null, /*#__PURE__*/React.createElement(Typography, {
+    as: "span",
+    variant: "subtitle2"
+  }, error)));
+  var uploadedImageComponent = /*#__PURE__*/React.createElement(StyledUploadedImage, {
+    src: attachmentUrl,
+    objectFit: objectFit
+  });
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledInvisibleInput, _extends({
+    type: "file",
+    accept: "image/*",
+    onChange: handleChange,
+    ref: ref || fileInputRef
+  }, props)), attachmentUrl && !isLoading ? /*#__PURE__*/React.createElement(StyledUploadContainer, {
+    "data-type": "image",
+    "data-testid": "upload-container"
+  }, uploadedImageComponent, /*#__PURE__*/React.createElement(StyledDeleteButtonContainer, {
+    onClick: handleDelete
+  }, /*#__PURE__*/React.createElement(StyledDeleteIconContainer, null, /*#__PURE__*/React.createElement(Icon, {
+    name: "ri-delete-bin-line"
+  })))) : /*#__PURE__*/React.createElement(React.Fragment, null, isLoading ? /*#__PURE__*/React.createElement(React.Fragment, null, loadingComponent) : /*#__PURE__*/React.createElement(React.Fragment, null, unuploadedComponent), !!error && /*#__PURE__*/React.createElement(React.Fragment, null, errorComponent)));
+});

package/es/@next/Upload/Upload.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Interactive: any;

package/es/@next/Upload/UploadStyle.d.ts

@@ -0,0 +1,12 @@
+export declare const StyledInvisibleInput: import("styled-components").StyledComponent<"input", any, {}, never>;
+export declare const StyledUploadContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledUploadedImage: import("styled-components").StyledComponent<"img", any, {
+    objectFit: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down';
+}, never>;
+export declare const StyledDeleteButtonContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledDeleteIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledErrorContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledErrorIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledErrorTextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/@next/Upload/UploadStyle.js

@@ -0,0 +1,45 @@
+import styled from 'styled-components';
+import * as Breakpoints from '../utilities/breakpoints';
+import { Blue, Neutral, Red } from '../utilities/colors';
+export var StyledInvisibleInput = styled.input.withConfig({
+  displayName: "UploadStyle__StyledInvisibleInput",
+  componentId: "sc-vgra38-0"
+})(["display:none;"]);
+export var StyledUploadContainer = styled.div.withConfig({
+  displayName: "UploadStyle__StyledUploadContainer",
+  componentId: "sc-vgra38-1"
+})(["position:relative;width:80px;height:80px;background-color:", ";border:1px dashed ", ";border-radius:2px;:hover{background-color:", ";}&[data-type='initial']{cursor:pointer;}&[data-type='image']{border:none;}&[data-type='loading']{background-color:", ";}&[data-error='true']{border:1px dashed ", ";}"], Neutral.B99, Neutral.B68, Neutral.B95, Neutral.B95, Red.B93);
+export var StyledTextContainer = styled.div.withConfig({
+  displayName: "UploadStyle__StyledTextContainer",
+  componentId: "sc-vgra38-2"
+})(["position:absolute;top:46.5px;left:50%;transform:translateX(-50%);color:", ";"], Neutral.B18);
+export var StyledIconContainer = styled.div.withConfig({
+  displayName: "UploadStyle__StyledIconContainer",
+  componentId: "sc-vgra38-3"
+})(["position:absolute;top:12.5px;left:50%;transform:translateX(-50%);cursor:pointer;svg{fill:", ";color:", ";height:24px;width:24px;}&[data-type='loading']{top:17.5px;svg{fill:", ";height:18px;width:18px;}}"], Neutral.B40, Neutral.B40, Blue.S99);
+export var StyledUploadedImage = styled.img.withConfig({
+  displayName: "UploadStyle__StyledUploadedImage",
+  componentId: "sc-vgra38-4"
+})(["position:absolute;height:80px;width:80px;z-index:1;border:1px solid ", ";border-radius:2px;object-fit:", ";"], Neutral.B68, function (props) {
+  return props.objectFit;
+});
+export var StyledDeleteButtonContainer = styled.div.withConfig({
+  displayName: "UploadStyle__StyledDeleteButtonContainer",
+  componentId: "sc-vgra38-5"
+})(["position:absolute;height:24px;width:24px;left:4px;bottom:4px;cursor:pointer;z-index:3;@media (max-width:", "){height:32px;width:32px;left:0px;bottom:0px;}"], Breakpoints.large);
+export var StyledDeleteIconContainer = styled.div.withConfig({
+  displayName: "UploadStyle__StyledDeleteIconContainer",
+  componentId: "sc-vgra38-6"
+})(["position:absolute;height:24px;width:24px;left:0px;bottom:0px;background-color:", ";border:1px solid ", ";border-radius:50%;z-index:2;display:flex;justify-content:center;align-items:center;svg{height:16px;width:16px;fill:", ";}@media (max-width:", "){left:4px;bottom:4px;}"], Neutral.B100, Neutral.B68, Neutral.B40, Breakpoints.large);
+export var StyledErrorContainer = styled.div.withConfig({
+  displayName: "UploadStyle__StyledErrorContainer",
+  componentId: "sc-vgra38-7"
+})(["position:relative;"]);
+export var StyledErrorIconContainer = styled.div.withConfig({
+  displayName: "UploadStyle__StyledErrorIconContainer",
+  componentId: "sc-vgra38-8"
+})(["position:absolute;top:4px;svg{fill:", ";height:20px;width:20px;}"], Red.B93);
+export var StyledErrorTextContainer = styled.div.withConfig({
+  displayName: "UploadStyle__StyledErrorTextContainer",
+  componentId: "sc-vgra38-9"
+})(["position:absolute;top:4px;left:24px;color:", ";"], Red.B93);

package/es/@next/Upload/index.d.ts

@@ -0,0 +1 @@
+export * from './Upload';

package/es/@next/Upload/index.js

@@ -0,0 +1 @@
+export * from './Upload';

package/es/@next/index.d.ts

@@ -39,6 +39,7 @@ export { TextArea, TextAreaProps } from './TextArea';
 export { TextInput, TextInputProps } from './TextInput';
 export { Tooltip, TooltipPosition, TooltipProps } from './Tooltip';
 export { Typography, TypographyProps } from './Typography';
+export { Upload, UploadProps } from './Upload';
 export { Breakpoints, BorderRadius, Colors, DropShadow, Fonts, Spacing };
 export { Switch } from './Switch';
 export { InlineError, InlineErrorProps } from './InlineError';

package/es/@next/index.js

@@ -40,6 +40,7 @@ export { TextArea, TextAreaProps } from './TextArea';
 export { TextInput, TextInputProps } from './TextInput';
 export { Tooltip, TooltipPosition, TooltipProps } from './Tooltip';
 export { Typography, TypographyProps } from './Typography';
+export { Upload, UploadProps } from './Upload';
 export { Breakpoints, BorderRadius, Colors, DropShadow, Fonts, Spacing };
 export { Switch } from './Switch';
 export { InlineError, InlineErrorProps } from './InlineError';

package/lib/@next/Upload/Upload.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface UploadProps {
+    file: File | null;
+    handleSetFile: (file: File | null) => void;
+    loading?: boolean;
+    objectFit?: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down';
+    uploadMessage?: React.ReactNode;
+    loadingMessage?: React.ReactNode;
+}
+export declare const Upload: React.ForwardRefExoticComponent<UploadProps & React.RefAttributes<HTMLInputElement>>;

package/lib/@next/Upload/Upload.js

@@ -0,0 +1,117 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.Upload = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _react = _interopRequireWildcard(require("react"));
+var _Icon = require("../Icon");
+var _UploadStyle = require("./UploadStyle");
+var _Spinner = require("../Spinner");
+var _Typography = require("../Typography");
+var _excluded = ["file", "handleSetFile", "loading", "objectFit", "uploadMessage", "loadingMessage"];
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var Upload = /*#__PURE__*/_react["default"].forwardRef(function Upload(_ref, ref) {
+  var file = _ref.file,
+    handleSetFile = _ref.handleSetFile,
+    _ref$loading = _ref.loading,
+    loading = _ref$loading === void 0 ? false : _ref$loading,
+    _ref$objectFit = _ref.objectFit,
+    objectFit = _ref$objectFit === void 0 ? 'cover' : _ref$objectFit,
+    _ref$uploadMessage = _ref.uploadMessage,
+    uploadMessage = _ref$uploadMessage === void 0 ? 'Upload' : _ref$uploadMessage,
+    _ref$loadingMessage = _ref.loadingMessage,
+    loadingMessage = _ref$loadingMessage === void 0 ? 'loading...' : _ref$loadingMessage,
+    props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, _excluded);
+  var MAX_FILE_SIZE = 5; // in MB
+
+  var _useState = (0, _react.useState)(''),
+    attachmentUrl = _useState[0],
+    setAttachmentUrl = _useState[1];
+  var _useState2 = (0, _react.useState)(loading),
+    isLoading = _useState2[0],
+    setIsLoading = _useState2[1];
+  var _useState3 = (0, _react.useState)(''),
+    error = _useState3[0],
+    setError = _useState3[1];
+  var fileInputRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    var reader = new FileReader();
+    reader.onloadend = function () {
+      setAttachmentUrl(reader.result);
+      setIsLoading(false);
+    };
+    if (file) reader.readAsDataURL(file);
+  }, [file]);
+  var handleClick = function handleClick() {
+    if (fileInputRef.current) {
+      fileInputRef.current.click();
+    }
+  };
+  var handleChange = function handleChange(event) {
+    var _event$target$files;
+    setIsLoading(true);
+    var newFile = (_event$target$files = event.target.files) == null ? void 0 : _event$target$files[0];
+    if (newFile && !newFile.type.startsWith('image')) {
+      setError('Image required');
+      handleSetFile(null);
+      setIsLoading(false);
+    } else if (newFile && newFile.size > MAX_FILE_SIZE * 1024 * 1024) {
+      setError('File too big');
+      handleSetFile(null);
+      setIsLoading(false);
+    } else {
+      setError('');
+      handleSetFile(newFile);
+    }
+  };
+  var handleDelete = function handleDelete() {
+    setAttachmentUrl('');
+    handleSetFile(null);
+  };
+  var unuploadedComponent = /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledUploadContainer, {
+    onClick: handleClick,
+    "data-type": "initial",
+    "data-error": !!error,
+    "data-testid": "upload-container"
+  }, /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledIconContainer, null, /*#__PURE__*/_react["default"].createElement(_Icon.Icon, {
+    name: "ri-add"
+  })), /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledTextContainer, null, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
+    as: "span",
+    variant: "button"
+  }, uploadMessage)));
+  var loadingComponent = /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledUploadContainer, {
+    "data-type": "loading"
+  }, /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledIconContainer, {
+    "data-type": "loading"
+  }, /*#__PURE__*/_react["default"].createElement(_Spinner.Spinner, null)), /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledTextContainer, null, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
+    as: "span",
+    variant: "overline"
+  }, loadingMessage)));
+  var errorComponent = /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledErrorContainer, null, /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledErrorIconContainer, null, /*#__PURE__*/_react["default"].createElement(_Icon.Icon, {
+    name: "ri-error-warning-fill"
+  })), /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledErrorTextContainer, null, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
+    as: "span",
+    variant: "subtitle2"
+  }, error)));
+  var uploadedImageComponent = /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledUploadedImage, {
+    src: attachmentUrl,
+    objectFit: objectFit
+  });
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledInvisibleInput, (0, _extends2["default"])({
+    type: "file",
+    accept: "image/*",
+    onChange: handleChange,
+    ref: ref || fileInputRef
+  }, props)), attachmentUrl && !isLoading ? /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledUploadContainer, {
+    "data-type": "image",
+    "data-testid": "upload-container"
+  }, uploadedImageComponent, /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledDeleteButtonContainer, {
+    onClick: handleDelete
+  }, /*#__PURE__*/_react["default"].createElement(_UploadStyle.StyledDeleteIconContainer, null, /*#__PURE__*/_react["default"].createElement(_Icon.Icon, {
+    name: "ri-delete-bin-line"
+  })))) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isLoading ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, loadingComponent) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, unuploadedComponent), !!error && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, errorComponent)));
+});
+exports.Upload = Upload;

package/lib/@next/Upload/Upload.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Interactive: any;

package/lib/@next/Upload/UploadStyle.d.ts

@@ -0,0 +1,12 @@
+export declare const StyledInvisibleInput: import("styled-components").StyledComponent<"input", any, {}, never>;
+export declare const StyledUploadContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledTextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledUploadedImage: import("styled-components").StyledComponent<"img", any, {
+    objectFit: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down';
+}, never>;
+export declare const StyledDeleteButtonContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledDeleteIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledErrorContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledErrorIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledErrorTextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/lib/@next/Upload/UploadStyle.js

@@ -0,0 +1,62 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.StyledUploadedImage = exports.StyledUploadContainer = exports.StyledTextContainer = exports.StyledInvisibleInput = exports.StyledIconContainer = exports.StyledErrorTextContainer = exports.StyledErrorIconContainer = exports.StyledErrorContainer = exports.StyledDeleteIconContainer = exports.StyledDeleteButtonContainer = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var Breakpoints = _interopRequireWildcard(require("../utilities/breakpoints"));
+var _colors = require("../utilities/colors");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var StyledInvisibleInput = _styledComponents["default"].input.withConfig({
+  displayName: "UploadStyle__StyledInvisibleInput",
+  componentId: "sc-vgra38-0"
+})(["display:none;"]);
+exports.StyledInvisibleInput = StyledInvisibleInput;
+var StyledUploadContainer = _styledComponents["default"].div.withConfig({
+  displayName: "UploadStyle__StyledUploadContainer",
+  componentId: "sc-vgra38-1"
+})(["position:relative;width:80px;height:80px;background-color:", ";border:1px dashed ", ";border-radius:2px;:hover{background-color:", ";}&[data-type='initial']{cursor:pointer;}&[data-type='image']{border:none;}&[data-type='loading']{background-color:", ";}&[data-error='true']{border:1px dashed ", ";}"], _colors.Neutral.B99, _colors.Neutral.B68, _colors.Neutral.B95, _colors.Neutral.B95, _colors.Red.B93);
+exports.StyledUploadContainer = StyledUploadContainer;
+var StyledTextContainer = _styledComponents["default"].div.withConfig({
+  displayName: "UploadStyle__StyledTextContainer",
+  componentId: "sc-vgra38-2"
+})(["position:absolute;top:46.5px;left:50%;transform:translateX(-50%);color:", ";"], _colors.Neutral.B18);
+exports.StyledTextContainer = StyledTextContainer;
+var StyledIconContainer = _styledComponents["default"].div.withConfig({
+  displayName: "UploadStyle__StyledIconContainer",
+  componentId: "sc-vgra38-3"
+})(["position:absolute;top:12.5px;left:50%;transform:translateX(-50%);cursor:pointer;svg{fill:", ";color:", ";height:24px;width:24px;}&[data-type='loading']{top:17.5px;svg{fill:", ";height:18px;width:18px;}}"], _colors.Neutral.B40, _colors.Neutral.B40, _colors.Blue.S99);
+exports.StyledIconContainer = StyledIconContainer;
+var StyledUploadedImage = _styledComponents["default"].img.withConfig({
+  displayName: "UploadStyle__StyledUploadedImage",
+  componentId: "sc-vgra38-4"
+})(["position:absolute;height:80px;width:80px;z-index:1;border:1px solid ", ";border-radius:2px;object-fit:", ";"], _colors.Neutral.B68, function (props) {
+  return props.objectFit;
+});
+exports.StyledUploadedImage = StyledUploadedImage;
+var StyledDeleteButtonContainer = _styledComponents["default"].div.withConfig({
+  displayName: "UploadStyle__StyledDeleteButtonContainer",
+  componentId: "sc-vgra38-5"
+})(["position:absolute;height:24px;width:24px;left:4px;bottom:4px;cursor:pointer;z-index:3;@media (max-width:", "){height:32px;width:32px;left:0px;bottom:0px;}"], Breakpoints.large);
+exports.StyledDeleteButtonContainer = StyledDeleteButtonContainer;
+var StyledDeleteIconContainer = _styledComponents["default"].div.withConfig({
+  displayName: "UploadStyle__StyledDeleteIconContainer",
+  componentId: "sc-vgra38-6"
+})(["position:absolute;height:24px;width:24px;left:0px;bottom:0px;background-color:", ";border:1px solid ", ";border-radius:50%;z-index:2;display:flex;justify-content:center;align-items:center;svg{height:16px;width:16px;fill:", ";}@media (max-width:", "){left:4px;bottom:4px;}"], _colors.Neutral.B100, _colors.Neutral.B68, _colors.Neutral.B40, Breakpoints.large);
+exports.StyledDeleteIconContainer = StyledDeleteIconContainer;
+var StyledErrorContainer = _styledComponents["default"].div.withConfig({
+  displayName: "UploadStyle__StyledErrorContainer",
+  componentId: "sc-vgra38-7"
+})(["position:relative;"]);
+exports.StyledErrorContainer = StyledErrorContainer;
+var StyledErrorIconContainer = _styledComponents["default"].div.withConfig({
+  displayName: "UploadStyle__StyledErrorIconContainer",
+  componentId: "sc-vgra38-8"
+})(["position:absolute;top:4px;svg{fill:", ";height:20px;width:20px;}"], _colors.Red.B93);
+exports.StyledErrorIconContainer = StyledErrorIconContainer;
+var StyledErrorTextContainer = _styledComponents["default"].div.withConfig({
+  displayName: "UploadStyle__StyledErrorTextContainer",
+  componentId: "sc-vgra38-9"
+})(["position:absolute;top:4px;left:24px;color:", ";"], _colors.Red.B93);
+exports.StyledErrorTextContainer = StyledErrorTextContainer;

package/lib/@next/Upload/index.d.ts

@@ -0,0 +1 @@
+export * from './Upload';

package/lib/@next/Upload/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+exports.__esModule = true;
+var _Upload = require("./Upload");
+Object.keys(_Upload).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Upload[key]) return;
+  exports[key] = _Upload[key];
+});

package/lib/@next/index.d.ts

@@ -39,6 +39,7 @@ export { TextArea, TextAreaProps } from './TextArea';
 export { TextInput, TextInputProps } from './TextInput';
 export { Tooltip, TooltipPosition, TooltipProps } from './Tooltip';
 export { Typography, TypographyProps } from './Typography';
+export { Upload, UploadProps } from './Upload';
 export { Breakpoints, BorderRadius, Colors, DropShadow, Fonts, Spacing };
 export { Switch } from './Switch';
 export { InlineError, InlineErrorProps } from './InlineError';

package/lib/@next/index.js

@@ -2,7 +2,7 @@
 
 exports.__esModule = true;
 exports.Typography = exports.TooltipProps = exports.TooltipPosition = exports.Tooltip = exports.TextInputProps = exports.TextInput = exports.TextAreaProps = exports.TextArea = exports.TagProps = exports.Tag = exports.TabsProps = exports.Tabs = exports.TableRowProps = exports.TableHeaderProps = exports.TableCellProps = exports.TabProps = exports.TabModel = exports.Tab = exports.Switch = exports.SpinnerProps = exports.Spinner = exports.Spacing = exports.SkeletonTextProps = exports.SkeletonText = exports.SkeletonImageSquareProps = exports.SkeletonImageSquare = exports.SkeletonImageCircleProps = exports.SkeletonImageCircle = exports.SimplePagination = exports.SideSheetProps = exports.SideSheet = exports.SelectProps = exports.Select = exports.RadioButtonProps = exports.RadioButton = exports.PrimaryButton = exports.PopoverProps = exports.Popover = exports.PaginationProps = exports.Pagination = exports.OutlineMonochromeButton = exports.OutlineButton = exports.NumberInputProps = exports.NumberInput = exports.ModalProvider = exports.ModalProps = exports.ModalContext = exports.Modal = exports.MenuProps = exports.Menu = exports.LinkProps = exports.Link = exports.InlineErrorProps = exports.InlineError = exports.IndexTableProps = exports.IndexTable = exports.IconProps = exports.Icon = exports.Fonts = exports.EmptyState = exports.DropShadow = exports.Divider = exports.DestructiveButton = exports.DataTableProps = exports.DataTable = exports.CurrencyInputProps = exports.CurrencyInput = exports.ComboboxProps = exports.Combobox = exports.Colors = exports.CheckboxProps = exports.Checkbox = exports.CarouselProps = exports.Carousel = exports.CardProps = exports.Card = exports.ButtonProps = exports.ButtonGroupProps = exports.ButtonGroup = exports.Button = exports.Breakpoints = exports.BorderRadius = exports.BarProps = exports.Bar = exports.BannerProps = exports.Banner = exports.BadgeProps = exports.Badge = exports.AvatarProps = exports.Avatar = exports.AlertWithProvider = exports.AlertProvider = exports.AlertProps = exports.AlertContextProps = exports.AlertContext = exports.Alert = exports.ActionListSection = exports.ActionListProps = exports.ActionListItem = exports.ActionList = void 0;
-exports.useModal = exports.useIndexResourceState = exports.useAlert = exports.TypographyProps = void 0;
+exports.useModal = exports.useIndexResourceState = exports.useAlert = exports.UploadProps = exports.Upload = exports.TypographyProps = void 0;
 var BorderRadius = _interopRequireWildcard(require("./utilities/borderRadius"));
 exports.BorderRadius = BorderRadius;
 var Breakpoints = _interopRequireWildcard(require("./utilities/breakpoints"));
@@ -145,6 +145,9 @@ exports.TooltipProps = _Tooltip.TooltipProps;
 var _Typography = require("./Typography");
 exports.Typography = _Typography.Typography;
 exports.TypographyProps = _Typography.TypographyProps;
+var _Upload = require("./Upload");
+exports.Upload = _Upload.Upload;
+exports.UploadProps = _Upload.UploadProps;
 var _Switch = require("./Switch");
 exports.Switch = _Switch.Switch;
 var _InlineError = require("./InlineError");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "glints-aries",
-  "version": "4.0.260",
+  "version": "4.0.261",
   "description": "Glints ui-kit for frontend",
   "main": "./lib/index.js",
   "module": "./es/index.js",