@dreamcommerce/aurora 3.0.0-90 → 3.0.0-91

package/build/esm/packages/aurora/src/components/typography/typography_types.d.ts

@@ -1,12 +1,12 @@
-import { TYPOGRAPHY_COMPONENT_TYPES } from "./typography_constants";
-import { Any } from 'ts-toolbelt';
-import { TCssTextColorTokens } from "../../constants/css_tokens/css_tokens_types";
-import type { VariantProps } from 'class-variance-authority';
-import { typographyVariants } from "./typography_variants";
-import * as React from 'react';
-export declare type TTypographyComponentTypes = Any.Keys<typeof TYPOGRAPHY_COMPONENT_TYPES>;
-export declare type TTypographyProps = React.HTMLAttributes<HTMLElement> & {
-    as?: TTypographyComponentTypes;
-    color?: TCssTextColorTokens;
-    style?: React.CSSProperties;
-} & VariantProps<typeof typographyVariants>;
+import { TYPOGRAPHY_COMPONENT_TYPES } from '@auroraComponents/typography/typography_constants';
+import { Any } from 'ts-toolbelt';
+import { TCssTextColorTokens } from '@auroraConstants/css_tokens/css_tokens_types';
+import type { VariantProps } from 'class-variance-authority';
+import { typographyVariants } from '@auroraComponents/typography/typography_variants';
+import * as React from 'react';
+export declare type TTypographyComponentTypes = Any.Keys<typeof TYPOGRAPHY_COMPONENT_TYPES>;
+export declare type TTypographyProps = React.HTMLAttributes<HTMLElement> & {
+    as?: TTypographyComponentTypes;
+    color?: TCssTextColorTokens;
+    style?: React.CSSProperties;
+} & VariantProps<typeof typographyVariants>;

package/build/esm/packages/aurora/src/components/typography/typography_variants.d.ts

