@addev-be/ui 1.2.1 → 2.1.0

package/dist/components/data/VirtualScroller/hooks.js

@@ -2,12 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useVirtualScrolling = exports.VIRTUAL_SCROLL_TOLERANCE = void 0;
 var react_1 = require("react");
-var hooks_1 = require("../../../hooks");
+var useElementSize_1 = require("../../../hooks/useElementSize");
 exports.VIRTUAL_SCROLL_TOLERANCE = 20;
 var useVirtualScrolling = function (_a) {
     var _b;
     var scrollableElement = _a.scrollableElement, rowHeightInPx = _a.rowHeightInPx, items = _a.items, _c = _a.itemsPerRow, itemsPerRow = _c === void 0 ? 1 : _c, _d = _a.tolerance, tolerance = _d === void 0 ? exports.VIRTUAL_SCROLL_TOLERANCE : _d;
-    var height = (0, hooks_1.useElementSize)(scrollableElement).height;
+    var height = (0, useElementSize_1.useElementSize)(scrollableElement).height;
     var _e = (0, react_1.useState)(0), scrollTop = _e[0], setScrollTop = _e[1];
     var _f = [
         Math.floor(scrollTop / rowHeightInPx),

package/dist/components/data/VirtualScroller/styles.d.ts

@@ -3,14 +3,10 @@ export declare const BottomPaddingItem: import("styled-components/dist/types").I
 export declare const VirtualScrollerContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $integrated?: boolean;
 }>> & string;
-export declare const VirtualScrollerFiller: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, {
+export declare const VirtualScrollerFiller: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, {
     $height: number;
 }>, never>> & string;
-export declare const VirtualScrollerItemsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, {
+export declare const VirtualScrollerItemsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, {
     $gridTemplateColumns: string;
     $gap?: string;
     $topPadding: number;

package/dist/components/forms/Button.d.ts

@@ -13,5 +13,5 @@ export type ButtonProps = {
     rounded?: boolean;
     bordered?: boolean;
 };
-export declare const Button: (props: import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, keyof StyledButtonProps> & StyledButtonProps & ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").JSX.Element | null;
+export declare const Button: import("react").ForwardRefExoticComponent<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, keyof StyledButtonProps> & StyledButtonProps & ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
 export {};

package/dist/components/forms/Form/CustomSelect.d.ts

@@ -9,5 +9,5 @@ type CustomSelectProps<T> = {
     onChange?: (value: T | null) => void;
     ref?: ForwardedRef<HTMLSelectElement>;
 };
-export declare const CustomSelect: <T>({ icon, label, items, itemKey, itemLabel, readOnly, onChange, value, ...props }: FormRowProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, "value" | "onChange"> & CustomSelectProps<T>, ref: ForwardedRef<HTMLSelectElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const CustomSelect: <T>({ icon, label, items, itemKey, itemLabel, readOnly, onChange, value, ref, ...props }: FormRowProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, "value" | "onChange"> & CustomSelectProps<T>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/forms/Form/CustomSelect.js

@@ -27,9 +27,8 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var Row_1 = require("./Row");
 var react_1 = require("react");
 var styles_1 = require("./styles");
-var components_1 = require("../../../helpers/components");
-var CustomSelectInner = function (_a, ref) {
-    var icon = _a.icon, label = _a.label, items = _a.items, itemKey = _a.itemKey, itemLabel = _a.itemLabel, readOnly = _a.readOnly, onChange = _a.onChange, value = _a.value, props = __rest(_a, ["icon", "label", "items", "itemKey", "itemLabel", "readOnly", "onChange", "value"]);
+var CustomSelect = function (_a) {
+    var icon = _a.icon, label = _a.label, items = _a.items, itemKey = _a.itemKey, itemLabel = _a.itemLabel, readOnly = _a.readOnly, onChange = _a.onChange, value = _a.value, ref = _a.ref, props = __rest(_a, ["icon", "label", "items", "itemKey", "itemLabel", "readOnly", "onChange", "value", "ref"]);
     var selectRef = (0, react_1.useRef)(null);
     (0, react_1.useImperativeHandle)(ref, function () { return selectRef.current; }, []);
     var onSelectChange = (0, react_1.useCallback)(function (event) {
@@ -48,4 +47,4 @@ var CustomSelectInner = function (_a, ref) {
                 return ((0, jsx_runtime_1.jsx)("option", { value: key, onSelect: function () { return console.log('selected'); }, children: label }, key));
             }) }))) }));
 };
-exports.CustomSelect = (0, components_1.forwardRefWithName)(CustomSelectInner, 'CustomSelect');
+exports.CustomSelect = CustomSelect;

package/dist/components/forms/Form/FormGroup.d.ts

@@ -1,6 +1,6 @@
 import { FC, PropsWithChildren } from 'react';
 import { IconFC } from '../../../Icons';
-import { ThemeColorWithIntensity } from '../../../providers/ThemeProvider';
+import { ThemeColorWithIntensity } from '../../../providers/ThemeProvider/types';
 type FormGroupProps = PropsWithChildren<{
     color?: ThemeColorWithIntensity;
     title?: string;

package/dist/components/forms/Form/Select.d.ts

@@ -9,5 +9,5 @@ type SelectProps<T> = {
     onChange?: (value: T | null) => void;
     ref?: ForwardedRef<HTMLSelectElement>;
 };
-export declare const Select: <T>({ icon, label, items, itemKey, itemLabel, readOnly, onChange, value, ...props }: FormRowProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, "value" | "onChange"> & SelectProps<T>, ref: ForwardedRef<HTMLSelectElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const Select: <T>({ icon, label, items, itemKey, itemLabel, readOnly, onChange, value, ref, ...props }: FormRowProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, "value" | "onChange"> & SelectProps<T>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/forms/Form/Select.js

@@ -27,9 +27,8 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var Row_1 = require("./Row");
 var react_1 = require("react");
 var styles_1 = require("./styles");
-var components_1 = require("../../../helpers/components");
-var SelectInner = function (_a, ref) {
-    var icon = _a.icon, label = _a.label, items = _a.items, itemKey = _a.itemKey, itemLabel = _a.itemLabel, readOnly = _a.readOnly, onChange = _a.onChange, value = _a.value, props = __rest(_a, ["icon", "label", "items", "itemKey", "itemLabel", "readOnly", "onChange", "value"]);
+var Select = function (_a) {
+    var icon = _a.icon, label = _a.label, items = _a.items, itemKey = _a.itemKey, itemLabel = _a.itemLabel, readOnly = _a.readOnly, onChange = _a.onChange, value = _a.value, ref = _a.ref, props = __rest(_a, ["icon", "label", "items", "itemKey", "itemLabel", "readOnly", "onChange", "value", "ref"]);
     var selectRef = (0, react_1.useRef)(null);
     (0, react_1.useImperativeHandle)(ref, function () { return selectRef.current; }, []);
     var onSelectChange = (0, react_1.useCallback)(function (event) {
@@ -48,4 +47,4 @@ var SelectInner = function (_a, ref) {
                 return ((0, jsx_runtime_1.jsx)("option", { value: key, children: label }, key));
             }) }))) }));
 };
