@dreamcommerce/aurora 3.0.0-32 → 3.0.0-320

package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control.js

@@ -0,0 +1,64 @@
+import React, { useState } from 'react';
+import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { Control } from '../../control/control.js';
+import { HelperText } from '../../helper_text/helper_text.js';
+import { Label } from '../../label/label.js';
+import { XhrImagePicker } from '../../xhr_image_picker/xhr_image_picker.js';
+
+var XhrImagePickerControl = function XhrImagePickerControl(_ref) {
+  var url = _ref.url,
+    label = _ref.label,
+    required = _ref.required,
+    id = _ref.id,
+    name = _ref.name,
+    onChange = _ref.onChange,
+    allowedExtensions = _ref.allowedExtensions,
+    allowedExtensionsLabel = _ref.allowedExtensionsLabel,
+    initialFile = _ref.initialFile,
+    className = _ref.className,
+    errors = _ref.errors,
+    tooltip = _ref.tooltip,
+    onUploaded = _ref.onUploaded,
+    helperText = _ref.helperText,
+    onImageSizeUpdated = _ref.onImageSizeUpdated,
+    ImageEditor = _ref.ImageEditor;
+  var _useState = useState(errors),
+    _useState2 = _slicedToArray(_useState, 2),
+    setErrors = _useState2[1];
+  var handleControlError = function handleControlError(errors) {
+    setErrors(errors);
+  };
+  var handleControlChange = function handleControlChange(file) {
+    var fileList = file.fileList,
+      fileAsDataUrl = file.fileAsDataUrl;
+    setErrors(null);
+    onChange === null || onChange === void 0 ? void 0 : onChange({
+      fileList: fileList,
+      fileAsDataUrl: fileAsDataUrl
+    });
+  };
+  return /*#__PURE__*/React.createElement(Control, {
+    classname: "aurora-flex-col"
+  }, label ? (/*#__PURE__*/React.createElement(Label, {
+    htmlFor: id,
+    tooltip: tooltip,
+    required: required
+  }, label)) : null, /*#__PURE__*/React.createElement(XhrImagePicker, {
+    url: url,
+    id: id,
+    name: name,
+    onChange: handleControlChange,
+    onError: handleControlError,
+    allowedExtensions: allowedExtensions,
+    allowedExtensionsLabel: allowedExtensionsLabel,
+    initialFile: initialFile,
+    className: className,
+    errors: errors,
+    onUploaded: onUploaded,
+    onImageSizeUpdated: onImageSizeUpdated,
+    ImageEditor: ImageEditor
+  }), helperText ? /*#__PURE__*/React.createElement(HelperText, null, helperText) : null);
+};
+
+export { XhrImagePickerControl };
+//# sourceMappingURL=xhr_image_picker_control.js.map

package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control_types.d.ts

@@ -0,0 +1,15 @@
+import { TControlErrors } from "../../control/control_types";
+import { IImagePicker, ImagePickerFileObject, TImageSize } from "../../image_picker/image_picker_types";
+import { TUploadedImageData } from "../../xhr_image_picker/xhr_image_picker_types";
+import { ReactNode } from 'react';
+export interface IXhrImagePickerControl extends IImagePicker {
+    url: string;
+    label?: string;
+    onChange?: (file: ImagePickerFileObject, size?: TImageSize) => void;
+    onUploaded?: (data: TUploadedImageData) => void;
+    ImageEditor?: React.FunctionComponent;
+    errors?: TControlErrors;
+    required?: boolean;
+    tooltip?: string | ReactNode;
+    helperText?: string | ReactNode;
+}

package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control_types.js

@@ -0,0 +1,5 @@
+import '@auroraComponents/control/control_types';
+import '@auroraComponents/image_picker/image_picker_types';
+import '@auroraComponents/xhr_image_picker/xhr_image_picker_types';
+import 'react';
+//# sourceMappingURL=xhr_image_picker_control_types.js.map

package/build/esm/packages/aurora/src/components/controls/xhr_image_picker_control/xhr_image_picker_control_types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xhr_image_picker_control_types.js","sourceRoot":"","sources":["../../../../../../../../src/components/controls/xhr_image_picker_control/xhr_image_picker_control_types.ts"],"names":[],"mappings":"AAAA,OAA+B,yCAAyC,CAAC;AACzE,OAAgE,mDAAmD,CAAC;AACpH,OAAmC,2DAA2D,CAAC;AAC/F,OAA0B,OAAO,CAAC"}

