@cube-dev/ui-kit 0.162.0 → 0.164.0

package/dist/components/content/Avatar/Avatar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { CONTAINER_STYLES, Element, filterBaseProps } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Badge/Badge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { _Item } from "../Item/Item.js";
 import themes_default from "../../../data/themes.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Card/Card.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Content.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useTimer } from "../../../_internal/hooks/use-timer/use-timer.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/content/CopySnippet/CopySnippet.d.ts

@@ -18,6 +18,16 @@ interface CubeCopySnippetProps extends CubeCardProps {
   title?: string;
   /** Whether the snippet is single-lined */
   nowrap?: boolean;
+  /**
+   * Soft-wrap long content onto multiple lines instead of scrolling it
+   * horizontally. The block grows vertically to fit (so even a single long line
+   * is fully readable rather than clamped), and unbreakable runs like URLs,
+   * tokens and identifiers wrap too. Useful for error messages and logs.
+   * Has no effect when `nowrap` is set. Note this is a different axis from
+   * `nowrap`: `nowrap` collapses real newlines into one scrolling line, while
+   * `isWrapped` breaks long lines that would otherwise scroll.
+   */
+  isWrapped?: boolean;
   /** The prefix for each line of code. Useful for bash snippets. */
   prefix?: string;
   /** The code language of the snippet */

package/dist/components/content/CopySnippet/CopySnippet.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { _Tooltip } from "../../overlays/Tooltip/Tooltip.js";
 import { TooltipTrigger } from "../../overlays/Tooltip/TooltipTrigger.js";
 import { useI18n } from "../../../i18n/useI18n.js";
@@ -132,7 +132,7 @@ function replaceSymbolsToHidden(str) {
 }
 function CopySnippet(allProps) {
 	const { t } = useI18n();
-	const { code = "", title = t("copySnippet.title", "Code example"), nowrap, prefix = "", language, serif, actions, showTooltip = false, hideText, ...props } = allProps;
+	const { code = "", title = t("copySnippet.title", "Code example"), nowrap, isWrapped, prefix = "", language, serif, actions, showTooltip = false, hideText, ...props } = allProps;
 	const toast = useToast();
 	const [showHidden, setShowHidden] = useState(false);
 	async function onCopy() {
@@ -141,6 +141,7 @@ function CopySnippet(allProps) {
 	}
 	const pristineCode = code.replace(/\n$/, "");
 	const multiline = pristineCode.includes("\n") && !nowrap;
+	const shouldWrap = !!isWrapped && !nowrap;
 	let formattedCode = pristineCode.replace(/\r/g, "").split(/\n/g).map((line) => `${prefix}${line}`).join("\n").trim();
 	if (!showHidden) {
 		if (hideText === true) formattedCode = replaceSymbolsToHidden(formattedCode);
@@ -152,13 +153,14 @@ function CopySnippet(allProps) {
 	const mods = useMemo(() => {
 		return {
 			nowrap,
-			multiline,
+			multiline: multiline || shouldWrap,
 			serif,
 			hidden: !!hideText
 		};
 	}, [
 		nowrap,
 		multiline,
+		shouldWrap,
 		hideText,
 		serif
 	]);
@@ -175,7 +177,8 @@ function CopySnippet(allProps) {
 						overflow: "visible"
 					},
 					code: formattedCode,
-					language: language || "javascript"
+					language: language || "javascript",
+					isWrapped: shouldWrap
 				})
 			}), /* @__PURE__ */ jsxs(ButtonContainer, {
 				mods,

package/dist/components/content/CopySnippet/CopySnippet.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopySnippet.js","names":["PrismCode","Tooltip"],"sources":["../../../../src/components/content/CopySnippet/CopySnippet.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ReactNode, useMemo, useState } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { CopyIcon, EyeIcon, EyeInvisibleIcon } from '../../../icons';\nimport { Action, Button } from '../../actions';\nimport {\n  CubePrismCodeProps,\n  PrismCode,\n} from '../../content/PrismCode/PrismCode';\nimport { useToast } from '../../overlays/Toast';\nimport { Tooltip } from '../../overlays/Tooltip/Tooltip';\nimport { TooltipTrigger } from '../../overlays/Tooltip/TooltipTrigger';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst ActionElement = tasty(Action, {\n  styles: {\n    display: 'block',\n    cursor: 'default',\n    width: '100%',\n  },\n});\n\nconst StyledBlock = tasty({\n  styles: {\n    position: 'relative',\n    overflow: {\n      '': 'auto clip',\n      multiline: 'auto',\n    },\n    width: 'initial auto 100%',\n    height: {\n      '': 'max 5x',\n      multiline: 'auto',\n    },\n    boxSizing: 'border-box',\n    whiteSpace: {\n      '': 'initial',\n      nowrap: 'nowrap',\n    },\n    scrollbar: 'styled',\n    padding: '1.125x 1.5x',\n    fade: {\n      '': 'right 2x',\n      multiline: false,\n    },\n\n    Code: {\n      $: 'code',\n      preset: {\n        '': 's3',\n        serif: 't3',\n      },\n      // `s3` carries `fontFamily: var(--font-mono)` but `t3` sets no family at\n      // all, so the preset alone cannot express \"serif\". Left to the preset, the\n      // `serif` variant would inherit the `<code>` element's UA monospace\n      // default and render monospace anyway. Keep the family explicit:\n      // `font: 'monospace'` for the default, `font: true` for the design\n      // system's default (non-mono) stack under `serif`.\n      font: {\n        '': 'monospace',\n        serif: true,\n      },\n    },\n  },\n});\n\nconst ButtonContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'flex',\n    flow: {\n      '': 'row-reverse',\n      multiline: 'column',\n    },\n    placeContent: 'start',\n\n    '$button-size': {\n      '': '5x',\n      multiline: '4x',\n    },\n\n    '$first-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 0',\n    },\n\n    '$last-button-radius': {\n      '': '0',\n      multiline: '0 0 0 1r',\n    },\n\n    '$first-and-last-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 1r',\n    },\n\n    // Make sure there's a small gap between buttons and the content\n    border: 'left #clear',\n  },\n});\n\nconst CopySnippetElement = tasty(Card, {\n  qa: 'CopySnippet',\n  styles: {\n    display: 'grid',\n    gridRows: 'minmax(0, 1fr)',\n    fill: '#surface-2',\n    border: 0,\n    padding: 0,\n    preset: 'default',\n    radius: '1r',\n    overflow: 'hidden',\n    height: 'max-content',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) auto',\n      gridRows: 'minmax(0, 1fr)',\n      width: 'min 20x',\n      position: 'relative',\n    },\n  },\n});\n\nconst ActionButton = tasty(Button, {\n  type: 'clear',\n  styles: {\n    width: '4x',\n    padding: 0,\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': 'inset 0 0 0 1ow #purple-03.0',\n      focused: 'inset 0 0 0 1ow #purple-03',\n    },\n    outline: false,\n    height: '$button-size',\n    radius: {\n      '': 0,\n      ':last-child': '$last-button-radius',\n      ':first-child': '$first-button-radius',\n      ':first-child & :last-child': '$first-and-last-button-radius',\n    },\n  },\n});\n\nconst CopyButton = tasty(ActionButton, {\n  icon: <CopyIcon />,\n});\n\nconst ShowButton = tasty(ActionButton, {});\n\nexport interface CubeCopySnippetProps extends CubeCardProps {\n  /** The code snippet */\n  code: string;\n  /** The title of the snippet */\n  title?: string;\n  /** Whether the snippet is single-lined */\n  nowrap?: boolean;\n  /** The prefix for each line of code. Useful for bash snippets. */\n  prefix?: string;\n  /** The code language of the snippet */\n  language?: CubePrismCodeProps['language'];\n  /** Whether the snippet uses a serif font */\n  serif?: boolean;\n  /** Whether to show the tooltip with the full content */\n  showTooltip?: boolean;\n  hideText?: string[] | string | boolean;\n  actions?: ReactNode;\n}\n\n// const HIDDEN_SYMBOL = '●';\nconst HIDDEN_SYMBOL = '•';\n\nfunction replaceSymbolsToHidden(str: string) {\n  return HIDDEN_SYMBOL.repeat(str.length);\n}\n\nfunction CopySnippet(allProps: CubeCopySnippetProps) {\n  const { t } = useI18n();\n\n  const {\n    code = '',\n    title = t('copySnippet.title', 'Code example'),\n    nowrap,\n    prefix = '',\n    language,\n    serif,\n    actions,\n    showTooltip = false,\n    hideText,\n    ...props\n  } = allProps;\n\n  const toast = useToast();\n\n  const [showHidden, setShowHidden] = useState(false);\n\n  async function onCopy() {\n    await copy(code);\n\n    toast.success(t('copySnippet.copied', '{{title}} copied', { title }));\n  }\n\n  const pristineCode = code.replace(/\\n$/, '');\n\n  const multiline = pristineCode.includes('\\n') && !nowrap;\n  let formattedCode = pristineCode\n    .replace(/\\r/g, '')\n    .split(/\\n/g)\n    .map((line) => `${prefix}${line}`)\n    .join('\\n')\n    .trim();\n\n  if (!showHidden) {\n    if (hideText === true) {\n      formattedCode = replaceSymbolsToHidden(formattedCode);\n    } else if (typeof hideText === 'string') {\n      formattedCode = formattedCode.replaceAll(\n        hideText,\n        replaceSymbolsToHidden(hideText),\n      );\n    } else if (Array.isArray(hideText)) {\n      hideText.forEach((text) => {\n        formattedCode = formattedCode.replaceAll(\n          text,\n          replaceSymbolsToHidden(text),\n        );\n      });\n    }\n  }\n\n  const mods = useMemo(() => {\n    return {\n      nowrap,\n      multiline,\n      serif,\n      hidden: !!hideText,\n    };\n  }, [nowrap, multiline, hideText, serif]);\n\n  const Snippet = (\n    <CopySnippetElement mods={mods} {...props}>\n      <div data-element=\"Grid\">\n        <StyledBlock mods={mods}>\n          <PrismCode\n            style={{ margin: 0, overflow: 'visible' }}\n            code={formattedCode}\n            language={language || 'javascript'}\n          />\n        </StyledBlock>\n        <ButtonContainer mods={mods}>\n          <CopyButton\n            aria-label={t(\n              'copySnippet.copyToClipboard',\n              'Copy {{title}} to clipboard',\n              { title },\n            )}\n            onPress={onCopy}\n          />\n          {hideText && (\n            <ShowButton\n              aria-label={t('copySnippet.showHiddenParts', 'Show hidden parts')}\n              icon={showHidden ? <EyeInvisibleIcon /> : <EyeIcon />}\n              onPress={() => setShowHidden(!showHidden)}\n            />\n          )}\n          {actions}\n        </ButtonContainer>\n      </div>\n    </CopySnippetElement>\n  );\n\n  if (showTooltip) {\n    return (\n      <TooltipTrigger>\n        <ActionElement>{Snippet}</ActionElement>\n        <Tooltip>{formattedCode}</Tooltip>\n      </TooltipTrigger>\n    );\n  }\n\n  return Snippet;\n}\n\nconst _CopySnippet = Object.assign(\n  CopySnippet as typeof CopySnippet & {\n    Button: typeof ActionButton;\n  },\n  {\n    Button: ActionButton,\n  },\n);\n\n(_CopySnippet as any).displayName = 'CopySnippet';\n\nexport { _CopySnippet as CopySnippet };\n"],"mappings":"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"}
+{"version":3,"file":"CopySnippet.js","names":["PrismCode","Tooltip"],"sources":["../../../../src/components/content/CopySnippet/CopySnippet.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ReactNode, useMemo, useState } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { CopyIcon, EyeIcon, EyeInvisibleIcon } from '../../../icons';\nimport { Action, Button } from '../../actions';\nimport {\n  CubePrismCodeProps,\n  PrismCode,\n} from '../../content/PrismCode/PrismCode';\nimport { useToast } from '../../overlays/Toast';\nimport { Tooltip } from '../../overlays/Tooltip/Tooltip';\nimport { TooltipTrigger } from '../../overlays/Tooltip/TooltipTrigger';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst ActionElement = tasty(Action, {\n  styles: {\n    display: 'block',\n    cursor: 'default',\n    width: '100%',\n  },\n});\n\nconst StyledBlock = tasty({\n  styles: {\n    position: 'relative',\n    overflow: {\n      '': 'auto clip',\n      multiline: 'auto',\n    },\n    width: 'initial auto 100%',\n    height: {\n      '': 'max 5x',\n      multiline: 'auto',\n    },\n    boxSizing: 'border-box',\n    whiteSpace: {\n      '': 'initial',\n      nowrap: 'nowrap',\n    },\n    scrollbar: 'styled',\n    padding: '1.125x 1.5x',\n    fade: {\n      '': 'right 2x',\n      multiline: false,\n    },\n\n    Code: {\n      $: 'code',\n      preset: {\n        '': 's3',\n        serif: 't3',\n      },\n      // `s3` carries `fontFamily: var(--font-mono)` but `t3` sets no family at\n      // all, so the preset alone cannot express \"serif\". Left to the preset, the\n      // `serif` variant would inherit the `<code>` element's UA monospace\n      // default and render monospace anyway. Keep the family explicit:\n      // `font: 'monospace'` for the default, `font: true` for the design\n      // system's default (non-mono) stack under `serif`.\n      font: {\n        '': 'monospace',\n        serif: true,\n      },\n      // The wrapping itself (`white-space` / `overflow-wrap` on the `<code>`)\n      // is owned by `PrismCode` via its `isWrapped` prop, which this component\n      // forwards.\n    },\n  },\n});\n\nconst ButtonContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'flex',\n    flow: {\n      '': 'row-reverse',\n      multiline: 'column',\n    },\n    placeContent: 'start',\n\n    '$button-size': {\n      '': '5x',\n      multiline: '4x',\n    },\n\n    '$first-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 0',\n    },\n\n    '$last-button-radius': {\n      '': '0',\n      multiline: '0 0 0 1r',\n    },\n\n    '$first-and-last-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 1r',\n    },\n\n    // Make sure there's a small gap between buttons and the content\n    border: 'left #clear',\n  },\n});\n\nconst CopySnippetElement = tasty(Card, {\n  qa: 'CopySnippet',\n  styles: {\n    display: 'grid',\n    gridRows: 'minmax(0, 1fr)',\n    fill: '#surface-2',\n    border: 0,\n    padding: 0,\n    preset: 'default',\n    radius: '1r',\n    overflow: 'hidden',\n    height: 'max-content',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) auto',\n      gridRows: 'minmax(0, 1fr)',\n      width: 'min 20x',\n      position: 'relative',\n    },\n  },\n});\n\nconst ActionButton = tasty(Button, {\n  type: 'clear',\n  styles: {\n    width: '4x',\n    padding: 0,\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': 'inset 0 0 0 1ow #purple-03.0',\n      focused: 'inset 0 0 0 1ow #purple-03',\n    },\n    outline: false,\n    height: '$button-size',\n    radius: {\n      '': 0,\n      ':last-child': '$last-button-radius',\n      ':first-child': '$first-button-radius',\n      ':first-child & :last-child': '$first-and-last-button-radius',\n    },\n  },\n});\n\nconst CopyButton = tasty(ActionButton, {\n  icon: <CopyIcon />,\n});\n\nconst ShowButton = tasty(ActionButton, {});\n\nexport interface CubeCopySnippetProps extends CubeCardProps {\n  /** The code snippet */\n  code: string;\n  /** The title of the snippet */\n  title?: string;\n  /** Whether the snippet is single-lined */\n  nowrap?: boolean;\n  /**\n   * Soft-wrap long content onto multiple lines instead of scrolling it\n   * horizontally. The block grows vertically to fit (so even a single long line\n   * is fully readable rather than clamped), and unbreakable runs like URLs,\n   * tokens and identifiers wrap too. Useful for error messages and logs.\n   * Has no effect when `nowrap` is set. Note this is a different axis from\n   * `nowrap`: `nowrap` collapses real newlines into one scrolling line, while\n   * `isWrapped` breaks long lines that would otherwise scroll.\n   */\n  isWrapped?: boolean;\n  /** The prefix for each line of code. Useful for bash snippets. */\n  prefix?: string;\n  /** The code language of the snippet */\n  language?: CubePrismCodeProps['language'];\n  /** Whether the snippet uses a serif font */\n  serif?: boolean;\n  /** Whether to show the tooltip with the full content */\n  showTooltip?: boolean;\n  hideText?: string[] | string | boolean;\n  actions?: ReactNode;\n}\n\n// const HIDDEN_SYMBOL = '●';\nconst HIDDEN_SYMBOL = '•';\n\nfunction replaceSymbolsToHidden(str: string) {\n  return HIDDEN_SYMBOL.repeat(str.length);\n}\n\nfunction CopySnippet(allProps: CubeCopySnippetProps) {\n  const { t } = useI18n();\n\n  const {\n    code = '',\n    title = t('copySnippet.title', 'Code example'),\n    nowrap,\n    isWrapped,\n    prefix = '',\n    language,\n    serif,\n    actions,\n    showTooltip = false,\n    hideText,\n    ...props\n  } = allProps;\n\n  const toast = useToast();\n\n  const [showHidden, setShowHidden] = useState(false);\n\n  async function onCopy() {\n    await copy(code);\n\n    toast.success(t('copySnippet.copied', '{{title}} copied', { title }));\n  }\n\n  const pristineCode = code.replace(/\\n$/, '');\n\n  const multiline = pristineCode.includes('\\n') && !nowrap;\n  // `isWrapped` reuses the multiline block layout (auto height, no right fade,\n  // copy button on top) so wrapped content grows vertically instead of being\n  // clamped to the single-line height. `nowrap` (force one scrolling line) wins\n  // over it.\n  const shouldWrap = !!isWrapped && !nowrap;\n  let formattedCode = pristineCode\n    .replace(/\\r/g, '')\n    .split(/\\n/g)\n    .map((line) => `${prefix}${line}`)\n    .join('\\n')\n    .trim();\n\n  if (!showHidden) {\n    if (hideText === true) {\n      formattedCode = replaceSymbolsToHidden(formattedCode);\n    } else if (typeof hideText === 'string') {\n      formattedCode = formattedCode.replaceAll(\n        hideText,\n        replaceSymbolsToHidden(hideText),\n      );\n    } else if (Array.isArray(hideText)) {\n      hideText.forEach((text) => {\n        formattedCode = formattedCode.replaceAll(\n          text,\n          replaceSymbolsToHidden(text),\n        );\n      });\n    }\n  }\n\n  const mods = useMemo(() => {\n    return {\n      nowrap,\n      multiline: multiline || shouldWrap,\n      serif,\n      hidden: !!hideText,\n    };\n  }, [nowrap, multiline, shouldWrap, hideText, serif]);\n\n  const Snippet = (\n    <CopySnippetElement mods={mods} {...props}>\n      <div data-element=\"Grid\">\n        <StyledBlock mods={mods}>\n          <PrismCode\n            style={{ margin: 0, overflow: 'visible' }}\n            code={formattedCode}\n            language={language || 'javascript'}\n            isWrapped={shouldWrap}\n          />\n        </StyledBlock>\n        <ButtonContainer mods={mods}>\n          <CopyButton\n            aria-label={t(\n              'copySnippet.copyToClipboard',\n              'Copy {{title}} to clipboard',\n              { title },\n            )}\n            onPress={onCopy}\n          />\n          {hideText && (\n            <ShowButton\n              aria-label={t('copySnippet.showHiddenParts', 'Show hidden parts')}\n              icon={showHidden ? <EyeInvisibleIcon /> : <EyeIcon />}\n              onPress={() => setShowHidden(!showHidden)}\n            />\n          )}\n          {actions}\n        </ButtonContainer>\n      </div>\n    </CopySnippetElement>\n  );\n\n  if (showTooltip) {\n    return (\n      <TooltipTrigger>\n        <ActionElement>{Snippet}</ActionElement>\n        <Tooltip>{formattedCode}</Tooltip>\n      </TooltipTrigger>\n    );\n  }\n\n  return Snippet;\n}\n\nconst _CopySnippet = Object.assign(\n  CopySnippet as typeof CopySnippet & {\n    Button: typeof ActionButton;\n  },\n  {\n    Button: ActionButton,\n  },\n);\n\n(_CopySnippet as any).displayName = 'CopySnippet';\n\nexport { _CopySnippet as CopySnippet };\n"],"mappings":"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"}

package/dist/components/content/Disclosure/Disclosure.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeRefs } from "../../../utils/react/useCombinedRefs.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";

package/dist/components/content/Divider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";
 import { BASE_STYLES, COLOR_STYLES, OUTER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/Footer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/Header.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/HotKeys/HotKeys.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { _Text } from "../Text.js";
 import { useKeySymbols } from "../../../utils/react/useKeySymbols.js";

package/dist/components/content/InfoBadge/InfoBadge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { ItemBadge } from "../ItemBadge/ItemBadge.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/content/InlineInput/InlineInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/content/InlineInput/InlineInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineInput.js","names":["mergeProps"],"sources":["../../../../src/components/content/InlineInput/InlineInput.tsx"],"sourcesContent":["import { useControlledState } from '@react-stately/utils';\nimport {\n  BaseProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  COLOR_STYLES,\n  ColorStyleProps,\n  filterBaseProps,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  FocusScope,\n  OverlayProps,\n  useFocusRing,\n  useFocusWithin,\n} from 'react-aria';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { AutoTooltipValue, useAutoTooltip } from '../use-auto-tooltip';\n\nimport type {\n  ChangeEvent,\n  HTMLAttributes,\n  KeyboardEvent,\n  MouseEvent,\n  ReactNode,\n  RefObject,\n} from 'react';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type CubeInlineInputEditTrigger = 'dblclick' | 'click' | 'none';\n\nexport interface CubeInlineInputProps\n  extends BaseProps,\n    BlockStyleProps,\n    OuterStyleProps,\n    ColorStyleProps {\n  /** Controlled value. When provided, the component is controlled. */\n  value?: string;\n  /** Initial value for uncontrolled usage. */\n  defaultValue?: string;\n  /**\n   * Fires on commit *only when the value actually changed*. Use this to update\n   * external state. Pair with `value` for the controlled pattern.\n   */\n  onChange?: (value: string) => void;\n\n  /** Controlled editing state. When provided, the editing state is controlled. */\n  isEditing?: boolean;\n  /** Default editing state for uncontrolled usage. */\n  defaultIsEditing?: boolean;\n  /** Called when editing mode starts or ends. */\n  onEditingChange?: (isEditing: boolean) => void;\n\n  /**\n   * Fires every time the user commits (Enter / submit-on-blur / `ref.stopEditing(true)`),\n   * even if the value did not change. Use for side effects like analytics or\n   * \"save\" toasts. For state updates, prefer `onChange`.\n   *\n   * May return a Promise. If the returned Promise **rejects**, the component\n   * automatically reverts its optimistic display to the actual `value` prop —\n   * this gives async-save flows free rollback on failure (in controlled mode).\n   */\n  onSubmit?: (value: string) => void | Promise<unknown>;\n  /** Called when editing is cancelled (Escape or empty submit when `allowEmpty` is false). */\n  onCancel?: () => void;\n\n  /** How edit mode is activated from the display element. Default: `'dblclick'`. */\n  editTrigger?: CubeInlineInputEditTrigger;\n  /**\n   * When true (default) the display element is keyboard-focusable and\n   * responds to `Enter`, `F2` and `Space` by entering edit mode. Set to\n   * `false` when a host (e.g. an editable tab inside a button) already\n   * routes keyboard activation through `ref.startEditing()` — exposing the\n   * display element as a separate tab stop would create a nested keyboard\n   * focus inside the host.\n   *\n   * @default true\n   */\n  keyboardActivation?: boolean;\n  /** Whether to submit when focus leaves the input. Default: `true`. */\n  submitOnBlur?: boolean;\n  /** Whether to trim the value on submit. Default: `true`. */\n  trimOnSubmit?: boolean;\n  /** When false, submitting an empty/whitespace value cancels instead. Default: `false`. */\n  allowEmpty?: boolean;\n  /** When true, edit mode cannot be entered (programmatically or otherwise). */\n  isDisabled?: boolean;\n  /** When true, edit mode cannot be entered, but the display reads as enabled. */\n  isReadOnly?: boolean;\n\n  /**\n   * When true, applies a styled wrapper to the component (border, fill, padding,\n   * fixed height) so it visually matches a `TextInput`. Useful when swapping a\n   * field component (e.g. `Select`) for an `InlineInput` to rename / edit the\n   * current value without a visual jump.\n   *\n   * @default false\n   */\n  isStyled?: boolean;\n\n  /** Placeholder text shown in the input when the draft is empty. */\n  placeholder?: string;\n  /** Custom render for display (non-editing) mode. Receives the currently-displayed value (including optimistic). */\n  renderDisplay?: (value: string) => ReactNode;\n  /** ARIA label for the input (used when no visible label is associated). */\n  'aria-label'?: string;\n  /** ARIA labelledby for the input. */\n  'aria-labelledby'?: string;\n\n  /**\n   * Tooltip behaviour for the display value:\n   * - `true` (default): auto-tooltip — show the full value when the text is truncated.\n   * - `false`: never show a tooltip.\n   * - `string`: always show this tooltip text.\n   * - object: full `TooltipProvider` configuration (with optional `auto`).\n   *\n   * The tooltip is automatically suppressed while editing and when `renderDisplay` is used.\n   */\n  tooltip?: AutoTooltipValue;\n  /** Default tooltip placement. @default 'top' */\n  tooltipPlacement?: OverlayProps['placement'];\n\n  /** Convenience prop for styling the `Input` sub-element. Merged into `styles.Input`. */\n  inputStyles?: Styles;\n}\n\nexport interface CubeInlineInputRef {\n  /** Programmatically enter edit mode. */\n  startEditing(): void;\n  /** Programmatically exit edit mode. `submit=true` commits, `submit=false` cancels. Defaults to commit. */\n  stopEditing(submit?: boolean): void;\n  /** Focus the underlying element (input when editing, root span otherwise). */\n  focus(): void;\n  /** Current committed value (includes optimistic value if a parent hasn't synced yet). */\n  getValue(): string;\n}\n\n// =============================================================================\n// Styled element\n// =============================================================================\n\nconst InlineInputRoot = tasty({\n  as: 'span',\n  styles: {\n    // `inline-flex` with `alignItems: baseline` is used (instead of\n    // `inline-block` + `overflow: hidden`) so the container's baseline comes\n    // from the first flex item's content baseline. With `inline-block` +\n    // `overflow: hidden`, the CSS spec forces the baseline to the bottom\n    // margin edge, which visibly shifts the text upward inside surrounding\n    // line boxes (notably inside Tabs' centered `Item.Label`).\n    display: 'inline-flex',\n    alignItems: {\n      '': 'baseline',\n      styled: 'center',\n    },\n    verticalAlign: {\n      '': 'baseline',\n      styled: 'middle',\n    },\n    position: 'relative',\n    width: 'initial 100%',\n    boxSizing: 'border-box',\n    color: {\n      '': 'inherit',\n      styled: '#dark-02',\n      'styled & disabled': '#dark.30',\n    },\n    preset: {\n      '': 'inherit',\n      styled: 't3',\n    },\n    cursor: {\n      '': 'inherit',\n      'editable & !editing': 'text',\n    },\n    fill: {\n      '': '#clear',\n      styled: '#surface',\n      'styled & disabled': '#disabled-surface',\n    },\n    border: {\n      '': false,\n      styled: true,\n      'styled & focused': '#primary-text',\n      'styled & disabled': true,\n    },\n    // Focus ring. Shown when the display element is keyboard-focused\n    // (driven on the React side by `isFocusVisible`) and *always* while\n    // editing — so swapping into the input always presents a clear focus\n    // indicator regardless of how the user activated it (click vs keyboard).\n    // In `styled` mode the border colour transition is enough to indicate\n    // focus (matching `TextInput`'s visual), so the outline is suppressed.\n    // Outline doesn't take layout space and respects rounded corners via\n    // `outlineOffset`.\n    outline: {\n      '': '1bw #primary.0',\n      'focused & !styled': '1bw #primary',\n    },\n    outlineOffset: 1,\n    radius: {\n      '': 0,\n      focused: true,\n      styled: true,\n    },\n    padding: {\n      '': 0,\n      styled: '(.75x - 1bw) (1x - 1bw)',\n    },\n    height: {\n      '': 'auto',\n      styled: '$size-md',\n    },\n    transition: 'theme',\n\n    // Display flex item: owns the truncation (`overflow: hidden` here is a\n    // block-level rule that does *not* alter the parent's baseline, unlike\n    // an `inline-block` overflow rule).\n    Display: {\n      display: 'block',\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      width: 'initial 100%',\n      preset: 'inherit',\n      color: 'inherit',\n    },\n\n    Input: {\n      recipe: 'reset input / input-autofill',\n      preset: 'inherit',\n      color: 'inherit',\n      fill: '#clear',\n      textAlign: 'left',\n      // In `styled` mode the wrapper has a fixed size and we want the input\n      // to fill it (matches `TextInput`). In the default inline mode the\n      // input auto-sizes to its content via `$input-width`.\n      width: {\n        '': '1em $input-width 100%',\n        styled: '0 100% initial',\n      },\n      '&::placeholder': { recipe: 'input-placeholder' },\n    },\n\n    Measure: {\n      position: 'absolute',\n      visibility: 'hidden',\n      pointerEvents: 'none',\n      whiteSpace: 'pre',\n      preset: 'inherit',\n      height: 0,\n      overflow: 'hidden',\n    },\n\n    Placeholder: {\n      recipe: 'input-placeholder',\n      preset: 'inherit',\n    },\n  },\n});\n\nconst STYLE_PROPS = [...BLOCK_STYLES, ...OUTER_STYLES, ...COLOR_STYLES];\n\n// Grace window after a programmatic `startEditing()` during which a blur\n// (typically a closing overlay's focus restoration) re-focuses the input\n// rather than committing. ~500ms covers the Menu/Popover EXIT_DURATION\n// (350ms in `Overlay.tsx`) with margin.\nconst PROGRAMMATIC_EDIT_BLUR_GRACE_MS = 500;\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Inline editable text. Renders the value as inline content by default and\n * swaps to an auto-sizing text input when entering edit mode.\n *\n * Designed to drop into any text context (tab title, heading, paragraph,\n * table cell) without style customization: typography, color, and font family\n * are all inherited from the parent.\n *\n * Value and `isEditing` can each be controlled or uncontrolled independently.\n * Programmatic entry via the imperative ref (`startEditing`/`stopEditing`)\n * works regardless of `editTrigger`.\n */\nexport const InlineInput = forwardRef<CubeInlineInputRef, CubeInlineInputProps>(\n  function InlineInput(allProps, ref) {\n    const {\n      value: valueProp,\n      defaultValue,\n      onChange,\n      isEditing: isEditingProp,\n      defaultIsEditing,\n      onEditingChange,\n      onSubmit,\n      onCancel,\n      editTrigger = 'dblclick',\n      keyboardActivation = true,\n      submitOnBlur = true,\n      trimOnSubmit = true,\n      allowEmpty = false,\n      isDisabled = false,\n      isReadOnly = false,\n      isStyled = false,\n      placeholder,\n      renderDisplay,\n      tooltip = true,\n      tooltipPlacement = 'top',\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledby,\n      qa,\n      qaVal,\n      styles: stylesProp,\n      inputStyles,\n      mods: customMods,\n      tokens: customTokens,\n      ...otherProps\n    } = allProps;\n\n    const isControlled = valueProp !== undefined;\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    const measureRef = useRef<HTMLSpanElement>(null);\n    const rootRef = useRef<HTMLSpanElement>(null);\n\n    const [value, setValue] = useControlledState<string>(\n      valueProp as string,\n      (defaultValue ?? '') as string,\n      onChange,\n    );\n\n    const [isEditing, setIsEditing] = useControlledState<boolean>(\n      isEditingProp as boolean,\n      (defaultIsEditing ?? false) as boolean,\n      onEditingChange,\n    );\n\n    // Optimistic value. Holds the just-committed value while we wait for the\n    // (potentially async) controlled parent to sync `value`. In uncontrolled\n    // mode `value` updates immediately so this stays null after each render.\n    const [optimisticValue, setOptimisticValue] = useState<string | null>(null);\n    const displayedValue = optimisticValue ?? value;\n\n    const [draft, setDraft] = useState<string>(value);\n    const [inputWidth, setInputWidth] = useState<number | null>(null);\n\n    // Reliable focus presence for the whole component, driven by\n    // `useFocusWithin` (which, unlike `useFocusRing`/`useFocus` on a bare\n    // span, has an element-removal fallback). Used to gate the display focus\n    // ring so it can never get stuck on after editing ends or after focus\n    // moves to another component.\n    const [isFocusWithin, setIsFocusWithin] = useState(false);\n\n    // Suppresses the display focus ring for a single programmatic focus\n    // restore (when we return focus to the display span after a keyboard /\n    // programmatic edit-end). Reset whenever focus truly leaves the component\n    // so a later real keyboard Tab back shows the ring again.\n    const [ringSuppressed, setRingSuppressed] = useState(false);\n\n    // Token to invalidate in-flight onSubmit promises if a newer commit /\n    // re-entry happens before they settle.\n    const submitTokenRef = useRef(0);\n\n    // Timestamp of the most recent programmatic `startEditing()` call (via\n    // the imperative ref). Used to defeat a focus-theft race where a closing\n    // overlay's `<FocusScope restoreFocus>` yanks focus back to its trigger\n    // immediately after a consumer called `startEditing()` from inside the\n    // overlay's `onAction` (e.g. a Tabs menu \"Rename\" item). Without this\n    // guard the resulting blur would fire `submitOnBlur` and unmount the\n    // input the user just opened.\n    //\n    // Cleared on first user interaction inside the input (`handleInputChange`\n    // / `handleKeyDown`) and on leaving editing mode, so any later blur\n    // commits normally.\n    const programmaticEditStartRef = useRef<number | null>(null);\n\n    // Set when an edit-end should return focus to the display span (keyboard\n    // Enter/Escape, imperative `stopEditing`). NOT set for submit-on-blur /\n    // tab-away, where focus has already moved elsewhere. Consumed by a layout\n    // effect after the display span re-mounts.\n    const pendingRestoreFocusRef = useRef(false);\n\n    // Synchronous mirror of `isEditing`. We need this because cancel/commit\n    // call user callbacks (`onCancel`/`onSubmit`) that may synchronously\n    // re-focus another element — that causes a synchronous blur on the\n    // input which would otherwise re-enter `commit` via `onBlurWithin` (the\n    // state update from `setIsEditing(false)` isn't committed yet, so the\n    // closure still sees `isEditing === true`).\n    //\n    // The ref is kept in sync via `useLayoutEffect` so concurrent renders\n    // that get thrown away don't leak a stale value into the next commit.\n    const isEditingRef = useRef(isEditing);\n\n    useLayoutEffect(() => {\n      isEditingRef.current = isEditing;\n    }, [isEditing]);\n\n    // Clear the optimistic value once `value` catches up or changes externally.\n    useEffect(() => {\n      setOptimisticValue(null);\n    }, [value]);\n\n    const enterEditing = useEvent(() => {\n      if (isDisabled || isReadOnly || isEditing) return;\n      // Invalidate any in-flight onSubmit promise — its outcome no longer\n      // matters because the user is about to commit a new value anyway.\n      submitTokenRef.current += 1;\n      isEditingRef.current = true;\n      // Start from the actual prop value, not optimistic — gives the user a\n      // way to recover if a previous commit was rejected by the parent.\n      setOptimisticValue(null);\n      setDraft(value);\n      setIsEditing(true);\n    });\n\n    // Whether an edit-end should return focus to the display span. Only when\n    // this component owns its own keyboard/focus story (standalone usage).\n    // Hosts that drive editing through `ref.startEditing()` with\n    // `keyboardActivation={false}` (e.g. `Tabs`) keep ownership of focus.\n    const canRestoreFocus = () =>\n      keyboardActivation &&\n      editTrigger !== 'none' &&\n      !isDisabled &&\n      !isReadOnly;\n\n    const commit = useEvent((rawValue: string, restoreFocus = true) => {\n      // Re-entry guard. `onSubmit`/`onCancel` may synchronously refocus and\n      // trigger another blur-driven commit before the state update lands.\n      if (!isEditingRef.current) return;\n\n      const next = trimOnSubmit ? rawValue.trim() : rawValue;\n\n      if (restoreFocus && canRestoreFocus()) {\n        pendingRestoreFocusRef.current = true;\n      }\n\n      if (!next && !allowEmpty) {\n        isEditingRef.current = false;\n        programmaticEditStartRef.current = null;\n        setIsEditing(false);\n        onCancel?.();\n\n        return;\n      }\n\n      const token = ++submitTokenRef.current;\n\n      if (isControlled) {\n        // Show the new value optimistically until the parent re-renders.\n        setOptimisticValue(next);\n      }\n      isEditingRef.current = false;\n      programmaticEditStartRef.current = null;\n      setValue(next);\n      setIsEditing(false);\n\n      const result = onSubmit?.(next);\n      // If onSubmit returns a Promise that rejects, the parent is signalling\n      // a save failure — revert the optimistic value back to the actual prop.\n      // We guard with a token so a slow rejection doesn't clobber a newer\n      // commit's optimistic display.\n      if (\n        result != null &&\n        typeof (result as Promise<unknown>).then === 'function'\n      ) {\n        (result as Promise<unknown>).then(\n          () => {},\n          () => {\n            if (submitTokenRef.current === token && isControlled) {\n              setOptimisticValue(null);\n            }\n          },\n        );\n      }\n    });\n\n    const cancel = useEvent((restoreFocus = true) => {\n      if (!isEditingRef.current) return;\n      if (restoreFocus && canRestoreFocus()) {\n        pendingRestoreFocusRef.current = true;\n      }\n      isEditingRef.current = false;\n      programmaticEditStartRef.current = null;\n      setIsEditing(false);\n      onCancel?.();\n    });\n\n    // Keep draft in sync with the external value while NOT editing.\n    useEffect(() => {\n      if (!isEditing) setDraft(value);\n    }, [value, isEditing]);\n\n    // Select all text synchronously when entering edit mode.\n    useLayoutEffect(() => {\n      if (!isEditing) return;\n      inputRef.current?.select();\n    }, [isEditing]);\n\n    // Return focus to the display span after a keyboard / programmatic\n    // edit-end so keyboard navigation continues from this control. The focus\n    // is programmatic (react-aria treats it as non-keyboard) and we set\n    // `ringSuppressed` so it does not draw a focus ring; a later real Tab to\n    // the element resets the suppression (see `onFocusWithinChange`).\n    //\n    // `onSubmit`/`onCancel` may synchronously move focus elsewhere. When the\n    // input unmounts, the browser drops focus to `<body>`, so we only restore\n    // focus to the display span when focus actually landed there (or nowhere).\n    // If a handler deliberately moved focus to another element, we leave it.\n    useLayoutEffect(() => {\n      if (isEditing || !pendingRestoreFocusRef.current) return;\n      pendingRestoreFocusRef.current = false;\n\n      const root = rootRef.current;\n      if (!root) return;\n\n      const active = root.ownerDocument.activeElement;\n      const focusLost = !active || active === root.ownerDocument.body;\n      // A handler moved focus to a real element outside this control — respect\n      // it and don't pull focus back.\n      if (!focusLost && !root.contains(active)) return;\n\n      setRingSuppressed(true);\n      root.focus();\n    }, [isEditing]);\n\n    // Measure the draft so the input width follows the typed glyphs.\n    useLayoutEffect(() => {\n      if (!isEditing) return;\n      const measure = measureRef.current;\n\n      if (!measure) return;\n      setInputWidth(measure.scrollWidth);\n    }, [isEditing, draft, placeholder]);\n\n    const handleKeyDown = useEvent((e: KeyboardEvent<HTMLInputElement>) => {\n      // User is interacting with the input — drop the post-`startEditing()`\n      // blur guard so a subsequent click-away commits normally.\n      programmaticEditStartRef.current = null;\n\n      if (e.key === 'Enter') {\n        e.preventDefault();\n        commit(draft);\n\n        return;\n      }\n\n      if (e.key === 'Escape') {\n        e.preventDefault();\n        cancel();\n\n        return;\n      }\n\n      // Prevent the host (e.g. Tabs) from intercepting text-editing keys.\n      if (\n        e.key === 'ArrowLeft' ||\n        e.key === 'ArrowRight' ||\n        e.key === ' ' ||\n        e.key === 'Delete' ||\n        e.key === 'Backspace'\n      ) {\n        e.stopPropagation();\n      }\n    });\n\n    const handleInputChange = useEvent((e: ChangeEvent<HTMLInputElement>) => {\n      programmaticEditStartRef.current = null;\n      setDraft(e.target.value);\n    });\n\n    // Keyboard focus-visible modality (mouse vs keyboard). Used together with\n    // `isFocusWithin` to drive the display focus ring. We rely on\n    // `useFocusWithin` (below) for the *presence* of focus because, unlike\n    // `useFocusRing`/`useFocus` on a bare span, it has an element-removal\n    // fallback — so the ring can never get stuck on after the inner input is\n    // unmounted on edit-end or after focus moves away.\n    const { isFocusVisible, focusProps: focusRingProps } = useFocusRing();\n\n    // Always enabled so it reliably reports focus presence in BOTH display\n    // and edit modes. The submit-on-blur logic is internally guarded by\n    // `isEditingRef`, so running `onBlurWithin` in display mode is a no-op.\n    const { focusWithinProps } = useFocusWithin({\n      onFocusWithinChange: (within) => {\n        setIsFocusWithin(within);\n        // Once focus truly leaves the component, clear the one-shot ring\n        // suppression so a later real keyboard Tab back shows the ring again.\n        if (!within) setRingSuppressed(false);\n      },\n      onBlurWithin: () => {\n        if (!isEditingRef.current) return;\n        if (!submitOnBlur) return;\n\n        // Spurious-blur guard. `useFocusWithin` fires a synthetic blur via its\n        // element-removal fallback when the display span unmounts as we enter\n        // edit mode (focus actually moved INTO the inner input). Ignore it if\n        // focus is in fact still within the component.\n        const active = rootRef.current?.ownerDocument.activeElement;\n        if (active && rootRef.current?.contains(active)) return;\n\n        // Grace-period guard against focus theft right after a programmatic\n        // `startEditing()` — e.g. a `<FocusScope restoreFocus>` inside a\n        // closing Menu popover yanking focus back to its trigger after the\n        // consumer activated rename from `onAction`. Re-focus the input on\n        // the next frame so the focus-stealing element finishes its own\n        // handler first, then we steal focus back. The guard is cleared on\n        // the first real user interaction with the input (keydown / input\n        // change) so subsequent click-aways commit normally.\n        const startedAt = programmaticEditStartRef.current;\n        if (\n          startedAt != null &&\n          Date.now() - startedAt < PROGRAMMATIC_EDIT_BLUR_GRACE_MS &&\n          isEditingRef.current\n        ) {\n          requestAnimationFrame(() => {\n            if (isEditingRef.current) {\n              inputRef.current?.focus();\n              inputRef.current?.select();\n            }\n          });\n\n          return;\n        }\n\n        // Focus has already moved elsewhere (tab-away / click-away), so do\n        // NOT pull it back to the display span.\n        commit(draft, false);\n      },\n    });\n\n    const handleDblClick = useEvent((e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      enterEditing();\n    });\n\n    const handleClick = useEvent((e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      enterEditing();\n    });\n\n    // Keyboard activation from the display element (standalone usage).\n    // Hosts that own keyboard handling themselves should pass\n    // `keyboardActivation={false}` (see `TabButton` for an example).\n    const handleRootKeyDown = useEvent((e: KeyboardEvent<HTMLSpanElement>) => {\n      if (e.key === 'Enter' || e.key === 'F2' || e.key === ' ') {\n        e.preventDefault();\n        e.stopPropagation();\n        enterEditing();\n      }\n    });\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        startEditing: () => {\n          // Arm the grace-period blur guard for the imperative path only.\n          // Pointer-triggered entries (dblclick / click) don't suffer from\n          // the closing-overlay focus-theft race that motivates this guard.\n          const wasEditing = isEditingRef.current;\n          enterEditing();\n          if (!wasEditing && isEditingRef.current) {\n            programmaticEditStartRef.current = Date.now();\n          }\n        },\n        stopEditing: (submit = true) => {\n          if (!isEditingRef.current) return;\n          if (submit) commit(draft);\n          else cancel();\n        },\n        focus: () => {\n          if (isEditingRef.current) inputRef.current?.focus();\n          else rootRef.current?.focus();\n        },\n        getValue: () => displayedValue,\n      }),\n      [enterEditing, commit, cancel, draft, displayedValue],\n    );\n\n    const isEditable = editTrigger !== 'none' && !isDisabled && !isReadOnly;\n\n    // `focused` controls the visible focus indicator on the root.\n    //\n    // While editing, the inner `<input>` always has focus (FocusScope\n    // `autoFocus`), so we show the focus indicator on the root regardless\n    // of how the user activated edit mode (click vs keyboard).\n    //\n    // In display mode we show the indicator only on keyboard focus\n    // (`isFocusVisible`) AND when focus is actually within the component\n    // (`isFocusWithin`) AND the display element is focusable (`isEditable`).\n    // The `isFocusWithin` gate is the key fix: it reliably drops to `false`\n    // on edit-end / tab-away (it has an element-removal fallback that\n    // `useFocusRing` lacks on a bare span), so the ring can never get stuck\n    // on. `ringSuppressed` hides the ring for a single programmatic focus\n    // restore after a keyboard / programmatic edit-end.\n    //\n    // When `keyboardActivation` is `false` the host (e.g. `Tabs`) owns the\n    // entire focus story for this control, so we suppress the focus ring\n    // entirely — including while editing — to avoid drawing a redundant\n    // indicator on top of the host's own focus ring.\n    const showFocusRing =\n      keyboardActivation &&\n      (isEditing ||\n        (isFocusVisible && isFocusWithin && isEditable && !ringSuppressed));\n\n    const mods = useMemo(\n      () => ({\n        editing: isEditing,\n        editable: isEditable,\n        focused: showFocusRing,\n        disabled: isDisabled,\n        'read-only': isReadOnly,\n        styled: isStyled,\n        empty: !displayedValue,\n        ...customMods,\n      }),\n      [\n        isEditing,\n        isEditable,\n        showFocusRing,\n        isDisabled,\n        isReadOnly,\n        isStyled,\n        displayedValue,\n        customMods,\n      ],\n    );\n\n    const mergedStyles = useMemo<Styles | undefined>(() => {\n      if (!stylesProp && !inputStyles) return undefined;\n      if (!inputStyles) return stylesProp;\n      const existingInput =\n        (stylesProp?.Input as Styles | undefined) ?? undefined;\n\n      return {\n        ...stylesProp,\n        Input: existingInput\n          ? { ...existingInput, ...inputStyles }\n          : inputStyles,\n      };\n    }, [stylesProp, inputStyles]);\n\n    const extractedStyles = extractStyles(\n      otherProps,\n      STYLE_PROPS,\n      mergedStyles,\n    );\n\n    const tokens = useMemo(\n      () => ({\n        ...customTokens,\n        '$input-width': inputWidth != null ? `${inputWidth}px` : 'auto',\n      }),\n      [customTokens, inputWidth],\n    );\n\n    // In display mode, render the placeholder when the value is empty so the\n    // component remains visible / clickable. Consumers using `renderDisplay`\n    // take full control and are responsible for handling empty values\n    // themselves.\n    const displayContent = renderDisplay\n      ? renderDisplay(displayedValue)\n      : displayedValue ||\n        (placeholder ? (\n          <span data-element=\"Placeholder\">{placeholder}</span>\n        ) : (\n          ''\n        ));\n\n    const baseProps = filterBaseProps(otherProps, { eventProps: true });\n\n    // Overflow detection / auto-tooltip. Suppressed while editing (the input\n    // owns the visible text and isn't truncated), and when the consumer\n    // provides `renderDisplay` (they own the display story and should attach\n    // their own tooltip if needed).\n    const { labelRef: tooltipLabelRef, renderWithTooltip } = useAutoTooltip({\n      tooltip: isEditing || renderDisplay ? false : tooltip,\n      children: displayedValue,\n    });\n\n    // Wire pointer/keyboard activators only when relevant. Hosts that drive\n    // editing through `ref.startEditing()` keep all of these `undefined` so\n    // they don't intercept their own keyboard / focus story.\n    const wantsClick = !isEditing && isEditable && editTrigger === 'click';\n    const wantsDblClick =\n      !isEditing && isEditable && editTrigger === 'dblclick';\n    const wantsKeyboard = !isEditing && isEditable && keyboardActivation;\n\n    const renderRoot = (\n      triggerProps?: HTMLAttributes<HTMLElement>,\n      tooltipRef?: RefObject<HTMLElement>,\n    ) => {\n      const handleRootRef = (element: HTMLSpanElement | null) => {\n        rootRef.current = element;\n        if (tooltipRef) {\n          (tooltipRef as { current: HTMLElement | null }).current = element;\n        }\n      };\n\n      // Overflow detection has to look at the truncating element, which is now\n      // the inner `Display` (the root is `inline-flex` and doesn't clip). The\n      // tooltip still anchors to the root via `tooltipRef` above.\n      const handleDisplayRef = (element: HTMLSpanElement | null) => {\n        tooltipLabelRef(element);\n      };\n\n      const a11yProps: HTMLAttributes<HTMLElement> = {};\n\n      if (wantsKeyboard) {\n        a11yProps.tabIndex = 0;\n        a11yProps.role = 'button';\n        a11yProps['aria-roledescription'] = 'editable text';\n        if (ariaLabel) a11yProps['aria-label'] = ariaLabel;\n        if (ariaLabelledby) a11yProps['aria-labelledby'] = ariaLabelledby;\n      }\n\n      if (isDisabled) a11yProps['aria-disabled'] = true;\n      if (isReadOnly) a11yProps['aria-readonly'] = true;\n\n      return (\n        <InlineInputRoot\n          ref={handleRootRef}\n          qa={qa ?? 'InlineInput'}\n          qaVal={qaVal}\n          mods={mods}\n          tokens={tokens}\n          styles={extractedStyles}\n          {...mergeProps(\n            baseProps,\n            focusWithinProps,\n            // Always attach focusRingProps so the hook sees the blur event\n            // when focus moves into the inner input on edit-mode entry. If\n            // we only attached them while `wantsKeyboard` is true, the hook\n            // would miss the blur (since `wantsKeyboard` flips to false the\n            // moment editing starts), leaving `isFocused` stale and the\n            // ring stuck on after editing ends. `useFocusRing` filters\n            // bubbled focus from descendants internally (`target ===\n            // currentTarget`), so spreading these on a non-focusable span\n            // is a no-op.\n            focusRingProps,\n            triggerProps ?? {},\n            {\n              onDoubleClick: wantsDblClick ? handleDblClick : undefined,\n              onClick: wantsClick ? handleClick : undefined,\n              onKeyDown: wantsKeyboard ? handleRootKeyDown : undefined,\n              ...a11yProps,\n            },\n          )}\n        >\n          {isEditing ? (\n            <FocusScope autoFocus restoreFocus={false} contain={false}>\n              <span ref={measureRef} data-element=\"Measure\" aria-hidden=\"true\">\n                {draft || placeholder || ' '}\n              </span>\n              <input\n                ref={inputRef}\n                data-element=\"Input\"\n                type=\"text\"\n                value={draft}\n                placeholder={placeholder}\n                disabled={isDisabled}\n                readOnly={isReadOnly}\n                aria-label={ariaLabel}\n                aria-labelledby={ariaLabelledby}\n                onChange={handleInputChange}\n                onKeyDown={handleKeyDown}\n              />\n            </FocusScope>\n          ) : (\n            <span ref={handleDisplayRef} data-element=\"Display\">\n              {displayContent}\n            </span>\n          )}\n        </InlineInputRoot>\n      );\n    };\n\n    return renderWithTooltip(renderRoot, tooltipPlacement);\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"InlineInput.js","names":["mergeProps"],"sources":["../../../../src/components/content/InlineInput/InlineInput.tsx"],"sourcesContent":["import { useControlledState } from '@react-stately/utils';\nimport {\n  BaseProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  COLOR_STYLES,\n  ColorStyleProps,\n  filterBaseProps,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  FocusScope,\n  OverlayProps,\n  useFocusRing,\n  useFocusWithin,\n} from 'react-aria';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { AutoTooltipValue, useAutoTooltip } from '../use-auto-tooltip';\n\nimport type {\n  ChangeEvent,\n  HTMLAttributes,\n  KeyboardEvent,\n  MouseEvent,\n  ReactNode,\n  RefObject,\n} from 'react';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type CubeInlineInputEditTrigger = 'dblclick' | 'click' | 'none';\n\nexport interface CubeInlineInputProps\n  extends BaseProps,\n    BlockStyleProps,\n    OuterStyleProps,\n    ColorStyleProps {\n  /** Controlled value. When provided, the component is controlled. */\n  value?: string;\n  /** Initial value for uncontrolled usage. */\n  defaultValue?: string;\n  /**\n   * Fires on commit *only when the value actually changed*. Use this to update\n   * external state. Pair with `value` for the controlled pattern.\n   */\n  onChange?: (value: string) => void;\n\n  /** Controlled editing state. When provided, the editing state is controlled. */\n  isEditing?: boolean;\n  /** Default editing state for uncontrolled usage. */\n  defaultIsEditing?: boolean;\n  /** Called when editing mode starts or ends. */\n  onEditingChange?: (isEditing: boolean) => void;\n\n  /**\n   * Fires every time the user commits (Enter / submit-on-blur / `ref.stopEditing(true)`),\n   * even if the value did not change. Use for side effects like analytics or\n   * \"save\" toasts. For state updates, prefer `onChange`.\n   *\n   * May return a Promise. If the returned Promise **rejects**, the component\n   * automatically reverts its optimistic display to the actual `value` prop —\n   * this gives async-save flows free rollback on failure (in controlled mode).\n   */\n  onSubmit?: (value: string) => void | Promise<unknown>;\n  /** Called when editing is cancelled (Escape or empty submit when `allowEmpty` is false). */\n  onCancel?: () => void;\n\n  /** How edit mode is activated from the display element. Default: `'dblclick'`. */\n  editTrigger?: CubeInlineInputEditTrigger;\n  /**\n   * When true (default) the display element is keyboard-focusable and\n   * responds to `Enter`, `F2` and `Space` by entering edit mode. Set to\n   * `false` when a host (e.g. an editable tab inside a button) already\n   * routes keyboard activation through `ref.startEditing()` — exposing the\n   * display element as a separate tab stop would create a nested keyboard\n   * focus inside the host.\n   *\n   * @default true\n   */\n  keyboardActivation?: boolean;\n  /** Whether to submit when focus leaves the input. Default: `true`. */\n  submitOnBlur?: boolean;\n  /** Whether to trim the value on submit. Default: `true`. */\n  trimOnSubmit?: boolean;\n  /** When false, submitting an empty/whitespace value cancels instead. Default: `false`. */\n  allowEmpty?: boolean;\n  /** When true, edit mode cannot be entered (programmatically or otherwise). */\n  isDisabled?: boolean;\n  /** When true, edit mode cannot be entered, but the display reads as enabled. */\n  isReadOnly?: boolean;\n\n  /**\n   * When true, applies a styled wrapper to the component (border, fill, padding,\n   * fixed height) so it visually matches a `TextInput`. Useful when swapping a\n   * field component (e.g. `Select`) for an `InlineInput` to rename / edit the\n   * current value without a visual jump.\n   *\n   * @default false\n   */\n  isStyled?: boolean;\n\n  /** Placeholder text shown in the input when the draft is empty. */\n  placeholder?: string;\n  /** Custom render for display (non-editing) mode. Receives the currently-displayed value (including optimistic). */\n  renderDisplay?: (value: string) => ReactNode;\n  /** ARIA label for the input (used when no visible label is associated). */\n  'aria-label'?: string;\n  /** ARIA labelledby for the input. */\n  'aria-labelledby'?: string;\n\n  /**\n   * Tooltip behaviour for the display value:\n   * - `true` (default): auto-tooltip — show the full value when the text is truncated.\n   * - `false`: never show a tooltip.\n   * - `string`: always show this tooltip text.\n   * - object: full `TooltipProvider` configuration (with optional `auto`).\n   *\n   * The tooltip is automatically suppressed while editing and when `renderDisplay` is used.\n   */\n  tooltip?: AutoTooltipValue;\n  /** Default tooltip placement. @default 'top' */\n  tooltipPlacement?: OverlayProps['placement'];\n\n  /** Convenience prop for styling the `Input` sub-element. Merged into `styles.Input`. */\n  inputStyles?: Styles;\n}\n\nexport interface CubeInlineInputRef {\n  /** Programmatically enter edit mode. */\n  startEditing(): void;\n  /** Programmatically exit edit mode. `submit=true` commits, `submit=false` cancels. Defaults to commit. */\n  stopEditing(submit?: boolean): void;\n  /** Focus the underlying element (input when editing, root span otherwise). */\n  focus(): void;\n  /** Current committed value (includes optimistic value if a parent hasn't synced yet). */\n  getValue(): string;\n}\n\n// =============================================================================\n// Styled element\n// =============================================================================\n\nconst InlineInputRoot = tasty({\n  as: 'span',\n  styles: {\n    // `inline-flex` with `alignItems: baseline` is used (instead of\n    // `inline-block` + `overflow: hidden`) so the container's baseline comes\n    // from the first flex item's content baseline. With `inline-block` +\n    // `overflow: hidden`, the CSS spec forces the baseline to the bottom\n    // margin edge, which visibly shifts the text upward inside surrounding\n    // line boxes (notably inside Tabs' centered `Item.Label`).\n    display: 'inline-flex',\n    alignItems: {\n      '': 'baseline',\n      styled: 'center',\n    },\n    verticalAlign: {\n      '': 'baseline',\n      styled: 'middle',\n    },\n    position: 'relative',\n    width: 'initial 100%',\n    boxSizing: 'border-box',\n    color: {\n      '': 'inherit',\n      styled: '#dark-02',\n      'styled & disabled': '#dark.30',\n    },\n    preset: {\n      '': 'inherit',\n      styled: 't3',\n    },\n    cursor: {\n      '': 'inherit',\n      'editable & !editing': 'text',\n    },\n    fill: {\n      '': '#clear',\n      styled: '#surface',\n      'styled & disabled': '#disabled-surface',\n    },\n    border: {\n      '': false,\n      styled: true,\n      'styled & focused': '#primary-text',\n      'styled & disabled': true,\n    },\n    // Focus ring. Shown when the display element is keyboard-focused\n    // (driven on the React side by `isFocusVisible`) and *always* while\n    // editing — so swapping into the input always presents a clear focus\n    // indicator regardless of how the user activated it (click vs keyboard).\n    // In `styled` mode the border colour transition is enough to indicate\n    // focus (matching `TextInput`'s visual), so the outline is suppressed.\n    // Outline doesn't take layout space and respects rounded corners via\n    // `outlineOffset`.\n    outline: {\n      '': '1bw #primary.0',\n      'focused & !styled': '1bw #primary',\n    },\n    outlineOffset: 1,\n    radius: {\n      '': 0,\n      focused: true,\n      styled: true,\n    },\n    padding: {\n      '': 0,\n      styled: '(.75x - 1bw) (1x - 1bw)',\n    },\n    height: {\n      '': 'auto',\n      styled: '$size-md',\n    },\n    transition: 'theme',\n\n    // Display flex item: owns the truncation (`overflow: hidden` here is a\n    // block-level rule that does *not* alter the parent's baseline, unlike\n    // an `inline-block` overflow rule).\n    Display: {\n      display: 'block',\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      width: 'initial 100%',\n      preset: 'inherit',\n      color: 'inherit',\n    },\n\n    Input: {\n      recipe: 'reset input / input-autofill',\n      preset: 'inherit',\n      color: 'inherit',\n      fill: '#clear',\n      textAlign: 'left',\n      // In `styled` mode the wrapper has a fixed size and we want the input\n      // to fill it (matches `TextInput`). In the default inline mode the\n      // input auto-sizes to its content via `$input-width`.\n      width: {\n        '': '1em $input-width 100%',\n        styled: '0 100% initial',\n      },\n      '&::placeholder': { recipe: 'input-placeholder' },\n    },\n\n    Measure: {\n      position: 'absolute',\n      visibility: 'hidden',\n      pointerEvents: 'none',\n      whiteSpace: 'pre',\n      preset: 'inherit',\n      height: 0,\n      overflow: 'hidden',\n    },\n\n    Placeholder: {\n      recipe: 'input-placeholder',\n      preset: 'inherit',\n    },\n  },\n});\n\nconst STYLE_PROPS = [...BLOCK_STYLES, ...OUTER_STYLES, ...COLOR_STYLES];\n\n// Grace window after a programmatic `startEditing()` during which a blur\n// re-focuses the input rather than committing. ~500ms covers the\n// Menu/Popover EXIT_DURATION (350ms in `Overlay.tsx`) with margin, since a\n// host that starts editing from a closing overlay is the case that needs the\n// widest window.\nconst PROGRAMMATIC_EDIT_BLUR_GRACE_MS = 500;\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Inline editable text. Renders the value as inline content by default and\n * swaps to an auto-sizing text input when entering edit mode.\n *\n * Designed to drop into any text context (tab title, heading, paragraph,\n * table cell) without style customization: typography, color, and font family\n * are all inherited from the parent.\n *\n * Value and `isEditing` can each be controlled or uncontrolled independently.\n * Programmatic entry via the imperative ref (`startEditing`/`stopEditing`)\n * works regardless of `editTrigger`.\n */\nexport const InlineInput = forwardRef<CubeInlineInputRef, CubeInlineInputProps>(\n  function InlineInput(allProps, ref) {\n    const {\n      value: valueProp,\n      defaultValue,\n      onChange,\n      isEditing: isEditingProp,\n      defaultIsEditing,\n      onEditingChange,\n      onSubmit,\n      onCancel,\n      editTrigger = 'dblclick',\n      keyboardActivation = true,\n      submitOnBlur = true,\n      trimOnSubmit = true,\n      allowEmpty = false,\n      isDisabled = false,\n      isReadOnly = false,\n      isStyled = false,\n      placeholder,\n      renderDisplay,\n      tooltip = true,\n      tooltipPlacement = 'top',\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledby,\n      qa,\n      qaVal,\n      styles: stylesProp,\n      inputStyles,\n      mods: customMods,\n      tokens: customTokens,\n      ...otherProps\n    } = allProps;\n\n    const isControlled = valueProp !== undefined;\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    const measureRef = useRef<HTMLSpanElement>(null);\n    const rootRef = useRef<HTMLSpanElement>(null);\n\n    const [value, setValue] = useControlledState<string>(\n      valueProp as string,\n      (defaultValue ?? '') as string,\n      onChange,\n    );\n\n    const [isEditing, setIsEditing] = useControlledState<boolean>(\n      isEditingProp as boolean,\n      (defaultIsEditing ?? false) as boolean,\n      onEditingChange,\n    );\n\n    // Optimistic value. Holds the just-committed value while we wait for the\n    // (potentially async) controlled parent to sync `value`. In uncontrolled\n    // mode `value` updates immediately so this stays null after each render.\n    const [optimisticValue, setOptimisticValue] = useState<string | null>(null);\n    const displayedValue = optimisticValue ?? value;\n\n    const [draft, setDraft] = useState<string>(value);\n    const [inputWidth, setInputWidth] = useState<number | null>(null);\n\n    // Reliable focus presence for the whole component, driven by\n    // `useFocusWithin` (which, unlike `useFocusRing`/`useFocus` on a bare\n    // span, has an element-removal fallback). Used to gate the display focus\n    // ring so it can never get stuck on after editing ends or after focus\n    // moves to another component.\n    const [isFocusWithin, setIsFocusWithin] = useState(false);\n\n    // Suppresses the display focus ring for a single programmatic focus\n    // restore (when we return focus to the display span after a keyboard /\n    // programmatic edit-end). Reset whenever focus truly leaves the component\n    // so a later real keyboard Tab back shows the ring again.\n    const [ringSuppressed, setRingSuppressed] = useState(false);\n\n    // Token to invalidate in-flight onSubmit promises if a newer commit /\n    // re-entry happens before they settle.\n    const submitTokenRef = useRef(0);\n\n    // Timestamp of the most recent programmatic `startEditing()` call (via\n    // the imperative ref). Used to defeat a focus-theft race: something else\n    // takes focus in the same tick the input mounts, and the resulting blur\n    // would fire `submitOnBlur` and unmount the input the user just opened.\n    //\n    // The thief varies by host — a host's own focus restoration (`TabButton`\n    // re-focuses the tab button when editing ends), a collection's focus\n    // manager, or an overlay closing around the `startEditing()` call. It is\n    // NOT the closing `Menu` popover: `MenuTrigger` leaves focus alone once\n    // an action has moved it (see CUB-3962). The guard is host-agnostic on\n    // purpose — the imperative path cannot know who else wants focus.\n    //\n    // Cleared on first user interaction inside the input (`handleInputChange`\n    // / `handleKeyDown`) and on leaving editing mode, so any later blur\n    // commits normally.\n    const programmaticEditStartRef = useRef<number | null>(null);\n\n    // Set when an edit-end should return focus to the display span (keyboard\n    // Enter/Escape, imperative `stopEditing`). NOT set for submit-on-blur /\n    // tab-away, where focus has already moved elsewhere. Consumed by a layout\n    // effect after the display span re-mounts.\n    const pendingRestoreFocusRef = useRef(false);\n\n    // Synchronous mirror of `isEditing`. We need this because cancel/commit\n    // call user callbacks (`onCancel`/`onSubmit`) that may synchronously\n    // re-focus another element — that causes a synchronous blur on the\n    // input which would otherwise re-enter `commit` via `onBlurWithin` (the\n    // state update from `setIsEditing(false)` isn't committed yet, so the\n    // closure still sees `isEditing === true`).\n    //\n    // The ref is kept in sync via `useLayoutEffect` so concurrent renders\n    // that get thrown away don't leak a stale value into the next commit.\n    const isEditingRef = useRef(isEditing);\n\n    useLayoutEffect(() => {\n      isEditingRef.current = isEditing;\n    }, [isEditing]);\n\n    // Clear the optimistic value once `value` catches up or changes externally.\n    useEffect(() => {\n      setOptimisticValue(null);\n    }, [value]);\n\n    const enterEditing = useEvent(() => {\n      if (isDisabled || isReadOnly || isEditing) return;\n      // Invalidate any in-flight onSubmit promise — its outcome no longer\n      // matters because the user is about to commit a new value anyway.\n      submitTokenRef.current += 1;\n      isEditingRef.current = true;\n      // Start from the actual prop value, not optimistic — gives the user a\n      // way to recover if a previous commit was rejected by the parent.\n      setOptimisticValue(null);\n      setDraft(value);\n      setIsEditing(true);\n    });\n\n    // Whether an edit-end should return focus to the display span. Only when\n    // this component owns its own keyboard/focus story (standalone usage).\n    // Hosts that drive editing through `ref.startEditing()` with\n    // `keyboardActivation={false}` (e.g. `Tabs`) keep ownership of focus.\n    const canRestoreFocus = () =>\n      keyboardActivation &&\n      editTrigger !== 'none' &&\n      !isDisabled &&\n      !isReadOnly;\n\n    const commit = useEvent((rawValue: string, restoreFocus = true) => {\n      // Re-entry guard. `onSubmit`/`onCancel` may synchronously refocus and\n      // trigger another blur-driven commit before the state update lands.\n      if (!isEditingRef.current) return;\n\n      const next = trimOnSubmit ? rawValue.trim() : rawValue;\n\n      if (restoreFocus && canRestoreFocus()) {\n        pendingRestoreFocusRef.current = true;\n      }\n\n      if (!next && !allowEmpty) {\n        isEditingRef.current = false;\n        programmaticEditStartRef.current = null;\n        setIsEditing(false);\n        onCancel?.();\n\n        return;\n      }\n\n      const token = ++submitTokenRef.current;\n\n      if (isControlled) {\n        // Show the new value optimistically until the parent re-renders.\n        setOptimisticValue(next);\n      }\n      isEditingRef.current = false;\n      programmaticEditStartRef.current = null;\n      setValue(next);\n      setIsEditing(false);\n\n      const result = onSubmit?.(next);\n      // If onSubmit returns a Promise that rejects, the parent is signalling\n      // a save failure — revert the optimistic value back to the actual prop.\n      // We guard with a token so a slow rejection doesn't clobber a newer\n      // commit's optimistic display.\n      if (\n        result != null &&\n        typeof (result as Promise<unknown>).then === 'function'\n      ) {\n        (result as Promise<unknown>).then(\n          () => {},\n          () => {\n            if (submitTokenRef.current === token && isControlled) {\n              setOptimisticValue(null);\n            }\n          },\n        );\n      }\n    });\n\n    const cancel = useEvent((restoreFocus = true) => {\n      if (!isEditingRef.current) return;\n      if (restoreFocus && canRestoreFocus()) {\n        pendingRestoreFocusRef.current = true;\n      }\n      isEditingRef.current = false;\n      programmaticEditStartRef.current = null;\n      setIsEditing(false);\n      onCancel?.();\n    });\n\n    // Keep draft in sync with the external value while NOT editing.\n    useEffect(() => {\n      if (!isEditing) setDraft(value);\n    }, [value, isEditing]);\n\n    // Select all text synchronously when entering edit mode.\n    useLayoutEffect(() => {\n      if (!isEditing) return;\n      inputRef.current?.select();\n    }, [isEditing]);\n\n    // Return focus to the display span after a keyboard / programmatic\n    // edit-end so keyboard navigation continues from this control. The focus\n    // is programmatic (react-aria treats it as non-keyboard) and we set\n    // `ringSuppressed` so it does not draw a focus ring; a later real Tab to\n    // the element resets the suppression (see `onFocusWithinChange`).\n    //\n    // `onSubmit`/`onCancel` may synchronously move focus elsewhere. When the\n    // input unmounts, the browser drops focus to `<body>`, so we only restore\n    // focus to the display span when focus actually landed there (or nowhere).\n    // If a handler deliberately moved focus to another element, we leave it.\n    useLayoutEffect(() => {\n      if (isEditing || !pendingRestoreFocusRef.current) return;\n      pendingRestoreFocusRef.current = false;\n\n      const root = rootRef.current;\n      if (!root) return;\n\n      const active = root.ownerDocument.activeElement;\n      const focusLost = !active || active === root.ownerDocument.body;\n      // A handler moved focus to a real element outside this control — respect\n      // it and don't pull focus back.\n      if (!focusLost && !root.contains(active)) return;\n\n      setRingSuppressed(true);\n      root.focus();\n    }, [isEditing]);\n\n    // Measure the draft so the input width follows the typed glyphs.\n    useLayoutEffect(() => {\n      if (!isEditing) return;\n      const measure = measureRef.current;\n\n      if (!measure) return;\n      setInputWidth(measure.scrollWidth);\n    }, [isEditing, draft, placeholder]);\n\n    const handleKeyDown = useEvent((e: KeyboardEvent<HTMLInputElement>) => {\n      // User is interacting with the input — drop the post-`startEditing()`\n      // blur guard so a subsequent click-away commits normally.\n      programmaticEditStartRef.current = null;\n\n      if (e.key === 'Enter') {\n        e.preventDefault();\n        commit(draft);\n\n        return;\n      }\n\n      if (e.key === 'Escape') {\n        e.preventDefault();\n        cancel();\n\n        return;\n      }\n\n      // Prevent the host (e.g. Tabs) from intercepting text-editing keys.\n      if (\n        e.key === 'ArrowLeft' ||\n        e.key === 'ArrowRight' ||\n        e.key === ' ' ||\n        e.key === 'Delete' ||\n        e.key === 'Backspace'\n      ) {\n        e.stopPropagation();\n      }\n    });\n\n    const handleInputChange = useEvent((e: ChangeEvent<HTMLInputElement>) => {\n      programmaticEditStartRef.current = null;\n      setDraft(e.target.value);\n    });\n\n    // Keyboard focus-visible modality (mouse vs keyboard). Used together with\n    // `isFocusWithin` to drive the display focus ring. We rely on\n    // `useFocusWithin` (below) for the *presence* of focus because, unlike\n    // `useFocusRing`/`useFocus` on a bare span, it has an element-removal\n    // fallback — so the ring can never get stuck on after the inner input is\n    // unmounted on edit-end or after focus moves away.\n    const { isFocusVisible, focusProps: focusRingProps } = useFocusRing();\n\n    // Always enabled so it reliably reports focus presence in BOTH display\n    // and edit modes. The submit-on-blur logic is internally guarded by\n    // `isEditingRef`, so running `onBlurWithin` in display mode is a no-op.\n    const { focusWithinProps } = useFocusWithin({\n      onFocusWithinChange: (within) => {\n        setIsFocusWithin(within);\n        // Once focus truly leaves the component, clear the one-shot ring\n        // suppression so a later real keyboard Tab back shows the ring again.\n        if (!within) setRingSuppressed(false);\n      },\n      onBlurWithin: () => {\n        if (!isEditingRef.current) return;\n        if (!submitOnBlur) return;\n\n        // Spurious-blur guard. `useFocusWithin` fires a synthetic blur via its\n        // element-removal fallback when the display span unmounts as we enter\n        // edit mode (focus actually moved INTO the inner input). Ignore it if\n        // focus is in fact still within the component.\n        const active = rootRef.current?.ownerDocument.activeElement;\n        if (active && rootRef.current?.contains(active)) return;\n\n        // Grace-period guard against focus theft right after a programmatic\n        // `startEditing()` — see `programmaticEditStartRef` for who steals it.\n        // Re-focus the input on the next frame so the focus-stealing element\n        // finishes its own handler first, then we steal focus back. The guard\n        // is cleared on the first real user interaction with the input\n        // (keydown / input change) so subsequent click-aways commit normally.\n        const startedAt = programmaticEditStartRef.current;\n        if (\n          startedAt != null &&\n          Date.now() - startedAt < PROGRAMMATIC_EDIT_BLUR_GRACE_MS &&\n          isEditingRef.current\n        ) {\n          requestAnimationFrame(() => {\n            if (isEditingRef.current) {\n              inputRef.current?.focus();\n              inputRef.current?.select();\n            }\n          });\n\n          return;\n        }\n\n        // Focus has already moved elsewhere (tab-away / click-away), so do\n        // NOT pull it back to the display span.\n        commit(draft, false);\n      },\n    });\n\n    const handleDblClick = useEvent((e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      enterEditing();\n    });\n\n    const handleClick = useEvent((e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      enterEditing();\n    });\n\n    // Keyboard activation from the display element (standalone usage).\n    // Hosts that own keyboard handling themselves should pass\n    // `keyboardActivation={false}` (see `TabButton` for an example).\n    const handleRootKeyDown = useEvent((e: KeyboardEvent<HTMLSpanElement>) => {\n      if (e.key === 'Enter' || e.key === 'F2' || e.key === ' ') {\n        e.preventDefault();\n        e.stopPropagation();\n        enterEditing();\n      }\n    });\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        startEditing: () => {\n          // Arm the grace-period blur guard for the imperative path only.\n          // Pointer-triggered entries (dblclick / click) don't suffer from\n          // the focus-theft race that motivates this guard — the user's own\n          // press is what put focus here.\n          const wasEditing = isEditingRef.current;\n          enterEditing();\n          if (!wasEditing && isEditingRef.current) {\n            programmaticEditStartRef.current = Date.now();\n          }\n        },\n        stopEditing: (submit = true) => {\n          if (!isEditingRef.current) return;\n          if (submit) commit(draft);\n          else cancel();\n        },\n        focus: () => {\n          if (isEditingRef.current) inputRef.current?.focus();\n          else rootRef.current?.focus();\n        },\n        getValue: () => displayedValue,\n      }),\n      [enterEditing, commit, cancel, draft, displayedValue],\n    );\n\n    const isEditable = editTrigger !== 'none' && !isDisabled && !isReadOnly;\n\n    // `focused` controls the visible focus indicator on the root.\n    //\n    // While editing, the inner `<input>` always has focus (FocusScope\n    // `autoFocus`), so we show the focus indicator on the root regardless\n    // of how the user activated edit mode (click vs keyboard).\n    //\n    // In display mode we show the indicator only on keyboard focus\n    // (`isFocusVisible`) AND when focus is actually within the component\n    // (`isFocusWithin`) AND the display element is focusable (`isEditable`).\n    // The `isFocusWithin` gate is the key fix: it reliably drops to `false`\n    // on edit-end / tab-away (it has an element-removal fallback that\n    // `useFocusRing` lacks on a bare span), so the ring can never get stuck\n    // on. `ringSuppressed` hides the ring for a single programmatic focus\n    // restore after a keyboard / programmatic edit-end.\n    //\n    // When `keyboardActivation` is `false` the host (e.g. `Tabs`) owns the\n    // entire focus story for this control, so we suppress the focus ring\n    // entirely — including while editing — to avoid drawing a redundant\n    // indicator on top of the host's own focus ring.\n    const showFocusRing =\n      keyboardActivation &&\n      (isEditing ||\n        (isFocusVisible && isFocusWithin && isEditable && !ringSuppressed));\n\n    const mods = useMemo(\n      () => ({\n        editing: isEditing,\n        editable: isEditable,\n        focused: showFocusRing,\n        disabled: isDisabled,\n        'read-only': isReadOnly,\n        styled: isStyled,\n        empty: !displayedValue,\n        ...customMods,\n      }),\n      [\n        isEditing,\n        isEditable,\n        showFocusRing,\n        isDisabled,\n        isReadOnly,\n        isStyled,\n        displayedValue,\n        customMods,\n      ],\n    );\n\n    const mergedStyles = useMemo<Styles | undefined>(() => {\n      if (!stylesProp && !inputStyles) return undefined;\n      if (!inputStyles) return stylesProp;\n      const existingInput =\n        (stylesProp?.Input as Styles | undefined) ?? undefined;\n\n      return {\n        ...stylesProp,\n        Input: existingInput\n          ? { ...existingInput, ...inputStyles }\n          : inputStyles,\n      };\n    }, [stylesProp, inputStyles]);\n\n    const extractedStyles = extractStyles(\n      otherProps,\n      STYLE_PROPS,\n      mergedStyles,\n    );\n\n    const tokens = useMemo(\n      () => ({\n        ...customTokens,\n        '$input-width': inputWidth != null ? `${inputWidth}px` : 'auto',\n      }),\n      [customTokens, inputWidth],\n    );\n\n    // In display mode, render the placeholder when the value is empty so the\n    // component remains visible / clickable. Consumers using `renderDisplay`\n    // take full control and are responsible for handling empty values\n    // themselves.\n    const displayContent = renderDisplay\n      ? renderDisplay(displayedValue)\n      : displayedValue ||\n        (placeholder ? (\n          <span data-element=\"Placeholder\">{placeholder}</span>\n        ) : (\n          ''\n        ));\n\n    const baseProps = filterBaseProps(otherProps, { eventProps: true });\n\n    // Overflow detection / auto-tooltip. Suppressed while editing (the input\n    // owns the visible text and isn't truncated), and when the consumer\n    // provides `renderDisplay` (they own the display story and should attach\n    // their own tooltip if needed).\n    const { labelRef: tooltipLabelRef, renderWithTooltip } = useAutoTooltip({\n      tooltip: isEditing || renderDisplay ? false : tooltip,\n      children: displayedValue,\n    });\n\n    // Wire pointer/keyboard activators only when relevant. Hosts that drive\n    // editing through `ref.startEditing()` keep all of these `undefined` so\n    // they don't intercept their own keyboard / focus story.\n    const wantsClick = !isEditing && isEditable && editTrigger === 'click';\n    const wantsDblClick =\n      !isEditing && isEditable && editTrigger === 'dblclick';\n    const wantsKeyboard = !isEditing && isEditable && keyboardActivation;\n\n    const renderRoot = (\n      triggerProps?: HTMLAttributes<HTMLElement>,\n      tooltipRef?: RefObject<HTMLElement>,\n    ) => {\n      const handleRootRef = (element: HTMLSpanElement | null) => {\n        rootRef.current = element;\n        if (tooltipRef) {\n          (tooltipRef as { current: HTMLElement | null }).current = element;\n        }\n      };\n\n      // Overflow detection has to look at the truncating element, which is now\n      // the inner `Display` (the root is `inline-flex` and doesn't clip). The\n      // tooltip still anchors to the root via `tooltipRef` above.\n      const handleDisplayRef = (element: HTMLSpanElement | null) => {\n        tooltipLabelRef(element);\n      };\n\n      const a11yProps: HTMLAttributes<HTMLElement> = {};\n\n      if (wantsKeyboard) {\n        a11yProps.tabIndex = 0;\n        a11yProps.role = 'button';\n        a11yProps['aria-roledescription'] = 'editable text';\n        if (ariaLabel) a11yProps['aria-label'] = ariaLabel;\n        if (ariaLabelledby) a11yProps['aria-labelledby'] = ariaLabelledby;\n      }\n\n      if (isDisabled) a11yProps['aria-disabled'] = true;\n      if (isReadOnly) a11yProps['aria-readonly'] = true;\n\n      return (\n        <InlineInputRoot\n          ref={handleRootRef}\n          qa={qa ?? 'InlineInput'}\n          qaVal={qaVal}\n          mods={mods}\n          tokens={tokens}\n          styles={extractedStyles}\n          {...mergeProps(\n            baseProps,\n            focusWithinProps,\n            // Always attach focusRingProps so the hook sees the blur event\n            // when focus moves into the inner input on edit-mode entry. If\n            // we only attached them while `wantsKeyboard` is true, the hook\n            // would miss the blur (since `wantsKeyboard` flips to false the\n            // moment editing starts), leaving `isFocused` stale and the\n            // ring stuck on after editing ends. `useFocusRing` filters\n            // bubbled focus from descendants internally (`target ===\n            // currentTarget`), so spreading these on a non-focusable span\n            // is a no-op.\n            focusRingProps,\n            triggerProps ?? {},\n            {\n              onDoubleClick: wantsDblClick ? handleDblClick : undefined,\n              onClick: wantsClick ? handleClick : undefined,\n              onKeyDown: wantsKeyboard ? handleRootKeyDown : undefined,\n              ...a11yProps,\n            },\n          )}\n        >\n          {isEditing ? (\n            <FocusScope autoFocus restoreFocus={false} contain={false}>\n              <span ref={measureRef} data-element=\"Measure\" aria-hidden=\"true\">\n                {draft || placeholder || ' '}\n              </span>\n              <input\n                ref={inputRef}\n                data-element=\"Input\"\n                type=\"text\"\n                value={draft}\n                placeholder={placeholder}\n                disabled={isDisabled}\n                readOnly={isReadOnly}\n                aria-label={ariaLabel}\n                aria-labelledby={ariaLabelledby}\n                onChange={handleInputChange}\n                onKeyDown={handleKeyDown}\n              />\n            </FocusScope>\n          ) : (\n            <span ref={handleDisplayRef} data-element=\"Display\">\n              {displayContent}\n            </span>\n          )}\n        </InlineInputRoot>\n      );\n    };\n\n    return renderWithTooltip(renderRoot, tooltipPlacement);\n  },\n);\n"],"mappings":"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"}

package/dist/components/content/Item/Item.d.ts

@@ -84,8 +84,8 @@ interface CubeItemProps extends BaseProps, ContainerStyleProps {
    */
   disableActionsFocus?: boolean;
   size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'inline' | number | (string & {});
-  type?: 'item' | 'header' | 'primary' | 'outline' | 'outline-2' | 'clear' | 'link' | 'card' | 'current' | (string & {});
-  theme?: 'default' | 'danger' | 'success' | 'special' | 'warning' | 'note' | (string & {});
+  type?: 'item' | 'header' | 'primary' | 'outline' | 'outline-2' | 'clear' | 'link' | 'card' | (string & {});
+  theme?: 'default' | 'danger' | 'success' | 'special' | 'warning' | 'note' | 'current' | (string & {});
   /** Keyboard shortcut that triggers the element when pressed */
   hotkeys?: string;
   /**

package/dist/components/content/Item/Item.js

@@ -1,10 +1,10 @@
-/** @license MIT | @cube-dev/ui-kit v0.162.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.164.0 | Cube Dev Team */
 import { getDisabledElementProps, omitActivationEventProps } from "../../../utils/react/disabledProps.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { resolveIcon } from "../../../utils/react/resolveIcon.js";
 import { highlightText } from "../highlightText.js";
 import { useAutoTooltip } from "../use-auto-tooltip.js";
-import { CURRENT_ITEM_STYLES, DANGER_CARD_STYLES, DANGER_CLEAR_STYLES, DANGER_ITEM_STYLES, DANGER_LINK_STYLES, DANGER_OUTLINE_2_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CARD_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_ITEM_STYLES, DEFAULT_LINK_STYLES, DEFAULT_OUTLINE_2_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, NOTE_CARD_STYLES, NOTE_CLEAR_STYLES, NOTE_ITEM_STYLES, NOTE_LINK_STYLES, NOTE_OUTLINE_2_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_ITEM_STYLES, SPECIAL_LINK_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CARD_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_ITEM_STYLES, SUCCESS_LINK_STYLES, SUCCESS_OUTLINE_2_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, WARNING_CARD_STYLES, WARNING_CLEAR_STYLES, WARNING_ITEM_STYLES, WARNING_LINK_STYLES, WARNING_OUTLINE_2_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES } from "../../../data/item-themes.js";
+import { ITEM_VARIANTS, resolveItemVariant } from "../../../data/item-themes.js";
 import { CheckIcon } from "../../../icons/CheckIcon.js";
 import { LoadingIcon } from "../../../icons/LoadingIcon.js";
 import { ItemActionProvider } from "../../actions/ItemActionContext.js";
@@ -280,49 +280,7 @@ const ItemElement = tasty({
 			"$side-padding": "(($size - $action-size - 2bw) / 2)"
 		}
 	},
-	variants: {
-		"default.current": CURRENT_ITEM_STYLES,
-		"default.primary": DEFAULT_PRIMARY_STYLES,
-		"default.outline": DEFAULT_OUTLINE_STYLES,
-		"default.outline-2": DEFAULT_OUTLINE_2_STYLES,
-		"default.clear": DEFAULT_CLEAR_STYLES,
-		"default.link": DEFAULT_LINK_STYLES,
-		"default.item": DEFAULT_ITEM_STYLES,
-		"default.card": DEFAULT_CARD_STYLES,
-		"danger.primary": DANGER_PRIMARY_STYLES,
-		"danger.outline": DANGER_OUTLINE_STYLES,
-		"danger.outline-2": DANGER_OUTLINE_2_STYLES,
-		"danger.clear": DANGER_CLEAR_STYLES,
-		"danger.link": DANGER_LINK_STYLES,
-		"danger.item": DANGER_ITEM_STYLES,
-		"danger.card": DANGER_CARD_STYLES,
-		"success.primary": SUCCESS_PRIMARY_STYLES,
-		"success.outline": SUCCESS_OUTLINE_STYLES,
-		"success.outline-2": SUCCESS_OUTLINE_2_STYLES,
-		"success.clear": SUCCESS_CLEAR_STYLES,
-		"success.link": SUCCESS_LINK_STYLES,
-		"success.item": SUCCESS_ITEM_STYLES,
-		"success.card": SUCCESS_CARD_STYLES,
-		"warning.primary": WARNING_PRIMARY_STYLES,
-		"warning.outline": WARNING_OUTLINE_STYLES,
-		"warning.outline-2": WARNING_OUTLINE_2_STYLES,
-		"warning.clear": WARNING_CLEAR_STYLES,
-		"warning.link": WARNING_LINK_STYLES,
-		"warning.item": WARNING_ITEM_STYLES,
-		"warning.card": WARNING_CARD_STYLES,
-		"note.primary": NOTE_PRIMARY_STYLES,
-		"note.outline": NOTE_OUTLINE_STYLES,
-		"note.outline-2": NOTE_OUTLINE_2_STYLES,
-		"note.clear": NOTE_CLEAR_STYLES,
-		"note.link": NOTE_LINK_STYLES,
-		"note.item": NOTE_ITEM_STYLES,
-		"note.card": NOTE_CARD_STYLES,
-		"special.primary": SPECIAL_PRIMARY_STYLES,
-		"special.outline": SPECIAL_OUTLINE_STYLES,
-		"special.clear": SPECIAL_CLEAR_STYLES,
-		"special.link": SPECIAL_LINK_STYLES,
-		"special.item": SPECIAL_ITEM_STYLES
-	},
+	variants: ITEM_VARIANTS,
 	styleProps: CONTAINER_STYLES
 });
 const Item = (props, ref) => {
@@ -332,23 +290,21 @@ const Item = (props, ref) => {
 	const finalShape = shape ?? (type === "card" ? "card" : "button");
 	const isDisabledProp = isDisabled ?? (nativeDisabledProp || void 0);
 	const finalIsDisabled = isDisabledProp === true || isLoading && isDisabledProp !== false;
-	useWarn(type === "header" && !["default"].includes(theme) || type === "current" && !["default"].includes(theme) || type === "card" && ![
+	useWarn(type === "header" && !["default"].includes(theme) || type === "card" && ![
 		"default",
 		"success",
 		"danger",
 		"warning",
-		"note"
-	].includes(theme) || ![
-		"header",
-		"current",
-		"card"
-	].includes(type) && ![
+		"note",
+		"current"
+	].includes(theme) || !["header", "card"].includes(type) && ![
 		"default",
 		"success",
 		"danger",
 		"warning",
 		"note",
-		"special"
+		"special",
+		"current"
 	].includes(theme), {
 		key: [
 			"Item",
@@ -356,7 +312,7 @@ const Item = (props, ref) => {
 			type,
 			theme
 		],
-		args: [`Item: Invalid type+theme combination. type="${type}" does not support theme="${theme}".` + (type === "header" ? " The \"header\" type only supports theme: default." : type === "current" ? " The \"current\" type derives every color from the inherited text color and only supports theme: default." : type === "card" ? " The \"card\" type only supports themes: default, success, danger, warning, note." : " Standard types support themes: default, success, danger, warning, note, special.")]
+		args: [`Item: Invalid type+theme combination. type="${type}" does not support theme="${theme}".` + (type === "header" ? " The \"header\" type only supports theme: default." : type === "card" ? " The \"card\" type only supports themes: default, success, danger, warning, note, current." : " Standard types support themes: default, success, danger, warning, note, special, current.")]
 	});
 	const hasLinkWithIcons = type === "link" && (iconProp || rightIconProp);
 	const hasLinkWithLoading = type === "link" && isLoading;
@@ -424,9 +380,10 @@ const Item = (props, ref) => {
 	const iconKey = hasCheckmark ? "checkmark" : isLoading && resolvedLoadingSlot === "icon" ? "loading" : isValidElement(finalIcon) ? finalIcon.type?.displayName || finalIcon.type?.name || "icon" : finalIcon ? "icon" : "empty";
 	const rightIconKey = isLoading && resolvedLoadingSlot === "rightIcon" ? "loading" : isValidElement(finalRightIcon) ? finalRightIcon.type?.displayName || finalRightIcon.type?.name || "icon" : finalRightIcon ? "icon" : "empty";
 	const finalPrefix = isLoading && resolvedLoadingSlot === "prefix" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : prefix;
+	const hotkeysType = theme === "current" ? "inherit" : type === "primary" ? "primary" : "default";
 	const finalSuffix = isLoading && resolvedLoadingSlot === "suffix" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : suffix ?? (hotkeys ? /* @__PURE__ */ jsx(_HotKeys, {
 		...keyboardShortcutProps,
-		type: type === "primary" ? "primary" : "default",
+		type: hotkeysType,
 		styles: {
 			padding: "1x left",
 			opacity: finalIsDisabled ? .5 : 1
@@ -514,11 +471,9 @@ const Item = (props, ref) => {
 			else if (ref) ref.current = element;
 			if (tooltipRef) tooltipRef.current = element;
 		};
-		const effectiveType = theme === "special" && type === "outline-2" ? "outline" : type;
-		const variantType = effectiveType === "header" ? "item" : effectiveType;
 		return /* @__PURE__ */ jsxs(ItemElement, {
 			ref: handleRef,
-			variant: theme && variantType ? `${effectiveType === "header" || effectiveType === "current" ? "default" : theme}.${variantType}` : void 0,
+			variant: theme && type ? resolveItemVariant(theme, type) : void 0,
 			disabled: isNativelyDisabled,
 			"aria-disabled": finalIsDisabled,
 			"aria-selected": isSelected,