chop-logic-components 0.7.1 → 0.8.0

package/dist/components/index.d.ts

@@ -1,7 +1,8 @@
-export { default as ChopLogicButton } from './controls/button/Button';
+export { default as ChopLogicButton } from './inputs/button/Button';
 export { default as ChopLogicCheckbox } from './inputs/checkbox/Checkbox';
 export { default as ChopLogicMultiSelect } from './inputs/multi-select/MultiSelect';
 export { default as ChopLogicSelect } from './inputs/select/Select';
 export { default as ChopLogicTextInput } from './inputs/text/TextInput';
+export { default as ChopLogicAlert } from './modals/alert/Alert';
 export { default as ChopLogicDialog } from './modals/dialog/Dialog';
 export { default as ChopLogicTooltip } from './modals/tooltip/Tooltip';

package/dist/components/inputs/button/Button.styled.d.ts

@@ -0,0 +1,7 @@
+import { ChopLogicButtonView } from './types';
+
+export declare const StyledButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    $view: ChopLogicButtonView;
+    $disabled: boolean;
+}>> & string;
+export declare const StyledButtonText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;

package/dist/components/{controls → inputs}/button/types.d.ts

@@ -1,12 +1,11 @@
 import { MouseEventHandler } from 'react';
-import { Icon } from '../../../../../../../../../src/enums/icon';
+import { CLIcon } from '../../../../../../../../../src/components/misc/icon/types';
 
 export type ChopLogicButtonView = 'primary' | 'secondary' | 'danger' | 'icon';
 export type ChopLogicButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
-    text?: string;
     onClick?: MouseEventHandler<HTMLButtonElement> | (() => void);
     view?: ChopLogicButtonView;
-    disabled?: boolean;
-    icon?: Icon;
     label?: string;
+    icon?: CLIcon;
+    text?: string;
 };

package/dist/components/inputs/checkbox/Checkbox.d.ts

@@ -1,5 +1,11 @@
 import { default as React } from 'react';
-import { ChopLogicCheckboxProps } from './types';
 
+export type ChopLogicCheckboxProps = React.InputHTMLAttributes<HTMLInputElement> & {
+    id: string;
+    name: string;
+    label: string;
+    isLabelHidden?: boolean;
+    iconPosition?: 'left' | 'right';
+};
 declare const ChopLogicCheckbox: React.FC<ChopLogicCheckboxProps>;
 export default ChopLogicCheckbox;

package/dist/components/inputs/checkbox/Checkbox.styled.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const StyledCheckboxWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $disabled: boolean;
+}>> & string;
+export declare const StyledCheckboxInput: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;

package/dist/components/inputs/checkbox/__docs__/CheckboxExample.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
-import { ChopLogicCheckboxProps } from '../types';
+import { ChopLogicCheckboxProps } from '../Checkbox';
 
 declare const Example: React.FC<ChopLogicCheckboxProps>;
 export default Example;

package/dist/components/inputs/multi-select/MultiSelect.styled.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export declare const StyledMultiSelectWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $disabled: boolean;
+}>> & string;
+export declare const StyledMultiSelectCombobox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+export declare const StyledMultiSelectPlaceholder: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const StyledMultiSelectDropdown: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {
+    $opened: boolean;
+}>> & string;
+export declare const StyledMultiSelectOption: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;

package/dist/components/inputs/multi-select/elements/Dropdown.d.ts

@@ -1,4 +1,4 @@
 import { MultiSelectDropdownProps } from '../types';
 
-declare const SelectDropdown: React.FC<MultiSelectDropdownProps>;
-export default SelectDropdown;
+declare const MultiSelectDropdown: React.FC<MultiSelectDropdownProps>;
+export default MultiSelectDropdown;

package/dist/components/inputs/select/Select.styled.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export declare const StyledSelectWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $disabled: boolean;
+}>> & string;
+export declare const StyledSelectCombobox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+export declare const StyledSelectPlaceholder: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const StyledSelectDropdown: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {
+    $opened: boolean;
+}>> & string;
+export declare const StyledSelectOption: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;

package/dist/components/inputs/text/TextInput.styled.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const StyledTextInputContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledTextInputWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $disabled: boolean;
+    $invalid: boolean;
+}>> & string;
+export declare const StyledTextInput: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;

package/dist/components/{elements → misc}/error-message/ErrorMessage.d.ts

@@ -5,6 +5,7 @@ type ChopLogicErrorMessageProps = {
     visible?: boolean;
     message?: string;
     className?: string;
+    testId?: string;
 };
 declare const ChopLogicErrorMessage: React.FC<PropsWithChildren<ChopLogicErrorMessageProps>>;
 export default ChopLogicErrorMessage;

package/dist/components/misc/error-message/ErrorMessage.styled.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const StyledErrorMessage: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    $visible: boolean;
+}>> & string;