package/build/esm/packages/aurora/src/components/divider/divider.js

@@ -1,17 +1,23 @@
 import React from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { cn } from '../../utilities/cn.js';
+import { Root } from '@radix-ui/react-separator';
 import { DIVIDER_ORIENTATION } from './divider_constants.js';
 import { dividerVariants } from './divider_variants.js';
-import { Root } from '@radix-ui/react-separator';
 
-var _excluded = ["className", "orientation", "color", "thickness", "variant", "decorative"];
+var _excluded = ["className", "orientation", "color", "thickness", "height", "maxHeight", "minHeight", "width", "maxWidth", "minWidth", "variant", "decorative"];
 var Divider = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     _ref$orientation = _ref.orientation,
     orientation = _ref$orientation === void 0 ? DIVIDER_ORIENTATION.horizontal : _ref$orientation,
     color = _ref.color,
     thickness = _ref.thickness,
+    height = _ref.height,
+    maxHeight = _ref.maxHeight,
+    minHeight = _ref.minHeight,
+    width = _ref.width,
+    maxWidth = _ref.maxWidth,
+    minWidth = _ref.minWidth,
     variant = _ref.variant,
     _ref$decorative = _ref.decorative,
     decorative = _ref$decorative === void 0 ? true : _ref$decorative,
@@ -20,11 +26,19 @@ var Divider = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     ref: ref,
     decorative: decorative,
     orientation: orientation,
-    className: cn('aurora-shrink-0', dividerVariants({
+    className: cn('aurora-shrink-0 aurora-grow', dividerVariants({
       variant: variant,
       thickness: thickness,
       orientation: orientation
-    }), className)
+    }), className),
+    style: {
+      height: height,
+      maxHeight: maxHeight,
+      minHeight: minHeight,
+      width: width,
+      maxWidth: maxWidth,
+      minWidth: minWidth
+    }
   }, props));
 });
 Divider.displayName = 'Divider';

package/build/esm/packages/aurora/src/components/divider/divider.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/divider/divider_constants.d.ts

@@ -9,6 +9,7 @@ export declare const DIVIDER_THICKNESS: {
     readonly 8: "8";
 };
 export declare const DIVIDER_VARIANTS: {
+    readonly default: "default";
     readonly subtle: "subtle";
     readonly strong: "strong";
     readonly transparent: "transparent";

package/build/esm/packages/aurora/src/components/divider/divider_constants.js

@@ -9,6 +9,7 @@ var DIVIDER_THICKNESS = {
   8: '8'
 };
 var DIVIDER_VARIANTS = {
+  default: 'default',
   subtle: 'subtle',
   strong: 'strong',
   transparent: 'transparent'

package/build/esm/packages/aurora/src/components/divider/divider_constants.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/divider/divider_types.d.ts

@@ -5,4 +5,10 @@ import { DIVIDER_ORIENTATION } from "./divider_constants";
 import { Any } from 'ts-toolbelt';
 export interface TDividerProps extends Omit<SeparatorProps, 'orientation'>, VariantProps<typeof dividerVariants> {
     orientation?: Any.Keys<typeof DIVIDER_ORIENTATION>;
+    height?: string;
+    maxHeight?: string;
+    minHeight?: string;
+    width?: string;
+    maxWidth?: string;
+    minWidth?: string;
 }

package/build/esm/packages/aurora/src/components/divider/divider_variants.d.ts

@@ -1,5 +1,5 @@
 export declare const dividerVariants: (props?: ({
     thickness?: "1" | "2" | "4" | "8" | null | undefined;
-    variant?: "subtle" | "strong" | "transparent" | null | undefined;
+    variant?: "default" | "subtle" | "strong" | "transparent" | null | undefined;
     orientation?: "horizontal" | "vertical" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;

package/build/esm/packages/aurora/src/components/divider/divider_variants.js

@@ -6,8 +6,8 @@ import { DIVIDER_THICKNESS, DIVIDER_VARIANTS, DIVIDER_ORIENTATION } from './divi
 var dividerVariants = cva('', {
   variants: {
     thickness: _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, DIVIDER_THICKNESS['1'], ''), DIVIDER_THICKNESS['2'], ''), DIVIDER_THICKNESS['4'], ''), DIVIDER_THICKNESS['8'], ''),
-    variant: _defineProperty(_defineProperty(_defineProperty({}, DIVIDER_VARIANTS.subtle, "aurora-bg-neutral-100"), DIVIDER_VARIANTS.strong, 'aurora-bg--neutral-500'), DIVIDER_VARIANTS.transparent, 'aurora-bg-transparent'),
-    orientation: _defineProperty(_defineProperty({}, DIVIDER_ORIENTATION.horizontal, ''), DIVIDER_ORIENTATION.vertical, 'aurora-h-full')
+    variant: _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, DIVIDER_VARIANTS.default, "aurora-bg-neutral-200"), DIVIDER_VARIANTS.subtle, "aurora-bg-neutral-100"), DIVIDER_VARIANTS.strong, 'aurora-bg--neutral-500'), DIVIDER_VARIANTS.transparent, 'aurora-bg-transparent'),
+    orientation: _defineProperty(_defineProperty({}, DIVIDER_ORIENTATION.horizontal, 'aurora-w-full'), DIVIDER_ORIENTATION.vertical, 'aurora-h-full')
   },
   compoundVariants: [{
     orientation: DIVIDER_ORIENTATION.horizontal,
@@ -44,7 +44,7 @@ var dividerVariants = cva('', {
   }],
   defaultVariants: {
     thickness: CSS_BORDER_WIDTH_TOKENS['1'],
-    variant: DIVIDER_VARIANTS.subtle,
+    variant: DIVIDER_VARIANTS.default,
     orientation: DIVIDER_ORIENTATION.horizontal
   }
 });

