@vibe/core 3.81.1-alpha-635d8.0 → 3.81.1-alpha-56c2d.0

package/dist/tests/constants.d.ts

@@ -0,0 +1,204 @@
+export declare enum ComponentDefaultTestId {
+    EMPTY_STATE = "empty-state",
+    TRANSITION_VIEW = "transition-view",
+    TEXT_AREA = "text-area",
+    EDITABLE_TEXT = "editable-text",
+    TIPSEEN_MEDIA = "tipseen-media",
+    INDICATOR = "indicator",
+    BADGE = "badge",
+    TITLE = "title",
+    TEXT = "text",
+    COMBOBOX = "combobox",
+    COMBOBOX_CATEGORY = "combobox-category",
+    COMBOBOX_OPTION = "combobox-option",
+    COLOR_PICKER = "color-picker",
+    CHECKBOX = "checkbox",
+    CHECKBOX_LABEL = "checkbox-label",
+    CHECKBOX_CHECKBOX = "checkbox-checkbox",
+    DROPDOWN = "dropdown",
+    DROPDOWN_OPTION_CONTENT = "dropdown-option-content",
+    BUTTON = "button",
+    BUTTON_GROUP = "button-group",
+    CLICKABLE = "clickable",
+    VIRTUALIZED_LIST = "virtualized-list",
+    VIRTUALIZED_GRID = "virtualized-grid",
+    TEXT_FIELD = "text-field",
+    TEXT_FIELD_SECONDARY_BUTTON = "text-field-secondary-button",
+    SEARCH = "search",
+    CLEAN_SEARCH_BUTTON = "clean-search-button",
+    COLOR_PICKER_ITEM = "color-picker-item",
+    ICON_BUTTON = "icon-button",
+    INFO = "info",
+    SVG_ICON = "svg-icon",
+    CHIP = "chip",
+    RADIO_BUTTON = "radio-button",
+    RADIO_BUTTON_LABEL = "radio-button-label",
+    RADIO_BUTTON_CONTROL = "radio-button-control",
+    TAB = "tab",
+    TAB_PANEL = "tab-panel",
+    TAB_PANELS = "tab-panels",
+    TAB_LIST = "tab-list",
+    TABS_CONTEXT = "tabs-context",
+    ALERT_BANNER = "alert-banner",
+    ALERT_BANNER_BUTTON = "alert-banner-button",
+    ALERT_BANNER_LINK = "alert-banner-link",
+    ALERT_BANNER_TEXT = "alert-banner-text",
+    ATTENTION_BOX = "attention-box",
+    BOX = "box",
+    AVATAR = "avatar",
+    AVATAR_BADGE = "avatar-badge",
+    AVATAR_CONTENT = "avatar-content",
+    BREADCRUMB_ITEM = "breadcrumb-item",
+    BREADCRUMBS_BAR = "breadcrumbs-bar",
+    BREADCRUMB_MENU = "breadcrumb-menu",
+    BREADCRUMB_MENU_ITEM = "breadcrumb-menu-item",
+    LINEAR_PROGRESS_BAR = "linear-progress-bar",
+    BAR = "bar",
+    BAR_PRIMARY = "bar-primary",
+    BAR_SECONDARY = "bar-secondary",
+    COLOR_PICKER_ITEM_COMPONENT = "color-picker-item-component",
+    COUNTER = "counter",
+    MENU = "menu",
+    OPTION = "option",
+    EXPAND_COLLAPSE = "expand-collapse",
+    EDITABLE_INPUT = "editable-input",
+    EDITABLE_HEADING = "editable-heading",
+    HEADING = "heading",
+    LABEL = "label",
+    LINK = "link",
+    MENU_DIVIDER = "menu-divider",
+    MENU_ITEM = "menu-item",
+    MENU_ITEM_BUTTON = "menu-item-button",
+    MENU_TITLE = "menu-title",
+    MENU_TITLE_CAPTION = "menu-title-caption",
+    MENU_GRID_ITEM = "menu-grid-item",
+    MENU_BUTTON = "menu-button",
+    STEP_INDICATOR = "step-indicator",
+    STEPS = "steps",
+    STEPS_FORWARD_COMMAND = "steps-forward-command",
+    STEPS_BACKWARD_COMMAND = "steps-backward-command",
+    MULTI_STEP_INDICATOR = "multi-step-indicator",
+    SKELETON = "skeleton",
+    SPLIT_BUTTON = "split-button",
+    SPLIT_BUTTON_PRIMARY_BUTTON = "split-button-primary-button",
+    SPLIT_BUTTON_SECONDARY_BUTTON = "split-button-secondary-button",
+    TEXT_WITH_HIGHLIGHT = "text-with-highlight",
+    TOAST = "toast",
+    TOAST_CONTENT = "toast-content",
+    TOAST_LINK = "toast-link",
+    TOAST_BUTTON = "toast-button",
+    TOAST_CLOSE_BUTTON = "toast-close-button",
+    TOGGLE = "toggle",
+    TIPSEEN = "tipseen",
+    TIPSEEN_CONTENT = "tipseen-content",
+    TIPSEEN_CONTENT_SUBMIT = "tipseen-content-submit",
+    TIPSEEN_CONTENT_DISMISS = "tipseen-content-dismiss",
+    TIPSEEN_TITLE = "tipseen-title",
+    DIVIDER = "divider",
+    DATEPICKER = "date-picker",
+    DATEPICKER_HEADER = "date-picker-header",
+    DATEPICKER_YEAR_SELECTION = "date-picker-year-selection",
+    LOADER = "loader",
+    ICON = "icon",
+    RESPONSIVE_LIST = "responsive-list",
+    LIST = "list",
+    MODAL = "monday-dialog-container",
+    MODAL_OVERLAY = "monday-modal-overlay",
+    MODAL_CONTENT = "modal-content",
+    MODAL_HEADER = "modal-header",
+    MODAL_FOOTER_BUTTONS = "modal-footer-buttons",
+    MODAL_NEXT = "modal",
+    MODAL_NEXT_OVERLAY = "modal-overlay",
+    MODAL_NEXT_HEADER = "modal-header",
+    MODAL_NEXT_CLOSE_BUTTON = "modal-close-button",
+    MODAL_NEXT_CONTENT = "modal-content",
+    MODAL_NEXT_FOOTER = "modal-footer",
+    MODAL_NEXT_MEDIA = "modal-media",
+    MODAL_NEXT_BASIC_LAYOUT = "modal-basic-layout",
+    MODAL_NEXT_SIDE_BY_SIDE_LAYOUT = "modal-side-by-side-layout",
+    MODAL_NEXT_MEDIA_LAYOUT = "modal-media-layout",
+    FORMATTED_NUMBER = "formatted-number",
+    HIDDEN_TEXT = "hidden-text",
+    DIALOG_CONTENT_CONTAINER = "dialog-content-container",
+    FLEX = "flex",
+    TOOLTIP = "tooltip",
+    DIALOG = "dialog",
+    TABLE = "table",
+    TABLE_CONTAINER = "table-container",
+    TABLE_BODY = "table-body",
+    TABLE_VIRTUALIZED_BODY = "table-virtualized-body",
+    TABLE_CELL = "table-cell",
+    TABLE_HEADER = "table-header",
+    TABLE_HEADER_CELL = "table-header-cell",
+    TABLE_ROW = "table-row",
+    TABLE_ROW_MENU = "table-row-menu"
+}
+export declare enum NavigationCommand {
+    RIGHT_ARROW = "{arrowright}",
+    LEFT_ARROW = "{arrowleft}",
+    UP_ARROW = "{arrowup}",
+    DOWN_ARROW = "{arrowdown}",
+    TAB = "#TAB#",
+    ENTER = "{enter}",
+    PAGE_UP = "{pageup}",
+    PAGE_DOWN = "{pagedown}"
+}
+export declare enum ComponentVibeId {
+    ACCORDION = "Accordion",
+    ALERT_BANNER = "AlertBanner",
+    ATTENTION_BOX = "AttentionBox",
+    AVATAR = "Avatar",
+    AVATAR_GROUP = "AvatarGroup",
+    BADGE = "Badge",
+    BOX = "Box",
+    BREADCRUMBS_BAR = "BreadcrumbsBar",
+    BUTTON = "Button",
+    BUTTON_GROUP = "ButtonGroup",
+    CHECKBOX = "Checkbox",
+    CHIPS = "Chips",
+    COLOR_PICKER = "ColorPicker",
+    COMBOBOX = "Combobox",
+    COUNTER = "Counter",
+    DATE_PICKER = "DatePicker",
+    DIALOG = "Dialog",
+    DIVIDER = "Divider",
+    DROPDOWN = "Dropdown",
+    EDITABLE_HEADING = "EditableHeading",
+    EDITABLE_TEXT = "EditableText",
+    EMPTY_STATE = "EmptyState",
+    EXPAND_COLLAPSE = "ExpandCollapse",
+    FLEX = "Flex",
+    HEADING = "Heading",
+    ICON = "Icon",
+    ICON_BUTTON = "IconButton",
+    INFO = "Info",
+    LABEL = "Label",
+    LINEAR_PROGRESS_BAR = "LinearProgressBar",
+    LINK = "Link",
+    LIST = "List",
+    LOADER = "Loader",
+    MENU = "Menu",
+    MENU_BUTTON = "MenuButton",
+    MODAL = "Modal",
+    MULTI_STEP_INDICATOR = "MultiStepIndicator",
+    NUMBER_FIELD = "NumberField",
+    RADIO_BUTTON = "RadioButton",
+    SEARCH = "Search",
+    SKELETON = "Skeleton",
+    SLIDER = "Slider",
+    SPLIT_BUTTON = "SplitButton",
+    STEPS = "Steps",
+    TAB = "Tab",
+    TABLE = "Table",
+    TEXT = "Text",
+    TEXT_AREA = "TextArea",
+    TEXT_FIELD = "TextField",
+    TEXT_WITH_HIGHLIGHT = "TextWithHighlight",
+    THEME_PROVIDER = "ThemeProvider",
+    TIPSEEN = "Tipseen",
+    TOAST = "Toast",
+    TOGGLE = "Toggle",
+    TOOLTIP = "Tooltip",
+    VIRTUALIZED_GRID = "VirtualizedGrid",
+    VIRTUALIZED_LIST = "VirtualizedList"
+}