-exports.Select = (0, components_1.forwardRefWithName)(SelectInner, 'Select');
+exports.Select = Select;

package/dist/components/forms/Form/index.d.ts

@@ -52,7 +52,7 @@ export declare const CardForm: {
         children?: import("react").ReactNode | undefined;
     } & import("react").InputHTMLAttributes<HTMLInputElement>>;
     Row: FC<import("./Row").FormRowProps>;
-    Select: <T>({ icon, label, items, itemKey, itemLabel, readOnly, onChange, value, ...props }: import("./Row").FormRowProps & Omit<import("react").SelectHTMLAttributes<HTMLSelectElement>, "value" | "onChange"> & {
+    Select: <T>({ icon, label, items, itemKey, itemLabel, readOnly, onChange, value, ref, ...props }: import("./Row").FormRowProps & Omit<import("react").SelectHTMLAttributes<HTMLSelectElement>, "value" | "onChange"> & {
         items: T[];
         value: T | null;
         itemKey: (item: T, index: number) => string;
@@ -60,7 +60,7 @@ export declare const CardForm: {
         readOnly?: boolean;
         onChange?: ((value: T | null) => void) | undefined;
         ref?: import("react").ForwardedRef<HTMLSelectElement>;
-    }, ref: import("react").ForwardedRef<HTMLSelectElement>) => import("react/jsx-runtime").JSX.Element;
+    }) => import("react/jsx-runtime").JSX.Element;
     TextArea: FC<{
         label?: string;
         icon?: import("../../..").IconFC;
@@ -74,7 +74,7 @@ export declare const CardForm: {
         canGrow?: boolean;
         canShrink?: boolean;
     }>;
-    CustomSelect: <T>({ icon, label, items, itemKey, itemLabel, readOnly, onChange, value, ...props }: import("./Row").FormRowProps & Omit<import("react").SelectHTMLAttributes<HTMLSelectElement>, "value" | "onChange"> & {
+    CustomSelect: <T>({ icon, label, items, itemKey, itemLabel, readOnly, onChange, value, ref, ...props }: import("./Row").FormRowProps & Omit<import("react").SelectHTMLAttributes<HTMLSelectElement>, "value" | "onChange"> & {
         items: T[];
         value: T | null;
         itemKey: (item: T, index: number) => string;
@@ -82,5 +82,5 @@ export declare const CardForm: {
         readOnly?: boolean;
         onChange?: ((value: T | null) => void) | undefined;
         ref?: import("react").ForwardedRef<HTMLSelectElement>;
-    }, ref: import("react").ForwardedRef<HTMLSelectElement>) => import("react/jsx-runtime").JSX.Element;
+    }) => import("react/jsx-runtime").JSX.Element;
 };

package/dist/components/forms/Form/styles.d.ts

@@ -1,4 +1,4 @@
-import { ThemeColorWithIntensity } from '../../../providers/ThemeProvider';
+import { ThemeColorWithIntensity } from '../../../providers/ThemeProvider/types';
 export declare const FormGroupContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, {
     color?: ThemeColorWithIntensity;
 }>> & string;
@@ -9,9 +9,7 @@ export declare const FormRowInputContainer: import("styled-components/dist/types
 export declare const FormRowContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
     $readOnly?: boolean;
 }>> & string;
-export declare const StyledCheckbox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
-    ref?: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLInputElement> | null | undefined;
-}>, never>, never>> & string;
+export declare const StyledCheckbox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>>, never>, never>> & string;
 export declare const ReadOnlyValue: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
 export declare const FormFields: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $readOnly?: boolean;

package/dist/components/forms/Form/styles.js

@@ -45,7 +45,7 @@ exports.FormGroupContainer = styled_components_1.default.fieldset(templateObject
     return "var(--color-".concat(color, ")");
 });
 exports.FormGroupHeader = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--space-2);\n\n  & > h3 {\n    margin: 0;\n    font-size: var(--text-lg);\n    font-weight: bold;\n  }\n  & > h4 {\n    margin: 0;\n    font-size: var(--text-sm);\n    font-weight: var(--font-normal);\n    color: var(--color-text-500);\n  }\n\n  & > svg {\n    width: var(--space-6);\n    height: var(--space-6);\n  }\n"], ["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--space-2);\n\n  & > h3 {\n    margin: 0;\n    font-size: var(--text-lg);\n    font-weight: bold;\n  }\n  & > h4 {\n    margin: 0;\n    font-size: var(--text-sm);\n    font-weight: var(--font-normal);\n    color: var(--color-text-500);\n  }\n\n  & > svg {\n    width: var(--space-6);\n    height: var(--space-6);\n  }\n"])));