package/build/esm/packages/aurora/src/components/error_list/components/error_list_item.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { PropsWithChildren } from 'react';
+import { TErrorListItemProps } from '../error_list_types';
+export declare const ErrorListItem: ({ children, className, ...props }: PropsWithChildren<TErrorListItemProps>) => React.JSX.Element;

package/build/esm/packages/aurora/src/components/error_list/components/error_list_item.js

@@ -0,0 +1,17 @@
+import { createElement } from 'react';
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { Typography } from '../../typography/typography.js';
+
+var _excluded = ["children", "className"];
+var ErrorListItem = function ErrorListItem(_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/createElement("li", _objectSpread2({}, props), /*#__PURE__*/createElement(Typography, {
+    color: "danger",
+    size: "s"
+  }, children));
+};
+
+export { ErrorListItem };
+//# sourceMappingURL=error_list_item.js.map

package/build/esm/packages/aurora/src/components/error_list/components/error_list_item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/error_list/error_list.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { PropsWithChildren } from 'react';
+import { TErrorListProps } from './error_list_types';
+export declare const ErrorList: ({ errors, className, ...props }: PropsWithChildren<TErrorListProps>) => React.JSX.Element | null;

package/build/esm/packages/aurora/src/components/error_list/error_list.js

@@ -0,0 +1,24 @@
+import { createElement } from 'react';
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { cn } from '../../utilities/cn.js';
+import { ErrorListItem } from './components/error_list_item.js';
+import { errorListVariants } from './error_list_variants.js';
+
+var _excluded = ["errors", "className"];
+var ErrorList = function ErrorList(_ref) {
+  var errors = _ref.errors,
+    className = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var singleError = typeof errors === 'string';
+  if (!(errors !== null && errors !== void 0 && errors.length)) return null;
+  return /*#__PURE__*/createElement("ul", _objectSpread2({
+    className: cn(errorListVariants(), className)
+  }, props), singleError ? (/*#__PURE__*/createElement(ErrorListItem, null, errors)) : errors.map(function (error, index) {
+    return /*#__PURE__*/createElement(ErrorListItem, {
+      key: "error-".concat(index)
+    }, error);
+  }));
+};
+
+export { ErrorList };
+//# sourceMappingURL=error_list.js.map