@@ -1,8 +1 @@
-export declare const typographyVariants: (props?: ({
-    variant?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "caption" | null | undefined;
-    transform?: "uppercase" | "lowercase" | "capitalize" | null | undefined;
-    weight?: "normal" | "medium" | "semibold" | "bold" | "extrabold" | null | undefined;
-    size?: "xs" | "s" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
-    lineHeight?: "xs" | "s" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
-    defaultVariants?: "variant" | "weight" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const typographyVariants: any;

package/build/esm/packages/aurora/src/components/typography/typography_variants.js

@@ -1,22 +1,59 @@
-import { defineProperty as _defineProperty } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
-import { CSS_FONT_SIZE_TOKENS } from '../../constants/css_tokens/css_font_size_tokens.js';
-import { cva } from '../../../../../external/class-variance-authority/dist/index.mjs.js';
-import { TYPOGRAPHY_COMPONENT_TYPES, TYPOGRAPHY_TRANSFORM_TYPES, TYPOGRAPHY_WEIGHT_TYPES } from './typography_constants.js';
-import { CSS_LINE_HEIGHT_TOKENS } from '../../constants/css_tokens/css_line_height_tokens.js';
-
-var typographyVariants = cva('', {
-  variants: {
-    variant: _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, TYPOGRAPHY_COMPONENT_TYPES.h1, 'aurora-text-6xl aurora-font-bold aurora-tracking-4xs'), TYPOGRAPHY_COMPONENT_TYPES.h2, 'aurora-text-5xl aurora-font-bold aurora-tracking-3xs'), TYPOGRAPHY_COMPONENT_TYPES.h3, 'aurora-text-4xl aurora-font-bold aurora-tracking-2xs'), TYPOGRAPHY_COMPONENT_TYPES.h4, 'aurora-text-3xl aurora-font-bold aurora-tracking-xs'), TYPOGRAPHY_COMPONENT_TYPES.h5, 'aurora-text-2xl aurora-font-bold aurora-tracking-s'), TYPOGRAPHY_COMPONENT_TYPES.h6, 'aurora-text-xl aurora-font-bold'), TYPOGRAPHY_COMPONENT_TYPES.p, 'aurora-text-xs'), "caption", 'aurora-font-extrabold aurora-tracking-md aurora-uppercase'),
-    transform: _defineProperty(_defineProperty(_defineProperty({}, TYPOGRAPHY_TRANSFORM_TYPES.uppercase, 'aurora-uppercase'), TYPOGRAPHY_TRANSFORM_TYPES.lowercase, 'aurora-lowercase'), TYPOGRAPHY_TRANSFORM_TYPES.capitalize, 'aurora-capitalize'),
-    weight: _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, TYPOGRAPHY_WEIGHT_TYPES.normal, 'aurora-font-normal'), TYPOGRAPHY_WEIGHT_TYPES.medium, 'aurora-font-medium'), TYPOGRAPHY_WEIGHT_TYPES.semibold, 'aurora-font-semibold'), TYPOGRAPHY_WEIGHT_TYPES.bold, 'aurora-font-bold'), TYPOGRAPHY_WEIGHT_TYPES.extrabold, 'aurora-font-extrabold'),
-    size: _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, CSS_FONT_SIZE_TOKENS.xs, 'aurora-text-xs'), CSS_FONT_SIZE_TOKENS.s, 'aurora-text-s'), CSS_FONT_SIZE_TOKENS.md, 'aurora-text'), CSS_FONT_SIZE_TOKENS.lg, 'aurora-text-lg'), CSS_FONT_SIZE_TOKENS.xl, 'aurora-text-xl'), CSS_FONT_SIZE_TOKENS['2xl'], 'aurora-text-2xl'), CSS_FONT_SIZE_TOKENS['3xl'], 'aurora-text-3xl'), CSS_FONT_SIZE_TOKENS['4xl'], 'aurora-text-4xl'), CSS_FONT_SIZE_TOKENS['5xl'], 'aurora-text-5xl'), CSS_FONT_SIZE_TOKENS['6xl'], 'aurora-text-6xl'),
-    lineHeight: _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, CSS_LINE_HEIGHT_TOKENS.xs, 'aurora-line-height-xs'), CSS_LINE_HEIGHT_TOKENS.s, 'aurora-line-height-s'), CSS_LINE_HEIGHT_TOKENS.md, 'aurora-line-height'), CSS_LINE_HEIGHT_TOKENS.lg, 'aurora-line-height-lg'), CSS_LINE_HEIGHT_TOKENS.xl, 'aurora-line-height-xl'), CSS_LINE_HEIGHT_TOKENS['2xl'], 'aurora-line-height-2xl'), CSS_LINE_HEIGHT_TOKENS['3xl'], 'aurora-line-height-3xl'), CSS_LINE_HEIGHT_TOKENS['4xl'], 'aurora-line-height-4xl'), CSS_LINE_HEIGHT_TOKENS['5xl'], 'aurora-line-height-5xl'), CSS_LINE_HEIGHT_TOKENS['6xl'], 'aurora-line-height-6xl'),
-    defaultVariants: {
-      variant: TYPOGRAPHY_COMPONENT_TYPES.p,
-      weight: TYPOGRAPHY_WEIGHT_TYPES.normal
+import { cva } from 'class-variance-authority';
+import { TYPOGRAPHY_COMPONENT_TYPES, TYPOGRAPHY_TRANSFORM_TYPES, TYPOGRAPHY_WEIGHT_TYPES } from '@auroraComponents/typography/typography_constants';
+import { CSS_FONT_SIZE_TOKENS } from '@auroraConstants/css_tokens/css_font_size_tokens';
+import { CSS_LINE_HEIGHT_TOKENS } from '@auroraConstants/css_tokens/css_line_height_tokens';
+export const typographyVariants = cva('', {
+    variants: {
+        variant: {
+            [TYPOGRAPHY_COMPONENT_TYPES.h1]: 'aurora-text-6xl aurora-font-bold aurora-tracking-4xs',
+            [TYPOGRAPHY_COMPONENT_TYPES.h2]: 'aurora-text-5xl aurora-font-bold aurora-tracking-3xs',
+            [TYPOGRAPHY_COMPONENT_TYPES.h3]: 'aurora-text-4xl aurora-font-bold aurora-tracking-2xs',
+            [TYPOGRAPHY_COMPONENT_TYPES.h4]: 'aurora-text-3xl aurora-font-bold aurora-tracking-xs',
+            [TYPOGRAPHY_COMPONENT_TYPES.h5]: 'aurora-text-2xl aurora-font-bold aurora-tracking-s',
+            [TYPOGRAPHY_COMPONENT_TYPES.h6]: 'aurora-text-xl aurora-font-bold',
+            [TYPOGRAPHY_COMPONENT_TYPES.p]: 'aurora-text-xs',
+            caption: 'aurora-font-extrabold aurora-tracking-md aurora-uppercase'
+        },
+        transform: {
+            [TYPOGRAPHY_TRANSFORM_TYPES.uppercase]: 'aurora-uppercase',
+            [TYPOGRAPHY_TRANSFORM_TYPES.lowercase]: 'aurora-lowercase',
+            [TYPOGRAPHY_TRANSFORM_TYPES.capitalize]: 'aurora-capitalize'
+        },
+        weight: {
+            [TYPOGRAPHY_WEIGHT_TYPES.normal]: 'aurora-font-normal',
+            [TYPOGRAPHY_WEIGHT_TYPES.medium]: 'aurora-font-medium',
+            [TYPOGRAPHY_WEIGHT_TYPES.semibold]: 'aurora-font-semibold',
+            [TYPOGRAPHY_WEIGHT_TYPES.bold]: 'aurora-font-bold',
+            [TYPOGRAPHY_WEIGHT_TYPES.extrabold]: 'aurora-font-extrabold'
+        },
+        size: {
+            [CSS_FONT_SIZE_TOKENS.xs]: 'aurora-text-xs',
+            [CSS_FONT_SIZE_TOKENS.s]: 'aurora-text-s',
+            [CSS_FONT_SIZE_TOKENS.md]: 'aurora-text',
+            [CSS_FONT_SIZE_TOKENS.lg]: 'aurora-text-lg',
+            [CSS_FONT_SIZE_TOKENS.xl]: 'aurora-text-xl',
+            [CSS_FONT_SIZE_TOKENS['2xl']]: 'aurora-text-2xl',
+            [CSS_FONT_SIZE_TOKENS['3xl']]: 'aurora-text-3xl',
+            [CSS_FONT_SIZE_TOKENS['4xl']]: 'aurora-text-4xl',
+            [CSS_FONT_SIZE_TOKENS['5xl']]: 'aurora-text-5xl',
+            [CSS_FONT_SIZE_TOKENS['6xl']]: 'aurora-text-6xl'
+        },
+        lineHeight: {
+            [CSS_LINE_HEIGHT_TOKENS.xs]: 'aurora-line-height-xs',
+            [CSS_LINE_HEIGHT_TOKENS.s]: 'aurora-line-height-s',
+            [CSS_LINE_HEIGHT_TOKENS.md]: 'aurora-line-height',
+            [CSS_LINE_HEIGHT_TOKENS.lg]: 'aurora-line-height-lg',
+            [CSS_LINE_HEIGHT_TOKENS.xl]: 'aurora-line-height-xl',
+            [CSS_LINE_HEIGHT_TOKENS['2xl']]: 'aurora-line-height-2xl',
+            [CSS_LINE_HEIGHT_TOKENS['3xl']]: 'aurora-line-height-3xl',
+            [CSS_LINE_HEIGHT_TOKENS['4xl']]: 'aurora-line-height-4xl',
+            [CSS_LINE_HEIGHT_TOKENS['5xl']]: 'aurora-line-height-5xl',
+            [CSS_LINE_HEIGHT_TOKENS['6xl']]: 'aurora-line-height-6xl'
+        },
+        defaultVariants: {
+            variant: TYPOGRAPHY_COMPONENT_TYPES.p,
+            weight: TYPOGRAPHY_WEIGHT_TYPES.normal
+        }
     }
-  }
 });
