@dreamcommerce/aurora 2.4.0-2 → 2.4.0-21

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

@@ -22,13 +22,13 @@ export interface IControlComposition {
     Textarea: React.FC<ITextareaProps>;
     Errors: React.FC;
     AdditionalInfo: React.FC;
-    HelperText: React.FC<IControlHelperTextProps>;
 }
 export interface IControlProps {
     children: ReactNode;
     errors?: TControlErrors;
     name?: string;
     id?: string;
+    onClick?: (event: React.MouseEvent) => void;
 }
 interface IControlCommonProps {
     errors?: TControlErrors;
@@ -54,6 +54,7 @@ export interface IControlTagsSelectorProps extends IControlCommonProps {
     id?: string;
     name?: string;
     label?: string;
+    labelAdditionalInfo?: string | ReactNode;
     isRequired?: boolean;
     placeholder?: string;
     minTagLength?: number;
@@ -92,6 +93,7 @@ export interface IControlLabelProps {
     id?: string;
     isRequired?: boolean;
     children: any;
+    additionalInfo?: string | ReactNode;
 }
 export interface ICheckboxProps extends InputHTMLAttributes<HTMLInputElement> {
     id?: string;
@@ -103,14 +105,11 @@ export interface IControlInputProps extends IInputProps, IControlCommonProps {
     postfix?: string;
     label?: string;
     isRequired?: boolean;
-    helperText?: string;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface IControlCheckboxProps extends ICheckboxProps, IControlCommonProps {
     label: string;
-    hintTopOptions?: TControlHintOptions;
-    labelTop?: string;
-    hintTop?: string;
-    helperText?: string;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface IRadioProps extends InputHTMLAttributes<HTMLInputElement> {
     id: string;
@@ -118,6 +117,7 @@ export interface IRadioProps extends InputHTMLAttributes<HTMLInputElement> {
 }
 export interface IControlRadioProps extends IRadioProps, IControlCommonProps {
     label: string;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface IControlRadioGroupOption {
     value: string;
@@ -133,6 +133,7 @@ export interface IControlRadioGroup extends IControlCommonProps {
     id: string;
     name: string;
     label: string;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface IControlColorPickerProps extends IColorPickerProps, IControlCommonProps {
     id: string;
@@ -140,33 +141,37 @@ export interface IControlColorPickerProps extends IColorPickerProps, IControlCom
     label?: string;
     isRequired?: boolean;
     hideChooseCancelButtons?: boolean;
-    helperText?: React.ReactNode;
+    labelAdditionalInfo?: string | React.ReactNode;
 }
 export interface IControlTextareaProps extends ITextareaProps, IControlCommonProps {
     label?: string;
     isRequired?: boolean;
-    helperText?: React.ReactNode;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface IControlSelectProps extends ISelectProps, IControlCommonProps {
     id?: string;
     label?: string;
     isRequired?: boolean;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface IControlMultiSelectProps extends IMultiSelectProps, IControlCommonProps {
     id?: string;
     label?: string;
     isRequired?: boolean;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface IControlRange extends IRange, IControlCommonProps {
     id?: string;
     label?: string;
     isRequired?: boolean;
     name?: string;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface IControlFilePicker extends IFilePicker, IControlCommonProps {
     label?: string;
     isRequired?: boolean;
     name?: string;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export interface ICellSelector {
     rows?: number;
@@ -181,9 +186,6 @@ export interface IControlCellSelector extends ICellSelector, IControlCommonProps
     label?: string;
     id?: string;
     isRequired?: boolean;
-}
-export interface IControlHelperTextProps {
-    hasError?: boolean;
-    cssClasses?: string;
+    labelAdditionalInfo?: string | ReactNode;
 }
 export {};

package/build/esm/packages/aurora/src/components/date_picker/types.d.ts

@@ -1,4 +1,4 @@
-import { Dispatch, SetStateAction } from 'react';
+import React, { Dispatch, SetStateAction } from 'react';
 import { TControlErrors } from "../controls/types";
 export interface IMonthYear {
     month: number;
@@ -70,6 +70,7 @@ export interface IDatepickerProps {
     showButtons?: boolean;
     hint?: string;
     errors?: TControlErrors;
+    labelAdditionalInfo?: string | React.ReactNode;
 }
 export interface IDatepickerLabelProps {
     id: string;

package/build/esm/packages/aurora/src/components/date_picker/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/date_picker/types.ts"],"names":[],"mappings":"AAAA,OAAyC,OAAO,CAAC;AACjD,OAA+B,kCAAkC,CAAC"}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/date_picker/types.ts"],"names":[],"mappings":"AAAA,OAAgD,OAAO,CAAC;AACxD,OAA+B,kCAAkC,CAAC"}

package/build/esm/packages/aurora/src/components/dropdown/components/content.js

@@ -14,6 +14,7 @@ import cssClasses from '../../../css/dropdown/main.module.less.js';
 import { getXYModifiersForNestedDropdowns, isChildOfModal } from '../utilities.js';
 import { useClickOutside } from '../../../hooks/use_click_outside.js';
 import IconArrow from '../../../assets/icon_arrow.js';
+import { UiDomUtils } from '@dreamcommerce/utilities';
 
 /**
  * Dropdown.Content component. This togglable part of dropdown.
@@ -24,7 +25,7 @@ import IconArrow from '../../../assets/icon_arrow.js';
 const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children, arrowSide = 'left', portalContainer }) => {
     const [t] = useTranslation();
     const contentRef = useRef(null);
-    const { wrapperRef, toggleDropdown, isOpen } = useDropdownContext();
+    const { wrapperRef, toggleDropdown, isOpen, closeDropdown } = useDropdownContext();
     const [styles, setStyles] = useState({
         left: '0px',
         top: '0px',
@@ -69,6 +70,18 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
                 : setStyles({ left: `${positionLeft}px`, top: topPositionValue, bottom: bottomPositionValue, zIndex });
         }
     }, [portalContainer, screenWidthName, wrapperRef, isOpen, dropdownIsOutsideBottomViewport]);
+    useEffect(() => {
+        var _a;
+        if (!(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current) || !isOpen)
+            return;
+        const scrollableParent = (_a = UiDomUtils.getFirstScrollableParent(wrapperRef.current)) !== null && _a !== void 0 ? _a : document.body;
+        const handleWindowScroll = () => {
+            if (typeof closeDropdown === 'function') {
+                closeDropdown();
+            }
+        };
+        scrollableParent.addEventListener('scroll', handleWindowScroll, { once: true });
+    }, [isOpen]);
     return createPortal(React.createElement(TransitionGroup, { component: null }, isOpen === true ? (React.createElement(CSSTransition, { timeout: 200, classNames: {
             enter: cssClasses['dropdown-enter'],
             enterActive: cssClasses['dropdown-enter-active'],

package/build/esm/packages/aurora/src/components/dropdown/components/content.js.map

@@ -1 +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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/dropdown/context/types.d.ts

@@ -3,4 +3,6 @@ export interface IDropdownContext {
     wrapperRef?: React.RefObject<HTMLDivElement>;
     isOpen?: boolean;
     toggleDropdown?: () => void;
+    openDropdown?: () => void;
+    closeDropdown?: () => void;
 }

package/build/esm/packages/aurora/src/components/dropdown/hoc/multiselect/index.js

@@ -79,7 +79,7 @@ onChange, hasCloseIcon }) => {
     /**
      * isOpen provides state if dropdown is open(visible), toggleDropdown is a function which toggles dropdown content
      */
-    const [isOpen, toggleDropdown] = useToggle(defaultIsOpen, onToggle);
+    const [isOpen, toggleDropdown, openDropdown, closeDropdown] = useToggle(defaultIsOpen, onToggle);
     /**
      * hook with option list state, and method to change option list
      */
@@ -91,7 +91,7 @@ onChange, hasCloseIcon }) => {
     /**
      * context values, they may be used with useContext in any component which is part of Dropdown composition
      */
-    const value = React.useMemo(() => ({ wrapperRef, isOpen, toggleDropdown }), [isOpen, toggleDropdown]);
+    const value = React.useMemo(() => ({ wrapperRef, isOpen, toggleDropdown, openDropdown, closeDropdown }), [isOpen, toggleDropdown, openDropdown, closeDropdown]);
     /**
      * hook which resets options list to default on close if select has search and it was used
      */

package/build/esm/packages/aurora/src/components/dropdown/hooks/use_toggle.d.ts

@@ -4,4 +4,4 @@
  * @param onToggleCb callback onToggle
  * @returns {Array} tuple - open state and and method to change open state
  */
-export declare function useToggle(defaultIsOpen?: boolean, onToggleCb?: (isOpen: boolean) => void): [boolean, () => void];
+export declare function useToggle(defaultIsOpen?: boolean, onToggleCb?: (isOpen: boolean) => void): [boolean, () => void, () => void, () => void];

package/build/esm/packages/aurora/src/components/dropdown/hooks/use_toggle.js

@@ -10,12 +10,14 @@ import { useEffectAfterMount } from '../../../hooks/use_effect_after_mount.js';
 function useToggle(defaultIsOpen = false, onToggleCb) {
     const [isOpen, setIsOpen] = useState(defaultIsOpen);
     const onToggle = useCallback(() => setIsOpen((oldIsOpen) => !oldIsOpen), []);
+    const open = useCallback(() => setIsOpen(true), []);
+    const close = useCallback(() => setIsOpen(false), []);
     useEffectAfterMount(() => {
         if (typeof onToggleCb === 'function') {
             onToggleCb(isOpen);
         }
     }, [isOpen]);
-    return [isOpen, onToggle];
+    return [isOpen, onToggle, open, close];
 }
 
 export { useToggle };

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

package/build/esm/packages/aurora/src/components/dropdown/index.js

@@ -36,11 +36,11 @@ import { useToggle } from './hooks/use_toggle.js';
  */
 const Dropdown = ({ defaultIsOpen = false, onToggle, children }) => {
     const wrapperRef = useRef(null);
-    const [isOpen, toggleDropdown] = useToggle(defaultIsOpen, onToggle);
+    const [isOpen, toggleDropdown, openDropdown, closeDropdown] = useToggle(defaultIsOpen, onToggle);
     /**
      * context values, they may be used with useContext in any component which is part of Dropdown composition
      */
-    const value = React.useMemo(() => ({ wrapperRef, isOpen, toggleDropdown }), [isOpen, toggleDropdown]);
+    const value = React.useMemo(() => ({ wrapperRef, isOpen, toggleDropdown, openDropdown, closeDropdown }), [isOpen, toggleDropdown, openDropdown, closeDropdown]);
     return (React.createElement(DropdownContext.Provider, { value: value },
         React.createElement("div", { ref: wrapperRef, className: cssClasses.dropdown }, children)));
 };

package/build/esm/packages/aurora/src/components/file_picker/components/selected_file_preview.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { useTranslation } from '../../../../../../external/react-i18next/dist/es/useTranslation.js';
+import { FileUtils } from '@dreamcommerce/utilities';
 import styles from '../../../css/file_picker/main.module.less.js';
 import CSS_CLASSES from '../css_classes.js';
-import { FileUtils } from '../../../../../utilities/build/esm/packages/utilities/src/file_utils.js';
 import IconDelete from '../../../assets/icon_delete.js';
 
 const SelectedFilePreview = ({ file, isPreview, onPreviewError, onFileDelete }) => {

package/build/esm/packages/aurora/src/components/flash_messenger/components/flash_message.js

@@ -1,10 +1,10 @@
 import React, { useEffect } from 'react';
+import Stack from '../../stack/index.js';
 import { CSSTransition } from 'react-transition-group';
 import IconClose from '../../../assets/icon_close.js';
 import cssClasses from '../../../css/flash_message/main.module.less.js';
 import { useFlashMessenger } from '../context.js';
 import MessageBox from '../../message-box/index.js';
-import Grid from '../../grid/index.js';
 
 const FlashMessage = ({ message }) => {
     const { removeMessage, hideMessage } = useFlashMessenger();
@@ -19,11 +19,9 @@ const FlashMessage = ({ message }) => {
             exitActive: cssClasses['flash-messenger__list_exit-active']
         } },
         React.createElement(MessageBox, { type: message.type, className: `${cssClasses['flash-messenger__message']} ${cssClasses['flash-messenger__list-item']}` },
-            React.createElement(Grid.Row, null,
-                React.createElement(Grid.Col, { auto: "grow" },
-                    React.createElement("div", null, message.content)),
-                React.createElement(Grid.Col, { auto: "auto" },
-                    React.createElement(IconClose, { onClick: () => hideMessage(message.id), className: cssClasses['flash-messenger__icon-close'] }))))));
+            React.createElement(Stack, { spacing: 8, align: "center", justify: "space-between" },
+                React.createElement("div", null, message.content),
+                React.createElement(IconClose, { onClick: () => hideMessage(message.id), className: cssClasses['flash-messenger__icon-close'] })))));
 };
 
 export default FlashMessage;

package/build/esm/packages/aurora/src/components/flash_messenger/components/flash_message.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;"}
+{"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;"}

package/build/esm/packages/aurora/src/components/heading/index.js

@@ -1,15 +1,14 @@
 import React from 'react';
 import classnames from 'classnames';
 import cssClasses from '../../css/heading/main.module.less.js';
+import { Typography } from '../typography/index.js';
 
 const Heading = ({ as = 'h1', isSubheading, withHeadline, children }) => {
-    const classes = classnames(cssClasses[as], withHeadline && cssClasses.head_line);
+    const classes = classnames(withHeadline && cssClasses.head_line);
     if (!isSubheading) {
-        return React.createElement(`${as}`, {
-            className: classes
-        }, children);
+        return (React.createElement(Typography, { as: as, cssClasses: classes }, children));
     }
-    return React.createElement("span", { className: classes }, children);
+    return (React.createElement(Typography, { as: "span", variant: as }, children));
 };
 
 export default Heading;

package/build/esm/packages/aurora/src/components/heading/index.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;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/label/css_classes.d.ts

@@ -1,3 +1,4 @@
 export declare const cssLabel = "label";
 export declare const cssLabelRequired: string;
 export declare const cssLabelError: string;
+export declare const cssLabelAdditionalInfo: string;

package/build/esm/packages/aurora/src/components/label/css_classes.js

@@ -1,6 +1,7 @@
 const cssLabel = 'label';
 const cssLabelRequired = `${cssLabel}_required`;
-const cssLabelError = `${cssLabel}_error`;
+const cssLabelError = `${cssLabel}_error`;
+const cssLabelAdditionalInfo = `${cssLabel}__additional-info`;
 
-export { cssLabel, cssLabelError, cssLabelRequired };
+export { cssLabel, cssLabelAdditionalInfo, cssLabelError, cssLabelRequired };
 //# sourceMappingURL=css_classes.js.map

package/build/esm/packages/aurora/src/components/label/css_classes.js.map

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

package/build/esm/packages/aurora/src/components/label/index.js

@@ -2,15 +2,18 @@ import React from 'react';
 import classnames from 'classnames';
 import { useControlContext } from '../controls/context.js';
 import cssClasses from '../../css/label/main.module.less.js';
-import { cssLabel, cssLabelRequired, cssLabelError } from './css_classes.js';
+import { cssLabel, cssLabelRequired, cssLabelError, cssLabelAdditionalInfo } from './css_classes.js';
+import Stack from '../stack/index.js';
 
-const Label = ({ isRequired = false, children, ...props }) => {
+const Label = ({ isRequired = false, children, additionalInfo, ...props }) => {
     const { errors } = useControlContext();
     const labelClasses = classnames(cssClasses[cssLabel], {
         [cssClasses[cssLabelRequired]]: isRequired,
         [cssClasses[cssLabelError]]: errors
     });
-    return (React.createElement("label", { className: labelClasses, ...props }, children));
+    return (React.createElement("label", { className: labelClasses, ...props },
+        React.createElement(Stack, { align: "center" }, children),
+        additionalInfo && React.createElement("span", { className: cssClasses[cssLabelAdditionalInfo] }, additionalInfo)));
 };
 
 export default Label;

package/build/esm/packages/aurora/src/components/label/index.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;"}
+{"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;"}

package/build/esm/packages/aurora/src/components/label/types.d.ts

@@ -1,4 +1,5 @@
-import { LabelHTMLAttributes } from 'react';
+import { LabelHTMLAttributes, ReactNode } from 'react';
 export interface ILabelProps extends LabelHTMLAttributes<HTMLLabelElement> {
     isRequired?: boolean;
+    additionalInfo?: string | ReactNode;
 }

package/build/esm/packages/aurora/src/components/label/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/label/types.ts"],"names":[],"mappings":"AAAA,OAAoC,OAAO,CAAC"}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/label/types.ts"],"names":[],"mappings":"AAAA,OAA+C,OAAO,CAAC"}

package/build/esm/packages/aurora/src/components/slide/components/slide_header.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { ISlideCloseBtn } from '../types';
+export declare const SlideHeader: FC<ISlideCloseBtn>;
+export default SlideHeader;

package/build/esm/packages/aurora/src/components/slide/components/{slide_close_btn_wrapper.js → slide_header.js}

@@ -3,13 +3,13 @@ import classnames from 'classnames';
 import CSS_CLASSES from '../css_classes.js';
 import cssClasses from '../../../css/slide/main.module.less.js';
 
-const SlideCloseBtnWrapper = ({ children, classNames = '' }) => {
-    const classes = classnames(cssClasses[CSS_CLASSES.slideCloseBtnWrapper], {
+const SlideHeader = ({ children, classNames = '' }) => {
+    const classes = classnames(cssClasses[CSS_CLASSES.slideHeader], {
         [classNames]: classNames
     });
     return React.createElement("div", { className: classes }, children);
 };
 
-export default SlideCloseBtnWrapper;
-export { SlideCloseBtnWrapper };
-//# sourceMappingURL=slide_close_btn_wrapper.js.map
+export default SlideHeader;
+export { SlideHeader };
+//# sourceMappingURL=slide_header.js.map

package/build/esm/packages/aurora/src/components/slide/css_classes.d.ts

@@ -3,7 +3,7 @@ declare const _default: {
     slideWrapper: string;
     slideContent: string;
     slideFooter: string;
-    slideCloseBtnWrapper: string;
+    slideHeader: string;
     slideIsOpen: string;
     slideDirectionTop: string;
     slideDirectionRight: string;

package/build/esm/packages/aurora/src/components/slide/css_classes.js

@@ -4,7 +4,7 @@ var CSS_CLASSES = {
     slideWrapper: `${slideBaseCssClass}__wrapper`,
     slideContent: `${slideBaseCssClass}__content`,
     slideFooter: `${slideBaseCssClass}__footer`,
-    slideCloseBtnWrapper: `${slideBaseCssClass}__close-btn-wrapper`,
+    slideHeader: `${slideBaseCssClass}__header`,
     slideIsOpen: `${slideBaseCssClass}_is-open`,
     slideDirectionTop: `${slideBaseCssClass}_direction-top`,
     slideDirectionRight: `${slideBaseCssClass}_direction-right`,

package/build/esm/packages/aurora/src/components/stack/index.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import classnames from 'classnames';
-import { STACK_DIRECTIONS, STACK_JUSTIFICATIONS, STACK_ALIGNMENTS, STACK_WRAP, STACK_DIRECTIONS_TO_CSS_CLASSES_MAP, STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP, STACK_WRAP_TO_CSS_CLASSES_MAP } from './stack_constants.js';
+import { STACK_DIRECTIONS, STACK_JUSTIFICATIONS, STACK_ALIGNMENTS, STACK_WRAP, STACK_DIRECTIONS_TO_CSS_CLASSES_MAP, STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP, STACK_WRAP_TO_CSS_CLASSES_MAP, STACK_CSS_CLASSES } from './stack_constants.js';
 import cssClasses from '../../css/stack/main.module.less.js';
 import { cssStack } from './css_classes.js';
 
-const Stack = ({ children, spacing = 0, className = '', direction = STACK_DIRECTIONS.row, justify = STACK_JUSTIFICATIONS.flexStart, align = STACK_ALIGNMENTS.normal, wrap = STACK_WRAP.nowrap, as = 'div' }) => {
-    const stackClass = classnames(cssClasses[cssStack], cssClasses[STACK_DIRECTIONS_TO_CSS_CLASSES_MAP[direction]], cssClasses[STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP[align]], cssClasses[STACK_JUSTIFICATIONS[justify]], cssClasses[STACK_WRAP_TO_CSS_CLASSES_MAP[wrap]], className);
+const Stack = ({ children, spacing = 0, className = '', direction = STACK_DIRECTIONS.row, justify = STACK_JUSTIFICATIONS.flexStart, align = STACK_ALIGNMENTS.normal, wrap = STACK_WRAP.nowrap, as = 'div', inline = false }) => {
+    const stackClass = classnames(cssClasses[cssStack], cssClasses[STACK_DIRECTIONS_TO_CSS_CLASSES_MAP[direction]], cssClasses[STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP[align]], cssClasses[STACK_JUSTIFICATIONS[justify]], cssClasses[STACK_WRAP_TO_CSS_CLASSES_MAP[wrap]], inline ? cssClasses[STACK_CSS_CLASSES.inline] : '', className);
     return React.createElement(as, {
-        className: `${stackClass} ${stackClass}`,
+        className: `${stackClass}`,
         style: { gap: `${spacing}px` }
     }, children);
 };

package/build/esm/packages/aurora/src/components/stack/stack_constants.d.ts

@@ -1,3 +1,4 @@
+export declare const stackCssBaseClass = "stack";
 export declare const STACK_DIRECTIONS: {
     readonly row: "row";
     readonly column: "column";
@@ -35,7 +36,10 @@ export declare const STACK_WRAP: {
     initial: string;
     inherit: string;
 };
-export declare const stackCssBaseClass = "stack";
+export declare const STACK_CSS_CLASSES: {
+    readonly stack: "stack";
+    readonly inline: "stack_inline";
+};
 export declare const STACK_DIRECTIONS_TO_CSS_CLASSES_MAP: {
     readonly row: "stack_direction_row";
     readonly column: "stack_direction_column";

package/build/esm/packages/aurora/src/components/stack/stack_constants.js

@@ -1,3 +1,4 @@
+const stackCssBaseClass = 'stack';
 const STACK_DIRECTIONS = {
     row: 'row',
     column: 'column',
@@ -35,7 +36,10 @@ const STACK_WRAP = {
     initial: 'initial',
     inherit: 'inherit'
 };
-const stackCssBaseClass = 'stack';
+const STACK_CSS_CLASSES = {
+    stack: stackCssBaseClass,
+    inline: `${stackCssBaseClass}_inline`
+};
 const STACK_DIRECTIONS_TO_CSS_CLASSES_MAP = {
     [STACK_DIRECTIONS.row]: `${stackCssBaseClass}_direction_row`,
     [STACK_DIRECTIONS.column]: `${stackCssBaseClass}_direction_column`,
@@ -60,5 +64,5 @@ const STACK_WRAP_TO_CSS_CLASSES_MAP = {
     [STACK_WRAP.wrapReverse]: `${stackCssBaseClass}_wrap_wrap-reverse`
 };
 
-export { STACK_ALIGNMENTS, STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP, STACK_DIRECTIONS, STACK_DIRECTIONS_TO_CSS_CLASSES_MAP, STACK_JUSTIFICATIONS, STACK_WRAP, STACK_WRAP_TO_CSS_CLASSES_MAP, stackCssBaseClass };
+export { STACK_ALIGNMENTS, STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP, STACK_CSS_CLASSES, STACK_DIRECTIONS, STACK_DIRECTIONS_TO_CSS_CLASSES_MAP, STACK_JUSTIFICATIONS, STACK_WRAP, STACK_WRAP_TO_CSS_CLASSES_MAP, stackCssBaseClass };
 //# sourceMappingURL=stack_constants.js.map

package/build/esm/packages/aurora/src/components/stack/stack_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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;"}

package/build/esm/packages/aurora/src/components/stack/stack_types.d.ts

@@ -1,6 +1,6 @@
 import { Any } from 'ts-toolbelt';
 import React from 'react';
-import { STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP, STACK_DIRECTIONS, STACK_JUSTIFICATIONS_TO_CSS_CLASSES_MAP, STACK_WRAP_TO_CSS_CLASSES_MAP } from "./stack_constants";
+import { STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP, STACK_DIRECTIONS_TO_CSS_CLASSES_MAP, STACK_JUSTIFICATIONS_TO_CSS_CLASSES_MAP, STACK_WRAP_TO_CSS_CLASSES_MAP } from "./stack_constants";
 export declare type TStackProps = {
     direction?: TStackDirection;
     justify?: TStackJustify;
@@ -10,8 +10,9 @@ export declare type TStackProps = {
     className?: string;
     children?: React.ReactNode;
     as?: string;
+    inline?: boolean;
 };
 export declare type TStackJustify = Any.Keys<typeof STACK_JUSTIFICATIONS_TO_CSS_CLASSES_MAP>;
-export declare type TStackDirection = Any.Keys<typeof STACK_DIRECTIONS>;
+export declare type TStackDirection = Any.Keys<typeof STACK_DIRECTIONS_TO_CSS_CLASSES_MAP>;
 export declare type TStackAlign = Any.Keys<typeof STACK_ALIGNMENTS_TO_CSS_CLASSES_MAP>;
 export declare type TStackWrap = Any.Keys<typeof STACK_WRAP_TO_CSS_CLASSES_MAP>;

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

@@ -0,0 +1,4 @@
+import React, { PropsWithChildren } from 'react';
+import { ITypographyProps } from "./typography_types";
+export declare const Typography: React.FC<PropsWithChildren<ITypographyProps>>;
+export default Typography;

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

@@ -0,0 +1,16 @@
+import React from 'react';
+import classnames from 'classnames';
+import { TYPOGRAPHY_CSS_CLASSES, TYPOGRAPHY_COMPONENTS_TYPES_TO_CSS_CLASSES_MAP, TYPOGRAPHY_TRANSFORM_TO_CSS_CLASSES_MAP, TYPOGRAPHY_WEIGHT_TO_CSS_CLASSES_MAP, TYPOGRAPHY_COLORS_TO_CSS_CLASSES_MAP } from './typography_constants.js';
+import typographyCssClasses from '../../css/typography/main.module.less.js';
+
+const Typography = ({ as = 'p', children, variant = 'h1', weight, transform, cssClasses, color, style }) => {
+    const typographyClasses = classnames(typographyCssClasses[TYPOGRAPHY_CSS_CLASSES.typography], as ? typographyCssClasses[TYPOGRAPHY_COMPONENTS_TYPES_TO_CSS_CLASSES_MAP[as]] : '', variant ? typographyCssClasses[TYPOGRAPHY_COMPONENTS_TYPES_TO_CSS_CLASSES_MAP[variant]] : '', transform ? typographyCssClasses[TYPOGRAPHY_TRANSFORM_TO_CSS_CLASSES_MAP[transform]] : '', weight ? typographyCssClasses[TYPOGRAPHY_WEIGHT_TO_CSS_CLASSES_MAP[weight]] : '', color ? typographyCssClasses[TYPOGRAPHY_COLORS_TO_CSS_CLASSES_MAP[color]] : '', cssClasses);
+    return React.createElement(as, {
+        className: typographyClasses,
+        style: style
+    }, children);
+};
+
+export default Typography;
+export { Typography };
+//# sourceMappingURL=index.js.map

package/build/esm/packages/aurora/src/components/{controls/components/helper_text.js.map → typography/index.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;"}
+{"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;"}

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

@@ -0,0 +1,52 @@
+export declare const TYPOGRAPHY_COMPONENTS_TYPES: {
+    readonly h1: "h1";
+    readonly h2: "h2";
+    readonly h3: "h3";
+    readonly h4: "h4";
+    readonly h5: "h5";
+    readonly h6: "h6";
+    readonly p: "p";
+    readonly span: "span";
+    readonly div: "div";
+};
+export declare const TYPOGRAPHY_TRANSFORM: {
+    readonly uppercase: "uppercase";
+    readonly lowercase: "lowercase";
+    readonly capitalize: "capitalize";
+};
+export declare const TYPOGRAPHY_WEIGHT: {
+    readonly normal: "normal";
+    readonly bold: "bold";
+    readonly semibold: "semibold";
+};
+export declare const TYPOGRAPHY_CSS_CLASSES: {
+    readonly typography: "typography";
+};
+export declare const TYPOGRAPHY_COMPONENTS_TYPES_TO_CSS_CLASSES_MAP: {
+    readonly h1: "typography_h1";
+    readonly h2: "typography_h2";
+    readonly h3: "typography_h3";
+    readonly h4: "typography_h4";
+    readonly h5: "typography_h5";
+    readonly h6: "typography_h6";
+    readonly p: "typography_p";
+    readonly span: "typography_span";
+};
+export declare const TYPOGRAPHY_TRANSFORM_TO_CSS_CLASSES_MAP: {
+    readonly uppercase: "typography_uppercase";
+    readonly lowercase: "typography_lowercase";
+    readonly capitalize: "typography_capitalize";
+};
+export declare const TYPOGRAPHY_WEIGHT_TO_CSS_CLASSES_MAP: {
+    readonly normal: "typography_normal";
+    readonly bold: "typography_bold";
+    readonly semibold: "typography_semibold";
+};
+export declare const TYPOGRAPHY_COLORS: {
+    readonly dark: "dark";
+    readonly light: "light";
+};
+export declare const TYPOGRAPHY_COLORS_TO_CSS_CLASSES_MAP: {
+    readonly dark: "typography_color_dark";
+    readonly light: "typography_color_light";
+};