package/build/esm/packages/aurora/src/components/error_list/error_list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/error_list/error_list_types.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export interface TErrorListProps extends React.HTMLAttributes<HTMLUListElement> {
+    errors: string | string[];
+}
+export interface TErrorListItemProps extends React.HTMLAttributes<HTMLLIElement> {
+    children: React.ReactNode;
+}

package/build/esm/packages/aurora/src/components/error_list/error_list_types.js

@@ -0,0 +1,2 @@
+import 'react';
+//# sourceMappingURL=error_list_types.js.map

package/build/esm/packages/aurora/src/components/error_list/error_list_types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"error_list_types.js","sourceRoot":"","sources":["../../../../../../../src/components/error_list/error_list_types.ts"],"names":[],"mappings":"AAAA,OAAuB,OAAO,CAAC"}

package/build/esm/packages/aurora/src/components/error_list/error_list_variants.d.ts

@@ -0,0 +1 @@
+export declare const errorListVariants: (props?: import("class-variance-authority/dist/types").ClassProp | undefined) => string;

package/build/esm/packages/aurora/src/components/error_list/error_list_variants.js

@@ -0,0 +1,6 @@
+import { cva } from '../../../../../external/class-variance-authority/dist/index.mjs.js';
+
+var errorListVariants = cva('aurora-m-0 aurora-p-0 aurora-list-none');
+
+export { errorListVariants };
+//# sourceMappingURL=error_list_variants.js.map

package/build/esm/packages/aurora/src/components/error_list/error_list_variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,oBAAoB,oEAAwE;AAC5F;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/helper_text/helper_text.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { PropsWithChildren } from 'react';
+import { THelperTextProps } from './helper_text_types';
+export declare const HelperText: ({ className, children, color, ...props }: PropsWithChildren<THelperTextProps>) => React.JSX.Element;

package/build/esm/packages/aurora/src/components/helper_text/helper_text.js

@@ -0,0 +1,19 @@
+import { createElement } from 'react';
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { Typography } from '../typography/typography.js';
+
+var _excluded = ["className", "children", "color"];
+var HelperText = function HelperText(_ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? 'subtle' : _ref$color,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/createElement(Typography, _objectSpread2({
+    size: "s",
+    color: color
+  }, props), children);
+};
+
+export { HelperText };
+//# sourceMappingURL=helper_text.js.map

package/build/esm/packages/aurora/src/components/helper_text/helper_text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/helper_text/helper_text_types.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import { TCssTextColorTokens } from "../../constants/css_tokens/css_tokens_types";
+export declare type THelperTextProps = React.HTMLAttributes<HTMLParagraphElement> & {
+    color?: TCssTextColorTokens;
+};

package/build/esm/packages/aurora/src/components/helper_text/helper_text_types.js

@@ -0,0 +1,3 @@
+import 'react';
+import '@auroraConstants/css_tokens/css_tokens_types';
+//# sourceMappingURL=helper_text_types.js.map