-
-export { typographyVariants };
-//# sourceMappingURL=typography_variants.js.map
+//# sourceMappingURL=typography_variants.js.map

package/build/esm/packages/aurora/src/components/typography/typography_variants.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA,oBAAoB,oEAAwE;AAC5F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":"typography_variants.js","sourceRoot":"","sources":["../../../../../../../src/components/typography/typography_variants.ts"],"names":[],"mappings":"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"}

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

@@ -1,3 +1,3 @@
-import React from 'react';
-import { TValuesSyncerProps } from './values_syncer_types';
-export declare const ValuesSyncer: React.FC<TValuesSyncerProps>;
+import React from 'react';
+import { TValuesSyncerProps } from './values_syncer_types';
+export declare const ValuesSyncer: React.FC<TValuesSyncerProps>;

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

@@ -1,82 +1,43 @@
-import React, { useState, useEffect } from 'react';
-import { slicedToArray as _slicedToArray } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
-import { CSS_COLOR_TOKENS_VALUES } from '../../constants/css_tokens/css_color_tokens_values.js';
-import { cn } from '../../utilities/cn.js';
-import { Stack } from '../stack/stack.js';
-import { LockLineIcon } from '../../assets/icons/lock_icon.js';
-import { LockUnlockLineIcon } from '../../assets/icons/lock_unlock_icon.js';
-
-var ValuesSyncer = function ValuesSyncer(_ref) {
-  var firstControl = _ref.firstControl,
-    secondControl = _ref.secondControl,
-    initialFirstValue = _ref.initialFirstValue,
-    initialSecondValue = _ref.initialSecondValue,
-    _ref$isLocked = _ref.isLocked,
-    isLocked = _ref$isLocked === void 0 ? false : _ref$isLocked,
-    onLock = _ref.onLock,
-    onChange = _ref.onChange;
-  var _useState = useState(isLocked),
-    _useState2 = _slicedToArray(_useState, 2),
-    locked = _useState2[0],
-    setLocked = _useState2[1];
-  var _useState3 = useState(initialFirstValue),
-    _useState4 = _slicedToArray(_useState3, 2),
-    firstControlValue = _useState4[0],
-    setFirstControlValue = _useState4[1];
-  var _useState5 = useState(initialSecondValue),
-    _useState6 = _slicedToArray(_useState5, 2),
-    secondControlValue = _useState6[0],
-    setSecondControlValue = _useState6[1];
-  useEffect(function () {
-    onLock === null || onLock === void 0 ? void 0 : onLock(locked);
-    if (locked) {
-      setSecondControlValue(firstControlValue);
-    }
-  }, [locked]);
-  useEffect(function () {
-    setFirstControlValue(initialFirstValue);
-    setSecondControlValue(initialSecondValue);
-  }, [initialFirstValue, initialSecondValue]);
-  useEffect(function () {
-    onChange === null || onChange === void 0 ? void 0 : onChange({
-      first: firstControlValue,
-      second: secondControlValue,
-      isLocked: locked
-    });
-  }, [firstControlValue, secondControlValue, locked]);
-  var handleFirstControlChange = function handleFirstControlChange(value) {
-    setFirstControlValue(value);
-    if (locked) {
-      setSecondControlValue(value);
-    }
-  };
-  var handleSecondControlChange = function handleSecondControlChange(value) {
-    setSecondControlValue(value);
-    if (locked) {
-      setFirstControlValue(value);
-    }
-  };
-  var toggleLock = function toggleLock() {
-    return setLocked(function (prev) {
-      return !prev;
-    });
-  };
-  return /*#__PURE__*/React.createElement(Stack, {
-    spacing: "3",
-    align: "end",
-    className: "aurora-items-end"
-  }, firstControl(firstControlValue, handleFirstControlChange), /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    className: cn(locked ? 'aurora-bg-active aurora-rounded-4' : 'aurora-bg-subtle', 'aurora-h-6 aurora-w-6 aurora-p-1 aurora-mb-2 aurora-rounded-4 focus'),
-    onClick: toggleLock
-  }, locked ? (/*#__PURE__*/React.createElement(LockLineIcon, {
-    className: "aurora-h-4 aurora-w-4",
-    color: CSS_COLOR_TOKENS_VALUES.neutral900
-  })) : (/*#__PURE__*/React.createElement(LockUnlockLineIcon, {
-    className: "aurora-h-4 aurora-w-4",
-    color: CSS_COLOR_TOKENS_VALUES.neutral600
-  }))), secondControl(secondControlValue, handleSecondControlChange));
+import { LockLineIcon } from '@auroraAssets/icons/lock_icon';
+import { LockUnlockLineIcon } from '@auroraAssets/icons/lock_unlock_icon';
+import { Stack } from '@auroraComponents/stack/stack';
+import { CSS_COLOR_TOKENS_VALUES } from '@auroraConstants/css_tokens/css_color_tokens_values';
+import React, { useEffect, useState } from 'react';
+import './values_syncer_types';
+import { cn } from '@auroraUtilities/cn';
+export const ValuesSyncer = ({ firstControl, secondControl, initialFirstValue, initialSecondValue, isLocked = false, onLock, onChange }) => {
+    const [locked, setLocked] = useState(isLocked);
+    const [firstControlValue, setFirstControlValue] = useState(initialFirstValue);
+    const [secondControlValue, setSecondControlValue] = useState(initialSecondValue);
+    useEffect(() => {
+        onLock?.(locked);
+        if (locked) {
+            setSecondControlValue(firstControlValue);
+        }
+    }, [locked]);
+    useEffect(() => {
+        setFirstControlValue(initialFirstValue);
+        setSecondControlValue(initialSecondValue);
+    }, [initialFirstValue, initialSecondValue]);
+    useEffect(() => {
+        onChange?.({ first: firstControlValue, second: secondControlValue, isLocked: locked });
+    }, [firstControlValue, secondControlValue, locked]);
+    const handleFirstControlChange = (value) => {
+        setFirstControlValue(value);
+        if (locked) {
+            setSecondControlValue(value);
+        }
+    };
+    const handleSecondControlChange = (value) => {
+        setSecondControlValue(value);
+        if (locked) {
+            setFirstControlValue(value);
+        }
+    };
+    const toggleLock = () => setLocked((prev) => !prev);
+    return (React.createElement(Stack, { spacing: "3", align: "end", className: "aurora-items-end" },
+        firstControl(firstControlValue, handleFirstControlChange),
+        React.createElement("button", { type: "button", className: cn(locked ? 'aurora-bg-active aurora-rounded-4' : 'aurora-bg-subtle', 'aurora-h-6 aurora-w-6 aurora-p-1 aurora-mb-2 aurora-rounded-4 focus'), onClick: toggleLock }, locked ? (React.createElement(LockLineIcon, { className: "aurora-h-4 aurora-w-4", color: CSS_COLOR_TOKENS_VALUES.neutral900 })) : (React.createElement(LockUnlockLineIcon, { className: "aurora-h-4 aurora-w-4", color: CSS_COLOR_TOKENS_VALUES.neutral600 }))),
+        secondControl(secondControlValue, handleSecondControlChange)));
 };
