@cognite/reveal-components 1.0.2 → 1.48552.0

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-node.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/ui/components/commandBased/treeView/TreeView/tree-view-node.tsx"],"sourcesContent":["import type { Context, ReactElement } from 'react';\nimport { createContext, useContext, useState } from 'react';\n\nimport { useSignalValue } from '@cognite/signal-utils/react';\n\nimport { type TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';\n\nimport { getChildrenAsArray } from './components/get-children-as-array';\nimport { INDENTATION } from './constants';\nimport { createTreeNodeExtraComponent } from './extraComponents/createTreeNodeExtraComponent';\nimport { CustomTreeViewNodeContext } from './tree-view-node.context';\nimport { type TreeViewProps } from './tree-view-props';\nimport type { OpenContextMenuAction } from './types';\n\nexport type TreeViewNodeProps = {\n  node: TreeNodeType;\n  level: number;\n  props: TreeViewProps;\n  openContextMenu: OpenContextMenuAction;\n};\n\nexport const TreeViewNode = ({\n  node: inputNode,\n  level,\n  props,\n  openContextMenu,\n}: TreeViewNodeProps): ReactElement => {\n  const [isHover, setHover] = useState(false);\n\n  useSignalValue(inputNode.updateSignal);\n\n  const { TreeViewChild } = useContext(CustomTreeViewChildContext);\n  const {\n    TreeViewCaret,\n    TreeViewCheckbox,\n    TreeViewIcon,\n    TreeViewInfo,\n    TreeViewLabel,\n    TreeViewLoadMore,\n    TreeViewLoading,\n  } = useContext(CustomTreeViewNodeContext);\n\n  if (inputNode.isVisibleInTree === false) {\n    return <></>;\n  }\n\n  const children = getChildrenAsArray(inputNode, props.loader);\n  const hasHover = props.hasHover ?? true;\n  const hasCheckboxes = props.hasCheckboxes ?? true;\n  const hasInfo =\n    inputNode.hasInfoIcon === true &&\n    (inputNode.tooltip !== undefined || props.onClickInfo !== undefined);\n\n  const isLoadingChildren = inputNode.isLoadingChildren === true;\n  const hasLoadMore =\n    inputNode.isLoadingSiblings === false &&\n    inputNode.needLoadSiblings === true &&\n    inputNode.loadSiblings !== undefined;\n\n  const handleContextMenu = (event: React.MouseEvent<HTMLDivElement>): void => {\n    event.preventDefault();\n    event.stopPropagation();\n    openContextMenu(inputNode, { x: event.clientX, y: event.clientY });\n  };\n\n  return (\n    <div>\n      <div\n        id={inputNode.id}\n        className={`flex flex-row items-center justify-between rounded text-foreground gap-1.5 py-[3px] ${inputNode.isSelected ? 'bg-primary-background/20' : isHover ? 'bg-muted-background' : ''}`}\n        style={{ marginLeft: level * INDENTATION + 'px' }}\n        onMouseEnter={() => {\n          if (hasHover) setHover(true);\n        }}\n        onMouseLeave={() => {\n          if (hasHover) setHover(false);\n        }}\n        onContextMenu={handleContextMenu}\n      >\n        <div\n          className=\"flex flex-row items-center tree-view-node-row gap-1.5\"\n          role=\"row\"\n          onClick={(event) => event.stopPropagation()}\n        >\n          <TreeViewCaret node={inputNode} />\n          {hasCheckboxes && (\n            <TreeViewCheckbox\n              node={inputNode}\n              onToggleNode={props.onToggleNode}\n            />\n          )}\n          <div\n            className=\"flex flex-row items-center gap-1.5\"\n            role=\"treeitem\"\n            aria-selected={inputNode.isSelected === true}\n            onClick={(event) => {\n              if (props.onSelectNode !== undefined)\n                props.onSelectNode(\n                  inputNode,\n                  event.shiftKey,\n                  event.ctrlKey || event.metaKey\n                );\n\n              event.stopPropagation();\n              event.preventDefault();\n            }}\n          >\n            {props.getIconFromIconName && inputNode.icon !== undefined && (\n              <TreeViewIcon\n                node={inputNode}\n                getIconFromIconName={props.getIconFromIconName}\n              />\n            )}\n            {isLoadingChildren && (\n              <TreeViewLoading label={props.loadingLabel} />\n            )}\n            {!isLoadingChildren && (\n              <TreeViewLabel\n                node={inputNode}\n                maxLabelLength={props.maxLabelLength}\n              />\n            )}\n          </div>\n        </div>\n        {createTreeNodeExtraComponent(inputNode)}\n        {hasInfo && (\n          <TreeViewInfo node={inputNode} onClick={props.onClickInfo} />\n        )}\n      </div>\n      {children !== undefined &&\n        children.map((child) => (\n          <TreeViewChild\n            node={child}\n            key={child.id}\n            level={level + 1}\n            props={props}\n            openContextMenu={openContextMenu}\n          />\n        ))}\n      {hasLoadMore && props.loader !== undefined && (\n        <TreeViewLoadMore\n          node={inputNode}\n          level={level}\n          label={props.loadMoreLabel}\n          loader={props.loader}\n        />\n      )}\n      {inputNode.isLoadingSiblings === true && (\n        <TreeViewLoading level={level} label={props.loadingLabel} />\n      )}\n    </div>\n  );\n};\n\n// This should actually be in CustomTreeViewNodeDependencies,\n// but to avoid circular dependencies we keep it here\n\ntype CustomTreeViewChildDependencies = {\n  TreeViewChild: (props: TreeViewNodeProps) => ReactElement;\n};\n\nexport const defaultTreeViewChildDependencies: CustomTreeViewChildDependencies =\n  {\n    TreeViewChild: (props) => (\n      <TreeViewNode\n        node={props.node}\n        level={props.level}\n        props={props.props}\n        openContextMenu={props.openContextMenu}\n      />\n    ),\n  };\n\nexport const CustomTreeViewChildContext: Context<CustomTreeViewChildDependencies> =\n  createContext(defaultTreeViewChildDependencies);\n"],"names":["createContext","useContext","useState","useSignalValue","getChildrenAsArray","INDENTATION","createTreeNodeExtraComponent","CustomTreeViewNodeContext","TreeViewNode","node","inputNode","level","props","openContextMenu","isHover","setHover","updateSignal","TreeViewChild","CustomTreeViewChildContext","TreeViewCaret","TreeViewCheckbox","TreeViewIcon","TreeViewInfo","TreeViewLabel","TreeViewLoadMore","TreeViewLoading","isVisibleInTree","children","loader","hasHover","hasCheckboxes","hasInfo","hasInfoIcon","tooltip","undefined","onClickInfo","isLoadingChildren","hasLoadMore","isLoadingSiblings","needLoadSiblings","loadSiblings","handleContextMenu","event","preventDefault","stopPropagation","x","clientX","y","clientY","div","id","className","isSelected","style","marginLeft","onMouseEnter","onMouseLeave","onContextMenu","role","onClick","onToggleNode","aria-selected","onSelectNode","shiftKey","ctrlKey","metaKey","getIconFromIconName","icon","label","loadingLabel","maxLabelLength","map","child","loadMoreLabel","defaultTreeViewChildDependencies"],"mappings":"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"}

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-props.d.ts

@@ -1,24 +1,24 @@
-import { ILazyLoader } from '../../../../../foundation/treeNodes/tree-node-type/i-lazy-loader';
-import { GetTreeNodeContextMenu, TreeNodeAction, TreeNodeSelectAction } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-actions';
-import { TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';
-import { IconName } from '../../../../../foundation/utilities/types';
-import { IconType } from '../../Factories/IconType';
+import { type ILazyLoader } from "../../../../../foundation/treeNodes/tree-node-type/i-lazy-loader";
+import type { GetTreeNodeContextMenu, TreeNodeAction, TreeNodeSelectAction } from "../../../../../foundation/treeNodes/tree-node-type/tree-node-actions";
+import { type TreeNodeType } from "../../../../../foundation/treeNodes/tree-node-type/tree-node-type";
+import { type IconName } from "../../../../../foundation/utilities/types";
+import { type IconType } from "../../Factories/IconType";
 export type TreeViewProps = {
-    showRoot?: boolean;
-    hasHover?: boolean;
-    hasCheckboxes?: boolean;
-    className?: string;
-    loadingLabel?: string;
-    loadMoreLabel?: string;
-    maxLabelLength?: number;
-    onSelectNode?: TreeNodeSelectAction;
-    onToggleNode?: TreeNodeAction;
-    onClickBackground?: () => void;
-    onClickInfo?: TreeNodeAction;
-    getContextMenu?: GetTreeNodeContextMenu;
-    onKeyDown?: (root: TreeNodeType, event: KeyboardEvent) => boolean;
-    getIconFromIconName?: GetIconFromIconNameFn;
-    root?: TreeNodeType;
-    loader?: ILazyLoader;
+	showRoot?: boolean;
+	hasHover?: boolean;
+	hasCheckboxes?: boolean;
+	className?: string;
+	loadingLabel?: string;
+	loadMoreLabel?: string;
+	maxLabelLength?: number;
+	onSelectNode?: TreeNodeSelectAction;
+	onToggleNode?: TreeNodeAction;
+	onClickBackground?: () => void;
+	onClickInfo?: TreeNodeAction;
+	getContextMenu?: GetTreeNodeContextMenu;
+	onKeyDown?: (root: TreeNodeType, event: KeyboardEvent) => boolean;
+	getIconFromIconName?: GetIconFromIconNameFn;
+	root?: TreeNodeType;
+	loader?: ILazyLoader;
 };
 export type GetIconFromIconNameFn = (icon: IconName) => IconType;

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-props.js

@@ -0,0 +1,7 @@
+/*
+ * Convert between a string to the actual icon component.
+ * This is made to avoid references to icon libraries in the data model
+ * so the data model can be independent on JSX.
+ */ export { };
+
+//# sourceMappingURL=tree-view-props.js.map

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-props.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/ui/components/commandBased/treeView/TreeView/tree-view-props.ts"],"sourcesContent":["import { type ILazyLoader } from '../../../../../foundation/treeNodes/tree-node-type/i-lazy-loader';\nimport type {\n  GetTreeNodeContextMenu,\n  TreeNodeAction,\n  TreeNodeSelectAction,\n} from '../../../../../foundation/treeNodes/tree-node-type/tree-node-actions';\nimport { type TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';\nimport { type IconName } from '../../../../../foundation/utilities/types';\nimport { type IconType } from '../../Factories/IconType';\n\nexport type TreeViewProps = {\n  // Appearance\n  showRoot?: boolean; // Show root, default is true\n  hasHover?: boolean; // Default true, If this is set, it uses the hover color for the mouse over effect\n  hasCheckboxes?: boolean; // Default is true, but if the node has checkboxState == undefined, it will not be shown anyway\n  className?: string;\n\n  // Labels are not translated. Should be done on the app side?\n  loadingLabel?: string; // Default is 'Loading...'\n  loadMoreLabel?: string; // Default is 'Load more...'\n  maxLabelLength?: number; // Max length of label before it is truncated and a tooltip will appear\n\n  // Event handlers\n  onSelectNode?: TreeNodeSelectAction; // Called when user select/deselect a node\n  onToggleNode?: TreeNodeAction; // Called when user toggle a node\n  onClickBackground?: () => void; // Called when user clicks within the tree view, but not on a node (e.g. empty space, caret, checkbox)\n  onClickInfo?: TreeNodeAction; // Called when user click the info icon, if undefined, no info icon will appear\n  getContextMenu?: GetTreeNodeContextMenu; // Called when user right-clicks a node, returns menu items to display\n  onKeyDown?: (root: TreeNodeType, event: KeyboardEvent) => boolean;\n  getIconFromIconName?: GetIconFromIconNameFn; // Function to get the icon for a node, if not set no icon will appear\n\n  // The root node of the tree (used only if loader is not set)\n  root?: TreeNodeType;\n\n  // Lazy loading manager (if this is set, the root above will be ignore,\n  // because the root is taken from the lazy loader)\n  loader?: ILazyLoader;\n};\n\n/*\n * Convert between a string to the actual icon component.\n * This is made to avoid references to icon libraries in the data model\n * so the data model can be independent on JSX.\n */\n\nexport type GetIconFromIconNameFn = (icon: IconName) => IconType;\n"],"names":[],"mappings":"AAuCA;;;;CAIC,GAED,WAAiE"}

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-scrolling.d.ts

@@ -1,4 +1,4 @@
-import { TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';
-import { UniqueId } from '../../../../../foundation/utilities/types';
+import { type TreeNodeType } from "../../../../../foundation/treeNodes/tree-node-type/tree-node-type";
+import { type UniqueId } from "../../../../../foundation/utilities/types";
 export declare function scrollToNode(container: HTMLElement | undefined, node: TreeNodeType | undefined): void;
 export declare function scrollToElementId(container: HTMLElement | undefined, id: UniqueId): void;

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-scrolling.js

@@ -1,21 +1,36 @@
-import { TreeNode as e } from "../../../../../foundation/treeNodes/tree-node/tree-node.js";
-//#region libs/shared/reveal-components/src/ui/components/commandBased/treeView/TreeView/tree-view-scrolling.ts
-function t(t, r) {
-	r !== void 0 && (r instanceof e && r.expandAllAncestors(), n(t, r.id));
+import { TreeNode } from "../../../../../foundation/treeNodes/tree-node/tree-node.js";
+export function scrollToNode(container, node) {
+    if (node === undefined) {
+        return;
+    }
+    if (node instanceof TreeNode) {
+        node.expandAllAncestors();
+    }
+    scrollToElementId(container, node.id);
 }
-function n(e, t) {
-	if (e === void 0) return;
-	let n = document.getElementById(t);
-	if (n === null) {
-		console.error("Element is not found", t);
-		return;
-	}
-	let r = e.getBoundingClientRect(), i = n.getBoundingClientRect();
-	i.top >= r.top && i.bottom <= r.bottom || n.scrollIntoView({
-		behavior: "smooth",
-		block: "nearest",
-		inline: "nearest"
-	});
+export function scrollToElementId(container, id) {
+    if (container === undefined) {
+        return;
+    }
+    const element = document.getElementById(id);
+    if (element === null) {
+        console.error('Element is not found', id);
+        return;
+    }
+    // Check if element is visible within the container
+    const containerRect = container.getBoundingClientRect();
+    const elementRect = element.getBoundingClientRect();
+    const isVisible = elementRect.top >= containerRect.top && elementRect.bottom <= containerRect.bottom;
+    if (isVisible) {
+        // Element is already fully visible, no need to scroll
+        return;
+    }
+    // Scroll the element into view within the container
+    element.scrollIntoView({
+        behavior: 'smooth',
+        block: 'nearest',
+        inline: 'nearest'
+    });
 }
-//#endregion
-export { n as scrollToElementId, t as scrollToNode };
+
+//# sourceMappingURL=tree-view-scrolling.js.map

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-scrolling.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/ui/components/commandBased/treeView/TreeView/tree-view-scrolling.ts"],"sourcesContent":["import { TreeNode } from '../../../../../foundation/treeNodes/tree-node/tree-node';\nimport { type TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';\nimport { type UniqueId } from '../../../../../foundation/utilities/types';\n\nexport function scrollToNode(\n  container: HTMLElement | undefined,\n  node: TreeNodeType | undefined\n): void {\n  if (node === undefined) {\n    return;\n  }\n  if (node instanceof TreeNode) {\n    node.expandAllAncestors();\n  }\n  scrollToElementId(container, node.id);\n}\n\nexport function scrollToElementId(\n  container: HTMLElement | undefined,\n  id: UniqueId\n): void {\n  if (container === undefined) {\n    return;\n  }\n  const element = document.getElementById(id);\n  if (element === null) {\n    console.error('Element is not found', id);\n    return;\n  }\n  // Check if element is visible within the container\n  const containerRect = container.getBoundingClientRect();\n  const elementRect = element.getBoundingClientRect();\n\n  const isVisible =\n    elementRect.top >= containerRect.top &&\n    elementRect.bottom <= containerRect.bottom;\n\n  if (isVisible) {\n    // Element is already fully visible, no need to scroll\n    return;\n  }\n  // Scroll the element into view within the container\n  element.scrollIntoView({\n    behavior: 'smooth',\n    block: 'nearest',\n    inline: 'nearest',\n  });\n}\n"],"names":["TreeNode","scrollToNode","container","node","undefined","expandAllAncestors","scrollToElementId","id","element","document","getElementById","console","error","containerRect","getBoundingClientRect","elementRect","isVisible","top","bottom","scrollIntoView","behavior","block","inline"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,6DAA0D;AAInF,OAAO,SAASC,aACdC,SAAkC,EAClCC,IAA8B;IAE9B,IAAIA,SAASC,WAAW;QACtB;IACF;IACA,IAAID,gBAAgBH,UAAU;QAC5BG,KAAKE,kBAAkB;IACzB;IACAC,kBAAkBJ,WAAWC,KAAKI,EAAE;AACtC;AAEA,OAAO,SAASD,kBACdJ,SAAkC,EAClCK,EAAY;IAEZ,IAAIL,cAAcE,WAAW;QAC3B;IACF;IACA,MAAMI,UAAUC,SAASC,cAAc,CAACH;IACxC,IAAIC,YAAY,MAAM;QACpBG,QAAQC,KAAK,CAAC,wBAAwBL;QACtC;IACF;IACA,mDAAmD;IACnD,MAAMM,gBAAgBX,UAAUY,qBAAqB;IACrD,MAAMC,cAAcP,QAAQM,qBAAqB;IAEjD,MAAME,YACJD,YAAYE,GAAG,IAAIJ,cAAcI,GAAG,IACpCF,YAAYG,MAAM,IAAIL,cAAcK,MAAM;IAE5C,IAAIF,WAAW;QACb,sDAAsD;QACtD;IACF;IACA,oDAAoD;IACpDR,QAAQW,cAAc,CAAC;QACrBC,UAAU;QACVC,OAAO;QACPC,QAAQ;IACV;AACF"}

package/dist/ui/components/commandBased/treeView/TreeView/tree-view.context.d.ts

@@ -1,10 +1,10 @@
-import { Context, ReactElement } from 'react';
-import { TreeViewContextMenuProps } from './components/tree-view-context-menu';
-import { TreeViewNodeProps } from './tree-view-node';
+import type { Context, ReactElement } from "react";
+import type { TreeViewContextMenuProps } from "./components/tree-view-context-menu";
+import { type TreeViewNodeProps } from "./tree-view-node";
 type CustomTreeViewDependencies = {
-    Loader: () => ReactElement;
-    TreeViewNode: (props: TreeViewNodeProps) => ReactElement;
-    TreeViewContextMenu: (props: TreeViewContextMenuProps) => ReactElement;
+	Loader: () => ReactElement;
+	TreeViewNode: (props: TreeViewNodeProps) => ReactElement;
+	TreeViewContextMenu: (props: TreeViewContextMenuProps) => ReactElement;
 };
 export declare const defaultTreeViewDependencies: CustomTreeViewDependencies;
 export declare const CustomTreeViewContext: Context<CustomTreeViewDependencies>;

package/dist/ui/components/commandBased/treeView/TreeView/tree-view.context.js

@@ -1,13 +1,19 @@
-import { TreeViewContextMenu as e } from "./components/tree-view-context-menu.js";
-import { TreeViewNode as t } from "./tree-view-node.js";
-import { createContext as n } from "react";
-import { jsx as r } from "react/jsx-runtime";
-import { IconLoader as i } from "@tabler/icons-react";
-//#region libs/shared/reveal-components/src/ui/components/commandBased/treeView/TreeView/tree-view.context.tsx
-var a = {
-	Loader: () => /* @__PURE__ */ r(i, { className: "animate-spin" }),
-	TreeViewNode: (e) => /* @__PURE__ */ r(t, { ...e }),
-	TreeViewContextMenu: (t) => /* @__PURE__ */ r(e, { ...t })
-}, o = n(a);
-//#endregion
-export { o as CustomTreeViewContext, a as defaultTreeViewDependencies };
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext } from "react";
+import { IconLoader } from "@tabler/icons-react";
+import { TreeViewContextMenu } from "./components/tree-view-context-menu.js";
+import { TreeViewNode } from "./tree-view-node.js";
+export const defaultTreeViewDependencies = {
+    Loader: ()=>/*#__PURE__*/ _jsx(IconLoader, {
+            className: "animate-spin"
+        }),
+    TreeViewNode: (props)=>/*#__PURE__*/ _jsx(TreeViewNode, {
+            ...props
+        }),
+    TreeViewContextMenu: (props)=>/*#__PURE__*/ _jsx(TreeViewContextMenu, {
+            ...props
+        })
+};
+export const CustomTreeViewContext = /*#__PURE__*/ createContext(defaultTreeViewDependencies);
+
+//# sourceMappingURL=tree-view.context.js.map

package/dist/ui/components/commandBased/treeView/TreeView/tree-view.context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/ui/components/commandBased/treeView/TreeView/tree-view.context.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport type { Context, ReactElement } from 'react';\n\nimport { IconLoader } from '@tabler/icons-react';\n\nimport type { TreeViewContextMenuProps } from './components/tree-view-context-menu';\nimport { TreeViewContextMenu } from './components/tree-view-context-menu';\nimport { TreeViewNode, type TreeViewNodeProps } from './tree-view-node';\n\ntype CustomTreeViewDependencies = {\n  Loader: () => ReactElement;\n  TreeViewNode: (props: TreeViewNodeProps) => ReactElement;\n  TreeViewContextMenu: (props: TreeViewContextMenuProps) => ReactElement;\n};\n\nexport const defaultTreeViewDependencies: CustomTreeViewDependencies = {\n  Loader: () => <IconLoader className=\"animate-spin\" />,\n  TreeViewNode: (props) => <TreeViewNode {...props} />,\n  TreeViewContextMenu: (props) => <TreeViewContextMenu {...props} />,\n};\n\nexport const CustomTreeViewContext: Context<CustomTreeViewDependencies> =\n  createContext(defaultTreeViewDependencies);\n"],"names":["createContext","IconLoader","TreeViewContextMenu","TreeViewNode","defaultTreeViewDependencies","Loader","className","props","CustomTreeViewContext"],"mappings":";AAAA,SAASA,aAAa,QAAQ,QAAQ;AAGtC,SAASC,UAAU,QAAQ,sBAAsB;AAGjD,SAASC,mBAAmB,QAAQ,yCAAsC;AAC1E,SAASC,YAAY,QAAgC,sBAAmB;AAQxE,OAAO,MAAMC,8BAA0D;IACrEC,QAAQ,kBAAM,KAACJ;YAAWK,WAAU;;IACpCH,cAAc,CAACI,sBAAU,KAACJ;YAAc,GAAGI,KAAK;;IAChDL,qBAAqB,CAACK,sBAAU,KAACL;YAAqB,GAAGK,KAAK;;AAChE,EAAE;AAEF,OAAO,MAAMC,sCACXR,cAAcI,6BAA6B"}

package/dist/ui/components/commandBased/treeView/TreeView/tree-view.d.ts

@@ -1,3 +1,3 @@
-import { ForwardRefExoticComponent, RefAttributes } from 'react';
-import { TreeViewProps } from './tree-view-props';
+import type { ForwardRefExoticComponent, RefAttributes } from "react";
+import { type TreeViewProps } from "./tree-view-props";
 export declare const TreeView: ForwardRefExoticComponent<TreeViewProps & RefAttributes<HTMLDivElement>>;

package/dist/ui/components/commandBased/treeView/TreeView/tree-view.js

@@ -1,56 +1,79 @@
-import { getChildrenAsArray as e } from "./components/get-children-as-array.js";
-import { CustomTreeViewContext as t } from "./tree-view.context.js";
-import { forwardRef as n, useCallback as r, useContext as i, useState as a } from "react";
-import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
-//#region libs/shared/reveal-components/src/ui/components/commandBased/treeView/TreeView/tree-view.tsx
-var l = n((n, l) => {
-	let { loader: u, onKeyDown: d, onClickBackground: f, getContextMenu: p, showRoot: m, className: h } = n, g = u?.root ?? n.root, { Loader: _, TreeViewNode: v, TreeViewContextMenu: y } = i(t), [b, x] = a(0), [S, C] = a(void 0);
-	g === void 0 && u?.loadInitialRoot !== void 0 && u.loadInitialRoot().then(() => {
-		x((e) => e + 1);
-	});
-	let w = r((e, t) => {
-		if (p !== void 0) {
-			let n = p(e);
-			n !== void 0 && n.length > 0 && C({
-				commands: n,
-				position: t
-			});
-		}
-	}, [p]), T = r((e) => {
-		g !== void 0 && d !== void 0 && d(g, e.nativeEvent) && e.preventDefault();
-	}, [d, g]);
-	if (g === void 0) return /* @__PURE__ */ s(_, {});
-	let E = m === !1 ? /* @__PURE__ */ s("div", {
-		ref: l,
-		className: `overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${h === void 0 ? "" : ` ${h}`}`,
-		onKeyDown: T,
-		onClick: f,
-		tabIndex: 0,
-		role: "tree",
-		children: e(g, u, !1)?.map((e) => /* @__PURE__ */ s(v, {
-			node: e,
-			level: 0,
-			props: n,
-			openContextMenu: w
-		}, e.id))
-	}) : /* @__PURE__ */ s("div", {
-		ref: l,
-		className: `overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${h === void 0 ? "" : ` ${h}`}`,
-		onKeyDown: T,
-		onClick: f,
-		tabIndex: 0,
-		role: "tree",
-		children: /* @__PURE__ */ s(v, {
-			node: g,
-			level: 0,
-			props: n,
-			openContextMenu: w
-		}, g.id)
-	});
-	return /* @__PURE__ */ c(o, { children: [E, S !== void 0 && /* @__PURE__ */ s(y, {
-		state: S,
-		onClose: () => C(void 0)
-	})] });
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { forwardRef, useCallback, useContext, useState } from "react";
+import { getChildrenAsArray } from "./components/get-children-as-array.js";
+import { CustomTreeViewContext } from "./tree-view.context.js";
+export const TreeView = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { loader, onKeyDown, onClickBackground, getContextMenu, showRoot, className } = props;
+    const root = loader?.root ?? props.root;
+    const { Loader, TreeViewNode, TreeViewContextMenu } = useContext(CustomTreeViewContext);
+    const [_, setForceUpdate] = useState(0); // Used to force re-render when root is loaded
+    const [contextMenu, setContextMenu] = useState(undefined);
+    if (root === undefined && loader?.loadInitialRoot !== undefined) {
+        // Load root and force update
+        void loader.loadInitialRoot().then(()=>{
+            setForceUpdate((prev)=>prev + 1);
+        });
+    }
+    const onOpenContextMenuCallback = useCallback((node, position)=>{
+        if (getContextMenu !== undefined) {
+            const commands = getContextMenu(node);
+            if (commands !== undefined && commands.length > 0) {
+                setContextMenu({
+                    commands,
+                    position
+                });
+            }
+        }
+    }, [
+        getContextMenu
+    ]);
+    const onKeyDownCallback = useCallback((event)=>{
+        if (root !== undefined && onKeyDown !== undefined && onKeyDown(root, event.nativeEvent)) {
+            event.preventDefault();
+        }
+    }, [
+        onKeyDown,
+        root
+    ]);
+    if (root === undefined) {
+        return /*#__PURE__*/ _jsx(Loader, {});
+    }
+    const treeContent = showRoot !== false ? /*#__PURE__*/ _jsx("div", {
+        ref: ref,
+        className: `overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${className !== undefined ? ` ${className}` : ''}`,
+        onKeyDown: onKeyDownCallback,
+        onClick: onClickBackground,
+        tabIndex: 0,
+        role: "tree",
+        children: /*#__PURE__*/ _jsx(TreeViewNode, {
+            node: root,
+            level: 0,
+            props: props,
+            openContextMenu: onOpenContextMenuCallback
+        }, root.id)
+    }) : /*#__PURE__*/ _jsx("div", {
+        ref: ref,
+        className: `overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${className !== undefined ? ` ${className}` : ''}`,
+        onKeyDown: onKeyDownCallback,
+        onClick: onClickBackground,
+        tabIndex: 0,
+        role: "tree",
+        children: getChildrenAsArray(root, loader, false)?.map((node)=>/*#__PURE__*/ _jsx(TreeViewNode, {
+                node: node,
+                level: 0,
+                props: props,
+                openContextMenu: onOpenContextMenuCallback
+            }, node.id))
+    });
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            treeContent,
+            contextMenu !== undefined && /*#__PURE__*/ _jsx(TreeViewContextMenu, {
+                state: contextMenu,
+                onClose: ()=>setContextMenu(undefined)
+            })
+        ]
+    });
 });
-//#endregion
-export { l as TreeView };
+
+//# sourceMappingURL=tree-view.js.map

package/dist/ui/components/commandBased/treeView/TreeView/tree-view.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/ui/components/commandBased/treeView/TreeView/tree-view.tsx"],"sourcesContent":["import type {\n  ForwardedRef,\n  ForwardRefExoticComponent,\n  ReactElement,\n  RefAttributes,\n} from 'react';\nimport { forwardRef, useCallback, useContext, useState } from 'react';\n\nimport { type TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';\n\nimport { getChildrenAsArray } from './components/get-children-as-array';\nimport { type TreeViewProps } from './tree-view-props';\nimport { CustomTreeViewContext } from './tree-view.context';\nimport type { ContextMenuState, ContextMenuPosition } from './types';\n\nexport const TreeView: ForwardRefExoticComponent<\n  TreeViewProps & RefAttributes<HTMLDivElement>\n> = forwardRef(\n  (props: TreeViewProps, ref: ForwardedRef<HTMLDivElement>): ReactElement => {\n    const {\n      loader,\n      onKeyDown,\n      onClickBackground,\n      getContextMenu,\n      showRoot,\n      className,\n    } = props;\n\n    const root = loader?.root ?? props.root;\n    const { Loader, TreeViewNode, TreeViewContextMenu } = useContext(\n      CustomTreeViewContext\n    );\n    const [_, setForceUpdate] = useState(0); // Used to force re-render when root is loaded\n    const [contextMenu, setContextMenu] = useState<\n      ContextMenuState | undefined\n    >(undefined);\n\n    if (root === undefined && loader?.loadInitialRoot !== undefined) {\n      // Load root and force update\n      void loader.loadInitialRoot().then(() => {\n        setForceUpdate((prev) => prev + 1);\n      });\n    }\n\n    const onOpenContextMenuCallback = useCallback(\n      (node: TreeNodeType, position: ContextMenuPosition): void => {\n        if (getContextMenu !== undefined) {\n          const commands = getContextMenu(node);\n          if (commands !== undefined && commands.length > 0) {\n            setContextMenu({ commands, position });\n          }\n        }\n      },\n      [getContextMenu]\n    );\n\n    const onKeyDownCallback = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>): void => {\n        if (\n          root !== undefined &&\n          onKeyDown !== undefined &&\n          onKeyDown(root, event.nativeEvent)\n        ) {\n          event.preventDefault();\n        }\n      },\n      [onKeyDown, root]\n    );\n\n    if (root === undefined) {\n      return <Loader />;\n    }\n\n    const treeContent =\n      showRoot !== false ? (\n        <div\n          ref={ref}\n          className={`overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${className !== undefined ? ` ${className}` : ''}`}\n          onKeyDown={onKeyDownCallback}\n          onClick={onClickBackground}\n          tabIndex={0}\n          role=\"tree\"\n        >\n          <TreeViewNode\n            node={root}\n            key={root.id}\n            level={0}\n            props={props}\n            openContextMenu={onOpenContextMenuCallback}\n          />\n        </div>\n      ) : (\n        <div\n          ref={ref}\n          className={`overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${className !== undefined ? ` ${className}` : ''}`}\n          onKeyDown={onKeyDownCallback}\n          onClick={onClickBackground}\n          tabIndex={0}\n          role=\"tree\"\n        >\n          {getChildrenAsArray(root, loader, false)?.map((node) => (\n            <TreeViewNode\n              node={node}\n              key={node.id}\n              level={0}\n              props={props}\n              openContextMenu={onOpenContextMenuCallback}\n            />\n          ))}\n        </div>\n      );\n\n    return (\n      <>\n        {treeContent}\n        {contextMenu !== undefined && (\n          <TreeViewContextMenu\n            state={contextMenu}\n            onClose={() => setContextMenu(undefined)}\n          />\n        )}\n      </>\n    );\n  }\n);\n"],"names":["forwardRef","useCallback","useContext","useState","getChildrenAsArray","CustomTreeViewContext","TreeView","props","ref","loader","onKeyDown","onClickBackground","getContextMenu","showRoot","className","root","Loader","TreeViewNode","TreeViewContextMenu","_","setForceUpdate","contextMenu","setContextMenu","undefined","loadInitialRoot","then","prev","onOpenContextMenuCallback","node","position","commands","length","onKeyDownCallback","event","nativeEvent","preventDefault","treeContent","div","onClick","tabIndex","role","level","openContextMenu","id","map","state","onClose"],"mappings":";AAMA,SAASA,UAAU,EAAEC,WAAW,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,QAAQ;AAItE,SAASC,kBAAkB,QAAQ,wCAAqC;AAExE,SAASC,qBAAqB,QAAQ,yBAAsB;AAG5D,OAAO,MAAMC,yBAETN,WACF,CAACO,OAAsBC;IACrB,MAAM,EACJC,MAAM,EACNC,SAAS,EACTC,iBAAiB,EACjBC,cAAc,EACdC,QAAQ,EACRC,SAAS,EACV,GAAGP;IAEJ,MAAMQ,OAAON,QAAQM,QAAQR,MAAMQ,IAAI;IACvC,MAAM,EAAEC,MAAM,EAAEC,YAAY,EAAEC,mBAAmB,EAAE,GAAGhB,WACpDG;IAEF,MAAM,CAACc,GAAGC,eAAe,GAAGjB,SAAS,IAAI,8CAA8C;IACvF,MAAM,CAACkB,aAAaC,eAAe,GAAGnB,SAEpCoB;IAEF,IAAIR,SAASQ,aAAad,QAAQe,oBAAoBD,WAAW;QAC/D,6BAA6B;QAC7B,KAAKd,OAAOe,eAAe,GAAGC,IAAI,CAAC;YACjCL,eAAe,CAACM,OAASA,OAAO;QAClC;IACF;IAEA,MAAMC,4BAA4B1B,YAChC,CAAC2B,MAAoBC;QACnB,IAAIjB,mBAAmBW,WAAW;YAChC,MAAMO,WAAWlB,eAAegB;YAChC,IAAIE,aAAaP,aAAaO,SAASC,MAAM,GAAG,GAAG;gBACjDT,eAAe;oBAAEQ;oBAAUD;gBAAS;YACtC;QACF;IACF,GACA;QAACjB;KAAe;IAGlB,MAAMoB,oBAAoB/B,YACxB,CAACgC;QACC,IACElB,SAASQ,aACTb,cAAca,aACdb,UAAUK,MAAMkB,MAAMC,WAAW,GACjC;YACAD,MAAME,cAAc;QACtB;IACF,GACA;QAACzB;QAAWK;KAAK;IAGnB,IAAIA,SAASQ,WAAW;QACtB,qBAAO,KAACP;IACV;IAEA,MAAMoB,cACJvB,aAAa,sBACX,KAACwB;QACC7B,KAAKA;QACLM,WAAW,CAAC,mEAAmE,EAAEA,cAAcS,YAAY,CAAC,CAAC,EAAET,WAAW,GAAG,IAAI;QACjIJ,WAAWsB;QACXM,SAAS3B;QACT4B,UAAU;QACVC,MAAK;kBAEL,cAAA,KAACvB;YACCW,MAAMb;YAEN0B,OAAO;YACPlC,OAAOA;YACPmC,iBAAiBf;WAHZZ,KAAK4B,EAAE;uBAOhB,KAACN;QACC7B,KAAKA;QACLM,WAAW,CAAC,mEAAmE,EAAEA,cAAcS,YAAY,CAAC,CAAC,EAAET,WAAW,GAAG,IAAI;QACjIJ,WAAWsB;QACXM,SAAS3B;QACT4B,UAAU;QACVC,MAAK;kBAEJpC,mBAAmBW,MAAMN,QAAQ,QAAQmC,IAAI,CAAChB,qBAC7C,KAACX;gBACCW,MAAMA;gBAENa,OAAO;gBACPlC,OAAOA;gBACPmC,iBAAiBf;eAHZC,KAAKe,EAAE;;IAStB,qBACE;;YACGP;YACAf,gBAAgBE,2BACf,KAACL;gBACC2B,OAAOxB;gBACPyB,SAAS,IAAMxB,eAAeC;;;;AAKxC,GACA"}

package/dist/ui/components/commandBased/treeView/TreeView/types.d.ts

@@ -1,11 +1,11 @@
-import { BaseCommand } from '../../../../../foundation/commands/BaseCommand';
-import { TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';
+import type { BaseCommand } from "../../../../../foundation/commands/BaseCommand";
+import type { TreeNodeType } from "../../../../../foundation/treeNodes/tree-node-type/tree-node-type";
 export type ContextMenuPosition = {
-    x: number;
-    y: number;
+	x: number;
+	y: number;
 };
 export type ContextMenuState = {
-    commands: BaseCommand[];
-    position: ContextMenuPosition;
+	commands: BaseCommand[];
+	position: ContextMenuPosition;
 };
 export type OpenContextMenuAction = (node: TreeNodeType, position: ContextMenuPosition) => void;

package/dist/ui/components/commandBased/treeView/TreeView/types.js

@@ -0,0 +1,3 @@
+export { };
+
+//# sourceMappingURL=types.js.map

package/dist/ui/components/commandBased/treeView/TreeView/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/ui/components/commandBased/treeView/TreeView/types.tsx"],"sourcesContent":["import type { BaseCommand } from '../../../../../foundation/commands/BaseCommand';\nimport type { TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';\n\nexport type ContextMenuPosition = { x: number; y: number };\n\nexport type ContextMenuState = {\n  commands: BaseCommand[];\n  position: ContextMenuPosition;\n};\n\nexport type OpenContextMenuAction = (\n  node: TreeNodeType,\n  position: ContextMenuPosition\n) => void;\n"],"names":[],"mappings":"AAUA,WAGU"}

package/dist/ui/components/commandBased/utils/LabelWithShortcut.d.ts

@@ -1,9 +1,9 @@
-import { default as React } from 'react';
-import { BaseCommand } from '../../../../foundation/commands/BaseCommand';
+import React from "react";
+import { type BaseCommand } from "../../../../foundation/commands/BaseCommand";
 type LabelWithShortcutProps = {
-    label?: string;
-    command?: BaseCommand;
-    inverted?: boolean;
+	label?: string;
+	command?: BaseCommand;
+	inverted?: boolean;
 };
 export declare const LabelWithShortcut: React.FC<LabelWithShortcutProps>;
 export {};

package/dist/ui/components/commandBased/utils/LabelWithShortcut.js

@@ -1,22 +1,27 @@
-import "react";
-import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
-//#region libs/shared/reveal-components/src/ui/components/commandBased/utils/LabelWithShortcut.tsx
-var r = ({ label: r, command: i, inverted: a = !0 }) => {
-	if (r === void 0) return /* @__PURE__ */ t(e, {});
-	let o = i?.getShortCutKeys(), s = a ? "bg-foreground-fixed-light/20 text-foreground-fixed-light" : "bg-foreground/10 text-foreground";
-	return /* @__PURE__ */ n("div", {
-		className: "flex flex-row",
-		children: [/* @__PURE__ */ t("div", {
-			className: "mr-1",
-			children: r
-		}), o !== void 0 && /* @__PURE__ */ t("div", {
-			className: "flex gap-1 ml-1",
-			children: o.map((e) => /* @__PURE__ */ t("kbd", {
-				className: `px-1 py-0.5 rounded text-xs font-mono ${s}`,
-				children: e
-			}, e))
-		})]
-	}, r);
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from "react";
+export const LabelWithShortcut = ({ label, command, inverted = true })=>{
+    if (label === undefined) {
+        return /*#__PURE__*/ _jsx(_Fragment, {});
+    }
+    const keys = command?.getShortCutKeys();
+    const kbdStyle = inverted ? 'bg-foreground-fixed-light/20 text-foreground-fixed-light' : 'bg-foreground/10 text-foreground';
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "flex flex-row",
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                className: "mr-1",
+                children: label
+            }),
+            keys !== undefined && /*#__PURE__*/ _jsx("div", {
+                className: "flex gap-1 ml-1",
+                children: keys.map((key)=>/*#__PURE__*/ _jsx("kbd", {
+                        className: `px-1 py-0.5 rounded text-xs font-mono ${kbdStyle}`,
+                        children: key
+                    }, key))
+            })
+        ]
+    }, label);
 };
-//#endregion
-export { r as LabelWithShortcut };
+
+//# sourceMappingURL=LabelWithShortcut.js.map

package/dist/ui/components/commandBased/utils/LabelWithShortcut.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/utils/LabelWithShortcut.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type BaseCommand } from '../../../../foundation/commands/BaseCommand';\n\ntype LabelWithShortcutProps = {\n  label?: string;\n  command?: BaseCommand;\n  inverted?: boolean;\n};\n\nexport const LabelWithShortcut: React.FC<LabelWithShortcutProps> = ({\n  label,\n  command,\n  inverted = true,\n}) => {\n  if (label === undefined) {\n    return <></>;\n  }\n  const keys = command?.getShortCutKeys();\n  const kbdStyle = inverted\n    ? 'bg-foreground-fixed-light/20 text-foreground-fixed-light'\n    : 'bg-foreground/10 text-foreground';\n  return (\n    <div key={label} className=\"flex flex-row\">\n      <div className=\"mr-1\">{label}</div>\n      {keys !== undefined && (\n        <div className=\"flex gap-1 ml-1\">\n          {keys.map((key) => (\n            <kbd\n              key={key}\n              className={`px-1 py-0.5 rounded text-xs font-mono ${kbdStyle}`}\n            >\n              {key}\n            </kbd>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["React","LabelWithShortcut","label","command","inverted","undefined","keys","getShortCutKeys","kbdStyle","div","className","map","key","kbd"],"mappings":";AAAA,OAAOA,WAAW,QAAQ;AAU1B,OAAO,MAAMC,oBAAsD,CAAC,EAClEC,KAAK,EACLC,OAAO,EACPC,WAAW,IAAI,EAChB;IACC,IAAIF,UAAUG,WAAW;QACvB,qBAAO;IACT;IACA,MAAMC,OAAOH,SAASI;IACtB,MAAMC,WAAWJ,WACb,6DACA;IACJ,qBACE,MAACK;QAAgBC,WAAU;;0BACzB,KAACD;gBAAIC,WAAU;0BAAQR;;YACtBI,SAASD,2BACR,KAACI;gBAAIC,WAAU;0BACZJ,KAAKK,GAAG,CAAC,CAACC,oBACT,KAACC;wBAECH,WAAW,CAAC,sCAAsC,EAAEF,UAAU;kCAE7DI;uBAHIA;;;OANLV;AAgBd,EAAE"}

package/dist/ui/components/commandBased/utils/constants.js

@@ -0,0 +1,5 @@
+export const DEFAULT_PADDING = '4px 8px';
+export const SELECT_DROPDOWN_ICON_COLOR = 'rgba(0, 0, 0, 0.7)';
+export const TOOLTIP_DELAY = 500;
+
+//# sourceMappingURL=constants.js.map

package/dist/ui/components/commandBased/utils/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/utils/constants.ts"],"sourcesContent":["export const DEFAULT_PADDING = '4px 8px';\nexport const SELECT_DROPDOWN_ICON_COLOR = 'rgba(0, 0, 0, 0.7)';\nexport const TOOLTIP_DELAY = 500;\n"],"names":["DEFAULT_PADDING","SELECT_DROPDOWN_ICON_COLOR","TOOLTIP_DELAY"],"mappings":"AAAA,OAAO,MAAMA,kBAAkB,UAAU;AACzC,OAAO,MAAMC,6BAA6B,qBAAqB;AAC/D,OAAO,MAAMC,gBAAgB,IAAI"}

package/dist/ui/components/commandBased/utils/types.d.ts

@@ -1,2 +1,2 @@
-export type PlacementType = 'top' | 'right' | 'bottom' | 'left';
-export type FlexDirection = 'row' | 'column';
+export type PlacementType = "top" | "right" | "bottom" | "left";
+export type FlexDirection = "row" | "column";

package/dist/ui/components/commandBased/utils/types.js

@@ -0,0 +1,3 @@
+export { };
+
+//# sourceMappingURL=types.js.map

package/dist/ui/components/commandBased/utils/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/utils/types.ts"],"sourcesContent":["export type PlacementType = 'top' | 'right' | 'bottom' | 'left';\n\nexport type FlexDirection = 'row' | 'column';\n"],"names":[],"mappings":"AAEA,WAA6C"}

package/dist/ui/components/commandBased/utils/utilities.d.ts

@@ -1,7 +1,7 @@
-import { OffsetOptions, Placement } from '@floating-ui/react';
-import { PlacementType, FlexDirection } from './types';
+import { type OffsetOptions, type Placement } from "@floating-ui/react";
+import type { PlacementType, FlexDirection } from "./types";
 export declare function getFlexDirection(placement: PlacementType): FlexDirection;
-export declare function getDividerDirection(placement: PlacementType): 'horizontal' | 'vertical';
+export declare function getDividerDirection(placement: PlacementType): "horizontal" | "vertical";
 export declare const DROP_DOWN_OFFSET: OffsetOptions;
 export declare function getDropdownPlacement(placement: PlacementType): Placement;
-export declare function mapButtonType(buttonType?: string): 'default' | 'secondary' | 'ghost' | 'destructive' | 'outline';
+export declare function mapButtonType(buttonType?: string): "default" | "secondary" | "ghost" | "destructive" | "outline";

package/dist/ui/components/commandBased/utils/utilities.js

@@ -1,15 +1,36 @@
-//#region libs/shared/reveal-components/src/ui/components/commandBased/utils/utilities.ts
-function e(e) {
-	return e === "top" || e === "bottom" ? "vertical" : "horizontal";
-}
-function t(e) {
-	switch (e) {
-		case "primary": return "default";
-		case "secondary": return "secondary";
-		case "ghost-destructive":
-		case "destructive": return "destructive";
-		default: return "ghost";
-	}
-}
-//#endregion
-export { e as getDividerDirection, t as mapButtonType };
+import { TOOLBAR_HORIZONTAL_PANEL_OFFSET } from "../../constants.js";
+export function getFlexDirection(placement) {
+    return placement === 'top' || placement === 'bottom' ? 'row' : 'column';
+}
+export function getDividerDirection(placement) {
+    return placement === 'top' || placement === 'bottom' ? 'vertical' : 'horizontal';
+}
+export const DROP_DOWN_OFFSET = {
+    mainAxis: TOOLBAR_HORIZONTAL_PANEL_OFFSET,
+    crossAxis: 0
+};
+// This ensures the rule for where the dropdown panel should open:
+// Horizontal toolbar at top:    Below the button
+// Horizontal toolbar at bottom: Above the button
+// Vertical toolbar at left:     Right of the button
+// Vertical toolbar at right:    Left of the button
+export function getDropdownPlacement(placement) {
+    return placement === 'top' || placement === 'bottom' ? 'bottom-end' : 'right-start';
+}
+export function mapButtonType(buttonType) {
+    switch(buttonType){
+        case 'primary':
+            return 'default';
+        case 'secondary':
+            return 'secondary';
+        case 'ghost-destructive':
+        case 'destructive':
+            return 'destructive';
+        case 'ghost':
+        case 'tertiary':
+        default:
+            return 'ghost';
+    }
+}
+
+//# sourceMappingURL=utilities.js.map

package/dist/ui/components/commandBased/utils/utilities.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/utils/utilities.ts"],"sourcesContent":["import { type OffsetOptions, type Placement } from '@floating-ui/react';\n\nimport { TOOLBAR_HORIZONTAL_PANEL_OFFSET } from '../../../../ui/components/constants';\n\nimport type { PlacementType, FlexDirection } from './types';\n\nexport function getFlexDirection(placement: PlacementType): FlexDirection {\n  return placement === 'top' || placement === 'bottom' ? 'row' : 'column';\n}\n\nexport function getDividerDirection(\n  placement: PlacementType\n): 'horizontal' | 'vertical' {\n  return placement === 'top' || placement === 'bottom'\n    ? 'vertical'\n    : 'horizontal';\n}\n\nexport const DROP_DOWN_OFFSET: OffsetOptions = {\n  mainAxis: TOOLBAR_HORIZONTAL_PANEL_OFFSET,\n  crossAxis: 0,\n};\n\n// This ensures the rule for where the dropdown panel should open:\n// Horizontal toolbar at top:    Below the button\n// Horizontal toolbar at bottom: Above the button\n// Vertical toolbar at left:     Right of the button\n// Vertical toolbar at right:    Left of the button\n\nexport function getDropdownPlacement(placement: PlacementType): Placement {\n  return placement === 'top' || placement === 'bottom'\n    ? 'bottom-end'\n    : 'right-start';\n}\n\nexport function mapButtonType(\n  buttonType?: string\n): 'default' | 'secondary' | 'ghost' | 'destructive' | 'outline' {\n  switch (buttonType) {\n    case 'primary':\n      return 'default';\n    case 'secondary':\n      return 'secondary';\n    case 'ghost-destructive':\n    case 'destructive':\n      return 'destructive';\n    case 'ghost':\n    case 'tertiary':\n    default:\n      return 'ghost';\n  }\n}\n"],"names":["TOOLBAR_HORIZONTAL_PANEL_OFFSET","getFlexDirection","placement","getDividerDirection","DROP_DOWN_OFFSET","mainAxis","crossAxis","getDropdownPlacement","mapButtonType","buttonType"],"mappings":"AAEA,SAASA,+BAA+B,QAAQ,qBAAsC;AAItF,OAAO,SAASC,iBAAiBC,SAAwB;IACvD,OAAOA,cAAc,SAASA,cAAc,WAAW,QAAQ;AACjE;AAEA,OAAO,SAASC,oBACdD,SAAwB;IAExB,OAAOA,cAAc,SAASA,cAAc,WACxC,aACA;AACN;AAEA,OAAO,MAAME,mBAAkC;IAC7CC,UAAUL;IACVM,WAAW;AACb,EAAE;AAEF,kEAAkE;AAClE,iDAAiD;AACjD,iDAAiD;AACjD,oDAAoD;AACpD,mDAAmD;AAEnD,OAAO,SAASC,qBAAqBL,SAAwB;IAC3D,OAAOA,cAAc,SAASA,cAAc,WACxC,eACA;AACN;AAEA,OAAO,SAASM,cACdC,UAAmB;IAEnB,OAAQA;QACN,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;QACL,KAAK;YACH,OAAO;QACT,KAAK;QACL,KAAK;QACL;YACE,OAAO;IACX;AACF"}

package/dist/ui/components/constants.js

@@ -0,0 +1,3 @@
+export const TOOLBAR_HORIZONTAL_PANEL_OFFSET = 12;
+
+//# sourceMappingURL=constants.js.map

package/dist/ui/components/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/components/constants.ts"],"sourcesContent":["export const TOOLBAR_HORIZONTAL_PANEL_OFFSET = 12;\n"],"names":["TOOLBAR_HORIZONTAL_PANEL_OFFSET"],"mappings":"AAAA,OAAO,MAAMA,kCAAkC,GAAG"}