package/dist/tests/interactions-utils.d.ts

@@ -0,0 +1,57 @@
+import { type queries } from "@storybook/test";
+import { type BoundFunctions, type Screen, type SelectorMatcherOptions } from "@testing-library/react";
+import { NavigationCommand as NavigationCommandType } from "./constants";
+export type Canvas = HTMLElement | BoundFunctions<typeof queries>;
+export type TestFunction = (canvas: Canvas, args: Record<string, any>) => unknown;
+export type Coordinates = {
+    x: number;
+    y: number;
+};
+export declare const testFunctionWrapper: (testFunc: TestFunction) => ({ canvasElement, args }: {
+    canvasElement: Screen;
+    args: Record<string, any>;
+}) => Promise<unknown>;
+export declare const clearText: (element: HTMLElement) => Promise<void>;
+export declare const NavigationCommand: typeof NavigationCommandType;
+export declare const resetFocus: () => Promise<void>;
+export declare const interactionSuite: ({ beforeEach, beforeAll, skip, tests, afterEach, afterAll }: {
+    beforeEach?: TestFunction;
+    beforeAll?: TestFunction;
+    skip?: boolean;
+    tests: Array<TestFunction>;
+    afterAll?: TestFunction;
+    afterEach?: TestFunction;
+}) => ({ canvasElement, args }: {
+    canvasElement: Screen;
+    args: Record<string, any>;
+}) => Promise<void>;
+export declare const getByTestId: (rootElement: HTMLElement | BoundFunctions<typeof queries>, dataTestId: string) => HTMLElement;
+export declare const getAllByTestId: (rootElement: HTMLElement | BoundFunctions<typeof queries>, dataTestId: string) => HTMLElement[];
+export declare const getByPlaceholderText: (rootElement: HTMLElement | BoundFunctions<typeof queries>, text: string) => HTMLElement;
+export declare const getAllByPlaceholderText: (rootElement: HTMLElement | BoundFunctions<typeof queries>, text: string) => HTMLElement[];
+export declare const getByClassName: (className: string) => HTMLCollectionOf<Element>;
+export declare const getFirstByClassName: (className: string) => Element;
+export declare const getByRole: (rootElement: HTMLElement | BoundFunctions<typeof queries>, role: string, options?: {}) => HTMLElement;
+export declare const getAllByRole: (rootElement: HTMLElement | BoundFunctions<typeof queries>, role: string) => HTMLElement[];
+export declare const getByLabelText: (rootElement: HTMLElement | BoundFunctions<typeof queries>, text: string) => HTMLElement;
+export declare const getAllByLabelText: (rootElement: HTMLElement, text: string) => HTMLElement[];
+export declare const getByText: (rootElement: HTMLElement | BoundFunctions<typeof queries>, text: string, options?: SelectorMatcherOptions) => HTMLElement;
+export declare const getAllByText: (rootElement: HTMLElement | BoundFunctions<typeof queries>, text: string) => HTMLElement[];
+export declare const clickElement: (element: HTMLElement) => Promise<void>;
+export declare const hoverElement: (element: HTMLElement) => Promise<void>;
+export declare const typeText: (element: HTMLElement, text: string, waitForDebounceMs?: number) => Promise<void>;
+export declare const expectActiveElementToHaveExactText: (text: string) => void;
+export declare const expectActiveElementToHavePartialText: (text: string) => void;
+export declare const pressNavigationKey: (command?: NavigationCommandType, waitForDebounceMs?: number) => Promise<any>;
+export declare function delay(timeout: number): Promise<unknown>;
+export declare const waitForElementVisible: (getterFunc: () => HTMLElement) => Promise<unknown>;
+export declare const typeMultipleTimes: (text: string, count: number, options?: {
+    delay: number;
+}) => Promise<void>;
+export declare function drag(element: HTMLElement, { delta, toCoords, toElm, steps, duration }: {
+    delta: Coordinates;
+    toCoords: Coordinates;
+    toElm: HTMLElement;
+    steps: number;
+    duration: number;
+}): Promise<void>;

package/dist/tests/test-ids-utils.d.ts

@@ -0,0 +1,3 @@
+import { ComponentDefaultTestId as TestIds } from "./constants";
+export declare const ComponentDefaultTestId: typeof TestIds;
+export declare const getTestId: (elementType: TestIds, id?: string | number) => string;

package/dist/tokens/tokens.css