-
-export { ValuesSyncer };
-//# sourceMappingURL=values_syncer.js.map
+//# sourceMappingURL=values_syncer.js.map

package/build/esm/packages/aurora/src/components/values_syncer/values_syncer.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;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;"}
+{"version":3,"file":"values_syncer.js","sourceRoot":"","sources":["../../../../../../../src/components/values_syncer/values_syncer.tsx"],"names":[],"mappings":"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"}

package/build/esm/packages/aurora/src/components/values_syncer/values_syncer_types.d.ts

@@ -1,14 +1,14 @@
-import React from 'react';
-export declare type TValuesSyncerProps = {
-    firstControl: (value: unknown, setValue: (value: unknown) => void) => React.ReactNode;
-    secondControl: (value: unknown, setValue: (value: unknown) => void) => React.ReactNode;
-    initialFirstValue?: unknown;
-    initialSecondValue?: unknown;
-    isLocked?: boolean;
-    onLock?: (isLocked: boolean) => void;
-    onChange?: (props: {
-        first: unknown;
-        second: unknown;
-        isLocked: boolean;
-    }) => void;
-};
+import React from 'react';
+export declare type TValuesSyncerProps = {
+    firstControl: (value: unknown, setValue: (value: unknown) => void) => React.ReactNode;
+    secondControl: (value: unknown, setValue: (value: unknown) => void) => React.ReactNode;
+    initialFirstValue?: unknown;
+    initialSecondValue?: unknown;
+    isLocked?: boolean;
+    onLock?: (isLocked: boolean) => void;
+    onChange?: (props: {
+        first: unknown;
+        second: unknown;
+        isLocked: boolean;
+    }) => void;
+};

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