package/dist/components/misc/icon/Icon.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { CLIcon } from './types';
+
+declare const ChopLogicIcon: React.FC<{
+    name?: CLIcon;
+}>;
+export default ChopLogicIcon;

package/dist/components/misc/icon/elements/ArrowDown.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function ArrowDownIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default ArrowDownIcon;

package/dist/components/misc/icon/elements/ArrowUp.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function ArrowUpIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default ArrowUpIcon;

package/dist/components/misc/icon/elements/Back.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function BackIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default BackIcon;

package/dist/components/misc/icon/elements/Cancel.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function CancelIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default CancelIcon;

package/dist/components/misc/icon/elements/CheckMark.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function CheckMarkIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default CheckMarkIcon;

package/dist/components/misc/icon/elements/CheckboxChecked.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function CheckboxCheckedIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default CheckboxCheckedIcon;

package/dist/components/misc/icon/elements/CheckboxUnchecked.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function CheckboxUncheckedIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default CheckboxUncheckedIcon;

package/dist/components/misc/icon/elements/Copy.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function CopyIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default CopyIcon;

package/dist/components/misc/icon/elements/Cut.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function CutIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default CutIcon;

package/dist/components/misc/icon/elements/Delete.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function DeleteIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default DeleteIcon;

package/dist/components/misc/icon/elements/Download.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function DownloadIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default DownloadIcon;

package/dist/components/misc/icon/elements/Error.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function ErrorIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default ErrorIcon;

package/dist/components/misc/icon/elements/Forward.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function ForwardIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default ForwardIcon;

package/dist/components/misc/icon/elements/Help.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function HelpIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default HelpIcon;

package/dist/components/misc/icon/elements/Info.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function InfoIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default InfoIcon;

package/dist/components/misc/icon/elements/Paste.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function PasteIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default PasteIcon;

package/dist/components/misc/icon/elements/Question.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function QuestionIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default QuestionIcon;

package/dist/components/misc/icon/elements/Save.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function SaveIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default SaveIcon;

package/dist/components/misc/icon/elements/Upload.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function UploadIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default UploadIcon;

package/dist/components/misc/icon/elements/Warning.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function WarningIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default WarningIcon;

package/dist/components/misc/icon/types.d.ts

@@ -0,0 +1,22 @@
+export declare enum CLIcon {
+    ArrowDown = "arrow-down",
+    ArrowUp = "arrow-up",
+    Back = "back",
+    Cancel = "cancel",
+    CheckboxChecked = "checkbox-checked",
+    CheckboxUnchecked = "checkbox-unchecked",
+    CheckMark = "check-mark",
+    Copy = "copy",
+    Cut = "cut",
+    Delete = "delete",
+    Download = "download",
+    Error = "error",
+    Forward = "forward",
+    Help = "help",
+    Info = "info",
+    Paste = "paste",
+    Question = "question",
+    Save = "save",
+    Upload = "upload",
+    Warning = "warning"
+}

package/dist/components/{elements → misc}/label/Label.d.ts

@@ -6,6 +6,8 @@ type ChopLogicLabelProps = {
     inputId: string;
     className?: string;
     isTextHidden?: boolean;
+    icon?: React.ReactElement;
+    iconPosition?: 'left' | 'right';
 };
 declare const ChopLogicLabel: React.FC<PropsWithChildren<ChopLogicLabelProps>>;
 export default ChopLogicLabel;

package/dist/components/misc/label/Label.styled.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const StyledLabel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
+export declare const StyledLabelText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const StyledRequiredSign: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;

package/dist/components/misc/label/__tests__/Label.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/modals/alert/Alert.styled.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare const StyledAlertHeader: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
+export declare const StyledAlertWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $isClosing: boolean;
+}>> & string;
+export declare const StyledAlertContent: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/modals/alert/elements/Header.d.ts

@@ -1,10 +1,12 @@
 import { default as React } from 'react';
+import { CLIcon } from '../../../../../../../../../../src/components/misc/icon/types';
 import { ChopLogicAlertMode } from '../types';
 
 type ChopLogicAlertHeaderProps = {
     onClose: () => void;
-    title?: string;
     mode: ChopLogicAlertMode;
+    title?: string;
+    icon?: CLIcon;
 };
 declare const ChopLogicAlertHeader: React.FC<ChopLogicAlertHeaderProps>;
 export default ChopLogicAlertHeader;

package/dist/components/modals/alert/helpers/render-alert-icon.d.ts

@@ -0,0 +1,4 @@
+import { CLIcon } from '../../../../../../../../../../src/components/misc/icon/types';
+import { ChopLogicAlertMode } from '../types';
+
+export declare function renderAlertIcon(mode: ChopLogicAlertMode, icon?: CLIcon): React.ReactElement | null;

