@reltio/design 0.1.1 → 0.2.1

package/components/Popover/Popover.types.js

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

package/components/Popover/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Popover";
+export type * from "./Popover.types";

package/components/Popover/index.js

@@ -0,0 +1 @@
+export * from "./Popover";

package/components/Skeleton/Skeleton.d.ts

@@ -4,4 +4,4 @@ import type { SkeletonProps } from "./Skeleton.types";
  * (moving gradient) animation. Used as a loading placeholder to reserve space
  * and indicate that content is loading. Full width by default.
  */
-export declare const Skeleton: ({ rows, className, ...rest }: SkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Skeleton: ({ rows, size, className, style, ...rest }: SkeletonProps) => import("react/jsx-runtime").JSX.Element;

package/components/Skeleton/Skeleton.js

@@ -8,9 +8,10 @@ const DEFAULT_ROWS = 3;
  * (moving gradient) animation. Used as a loading placeholder to reserve space
  * and indicate that content is loading. Full width by default.
  */
-export const Skeleton = ({ rows = DEFAULT_ROWS, className, ...rest }) => {
+export const Skeleton = ({ rows = DEFAULT_ROWS, size, className, style, ...rest }) => {
     const rowCount = Math.max(1, Math.floor(Number(rows)) || DEFAULT_ROWS);
+    const rowStyle = size ? { height: size } : undefined;
     return (
     // biome-ignore lint/a11y/useSemanticElements: status role is correct for loading placeholder; output is for calculation results
-    _jsx("div", { className: classNames(styles.skeletonRoot, className), "aria-busy": "true", "aria-label": DEFAULT_LABEL, role: "status", ...rest, children: Array.from({ length: rowCount }, (_, i) => (_jsx("div", { className: styles.row, "aria-hidden": "true" }, i))) }));
+    _jsx("div", { className: classNames(styles.skeletonRoot, className), "aria-busy": "true", "aria-label": DEFAULT_LABEL, role: "status", style: style, ...rest, children: Array.from({ length: rowCount }, (_, i) => (_jsx("div", { className: classNames(styles.row), style: rowStyle, "aria-hidden": "true" }, i))) }));
 };

package/components/Skeleton/Skeleton.module.css.js

@@ -1,46 +1,44 @@
 import styleInject from 'style-inject';
 import json from './Skeleton.module.css.json';
 styleInject(`
-._skeletonRoot_1e8wa_1 {
-	--reltio-skeleton-row-height: 16px;
-	--reltio-skeleton-row-gap: 12px;
+.Skeleton_skeletonRoot__L29wd {
 	width: 100%;
 	display: flex;
 	flex-direction: column;
-	gap: var(--reltio-skeleton-row-gap, 12px);
+	gap: 12px;
 }
 
-._row_1e8wa_10 {
+.Skeleton_row__L29wd {
 	width: 100%;
-	height: var(--reltio-skeleton-row-height, 16px);
-	background-color: #f5f5fa;
+	height: 16px;
+	background-color: var(--reltio-color-surface-2);
 	overflow: hidden;
 	position: relative;
 }
 
-._row_1e8wa_10::before {
+.Skeleton_row__L29wd::before {
 	content: "";
 	position: absolute;
 	top: 0;
 	left: 0;
 	bottom: 0;
-	background-color: #9898b34d;
-	animation: _indeterminate1_1e8wa_1 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395)
+	background-color: var(--reltio-color-bg-transparent-1);
+	animation: Skeleton_indeterminate1__L29wd 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395)
 		infinite;
 }
 
-._row_1e8wa_10::after {
+.Skeleton_row__L29wd::after {
 	content: "";
 	position: absolute;
 	top: 0;
 	left: 0;
 	bottom: 0;
-	background-color: #9898b34d;
-	animation: _indeterminate2_1e8wa_1 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
+	background-color: var(--reltio-color-bg-transparent-1);
+	animation: Skeleton_indeterminate2__L29wd 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
 	animation-delay: 1.15s;
 }
 
-@keyframes _indeterminate1_1e8wa_1 {
+@keyframes Skeleton_indeterminate1__L29wd {
 	0% {
 		left: -35%;
 		right: 100%;
@@ -55,7 +53,7 @@ styleInject(`
 	}
 }
 