@@ -1,3 +1,5 @@
-import React from 'react';
-import { IXhrImagePickerProps } from './xhr_image_picker_types';
-export declare const XhrImagePicker: React.FC<IXhrImagePickerProps>;
+import React from 'react';
+import { IXhrImagePickerProps } from './xhr_image_picker_types';
+export declare const XhrImagePicker: React.FC<IXhrImagePickerProps>;
+declare const _default: React.FC<React.PropsWithChildren<IXhrImagePickerProps>>;
+export default _default;

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

@@ -1,194 +1,104 @@
-import React, { useRef, useState, useEffect } from 'react';
-import { useTranslation } from '../../../../../external/react-i18next/dist/es/useTranslation.js';
-import { slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
-import { Loader } from '../loader/loader.js';
-import { useModalsContext } from '../modal/hooks/use_modals_context.js';
-import { Modal } from '../modal/components/modal/modal.js';
+import React, { useEffect, useRef, useState } from 'react';
 import { FileUtils } from '@dreamcommerce/utilities';
-import { IMAGE_PICKER_EXTENSIONS } from '../image_picker/image_picker_constants.js';
-import { ImagePicker } from '../image_picker/image_picker.js';
-import { REQUEST_TYPES } from '../../../../star_core/build/esm/packages/star_core/src/features/http_requester/http_requester_contants.js';
-import { useHttpApi } from '../../hooks/use_http_api.js';
-import { ImageEditLineIcon } from '../../assets/icons/image_edit_icon.js';
-
-var XhrImagePicker = function XhrImagePicker(_ref) {
-  var id = _ref.id,
-    url = _ref.url,
-    name = _ref.name,
-    onUploaded = _ref.onUploaded,
-    initialFile = _ref.initialFile,
-    errors = _ref.errors,
-    onError = _ref.onError,
-    onChange = _ref.onChange,
-    onImageSizeUpdated = _ref.onImageSizeUpdated,
-    _ref$allowedExtension = _ref.allowedExtensions,
-    allowedExtensions = _ref$allowedExtension === void 0 ? [IMAGE_PICKER_EXTENSIONS.WEBP, IMAGE_PICKER_EXTENSIONS.JPG, IMAGE_PICKER_EXTENSIONS.PNG, IMAGE_PICKER_EXTENSIONS.GIF, IMAGE_PICKER_EXTENSIONS.SVG, IMAGE_PICKER_EXTENSIONS.JPEG] : _ref$allowedExtension,
-    ImageEditor = _ref.ImageEditor;
-  var _useTranslation = useTranslation(),
-    _useTranslation2 = _slicedToArray(_useTranslation, 1),
-    t = _useTranslation2[0];
-  var httpApi = useHttpApi();
-  var pendingRequestRef = React.useRef();
-  var initialImageFile = useRef();
-  var _useModalsContext = useModalsContext(),
-    showModal = _useModalsContext.showModal,
-    hideModal = _useModalsContext.hideModal;
-  var modalId = "image-picker-editor-".concat(id);
-  var _useState = useState(),
-    _useState2 = _slicedToArray(_useState, 2),
-    initialImage = _useState2[0],
-    setInitialImage = _useState2[1];
-  var _useState3 = useState(),
-    _useState4 = _slicedToArray(_useState3, 2),
-    image = _useState4[0],
-    setImage = _useState4[1];
-  var _useState5 = useState(''),
-    _useState6 = _slicedToArray(_useState5, 2),
-    imageEditorSrc = _useState6[0],
-    setImageEditorSrc = _useState6[1];
-  var _useState7 = useState(),
-    _useState8 = _slicedToArray(_useState7, 2),
-    imageEditorResult = _useState8[0],
-    setImageEditorResult = _useState8[1];
-  var _useState9 = useState(false),
-    _useState10 = _slicedToArray(_useState9, 2),
-    isLoading = _useState10[0],
-    setIsLoading = _useState10[1];
-  var _useState11 = useState(),
-    _useState12 = _slicedToArray(_useState11, 2),
-    imageExtenstion = _useState12[0],
-    setImageExtenstion = _useState12[1];
-  var handleControlChange = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(file) {
-      var fileList, fileAsDataUrl, _httpApi$fetch, response, cancelRequest, responseObject;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            fileList = file.fileList, fileAsDataUrl = file.fileAsDataUrl;
-            fileList && setImage(fileList[0]);
-            onChange === null || onChange === void 0 ? void 0 : onChange({
-              fileList: fileList,
-              fileAsDataUrl: fileAsDataUrl
-            });
-            if (!(!fileList || !fileList.length)) {
-              _context.next = 5;
-              break;
-            }
-            return _context.abrupt("return");
-          case 5:
-            if (pendingRequestRef.current) {
-              pendingRequestRef.current();
-              pendingRequestRef.current = undefined;
-            }
-            setIsLoading(true);
-            _httpApi$fetch = httpApi.fetch({
-              url: url,
-              method: REQUEST_TYPES.post,
-              data: fileList[0]
-            }), response = _httpApi$fetch.response, cancelRequest = _httpApi$fetch.cancelRequest;
-            pendingRequestRef.current = cancelRequest;
-            _context.next = 11;
-            return response.finally(function () {
-              return setIsLoading(false);
-            });
-          case 11:
-            responseObject = _context.sent;
-            onUploaded === null || onUploaded === void 0 ? void 0 : onUploaded({
-              fileList: fileList,
-              dataUrl: fileAsDataUrl,
-              imageId: responseObject.data.imageId
-            });
-          case 13:
-          case "end":
-            return _context.stop();
+import { REQUEST_TYPES } from '@dreamcommerce/star_core';
+import { useHttpApi } from '@auroraHooks/use_http_api';
+import { useTranslation } from 'react-i18next';
+import { useModalsContext } from '@auroraComponents/modal/hooks/use_modals_context';
+import { IMAGE_PICKER_EXTENSIONS } from '@auroraComponents/image_picker/image_picker_constants';
+import { ImagePicker } from '@auroraComponents/image_picker/image_picker';
+import { Loader } from '@auroraComponents/loader/loader';
+import { Modal } from '@auroraComponents/modal/components/modal/modal';
+import './xhr_image_picker_types';
+import '@auroraComponents/image_picker/image_picker_types';
+import { ImageEditLineIcon } from '@auroraAssets/icons/image_edit_icon';
+import { withTranslation } from '@auroraUtilities/translation/with_translation';
+export const XhrImagePicker = ({ id, url, name, onUploaded, initialFile, errors, onError, onChange, onImageSizeUpdated, allowedExtensions = [
+    IMAGE_PICKER_EXTENSIONS.WEBP,
+    IMAGE_PICKER_EXTENSIONS.JPG,
+    IMAGE_PICKER_EXTENSIONS.PNG,
+    IMAGE_PICKER_EXTENSIONS.GIF,
+    IMAGE_PICKER_EXTENSIONS.SVG,
+    IMAGE_PICKER_EXTENSIONS.JPEG
+], ImageEditor }) => {
+    const [t] = useTranslation();
+    const httpApi = useHttpApi();
+    const pendingRequestRef = React.useRef();
+    const initialImageFile = useRef();
+    const { showModal, hideModal } = useModalsContext();
+    const modalId = `image-picker-editor-${id}`;
+    const [initialImage, setInitialImage] = useState();
+    const [image, setImage] = useState();
+    const [imageEditorSrc, setImageEditorSrc] = useState('');
+    const [imageEditorResult, setImageEditorResult] = useState();
+    const [isLoading, setIsLoading] = useState(false);
+    const [imageExtenstion, setImageExtenstion] = useState();
+    const handleControlChange = async (file) => {
+        const { fileList, fileAsDataUrl } = file;
+        fileList && setImage(fileList[0]);
+        onChange?.({ fileList, fileAsDataUrl });
+        if (!fileList || !fileList.length)
+            return;
+        if (pendingRequestRef.current) {
+            pendingRequestRef.current();
+            pendingRequestRef.current = undefined;
         }
-      }, _callee);
-    }));
-    return function handleControlChange(_x) {
-      return _ref2.apply(this, arguments);
+        setIsLoading(true);
+        const { response, cancelRequest } = httpApi.fetch({
+            url,
+            method: REQUEST_TYPES.post,
+            data: fileList[0]
+        });
+        pendingRequestRef.current = cancelRequest;
+        const responseObject = await response.finally(() => setIsLoading(false));
+        onUploaded?.({
+            fileList,
+            dataUrl: fileAsDataUrl,
+            imageId: responseObject.data.imageId
+        });
     };
