@sendoutcards/quantum-design-ui 1.7.84 → 1.7.86

package/dist/index.es.js

@@ -11659,6 +11659,28 @@ var Swap = function (_a) {
   }));
 };
 
+var Warning = function (_a) {
+  var primaryColor = _a.primaryColor,
+      onClick = _a.onClick,
+      size = _a.size,
+      entity = _a.entity;
+  return jsx("svg", {
+    onClick: onClick && function () {
+      return onClick();
+    },
+    width: getIconSize(size, entity),
+    height: getIconSize(size, entity),
+    fill: "none",
+    stroke: getIconColor(primaryColor, entity),
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, jsx("path", {
+    d: "M13.0718 4.24418C12.5863 3.43501 11.4136 3.43501 10.9281 4.24418L2.46046 18.3569C1.96056 19.19 2.56071 20.25 3.53232 20.25H20.4676C21.4392 20.25 22.0393 19.19 21.5394 18.3569L13.0718 4.24418ZM9.64184 3.47243C10.7099 1.69225 13.2899 1.69226 14.358 3.47244L22.8257 17.5851C23.9254 19.4181 22.6051 21.75 20.4676 21.75H3.53232C1.39476 21.75 0.0744533 19.4181 1.17422 17.5851L9.64184 3.47243ZM11.9999 8.25C12.4142 8.25 12.7499 8.58578 12.7499 9V13C12.7499 13.4142 12.4142 13.75 11.9999 13.75C11.5857 13.75 11.2499 13.4142 11.2499 13V9C11.2499 8.58578 11.5857 8.25 11.9999 8.25ZM11.9999 15.25C12.4142 15.25 12.7499 15.5858 12.7499 16V17C12.7499 17.4142 12.4142 17.75 11.9999 17.75C11.5857 17.75 11.2499 17.4142 11.2499 17V16C11.2499 15.5858 11.5857 15.25 11.9999 15.25Z",
+    fill: getIconColor(primaryColor, entity),
+    fillRule: "evenodd"
+  }));
+};
+
 var Icon = function (_a) {
   var primaryColor = _a.primaryColor,
       secondaryColor = _a.secondaryColor,
@@ -12059,6 +12081,9 @@ var Icon = function (_a) {
 
     case 'swap':
       return jsx(Swap, props);
+
+    case 'warning':
+      return jsx(Warning, props);
   }
 };
 
@@ -22767,10 +22792,12 @@ var isDragEventType = function (event) {
   return 'dataTransfer' in event;
 };
 
-var useFileUpload = function (props) {
-  var _a = React.useState(null),
-      error = _a[0],
-      setError = _a[1];
+var ImageUploader = function (props) {
+  var _a, _b;
+
+  var _c = React.useState(null),
+      error = _c[0],
+      setError = _c[1];
 
   var onUpload = props.onUpload;
   var onDrop = useCallback(function (acceptedFiles, rejectedFiles, event) {
@@ -22801,34 +22828,19 @@ var useFileUpload = function (props) {
   var onDragEnter = useCallback(function () {
     setError(null);
   }, []);
-  var dropzone = useDropzone({
+
+  var _d = useDropzone({
     onDrop: onDrop,
     accept: parseAcceptedFiles(props.acceptedFiles),
-    multiple: props.hasMultiUpload,
+    multiple: props.hasMultiupload,
     maxFiles: props.maxAcceptedFiles,
     maxSize: props.maxFileSize,
     onDragEnter: onDragEnter
-  });
-  return [__assign({
-    onDragEnter: onDragEnter
-  }, dropzone), error];
-};
-
-var ImageUploader = function (props) {
-  var _a, _b;
-
-  props.uploadTitle;
-      props.backgroundColor;
-      var hookProps = __rest(props, ["uploadTitle", "backgroundColor"]);
-
-  var _c = useFileUpload(hookProps),
-      dropzone = _c[0],
-      error = _c[1];
+  }),
+      getRootProps = _d.getRootProps,
+      getInputProps = _d.getInputProps,
+      isDragActive = _d.isDragActive;
 
-  var isDragActive = dropzone.isDragActive,
-      getRootProps = dropzone.getRootProps,
-      getInputProps = dropzone.getInputProps,
-      onDragEnter = dropzone.onDragEnter;
   return jsx(React.Fragment, null, jsx(Flex, {
     inset: "x1",
     flexWrap: "wrap",
@@ -22869,9 +22881,6 @@ var ImageUploader = function (props) {
   }), jsx(Text, {
     type: "largeBody",
     content: (_b = props.uploadTitle) !== null && _b !== void 0 ? _b : 'Upload Photo'
-  }), jsx(Text, {
-    type: "footnote",
-    content: "Drag and Drop Image Here"
   })))), error && jsx(Text, {
     type: "footnote",
     content: error,
@@ -22893,26 +22902,25 @@ var ImageUploadWidget = function (_a) {
   var _b = _a.title,
       title = _b === void 0 ? 'Image Background' : _b,
       onFinished = _a.onFinished,
+      onUpload = _a.onUpload,
       x = _a.x,
       y = _a.y,
       isOpen = _a.isOpen,
+      _c = _a.hasMultiUpload,
+      hasMultiUpload = _c === void 0 ? false : _c,
       userImages = _a.userImages,
       hasMore = _a.hasMore,
       loadMore = _a.loadMore,
       endMessage = _a.endMessage,
       dataLength = _a.dataLength,
-      _c = _a.width,
-      width = _c === void 0 ? 264 : _c,
-      hookProps = __rest(_a, ["title", "onFinished", "x", "y", "isOpen", "userImages", "hasMore", "loadMore", "endMessage", "dataLength", "width"]);
+      _d = _a.width,
+      width = _d === void 0 ? 264 : _d;
 
-  var _d = useState(false),
-      shouldShowImageGrid = _d[0],
-      setShouldShowImageGrid = _d[1];
+  var _e = useState(false),
+      shouldShowImageGrid = _e[0],
+      setShouldShowImageGrid = _e[1];
 
   var inputRef = useRef(null);
-  var dropzone = useFileUpload(hookProps)[0];
-  var getInputProps = dropzone.getInputProps,
-      onDragEnter = dropzone.onDragEnter;
   return jsx(AnimatePresence, null, isOpen && jsx(Div, {
     initial: {
       opacity: 0
@@ -23021,7 +23029,11 @@ var ImageUploadWidget = function (_a) {
         url: image.url
       }
     })));
-  }))))) : jsx(ImageUploader, hookProps)), jsx(HStack, {
+  }))))) : jsx(ImageUploader, {
+    onUpload: onUpload,
+    acceptedFiles: ['gif', 'jpeg', 'jpg', 'png'],
+    hasMultiupload: hasMultiUpload
+  })), jsx(HStack, {
     outset: "x1",
     justify: "center",
     gap: "x1"
@@ -23041,10 +23053,23 @@ var ImageUploadWidget = function (_a) {
     size: "small",
     type: "smoke",
     title: "Upload..."
-  }), jsx("input", _extends({}, getInputProps(), {
+  }), jsx("input", {
     ref: inputRef,
-    onClick: onDragEnter
-  }))), jsx(Div, {
+    type: "file",
+    accept: "image/*",
+    style: {
+      display: 'none'
+    },
+    onChange: function (e) {
+      var _a, _b;
+
+      var file = (_b = (_a = e.target) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b[0];
+      if (file) onUpload({
+        accepted: [file],
+        rejected: []
+      });
+    }
+  })), jsx(Div, {
     width: "120px"
   }, jsx(Button, {
     onClick: function () {
@@ -24287,8 +24312,7 @@ var StackedCardHead = function (_a) {
   var cardImage = _a.cardImage,
       cardOrientation = _a.cardOrientation,
       quantity = _a.quantity,
-      quantityDescription = _a.quantityDescription,
-      secondaryAction = _a.secondaryAction;
+      quantityDescription = _a.quantityDescription;
   return jsx(VStack, {
     gap: "x2"
   }, jsx(StackedCards, {
@@ -24296,7 +24320,7 @@ var StackedCardHead = function (_a) {
     height: cardOrientation === 'vertical' ? 285 : 200,
     stackBackgroundColor: "background",
     backgroundImage: cardImage
-  }), secondaryAction && secondaryAction, jsx(Text, {
+  }), jsx(Text, {
     type: "largeBody",
     weight: "bold",
     color: "primaryHeading",
@@ -24313,16 +24337,14 @@ var CardQuantitySlider = function (props) {
   var cardOrientation = props.cardOrientation,
       cardImage = props.cardImage,
       quantityDescription = props.quantityDescription,
-      secondaryAction = props.secondaryAction,
-      rest = __rest(props, ["cardOrientation", "cardImage", "quantityDescription", "secondaryAction"]);
+      rest = __rest(props, ["cardOrientation", "cardImage", "quantityDescription"]);
 
   return jsx(React.Fragment, null, jsx(QuantitySlider, _extends({}, rest, {
     head: jsx(StackedCardHead, {
       cardOrientation: cardOrientation,
       quantity: rest.quantity,
       quantityDescription: quantityDescription,
-      cardImage: cardImage,
-      secondaryAction: secondaryAction
+      cardImage: cardImage
     })
   })));
 };
@@ -24348,8 +24370,7 @@ var BulkSend = function (_a) {
       isConfigurable = _a.isConfigurable,
       disableMessage = _a.disableMessage,
       sliderOrientation = _a.sliderOrientation,
-      sliderImage = _a.sliderImage,
-      secondaryAction = _a.secondaryAction;
+      sliderImage = _a.sliderImage;
 
   var _b = React.useState(false),
       isAddDialogOpen = _b[0],
@@ -24580,8 +24601,7 @@ var BulkSend = function (_a) {
     sliderFill: sliderFill,
     hasIncrement: hasIncrement,
     cardImage: sliderImage,
-    cardOrientation: sliderOrientation,
-    secondaryAction: secondaryAction
+    cardOrientation: sliderOrientation
   }), jsx(Flex, {
     outset: {
       top: 'x4'

package/dist/src/atoms/iconography/icons/warning.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { SVGProps } from '../types/index';
+export declare const Warning: FC<SVGProps>;

package/dist/src/atoms/iconography/types/index.d.ts

@@ -11,7 +11,7 @@ export declare type SVGProps = {
     entity: IconsEntity;
     orientation?: orientation;
 };
-export declare type IconType = 'catalog' | 'socLogo' | 'campaigns' | 'gift' | 'plus' | 'minus' | 'tenDoor' | 'rightChevron' | 'close' | 'award' | 'contact' | 'multipleUsers2x' | 'multipleUsers3x' | 'information' | 'hamburger' | 'leftChevron' | 'chevron' | 'information' | 'filterBy' | 'groups' | 'idCard' | 'plusSquare' | 'star' | 'search' | 'cart' | 'priceTag' | 'layer' | 'loading' | 'play' | 'lock' | 'user' | 'noUsers' | 'add' | 'check' | 'exclamation' | 'envelope' | 'userSuccess' | 'image' | 'imageSwap' | 'text' | 'color' | 'template' | 'redo' | 'undo' | 'copy' | 'drag' | 'delete' | 'crop' | 'alignLeft' | 'alignRight' | 'alignCenter' | 'allPanel' | 'fullBleed' | 'fullBleedLandscape' | 'fullBleedPortrait' | 'sliderHorizontal' | 'sliderVertical' | 'cropRotate' | 'frame' | 'cut' | 'wand' | 'layerAdd' | 'layerRemove' | 'layerDisabled' | 'signature' | 'shadows' | 'rotateLeft' | 'rotateRight' | 'colorPalette' | 'dropper' | 'textBox' | 'fontSize' | 'flipHorizontal' | 'flipVertical' | 'filter' | 'brightness' | 'aText' | 'frameWidth' | 'frameHeight' | 'layerUp' | 'layerDown' | 'capitalizedText' | 'uppercaseText' | 'lowercaseText' | 'fullBleedImage' | 'fullBleedText' | 'panelMode' | 'viewPanels' | 'rotate' | 'view' | 'replaceImage' | 'quotation' | 'facebook' | 'instagram' | 'twitter' | 'linkedIn' | 'youtube' | 'pinterest' | 'visible' | 'invisible' | 'elementIcon' | 'complete' | 'download' | 'closeCircle' | 'backgroundSettings' | 'upload' | 'stickers' | 'clearPanel' | 'viewCarousel' | 'viewSinglePanel' | 'editorText' | 'layout' | 'background' | 'save' | 'signaturePen' | 'size' | 'variable' | 'imageUpload' | 'squareCheck' | 'userTag' | 'map' | 'mapLocation' | 'location' | 'creditCard' | 'calendar' | 'home' | 'bag' | 'swap';
+export declare type IconType = 'catalog' | 'socLogo' | 'campaigns' | 'gift' | 'plus' | 'minus' | 'tenDoor' | 'rightChevron' | 'close' | 'award' | 'contact' | 'multipleUsers2x' | 'multipleUsers3x' | 'information' | 'hamburger' | 'leftChevron' | 'chevron' | 'information' | 'filterBy' | 'groups' | 'idCard' | 'plusSquare' | 'star' | 'search' | 'cart' | 'priceTag' | 'layer' | 'loading' | 'play' | 'lock' | 'user' | 'noUsers' | 'add' | 'check' | 'exclamation' | 'envelope' | 'userSuccess' | 'image' | 'imageSwap' | 'text' | 'color' | 'template' | 'redo' | 'undo' | 'copy' | 'drag' | 'delete' | 'crop' | 'alignLeft' | 'alignRight' | 'alignCenter' | 'allPanel' | 'fullBleed' | 'fullBleedLandscape' | 'fullBleedPortrait' | 'sliderHorizontal' | 'sliderVertical' | 'cropRotate' | 'frame' | 'cut' | 'wand' | 'layerAdd' | 'layerRemove' | 'layerDisabled' | 'signature' | 'shadows' | 'rotateLeft' | 'rotateRight' | 'colorPalette' | 'dropper' | 'textBox' | 'fontSize' | 'flipHorizontal' | 'flipVertical' | 'filter' | 'brightness' | 'aText' | 'frameWidth' | 'frameHeight' | 'layerUp' | 'layerDown' | 'capitalizedText' | 'uppercaseText' | 'lowercaseText' | 'fullBleedImage' | 'fullBleedText' | 'panelMode' | 'viewPanels' | 'rotate' | 'view' | 'replaceImage' | 'quotation' | 'facebook' | 'instagram' | 'twitter' | 'linkedIn' | 'youtube' | 'pinterest' | 'visible' | 'invisible' | 'elementIcon' | 'complete' | 'download' | 'closeCircle' | 'backgroundSettings' | 'upload' | 'stickers' | 'clearPanel' | 'viewCarousel' | 'viewSinglePanel' | 'editorText' | 'layout' | 'background' | 'save' | 'signaturePen' | 'size' | 'variable' | 'imageUpload' | 'squareCheck' | 'userTag' | 'map' | 'mapLocation' | 'location' | 'creditCard' | 'calendar' | 'home' | 'bag' | 'swap' | 'warning';
 export declare type IconProps = {
     name: IconType;
 } & Omit<SVGProps, 'entity'>;

package/dist/src/molecules/quantitySlider/components/stackedCardHead.d.ts

@@ -1,9 +1,8 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 export declare type StackedCardHeadProps = {
     cardImage?: string;
     cardOrientation?: 'vertical' | 'horizontal';
     quantity: number;
     quantityDescription: string;
-    secondaryAction?: React.ReactNode;
 };
 export declare const StackedCardHead: FC<StackedCardHeadProps>;

package/dist/src/molecules/select/components/option.d.ts

@@ -31,21 +31,21 @@ export declare const Option: React.ForwardRefExoticComponent<({
     alignment?: "left" | "center" | "right" | undefined;
     onClick?: ((id: number) => void) | undefined;
     isSelected: boolean;
-    graphic?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | undefined;
-    icon?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | undefined;
+    graphic?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | "warning" | undefined;
+    icon?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | "warning" | undefined;
     id: number;
 } & TextLabelProps & React.RefAttributes<HTMLDivElement>) | ({
     alignment?: "left" | "center" | "right" | undefined;
     onClick?: ((id: number) => void) | undefined;
     isSelected: boolean;
-    graphic?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | undefined;
-    icon?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | undefined;
+    graphic?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | "warning" | undefined;
+    icon?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | "warning" | undefined;
     id: number;
 } & IconLabelProps & React.RefAttributes<HTMLDivElement>) | ({
     alignment?: "left" | "center" | "right" | undefined;
     onClick?: ((id: number) => void) | undefined;
     isSelected: boolean;
-    graphic?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | undefined;
-    icon?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | undefined;
+    graphic?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | "warning" | undefined;
+    icon?: "catalog" | "socLogo" | "campaigns" | "gift" | "plus" | "minus" | "tenDoor" | "rightChevron" | "close" | "award" | "contact" | "multipleUsers2x" | "multipleUsers3x" | "information" | "hamburger" | "leftChevron" | "chevron" | "filterBy" | "groups" | "idCard" | "plusSquare" | "star" | "search" | "cart" | "priceTag" | "layer" | "loading" | "play" | "lock" | "user" | "noUsers" | "add" | "check" | "exclamation" | "envelope" | "userSuccess" | "image" | "imageSwap" | "text" | "color" | "template" | "redo" | "undo" | "copy" | "drag" | "delete" | "crop" | "alignLeft" | "alignRight" | "alignCenter" | "allPanel" | "fullBleed" | "fullBleedLandscape" | "fullBleedPortrait" | "sliderHorizontal" | "sliderVertical" | "cropRotate" | "frame" | "cut" | "wand" | "layerAdd" | "layerRemove" | "layerDisabled" | "signature" | "shadows" | "rotateLeft" | "rotateRight" | "colorPalette" | "dropper" | "textBox" | "fontSize" | "flipHorizontal" | "flipVertical" | "filter" | "brightness" | "aText" | "frameWidth" | "frameHeight" | "layerUp" | "layerDown" | "capitalizedText" | "uppercaseText" | "lowercaseText" | "fullBleedImage" | "fullBleedText" | "panelMode" | "viewPanels" | "rotate" | "view" | "replaceImage" | "quotation" | "facebook" | "instagram" | "twitter" | "linkedIn" | "youtube" | "pinterest" | "visible" | "invisible" | "elementIcon" | "complete" | "download" | "closeCircle" | "backgroundSettings" | "upload" | "stickers" | "clearPanel" | "viewCarousel" | "viewSinglePanel" | "editorText" | "layout" | "background" | "save" | "signaturePen" | "size" | "variable" | "imageUpload" | "squareCheck" | "userTag" | "map" | "mapLocation" | "location" | "creditCard" | "calendar" | "home" | "bag" | "swap" | "warning" | undefined;
     id: number;
 } & IconTextLabelProps & React.RefAttributes<HTMLDivElement>)>;

package/dist/src/organisms/imageUploadWidget/imageUploadWidget.d.ts

@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import { UseFileUploadProps } from "../../hooks/useFileUpload";
+import { AcceptedFiles, RejectedFiles } from '../imageUploader/imageUploader';
 export declare type UserImage = {
     url: string;
     onClick: () => void;
@@ -7,8 +7,15 @@ export declare type UserImage = {
 };
 export declare type ImageUploadWidgetProps = {
     title: string;
+    maxHeight?: string;
+    onClose: () => void;
     onFinished: () => void;
     isOpen: boolean;
+    onUpload: (files: {
+        accepted: AcceptedFiles;
+        rejected: RejectedFiles;
+    }, fileList?: FileList | null) => void;
+    hasMultiUpload?: boolean;
     userImages?: UserImage[];
     x: number;
     y: number;
@@ -17,5 +24,5 @@ export declare type ImageUploadWidgetProps = {
     hasMore?: boolean;
     endMessage?: string;
     width?: number;
-} & UseFileUploadProps;
+};
 export declare const ImageUploadWidget: FC<ImageUploadWidgetProps>;

package/dist/src/organisms/imageUploader/imageUploader.d.ts

@@ -1,8 +1,20 @@
 /// <reference types="react" />
+import { FileRejection } from 'react-dropzone';
 import { BackgroundColor } from "../../helpers/hoc-types/hocBaseUnion";
-import { UseFileUploadProps } from "../../hooks/useFileUpload";
+declare type AcceptedFileType = 'jpg' | 'png' | 'gif' | 'jpeg';
 export declare type ImageUploaderProps = {
+    onUpload: (files: {
+        accepted: File[];
+        rejected: FileRejection[];
+    }, fileList?: FileList | null) => void;
+    acceptedFiles: AcceptedFileType[];
+    hasMultiupload?: boolean;
+    maxFileSize?: number;
+    maxAcceptedFiles?: number;
     uploadTitle?: string;
     backgroundColor?: BackgroundColor;
-} & UseFileUploadProps;
+};
+export declare type AcceptedFiles = File[];
+export declare type RejectedFiles = FileRejection[];
 export declare const ImageUploader: (props: ImageUploaderProps) => JSX.Element;
+export {};

package/dist/src/portfolios/soc/components/bulkSend/bulkSend.d.ts

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 import { SliderProgressColor } from "../../../../exports/molecules";
 import { ConfigurationCardProps, ConfirmDialogProps } from "../../../../exports/organisms";
 export declare type ConfigurationOptionSection = {
@@ -40,7 +40,6 @@ export declare type BulkSendProps = {
     disableMessage: string;
     sliderImage?: string;
     sliderOrientation?: 'vertical' | 'horizontal';
-    secondaryAction?: React.ReactNode;
 };
 export declare const BulkSend: FC<BulkSendProps>;
 export {};

package/dist/src/portfolios/soc/components/bulkSend/cardQuantitySlider.d.ts

@@ -1,9 +1,8 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 import { QuantitySliderProps } from "../../../../exports/molecules";
 export declare type CardQuantitySliderProps = {
     cardImage?: string;
     cardOrientation?: 'vertical' | 'horizontal';
     quantityDescription: string;
-    secondaryAction?: React.ReactNode;
 } & QuantitySliderProps;
 export declare const CardQuantitySlider: FC<CardQuantitySliderProps>;

package/dist/src/stories/atoms/Icons.stories.d.ts

@@ -119,4 +119,5 @@ export declare const ViewCarousel: any;
 export declare const ViewPanels: any;
 export declare const ViewSinglePanel: any;
 export declare const Wand: any;
+export declare const Warning: any;
 export declare const Youtube: any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sendoutcards/quantum-design-ui",
-  "version": "1.7.84",
+  "version": "1.7.86",
   "description": "UI component library for Quantum Design System",
   "module": "dist/index.es.js",
   "jsnext:main": "dist/index.es.js",

package/dist/src/atoms/companion/companion.d.ts

@@ -1,17 +0,0 @@
-import React from 'react';
-import { HOCBaseProps } from "../../helpers/hoc-types/hocBasePropTypes";
-import { HOCMotionProps } from "../../helpers/hoc-types/hocMotionTypes";
-export declare type DivProps = {
-    children?: React.ReactNode;
-    outsideClick?: () => void;
-    clickElementBypass?: string;
-} & HOCBaseProps & HOCMotionProps;
-export declare const Companion: React.ForwardRefExoticComponent<{
-    children?: React.ReactNode;
-    outsideClick?: (() => void) | undefined;
-    clickElementBypass?: string | undefined;
-} & HOCBaseProps & {
-    className?: string | undefined;
-    motionKey?: string | number | undefined;
-    id?: string | undefined;
-} & import("framer-motion").MotionProps & React.RefAttributes<HTMLDivElement>>;

package/dist/src/hooks/useFileUpload.d.ts

@@ -1,32 +0,0 @@
-import React from 'react';
-import { DropzoneState, FileRejection } from 'react-dropzone';
-declare type AcceptedFileType = 'jpg' | 'png' | 'gif' | 'jpeg';
-export declare type AcceptedFiles = File[];
-export declare type RejectedFiles = FileRejection[];
-export declare type UseFileUploadProps = {
-    onUpload: (files: {
-        accepted: File[];
-        rejected: FileRejection[];
-    }, fileList?: FileList | null) => void;
-    acceptedFiles: AcceptedFileType[];
-    hasMultiUpload?: boolean;
-    maxFileSize?: number;
-    maxAcceptedFiles?: number;
-};
-export declare const useFileUpload: (props: UseFileUploadProps) => [import("react-dropzone").DropzoneRef & {
-    isFocused: boolean;
-    isDragActive: boolean;
-    isDragAccept: boolean;
-    isDragReject: boolean;
-    isFileDialogActive: boolean;
-    draggedFiles: File[];
-    acceptedFiles: File[];
-    fileRejections: FileRejection[];
-    rootRef: React.RefObject<HTMLElement>;
-    inputRef: React.RefObject<HTMLInputElement>;
-    getRootProps: <T extends import("react-dropzone").DropzoneRootProps>(props?: T | undefined) => T;
-    getInputProps: <T_1 extends import("react-dropzone").DropzoneInputProps>(props?: T_1 | undefined) => T_1;
-} & {
-    onDragEnter: () => void;
-}, string | null];
-export {};