@cognite/reveal-components 1.0.2 → 1.48535.0

package/dist/ui/components/commandBased/buttons/FilterButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/buttons/FilterButton.tsx"],"sourcesContent":["import {\n  useState,\n  type ReactElement,\n  type Dispatch,\n  type SetStateAction,\n} from 'react';\n\nimport { IconChevronDown, IconChevronUp } from '@tabler/icons-react';\n\nimport { Button } from '@cognite/aura/components/button';\nimport { CheckboxItemControl as Checkbox } from '@cognite/aura/components/checkbox';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuTrigger,\n} from '@cognite/aura/components/dropdown-menu';\nimport { Label } from '@cognite/aura/components/label';\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '@cognite/aura/components/popover';\n\nimport { type BaseCommand } from '../../../../domains';\nimport { BaseFilterCommand } from '../../../../foundation/commands/BaseFilterCommand';\nimport { type IconName } from '../../../../foundation/utilities/types';\nimport { TOOLBAR_HORIZONTAL_PANEL_OFFSET } from '../../constants';\nimport { IconComponent } from '../Factories/IconFactory';\nimport { useCommand } from '../hooks/useCommand';\nimport { useCommandProperty } from '../hooks/useCommandProperty';\nimport { useCommandProps } from '../hooks/useCommandProps';\nimport { type PlacementType } from '../utils/types';\nimport { mapButtonType } from '../utils/utilities';\n\nimport { FilterItem } from './FilterItem';\n\nexport function createFilterButton(\n  command: BaseCommand,\n  placement: PlacementType\n): ReactElement | undefined {\n  if (command instanceof BaseFilterCommand) {\n    return (\n      <FilterButton\n        key={command.uniqueId}\n        inputCommand={command}\n        placement={placement}\n      />\n    );\n  }\n  return undefined;\n}\n\nexport const FilterButton = ({\n  inputCommand,\n  usedInSettings = false,\n}: {\n  inputCommand: BaseFilterCommand;\n  placement: PlacementType;\n  usedInSettings?: boolean;\n}): ReactElement => {\n  const command = useCommand(inputCommand);\n  command.initializeChildrenIfNeeded();\n\n  const { icon, isVisible, isEnabled } = useCommandProps(command);\n  const isAllChecked = useCommandProperty(command, () => command.isAllChecked);\n  const isSomeChecked = useCommandProperty(\n    command,\n    () => command.isSomeChecked\n  );\n  const selectedLabel = useCommandProperty(command, () =>\n    command.getSelectedLabel()\n  );\n  const [isOpen, setOpen] = useState(false);\n\n  const children = command.children;\n  if (!isVisible || children === undefined || children.length === 0) {\n    return <></>;\n  }\n  const PanelContent = (\n    <FilterSelectPanelContent\n      command={command}\n      isAllChecked={isAllChecked}\n      isSomeChecked={isSomeChecked}\n      label={command.label}\n    />\n  );\n\n  return usedInSettings ? (\n    <FilterDropdown\n      label={command.label}\n      selectedLabel={selectedLabel}\n      isOpen={isOpen}\n      setOpen={setOpen}\n      PanelContent={PanelContent}\n    />\n  ) : (\n    <FilterMenu\n      command={command}\n      iconName={icon}\n      isOpen={isOpen}\n      setOpen={setOpen}\n      isEnabled={isEnabled}\n      PanelContent={PanelContent}\n    />\n  );\n};\n\nconst FilterMenu = ({\n  command,\n  isOpen,\n  setOpen,\n  isEnabled,\n  iconName,\n  PanelContent,\n}: {\n  command: BaseFilterCommand;\n  isOpen: boolean;\n  setOpen: Dispatch<SetStateAction<boolean>>;\n  isEnabled: boolean;\n  iconName: IconName;\n  PanelContent: ReactElement;\n}): ReactElement => {\n  const variant = mapButtonType(command.buttonType);\n  return (\n    <DropdownMenu open={isOpen} onOpenChange={setOpen}>\n      <DropdownMenuTrigger\n        render={\n          <Button\n            variant={variant}\n            size=\"icon-sm\"\n            disabled={!isEnabled}\n            aria-label={command.label}\n            className={isOpen ? 'bg-accent-background' : undefined}\n          >\n            <IconComponent iconName={iconName} />\n          </Button>\n        }\n      />\n      <DropdownMenuContent\n        side=\"right\"\n        align=\"end\"\n        sideOffset={TOOLBAR_HORIZONTAL_PANEL_OFFSET}\n      >\n        {PanelContent}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n};\n\nconst FilterDropdown = ({\n  label,\n  selectedLabel,\n  isOpen,\n  setOpen,\n  PanelContent,\n}: {\n  label: string;\n  selectedLabel: string;\n  isOpen: boolean;\n  setOpen: Dispatch<SetStateAction<boolean>>;\n  PanelContent: ReactElement;\n}): ReactElement => {\n  return (\n    <div className=\"flex flex-row self-stretch items-center gap-3\">\n      <p title={label} className=\"w-[80px] truncate text-sm\">\n        {label}\n      </p>\n      <Popover open={isOpen} onOpenChange={setOpen}>\n        <PopoverTrigger\n          render={\n            <Button\n              variant=\"ghost\"\n              className={`justify-between border border-transparent rounded-lg bg-background py-2 pl-2 pr-1 text-sm hover:bg-accent-background hover:border-border-emphasized${isOpen ? ' bg-accent-background' : ''}`}\n              onClick={() => {\n                setOpen((prev) => !prev);\n              }}\n            >\n              <span className=\"font-normal\">{selectedLabel}</span>\n              {isOpen ? <IconChevronUp /> : <IconChevronDown />}\n            </Button>\n          }\n        />\n        <PopoverContent\n          side=\"right\"\n          align=\"end\"\n          className=\"overflow-hidden p-0\"\n        >\n          {PanelContent}\n        </PopoverContent>\n      </Popover>\n    </div>\n  );\n};\n\nconst FilterSelectPanelContent = ({\n  command,\n  isAllChecked,\n  isSomeChecked,\n  label,\n}: {\n  command: BaseFilterCommand;\n  label: string;\n  isAllChecked: boolean;\n  isSomeChecked: boolean;\n}): ReactElement => {\n  const children = command.children;\n  const allId = 'filter-all';\n  const isIndeterminate = !isAllChecked && isSomeChecked;\n\n  return (\n    <div className=\"flex w-full flex-col\">\n      <div\n        className=\"flex items-center gap-2 px-2 py-1.5 hover:bg-accent-background cursor-pointer\"\n        onClick={() => command.toggleAllChecked()}\n      >\n        <Checkbox\n          id={allId}\n          checked={isIndeterminate ? false : isAllChecked}\n          indeterminate={isIndeterminate}\n          className=\"pointer-events-none\"\n        />\n        <Label htmlFor={allId} className=\"flex-1 pointer-events-none\">\n          {BaseFilterCommand.getAllString()}\n        </Label>\n      </div>\n      <div className=\"max-h-[300px] overflow-y-auto\">\n        <div className=\"text-xs font-medium text-muted-foreground px-2 py-1\">\n          {label}\n        </div>\n        {children?.map((child) => (\n          <FilterItem key={child.uniqueId} command={child} />\n        ))}\n      </div>\n    </div>\n  );\n};\n"],"names":["useState","IconChevronDown","IconChevronUp","Button","CheckboxItemControl","Checkbox","DropdownMenu","DropdownMenuContent","DropdownMenuTrigger","Label","Popover","PopoverContent","PopoverTrigger","BaseFilterCommand","TOOLBAR_HORIZONTAL_PANEL_OFFSET","IconComponent","useCommand","useCommandProperty","useCommandProps","mapButtonType","FilterItem","createFilterButton","command","placement","FilterButton","inputCommand","uniqueId","undefined","usedInSettings","initializeChildrenIfNeeded","icon","isVisible","isEnabled","isAllChecked","isSomeChecked","selectedLabel","getSelectedLabel","isOpen","setOpen","children","length","PanelContent","FilterSelectPanelContent","label","FilterDropdown","FilterMenu","iconName","variant","buttonType","open","onOpenChange","render","size","disabled","aria-label","className","side","align","sideOffset","div","p","title","onClick","prev","span","allId","isIndeterminate","toggleAllChecked","id","checked","indeterminate","htmlFor","getAllString","map","child"],"mappings":"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"}

package/dist/ui/components/commandBased/buttons/FilterItem.d.ts

@@ -1,5 +1,5 @@
-import { ReactElement } from 'react';
-import { BaseFilterItemCommand } from '../../../../foundation/commands/BaseFilterCommand';
-export declare const FilterItem: ({ command, }: {
-    command: BaseFilterItemCommand;
+import { type ReactElement } from "react";
+import { type BaseFilterItemCommand } from "../../../../foundation/commands/BaseFilterCommand";
+export declare const FilterItem: ({ command }: {
+	command: BaseFilterItemCommand;
 }) => ReactElement;

package/dist/ui/components/commandBased/buttons/FilterItem.js

@@ -1,35 +1,38 @@
-import { useCommandProps as e } from "../hooks/useCommandProps.js";
-import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
-import { CheckboxItemControl as i } from "@cognite/aura/components/checkbox";
-import { Label as a } from "@cognite/aura/components/label";
-//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/FilterItem.tsx
-var o = ({ command: o }) => {
-	let { uniqueId: s, isVisible: c, isEnabled: l, isChecked: u } = e(o);
-	if (!c) return /* @__PURE__ */ n(t, {});
-	let d = `filter-item-${s}`;
-	return /* @__PURE__ */ r("div", {
-		className: `flex items-center gap-2 px-3 py-1 ${l ? "hover:bg-accent-background cursor-pointer" : "opacity-50 pointer-events-none"}`,
-		onClick: () => {
-			l && o.invoke();
-		},
-		children: [
-			/* @__PURE__ */ n(i, {
-				id: d,
-				checked: u,
-				disabled: !l,
-				className: "pointer-events-none"
-			}),
-			/* @__PURE__ */ n(a, {
-				htmlFor: d,
-				className: "flex-1 truncate cursor-pointer text-sm pointer-events-none",
-				children: o.label
-			}),
-			o.color !== void 0 && /* @__PURE__ */ n("div", {
-				className: "size-4 shrink-0 rounded-sm",
-				style: { backgroundColor: o.color.getStyle() }
-			})
-		]
-	});
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { CheckboxItemControl as Checkbox } from "@cognite/aura/components/checkbox";
+import { Label } from "@cognite/aura/components/label";
+import { useCommandProps } from "../hooks/useCommandProps.js";
+export const FilterItem = ({ command })=>{
+    const { uniqueId, isVisible, isEnabled, isChecked } = useCommandProps(command);
+    if (!isVisible) {
+        return /*#__PURE__*/ _jsx(_Fragment, {});
+    }
+    const id = `filter-item-${uniqueId}`;
+    return /*#__PURE__*/ _jsxs("div", {
+        className: `flex items-center gap-2 px-3 py-1 ${isEnabled ? 'hover:bg-accent-background cursor-pointer' : 'opacity-50 pointer-events-none'}`,
+        onClick: ()=>{
+            if (isEnabled) command.invoke();
+        },
+        children: [
+            /*#__PURE__*/ _jsx(Checkbox, {
+                id: id,
+                checked: isChecked,
+                disabled: !isEnabled,
+                className: "pointer-events-none"
+            }),
+            /*#__PURE__*/ _jsx(Label, {
+                htmlFor: id,
+                className: "flex-1 truncate cursor-pointer text-sm pointer-events-none",
+                children: command.label
+            }),
+            command.color !== undefined && /*#__PURE__*/ _jsx("div", {
+                className: "size-4 shrink-0 rounded-sm",
+                style: {
+                    backgroundColor: command.color.getStyle()
+                }
+            })
+        ]
+    });
 };
-//#endregion
-export { o as FilterItem };
+
+//# sourceMappingURL=FilterItem.js.map

package/dist/ui/components/commandBased/buttons/FilterItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/buttons/FilterItem.tsx"],"sourcesContent":["import { type ReactElement } from 'react';\n\nimport { CheckboxItemControl as Checkbox } from '@cognite/aura/components/checkbox';\nimport { Label } from '@cognite/aura/components/label';\n\nimport { type BaseFilterItemCommand } from '../../../../foundation/commands/BaseFilterCommand';\nimport { useCommandProps } from '../hooks/useCommandProps';\n\nexport const FilterItem = ({\n  command,\n}: {\n  command: BaseFilterItemCommand;\n}): ReactElement => {\n  const { uniqueId, isVisible, isEnabled, isChecked } =\n    useCommandProps(command);\n  if (!isVisible) {\n    return <></>;\n  }\n  const id = `filter-item-${uniqueId}`;\n\n  return (\n    <div\n      className={`flex items-center gap-2 px-3 py-1 ${\n        isEnabled\n          ? 'hover:bg-accent-background cursor-pointer'\n          : 'opacity-50 pointer-events-none'\n      }`}\n      onClick={() => {\n        if (isEnabled) command.invoke();\n      }}\n    >\n      <Checkbox\n        id={id}\n        checked={isChecked}\n        disabled={!isEnabled}\n        className=\"pointer-events-none\"\n      />\n      <Label\n        htmlFor={id}\n        className=\"flex-1 truncate cursor-pointer text-sm pointer-events-none\"\n      >\n        {command.label}\n      </Label>\n      {command.color !== undefined && (\n        <div\n          className=\"size-4 shrink-0 rounded-sm\"\n          style={{ backgroundColor: command.color.getStyle() }}\n        />\n      )}\n    </div>\n  );\n};\n"],"names":["CheckboxItemControl","Checkbox","Label","useCommandProps","FilterItem","command","uniqueId","isVisible","isEnabled","isChecked","id","div","className","onClick","invoke","checked","disabled","htmlFor","label","color","undefined","style","backgroundColor","getStyle"],"mappings":";AAEA,SAASA,uBAAuBC,QAAQ,QAAQ,oCAAoC;AACpF,SAASC,KAAK,QAAQ,iCAAiC;AAGvD,SAASC,eAAe,QAAQ,8BAA2B;AAE3D,OAAO,MAAMC,aAAa,CAAC,EACzBC,OAAO,EAGR;IACC,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAEC,SAAS,EAAE,GACjDN,gBAAgBE;IAClB,IAAI,CAACE,WAAW;QACd,qBAAO;IACT;IACA,MAAMG,KAAK,CAAC,YAAY,EAAEJ,UAAU;IAEpC,qBACE,MAACK;QACCC,WAAW,CAAC,kCAAkC,EAC5CJ,YACI,8CACA,kCACJ;QACFK,SAAS;YACP,IAAIL,WAAWH,QAAQS,MAAM;QAC/B;;0BAEA,KAACb;gBACCS,IAAIA;gBACJK,SAASN;gBACTO,UAAU,CAACR;gBACXI,WAAU;;0BAEZ,KAACV;gBACCe,SAASP;gBACTE,WAAU;0BAETP,QAAQa,KAAK;;YAEfb,QAAQc,KAAK,KAAKC,2BACjB,KAACT;gBACCC,WAAU;gBACVS,OAAO;oBAAEC,iBAAiBjB,QAAQc,KAAK,CAACI,QAAQ;gBAAG;;;;AAK7D,EAAE"}

package/dist/ui/components/commandBased/buttons/HelpButton.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
-import { BaseCommand } from '../../../../domains';
-import { PlacementType } from '../utils/types';
+import { type ReactElement } from "react";
+import { type BaseCommand } from "../../../../domains";
+import type { PlacementType } from "../utils/types";
 export declare function createHelpButton(command: BaseCommand, placement: PlacementType): ReactElement | undefined;

package/dist/ui/components/commandBased/buttons/HelpButton.js

@@ -1,55 +1,76 @@
-import { useCommand as e } from "../hooks/useCommand.js";
-import { useCommandProps as t } from "../hooks/useCommandProps.js";
-import { LabelWithShortcut as n } from "../utils/LabelWithShortcut.js";
-import { CommandButtonInner as r } from "./CommandButtonInner.js";
-import { HelpCommand as i } from "../../../../foundation/concreteCommands/general/HelpCommand.js";
-import { KeyboardNavigation as a } from "../../RevealToolbar/Help/KeyboardNavigation.js";
-import { MouseNavigation as o } from "../../RevealToolbar/Help/MouseNavigation.js";
-import { TouchNavigation as s } from "../../RevealToolbar/Help/TouchNavigation.js";
-import { BaseTooltipTrigger as c, CommandTooltipPopup as l, useCommandTooltipHandle as u } from "./PopupTriggerButton.js";
-import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
-import { Popover as m, PopoverContent as h, PopoverTrigger as g } from "@cognite/aura/components/popover";
-import { useSignalValue as _ } from "@cognite/signal-utils/react";
-//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/HelpButton.tsx
-function v(e, t) {
-	if (e instanceof i) return /* @__PURE__ */ f(y, {
-		inputCommand: e,
-		placement: t
-	}, e.uniqueId);
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Popover, PopoverContent, PopoverTrigger } from "@cognite/aura/components/popover";
+import { useSignalValue } from "@cognite/signal-utils/react";
+import { HelpCommand } from "../../../../foundation/concreteCommands/general/HelpCommand.js";
+import { TOOLBAR_HORIZONTAL_PANEL_OFFSET } from "../../constants.js";
+import { KeyboardNavigation } from "../../RevealToolbar/Help/KeyboardNavigation.js";
+import { MouseNavigation } from "../../RevealToolbar/Help/MouseNavigation.js";
+import { TouchNavigation } from "../../RevealToolbar/Help/TouchNavigation.js";
+import { useCommand } from "../hooks/useCommand.js";
+import { useCommandProps } from "../hooks/useCommandProps.js";
+import { LabelWithShortcut } from "../utils/LabelWithShortcut.js";
+import { CommandButtonInner } from "./CommandButtonInner.js";
+import { BaseTooltipTrigger, CommandTooltipPopup, useCommandTooltipHandle } from "./PopupTriggerButton.js";
+export function createHelpButton(command, placement) {
+    if (command instanceof HelpCommand) {
+        return /*#__PURE__*/ _jsx(HelpButton, {
+            inputCommand: command,
+            placement: placement
+        }, command.uniqueId);
+    }
+    return undefined;
 }
-var y = ({ inputCommand: i, placement: v }) => {
-	let y = e(i), b = _(y.isOpen), { isVisible: x } = t(y), S = u();
-	return x ? /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ p(m, {
-		open: b,
-		onOpenChange: (e) => {
-			y.isOpen(e);
-		},
-		children: [/* @__PURE__ */ f(g, { render: /* @__PURE__ */ f(c, {
-			handle: S,
-			render: /* @__PURE__ */ f(r, { inputCommand: i })
-		}) }), /* @__PURE__ */ f(h, {
-			side: v,
-			align: "end",
-			sideOffset: 12,
-			className: "p-0 w-max overflow-hidden",
-			children: /* @__PURE__ */ p("div", {
-				className: "flex flex-col gap-6 p-4 max-h-[20vw] overflow-y-auto bg-[#516efa]",
-				children: [
-					/* @__PURE__ */ f(o, {}),
-					/* @__PURE__ */ f(a, {}),
-					/* @__PURE__ */ f(s, {})
-				]
-			})
-		})]
-	}), /* @__PURE__ */ f(l, {
-		handle: S,
-		side: v,
-		disabled: b,
-		children: /* @__PURE__ */ f(n, {
-			label: y.label,
-			command: y
-		})
-	})] }) : /* @__PURE__ */ f(d, {});
+const HelpButton = ({ inputCommand, placement })=>{
+    const command = useCommand(inputCommand);
+    const isOpen = useSignalValue(command.isOpen);
+    const { isVisible } = useCommandProps(command);
+    const tooltipHandle = useCommandTooltipHandle();
+    if (!isVisible) {
+        return /*#__PURE__*/ _jsx(_Fragment, {});
+    }
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsxs(Popover, {
+                open: isOpen,
+                onOpenChange: (open)=>{
+                    command.isOpen(open);
+                },
+                children: [
+                    /*#__PURE__*/ _jsx(PopoverTrigger, {
+                        render: /*#__PURE__*/ _jsx(BaseTooltipTrigger, {
+                            handle: tooltipHandle,
+                            render: /*#__PURE__*/ _jsx(CommandButtonInner, {
+                                inputCommand: inputCommand
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(PopoverContent, {
+                        side: placement,
+                        align: "end",
+                        sideOffset: TOOLBAR_HORIZONTAL_PANEL_OFFSET,
+                        className: "p-0 w-max overflow-hidden",
+                        children: /*#__PURE__*/ _jsxs("div", {
+                            className: "flex flex-col gap-6 p-4 max-h-[20vw] overflow-y-auto bg-[#516efa]",
+                            children: [
+                                /*#__PURE__*/ _jsx(MouseNavigation, {}),
+                                /*#__PURE__*/ _jsx(KeyboardNavigation, {}),
+                                /*#__PURE__*/ _jsx(TouchNavigation, {})
+                            ]
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx(CommandTooltipPopup, {
+                handle: tooltipHandle,
+                side: placement,
+                disabled: isOpen,
+                children: /*#__PURE__*/ _jsx(LabelWithShortcut, {
+                    label: command.label,
+                    command: command
+                })
+            })
+        ]
+    });
 };
-//#endregion
-export { v as createHelpButton };
+
+//# sourceMappingURL=HelpButton.js.map

package/dist/ui/components/commandBased/buttons/HelpButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/buttons/HelpButton.tsx"],"sourcesContent":["import { type ReactElement } from 'react';\n\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '@cognite/aura/components/popover';\nimport { useSignalValue } from '@cognite/signal-utils/react';\n\nimport { type BaseCommand } from '../../../../domains';\nimport { HelpCommand } from '../../../../foundation/concreteCommands/general/HelpCommand';\nimport { TOOLBAR_HORIZONTAL_PANEL_OFFSET } from '../../constants';\nimport { KeyboardNavigation } from '../../RevealToolbar/Help/KeyboardNavigation';\nimport { MouseNavigation } from '../../RevealToolbar/Help/MouseNavigation';\nimport { TouchNavigation } from '../../RevealToolbar/Help/TouchNavigation';\nimport { useCommand } from '../hooks/useCommand';\nimport { useCommandProps } from '../hooks/useCommandProps';\nimport { LabelWithShortcut } from '../utils/LabelWithShortcut';\nimport type { PlacementType } from '../utils/types';\n\nimport { CommandButtonInner } from './CommandButtonInner';\nimport {\n  BaseTooltipTrigger,\n  CommandTooltipPopup,\n  useCommandTooltipHandle,\n} from './PopupTriggerButton';\n\nexport function createHelpButton(\n  command: BaseCommand,\n  placement: PlacementType\n): ReactElement | undefined {\n  if (command instanceof HelpCommand) {\n    return (\n      <HelpButton\n        key={command.uniqueId}\n        inputCommand={command}\n        placement={placement}\n      />\n    );\n  }\n  return undefined;\n}\n\nconst HelpButton = ({\n  inputCommand,\n  placement,\n}: {\n  inputCommand: HelpCommand;\n  placement: PlacementType;\n}): ReactElement => {\n  const command = useCommand(inputCommand);\n  const isOpen = useSignalValue(command.isOpen);\n  const { isVisible } = useCommandProps(command);\n  const tooltipHandle = useCommandTooltipHandle();\n\n  if (!isVisible) {\n    return <></>;\n  }\n\n  return (\n    <>\n      <Popover\n        open={isOpen}\n        onOpenChange={(open) => {\n          command.isOpen(open);\n        }}\n      >\n        <PopoverTrigger\n          render={\n            <BaseTooltipTrigger\n              handle={tooltipHandle}\n              render={<CommandButtonInner inputCommand={inputCommand} />}\n            />\n          }\n        />\n        <PopoverContent\n          side={placement}\n          align=\"end\"\n          sideOffset={TOOLBAR_HORIZONTAL_PANEL_OFFSET}\n          className=\"p-0 w-max overflow-hidden\"\n        >\n          <div className=\"flex flex-col gap-6 p-4 max-h-[20vw] overflow-y-auto bg-[#516efa]\">\n            <MouseNavigation />\n            <KeyboardNavigation />\n            <TouchNavigation />\n          </div>\n        </PopoverContent>\n      </Popover>\n      <CommandTooltipPopup\n        handle={tooltipHandle}\n        side={placement}\n        disabled={isOpen}\n      >\n        <LabelWithShortcut label={command.label} command={command} />\n      </CommandTooltipPopup>\n    </>\n  );\n};\n"],"names":["Popover","PopoverContent","PopoverTrigger","useSignalValue","HelpCommand","TOOLBAR_HORIZONTAL_PANEL_OFFSET","KeyboardNavigation","MouseNavigation","TouchNavigation","useCommand","useCommandProps","LabelWithShortcut","CommandButtonInner","BaseTooltipTrigger","CommandTooltipPopup","useCommandTooltipHandle","createHelpButton","command","placement","HelpButton","inputCommand","uniqueId","undefined","isOpen","isVisible","tooltipHandle","open","onOpenChange","render","handle","side","align","sideOffset","className","div","disabled","label"],"mappings":";AAEA,SACEA,OAAO,EACPC,cAAc,EACdC,cAAc,QACT,mCAAmC;AAC1C,SAASC,cAAc,QAAQ,8BAA8B;AAG7D,SAASC,WAAW,QAAQ,iEAA8D;AAC1F,SAASC,+BAA+B,QAAQ,qBAAkB;AAClE,SAASC,kBAAkB,QAAQ,iDAA8C;AACjF,SAASC,eAAe,QAAQ,8CAA2C;AAC3E,SAASC,eAAe,QAAQ,8CAA2C;AAC3E,SAASC,UAAU,QAAQ,yBAAsB;AACjD,SAASC,eAAe,QAAQ,8BAA2B;AAC3D,SAASC,iBAAiB,QAAQ,gCAA6B;AAG/D,SAASC,kBAAkB,QAAQ,0BAAuB;AAC1D,SACEC,kBAAkB,EAClBC,mBAAmB,EACnBC,uBAAuB,QAClB,0BAAuB;AAE9B,OAAO,SAASC,iBACdC,OAAoB,EACpBC,SAAwB;IAExB,IAAID,mBAAmBb,aAAa;QAClC,qBACE,KAACe;YAECC,cAAcH;YACdC,WAAWA;WAFND,QAAQI,QAAQ;IAK3B;IACA,OAAOC;AACT;AAEA,MAAMH,aAAa,CAAC,EAClBC,YAAY,EACZF,SAAS,EAIV;IACC,MAAMD,UAAUR,WAAWW;IAC3B,MAAMG,SAASpB,eAAec,QAAQM,MAAM;IAC5C,MAAM,EAAEC,SAAS,EAAE,GAAGd,gBAAgBO;IACtC,MAAMQ,gBAAgBV;IAEtB,IAAI,CAACS,WAAW;QACd,qBAAO;IACT;IAEA,qBACE;;0BACE,MAACxB;gBACC0B,MAAMH;gBACNI,cAAc,CAACD;oBACbT,QAAQM,MAAM,CAACG;gBACjB;;kCAEA,KAACxB;wBACC0B,sBACE,KAACf;4BACCgB,QAAQJ;4BACRG,sBAAQ,KAAChB;gCAAmBQ,cAAcA;;;;kCAIhD,KAACnB;wBACC6B,MAAMZ;wBACNa,OAAM;wBACNC,YAAY3B;wBACZ4B,WAAU;kCAEV,cAAA,MAACC;4BAAID,WAAU;;8CACb,KAAC1B;8CACD,KAACD;8CACD,KAACE;;;;;;0BAIP,KAACM;gBACCe,QAAQJ;gBACRK,MAAMZ;gBACNiB,UAAUZ;0BAEV,cAAA,KAACZ;oBAAkByB,OAAOnB,QAAQmB,KAAK;oBAAEnB,SAASA;;;;;AAI1D"}

package/dist/ui/components/commandBased/buttons/InputField.d.ts

@@ -1,8 +1,8 @@
-import { ReactElement, ReactNode } from 'react';
-import { BaseCommand } from '../../../../domains';
-import { BaseInputCommand } from '../../../../foundation/commands/BaseInputCommand';
-import { PlacementType } from '../utils/types';
+import { type ReactElement, type ReactNode } from "react";
+import { type BaseCommand } from "../../../../domains";
+import { BaseInputCommand } from "../../../../foundation/commands/BaseInputCommand";
+import { type PlacementType } from "../utils/types";
 export declare function createInputField(command: BaseCommand, _: PlacementType): ReactElement | undefined;
-export declare const InputField: ({ inputCommand, }: {
-    inputCommand: BaseInputCommand;
+export declare const InputField: ({ inputCommand }: {
+	inputCommand: BaseInputCommand;
 }) => ReactNode;

package/dist/ui/components/commandBased/buttons/InputField.js

@@ -1,30 +1,44 @@
-import { translateIfExists as e } from "../../../../foundation/utilities/translation/translateUtils.js";
-import { useCommand as t } from "../hooks/useCommand.js";
-import { useCommandProperty as n } from "../hooks/useCommandProperty.js";
-import { useCommandProps as r } from "../hooks/useCommandProps.js";
-import { Comment as i } from "../main/Comment.js";
-import { BaseInputCommand as a } from "../../../../foundation/commands/BaseInputCommand.js";
-import { Fragment as o, jsx as s } from "react/jsx-runtime";
-//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/InputField.tsx
-function c(e, t) {
-	if (e instanceof a) return /* @__PURE__ */ s(l, { inputCommand: e }, e.uniqueId);
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { BaseInputCommand } from "../../../../foundation/commands/BaseInputCommand.js";
+import { translateIfExists } from "../../../../foundation/utilities/translation/translateUtils.js";
+import { useCommand } from "../hooks/useCommand.js";
+import { useCommandProperty } from "../hooks/useCommandProperty.js";
+import { useCommandProps } from "../hooks/useCommandProps.js";
+import { Comment } from "../main/Comment.js";
+export function createInputField(command, _) {
+    if (command instanceof BaseInputCommand) {
+        return /*#__PURE__*/ _jsx(InputField, {
+            inputCommand: command
+        }, command.uniqueId);
+    }
+    return undefined;
 }
-var l = ({ inputCommand: a }) => {
-	let c = t(a), l = n(c, () => c.content), u = n(c, () => e(c.getPostButtonLabel())), d = n(c, () => e(c.getCancelButtonLabel())), f = n(c, () => e(c.getPlaceholder())), p = n(c, () => c.isPostButtonEnabled), { uniqueId: m, isVisible: h, isEnabled: g } = r(c);
-	return h ? /* @__PURE__ */ s(i, {
-		placeholder: f,
-		message: l,
-		setMessage: (e) => c.content = e,
-		onPostMessage: () => {
-			c.invoke(), c.content = "";
-		},
-		postButtonText: u,
-		postButtonDisabled: !(p && g),
-		cancelButtonText: d,
-		cancelButtonDisabled: !1,
-		onCancel: c.onCancel,
-		showButtons: !0
-	}, m) : /* @__PURE__ */ s(o, {});
+export const InputField = ({ inputCommand })=>{
+    const command = useCommand(inputCommand);
+    const content = useCommandProperty(command, ()=>command.content);
+    const postLabel = useCommandProperty(command, ()=>translateIfExists(command.getPostButtonLabel()));
+    const cancelLabel = useCommandProperty(command, ()=>translateIfExists(command.getCancelButtonLabel()));
+    const placeholder = useCommandProperty(command, ()=>translateIfExists(command.getPlaceholder()));
+    const isPostButtonEnabled = useCommandProperty(command, ()=>command.isPostButtonEnabled);
+    const { uniqueId, isVisible, isEnabled } = useCommandProps(command);
+    if (!isVisible) {
+        return /*#__PURE__*/ _jsx(_Fragment, {});
+    }
+    return /*#__PURE__*/ _jsx(Comment, {
+        placeholder: placeholder,
+        message: content,
+        setMessage: (content)=>command.content = content,
+        onPostMessage: ()=>{
+            command.invoke();
+            command.content = '';
+        },
+        postButtonText: postLabel,
+        postButtonDisabled: !(isPostButtonEnabled && isEnabled),
+        cancelButtonText: cancelLabel,
+        cancelButtonDisabled: false,
+        onCancel: command.onCancel,
+        showButtons: true
+    }, uniqueId);
 };
-//#endregion
-export { l as InputField, c as createInputField };
+
+//# sourceMappingURL=InputField.js.map

package/dist/ui/components/commandBased/buttons/InputField.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/buttons/InputField.tsx"],"sourcesContent":["import { type ReactElement, type ReactNode } from 'react';\n\nimport { type BaseCommand } from '../../../../domains';\nimport { BaseInputCommand } from '../../../../foundation/commands/BaseInputCommand';\nimport { translateIfExists } from '../../../../foundation/utilities/translation/translateUtils';\nimport { useCommand } from '../hooks/useCommand';\nimport { useCommandProperty } from '../hooks/useCommandProperty';\nimport { useCommandProps } from '../hooks/useCommandProps';\nimport { Comment } from '../main/Comment';\nimport { type PlacementType } from '../utils/types';\n\nexport function createInputField(\n  command: BaseCommand,\n  _: PlacementType\n): ReactElement | undefined {\n  if (command instanceof BaseInputCommand) {\n    return <InputField key={command.uniqueId} inputCommand={command} />;\n  }\n  return undefined;\n}\n\nexport const InputField = ({\n  inputCommand,\n}: {\n  inputCommand: BaseInputCommand;\n}): ReactNode => {\n  const command = useCommand(inputCommand);\n\n  const content = useCommandProperty(command, () => command.content);\n  const postLabel = useCommandProperty(command, () =>\n    translateIfExists(command.getPostButtonLabel())\n  );\n  const cancelLabel = useCommandProperty(command, () =>\n    translateIfExists(command.getCancelButtonLabel())\n  );\n  const placeholder = useCommandProperty(command, () =>\n    translateIfExists(command.getPlaceholder())\n  );\n  const isPostButtonEnabled = useCommandProperty(\n    command,\n    () => command.isPostButtonEnabled\n  );\n\n  const { uniqueId, isVisible, isEnabled } = useCommandProps(command);\n\n  if (!isVisible) {\n    return <></>;\n  }\n\n  return (\n    <Comment\n      key={uniqueId}\n      placeholder={placeholder}\n      message={content}\n      setMessage={(content) => (command.content = content)}\n      onPostMessage={() => {\n        command.invoke();\n        command.content = '';\n      }}\n      postButtonText={postLabel}\n      postButtonDisabled={!(isPostButtonEnabled && isEnabled)}\n      cancelButtonText={cancelLabel}\n      cancelButtonDisabled={false}\n      onCancel={command.onCancel}\n      showButtons={true}\n    />\n  );\n};\n"],"names":["BaseInputCommand","translateIfExists","useCommand","useCommandProperty","useCommandProps","Comment","createInputField","command","_","InputField","inputCommand","uniqueId","undefined","content","postLabel","getPostButtonLabel","cancelLabel","getCancelButtonLabel","placeholder","getPlaceholder","isPostButtonEnabled","isVisible","isEnabled","message","setMessage","onPostMessage","invoke","postButtonText","postButtonDisabled","cancelButtonText","cancelButtonDisabled","onCancel","showButtons"],"mappings":";AAGA,SAASA,gBAAgB,QAAQ,sDAAmD;AACpF,SAASC,iBAAiB,QAAQ,iEAA8D;AAChG,SAASC,UAAU,QAAQ,yBAAsB;AACjD,SAASC,kBAAkB,QAAQ,iCAA8B;AACjE,SAASC,eAAe,QAAQ,8BAA2B;AAC3D,SAASC,OAAO,QAAQ,qBAAkB;AAG1C,OAAO,SAASC,iBACdC,OAAoB,EACpBC,CAAgB;IAEhB,IAAID,mBAAmBP,kBAAkB;QACvC,qBAAO,KAACS;YAAkCC,cAAcH;WAAhCA,QAAQI,QAAQ;IAC1C;IACA,OAAOC;AACT;AAEA,OAAO,MAAMH,aAAa,CAAC,EACzBC,YAAY,EAGb;IACC,MAAMH,UAAUL,WAAWQ;IAE3B,MAAMG,UAAUV,mBAAmBI,SAAS,IAAMA,QAAQM,OAAO;IACjE,MAAMC,YAAYX,mBAAmBI,SAAS,IAC5CN,kBAAkBM,QAAQQ,kBAAkB;IAE9C,MAAMC,cAAcb,mBAAmBI,SAAS,IAC9CN,kBAAkBM,QAAQU,oBAAoB;IAEhD,MAAMC,cAAcf,mBAAmBI,SAAS,IAC9CN,kBAAkBM,QAAQY,cAAc;IAE1C,MAAMC,sBAAsBjB,mBAC1BI,SACA,IAAMA,QAAQa,mBAAmB;IAGnC,MAAM,EAAET,QAAQ,EAAEU,SAAS,EAAEC,SAAS,EAAE,GAAGlB,gBAAgBG;IAE3D,IAAI,CAACc,WAAW;QACd,qBAAO;IACT;IAEA,qBACE,KAAChB;QAECa,aAAaA;QACbK,SAASV;QACTW,YAAY,CAACX,UAAaN,QAAQM,OAAO,GAAGA;QAC5CY,eAAe;YACblB,QAAQmB,MAAM;YACdnB,QAAQM,OAAO,GAAG;QACpB;QACAc,gBAAgBb;QAChBc,oBAAoB,CAAER,CAAAA,uBAAuBE,SAAQ;QACrDO,kBAAkBb;QAClBc,sBAAsB;QACtBC,UAAUxB,QAAQwB,QAAQ;QAC1BC,aAAa;OAbRrB;AAgBX,EAAE"}

package/dist/ui/components/commandBased/buttons/PopupTriggerButton.d.ts

@@ -1,25 +1,25 @@
-import { ReactNode } from 'react';
-import { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';
-import { PlacementType } from '../utils/types';
+import { type ReactNode } from "react";
+import { Tooltip as BaseTooltip } from "@base-ui/react/tooltip";
+import type { PlacementType } from "../utils/types";
 export type CommandTooltipHandle = ReturnType<typeof BaseTooltip.createHandle>;
 /**
- * Re-exported so popup buttons can import the Base UI Trigger without knowing
- * the internal module path.
- */
+* Re-exported so popup buttons can import the Base UI Trigger without knowing
+* the internal module path.
+*/
 export declare const BaseTooltipTrigger: BaseTooltip.Trigger;
 /**
- * Creates a Base UI tooltip handle for decoupled tooltip ↔ trigger wiring.
- * Use with `BaseTooltipTrigger` in the trigger render prop and
- * `CommandTooltipPopup` as a sibling.
- */
+* Creates a Base UI tooltip handle for decoupled tooltip ↔ trigger wiring.
+* Use with `BaseTooltipTrigger` in the trigger render prop and
+* `CommandTooltipPopup` as a sibling.
+*/
 export declare function useCommandTooltipHandle(): CommandTooltipHandle;
 /**
- * The decoupled tooltip popup, linked to its trigger purely by `handle`.
- * Render as a sibling of the Popover/DropdownMenu, NOT inside the trigger.
- */
-export declare const CommandTooltipPopup: ({ handle, side, disabled, children, }: {
-    handle: CommandTooltipHandle;
-    side: PlacementType;
-    disabled?: boolean;
-    children: ReactNode;
+* The decoupled tooltip popup, linked to its trigger purely by `handle`.
+* Render as a sibling of the Popover/DropdownMenu, NOT inside the trigger.
+*/
+export declare const CommandTooltipPopup: ({ handle, side, disabled, children }: {
+	handle: CommandTooltipHandle;
+	side: PlacementType;
+	disabled?: boolean;
+	children: ReactNode;
 }) => ReactNode;

package/dist/ui/components/commandBased/buttons/PopupTriggerButton.js

@@ -1,21 +1,40 @@
-import { useMemo as e } from "react";
-import { jsx as t } from "react/jsx-runtime";
-import { Tooltip as n, TooltipContent as r, TooltipProvider as i } from "@cognite/aura/components/tooltip";
-import { Tooltip as a } from "@base-ui/react/tooltip";
-//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/PopupTriggerButton.tsx
-var o = a.Trigger;
-function s() {
-	return e(() => a.createHandle(), []);
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+// Use raw Base UI tooltip primitives — NOT Aura's TooltipTrigger wrapper.
+// Aura's TooltipTrigger is forwardRef<HTMLButtonElement> which causes focus /
+// event conflicts when nested inside another Base UI trigger (DropdownMenu /
+// Popover). Using the primitive directly (as apps/paia does) avoids this.
+import { Tooltip as BaseTooltip } from "@base-ui/react/tooltip";
+import { Tooltip, TooltipContent, TooltipProvider } from "@cognite/aura/components/tooltip";
+import { TOOLTIP_DELAY } from "../utils/constants.js";
+/**
+ * Re-exported so popup buttons can import the Base UI Trigger without knowing
+ * the internal module path.
+ */ export const BaseTooltipTrigger = BaseTooltip.Trigger;
+/**
+ * Creates a Base UI tooltip handle for decoupled tooltip ↔ trigger wiring.
+ * Use with `BaseTooltipTrigger` in the trigger render prop and
+ * `CommandTooltipPopup` as a sibling.
+ */ export function useCommandTooltipHandle() {
+    return useMemo(()=>BaseTooltip.createHandle(), []);
 }
-var c = ({ handle: e, side: a, disabled: o = !1, children: s }) => o ? null : /* @__PURE__ */ t(i, {
-	delayDuration: 500,
-	children: /* @__PURE__ */ t(n, {
-		handle: e,
-		children: /* @__PURE__ */ t(r, {
-			side: a,
-			children: s
-		})
-	})
-});
-//#endregion
-export { o as BaseTooltipTrigger, c as CommandTooltipPopup, s as useCommandTooltipHandle };
+/**
+ * The decoupled tooltip popup, linked to its trigger purely by `handle`.
+ * Render as a sibling of the Popover/DropdownMenu, NOT inside the trigger.
+ */ export const CommandTooltipPopup = ({ handle, side, disabled = false, children })=>{
+    if (disabled) {
+        return null;
+    }
+    return /*#__PURE__*/ _jsx(TooltipProvider, {
+        delayDuration: TOOLTIP_DELAY,
+        children: /*#__PURE__*/ _jsx(Tooltip, {
+            handle: handle,
+            children: /*#__PURE__*/ _jsx(TooltipContent, {
+                side: side,
+                children: children
+            })
+        })
+    });
+};
+
+//# sourceMappingURL=PopupTriggerButton.js.map

package/dist/ui/components/commandBased/buttons/PopupTriggerButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ui/components/commandBased/buttons/PopupTriggerButton.tsx"],"sourcesContent":["import { type ReactNode, useMemo } from 'react';\n\n// Use raw Base UI tooltip primitives — NOT Aura's TooltipTrigger wrapper.\n// Aura's TooltipTrigger is forwardRef<HTMLButtonElement> which causes focus /\n// event conflicts when nested inside another Base UI trigger (DropdownMenu /\n// Popover). Using the primitive directly (as apps/paia does) avoids this.\nimport { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';\n\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n} from '@cognite/aura/components/tooltip';\n\nimport { TOOLTIP_DELAY } from '../utils/constants';\nimport type { PlacementType } from '../utils/types';\n\nexport type CommandTooltipHandle = ReturnType<typeof BaseTooltip.createHandle>;\n\n/**\n * Re-exported so popup buttons can import the Base UI Trigger without knowing\n * the internal module path.\n */\nexport const BaseTooltipTrigger: BaseTooltip.Trigger = BaseTooltip.Trigger;\n\n/**\n * Creates a Base UI tooltip handle for decoupled tooltip ↔ trigger wiring.\n * Use with `BaseTooltipTrigger` in the trigger render prop and\n * `CommandTooltipPopup` as a sibling.\n */\nexport function useCommandTooltipHandle(): CommandTooltipHandle {\n  return useMemo(() => BaseTooltip.createHandle(), []);\n}\n\n/**\n * The decoupled tooltip popup, linked to its trigger purely by `handle`.\n * Render as a sibling of the Popover/DropdownMenu, NOT inside the trigger.\n */\nexport const CommandTooltipPopup = ({\n  handle,\n  side,\n  disabled = false,\n  children,\n}: {\n  handle: CommandTooltipHandle;\n  side: PlacementType;\n  disabled?: boolean;\n  children: ReactNode;\n}): ReactNode => {\n  if (disabled) {\n    return null;\n  }\n  return (\n    <TooltipProvider delayDuration={TOOLTIP_DELAY}>\n      <Tooltip handle={handle}>\n        <TooltipContent side={side}>{children}</TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n"],"names":["useMemo","Tooltip","BaseTooltip","TooltipContent","TooltipProvider","TOOLTIP_DELAY","BaseTooltipTrigger","Trigger","useCommandTooltipHandle","createHandle","CommandTooltipPopup","handle","side","disabled","children","delayDuration"],"mappings":";AAAA,SAAyBA,OAAO,QAAQ,QAAQ;AAEhD,0EAA0E;AAC1E,8EAA8E;AAC9E,6EAA6E;AAC7E,0EAA0E;AAC1E,SAASC,WAAWC,WAAW,QAAQ,yBAAyB;AAEhE,SACED,OAAO,EACPE,cAAc,EACdC,eAAe,QACV,mCAAmC;AAE1C,SAASC,aAAa,QAAQ,wBAAqB;AAKnD;;;CAGC,GACD,OAAO,MAAMC,qBAA0CJ,YAAYK,OAAO,CAAC;AAE3E;;;;CAIC,GACD,OAAO,SAASC;IACd,OAAOR,QAAQ,IAAME,YAAYO,YAAY,IAAI,EAAE;AACrD;AAEA;;;CAGC,GACD,OAAO,MAAMC,sBAAsB,CAAC,EAClCC,MAAM,EACNC,IAAI,EACJC,WAAW,KAAK,EAChBC,QAAQ,EAMT;IACC,IAAID,UAAU;QACZ,OAAO;IACT;IACA,qBACE,KAACT;QAAgBW,eAAeV;kBAC9B,cAAA,KAACJ;YAAQU,QAAQA;sBACf,cAAA,KAACR;gBAAeS,MAAMA;0BAAOE;;;;AAIrC,EAAE"}

package/dist/ui/components/commandBased/buttons/SegmentedButtons.d.ts

@@ -1,10 +1,10 @@
-import { ReactElement } from 'react';
-import { BaseCommand } from '../../../../domains';
-import { BaseOptionCommand } from '../../../../foundation/commands/BaseOptionCommand';
-import { PlacementType } from '../utils/types';
+import { type ReactElement } from "react";
+import { type BaseCommand } from "../../../../domains";
+import { BaseOptionCommand } from "../../../../foundation/commands/BaseOptionCommand";
+import { type PlacementType } from "../utils/types";
 export declare function createSegmentedButtons(command: BaseCommand, placement: PlacementType): ReactElement | undefined;
-export declare const SegmentedButtons: ({ inputCommand, placement, fullWidth, }: {
-    inputCommand: BaseOptionCommand;
-    placement: PlacementType;
-    fullWidth?: boolean;
+export declare const SegmentedButtons: ({ inputCommand, placement, fullWidth }: {
+	inputCommand: BaseOptionCommand;
+	placement: PlacementType;
+	fullWidth?: boolean;
 }) => ReactElement;