-  }();
-  useEffect(function () {
-    if (initialFile) {
-      setImageExtenstion(FileUtils.getFileExtension(initialFile === null || initialFile === void 0 ? void 0 : initialFile.fileName));
-      initialImageFile.current = initialFile;
-      var setFileFromUrl = /*#__PURE__*/function () {
-        var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2(fileData) {
-          var response, data, file;
-          return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-            while (1) switch (_context2.prev = _context2.next) {
-              case 0:
-                _context2.next = 2;
-                return fetch(fileData.fileUrl);
-              case 2:
-                response = _context2.sent;
-                _context2.next = 5;
-                return response.blob();
-              case 5:
-                data = _context2.sent;
-                file = new File([data], fileData.fileName);
+    useEffect(() => {
+        if (initialFile) {
+            setImageExtenstion(FileUtils.getFileExtension(initialFile?.fileName));
+            initialImageFile.current = initialFile;
+            const setFileFromUrl = async (fileData) => {
+                const response = await fetch(fileData.fileUrl);
+                const data = await response.blob();
+                const file = new File([data], fileData.fileName);
                 setInitialImage(file);
-              case 8:
-              case "end":
-                return _context2.stop();
-            }
-          }, _callee2);
-        }));
-        return function setFileFromUrl(_x2) {
-          return _ref3.apply(this, arguments);
-        };
-      }();
-      if (!initialImageFile.current) return;
-      setFileFromUrl(initialImageFile.current);
-    }
-  }, []);
-  useEffect(function () {
-    image && setImageExtenstion(FileUtils.getFileExtension(image === null || image === void 0 ? void 0 : image.name));
-    return function () {
-      var _pendingRequestRef$cu;
-      return (_pendingRequestRef$cu = pendingRequestRef.current) === null || _pendingRequestRef$cu === void 0 ? void 0 : _pendingRequestRef$cu.call(pendingRequestRef);
+            };
+            if (!initialImageFile.current)
+                return;
+            setFileFromUrl(initialImageFile.current);
+        }
+    }, []);
+    useEffect(() => {
+        image && setImageExtenstion(FileUtils.getFileExtension(image?.name));
+        return () => pendingRequestRef.current?.();
+    }, [image]);
+    useEffect(() => {
+        const src = image ?? initialImage;
+        setImageEditorSrc(src ?? '');
+    }, [image, initialImage, isLoading]);
+    const renderImageEditor = (defaultProps) => {
+        return ImageEditor ? (React.createElement("div", null,
+            React.createElement(ImageEditor, { ...defaultProps }))) : null;
     };