package/dist/components/modals/alert/types.d.ts

@@ -1,4 +1,5 @@
-/// <reference types="react" />
+import { CLIcon } from '../../../../../../../../../src/components/misc/icon/types';
+
 export type ChopLogicAlertMode = 'success' | 'error' | 'warning' | 'info' | 'help';
 export type ChopLogicAlertProps = React.HTMLAttributes<HTMLDivElement> & {
     isOpened: boolean;
@@ -6,4 +7,5 @@ export type ChopLogicAlertProps = React.HTMLAttributes<HTMLDivElement> & {
     message: string;
     title?: string;
     mode?: ChopLogicAlertMode;
+    icon?: CLIcon;
 };

package/dist/components/modals/dialog/Dialog.styled.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const StyledDialogLayout: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledDialogBackground: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $isClosing: boolean;
+}>> & string;
+export declare const StyledDialogHeader: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
+export declare const StyledDialogContent: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/modals/tooltip/Tooltip.styled.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const StyledTooltip: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/constants/animations.d.ts

@@ -0,0 +1,2 @@
+export declare const fadeInAnimation = "\n    animation: fadeIn ease 400ms;\n    -webkit-animation: fadeIn ease 400ms;\n    -moz-animation: fadeIn ease 400ms;\n\n    @keyframes fadeIn {\n        0% {\n            opacity: 0;\n        }\n        100% {\n            opacity: 1;\n        }\n    }\n\n    @-moz-keyframes fadeIn {\n        0% {\n            opacity: 0;\n        }\n        100% {\n            opacity: 1;\n        }\n    }\n\n    @-webkit-keyframes fadeIn {\n        0% {\n            opacity: 0;\n        }\n        100% {\n            opacity: 1;\n        }\n    }\n";
+export declare const fadeOutAnimation = "\n    animation: fadeOut ease 400ms;\n    -webkit-animation: fadeOut ease 400ms;\n    -moz-animation: fadeOut ease 400ms;\n\n    @keyframes fadeOut {\n        0% {\n            opacity: 1;\n        }\n        100% {\n            opacity: 0;\n        }\n    }\n\n    @-moz-keyframes fadeOut {\n        0% {\n            opacity: 1;\n        }\n        100% {\n            opacity: 0;\n        }\n    }\n\n    @-webkit-keyframes fadeOut {\n        0% {\n            opacity: 1;\n        }\n        100% {\n            opacity: 0;\n        }\n    }\n";

package/dist/constants/style-variables.d.ts

@@ -0,0 +1,49 @@
+export declare const COLORS: Readonly<{
+    primary: "hsl(0, 0%, 13%)";
+    background: "hsl(0, 0%, 100%)";
+    highlight: "hsl(65, 43%, 95%)";
+    shade: "hsl(206, 19%, 93%)";
+    secondary: "hsl(215, 69%, 49%)";
+    tertiary: "hsl(205, 48%, 56%)";
+    accent: "hsl(16, 100%, 45%)";
+    transparentBackground: "hsla(0, 0%, 0%, 0.3)";
+}>;
+export declare const FONTS: Readonly<{
+    core: "Arial, Helvetica, sans-serif";
+    monospace: "'Courier New', Courier, monospace";
+}>;
+export declare const UNITS: Readonly<{
+    smallGap: "0.25rem";
+    mediumGap: "0.6rem";
+    bigGap: "1rem";
+    minElementSize: "2.75rem";
+    blockBorderRadius: "0.375rem";
+}>;
+export declare const SHADOWS: Readonly<{
+    box: "rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px";
+    text: "2.4px 2.4px 3.2px rgba(0, 0, 0, 0.3)";
+    inset: "-5px 5px 20px 5px rgba(0, 0, 0, 0.1) inset";
+}>;
+export declare const BORDERS: Readonly<{
+    lightBlue: "1px solid #5998c5";
+    darkBlue: "1px solid #266dd3";
+    accent: "1px solid #e53d00";
+    focusOutline: "2px dashed #e53d00";
+}>;
+export declare const Z_INDEXES: Readonly<{
+    dropdown: 1000;
+    modal: 2000;
+    tooltip: 3000;
+}>;
+export declare const GRADIENTS: Readonly<{
+    primary: "linear-gradient(0deg, #222222, #266dd3)";
+    accent: "linear-gradient(0deg, #222222, #e53d00)";
+    tint: "linear-gradient(0deg, #e9edf0, #f6f7eb)";
+}>;
+export declare const SCREEN_BREAKPOINTS: Readonly<{
+    phones: "only screen and (max-width: 600px)";
+    portraitTablets: "only screen and (min-width: 600px)";
+    landscapeTablets: "only screen and (min-width: 768px)";
+    laptops: "only screen and (min-width: 992px)";
+    desktops: "only screen and (min-width: 1200px)";
+}>;