@@ -0,0 +1 @@
+:root{--motion-productive-short:70ms;--motion-productive-medium:100ms;--motion-productive-long:150ms;--motion-expressive-short:250ms;--motion-expressive-long:400ms;--motion-timing-enter:cubic-bezier(0, 0, 0.35, 1);--motion-timing-exit:cubic-bezier(0.4, 0, 1, 1);--motion-timing-transition:cubic-bezier(0.4, 0, 0.2, 1);--motion-timing-emphasize:cubic-bezier(0, 0, 0.2, 1.4);--expand-animation-timing:var(--motion-timing-enter)}:root{--spacing-xs:4px;--spacing-small:8px;--spacing-medium:16px;--spacing-large:24px;--spacing-xl:32px;--spacing-xxl:48px;--spacing-xxxl:64px;--space-2:2px;--space-4:4px;--space-8:8px;--space-12:12px;--space-16:16px;--space-20:20px;--space-24:24px;--space-32:32px;--space-40:40px;--space-48:48px;--space-64:64px;--space-80:80px}:root{--border-width:1px;--border-style:solid}:root{--border-radius-small:4px;--border-radius-medium:8px;--border-radius-big:16px}:root{--disabled-component-opacity:0.38}:root{--font-family:Figtree,Roboto,Noto Sans Hebrew,Noto Kufi Arabic,Noto Sans JP,sans-serif;--title-font-family:Poppins,Roboto,Noto Sans Hebrew,Noto Kufi Arabic,Noto Sans JP,sans-serif;--h1-font-family:var(--title-font-family);--font-smoothing-webkit:antialiased;--font-smoothing-moz:grayscale;--font-weight-very-light:200;--font-weight-light:300;--font-weight-normal:400;--font-weight-bold:500;--font-line-height-10:18px;--font-line-height-20:24px;--font-line-height-30:24px;--font-line-height-40:24px;--font-line-height-50:32px;--font-line-height-60:42px;--font-size-10:14px;--font-size-20:14px;--font-size-30:16px;--font-size-40:18px;--font-size-50:24px;--font-size-60:30px;--font-size-h1:var(--font-size-60);--font-size-h2:var(--font-size-50);--font-size-h3:var(--font-size-50);--font-size-h4:var(--font-size-40);--font-size-h5:var(--font-size-30);--font-size-general-label:var(--font-size-20);--font-size-paragraph:var(--font-size-30);--font-size-subtext:var(--font-size-10);--font-line-height-h1:var(--font-line-height-60);--font-line-height-h2:var(--font-line-height-50);--font-line-height-h3:var(--font-line-height-50);--font-line-height-h4:var(--font-line-height-40);--font-line-height-h5:var(--font-line-height-30);--font-line-height-general-label:var(--font-line-height-20);--font-line-height-paragraph:var(--font-line-height-30);--font-line-height-subtext:var(--font-line-height-10);--font-h1:var(--font-weight-bold) var(--font-size-h1)/var(--font-line-height-h1) var(--title-font-family);--font-h2:var(--font-weight-bold) var(--font-size-h2)/var(--font-line-height-h2) var(--title-font-family);--font-h3:var(--font-weight-light) var(--font-size-h3)/var(--font-line-height-h3) var(--title-font-family);--font-h4:var(--font-weight-bold) var(--font-size-h4)/var(--font-line-height-h4) var(--title-font-family);--font-h5:var(--font-weight-bold) var(--font-size-h5)/var(--font-line-height-h5) var(--font-family);--font-general-label:var(--font-weight-normal) var(--font-size-general-label)/var(--font-line-height-general-label) var(--font-family);--font-paragraph:var(--font-weight-normal) var(--font-size-paragraph)/var(--font-line-height-paragraph) var(--font-family);--font-subtext:var(--font-weight-normal) var(--font-size-subtext)/var(--font-line-height-subtext) var(--font-family);--font-h1-bold:700 32px/40px var(--title-font-family);--font-h1-medium:600 32px/40px var(--title-font-family);--font-h1-normal:500 32px/40px var(--title-font-family);--font-h1-light:300 32px/40px var(--title-font-family);--font-h2-bold:700 24px/30px var(--title-font-family);--font-h2-medium:600 24px/30px var(--title-font-family);--font-h2-normal:500 24px/30px var(--title-font-family);--font-h2-light:300 24px/30px var(--title-font-family);--font-h3-bold:700 18px/24px var(--title-font-family);--font-h3-medium:600 18px/24px var(--title-font-family);--font-h3-normal:500 18px/24px var(--title-font-family);--font-h3-light:300 18px/24px var(--title-font-family);--font-text1-bold:700 16px/22px var(--font-family);--font-text1-medium:600 16px/22px var(--font-family);--font-text1-normal:400 16px/22px var(--font-family);--font-text2-bold:700 14px/20px var(--font-family);--font-text2-medium:600 14px/20px var(--font-family);--font-text2-normal:400 14px/20px var(--font-family);--font-text3-bold:700 12px/16px var(--font-family);--font-text3-medium:600 12px/16px var(--font-family);--font-text3-normal:400 12px/16px var(--font-family);--letter-spacing-h1-bold:-0.5px;--letter-spacing-h1-normal:-0.5px;--letter-spacing-h1-light:-0.5px;--letter-spacing-h2-bold:-0.1px;--letter-spacing-h2-normal:-0.1px;--letter-spacing-h2-light:-0.1px;--letter-spacing-h3-bold:-0.1px;--letter-spacing-h3-normal:-0.1px;--letter-spacing-h3-light:-0.1px}.default-app-theme,.light-app-theme,:root{--primary-color:#0073ea;--primary-hover-color:#0060b9;--primary-selected-color:#cce5ff;--primary-selected-hover-color:#aed4fc;--primary-highlighted-color:#f0f7ff;--primary-surface-color:#eceff8;--primary-text-color:#323338;--secondary-text-color:#676879;--text-color-on-inverted:#ffffff;--text-color-on-primary:#ffffff;--disabled-text-color:rgba(50, 51, 56, var(--disabled-component-opacity));--inverted-color-background:#323338;--fixed-dark-color:#323338;--fixed-light-color:#ffffff;--primary-background-color:#ffffff;--primary-background-hover-color:rgba(103, 104, 121, 0.1);--secondary-background-color:#ffffff;--allgrey-background-color:#f6f7fb;--backdrop-color:rgba(41, 47, 76, 0.7);--ui-border-color:#c3c6d4;--ui-background-color:#e7e9ef;--ui-background-hover-color:#d8d9e0;--layout-border-color:#d0d4e4;--placeholder-color:#676879;--icon-color:#676879;--disabled-background-color:#ecedf5;--link-color:#1f76c2;--brand-color:#0073ea;--brand-hover-color:#0060b9;--brand-selected-color:#cce5ff;--brand-selected-hover-color:#aed4fc;--positive-color:#00854d;--positive-color-hover:#007038;--positive-color-selected:#bbdbc9;--positive-color-selected-hover:#b5cec0;--negative-color:#d83a52;--negative-color-hover:#b63546;--negative-color-selected:#f4c3cb;--negative-color-selected-hover:#ecb7bf;--warning-color:#ffcb00;--warning-color-hover:#eaaa15;--warning-color-selected:#fceba1;--warning-color-selected-hover:#f2d973;--color-highlight_blue:#cce5ff;--color-basic_blue:#0073ea;--color-dark_blue:#0060b9;--color-bazooka:#f65f7c;--color-snow_white:#ffffff;--color-riverstone_gray:#f6f7fb;--color-ui_grey:#dcdfec;--color-wolf_gray:#c3c6d4;--color-asphalt:#676879;--color-mud_black:#323338;--color-black:#000000;--color-success:#00854d;--color-success-hover:#007038;--color-success-highlight:#bbdbc9;--color-error:#d83a52;--color-error-hover:#b63546;--color-error-highlight:#f4c3cb;--color-link_color:#1f76c2;--color-surface:#292f4c;--grey-background-color:#f6f7fb;--text-color-on-brand:#ffffff;--box-shadow-xs:0px 4px 6px -4px rgba(0, 0, 0, 0.1);--box-shadow-small:0px 4px 8px rgba(0, 0, 0, 0.2);--box-shadow-medium:0px 6px 20px rgba(0, 0, 0, 0.2);--box-shadow-large:0px 15px 50px rgba(0, 0, 0, 0.3);--color-grass_green:#037f4c;--color-grass_green-hover:#116846;--color-grass_green-selected:#81bfa5;--color-done-green:#00c875;--color-done-green-hover:#0f9b63;--color-done-green-selected:#80e3ba;--color-done-green-selected-with-opacity:rgba(128, 227, 186, 0.6);--color-bright-green:#9cd326;--color-bright-green-hover:#7ca32b;--color-bright-green-selected:#cde992;--color-saladish:#cab641;--color-saladish-hover:#9d8f3e;--color-saladish-selected:#e4daa0;--color-egg_yolk:#ffcb00;--color-egg_yolk-hover:#eaaa15;--color-egg_yolk-selected:#ffe580;--color-egg_yolk-rgb:255,213,51;--color-working_orange:#fdab3d;--color-working_orange-hover:#c0873c;--color-working_orange-selected:#fed59e;--color-dark-orange:#ff6d3b;--color-dark-orange-hover:#c25531;--color-dark-orange-selected:#ffb196;--color-peach:#ffadad;--color-peach-hover:#c2888a;--color-peach-selected:#ffd6d6;--color-sunset:#ff7575;--color-sunset-hover:#c26163;--color-sunset-selected:#ffbaba;--color-sunset-selected-with-opacity:rgba(255, 186, 186, 0.6);--color-stuck-red:#df2f4a;--color-stuck-red-hover:#ad3f51;--color-stuck-red-selected:#f0a1ad;--color-dark-red:#bb3354;--color-dark-red-hover:#92334c;--color-dark-red-selected:#dd99a9;--color-sofia_pink:#e50073;--color-sofia_pink-hover:#c20062;--color-sofia_pink-selected:#ff8ac4;--color-lipstick:#ff5ac4;--color-lipstick-hover:#c24e9a;--color-lipstick-selected:#fface1;--color-bubble:#faa1f1;--color-bubble-hover:#be80ba;--color-bubble-selected:#fcd0f8;--color-purple:#9d50dd;--color-purple-hover:#7d45b0;--color-purple-selected:#d0aeed;--color-dark_purple:#784bd1;--color-dark_purple-hover:#6344a3;--color-dark_purple-selected:#bba5e8;--color-berry:#7e3b8a;--color-berry-hover:#673971;--color-berry-selected:#be9dc4;--color-dark_indigo:#401694;--color-dark_indigo-hover:#3c1f78;--color-dark_indigo-selected:#a08bc9;--color-indigo:#5559df;--color-indigo-hover:#4b4ead;--color-indigo-selected:#aaacef;--color-navy:#225091;--color-navy-hover:#274776;--color-navy-selected:#90a7c8;--color-bright-blue:#579bfc;--color-bright-blue-hover:#4c7cc1;--color-bright-blue-selected:#abcdfd;--color-dark-blue:#007eb5;--color-dark-blue-hover:#0f6d97;--color-dark-blue-selected:#80c2df;--color-aquamarine:#4eccc6;--color-aquamarine-hover:#469e9b;--color-aquamarine-selected:#a6e5e2;--color-chili-blue:#66ccff;--color-chili-blue-hover:#569ec3;--color-chili-blue-selected:#b2e5ff;--color-river:#74afcc;--color-river-hover:#588095;--color-river-selected:#b3d0de;--color-winter:#9aadbd;--color-winter-hover:#7b8895;--color-winter-selected:#ccd6de;--color-explosive:#c4c4c4;--color-explosive-hover:#98999a;--color-explosive-selected:#e1e1e1;--color-american_gray:#757575;--color-american_gray-hover:#69696a;--color-american_gray-selected:#bfbfbf;--color-blackish:#333333;--color-blackish-hover:#222222;--color-blackish-selected:#999999;--color-brown:#7f5347;--color-brown-hover:#684943;--color-brown-selected:#bfa9a3;--color-orchid:#e484bd;--color-orchid-hover:#ae5d8d;--color-orchid-selected:#ecbad7;--color-tan:#bca58a;--color-tan-hover:#8a7862;--color-tan-selected:#d6cabc;--color-sky:#a1e3f6;--color-sky-hover:#81b6c5;--color-sky-selected:#d0f1fa;--color-coffee:#cd9282;--color-coffee-hover:#976758;--color-coffee-selected:#dec0b7;--color-royal:#216edf;--color-royal-hover:#225eb7;--color-royal-selected:#95bbf2;--color-teal:#175a63;--color-teal-hover:#12484f;--color-teal-selected:#8bacb1;--color-lavender:#bda8f9;--color-lavender-hover:#9786c7;--color-lavender-selected:#ded4fc;--color-steel:#a9bee8;--color-steel-hover:#8798ba;--color-steel-selected:#d4dff4;--color-lilac:#9d99b9;--color-lilac-hover:#7e7a94;--color-lilac-selected:#ceccdc;--color-pecan:#563e3e;--color-pecan-hover:#453232;--color-pecan-selected:#ab9f9f;--color-dark_marble:#f1f1f1;--color-marble:#f7f7f7;--color-gainsboro:#e1e1e1;--color-extra_light_gray:#edeef0;--color-glitter:#d9f0ff;--color-ultra_light_gray:#ebebeb;--color-very_light_gray:#a1a1a1;--color-jaco_gray:#9699a6;--color-storm_gray:#6b6d77;--color-trolley-grey:#757575;--color-basic_light_blue:#c7e6fa;--color-light_blue:#61caf7;--color-turquoise:#66ccff;--color-aqua:#00d1d1;--color-live_blue:#009aff;--color-jeans:#597bfc;--color-burned_eggplant:#181d37;--color-light-pink:#ff5ac4;--color-dark-pink:#ff007f;--color-dark_red:#bb3354;--color-yellow:#ffcb00;--color-mustered:#cab641;--color-orange:#fdab3d;--color-lime-green:#9cd326;--color-jade:#03c875;--color-green-haze:#00a359;--color-grass-green:#037f4c;--color-amethyst:#9d50dd;--color-dark-purple:#784bd1;--color-blue_links:#007eb5;--color-blue-links:#007eb5;--color-private:#f65f7c;--color-public:#009aff;--color-board_views_grey:#6e6f8f;--color-board_views_grey_hover:#b2b3d0;--color-board_views_blue:#1c1f3b;--color-board_views_blue_secondary:#363a52;--color-border_light_gray:#f5f6f8;--color-brand-blue:#00a9ff;--color-brand-charcoal:#2b2c5c;--color-brand-gold:#ffcc00;--color-brand-green:#11dd80;--color-brand-iris:#595ad4;--color-brand-light-blue:#00cff4;--color-brand-malachite:#00cd6f;--color-brand-purple:#a358d0;--color-brand-red:#f74875;--color-deadline_upcoming_indication:#5d6387;--color-default_group_color:#579bfc;--color-form_btn_hover:#0083d9;--color-form_purple:#575c96;--color-highlight:#dff0ff;--color-green_shadow:#00c875;--color-green-shadow:#00c875;--color-red_shadow:#df2f4a;--color-red-shadow:#df2f4a;--color-pulse_bg:#f0f0f0;--color-pulse_text_color:#333333;--color-placholder_gray:#d8d8d8;--color-placeholder_light_gray:#efefef;--color-excel-green:#207245;--color-media-blue:#2ea2e9;--color-pdf-red:#bb0706;--color-ppt-orange:#d64e2a;--color-word-blue:#2a5699;--color-zip-orange:#e4901c;--color-like_red:#fb275d;--color-scrollbar_gray:#b2b2b2;--color-timeline_grid_blue:#454662;--color-timeline_blue:#1c1f3b;--color-highlight_blue-rgb:204,229,255;--color-snow_white-with-opacity:rgba(255, 255, 255, 0.4);--color-wolf_gray-with-opacity:rgba(195, 198, 212, 0.1);--color-asphalt-with-opacity:rgba(103, 104, 121, 0.1);--primary-on-secondary-color:#0073ea;--primary-hover-on-secondary-color:#0060b9;--primary-selected-color-rgb:204,229,255;--primary-selected-on-secondary-color:#cce5ff;--primary-text-on-secondary-color:#323338;--text-color-on-primary-with-opacity:rgba(255, 255, 255, 0.4);--secondary-text-on-secondary-color:#676879;--placeholder-color-with-opacity:rgba(103, 104, 121, 0.1);--placeholder-on-secondary-color:#676879;--icon-on-secondary-color:#676879;--link-on-secondary-color:#1f76c2;--label-background-color:#cce5ff;--label-background-on-secondary-color:#cce5ff;--primary-background-color-rgb:255,255,255;--primary-background-hover-on-secondary-color:#dcdfec;--modal-background-color:#ffffff;--secondary-background-color-rgb:255,255,255;--disabled-background-on-secondary-color:#ecedf5;--disabled-text-on-secondary-color:rgba(50, 51, 56, var(--disabled-component-opacity));--ui-border-on-secondary-color:#c3c6d4;--layout-border-on-secondary-color:#d0d4e4;--dark-background-color:#f6f7fb;--dark-background-on-secondary-color:#f6f7fb;--dialog-background-color:#ffffff;--box-shadow-mediun:0px 6px 20px rgba(0, 0, 0, 0.2)}.dark-app-theme{--primary-color:#0073ea;--primary-hover-color:#0060b9;--primary-selected-color:#133774;--primary-selected-hover-color:#0d2e65;--primary-highlighted-color:#0d2753;--primary-surface-color:#181b34;--primary-text-color:#d5d8df;--secondary-text-color:#9699a6;--text-color-on-inverted:#323338;--text-color-on-primary:#ffffff;--disabled-text-color:rgba(213, 216, 223, var(--disabled-component-opacity));--inverted-color-background:#ffffff;--fixed-dark-color:#323338;--fixed-light-color:#ffffff;--primary-background-color:#181b34;--primary-background-hover-color:rgba(103, 104, 121, 0.3);--secondary-background-color:#30324e;--allgrey-background-color:#30324e;--backdrop-color:rgba(41, 47, 76, 0.7);--ui-border-color:#797e93;--ui-background-color:#434660;--ui-background-hover-color:#35384d;--layout-border-color:#4b4e69;--placeholder-color:#c3c6d4;--icon-color:#c3c6d4;--disabled-background-color:#3c3f59;--link-color:#69a7ef;--brand-color:#0073ea;--brand-hover-color:#0060b9;--brand-selected-color:#133774;--brand-selected-hover-color:#0d2e65;--positive-color:#00854d;--positive-color-hover:#007038;--positive-color-selected:#025231;--positive-color-selected-hover:#194733;--negative-color:#d83a52;--negative-color-hover:#b63546;--negative-color-selected:#642830;--negative-color-selected-hover:#5a2027;--warning-color:#ffcb00;--warning-color-hover:#eaaa15;--warning-color-selected:#503e02;--warning-color-selected-hover:#402f00;--grey-background-color:#181b34;--text-color-on-brand:#ffffff;--color-surface:#292f4c;--box-shadow-xs:0px 4px 6px -4px rgba(9, 11, 25, 0.5);--box-shadow-small:0px 4px 8px rgba(9, 11, 25, 0.5);--box-shadow-medium:0px 6px 20px rgba(9, 11, 25, 0.5);--box-shadow-large:0px 15px 50px rgba(9, 11, 25, 0.5);--color-grass_green-hover:#116846;--color-grass_green-selected:#0f4f43;--color-done-green-hover:#0f9b63;--color-done-green-selected:#0e7358;--color-done-green-selected-with-opacity:rgba(14, 115, 88, 0.6);--color-bright-green-hover:#7ca32b;--color-bright-green-selected:#5c7930;--color-saladish-hover:#9d8f3e;--color-saladish-selected:#736a3e;--color-egg_yolk-hover:#c29e11;--color-egg_yolk-selected:#8d751e;--color-egg_yolk-rgb:255,213,51;--color-working_orange-hover:#c0873c;--color-working_orange-selected:#8c653c;--color-dark-orange-hover:#c25531;--color-dark-orange-selected:#8d4134;--color-peach-hover:#c2888a;--color-peach-selected:#8d6674;--color-sunset-hover:#c26163;--color-sunset-selected:#8d4a58;--color-sunset-selected-with-opacity:rgba(141, 74, 88, 0.6);--color-stuck-red-hover:#ad3f51;--color-stuck-red-selected:#7f314b;--color-dark-red-hover:#92334c;--color-dark-red-selected:#6b2947;--color-sofia_pink-hover:#c21e71;--color-sofia_pink-selected:#8d1a62;--color-lipstick-hover:#c24e9a;--color-lipstick-selected:#8d3c7f;--color-bubble-hover:#be80ba;--color-bubble-selected:#8b6096;--color-purple-hover:#8050ab;--color-purple-selected:#5f3e8b;--color-dark_purple-hover:#6344a3;--color-dark_purple-selected:#4a3586;--color-berry-hover:#673971;--color-berry-selected:#4d2d62;--color-dark_indigo:#6129ff;--color-dark_indigo-hover:#4c18dc;--color-dark_indigo-selected:#3c13ae;--color-indigo-hover:#4b4ead;--color-indigo-selected:#383c8d;--color-navy:#5684c5;--color-navy-hover:#3468b2;--color-navy-selected:#24508f;--color-bright-blue-hover:#4c7cc1;--color-bright-blue-selected:#395d9b;--color-dark-blue-hover:#0f6d97;--color-dark-blue-selected:#0e527e;--color-aquamarine-hover:#469e9b;--color-aquamarine-selected:#357580;--color-chili-blue-hover:#569ec3;--color-chili-blue-selected:#41759d;--color-river-hover:#588095;--color-river-selected:#42607c;--color-winter-hover:#7b8895;--color-winter-selected:#5b667c;--color-explosive-hover:#98999a;--color-explosive-selected:#70717f;--color-american_gray-hover:#69696a;--color-american_gray-selected:#4e505e;--color-blackish:#7a7a7a;--color-blackish-hover:#525252;--color-blackish-selected:#383838;--color-brown-hover:#684943;--color-brown-selected:#4d3941;--color-orchid-hover:#b4739a;--color-orchid-selected:#85597b;--color-tan-hover:#978977;--color-tan-selected:#716863;--color-sky-hover:#90bac6;--color-sky-selected:#6c8a9a;--color-coffee-hover:#a27b6f;--color-coffee-selected:#795e5d;--color-royal-hover:#4474bb;--color-royal-selected:#375993;--color-teal:#4a8f98;--color-teal-hover:#347179;--color-teal-selected:#245960;--color-lavender-hover:#a294c8;--color-lavender-selected:#79709c;--color-steel-hover:#95a2be;--color-steel-selected:#707a95;--color-lilac-hover:#8e8a9f;--color-lilac-selected:#6b697f;--color-pecan:#806363;--color-pecan-hover:#674c4c;--color-pecan-selected:#513939;--primary-on-secondary-color:#0073ea;--primary-hover-on-secondary-color:#0060b9;--primary-selected-color-rgb:19,55,116;--primary-selected-on-secondary-color:#133774;--primary-text-on-secondary-color:#d5d8df;--primary-background-color-rgb:24,27,52;--primary-background-hover-on-secondary-color:#4b4e69;--secondary-background-color-rgb:48,50,78;--secondary-text-on-secondary-color:#9699a6;--link-on-secondary-color:#69a7ef;--modal-background-color:#181b34;--dark-background-color:#393b53;--dark-background-on-secondary-color:#4b4e69;--dialog-background-color:#30324e;--label-background-color:#404b69;--label-background-on-secondary-color:#404b69;--icon-on-secondary-color:#c3c6d4;--placeholder-color-with-opacity:rgba(195, 198, 212, 0.1);--placeholder-on-secondary-color:#c3c6d4;--ui-border-on-secondary-color:#797e93;--layout-border-on-secondary-color:#4b4e69;--disabled-background-on-secondary-color:#3c3f59;--disabled-text-on-secondary-color:rgba(213, 216, 223, var(--disabled-component-opacity));--box-shadow-mediun:0px 6px 20px rgba(0, 0, 0, 0.2)}.black-app-theme{--primary-color:#0073ea;--primary-hover-color:#0060b9;--primary-selected-color:#133774;--primary-selected-hover-color:#0d2e65;--primary-highlighted-color:#0b2858;--primary-surface-color:#111111;--primary-text-color:#eeeeee;--secondary-text-color:#aaaaaa;--text-color-on-inverted:#111111;--text-color-on-primary:#ffffff;--disabled-text-color:rgba(238, 238, 238, var(--disabled-component-opacity));--inverted-color-background:#eeeeee;--fixed-dark-color:#111111;--fixed-light-color:#ffffff;--primary-background-color:#111111;--primary-background-hover-color:rgba(103, 104, 121, 0.3);--secondary-background-color:#2c2c2c;--allgrey-background-color:#2c2c2c;--backdrop-color:rgba(33, 33, 33, 0.7);--ui-border-color:#8d8d8d;--ui-background-color:#4d4d4d;--ui-background-hover-color:#3b3b3b;--layout-border-color:#636363;--placeholder-color:#aaaaaa;--icon-color:#aaaaaa;--disabled-background-color:#3a3a3a;--link-color:#69a7ef;--brand-color:#0073ea;--brand-hover-color:#0060b9;--brand-selected-color:#133774;--brand-selected-hover-color:#0d2e65;--positive-color:#00854d;--positive-color-hover:#007038;--positive-color-selected:#025231;--positive-color-selected-hover:#194733;--negative-color:#d83a52;--negative-color-hover:#b63546;--negative-color-selected:#642830;--negative-color-selected-hover:#5a2027;--warning-color:#ffcb00;--warning-color-hover:#eaaa15;--warning-color-selected:#503e02;--warning-color-selected-hover:#402f00;--text-color-on-brand:#ffffff;--color-surface:#212121;--grey-background-color:#111111;--box-shadow-xs:0px 4px 6px -4px #000000;--box-shadow-small:0px 4px 8px #000000;--box-shadow-medium:0px 6px 20px #000000;--box-shadow-large:0px 15px 50px #000000;--color-grass_green-hover:#116846;--color-grass_green-selected:#0a482e;--color-done-green-hover:#0f9b63;--color-done-green-selected:#096c43;--color-done-green-selected-with-opacity:rgba(9, 108, 67, 0.6);--color-bright-green-hover:#7ca32b;--color-bright-green-selected:#56721b;--color-saladish-hover:#9d8f3e;--color-saladish-selected:#6d6329;--color-egg_yolk-hover:#c29e11;--color-egg_yolk-selected:#886e09;--color-egg_yolk-rgb:255,213,51;--color-working_orange-hover:#c0873c;--color-working_orange-selected:#875e27;--color-dark-orange-hover:#c25531;--color-dark-orange-selected:#883a1f;--color-peach-hover:#c2888a;--color-peach-selected:#885f5f;--color-sunset-hover:#c26163;--color-sunset-selected:#884343;--color-sunset-selected-with-opacity:rgba(136, 67, 67, 0.6);--color-stuck-red-hover:#ad3f51;--color-stuck-red-selected:#792a36;--color-dark-red-hover:#92334c;--color-dark-red-selected:#662232;--color-sofia_pink-hover:#c21e71;--color-sofia_pink-selected:#88134d;--color-lipstick-hover:#c24e9a;--color-lipstick-selected:#88356a;--color-bubble-hover:#be80ba;--color-bubble-selected:#855981;--color-purple-hover:#8050ab;--color-purple-selected:#593776;--color-dark_purple-hover:#6344a3;--color-dark_purple-selected:#442e71;--color-berry-hover:#673971;--color-berry-selected:#47264d;--color-dark_indigo:#6129ff;--color-dark_indigo-hover:#4c18dc;--color-dark_indigo-selected:#3c13ae;--color-indigo-hover:#4b4ead;--color-indigo-selected:#333578;--color-navy:#5684c5;--color-navy-hover:#3468b2;--color-navy-selected:#24508f;--color-bright-blue-hover:#4c7cc1;--color-bright-blue-selected:#345686;--color-dark-blue-hover:#0f6d97;--color-dark-blue-selected:#094b69;--color-aquamarine-hover:#469e9b;--color-aquamarine-selected:#2f6e6b;--color-chili-blue-hover:#569ec3;--color-chili-blue-selected:#3b6e88;--color-river-hover:#588095;--color-river-selected:#3c5967;--color-winter-hover:#7b8895;--color-winter-selected:#555f67;--color-explosive-hover:#98999a;--color-explosive-selected:#6a6a6a;--color-american_gray-hover:#69696a;--color-american_gray-selected:#494949;--color-blackish:#7a7a7a;--color-blackish-hover:#525252;--color-blackish-selected:#383838;--color-brown-hover:#684943;--color-brown-selected:#48322c;--color-orchid-hover:#b4739a;--color-orchid-selected:#7e516c;--color-tan-hover:#978977;--color-tan-selected:#6a6053;--color-sky-hover:#90bac6;--color-sky-selected:#65828b;--color-coffee-hover:#a27b6f;--color-coffee-selected:#71564e;--color-royal-hover:#4474bb;--color-royal-selected:#305183;--color-teal:#4a8f98;--color-teal-hover:#347179;--color-teal-selected:#245960;--color-lavender-hover:#a294c8;--color-lavender-selected:#71688c;--color-steel-hover:#95a2be;--color-steel-selected:#687185;--color-lilac-hover:#8e8a9f;--color-lilac-selected:#63616f;--color-pecan:#806363;--color-pecan-hover:#674c4c;--color-pecan-selected:#513939;--primary-on-secondary-color:#0073ea;--primary-hover-on-secondary-color:#0060b9;--primary-selected-color-rgb:19,55,116;--primary-selected-on-secondary-color:#133774;--primary-text-on-secondary-color:#eeeeee;--primary-background-color-rgb:17,17,17;--primary-background-hover-on-secondary-color:#636363;--secondary-background-color-rgb:44,44,44;--secondary-text-on-secondary-color:#9699a6;--link-on-secondary-color:#69a7ef;--modal-background-color:#181b34;--dark-background-color:#2c2c2c;--dark-background-on-secondary-color:#4b4e69;--dialog-background-color:#2c2c2c;--label-background-color:#404b69;--label-background-on-secondary-color:#404b69;--icon-on-secondary-color:#aaaaaa;--placeholder-color-with-opacity:rgba(170, 170, 170, 0.1);--placeholder-on-secondary-color:#aaaaaa;--ui-border-on-secondary-color:#8d8d8d;--layout-border-on-secondary-color:#636363;--disabled-background-on-secondary-color:#3a3a3a;--disabled-text-on-secondary-color:rgba(238, 238, 238, var(--disabled-component-opacity));--box-shadow-mediun:0px 6px 20px rgba(0, 0, 0, 0.2)}.hacker_theme-app-theme{--primary-color:#fe78c6;--primary-hover-color:#fe5ab9;--primary-selected-color:#9f4077;--primary-selected-hover-color:#0d2e65;--primary-highlighted-color:#0b2858;--primary-surface-color:#111111;--primary-text-color:#d5d8df;--secondary-text-color:#9699a6;--text-color-on-inverted:#323338;--disabled-text-color:rgba(238, 238, 238, var(--disabled-component-opacity));--inverted-color-background:#ffffff;--fixed-dark-color:#323338;--fixed-light-color:#ffffff;--primary-background-color:#282a36;--primary-background-hover-color:#4b4e69;--secondary-background-color:#30324e;--allgrey-background-color:#282a36;--ui-border-color:#797e93;--ui-background-color:#4b4e69;--ui-background-hover-color:#3b3b3b;--layout-border-color:#414458;--placeholder-color:#c3c6d4;--icon-color:#c3c6d4;--disabled-background-color:#3a3a3a;--link-color:#bd93f9;--brand-color:#fe78c6;--brand-hover-color:#fe5ab9;--brand-selected-color:#9f4077;--brand-selected-hover-color:#0d2e65;--positive-color:#50fa7b;--positive-color-hover:#007038;--positive-color-selected:#26503e;--positive-color-selected-hover:#194733;--negative-color:#ff5555;--negative-color-hover:#b63546;--negative-color-selected:#642830;--negative-color-selected-hover:#5a2027;--warning-color:#ffcb00;--warning-color-hover:#eaaa15;--warning-color-selected:#503e02;--warning-color-selected-hover:#402f00;--grey-background-color:#282a36;--box-shadow-xs:0px 4px 6px -4px #000000;--box-shadow-small:0px 4px 8px #000000;--box-shadow-medium:0px 6px 20px #000000;--box-shadow-large:0px 15px 50px #000000;--color-grass_green:#359970;--color-grass_green-hover:#116846;--color-grass_green-selected:#0a482e;--color-done-green:#33d391;--color-done-green-hover:#0f9b63;--color-done-green-selected:#096c43;--color-done-green-selected-with-opacity:rgba(9, 108, 67, 0.6);--color-bright-green:#b0dc51;--color-bright-green-hover:#7ca32b;--color-bright-green-selected:#56721b;--color-saladish:#d5c567;--color-saladish-hover:#9d8f3e;--color-saladish-selected:#6d6329;--color-egg_yolk:#ffd533;--color-egg_yolk-hover:#c29e11;--color-egg_yolk-selected:#886e09;--color-egg_yolk-rgb:255,213,51;--color-working_orange:#fdbc64;--color-working_orange-hover:#c0873c;--color-working_orange-selected:#875e27;--color-dark-orange:#ff6d3b;--color-dark-orange-hover:#c25531;--color-dark-orange-selected:#883a1f;--color-peach:#ffbdbd;--color-peach-hover:#c2888a;--color-peach-selected:#885f5f;--color-sunset:#ff9191;--color-sunset-hover:#c26163;--color-sunset-selected:#884343;--color-sunset-selected-with-opacity:rgba(136, 67, 67, 0.6);--color-stuck-red:#e8697d;--color-stuck-red-hover:#ad3f51;--color-stuck-red-selected:#792a36;--color-dark-red:#c95c76;--color-dark-red-hover:#92334c;--color-dark-red-selected:#662232;--color-sofia_pink:#ff44a1;--color-sofia_pink-hover:#c21e71;--color-sofia_pink-selected:#88134d;--color-lipstick:#ff7bd0;--color-lipstick-hover:#c24e9a;--color-lipstick-selected:#88356a;--color-bubble:#fbb4f4;--color-bubble-hover:#be80ba;--color-bubble-selected:#855981;--color-purple:#b57de3;--color-purple-hover:#8050ab;--color-purple-selected:#593776;--color-dark_purple:#936fda;--color-dark_purple-hover:#6344a3;--color-dark_purple-selected:#442e71;--color-berry:#9862a1;--color-berry-hover:#673971;--color-berry-selected:#47264d;--color-dark_indigo:#6645a9;--color-dark_indigo-hover:#3c1f78;--color-dark_indigo-selected:#291452;--color-indigo:#777ae5;--color-indigo-hover:#4b4ead;--color-indigo-selected:#333578;--color-navy:#4e73a7;--color-navy-hover:#274776;--color-navy-selected:#193151;--color-bright-blue:#79affd;--color-bright-blue-hover:#4c7cc1;--color-bright-blue-selected:#345686;--color-dark-blue:#339ecd;--color-dark-blue-hover:#0f6d97;--color-dark-blue-selected:#094b69;--color-aquamarine:#71d6d1;--color-aquamarine-hover:#469e9b;--color-aquamarine-selected:#2f6e6b;--color-chili-blue:#85d6ff;--color-chili-blue-hover:#569ec3;--color-chili-blue-selected:#3b6e88;--color-river:#86b4ca;--color-river-hover:#588095;--color-river-selected:#3c5967;--color-winter:#aebdca;--color-winter-hover:#7b8895;--color-winter-selected:#555f67;--color-explosive:#d0d0d0;--color-explosive-hover:#98999a;--color-explosive-selected:#6a6a6a;--color-american_gray:#999999;--color-american_gray-hover:#69696a;--color-american_gray-selected:#494949;--color-blackish:#5c5c5c;--color-blackish-hover:#222222;--color-blackish-selected:#111111;--color-brown:#99756c;--color-brown-hover:#684943;--color-brown-selected:#48322c;--color-orchid:#e190c0;--color-orchid-hover:#b4739a;--color-orchid-selected:#7e516c;--color-tan:#bdab95;--color-tan-hover:#978977;--color-tan-selected:#6a6053;--color-sky:#b4e9f8;--color-sky-hover:#90bac6;--color-sky-selected:#65828b;--color-coffee:#ca9a8b;--color-coffee-hover:#a27b6f;--color-coffee-selected:#71564e;--color-royal:#5591ea;--color-royal-hover:#4474bb;--color-royal-selected:#305183;--color-teal:#457b82;--color-teal-hover:#376268;--color-teal-selected:#274549;--color-lavender:#cab9fa;--color-lavender-hover:#a294c8;--color-lavender-selected:#71688c;--color-steel:#bacbed;--color-steel-hover:#95a2be;--color-steel-selected:#687185;--color-lilac:#687185;--color-lilac-hover:#8e8a9f;--color-lilac-selected:#63616f;--color-pecan:#786565;--color-pecan-hover:#605151;--color-pecan-selected:#433939;--color-success:#50fa7b;--color-error:#ff5555;--primary-on-secondary-color:#fe78c6;--primary-hover-on-secondary-color:#fe5ab9;--primary-selected-color-rgb:159,64,119;--primary-selected-on-secondary-color:#9f4077;--primary-text-on-secondary-color:#d5d8df;--primary-background-color-rgb:40,42,54;--primary-background-hover-on-secondary-color:#4b4e69;--secondary-background-color-rgb:48,50,78;--secondary-text-on-secondary-color:#9699a6;--link-on-secondary-color:#bd93f9;--modal-background-color:#282a36;--dark-background-color:#303241;--dark-background-on-secondary-color:#595959;--dialog-background-color:#30324e;--label-background-color:#404b69;--label-background-on-secondary-color:#404b69;--icon-on-secondary-color:#c3c6d4;--placeholder-color-with-opacity:rgba(195, 198, 212, 0.1);--placeholder-on-secondary-color:#c3c6d4;--ui-border-on-secondary-color:#797e93;--layout-border-on-secondary-color:#414458;--disabled-background-on-secondary-color:#3a3a3a;--disabled-text-on-secondary-color:rgba(238, 238, 238, var(--disabled-component-opacity));--box-shadow-mediun:0px 6px 20px rgba(0, 0, 0, 0.2)}

package/dist/tokens/tokens.d.ts

@@ -0,0 +1 @@
+declare module "@vibe/core/tokens";

package/dist/types/ArrayLastElement.d.ts

@@ -0,0 +1 @@
+export type ArrayLastElement<T extends unknown[]> = T extends [...unknown[], infer R] ? R : never;

package/dist/types/Colors.d.ts

@@ -0,0 +1,22 @@
+import { contentColors } from "../utils/colors-vars-map";
+declare const MapStateSelectedColor: {
+    positive: string;
+    negative: string;
+    primary: string;
+    warning: string;
+    neutral: string;
+};
+declare const MapStateSelectedHoverColor: {
+    positive: string;
+    negative: string;
+    primary: string;
+    warning: string;
+    neutral: string;
+};
+type ContentColor = (typeof contentColors)[number];
+type StateSelectedColorKeys = keyof typeof MapStateSelectedColor;
+type StateSelectedHoverColorKeys = keyof typeof MapStateSelectedHoverColor;
+export type ElementAllowedColor = ContentColor | "positive" | "negative" | "primary" | "warning" | "neutral";
+export declare function getElementColor(colorValue: ContentColor | StateSelectedColorKeys | StateSelectedHoverColorKeys, isSelectedPalette?: boolean, isSelectedHoverPalette?: boolean): string;
+export type ColorStyle = "regular" | "hover" | "selected";
+export {};

package/dist/types/ElementContent.d.ts

@@ -0,0 +1,2 @@
+import { type ReactNode } from "react";
+export type ElementContent = ReactNode | ReactNode[];

package/dist/types/FormElement.d.ts

@@ -0,0 +1,40 @@
+/**
+ * Props for form fields, including label, info text, and ID requirements for accessibility.
+ * Using this type for a component's props will enforce that if a `label` or `infoText` is provided, an `id` must also be provided.
+ * This is important for accessibility, to link the input with its label and description.
+ * If there's a need, you can extend this type to add more shapes or conditions inside your form component types file.
+ */
+export type FormElementProps = {
+    /**
+     * The label for the input.
+     */
+    label: string;
+    /**
+     * The id of the input.
+     * Required when `label` or `infoText` is provided for accessibility reasons.
+     */
+    id: string;
+    /**
+     * Informational text to display below the input.
+     */
+    infoText?: string;
+} | {
+    label?: never;
+    /**
+     * Informational text to display below the input.
+     * If provided, an `id` is also required for accessibility.
+     */
+    infoText: string;
+    /**
+     * The id of the input.
+     * Required when `infoText` or `label` is provided for accessibility reasons.
+     */
+    id: string;
+} | {
+    label?: never;
+    infoText?: never;
+    /**
+     * The id of the input.
+     */
+    id?: string;
+};

package/dist/types/MoveBy.d.ts

@@ -0,0 +1,4 @@
+export type MoveBy = {
+    main?: number;
+    secondary?: number;
+};

package/dist/types/SplitString.d.ts

@@ -0,0 +1 @@
+export type SplitString<S extends string, D extends string> = string extends S ? string[] : S extends "" ? [] : S extends `${infer T}${D}${infer U}` ? [T, ...SplitString<U, D>] : [S];

package/dist/types/VibeComponent.d.ts

@@ -0,0 +1,3 @@
+import type React from "react";
+type VibeComponent<T, P = HTMLElement> = React.ForwardRefExoticComponent<T & React.RefAttributes<P>>;
+export default VibeComponent;

package/dist/types/VibeComponentProps.d.ts

@@ -0,0 +1,14 @@
+export default interface VibeComponentProps {
+    /**
+     * A CSS class name to apply to the component.
+     */
+    className?: string;
+    /**
+     * A unique identifier for testing purposes.
+     */
+    "data-testid"?: string;
+    /**
+     * An HTML id attribute for the component.
+     */
+    id?: string;
+}

package/dist/types/events.d.ts

@@ -0,0 +1,6 @@
+import type React from "react";
+export type OnPressEventType<Element> = React.MouseEvent<Element> | React.FocusEvent<Element>;
+export type GeneralEventType = Event | React.UIEvent;
+export type GenericEventCallback = (ev: GeneralEventType) => unknown;
+export type KeyboardEventCallback = (event: KeyboardEvent) => unknown;
+export type MouseEventCallBack = (event: React.MouseEvent<HTMLElement | SVGElement>) => void;

package/dist/types/index.d.ts

@@ -0,0 +1,8 @@
+export * from "./events";
+export type { default as VibeComponent } from "./VibeComponent";
+export type { default as VibeComponentProps } from "./VibeComponentProps";
+export * from "./withStaticProps";
+export * from "./ArrayLastElement";
+export * from "./SplitString";
+export * from "./ElementContent";
+export * from "./Colors";

package/dist/types/withStaticProps.d.ts

@@ -0,0 +1,7 @@
+import { type FC, type ForwardRefExoticComponent, type RefAttributes } from "react";
+type Required<T> = {
+    [P in keyof T]-?: T[P];
+};
+export declare const withStaticProps: <Props, StaticProps, Ref = HTMLElement>(component: ForwardRefExoticComponent<Props & RefAttributes<Ref>>, staticProps: Required<StaticProps>) => ForwardRefExoticComponent<Props & RefAttributes<Ref>> & Required<StaticProps>;
+export declare const withStaticPropsWithoutForwardRef: <Props, StaticProps>(component: FC<Props>, staticProps: Required<StaticProps>) => FC<Props> & Required<StaticProps>;
+export {};

package/dist/utils/colors-utils.d.ts

@@ -0,0 +1,8 @@
+import { ColorStyle as ColorStyleEnum } from "./colors-vars-map";
+import { type ColorStyle } from "../types/Colors";
+declare const _default: Readonly<{
+    modes: typeof ColorStyleEnum;
+    contentColors: readonly ["grass_green", "done-green", "bright-green", "saladish", "egg_yolk", "working_orange", "dark-orange", "peach", "sunset", "stuck-red", "dark-red", "sofia_pink", "lipstick", "bubble", "purple", "dark_purple", "berry", "dark_indigo", "indigo", "navy", "bright-blue", "dark-blue", "aquamarine", "chili-blue", "river", "winter", "explosive", "american_gray", "blackish", "brown", "orchid", "tan", "sky", "coffee", "royal", "teal", "lavender", "steel", "lilac", "pecan"];
+    getMondayColorAsStyle: (color: string, mode?: ColorStyle, withVar?: boolean) => string;
+}>;
+export default _default;

package/dist/utils/colors-vars-map.d.ts

@@ -0,0 +1,132 @@
+export declare const colorsMap: {
+    color: string;
+    description: string;
+}[];
+export declare const colorsHashMap: Map<any, any>;
+export declare const contentColors: readonly ["grass_green", "done-green", "bright-green", "saladish", "egg_yolk", "working_orange", "dark-orange", "peach", "sunset", "stuck-red", "dark-red", "sofia_pink", "lipstick", "bubble", "purple", "dark_purple", "berry", "dark_indigo", "indigo", "navy", "bright-blue", "dark-blue", "aquamarine", "chili-blue", "river", "winter", "explosive", "american_gray", "blackish", "brown", "orchid", "tan", "sky", "coffee", "royal", "teal", "lavender", "steel", "lilac", "pecan"];
+export type CONTENT_COLORS_VALUES = (typeof contentColors)[number];
+/**
+ * @deprecated
+ */
+export declare enum ColorStyle {
+    REGULAR = "regular",
+    HOVER = "hover",
+    SELECTED = "selected"
+}
+export declare enum ContentColorByName {
+    GRASS_GREEN = "grass_green",
+    DONE_GREEN = "done-green",
+    BRIGHT_GREEN = "bright-green",
+    SALADISH = "saladish",
+    EGG_YOLK = "egg_yolk",
+    WORKING_ORANGE = "working_orange",
+    DARK_ORANGE = "dark-orange",
+    PEACH = "peach",
+    SUNSET = "sunset",
+    STUCK_RED = "stuck-red",
+    DARK_RED = "dark-red",
+    SOFIA_PINK = "sofia_pink",
+    LIPSTICK = "lipstick",
+    BUBBLE = "bubble",
+    PURPLE = "purple",
+    DARK_PURPLE = "dark_purple",
+    BERRY = "berry",
+    DARK_INDIGO = "dark_indigo",
+    INDIGO = "indigo",
+    NAVY = "navy",
+    BRIGHT_BLUE = "bright-blue",
+    DARK_BLUE = "dark-blue",
+    AQUAMARINE = "aquamarine",
+    CHILI_BLUE = "chili-blue",
+    RIVER = "river",
+    WINTER = "winter",
+    EXPLOSIVE = "explosive",
+    AMERICAN_GRAY = "american_gray",
+    BLACKISH = "blackish",
+    BROWN = "brown",
+    ORCHID = "orchid",
+    TAN = "tan",
+    SKY = "sky",
+    COFFEE = "coffee",
+    ROYAL = "royal",
+    TEAL = "teal",
+    LAVENDER = "lavender",
+    STEEL = "steel",
+    LILAC = "lilac",
+    PECAN = "pecan"
+}
+/**
+ * @deprecated
+ */
+export declare enum StateSelectedColor {
+    POSITIVE = "positive",
+    NEGATIVE = "negative",
+    PRIMARY = "primary",
+    WARNING = "warning",
+    NEUTRAL = "neutral"
+}
+/**
+ * @deprecated
+ */
+export declare enum StateSelectedHoverColor {
+    POSITIVE = "positive",
+    NEGATIVE = "negative",
+    PRIMARY = "primary",
+    NEUTRAL = "neutral"
+}
+/**
+ * @deprecated
+ */
+export declare const ElementAllowedColor: {
+    POSITIVE: StateSelectedHoverColor.POSITIVE;
+    NEGATIVE: StateSelectedHoverColor.NEGATIVE;
+    PRIMARY: StateSelectedHoverColor.PRIMARY;
+    NEUTRAL: StateSelectedHoverColor.NEUTRAL;
+    WARNING: StateSelectedColor.WARNING;
+    GRASS_GREEN: ContentColorByName.GRASS_GREEN;
+    DONE_GREEN: ContentColorByName.DONE_GREEN;
+    BRIGHT_GREEN: ContentColorByName.BRIGHT_GREEN;
+    SALADISH: ContentColorByName.SALADISH;
+    EGG_YOLK: ContentColorByName.EGG_YOLK;
+    WORKING_ORANGE: ContentColorByName.WORKING_ORANGE;
+    DARK_ORANGE: ContentColorByName.DARK_ORANGE;
+    PEACH: ContentColorByName.PEACH;
+    SUNSET: ContentColorByName.SUNSET;
+    STUCK_RED: ContentColorByName.STUCK_RED;
+    DARK_RED: ContentColorByName.DARK_RED;
+    SOFIA_PINK: ContentColorByName.SOFIA_PINK;
+    LIPSTICK: ContentColorByName.LIPSTICK;
+    BUBBLE: ContentColorByName.BUBBLE;
+    PURPLE: ContentColorByName.PURPLE;
+    DARK_PURPLE: ContentColorByName.DARK_PURPLE;
+    BERRY: ContentColorByName.BERRY;
+    DARK_INDIGO: ContentColorByName.DARK_INDIGO;
+    INDIGO: ContentColorByName.INDIGO;
+    NAVY: ContentColorByName.NAVY;
+    BRIGHT_BLUE: ContentColorByName.BRIGHT_BLUE;
+    DARK_BLUE: ContentColorByName.DARK_BLUE;
+    AQUAMARINE: ContentColorByName.AQUAMARINE;
+    CHILI_BLUE: ContentColorByName.CHILI_BLUE;
+    RIVER: ContentColorByName.RIVER;
+    WINTER: ContentColorByName.WINTER;
+    EXPLOSIVE: ContentColorByName.EXPLOSIVE;
+    AMERICAN_GRAY: ContentColorByName.AMERICAN_GRAY;
+    BLACKISH: ContentColorByName.BLACKISH;
+    BROWN: ContentColorByName.BROWN;
+    ORCHID: ContentColorByName.ORCHID;
+    TAN: ContentColorByName.TAN;
+    SKY: ContentColorByName.SKY;
+    COFFEE: ContentColorByName.COFFEE;
+    ROYAL: ContentColorByName.ROYAL;
+    TEAL: ContentColorByName.TEAL;
+    LAVENDER: ContentColorByName.LAVENDER;
+    STEEL: ContentColorByName.STEEL;
+    LILAC: ContentColorByName.LILAC;
+    PECAN: ContentColorByName.PECAN;
+};
+/**
+ * @deprecated
+ */
+export type ElementColor = (typeof ElementAllowedColor)[keyof typeof ElementAllowedColor] | string;
+export declare const elementColorsNames: Record<string, string>;
+export declare function getElementColor(colorValue: keyof typeof ElementAllowedColor | string, isSelectedPalette?: boolean, isSelectedHoverPalette?: boolean): string;

package/dist/utils/dom-event-utils.d.ts

@@ -0,0 +1,16 @@
+import type React from "react";
+export declare function isEnterEvent(event: React.KeyboardEvent): boolean;
+export declare function isShiftEnterEvent(event: React.KeyboardEvent): boolean;
+export declare function isEscapeEvent(event: React.KeyboardEvent): boolean;
+export declare function isArrowUpEvent(event: React.KeyboardEvent): boolean;
+export declare function isArrowDownEvent(event: React.KeyboardEvent): boolean;
+export declare function isArrowRightEvent(event: React.KeyboardEvent): boolean;
+export declare function isArrowLeftEvent(event: React.KeyboardEvent): boolean;
+export declare function isBackspaceEvent(event: React.KeyboardEvent): boolean;
+export declare function isSpaceEvent(event: React.KeyboardEvent): boolean;
+export declare function isTabEvent(event: React.KeyboardEvent): boolean;
+export declare function isPageUpEvent(event: React.KeyboardEvent): boolean;
+export declare function isPageDownEvent(event: React.KeyboardEvent): boolean;
+export declare function isEndEvent(event: React.KeyboardEvent): boolean;
+export declare function isHomeEvent(event: React.KeyboardEvent): boolean;
+export declare function isShiftTabEvent(event: React.KeyboardEvent): boolean;

package/dist/utils/dom-utils.d.ts

@@ -0,0 +1,2 @@
+export declare function isInsideClass(domElement: HTMLElement, classOrClassesName: Array<string> | string): boolean;
+export declare const getScrollableParent: (node: HTMLElement) => HTMLElement;

package/dist/utils/function-utils.d.ts

@@ -0,0 +1,5 @@
+import { type MutableRefObject } from "react";
+export declare function chainRefFunctions(funcsOrRefs: Array<MutableRefObject<HTMLElement> | ((element: HTMLElement) => void | boolean)>, allowBreak?: boolean): (args: HTMLElement) => void;
+export declare function chainFunctions(funcs: Array<(args: any) => void | boolean>, allowBreak?: boolean): (args: any) => void;
+export declare function convertToArray<T>(input: T | Array<T>): Array<T>;
+export declare function NOOP(): void;