-  }, [image]);
-  useEffect(function () {
-    var src = image !== null && image !== void 0 ? image : initialImage;
-    setImageEditorSrc(src !== null && src !== void 0 ? src : '');
-  }, [image, initialImage, isLoading]);
-  var renderImageEditor = function renderImageEditor(defaultProps) {
-    return ImageEditor ? (/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ImageEditor, _objectSpread2({}, defaultProps)))) : null;
-  };
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ImagePicker, {
-    id: id,
-    name: name,
-    onChange: handleControlChange,
-    onError: onError,
-    errors: errors,
-    allowedExtensions: allowedExtensions,
-    initialFile: initialImageFile.current,
-    onImageSizeUpdated: onImageSizeUpdated,
-    topButtons: !!ImageEditor && imageExtenstion !== 'svg' && (/*#__PURE__*/React.createElement("button", {
-      onClick: function onClick() {
-        return showModal(modalId);
-      },
-      type: "button",
-      className: " aurora-absolute aurora-top-2 aurora-right-2 aurora-flex aurora-items-center aurora-gap-1 aurora-border aurora-rounded-full aurora-px-3 aurora-py-[6px] aurora-bg"
-    }, /*#__PURE__*/React.createElement(ImageEditLineIcon, {
-      className: "aurora-w-4 aurora-h-4 aurora-fill"
-    }), /*#__PURE__*/React.createElement("span", {
-      className: "aurora-text-xs aurora-text aurora-font-semibold"
-    }, "".concat(t('Edit'))))),
-    editedImageResult: imageEditorResult
-  }), isLoading && (/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Loader, null), /*#__PURE__*/React.createElement("span", null, "".concat(t('Transfering file...')))))), !!ImageEditor && (/*#__PURE__*/React.createElement(Modal, {
-    name: modalId,
-    header: t('Edit image'),
-    width: "l"
-  }, renderImageEditor({
-    src: imageEditorSrc,
-    onEditionDone: function onEditionDone(result) {
-      hideModal(modalId);
-      setImageEditorResult(result);
-    }
-  }))));
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", null,
+            React.createElement(ImagePicker, { id: id, name: name, onChange: handleControlChange, onError: onError, errors: errors, allowedExtensions: allowedExtensions, initialFile: initialImageFile.current, onImageSizeUpdated: onImageSizeUpdated, topButtons: !!ImageEditor &&
+                    imageExtenstion !== 'svg' && (React.createElement("button", { onClick: () => showModal(modalId), type: "button", className: " aurora-absolute aurora-top-2 aurora-right-2 aurora-flex aurora-items-center aurora-gap-1 aurora-border aurora-rounded-full aurora-px-3 aurora-py-[6px] aurora-bg" },
+                    React.createElement(ImageEditLineIcon, { className: "aurora-w-4 aurora-h-4 aurora-fill" }),
+                    React.createElement("span", { className: "aurora-text-xs aurora-text aurora-font-semibold" }, `${t('Edit')}`))), editedImageResult: imageEditorResult }),
+            isLoading && (React.createElement("div", null,
+                React.createElement(Loader, null),
+                React.createElement("span", null, `${t('Transfering file...')}`)))),
+        !!ImageEditor && (React.createElement(Modal, { name: modalId, header: t('Edit image'), width: "l" }, renderImageEditor({
+            src: imageEditorSrc,
+            onEditionDone: (result) => {
+                hideModal(modalId);
+                setImageEditorResult(result);
+            }
+        })))));
 };
-
-export { XhrImagePicker };
-//# sourceMappingURL=xhr_image_picker.js.map
+export default withTranslation(XhrImagePicker);
+//# sourceMappingURL=xhr_image_picker.js.map