package/build/esm/packages/aurora/src/components/helper_text/helper_text_types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper_text_types.js","sourceRoot":"","sources":["../../../../../../../src/components/helper_text/helper_text_types.ts"],"names":[],"mappings":"AAAA,OAAuB,OAAO,CAAC;AAC/B,OAAoC,8CAA8C,CAAC"}

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_drag_over_placeholder.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ImagePickerDragOverPlaceholder: () => React.JSX.Element;

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_drag_over_placeholder.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { useTranslation } from '../../../../../../external/react-i18next/dist/es/useTranslation.js';
+import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { cn } from '../../../utilities/cn.js';
+
+var ImagePickerDragOverPlaceholder = function ImagePickerDragOverPlaceholder() {
+  var _useTranslation = useTranslation(),
+    _useTranslation2 = _slicedToArray(_useTranslation, 1),
+    t = _useTranslation2[0];
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn('aurora-absolute aurora-inset-0 aurora-bg-neutral-0 aurora-border-2 aurora-border-primary aurora-rounded-8 aurora-z-20 aurora-pointer-events-none aurora-w-full aurora-h-full')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "aurora-w-full aurora-h-full aurora-bg-primary-transparent aurora-flex aurora-items-center aurora-justify-center"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "aurora-text-xs aurora-text-interactive"
+  }, "".concat(t('Drop file here')))));
+};
+
+export { ImagePickerDragOverPlaceholder };
+//# sourceMappingURL=image_picker_drag_over_placeholder.js.map

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_drag_over_placeholder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_input.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+declare type ImagePickerInput = {
+    id: string;
+    onDropFile: (event: React.DragEvent<HTMLLabelElement>) => void;
+    onDragOver: (event: React.DragEvent<HTMLLabelElement>) => void;
+    onDragLeave: (event: React.DragEvent<HTMLLabelElement>) => void;
+    allowedExtensionsLabel?: string;
+    allowedExtensions: string[];
+    isDragOver: boolean;
+};
+export declare const ImagePickerInput: React.FC<ImagePickerInput>;
+export {};

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_input.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { useTranslation } from '../../../../../../external/react-i18next/dist/es/useTranslation.js';
+import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { cn } from '../../../utilities/cn.js';
+import { ImagePickerDragOverPlaceholder } from './image_picker_drag_over_placeholder.js';
+import { UploadLineIcon } from '../../../assets/icons/upload_icon.js';
+
+var ImagePickerInput = function ImagePickerInput(_ref) {
+  var id = _ref.id,
+    onDropFile = _ref.onDropFile,
+    onDragOver = _ref.onDragOver,
+    onDragLeave = _ref.onDragLeave,
+    allowedExtensionsLabel = _ref.allowedExtensionsLabel,
+    allowedExtensions = _ref.allowedExtensions,
+    isDragOver = _ref.isDragOver;
+  var _useTranslation = useTranslation(),
+    _useTranslation2 = _slicedToArray(_useTranslation, 1),
+    t = _useTranslation2[0];
+  return /*#__PURE__*/React.createElement("label", {
+    htmlFor: id,
+    onDrop: onDropFile,
+    onDragOver: onDragOver,
+    onDragLeave: onDragLeave,
+    className: "aurora-relative aurora-flex aurora-items-center aurora-justify-center aurora-w-full aurora-h-full aurora-cursor-pointer aurora-p-1 aurora-pb-2 aurora-group/imagePickerInput"
+  }, isDragOver && /*#__PURE__*/React.createElement(ImagePickerDragOverPlaceholder, null), /*#__PURE__*/React.createElement("div", {
+    className: cn('aurora-flex aurora-flex-col aurora-items-center aurora-w-full aurora-h-full aurora-pt-4 aurora-pb-3 aurora-px-1')
+  }, /*#__PURE__*/React.createElement(UploadLineIcon, {
+    className: "aurora-w-5 aurora-h-5 aurora-fill-subtle group-hover/imagePickerInput:aurora-fill-primary aurora-mb-2"
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "aurora-text-xs aurora-text-interactive aurora-font-semibold"
+  }, "".concat(t('Drag a file here or browse'))), /*#__PURE__*/React.createElement("span", {
+    className: "aurora-text-xs aurora-text-subtle-light aurora-font-normal aurora-text-center"
+  }, "".concat(allowedExtensionsLabel ? allowedExtensionsLabel : t('Supported formats')), ":", allowedExtensions.map(function (extension) {
+    return "*.".concat(extension);
+  }).join(', '))));
+};
+
+export { ImagePickerInput };
+//# sourceMappingURL=image_picker_input.js.map

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { TImagePickerFile } from '../image_picker_types';
+declare type TImagePickerPreviewProps = {
+    file: TImagePickerFile;
+    onError: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;
+    onLoad?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;
+};
+export declare const ImagePickerPreview: ({ file, onError, onLoad }: TImagePickerPreviewProps) => React.JSX.Element;
+export {};

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview.js

@@ -0,0 +1,19 @@
+import React from 'react';
+
+var ImagePickerPreview = function ImagePickerPreview(_ref) {
+  var file = _ref.file,
+    onError = _ref.onError,
+    onLoad = _ref.onLoad;
+  return /*#__PURE__*/React.createElement("div", {
+    className: 'aurora-rounded-4 aurora-w-full aurora-h-full aurora-min-h-16 aurora-flex aurora-justify-center aurora-items-center'
+  }, /*#__PURE__*/React.createElement("img", {
+    className: "aurora-rounded-4 aurora-w-full aurora-h-full aurora-object-contain",
+    alt: file.fileName,
+    src: (file === null || file === void 0 ? void 0 : file.fileUrl) || '',
+    onError: onError,
+    onLoad: onLoad
+  }));
+};
+
+export { ImagePickerPreview };
+//# sourceMappingURL=image_picker_preview.js.map

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview_container.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IImagePickerPreviewContainer } from '../image_picker_types';
+export declare const ImagePickerPreviewContainer: React.FC<IImagePickerPreviewContainer>;

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview_container.js

