@dreamcommerce/aurora 3.0.0-98 → 3.0.0

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

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useRef, useCallback, 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';
@@ -9,73 +9,98 @@ 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,
+    firstValue = _ref.firstValue,
+    secondValue = _ref.secondValue,
+    isLocked = _ref.isLocked,
     onLock = _ref.onLock,
-    onChange = _ref.onChange;
-  var _useState = useState(isLocked),
+    _ref$disableLockButto = _ref.disableLockButton,
+    disableLockButton = _ref$disableLockButto === void 0 ? false : _ref$disableLockButto,
+    onChange = _ref.onChange,
+    className = _ref.className;
+  var _useState = useState(isLocked !== null && isLocked !== void 0 ? isLocked : false),
     _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);
+  var firstValueRef = useRef(firstValue);
+  var secondValueRef = useRef(secondValue);
+  var lockedRef = useRef(locked);
+  var handleFirstControlChange = useCallback(function (value) {
+    firstValueRef.current = value;
     if (locked) {
-      setSecondControlValue(firstControlValue);
+      onChange === null || onChange === void 0 ? void 0 : onChange({
+        first: value,
+        second: value,
+        isLocked: locked
+      });
+    } else {
+      onChange === null || onChange === void 0 ? void 0 : onChange({
+        first: value,
+        second: secondValue,
+        isLocked: locked
+      });
     }
-  }, [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);
+  }, [locked, onChange, secondValue]);
+  var handleSecondControlChange = useCallback(function (value) {
+    secondValueRef.current = value;
     if (locked) {
-      setSecondControlValue(value);
+      onChange === null || onChange === void 0 ? void 0 : onChange({
+        first: value,
+        second: value,
+        isLocked: locked
+      });
+    } else {
+      onChange === null || onChange === void 0 ? void 0 : onChange({
+        first: firstValue,
+        second: value,
+        isLocked: locked
+      });
     }
-  };
-  var handleSecondControlChange = function handleSecondControlChange(value) {
-    setSecondControlValue(value);
-    if (locked) {
-      setFirstControlValue(value);
+  }, [firstValue, locked, onChange]);
+  var handleLockedChange = useCallback(function (newLock) {
+    var triggerOnLock = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+    setLocked(newLock);
+    lockedRef.current = newLock;
+    if (triggerOnLock && onLock) onLock(newLock);
+    if (newLock) {
+      onChange === null || onChange === void 0 ? void 0 : onChange({
+        first: firstValue,
+        second: firstValue,
+        isLocked: newLock
+      });
     }
-  };
-  var toggleLock = function toggleLock() {
-    return setLocked(function (prev) {
-      return !prev;
-    });
-  };
+  }, [firstValue, onChange, onLock]);
+  // Reagujemy na zmiany wszystkiego co przychodzi z gory
+  // zebysmy nigdy nie skonczyli z nielegalnym stanem -> first !== second && locked
+  useEffect(function () {
+    if (isLocked === undefined || isLocked === lockedRef.current) return;
+    handleLockedChange(isLocked, false);
+  }, [isLocked, handleLockedChange]);
+  useEffect(function () {
+    if (firstValue === firstValueRef.current && secondValue === secondValueRef.current) return;
+    firstValueRef.current = firstValue;
+    secondValueRef.current = secondValue;
+    if (firstValue !== secondValue) {
+      handleLockedChange(false);
+    }
+  }, [firstValue, secondValue, handleLockedChange]);
   return /*#__PURE__*/React.createElement(Stack, {
     spacing: "3",
     align: "end",
-    className: "aurora-items-end"
-  }, firstControl(firstControlValue, handleFirstControlChange), /*#__PURE__*/React.createElement("button", {
+    className: cn('aurora-items-end', className)
+  }, firstControl(firstValue, handleFirstControlChange), /*#__PURE__*/React.createElement("button", {
     type: "button",
+    disabled: disableLockButton,
     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, {
+    onClick: function onClick() {
+      return handleLockedChange(!locked);
+    }
+  }, locked && !disableLockButton ? (/*#__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));
+  }))), secondControl(secondValue, handleSecondControlChange));
 };
 
 export { ValuesSyncer };

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":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;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/values_syncer/values_syncer_types.d.ts

@@ -1,14 +1,16 @@
 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;
+export declare type TValuesSyncerProps<T> = {
+    firstControl: (value: T, setValue: (value: T) => void) => React.ReactNode;
+    secondControl: (value: T, setValue: (value: T) => void) => React.ReactNode;
+    firstValue: T;
+    secondValue: T;
     isLocked?: boolean;
     onLock?: (isLocked: boolean) => void;
+    disableLockButton?: boolean;
     onChange?: (props: {
-        first: unknown;
-        second: unknown;
+        first: T;
+        second: T;
         isLocked: boolean;
     }) => void;
+    className?: string;
 };

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

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

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

@@ -4,12 +4,12 @@ import { slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, async
 import { Loader } from '../loader/loader.js';
 import { useModalsContext } from '../modal/hooks/use_modals_context.js';
 import { Modal } from '../modal/components/modal/modal.js';
-import { FileUtils } from '@dreamcommerce/utilities';
 import { IMAGE_PICKER_EXTENSIONS } from '../image_picker/image_picker_constants.js';
+import { FileUtils } from '@dreamcommerce/utilities';
 import { ImagePicker } from '../image_picker/image_picker.js';
+import { ImageEditLineIcon } from '../../assets/icons/image_edit_icon.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,
@@ -23,6 +23,7 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
     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,
+    allowedExtensionsLabel = _ref.allowedExtensionsLabel,
     ImageEditor = _ref.ImageEditor;
   var _useTranslation = useTranslation(),
     _useTranslation2 = _slicedToArray(_useTranslation, 1),
@@ -156,13 +157,22 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
   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, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "aurora-relative"
+  }, isLoading && (/*#__PURE__*/React.createElement("div", {
+    className: "aurora-absolute aurora-z-30 aurora-h-full aurora-w-full"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "aurora-bg aurora-h-full aurora-w-full aurora-border aurora-border-dashed aurora-rounded-8 aurora-flex aurora-flex-col aurora-items-center aurora-justify-center"
+  }, /*#__PURE__*/React.createElement(Loader, null), /*#__PURE__*/React.createElement("span", {
+    className: "aurora-text-subtle-light aurora-text-xs aurora-pt-2"
+  }, "".concat(t('Transfering file...')))))), /*#__PURE__*/React.createElement(ImagePicker, {
     id: id,
     name: name,
     onChange: handleControlChange,
     onError: onError,
     errors: errors,
     allowedExtensions: allowedExtensions,
+    allowedExtensionsLabel: allowedExtensionsLabel,
     initialFile: initialImageFile.current,
     onImageSizeUpdated: onImageSizeUpdated,
     topButtons: !!ImageEditor && imageExtenstion !== 'svg' && (/*#__PURE__*/React.createElement("button", {
@@ -170,16 +180,16 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
         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"
+      className: "aurora-absolute aurora-top-2 aurora-right-2 aurora-z-10 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, {
+  })), !!ImageEditor && (/*#__PURE__*/React.createElement(Modal, {
     name: modalId,
-    header: t('Edit image'),
+    header: /*#__PURE__*/React.createElement(React.Fragment, null, t('Edit image')),
     width: "l"
   }, renderImageEditor({
     src: imageEditorSrc,

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

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,iEAAqE;AACpG;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;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;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,+BAA+B,iEAAqE;AACpG;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;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;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/constants/css_tokens/css_background_tokens.d.ts

@@ -2,6 +2,7 @@ export declare const CSS_BACKGROUND_TOKENS: {
     readonly hover: "hover";
     readonly active: "active";
     readonly subtle: "subtle";
+    readonly subtleStrong: "subtle-strong";
     readonly transparent: "transparent";
     readonly transparentHover: "transparent-hover";
     readonly transparentActive: "transparent-active";

package/build/esm/packages/aurora/src/constants/css_tokens/css_background_tokens.js

@@ -2,6 +2,7 @@ var CSS_BACKGROUND_TOKENS = {
   hover: 'hover',
   active: 'active',
   subtle: 'subtle',
+  subtleStrong: 'subtle-strong',
   transparent: 'transparent',
   transparentHover: 'transparent-hover',
   transparentActive: 'transparent-active',

package/build/esm/packages/aurora/src/constants/css_tokens/css_background_tokens.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;"}
+{"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;"}

package/build/esm/packages/aurora/src/constants/css_tokens/css_border_color_tokens.d.ts

@@ -1,6 +1,7 @@
 export declare const CSS_BORDER_COLOR_TOKENS: {
     readonly subtle: "subtle";
     readonly strong: "strong";
+    readonly extraStrong: "extraStrong";
     readonly active: "active";
     readonly inverse: "inverse";
     readonly inverseSubtle: "inverse-subtle";

package/build/esm/packages/aurora/src/constants/css_tokens/css_border_color_tokens.js

@@ -1,6 +1,7 @@
 var CSS_BORDER_COLOR_TOKENS = {
   subtle: 'subtle',
   strong: 'strong',
+  extraStrong: 'extraStrong',
   active: 'active',
   inverse: 'inverse',
   inverseSubtle: 'inverse-subtle',

package/build/esm/packages/aurora/src/constants/css_tokens/css_border_color_tokens.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;"}
+{"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;"}

package/build/esm/packages/aurora/src/hooks/use_click_outside.d.ts

@@ -1,19 +1,13 @@
-/// <reference types="react" />
+import React from 'react';
 export declare type TClickOutsideConfig = {
     blackListSelectors?: string[];
     documents?: Document[];
     shouldTrigger?: (event: MouseEvent) => boolean;
+    eventName?: 'click' | 'mousedown';
 };
 export declare type TUseClickOutsideProps = {
     refs: Array<React.RefObject<HTMLElement>>;
     callback: () => void;
     config?: TClickOutsideConfig;
 };
-/**
- * adds listener on mousedown event which detects if click was inside elemnents provided in refs array. If click was
- * made outside element callback function is called
- * @param {Array<React.RefObject<HTMLElement>>} refs array of refs
- * @param {Function} callback called when click is made outside refs elements
- * @returns {void} void
- */
 export declare function useClickOutside({ refs, config, callback }: TUseClickOutsideProps): void;

package/build/esm/packages/aurora/src/hooks/use_click_outside.js

@@ -1,12 +1,5 @@
 import { useEffect } from 'react';
 
-/**
- * adds listener on mousedown event which detects if click was inside elemnents provided in refs array. If click was
- * made outside element callback function is called
- * @param {Array<React.RefObject<HTMLElement>>} refs array of refs
- * @param {Function} callback called when click is made outside refs elements
- * @returns {void} void
- */
 function useClickOutside(_ref) {
   var refs = _ref.refs,
     config = _ref.config,
@@ -15,8 +8,15 @@ function useClickOutside(_ref) {
     _ref2$documents = _ref2.documents,
     documents = _ref2$documents === void 0 ? [globalThis.document] : _ref2$documents,
     _ref2$blackListSelect = _ref2.blackListSelectors,
-    blackListSelectors = _ref2$blackListSelect === void 0 ? [] : _ref2$blackListSelect;
+    blackListSelectors = _ref2$blackListSelect === void 0 ? [] : _ref2$blackListSelect,
+    _ref2$eventName = _ref2.eventName,
+    eventName = _ref2$eventName === void 0 ? 'mousedown' : _ref2$eventName;
   function handleClickOutside(event) {
+    // Don't trigger if text is being selected
+    var selection = window.getSelection();
+    if (selection && selection.toString().length > 0) {
+      return;
+    }
     var isBlacklisted = blackListSelectors.reduce(function test(acc, blackListSelector) {
       var $el = documents.reduce(function test(acc, doc) {
         return acc || doc.querySelector(blackListSelector);
@@ -32,11 +32,11 @@ function useClickOutside(_ref) {
   }
   useEffect(function () {
     documents.forEach(function (document) {
-      return document.addEventListener('click', handleClickOutside, true);
+      return document.addEventListener(eventName, handleClickOutside, true);
     });
     return function () {
       documents.forEach(function (document) {
-        return document.removeEventListener('click', handleClickOutside, true);
+        return document.removeEventListener(eventName, handleClickOutside, true);
       });
     };
   });

package/build/esm/packages/aurora/src/hooks/use_resize_observer.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface Size {
+    width: number;
+    height: number;
+}
+export declare const useResizeObserver: <T extends HTMLElement>(ref: React.RefObject<T>, callback?: ((size: Size) => void) | undefined) => Size | null;
+export {};

package/build/esm/packages/aurora/src/hooks/use_resize_observer.js

@@ -0,0 +1,47 @@
+import { useState, useRef, useEffect } from 'react';
+import { slicedToArray as _slicedToArray, createForOfIteratorHelper as _createForOfIteratorHelper } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+
+var useResizeObserver = function useResizeObserver(ref, callback) {
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    size = _useState2[0],
+    setSize = _useState2[1];
+  var observerRef = useRef(null);
+  useEffect(function () {
+    var element = ref.current;
+    if (!element) return;
+    var handleResize = function handleResize(entries) {
+      var _iterator = _createForOfIteratorHelper(entries),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var entry = _step.value;
+          var _entry$contentRect = entry.contentRect,
+            width = _entry$contentRect.width,
+            height = _entry$contentRect.height;
+          var newSize = {
+            width: width,
+            height: height
+          };
+          setSize(newSize);
+          callback === null || callback === void 0 ? void 0 : callback(newSize);
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    };
+    observerRef.current = new ResizeObserver(handleResize);
+    observerRef.current.observe(element);
+    return function () {
+      var _observerRef$current;
+      (_observerRef$current = observerRef.current) === null || _observerRef$current === void 0 ? void 0 : _observerRef$current.disconnect();
+      observerRef.current = null;
+    };
+  }, [callback, ref]);
+  return size;
+};
+
+export { useResizeObserver };
+//# sourceMappingURL=use_resize_observer.js.map

package/build/esm/packages/aurora/src/hooks/use_resize_observer.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;"}

package/build/esm/packages/aurora/src/hooks/use_scroll.d.ts

@@ -0,0 +1,5 @@
+import { RefObject } from 'react';
+export declare function useScroll(elRef: RefObject<HTMLDivElement | null>): {
+    atTop: boolean;
+    atBottom: boolean;
+};

package/build/esm/packages/aurora/src/hooks/use_scroll.js

@@ -0,0 +1,37 @@
+import { useState, useEffect, useMemo } from 'react';
+import { slicedToArray as _slicedToArray } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+
+function useScroll(elRef) {
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    atTop = _useState2[0],
+    setAtTop = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    atBottom = _useState4[0],
+    setAtBottom = _useState4[1];
+  useEffect(function () {
+    var element = elRef.current;
+    if (!element) return;
+    function handleScroll() {
+      if (!element) return;
+      setAtTop(element.scrollTop === 0);
+      var bottom = element.scrollHeight - element.scrollTop === element.clientHeight;
+      setAtBottom(bottom);
+    }
+    handleScroll();
+    element.addEventListener('scroll', handleScroll);
+    return function () {
+      return element.removeEventListener('scroll', handleScroll);
+    };
+  }, [elRef]);
+  return useMemo(function () {
+    return {
+      atTop: atTop,
+      atBottom: atBottom
+    };
+  }, [atTop, atBottom]);
+}
+
+export { useScroll };
+//# sourceMappingURL=use_scroll.js.map

package/build/esm/packages/aurora/src/hooks/use_scroll.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;"}

package/build/esm/packages/aurora/src/hooks/use_timeout.d.ts

@@ -0,0 +1,4 @@
+export declare const useTimeout: () => {
+    set: (callback: () => void, delay: number) => ReturnType<typeof setTimeout>;
+    clear: () => void;
+};

package/build/esm/packages/aurora/src/hooks/use_timeout.js

@@ -0,0 +1,43 @@
+import { useRef, useCallback, useEffect, useMemo } from 'react';
+
+var useTimeout = function useTimeout() {
+  var timeoutRef = useRef();
+  /**
+   * Creates a timeout that will execute the callback after the specified delay
+   * @param callback - Function to execute after the delay
+   * @param delay - Delay in milliseconds
+   * @returns The timeout ID
+   */
+  var set = useCallback(function (callback, delay) {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+    }
+    timeoutRef.current = setTimeout(function () {
+      callback();
+      timeoutRef.current = undefined;
+    }, delay);
+    return timeoutRef.current;
+  }, []);
+  var clear = useCallback(function () {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = undefined;
+    }
+  }, []);
+  useEffect(function () {
+    return function () {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    };
+  }, []);
+  return useMemo(function () {
+    return {
+      set: set,
+      clear: clear
+    };
+  }, [set, clear]);
+};
+
+export { useTimeout };
+//# sourceMappingURL=use_timeout.js.map

package/build/esm/packages/aurora/src/hooks/use_timeout.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;"}

package/build/esm/packages/aurora/src/i18n.d.ts

@@ -1,2 +1 @@
-declare const i18n: import("i18next").i18n;
-export default i18n;
+export declare const i18n: import("i18next").i18n;

package/build/esm/packages/aurora/src/i18n.js

@@ -22,5 +22,5 @@ i18n.use(initReactI18next).init({
   }
 });
 
-export default i18n;
+export { i18n };
 //# sourceMappingURL=i18n.js.map

package/build/esm/packages/aurora/src/index.d.ts

@@ -1,5 +1,5 @@
 import './i18n';
-export * from './i18n';
+export { i18n } from './i18n';
 export { Accordion } from "./components/accordion/accordion";
 export { AccordionContent } from "./components/accordion/components/accordion_content";
 export { AccordionItem } from "./components/accordion/components/accordion_item";
@@ -17,6 +17,7 @@ export { ActionListPortal } from "./components/action_list/components/action_lis
 export { ActionListSub } from "./components/action_list/components/action_list_sub";
 export { ActionListRadioGroup } from "./components/action_list/components/action_list_radio_group";
 export { ActionListRadioItem } from "./components/action_list/components/action_list_radio_item";
+export { ActionListRadioSubTrigger } from "./components/action_list/components/action_list_radio_sub_trigger";
 export { ActionListTrigger } from "./components/action_list/components/action_list_trigger";
 export { ActionListSubContent } from "./components/action_list/components/action_list_sub_content";
 export { Badge } from './components/badge/badge';
@@ -28,6 +29,7 @@ export { TYPOGRAPHY_TRANSFORM_TYPES, TYPOGRAPHY_COMPONENT_TYPES, TYPOGRAPHY_WEIG
 export { Sidebar } from './components/sidebar/sidebar';
 export { SidebarToggle } from "./components/sidebar/components/sidebar_toggle";
 export { useSidebar } from './components/sidebar/hooks/use_sidebar';
+export { SidebarCloseButton } from "./components/sidebar/components/sidebar_close_button";
 export { SIDEBAR_SIDE, SIDEBAR_VARIANTS } from "./components/sidebar/sidebar_constants";
 export { Divider } from './components/divider/divider';
 export { DIVIDER_VARIANTS, DIVIDER_THICKNESS, DIVIDER_ORIENTATION } from "./components/divider/divider_constants";
@@ -41,6 +43,7 @@ export { TOOLTIP_VARIANT_TYPES } from "./components/tooltip/tooltip_constants";
 export { SegmentedControl } from "./components/segmented_control/segmented_control";
 export { SegmentedControlItem } from "./components/segmented_control/components/segmented_control_item";
 export { SEGMENTED_CONTROL_SIZE_TYPES, SEGMENTED_CONTROL_VARIANT_TYPES, SEGMENTED_CONTROL_TYPE } from "./components/segmented_control/segmented_control_constants";
+export { SegmentedControlControl } from './components/controls/segmented_control_control/segmented_control_control';
 export { Button } from "./components/button/button";
 export { BUTTON_VARIANTS, BUTTON_SIZES } from "./components/button/button_constants";
 export { IconButton } from "./components/icon_button/icon_button";
@@ -71,6 +74,7 @@ export { CSS_POSITION_TOKENS } from "./constants/css_tokens/css_position_tokens"
 export { CSS_BOX_SHADOW_TOKENS } from "./constants/css_tokens/css_box_shadow_tokens";
 export { CSS_BORDER_COLOR_TOKENS } from "./constants/css_tokens/css_border_color_tokens";
 export { CSS_ICON_COLOR_TOKENS_VALUES } from "./constants/css_tokens/css_icon_color_tokens";
+export * from "./constants/css_tokens/css_tokens_types";
 export { Link } from "./components/link/link";
 export { LINK_SIZE_TYPES, LINK_VARIANT_TYPES, LINK_DECORATION_TYPES } from "./components/link/link_constants";
 export { Modal } from './components/modal/components/modal/modal';
@@ -90,11 +94,15 @@ export { InputControl } from './components/controls/input_control/input_control'
 export { ColorPicker } from "./components/color_picker/color_picker";
 export { ColorPickerControl } from './components/controls/color_picker_control/color_picker_control';
 export { IColorPickerColor } from "./components/color_picker/color_picker_types";
+export { GRADIENT_TYPES } from "./components/color_picker/color_picker_constants";
+export { ColorPickerUtils } from "./components/color_picker/color_picker_utils";
 export { Checkbox } from "./components/checkbox/checkbox";
 export { CheckboxControl } from './components/controls/checkbox_control/checkbox_control';
 export { Select } from "./components/select/select";
 export { SelectControl } from './components/controls/select_control/select_control';
+export { TSelectOption } from "./components/select/select_types";
 export { RadioGroup } from "./components/radio_group/radio_group";
+export { RadioGroupItem } from "./components/radio_group/components/radio_group_item";
 export { RadioGroupControl } from './components/controls/radio_group_control/radio_group_control';
 export { MultiSelect } from "./components/multiselect/multiselect";
 export { MultiSelectControl } from './components/controls/multiselect_control/multiselect_control';
@@ -102,7 +110,7 @@ export { TextArea } from "./components/text_area/text_area";
 export { TextAreaControl } from "./components/controls/text_area_control/text_area_control";
 export { Control } from "./components/control/control";
 export { ControlsGroup } from "./components/controls/controls_group/controls_group";
-export { IImagePicker, TImageSize, TImagePickerExtension } from "./components/image_picker/image_picker_types";
+export { IImagePicker, TImageSize, TImagePickerExtension, TImagePickerFile } from "./components/image_picker/image_picker_types";
 export { ImagePicker } from "./components/image_picker/image_picker";
 export { XhrImagePicker } from "./components/xhr_image_picker/xhr_image_picker";
 export { XhrImagePickerControl } from "./components/controls/xhr_image_picker_control/xhr_image_picker_control";
@@ -111,6 +119,18 @@ export { ValuesSyncerControl } from "./components/controls/values_syncer_control
 export { ValuesSyncer } from "./components/values_syncer/values_syncer";
 export { useToggle } from "./hooks/use_toggle";
 export { useClickOutside } from "./hooks/use_click_outside";
-export { Tree } from "./components/tree";
+export { useScroll } from "./hooks/use_scroll";
+export { useTimeout } from "./hooks/use_timeout";
+export { useResizeObserver } from "./hooks/use_resize_observer";
+export { Tree } from "./components/tree/tree";
 export { TreeNode } from "./components/tree/components/tree_node";
 export { useTree } from "./components/tree/hooks/tree_hook";
+export { Breadcrumbs } from "./components/breadcrumbs/breadcrumbs";
+export { Toast } from "./components/toast/components/toast";
+export { ToastProvider } from "./components/toast/context/toast_provider";
+export { ToastViewport } from "./components/toast/components/toast_viewport";
+export { TOAST_TYPES, TOASTS_SIDE, TOAST_SLIDE_SIDE } from "./components/toast/toast_constants";
+export { TToastType } from "./components/toast/components/toast_components_types";
+export { AnchorPresets } from "./components/anchor_presets/anchor_presets";
+export { AnchorPresetsControl } from "./components/controls/anchor_presets_control/anchor_presets_control";
+export { ANCHOR_PRESETS_VALUES } from "./components/anchor_presets/anchor_presets_constants";