-@keyframes _indeterminate2_1e8wa_1 {
+@keyframes Skeleton_indeterminate2__L29wd {
 	0% {
 		left: -200%;
 		right: 100%;

package/components/Skeleton/Skeleton.module.css.json

@@ -1 +1 @@
-{ "skeletonRoot": "_skeletonRoot_1e8wa_1", "row": "_row_1e8wa_10", "indeterminate1": "_indeterminate1_1e8wa_1", "indeterminate2": "_indeterminate2_1e8wa_1" }
+{ "skeletonRoot": "Skeleton_skeletonRoot__L29wd", "row": "Skeleton_row__L29wd", "indeterminate1": "Skeleton_indeterminate1__L29wd", "indeterminate2": "Skeleton_indeterminate2__L29wd" }

package/components/Skeleton/Skeleton.types.d.ts

@@ -1,31 +1,13 @@
-import type React from "react";
+import type { HtmlProps } from "../../utils/types";
 /**
  * Props for the Skeleton component
  */
-export type SkeletonProps = {
+export type SkeletonProps = Omit<HtmlProps<"div", {
     /**
      * Number of rectangular placeholder bars to display
      * @default 3
      */
     rows?: number;
-    /**
-     * Size (number) passed to styles; affects line height and line gap of placeholder bars (e.g. pixels).
-     * @default 16
-     */
-    size?: number;
-    /**
-     * Accessible label for screen readers. When not provided, a default label is used.
-     */
-    label?: string;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-    /**
-     * Inline styles (e.g. for CSS variable overrides)
-     */
-    style?: React.CSSProperties & {
-        "--reltio-skeleton-row-height"?: string;
-        "--reltio-skeleton-row-gap"?: string;
-    };
-} & Omit<React.ComponentPropsWithoutRef<"div">, "children" | "className" | "style">;
+    /** Height of each row bar (e.g. "16px", "1rem", "2em"). Defaults to 16px. */
+    size?: string;
+}>, "children">;

package/components/TextArea/TextArea.d.ts

@@ -1,24 +1,3 @@
-export declare const TextArea: import("react").ForwardRefExoticComponent<{
-    label?: string;
-    error?: boolean;
-    supportingText?: string;
-    toolbar?: import("react").ReactNode;
-    style?: import("react").CSSProperties & {
-        "--reltio-textarea-font-family": string;
-        "--reltio-textarea-font-size": string;
-        "--reltio-textarea-line-height": string;
-        "--reltio-textarea-color-text": string;
-        "--reltio-textarea-color-border": string;
-        "--reltio-textarea-color-border-focus": string;
-        "--reltio-textarea-color-background": string;
-        "--reltio-textarea-color-error": string;
-        "--reltio-textarea-color-label": string;
-        "--reltio-textarea-color-supporting-text": string;
-        "--reltio-textarea-border-radius": string;
-        "--reltio-textarea-padding": string;
-        "--reltio-textarea-min-height": string;
-        "--reltio-textarea-max-height": string;
-        "--reltio-textarea-border-width": string;
-        "--reltio-textarea-border-width-focus": string;
-    };
-} & Omit<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, "style"> & import("react").RefAttributes<HTMLTextAreaElement>>;
+import type React from "react";
+import type { TextAreaProps } from "./TextArea.types";
+export declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;

package/components/TextArea/TextArea.module.css.js

@@ -1,58 +1,17 @@
 import styleInject from 'style-inject';
 import json from './TextArea.module.css.json';
 styleInject(`
-._root_pmwmi_1 {
-	--reltio-textarea-font-family: var(
-		--reltio-font-family-body,
-		"Roboto",
-		sans-serif
-	);
-	--reltio-textarea-font-size: var(--reltio-font-size-body, 16px);
-	--reltio-textarea-line-height: var(--reltio-line-height-body, 1.5);
-	--reltio-textarea-color-text: var(--reltio-color-text, #1d1b20);
-	--reltio-textarea-color-border: var(--reltio-color-border, #79747e);
-	--reltio-textarea-color-border-focus: var(--reltio-color-primary, #6750a4);
-	--reltio-textarea-color-background: var(--reltio-color-background, #fff);
-	--reltio-textarea-color-error: var(--reltio-color-error, #b3261e);
-	--reltio-textarea-color-label: var(--reltio-color-text-secondary, #49454f);
-	--reltio-textarea-color-supporting-text: var(
-		--reltio-color-text-secondary,
-		#49454f
-	);
-	--reltio-textarea-border-radius: var(--reltio-spacing-xs, 4px);
-	--reltio-textarea-padding: var(--reltio-spacing-md, 16px);
-	--reltio-textarea-min-height: var(--reltio-spacing-3xl, 56px);
-	--reltio-textarea-max-height: min(500px, 50cqh);
-	--reltio-textarea-border-width: 1px;
-	--reltio-textarea-border-width-focus: 2px;
-
-	font-family: var(--reltio-textarea-font-family);
+.TextArea_root__L29wd {
+	font-family: "Roboto", sans-serif;
 	container-type: inline-size;
 }
 
-._root_pmwmi_1:focus-within {
-	--reltio-textarea-color-border: var(--reltio-textarea-color-border-focus);
-	--reltio-textarea-border-width: var(--reltio-textarea-border-width-focus);
-	--reltio-textarea-color-label: var(--reltio-textarea-color-border-focus);
-}
-
-._root_pmwmi_1[data-error="true"] {
-	--reltio-textarea-color-border: var(--reltio-textarea-color-error);
-	--reltio-textarea-color-label: var(--reltio-textarea-color-error);
-	--reltio-textarea-color-supporting-text: var(--reltio-textarea-color-error);
-}
-
-._root_pmwmi_1[data-error="true"]:focus-within {
-	--reltio-textarea-color-border: var(--reltio-textarea-color-error);
-	--reltio-textarea-color-label: var(--reltio-textarea-color-error);
-}
-
-._root_pmwmi_1[data-disabled="true"] {
+.TextArea_root__L29wd[data-disabled="true"] {
 	opacity: 0.38;
 	cursor: not-allowed;
 }
 
-._inputContainer_pmwmi_52 {
+.TextArea_inputContainer__L29wd {
 	position: relative;
 	display: grid;
 	grid-template-columns: 1fr;
@@ -62,20 +21,32 @@ styleInject(`
 		"toolbar";
 	margin: 0;
 	box-sizing: border-box;
-	border-radius: var(--reltio-textarea-border-radius);
-	outline: var(--reltio-textarea-border-width) solid var(--reltio-textarea-color-border);
+	border-radius: 4px;
+	outline: 1px solid var(--reltio-color-border-3);
 	cursor: text;
 	transition:
 		outline-color 0.1s ease,
 		outline-width 0.1s ease;
-	background: var(--reltio-textarea-color-background);
+	background: var(--reltio-color-surface-1);
+}
+
+.TextArea_root__L29wd:focus-within .TextArea_inputContainer__L29wd {
+	outline: 2px solid var(--reltio-color-primary);
+}
+
+.TextArea_root__L29wd[data-error="true"] .TextArea_inputContainer__L29wd {
+	outline-color: var(--reltio-color-error);
+}
+
+.TextArea_root__L29wd[data-error="true"]:focus-within .TextArea_inputContainer__L29wd {
+	outline: 2px solid var(--reltio-color-error);
 }
 
-._root_pmwmi_1[data-disabled="true"] ._inputContainer_pmwmi_52 {
+.TextArea_root__L29wd[data-disabled="true"] .TextArea_inputContainer__L29wd {
 	cursor: not-allowed;
 }
 
-._textarea_pmwmi_75 {
+.TextArea_textarea__L29wd {
 	grid-area: textarea;
 	position: relative;
 	display: block;
@@ -84,65 +55,85 @@ styleInject(`
 	outline: none;
 	background: none;
 	width: 100%;
-	min-height: var(--reltio-textarea-min-height);
-	max-height: var(--reltio-textarea-max-height);
-	border-radius: var(--reltio-textarea-border-radius);
+	min-height: 56px;
+	max-height: min(500px, 50cqh);
+	border-radius: 4px;
 	box-sizing: border-box;
-	font-size: var(--reltio-textarea-font-size);
-	font-family: var(--reltio-textarea-font-family);
-	line-height: var(--reltio-textarea-line-height);
+	font-size: 16px;
+	font-family: "Roboto", sans-serif;
+	line-height: 1.5;
 	resize: none;
-	color: var(--reltio-textarea-color-text);
-	padding: var(--reltio-textarea-padding);
+	color: var(--reltio-color-text);
+	padding: 16px;
 	overflow-y: auto;
 	field-sizing: content;
 }
 
-._textarea_pmwmi_75::placeholder {
-	color: var(--reltio-textarea-color-label);
+.TextArea_textarea__L29wd::placeholder {
+	color: var(--reltio-color-text-secondary);
+}
+
+.TextArea_root__L29wd:focus-within .TextArea_textarea__L29wd::placeholder {
+	color: var(--reltio-color-primary);
 }
 
-._textarea_pmwmi_75:disabled {
+.TextArea_root__L29wd[data-error="true"] .TextArea_textarea__L29wd::placeholder {
+	color: var(--reltio-color-error);
+}
+
+.TextArea_textarea__L29wd:disabled {
 	cursor: not-allowed;
 }
 
-._label_pmwmi_106 {
+.TextArea_label__L29wd {
 	position: absolute;
 	opacity: 0;
 	top: 16px;
 	left: 8px;
 	transform: translateY(-50%);
 	transition: all 0.2s ease;
-	background-color: var(--reltio-textarea-color-background);
+	background-color: var(--reltio-color-surface-1);
 	padding: 4px 8px;
-	border-radius: var(--reltio-textarea-border-radius);
-	color: var(--reltio-textarea-color-label);
+	border-radius: 4px;
+	color: var(--reltio-color-text-secondary);
 	z-index: 2;
-	font-size: var(--reltio-textarea-font-size);
-	font-family: var(--reltio-textarea-font-family);
+	font-size: 16px;
+	font-family: "Roboto", sans-serif;
 	pointer-events: none;
 }
 
-._textarea_pmwmi_75:not(:placeholder-shown) + ._label_pmwmi_106 {
+.TextArea_textarea__L29wd:not(:placeholder-shown) + .TextArea_label__L29wd {
 	top: -1px;
 	font-size: 12px;
 	opacity: 1;
 }
 
-._textarea_pmwmi_75:focus + ._label_pmwmi_106 {
+.TextArea_textarea__L29wd:focus + .TextArea_label__L29wd {
 	top: -1px;
 	font-size: 12px;
 	opacity: 1;
 }
 
-._supportingText_pmwmi_135 {
+.TextArea_root__L29wd:focus-within .TextArea_label__L29wd {
+	color: var(--reltio-color-primary);
+}
+
+.TextArea_root__L29wd[data-error="true"] .TextArea_label__L29wd {
+	color: var(--reltio-color-error);
+}
+
+.TextArea_supportingText__L29wd {
 	font-size: 12px;
-	padding: 4px var(--reltio-textarea-padding);
-	color: var(--reltio-textarea-color-supporting-text);
-	font-family: var(--reltio-textarea-font-family);
+	padding: 4px 16px;
+	color: var(--reltio-color-text-secondary);
+	font-family: "Roboto", sans-serif;
+}
+
+.TextArea_root__L29wd[data-error="true"] .TextArea_supportingText__L29wd {
+	color: var(--reltio-color-error);
 }
 
-._toolbar_pmwmi_142 {
+.TextArea_toolbar__L29wd {
 	grid-area: toolbar;
 	display: flex;
 	flex-direction: row;

package/components/TextArea/TextArea.module.css.json

@@ -1 +1 @@
-{ "root": "_root_pmwmi_1", "inputContainer": "_inputContainer_pmwmi_52", "textarea": "_textarea_pmwmi_75", "label": "_label_pmwmi_106", "supportingText": "_supportingText_pmwmi_135", "toolbar": "_toolbar_pmwmi_142" }
+{ "root": "TextArea_root__L29wd", "inputContainer": "TextArea_inputContainer__L29wd", "textarea": "TextArea_textarea__L29wd", "label": "TextArea_label__L29wd", "supportingText": "TextArea_supportingText__L29wd", "toolbar": "TextArea_toolbar__L29wd" }

package/components/TextArea/TextArea.types.d.ts

@@ -1,5 +1,5 @@
 import type React from "react";
-export type TextAreaProps = {
+export type TextAreaProps = React.ComponentPropsWithoutRef<"textarea"> & {
     /**
      * Floating label text displayed above the textarea
      */
@@ -17,25 +17,4 @@ export type TextAreaProps = {
      * Toolbar content rendered below the textarea input
      */
     toolbar?: React.ReactNode;
-    /**
-     * Custom styles including CSS custom properties for theming
-     */
-    style?: React.CSSProperties & {
-        "--reltio-textarea-font-family": string;
-        "--reltio-textarea-font-size": string;
-        "--reltio-textarea-line-height": string;
-        "--reltio-textarea-color-text": string;
-        "--reltio-textarea-color-border": string;
-        "--reltio-textarea-color-border-focus": string;
-        "--reltio-textarea-color-background": string;
-        "--reltio-textarea-color-error": string;
-        "--reltio-textarea-color-label": string;
-        "--reltio-textarea-color-supporting-text": string;
-        "--reltio-textarea-border-radius": string;
-        "--reltio-textarea-padding": string;
-        "--reltio-textarea-min-height": string;
-        "--reltio-textarea-max-height": string;
-        "--reltio-textarea-border-width": string;
-        "--reltio-textarea-border-width-focus": string;
-    };
-} & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "style">;
+};

package/components/TreeList/TreeList.module.css.js

@@ -1,23 +1,18 @@
 import styleInject from 'style-inject';
 import json from './TreeList.module.css.json';
 styleInject(`
-._root_k7z3s_1 {
-	--reltio-tree-list-font-family: inherit;
-	--reltio-tree-list-font-size: inherit;
-	--reltio-tree-list-text-color: inherit;
-	--reltio-tree-list-background: inherit;
-	--reltio-tree-list-line-height: inherit;
+.TreeList_root__L29wd {
 	display: block;
 	overflow: auto;
-	font-family: var(--reltio-tree-list-font-family, system-ui, sans-serif);
-	font-size: var(--reltio-tree-list-font-size, 14px);
-	color: var(--reltio-tree-list-text-color, #1a1a1a);
-	background: var(--reltio-tree-list-background, transparent);
+	font-family: system-ui, sans-serif;
+	font-size: 14px;
+	color: var(--reltio-color-text);
+	background: transparent;
 	border: none;
-	border-radius: var(--reltio-tree-list-border-radius, 0);
+	border-radius: 0;
 }
 
-._rc-tree-treenode_k7z3s_17 {
+.TreeList_rc-tree-treenode__L29wd {
 	list-style: none;
 }
 `);

package/components/TreeList/TreeList.module.css.json

@@ -1 +1 @@
-{ "root": "_root_k7z3s_1", "rc-tree-treenode": "_rc-tree-treenode_k7z3s_17" }
+{ "root": "TreeList_root__L29wd", "rc-tree-treenode": "TreeList_rc-tree-treenode__L29wd" }

package/components/TreeList/components/TreeLevelLines/TreeLevelLines.module.css.js

@@ -1,7 +1,7 @@
 import styleInject from 'style-inject';
 import json from './TreeLevelLines.module.css.json';
 styleInject(`
-._levelLines_12unh_1 {
+.TreeLevelLines_levelLines__L29wd {
 	position: absolute;
 	display: flex;
 	padding-left: 0;
@@ -11,42 +11,39 @@ styleInject(`
 	z-index: 0;
 }
 
-._levelLine_12unh_1 {
-	padding-left: var(--reltio-tree-list-indent-size, 16px);
+.TreeLevelLines_levelLine__L29wd {
+	padding-left: 16px;
 	height: 100%;
 	position: relative;
 }
 
-._showLine_12unh_17::after {
+.TreeLevelLines_showLine__L29wd::after {
 	content: "";
 	position: absolute;
 	height: 100%;
 	width: 1px;
-	left: calc(var(--reltio-tree-list-indent-size, 16px) - 2px);
+	left: 14px;
 	top: 0;
 	bottom: 0;
-	background-color: var(--reltio-tree-list-line-color, rgba(0, 0, 0, 0.08));
+	background-color: var(--reltio-color-bg-transparent-1);
 }
 
-._lastLevelLine_12unh_28::after {
+.TreeLevelLines_lastLevelLine__L29wd::after {
 	height: 50%;
 }
 
-._lastLevelLine_12unh_28 {
-	padding-left: calc(
-		var(--reltio-tree-list-indent-size, 16px) +
-		(var(--reltio-tree-list-toggle-size, 26px) / 2)
-	);
+.TreeLevelLines_lastLevelLine__L29wd {
+	padding-left: 29px;
 }
 
-._horizontalLine_12unh_39::before {
+.TreeLevelLines_horizontalLine__L29wd::before {
 	content: "";
 	height: 1px;
 	width: 5px;
 	position: absolute;
 	top: 50%;
-	left: calc(var(--reltio-tree-list-indent-size, 16px) - 2px);
-	background-color: var(--reltio-tree-list-line-color, rgba(0, 0, 0, 0.08));
+	left: 14px;
+	background-color: var(--reltio-color-bg-transparent-1);
 }
 `);
 export default json;

package/components/TreeList/components/TreeLevelLines/TreeLevelLines.module.css.json

@@ -1 +1 @@
-{ "levelLines": "_levelLines_12unh_1", "levelLine": "_levelLine_12unh_1", "showLine": "_showLine_12unh_17", "lastLevelLine": "_lastLevelLine_12unh_28", "horizontalLine": "_horizontalLine_12unh_39" }
+{ "levelLines": "TreeLevelLines_levelLines__L29wd", "levelLine": "TreeLevelLines_levelLine__L29wd", "showLine": "TreeLevelLines_showLine__L29wd", "lastLevelLine": "TreeLevelLines_lastLevelLine__L29wd", "horizontalLine": "TreeLevelLines_horizontalLine__L29wd" }

package/components/TreeList/components/TreeNode/TreeNode.module.css.js

@@ -1,54 +1,52 @@
 import styleInject from 'style-inject';
 import json from './TreeNode.module.css.json';
 styleInject(`
-._wrapper_xk2s6_1 {
+.TreeNode_wrapper__L29wd {
 	display: flex;
 	align-items: center;
-	line-height: var(--reltio-tree-list-line-height, 1.5);
-	padding: var(--reltio-tree-list-row-padding-block, 2px)
-		var(--reltio-tree-list-row-padding-inline, 4px);
+	line-height: 1.5;
+	padding: 2px 4px;
 	position: relative;
 	z-index: 1;
 }
 
-._indent_xk2s6_11 {
+.TreeNode_indent__L29wd {
 	display: inline-block;
-	width: calc(var(--depth, 1) * var(--reltio-tree-list-indent-size, 16px));
+	width: calc(var(--depth, 1) * 16px);
 	flex: 0 0 auto;
 }
 
-._toggle_xk2s6_17 {
+.TreeNode_toggle__L29wd {
 	display: inline-flex;
 	align-items: center;
 	justify-content: center;
-	width: var(--reltio-tree-list-toggle-size, 26px);
-	height: var(--reltio-tree-list-toggle-size, 26px);
+	width: 26px;
+	height: 26px;
 	border: none;
 	background: none;
-	color: var(--reltio-tree-list-toggle-color, #5f6368);
+	color: var(--reltio-color-text-secondary);
 	cursor: pointer;
 }
 
-._chevron_xk2s6_29 {
+.TreeNode_chevron__L29wd {
 	transition: transform 0.2s ease;
 }
 
-._expanded_xk2s6_33 {
+.TreeNode_expanded__L29wd {
 	transform: rotate(90deg);
 }
 
-._spinner_xk2s6_37 {
+.TreeNode_spinner__L29wd {
 	display: inline-block;
-	width: var(--reltio-tree-list-spinner-size, 10px);
-	height: var(--reltio-tree-list-spinner-size, 10px);
+	width: 10px;
+	height: 10px;
 	border-radius: 50%;
-	border: var(--reltio-tree-list-spinner-width, 2px) solid
-		var(--reltio-tree-list-spinner-color, currentColor);
+	border: 2px solid currentColor;
 	border-top-color: transparent;
-	animation: _spin_xk2s6_37 0.8s linear infinite;
+	animation: TreeNode_spin__L29wd 0.8s linear infinite;
 }
 
-@keyframes _spin_xk2s6_37 {
+@keyframes TreeNode_spin__L29wd {
 	from {
 		transform: rotate(0deg);
 	}
@@ -57,13 +55,13 @@ styleInject(`
 	}
 }
 
-._actions_xk2s6_57 {
+.TreeNode_actions__L29wd {
 	margin-left: auto;
 	opacity: 0;
 	transition: opacity 0.12s ease;
 }
 
-._wrapper_xk2s6_1:hover ._actions_xk2s6_57 {
+.TreeNode_wrapper__L29wd:hover .TreeNode_actions__L29wd {
 	opacity: 1;
 }
 `);

package/components/TreeList/components/TreeNode/TreeNode.module.css.json

@@ -1 +1 @@
-{ "wrapper": "_wrapper_xk2s6_1", "indent": "_indent_xk2s6_11", "toggle": "_toggle_xk2s6_17", "chevron": "_chevron_xk2s6_29", "expanded": "_expanded_xk2s6_33", "spinner": "_spinner_xk2s6_37", "spin": "_spin_xk2s6_37", "actions": "_actions_xk2s6_57" }
+{ "wrapper": "TreeNode_wrapper__L29wd", "indent": "TreeNode_indent__L29wd", "toggle": "TreeNode_toggle__L29wd", "chevron": "TreeNode_chevron__L29wd", "expanded": "TreeNode_expanded__L29wd", "spinner": "TreeNode_spinner__L29wd", "spin": "TreeNode_spin__L29wd", "actions": "TreeNode_actions__L29wd" }

package/components/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./AppSelector";
 export * from "./AssistantLoader";
 export * from "./Button";
 export * from "./Chat";

package/components/index.js

@@ -1,3 +1,4 @@
+export * from "./AppSelector";
 export * from "./AssistantLoader";
 export * from "./Button";
 export * from "./Chat";

package/icons/AccessTime.d.ts

@@ -0,0 +1,2 @@
+import type { IconProps } from "./Icon.types";
+export declare const AccessTime: ({ size, color, className, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;

package/icons/AccessTime.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { classNames } from "../utils/classNames";
+import styles from "./Icon.module.css";
+export const AccessTime = ({ size = "medium", color = "inherited", className, ...props }) => {
+    return (_jsx("svg", { className: classNames(styles.root, styles[size], styles[color], className), viewBox: "0 0 20 20", fill: "currentColor", ...props, children: _jsx("path", { d: "M13.473 14.527L14.527 13.473L10.75 9.696V5H9.25V10.3038L13.473 14.527ZM10.0017 19.5C8.68775 19.5 7.45267 19.2507 6.2965 18.752C5.14033 18.2533 4.13467 17.5766 3.2795 16.7218C2.42433 15.8669 1.74725 14.8617 1.24825 13.706C0.749417 12.5503 0.5 11.3156 0.5 10.0017C0.5 8.68775 0.749333 7.45267 1.248 6.2965C1.74667 5.14033 2.42342 4.13467 3.27825 3.2795C4.13308 2.42433 5.13833 1.74725 6.294 1.24825C7.44967 0.749417 8.68442 0.5 9.99825 0.5C11.3123 0.5 12.5473 0.749333 13.7035 1.248C14.8597 1.74667 15.8653 2.42342 16.7205 3.27825C17.5757 4.13308 18.2528 5.13833 18.7518 6.294C19.2506 7.44967 19.5 8.68442 19.5 9.99825C19.5 11.3123 19.2507 12.5473 18.752 13.7035C18.2533 14.8597 17.5766 15.8653 16.7218 16.7205C15.8669 17.5757 14.8617 18.2528 13.706 18.7518C12.5503 19.2506 11.3156 19.5 10.0017 19.5ZM10 18C12.2167 18 14.1042 17.2208 15.6625 15.6625C17.2208 14.1042 18 12.2167 18 10C18 7.78333 17.2208 5.89583 15.6625 4.3375C14.1042 2.77917 12.2167 2 10 2C7.78333 2 5.89583 2.77917 4.3375 4.3375C2.77917 5.89583 2 7.78333 2 10C2 12.2167 2.77917 14.1042 4.3375 15.6625C5.89583 17.2208 7.78333 18 10 18Z" }) }));
+};

package/icons/Accessibility.d.ts

@@ -0,0 +1,2 @@
+import type { IconProps } from "./Icon.types";
+export declare const Accessibility: ({ size, color, className, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;

package/icons/Accessibility.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { classNames } from "../utils/classNames";
+import styles from "./Icon.module.css";
+export const Accessibility = ({ size = "medium", color = "inherited", className, ...props }) => {
+    return (_jsx("svg", { className: classNames(styles.root, styles[size], styles[color], className), viewBox: "0 0 20 20", fill: "currentColor", ...props, children: _jsx("path", { d: "M10 3.90374C9.4885 3.90374 9.05292 3.72399 8.69325 3.36449C8.33358 3.00482 8.15375 2.56924 8.15375 2.05774C8.15375 1.54624 8.33358 1.11065 8.69325 0.750986C9.05292 0.391319 9.4885 0.211487 10 0.211487C10.5115 0.211487 10.9471 0.391319 11.3068 0.750986C11.6664 1.11065 11.8462 1.54624 11.8462 2.05774C11.8462 2.56924 11.6664 3.00482 11.3068 3.36449C10.9471 3.72399 10.5115 3.90374 10 3.90374ZM7.404 19.75V6.71149C6.38467 6.62815 5.37117 6.50799 4.3635 6.35099C3.35583 6.19382 2.40133 5.9999 1.5 5.76924L1.8655 4.26924C3.14617 4.60007 4.47342 4.83982 5.84725 4.98849C7.22092 5.13715 8.60517 5.21149 10 5.21149C11.3948 5.21149 12.7791 5.13715 14.1528 4.98849C15.5266 4.83982 16.8538 4.60007 18.1345 4.26924L18.5 5.76924C17.5987 5.9999 16.6442 6.19382 15.6365 6.35099C14.6288 6.50799 13.6153 6.62815 12.596 6.71149V19.75H11.0962V13.6345H8.90375V19.75H7.404Z" }) }));
+};