@@ -0,0 +1,18 @@
+import React from 'react';
+
+var ImagePickerPreviewContainer = function ImagePickerPreviewContainer(_ref) {
+  var classname = _ref.classname,
+    children = _ref.children,
+    onDragLeave = _ref.onDragLeave,
+    onDragOver = _ref.onDragOver,
+    onDropFile = _ref.onDropFile;
+  return /*#__PURE__*/React.createElement("label", {
+    className: classname,
+    onDragLeave: onDragLeave,
+    onDragOver: onDragOver,
+    onDrop: onDropFile
+  }, children);
+};
+
+export { ImagePickerPreviewContainer };
+//# sourceMappingURL=image_picker_preview_container.js.map

package/build/esm/packages/aurora/src/components/image_picker/components/image_picker_preview_container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/image_picker/components/uploaded_image_picker_item.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+declare type TUploadedImagePickerItemProps = {
+    file: any;
+    isValid: boolean;
+    imageSize: any;
+    onFileDelete: () => void;
+};
+export declare const UploadedImagePickerItem: ({ imageSize, onFileDelete, isValid, file }: TUploadedImagePickerItemProps) => React.JSX.Element;
+export {};

package/build/esm/packages/aurora/src/components/image_picker/components/uploaded_image_picker_item.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import { useTranslation } from '../../../../../../external/react-i18next/dist/es/useTranslation.js';
+import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { DeleteBinLineIcon } from '../../../assets/icons/delete_bin_icon.js';
+import { FileUtils } from '@dreamcommerce/utilities';
+
+var UploadedImagePickerItem = function UploadedImagePickerItem(_ref) {
+  var imageSize = _ref.imageSize,
+    onFileDelete = _ref.onFileDelete,
+    isValid = _ref.isValid,
+    file = _ref.file;
+  var _useTranslation = useTranslation(),
+    _useTranslation2 = _slicedToArray(_useTranslation, 1),
+    t = _useTranslation2[0];
+  var imageName = FileUtils.getFileName(file.fileName);
+  var imageExtension = FileUtils.getFileExtension(file.fileName);
+  var imageWidth = imageSize && imageSize.width;
+  var imageHeight = imageSize && imageSize.height;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "aurora-flex aurora-justify-between aurora-items-center aurora-pt-2 aurora-px-1 aurora-gap-1"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "aurora-text-xs aurora-text-subtle aurora-overflow-hidden aurora-text-ellipsis"
+  }, isValid && (/*#__PURE__*/React.createElement(React.Fragment, null, imageName, ".".concat(imageExtension, " (").concat(imageWidth, "x").concat(imageHeight, "px)")))), /*#__PURE__*/React.createElement("button", {
+    "data-test-id": "image-picker-remove-button",
+    onClick: onFileDelete,
+    className: "aurora-flex aurora-items-center aurora-gap-1 aurora-border aurora-border-danger aurora-rounded-full aurora-px-3 aurora-py-[6px]",
+    type: "button"
+  }, /*#__PURE__*/React.createElement(DeleteBinLineIcon, {
+    className: "aurora-w-4 aurora-h-4 aurora-fill-danger"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "aurora-text-xs aurora-text-danger aurora-font-semibold"
+  }, "".concat(t('Remove')))));
+};
+
+export { UploadedImagePickerItem };
+//# sourceMappingURL=uploaded_image_picker_item.js.map

package/build/esm/packages/aurora/src/components/image_picker/components/uploaded_image_picker_item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/image_picker/image_picker.d.ts

@@ -0,0 +1,3 @@
+import { IImagePicker } from './image_picker_types';
+import React from 'react';
+export declare const ImagePicker: React.FC<IImagePicker>;