-exports.inputCss = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-family: inherit;\n  font-size: var(--text-lg);\n\n  border: none;\n  color: var(--color-text-800);\n  background: var(--color-base-0);\n\n  box-sizing: border-box;\n  width: 100%;\n  padding: var(--space-1);\n  ", " {\n    text-align: right;\n  }\n\n  &:focus {\n    outline: none;\n  }\n"], ["\n  font-family: inherit;\n  font-size: var(--text-lg);\n\n  border: none;\n  color: var(--color-text-800);\n  background: var(--color-base-0);\n\n  box-sizing: border-box;\n  width: 100%;\n  padding: var(--space-1);\n  ", " {\n    text-align: right;\n  }\n\n  &:focus {\n    outline: none;\n  }\n"])), responsive_1.mediaQueries.lgUp);
+exports.inputCss = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-family: inherit;\n  font-size: var(--text-base);\n\n  border: none;\n  color: var(--color-text-800);\n  background: var(--color-base-0);\n\n  box-sizing: border-box;\n  width: 100%;\n  padding: var(--space-1);\n  ", " {\n    text-align: right;\n  }\n\n  &:focus {\n    outline: none;\n  }\n"], ["\n  font-family: inherit;\n  font-size: var(--text-base);\n\n  border: none;\n  color: var(--color-text-800);\n  background: var(--color-base-0);\n\n  box-sizing: border-box;\n  width: 100%;\n  padding: var(--space-1);\n  ", " {\n    text-align: right;\n  }\n\n  &:focus {\n    outline: none;\n  }\n"])), responsive_1.mediaQueries.lgUp);
 exports.FormRowLabel = styled_components_1.default.span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  color: var(--color-text-500);\n  font-size: var(--text-base);\n  padding: var(--space-1) 0;\n  display: flex;\n  flex-direction: row;\n  gap: var(--space-2);\n  line-height: 1.25;\n  font-weight: bold;\n  align-self: flex-start;\n\n  & > svg {\n    width: var(--space-4);\n    height: var(--space-4);\n    fill: var(--color-base-500);\n    flex-shrink: 0;\n  }\n"], ["\n  color: var(--color-text-500);\n  font-size: var(--text-base);\n  padding: var(--space-1) 0;\n  display: flex;\n  flex-direction: row;\n  gap: var(--space-2);\n  line-height: 1.25;\n  font-weight: bold;\n  align-self: flex-start;\n\n  & > svg {\n    width: var(--space-4);\n    height: var(--space-4);\n    fill: var(--color-base-500);\n    flex-shrink: 0;\n  }\n"])));
 exports.FormRowInputContainer = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  flex: 1;\n  text-align: right;\n\n  ", " {\n    width: 100%;\n    text-align: left;\n  }\n\n  & > select,\n  & > input,\n  & > textarea {\n    ", "\n  }\n\n  & > select:focus > option {\n    text-align: left;\n  }\n"], ["\n  flex: 1;\n  text-align: right;\n\n  ", " {\n    width: 100%;\n    text-align: left;\n  }\n\n  & > select,\n  & > input,\n  & > textarea {\n    ", "\n  }\n\n  & > select:focus > option {\n    text-align: left;\n  }\n"])), responsive_1.mediaQueries.mdDown, exports.inputCss);
 exports.FormRowContainer = styled_components_1.default.label(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 0;\n  padding: var(--space-2);\n\n  ", " {\n    flex-direction: row;\n    gap: var(--space-2);\n    padding: var(--space-1) var(--space-2);\n  }\n\n  border: 1px solid var(--color-base-200);\n  background: var(--color-base-0);\n  &:focus-within {\n    outline: 2px solid var(--color-primary-500);\n    z-index: 1;\n  }\n\n  &.read-only {\n    background: none;\n    border: none;\n    &:focus-within {\n      outline: none;\n    }\n\n    & + & {\n      border-top: 1px solid var(--color-base-300);\n    }\n\n    & > div > select,\n    & > div > select[disabled],\n    & > div > input,\n    & > div > textarea {\n      background: none;\n      color: var(--color-text-800);\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 0;\n  padding: var(--space-2);\n\n  ", " {\n    flex-direction: row;\n    gap: var(--space-2);\n    padding: var(--space-1) var(--space-2);\n  }\n\n  border: 1px solid var(--color-base-200);\n  background: var(--color-base-0);\n  &:focus-within {\n    outline: 2px solid var(--color-primary-500);\n    z-index: 1;\n  }\n\n  &.read-only {\n    background: none;\n    border: none;\n    &:focus-within {\n      outline: none;\n    }\n\n    & + & {\n      border-top: 1px solid var(--color-base-300);\n    }\n\n    & > div > select,\n    & > div > select[disabled],\n    & > div > input,\n    & > div > textarea {\n      background: none;\n      color: var(--color-text-800);\n    }\n  }\n"])), responsive_1.mediaQueries.lgUp);

package/dist/components/forms/IconButton.d.ts

@@ -1,12 +1,12 @@
 import { ButtonProps } from './Button';
 import { ButtonHTMLAttributes, ForwardedRef } from 'react';
 import { IconFC } from '../../Icons';
-import { ThemeSize } from '../../providers';
+import { ThemeSize } from '../../providers/ThemeProvider/types';
 type IconButtonProps = ButtonProps & {
     icon: IconFC;
     $iconSize?: ThemeSize;
 };
-export declare const IconButton: ({ icon: Icon, ...props }: IconButtonProps & ButtonHTMLAttributes<HTMLButtonElement> & {
+export declare const IconButton: ({ icon: Icon, ref, ...props }: IconButtonProps & ButtonHTMLAttributes<HTMLButtonElement> & {
     ref?: ForwardedRef<HTMLButtonElement>;
-}, ref: ForwardedRef<HTMLButtonElement>) => import("react/jsx-runtime").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/forms/IconButton.js

@@ -32,7 +32,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.IconButton = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var Button_1 = require("./Button");
-var components_1 = require("../../helpers/components");
 var styled_components_1 = __importDefault(require("styled-components"));
 var styles = {
     IconButton: (0, styled_components_1.default)(Button_1.Button).attrs({
@@ -57,8 +56,9 @@ var styles = {
         return "var(--space-".concat($iconSize, ")");
     }),
 };
-exports.IconButton = (0, components_1.forwardRefWithName)(function (_a, ref) {
-    var Icon = _a.icon, props = __rest(_a, ["icon"]);
+var IconButton = function (_a) {
+    var Icon = _a.icon, ref = _a.ref, props = __rest(_a, ["icon", "ref"]);
     return ((0, jsx_runtime_1.jsx)(styles.IconButton, __assign({ ref: ref }, props, { children: (0, jsx_runtime_1.jsx)(Icon, { className: "iconbutton-icon" }) })));
-}, 'IconButton');
+};
+exports.IconButton = IconButton;
 var templateObject_1;

package/dist/components/forms/NumberInput.d.ts

@@ -1,9 +1,9 @@
 import { HTMLProps } from 'react';
-export declare const NumberInput: (props: Omit<HTMLProps<HTMLInputElement>, "type" | "onChange" | "value" | "defaultValue"> & {
+export declare const NumberInput: import("react").ForwardRefExoticComponent<Omit<Omit<HTMLProps<HTMLInputElement>, "type" | "onChange" | "value" | "defaultValue"> & {
     value?: number;
     onChange?: (value: number) => void;
     decimals?: number;
     prefix?: string;
     suffix?: string;
     multiplicator?: number;
-} & import("react").RefAttributes<HTMLInputElement>) => import("react").JSX.Element | null;
+}, "ref"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/forms/NumberInput.js

@@ -26,7 +26,7 @@ exports.NumberInput = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var styles_1 = require("./styles");
-var helpers_1 = require("../../helpers");
+var numbers_1 = require("../../helpers/numbers");
 var NumberInputInner = function (_a, ref) {
     var value = _a.value, onChange = _a.onChange, _b = _a.decimals, decimals = _b === void 0 ? 0 : _b, prefix = _a.prefix, suffix = _a.suffix, _c = _a.multiplicator, multiplicator = _c === void 0 ? 1 : _c, props = __rest(_a, ["value", "onChange", "decimals", "prefix", "suffix", "multiplicator"]);
     var _d = (0, react_1.useState)(Number(value !== null && value !== void 0 ? value : 0)), displayedValue = _d[0], setDisplayedValue = _d[1];
@@ -34,7 +34,7 @@ var NumberInputInner = function (_a, ref) {
         setDisplayedValue((value !== null && value !== void 0 ? value : 0) * multiplicator);
     }, [multiplicator, value]);
     return ((0, jsx_runtime_1.jsx)(styles_1.StyledNumericFormat, __assign({ className: String(styles_1.Input), getInputRef: ref, value: displayedValue, onChange: function (e) {
-            onChange === null || onChange === void 0 ? void 0 : onChange((0, helpers_1.parseNumber)(e.target.value) / multiplicator);
-        }, decimalSeparator: helpers_1.decimalSeparator, decimalScale: decimals, fixedDecimalScale: !!decimals, prefix: prefix ? prefix + ' ' : undefined, suffix: suffix ? ' ' + suffix : undefined }, props)));
+            onChange === null || onChange === void 0 ? void 0 : onChange((0, numbers_1.parseNumber)(e.target.value) / multiplicator);
+        }, decimalSeparator: numbers_1.decimalSeparator, decimalScale: decimals, fixedDecimalScale: !!decimals, prefix: prefix ? prefix + ' ' : undefined, suffix: suffix ? ' ' + suffix : undefined }, props)));
 };
 exports.NumberInput = (0, react_1.forwardRef)(NumberInputInner);

package/dist/components/forms/styles.d.ts

@@ -16,6 +16,4 @@ export declare const StyledNumericFormat: import("styled-components/dist/types")
     customInput?: import("react").ComponentType<unknown> | undefined;
 }, never>> & string & Omit<typeof NumericFormat, keyof import("react").Component<any, {}, any>>;
 export declare const StyledTextArea: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, never>> & string;
-export declare const StackedLabelContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
+export declare const StackedLabelContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;

package/dist/components/layout/Dropdown/index.js

@@ -59,7 +59,7 @@ exports.Dropdown = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var styles = __importStar(require("./styles"));
 var react_1 = require("react");
-var providers_1 = require("../../../providers");
+var hooks_1 = require("../../../providers/hooks");
 var getDropdownStyle = function (dropdown) {
     var minHeight = Array.isArray(dropdown.$height)
         ? dropdown.$height[0]
@@ -85,7 +85,7 @@ var getDropdownStyle = function (dropdown) {
 };
 var Dropdown = function (_a) {
     var children = _a.children, onClose = _a.onClose, _b = _a.usePortal, usePortal = _b === void 0 ? true : _b, props = __rest(_a, ["children", "onClose", "usePortal"]);
-    var createPortal = (0, providers_1.usePortals)().createPortal;
+    var createPortal = (0, hooks_1.usePortals)().createPortal;
     var firstClick = (0, react_1.useRef)(true);
     var containerRef = (0, react_1.useRef)(null);
     var style = (0, react_1.useMemo)(function () { return getDropdownStyle(props); }, [props]);

package/dist/components/layout/Dropdown/styles.d.ts

@@ -1,6 +1,4 @@
-export declare const DropdownBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, {
+export declare const DropdownBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, {
     $alpha?: number;
 }>, never>> & string;
 export type DropdownContainerProps = {
@@ -10,6 +8,4 @@ export type DropdownContainerProps = {
     $backdropAlpha?: number;
     $withBackground?: boolean;
 };
-export declare const DropdownContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, DropdownContainerProps>> & string;
+export declare const DropdownContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, DropdownContainerProps>> & string;

package/dist/components/layout/Flexbox.d.ts

@@ -1,6 +1,6 @@
 import { SpaceProps } from '../../helpers/styled/space';
 import { CSSProperties } from 'react';
-import { ThemeSpace } from '../../providers';
+import { ThemeSpace } from '../../providers/ThemeProvider/types';
 type FlexboxProps = {
     direction?: CSSProperties['flexDirection'];
     justifyContent?: CSSProperties['justifyContent'];

package/dist/components/layout/Grid/styles.d.ts

@@ -8,7 +8,5 @@ type GridItemProps = {
     rowSpan?: number;
     colSpan?: number;
 };
-export declare const GridItemContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, GridItemProps>, never>> & string;
+export declare const GridItemContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, GridItemProps>, never>> & string;
 export {};

package/dist/components/layout/Loading/index.js

@@ -38,10 +38,10 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var styles = __importStar(require("./styles"));
 var react_1 = require("react");
 var Icons_1 = require("../../../Icons");
-var providers_1 = require("../../../providers");
+var hooks_1 = require("../../../providers/hooks");
 var Loading = function (_a) {
     var visible = _a.visible, children = _a.children;
-    var createPortal = (0, providers_1.usePortals)().createPortal;
+    var createPortal = (0, hooks_1.usePortals)().createPortal;
     var loadingPortal = (0, react_1.useMemo)(function () {
         return visible
             ? createPortal((0, jsx_runtime_1.jsxs)(styles.LoadingBackdrop, { children: [(0, jsx_runtime_1.jsx)(Icons_1.LoadingIcon, {}), (0, jsx_runtime_1.jsx)(styles.LoadingContainer, { children: children || 'Loading ...' })] }))

package/dist/components/layout/Loading/styles.d.ts

@@ -1,6 +1,2 @@
-export declare const LoadingContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const LoadingBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
+export declare const LoadingContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const LoadingBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;

package/dist/components/layout/Modal/index.js

@@ -59,10 +59,10 @@ exports.Modal = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var styles = __importStar(require("./styles"));
 var react_1 = require("react");
-var providers_1 = require("../../../providers");
+var hooks_1 = require("../../../providers/hooks");
 var Modal = function (_a) {
     var children = _a.children, closeOnBackdropClick = _a.closeOnBackdropClick, onClose = _a.onClose, props = __rest(_a, ["children", "closeOnBackdropClick", "onClose"]);
-    var createPortal = (0, providers_1.usePortals)().createPortal;
+    var createPortal = (0, hooks_1.usePortals)().createPortal;
     var modalPortal = (0, react_1.useMemo)(function () {
         return createPortal((0, jsx_runtime_1.jsx)(styles.ModalBackdrop, { onClick: closeOnBackdropClick ? onClose : undefined, children: (0, jsx_runtime_1.jsx)(styles.ModalContainer, __assign({}, props, { children: children })) }));
     }, [children, closeOnBackdropClick, createPortal, onClose, props]);

package/dist/components/layout/Modal/styles.d.ts

@@ -1,7 +1,5 @@
-import { ThemeColor } from '../../../providers';
-export declare const ModalBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
+import { ThemeColor } from '../../../providers/ThemeProvider/types';
+export declare const ModalBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
 export type ModalContainerProps = {
     $width?: number;
     $height?: number;
@@ -9,26 +7,10 @@ export type ModalContainerProps = {
     $fullscreen?: boolean;
     $color?: ThemeColor;
 };
-export declare const ModalContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, ModalContainerProps>> & string;
-export declare const ModalHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const ModalMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
-    ref?: ((instance: HTMLParagraphElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLParagraphElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const ModalContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const ModalContentWithIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const ModalFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const ModalButtons: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>, import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>>, never>, never>> & string;
+export declare const ModalContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, ModalContainerProps>> & string;
+export declare const ModalHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const ModalMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>>, never>, never>> & string;
+export declare const ModalContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const ModalContentWithIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const ModalFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const ModalButtons: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>, import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>>, never>, never>> & string;

package/dist/components/search/HighlightedText.js

@@ -25,14 +25,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.HighlightedText = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
-var helpers_1 = require("../../helpers");
+var text_1 = require("../../helpers/text");
 var HighlightedText = function (_a) {
     var text = _a.text, highlight = _a.highlight, props = __rest(_a, ["text", "highlight"]);
-    var textWithoutHtml = (0, react_1.useMemo)(function () { return (0, helpers_1.extractTextFromHTML)(text); }, [text]);
+    var textWithoutHtml = (0, react_1.useMemo)(function () { return (0, text_1.extractTextFromHTML)(text); }, [text]);
     var parts = (0, react_1.useMemo)(function () {
         var _a;
         return highlight
-            ? (_a = textWithoutHtml === null || textWithoutHtml === void 0 ? void 0 : textWithoutHtml.split(new RegExp("(".concat((0, helpers_1.escapeForRegExp)(highlight), ")"), 'gi')).filter(Boolean)) !== null && _a !== void 0 ? _a : []
+            ? (_a = textWithoutHtml === null || textWithoutHtml === void 0 ? void 0 : textWithoutHtml.split(new RegExp("(".concat((0, text_1.escapeForRegExp)(highlight), ")"), 'gi')).filter(Boolean)) !== null && _a !== void 0 ? _a : []
             : [];
     }, [highlight, textWithoutHtml]);
     if (!highlight || !parts.length) {

package/dist/components/search/QuickSearchBar.d.ts

@@ -1,6 +1,6 @@
 import { ComponentProps, FC } from 'react';
 import { SearchTypeDefinitions } from './types';
-import { Input } from '../forms';
+import { Input } from '../forms/styles';
 type QuickSearchBarProps<R> = {
     types: SearchTypeDefinitions<R>;
     placeholder?: string;

package/dist/components/search/QuickSearchBar.js

@@ -37,14 +37,14 @@ exports.QuickSearchBar = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var styles = __importStar(require("./styles"));
 var react_1 = require("react");
-var layout_1 = require("../layout");
-var forms_1 = require("../forms");
+var Dropdown_1 = require("../layout/Dropdown");
+var styles_1 = require("../forms/styles");
 var QuickSearchResults_1 = require("./QuickSearchResults");
 var usehooks_1 = require("@uidotdev/usehooks");
-var services_1 = require("../../services");
+var globalSearch_1 = require("../../services/globalSearch");
 var QuickSearchBar = function (_a) {
     var _b, _c;
-    var types = _a.types, placeholder = _a.placeholder, _d = _a.inputComponent, InputComponent = _d === void 0 ? forms_1.Input : _d;
+    var types = _a.types, placeholder = _a.placeholder, _d = _a.inputComponent, InputComponent = _d === void 0 ? styles_1.Input : _d;
     var _e = (0, react_1.useState)(''), term = _e[0], setTerm = _e[1];
     var _f = (0, react_1.useState)(false), dropdownVisible = _f[0], setDropdownVisible = _f[1];
     var debouncedTerm = (0, usehooks_1.useDebounce)(term, 300);
@@ -53,7 +53,7 @@ var QuickSearchBar = function (_a) {
     var inputRef = (0, react_1.useRef)(null);
     var rect = (_c = (_b = fakeInputRef.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect()) !== null && _c !== void 0 ? _c : new DOMRect();
     var destRect = new DOMRect(rect.x, rect.y, rect.width, 0);
-    var globalSearch = (0, services_1.useGlobalSearchRequestHandler)();
+    var globalSearch = (0, globalSearch_1.useGlobalSearchRequestHandler)();
     (0, react_1.useEffect)(function () {
         if (debouncedTerm) {
             globalSearch({
@@ -73,6 +73,6 @@ var QuickSearchBar = function (_a) {
             (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
         });
     }, []);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(InputComponent, { type: "text", ref: fakeInputRef, value: term, onFocus: onFocus, placeholder: placeholder }), dropdownVisible && rect && ((0, jsx_runtime_1.jsx)(layout_1.Dropdown, { "$sourceRect": destRect, onClose: function () { return setDropdownVisible(false); }, "$width": rect.width, "$height": [results ? 250 : rect.height, 400], "$autoPositionY": false, children: (0, jsx_runtime_1.jsxs)(styles.QuickSearchDropdownContainer, { children: [(0, jsx_runtime_1.jsx)(InputComponent, { type: "text", ref: inputRef, value: term, placeholder: placeholder, onChange: function (e) { return setTerm(e.target.value); }, onClick: function (e) { return e.stopPropagation(); } }), results && ((0, jsx_runtime_1.jsx)(QuickSearchResults_1.QuickSearchResults, { results: results, definitions: types, term: debouncedTerm }))] }) }))] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(InputComponent, { type: "text", ref: fakeInputRef, value: term, onFocus: onFocus, placeholder: placeholder }), dropdownVisible && rect && ((0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { "$sourceRect": destRect, onClose: function () { return setDropdownVisible(false); }, "$width": rect.width, "$height": [results ? 250 : rect.height, 400], "$autoPositionY": false, children: (0, jsx_runtime_1.jsxs)(styles.QuickSearchDropdownContainer, { children: [(0, jsx_runtime_1.jsx)(InputComponent, { type: "text", ref: inputRef, value: term, placeholder: placeholder, onChange: function (e) { return setTerm(e.target.value); }, onClick: function (e) { return e.stopPropagation(); } }), results && ((0, jsx_runtime_1.jsx)(QuickSearchResults_1.QuickSearchResults, { results: results, definitions: types, term: debouncedTerm }))] }) }))] }));
 };
 exports.QuickSearchBar = QuickSearchBar;

package/dist/components/search/styles.d.ts

@@ -1,28 +1,10 @@
-export declare const QuickSearchDropdownContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const QuickSearchResultsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const QuickSearchResultsListContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const QuickSearchResultsTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const QuickSearchResultsItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const QuickSearchResultsDetailsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
+export declare const QuickSearchDropdownContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const QuickSearchResultsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const QuickSearchResultsListContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const QuickSearchResultsTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const QuickSearchResultsItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const QuickSearchResultsDetailsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
 export declare const QuickSearchResultsDetailsDivider: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>, never>> & string;
-export declare const QuickSearchResultDetailsTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const QuickSearchResultsDetailsList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDListElement>, HTMLDListElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDListElement>, HTMLDListElement>, "ref"> & {
-    ref?: ((instance: HTMLDListElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDListElement> | null | undefined;
-}>, never>, never>> & string;
-export declare const QuickSearchResultsDetailsTerm: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
-    ref?: ((instance: HTMLElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLElement> | null | undefined;
-}>, never>, never>> & string;
+export declare const QuickSearchResultDetailsTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
+export declare const QuickSearchResultsDetailsList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDListElement>, HTMLDListElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDListElement>, HTMLDListElement>>, never>, never>> & string;
+export declare const QuickSearchResultsDetailsTerm: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>, never>, never>> & string;