@cube-dev/ui-kit 0.0.0-canary-0b79a39 → 0.0.0-canary-c02e70f

package/dist/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @cube-dev/ui-kit
 
+## 0.185.3
+
+### Patch Changes
+
+- [#1439](https://github.com/cube-js/cube-ui-kit/pull/1439) [`5f65c6a2`](https://github.com/cube-js/cube-ui-kit/commit/5f65c6a2ffda8ac5e60e114ccb06154478843045) Thanks [@tenphi](https://github.com/tenphi)! - Switching between keyboard and pointer input no longer re-renders every button, checkbox, switch, select and radio on the page. Their focus state now listens for the input modality only while the element is focused, so a click after a Tab or Escape press re-renders one element instead of all of them.
+
 ## 0.185.2
 
 ### Patch Changes

package/dist/_internal/hooks/use-debounced-value.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { c } from "react-compiler-runtime";
 import { useEffect, useRef, useState } from "react";
 

package/dist/_internal/hooks/use-deprecation-warning.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { deprecationWarning } from "../../utils/warnings.js";
 import { c } from "react-compiler-runtime";
 import React, { useEffect } from "react";

package/dist/_internal/hooks/use-event.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { useSyncRef } from "./use-sync-ref.js";
 import { useCallback } from "react";
 

package/dist/_internal/hooks/use-is-first-render.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { useRef } from "react";
 
 //#region src/_internal/hooks/use-is-first-render.ts

package/dist/_internal/hooks/use-sync-ref.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../utils/react/useLayoutEffect.js";
 import { c } from "react-compiler-runtime";
 import { useRef } from "react";

package/dist/_internal/hooks/use-timer/timer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 //#region src/_internal/hooks/use-timer/timer.ts
 var Timer = class {
 	callback;

package/dist/_internal/hooks/use-timer/use-timer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { useEvent } from "../use-event.js";
 import { Timer } from "./timer.js";
 import { c } from "react-compiler-runtime";

package/dist/_internal/hooks/use-warn.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { useEvent } from "./use-event.js";
 import { warn } from "../../utils/warnings.js";
 import { useRef } from "react";

package/dist/components/Block.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { extractStyles } from "../utils/styles.js";
 import { c } from "react-compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/CollectionItem.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { ItemAction } from "./actions/ItemAction/ItemAction.js";
 import { ItemBadge } from "./content/ItemBadge/ItemBadge.js";
 import { Item } from "react-stately";

package/dist/components/GlobalStyles.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { usePaletteValue } from "../tokens/palette-config.js";
 import { getTokens } from "../tokens/all-tokens.js";
 import { c } from "react-compiler-runtime";
@@ -267,26 +267,28 @@ function GlobalStyles(props) {
 	const $ = c(8);
 	const { bodyStyles, font, monospaceFont } = props;
 	const tokens = usePaletteValue(getTokens);
-	let styles;
+	let t0;
 	if ($[0] !== bodyStyles || $[1] !== tokens) {
-		styles = { ...tokens };
-		Object.assign(styles, BODY_STYLES);
-		if (bodyStyles) Object.assign(styles, bodyStyles);
+		t0 = {
+			...tokens,
+			...BODY_STYLES,
+			...bodyStyles
+		};
 		$[0] = bodyStyles;
 		$[1] = tokens;
-		$[2] = styles;
-	} else styles = $[2];
-	const bodyTokenStyles = styles;
-	let t0;
-	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-		t0 = { id: "cube-ui-kit-tokens" };
-		$[3] = t0;
-	} else t0 = $[3];
-	useGlobalStyles("body", bodyTokenStyles, t0);
+		$[2] = t0;
+	} else t0 = $[2];
+	const bodyTokenStyles = t0;
 	let t1;
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = { id: "cube-ui-kit-tokens" };
+		$[3] = t1;
+	} else t1 = $[3];
+	useGlobalStyles("body", bodyTokenStyles, t1);
 	let t2;
+	let t3;
 	if ($[4] !== font || $[5] !== monospaceFont) {
-		t1 = () => {
+		t2 = () => {
 			return `
   html {
     overscroll-behavior-y: none;
@@ -295,16 +297,16 @@ function GlobalStyles(props) {
   }
 ${STATIC_CSS}`;
 		};
-		t2 = [font, monospaceFont];
+		t3 = [font, monospaceFont];
 		$[4] = font;
 		$[5] = monospaceFont;
-		$[6] = t1;
-		$[7] = t2;
+		$[6] = t2;
+		$[7] = t3;
 	} else {
-		t1 = $[6];
-		t2 = $[7];
+		t2 = $[6];
+		t3 = $[7];
 	}
-	useRawCSS(t1, t2);
+	useRawCSS(t2, t3);
 	return null;
 }
 

package/dist/components/GlobalStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"GlobalStyles.js","names":["useGlobalStyles","useRawCSS","useMemo","getTokens","usePaletteValue","Styles","GlobalStylesProps","bodyStyles","key","fonts","fontDisplay","publicUrl","font","monospaceFont","applyLegacyTokens","BODY_STYLES","overscrollBehaviorY","fill","fontFamily","margin","padding","color","preset","letterSpacing","STATIC_CSS","GlobalStyles","props","$","_c","tokens","styles","Object","assign","bodyTokenStyles","t0","Symbol","for","id","t1","t2","fontValue","monospaceFontValue"],"sources":["../../src/components/GlobalStyles.tsx"],"sourcesContent":["import { useGlobalStyles, useRawCSS } from '@tenphi/tasty';\nimport { useMemo } from 'react';\n\nimport { getTokens } from '../tokens';\nimport { usePaletteValue } from '../tokens/palette-config';\n\nimport type { Styles } from '@tenphi/tasty';\n\ninterface GlobalStylesProps {\n  bodyStyles?: { [key: string]: string };\n  fonts?: boolean;\n  fontDisplay?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional';\n  publicUrl?: string;\n  font?: string;\n  monospaceFont?: string;\n  /** @deprecated Tokens are now always applied via useGlobalStyles */\n  applyLegacyTokens?: boolean;\n}\n\n/**\n * Body styles applied via useGlobalStyles.\n *\n * `fill` and `color` use scheme-aware Glaze tokens so the whole page flips\n * automatically when `<html data-scheme=\"dark\">` (or `prefers-color-scheme: dark`)\n * is active — see `src/tokens/palette.ts` and `src/components/Root.tsx`.\n */\nconst BODY_STYLES: Styles = {\n  overscrollBehaviorY: 'none',\n  fill: '#surface',\n  fontFamily: 'var(--font-sans)',\n  '-webkit-font-smoothing': 'antialiased',\n  '-moz-osx-font-smoothing': 'grayscale',\n  margin: 0,\n  padding: 0,\n  color: '#surface-text-soft',\n  preset: 't3',\n  letterSpacing: '0.02em',\n};\n\n// Static CSS that doesn't depend on props\nconst STATIC_CSS = `\n  @font-face {\n    font-family: text-security-disc;\n    src: url(data:font/woff2;base64,d09GMgABAAAAAAjoAAsAAAAAMGgAAAidAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGVgDWYgpQdQE2AiQDCAsGAAQgBYUOBy4bvi8lYxtWw7BxAPB87x5FmeAMlf3/96RzDN74RcXUcjTKmrJ3T2VDSShiPhfiIJxxS7DiLkHFfQV33CM4427mAred74pWur/J3dyVsKy7coREA8fzvPvpfUk+tB3R8YTCzE0SCLepejmJ2u1yqp+kC7W4Rc/tDTs3GpNJ8ttRPOSTPhsXlwbi4kVYWQmAcXmlrqYHMMsBwP/zHMz7fkF1gijOKuFQIxjwlGa2lkARhYaBxFHT54IOgBMQADi3LipIMAA3geO41EUkBTCO2gkxnOwnKYBx1E6p5WS+QUCMq50rNch6MwUCAAiAcdgttYVSIfPJ5kn6ApRFQ6I88BxLvvIC/maHUHS3TIoKiwLbbM8nEFWgE1oDz3woSxpagWbBXcQWhKtPeIlg6tK+7vX57QOszwU3sGUJrA7h2Mx1IWCNr9BKxsYo+pzS/OCO0OG9mwBkx337+lcuSxRdBcc+fJxlcAjK/zCfdgtBzuxQcTqfY4Yn6EB/Az3JS/RMu5f6B8wrn55S0IxdlLn+4Yb/ctIT+ocWYPcGAOvxSjEjpSiVMqSgFWVjzpCCXjAIRirTABpEQ2gYjaBRNIbG0QSaRFNoGs2gWTSH5tECWkRLaBmtoFW0htbRBtpEW2gb7aBdtIf20QE6REdFDlkZEh2jE3SKztA5ukCX6Apdoxt0i+7QPXpAj+gJPaMX9Ire0Dv6QJ/oC/qKvqHv6Af6iX6h3+gP+ov+of+I+ECMxETMiDmxIJbEilgTG2JL7Ig9cSCOxIk4ExfiStyIO/EgnsSLeBMf4kv8iD/taQANoiE0jEbQKBpD42gCTaIpNI1m0CyaQ/NoAS2iJbSMVtAqWkPraANtoi20jXbQLtpD++gAHaIjdIxO0Ck6Q+foAl2iK3SNbtAtukP36AE9oif0jF7QK3pD79B79AF9RJ/QZ/QFfUXf0Hf0A/1Ev9Bv9Af9Rf/Qf9DQABpEQ2gYjaBRNIbG0QSaRFNoGs2gWTSH5tECWkRLaBmtoFW0htbRBtpEW2gb7aBdtIf20QE6REfoGJ2gU3SGztEFukRX6BrdoFt0h+7RA3pET+gZvaBX9Aa9Re/Qe/QBfUSf0Gf0BX1F39B39AP9RL/Qb/QH/UX/0P8l9vq9gXwDIUCliyAhRAgTIoQoIUaIExKEJCFFSBMyhCwhR8gTCoQioUQoEyqEKqFGqBMahCahRWgTOoQuoUfoEwaEIWFEGBMmhClhRpgTFoQlYUVYEzaELWFH2BMOhGPCCeGUcEY4J1wQLglXhGvCDeGWcEe4JzwQHglPhGfCC+GV8EZ4J3wQPglfhG/CD+GX8Ef4p9sdgoQQIUyIEKKEGCFOSBCShBQhTcgQsoQcIU8oEIqEEqFMqBCqhBqhTmgkNBGaCS2EVkIboZ3QQegkdBG6CT2EXkIfoZ8wQBgkDBGGCSOEUcIYYZwwQZgkTBGmCTOEWcIcYZ6wQFgkLBGWCSuEVcIaYZ2wQdgkbBG2CTuEXcIeYZ9wQDgkHBGOCSeEU8IZ4ZxwQbgkXBGuCTeEW8Id4Z7wQHgkPBGeCS+EV8Ib4Z3wQfgkfBG+CT+EX8If4Z8AZpAQIoQJEUKUECPECQlCkpAipAkZQpaQI+QJBUKRUCKUCRVClVAj1AkNQpPQIrQJHUKX0CP0CQPCkDAijAkTwpQwI8wJC8KSsCKsCRvClrAj7AkHwpFwIpwJF8IV4ZpwQ7gl3BHuCQ+ER8IT4ZnwQnglvBHeCR+ET8IX4ZvwQ/gl/BH+lzv+AmMkTYAmSBOiCdNEaKI0MZo4TYImSZOiSdNkaLI0OZo8TYGmSFOiKdNUaKo0NZo6TYOmSdOiadN0aLo0PZo+zYBmSDOiGdNMaKY0M5o5zYJmSbOiWdNsaLY0O5o9zYHmmOaE5pTmjOac5oLmkuaK5prmhuaW5o7mnuaB5pHmieaZ5oXmleaN5p3mg+aT5ovmm+aH5pfmj2ZRAqCCoEKgwqAioKKgYqDioBKgkqBSoNKgMqCyoHKg8qAKoIqgSqDKoCqgqqBqoOqgGkE1gWoG1QKqFVQbqHZQHaA6QXWB6gbVA6oXVB+oflADoAZBDYH+uxaEWDBiIYiFIhaGWDhiEYhFIhaFWDRiMYjFIhaHWDxiCYglIpaEWDJiKYilIpaGWDpiGYhlIpaFWDZiOYjlIpaHWD5iBYgVIlaEWDFiJYiVIlaGWDliFYhVIlaFWDViNYjVIlaHWD1iDYg1ItaEWDNiLYi1ItaGWDtiHYh1ItaFWDdiPYj1ItaHWD9iA4gNIjaE2DBiI4iNIjaG2DhiE4hNIjaF2DRiM4jNIjaH2DxiC4gtIraE2DJiK4itIraG2DpiG4htIraF2DZiO4jtIraH2D5iB4gdInaE2DFiJ4idInaG2DliF4hdInaF2DViN4jdInaH2D1iD4g9IvaE2DNiL4i9IvaG2DvE3iP2AbGPiH1C7DNiXxD7itg3xL4j9gOxn4j9Quw3Yn8Q+4vYP8T+M6cIDBz9EXfeUHR1JyygPL/++I3R1cRvdDr+E12Jfh3Q0EN/fHn2mXptpJxUkIqu/Cs2egM33OjSLcT33I82+B9nP37X/c0W52623s45CYCo03QIBCVrAFAycnSYSqvO4YJt/NP73YqA/giNZhJ6sBbmql+0SQZaxNOZudJbc2nqxNvpM+veq7Sz2LUgFEu+VLs+Ay3yp7MVertp6i23v2Rmv5gmHDhSQ6t5GmTaqTsqhpWwmbOk3uKJrNOmwSSMC17jghqygilDOUU3KlLmHHNrajw3DVNVGWytGZDisM/cbkdRnvfIUJkaGJlgAYcoQ5bGptTmGc1R7pBC3XhFsLXnXR54qrMc+dGNBkqE4laBi4KmZYGom8vIy0lTyBkppBjLoTndMmrofIRORirsNlCbXzCgulmo36KztS2iV8rrNoRUL5VdkMSGoSXroC1KOQAA) format('woff2');\n  }\n\n  kbd {\n    font-family: var(--c2-font-family);\n    font-weight: var(--c2-font-weight);\n    font-size: var(--c2-font-size);\n    border: var(--border-width) solid var(--dark-04-color);\n    background-color: var(--surface-color);\n    color: var(--dark-color);\n    border-radius: var(--radius);\n    padding: 0 var(--outline-width);\n  }\n\n  :not([data-qa$=\"Icon\"]) > .tabler-icon {\n    font-size: var(--icon-size);\n    width: 1em;\n    height: 1em;\n    min-width: 1em;\n    min-height: 1em;\n    max-height: 1em;\n    stroke-width: var(--stroke-width);\n  }\n\n  .cube-animation-spin {\n    animation: cube-animation-spin 1s linear infinite;\n  }\n\n  @keyframes cube-animation-spin {\n    from {\n        transform: rotate(0deg);\n    }\n    to {\n        transform: rotate(360deg);\n    }\n  }\n\n  b, strong {\n    font-weight: var(--bold-font-weight, 700);\n  }\n\n  [type=reset], [type=submit], button, html [type=button] {\n    -webkit-appearance: none;\n  }\n\n  code {\n    font-family: var(--font-mono);\n  }\n\n  /*\n   * Prism syntax highlighting.\n   *\n   * All token colors come from the scheme-aware Glaze \\`code-*\\` palette\n   * (defined in src/tokens/palette.ts). Each \\`code-*\\` token has \\`mode: 'auto'\\`\n   * with a numeric contrast floor of 4.5 against \\`#surface\\` so every token\n   * reads at WCAG AA in light AND dark schemes (AAA in high-contrast).\n   * Diff insertion / deletion re-use the adaptive \\`success-*\\` and \\`danger-*\\`\n   * ramps for both the line bg and the token color.\n   */\n  code[class*=\"language-\"],\n  pre[class*=\"language-\"] {\n    color: var(--surface-text-color);\n    background: none;\n    font-family: var(--s3-font-family, var(--font-mono));\n    text-align: left;\n    font-weight: var(--s3-font-weight, 400);\n    font-size: var(--s3-font-size, 14px);\n    line-height: var(--s3-line-height, 20px);\n    white-space: pre;\n    word-spacing: normal;\n    word-break: normal;\n    word-wrap: normal;\n    border-radius: 6px;\n    border: none;\n\n    -moz-tab-size: 4;\n    -o-tab-size: 4;\n    tab-size: 4;\n\n    -webkit-hyphens: none;\n    -moz-hyphens: none;\n    -ms-hyphens: none;\n    hyphens: none;\n  }\n\n  pre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection,\n  code[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n    text-shadow: none;\n    background: oklch(from var(--primary-color) l c h / .2);\n  }\n\n  pre[class*=\"language-\"]::selection, pre[class*=\"language-\"] ::selection,\n  code[class*=\"language-\"]::selection, code[class*=\"language-\"] ::selection {\n    text-shadow: none;\n    background: oklch(from var(--primary-color) l c h / .2);\n  }\n\n  @media print {\n    code[class*=\"language-\"],\n    pre[class*=\"language-\"] {\n      text-shadow: none;\n    }\n  }\n\n  /* Code blocks */\n  pre[class*=\"language-\"] {\n    overflow: auto;\n  }\n\n  :not(pre) > code[class*=\"language-\"],\n  pre[class*=\"language-\"] {\n    background: transparent;\n  }\n\n  /* Inline code */\n  :not(pre) > code[class*=\"language-\"] {\n    border-radius: .3em;\n    white-space: normal;\n  }\n\n  /* Diff (re-uses success/danger ramps; both bg and text adapt to scheme) */\n  .token.inserted-sign {\n    background-color: var(--success-bg-color);\n    color: var(--success-text-color);\n  }\n\n  .token.inserted {\n    color: var(--success-text-color);\n  }\n\n  .token.deleted-sign {\n    background-color: var(--danger-bg-color);\n    color: var(--danger-text-color);\n  }\n\n  .token.deleted {\n    color: var(--danger-text-color);\n  }\n\n  /* Comments — subdued gray-ish, AA floor */\n  .token.comment,\n  .token.prolog,\n  .token.doctype,\n  .token.cdata {\n    color: var(--code-comment-color);\n  }\n\n  /* Operators / punctuation — subdued purple, AA floor */\n  .token.operator,\n  .token.punctuation {\n    color: var(--code-punctuation-color);\n  }\n\n  .namespace {\n    opacity: .7;\n  }\n\n  /* Keywords / language constructs — violet */\n  .token.boolean,\n  .token.constant,\n  .token.keyword,\n  .token.atrule {\n    color: var(--code-keyword-color);\n    font-weight: 500;\n  }\n\n  /* Numbers / numeric entities — orange */\n  .token.entity,\n  .token.number {\n    color: var(--code-number-color);\n  }\n\n  /* Strings / character literals / URLs — green */\n  .token.string,\n  .token.char,\n  .token.attr-value,\n  .token.url,\n  .language-css .token.string,\n  .style .token.string {\n    color: var(--code-string-color);\n  }\n\n  /* Names: functions, class names, regex, variables — pink/coral */\n  .token.function,\n  .token.class-name,\n  .token.regex,\n  .token.important,\n  .token.variable {\n    color: var(--code-function-color);\n  }\n\n  /* HTML/XML tag names — same hue as keywords (see Colors / CodeSyntax) */\n  .token.tag {\n    color: var(--code-keyword-color);\n  }\n\n  /* Attributes / properties / selectors / built-ins — cyan */\n  .token.attr-name,\n  .token.property,\n  .token.symbol,\n  .token.key,\n  .token.builtin,\n  .token.selector {\n    color: var(--code-attribute-color);\n  }\n\n  /*\n   * prism-react-renderer flattens nested markup tokens and prefixes parent\n   * types onto each leaf (e.g. \\`token tag attr-value\\`). Re-assert leaf\n   * colors so the bare \\`.token.tag\\` rule does not wash the whole tag.\n   */\n  .token.tag.attr-name {\n    color: var(--code-attribute-color);\n  }\n\n  .token.tag.attr-value {\n    color: var(--code-string-color);\n  }\n\n  .token.tag.punctuation {\n    color: var(--code-punctuation-color);\n  }\n\n  .token.important,\n  .token.bold {\n    font-weight: bold;\n  }\n\n  .token.italic {\n    font-style: italic;\n  }\n\n  .token.entity {\n    cursor: help;\n  }\n`;\n\nexport function GlobalStyles(props: GlobalStylesProps) {\n  const { bodyStyles, font, monospaceFont } = props;\n\n  // Re-resolve the tokens whenever the palette is re-seeded at runtime (see\n  // `src/tokens/palette-config.ts`). Nothing else has to re-render: every color\n  // in the kit compiles to `var(--<name>-color)`, so replacing this one rule\n  // recolors the whole UI. `getTokens()` returns a new map only when the palette\n  // changes, and taking it as the store value makes it the memo's dependency —\n  // a version listed in the deps but never read is dropped by React Compiler.\n  const tokens = usePaletteValue(getTokens);\n\n  // Merge token styles with body styles.\n  const bodyTokenStyles = useMemo((): Styles => {\n    const styles: Styles = { ...tokens };\n\n    // Add base body styles\n    Object.assign(styles, BODY_STYLES);\n\n    // Override with custom body styles if provided\n    // Keys are passed through as-is (tasty handles both camelCase and kebab-case)\n    if (bodyStyles) {\n      Object.assign(styles, bodyStyles);\n    }\n\n    return styles;\n  }, [tokens, bodyStyles]);\n\n  // Apply tokens and body styles via useGlobalStyles.\n  //\n  // Replacement does not depend on the `id`: tasty keys its injection slot on\n  // `id ?? selector`, so `'body'` on its own already disposes the previous block\n  // before writing the new one — which is what removes stale `@hc` rules when the\n  // palette is re-seeded, rather than shadowing them. The `id` buys two other\n  // things. It gives the token block its own slot, so a host app calling\n  // `useGlobalStyles('body', …)` for its own body styles cannot evict ours (and\n  // vice versa) — they would otherwise share the `'body'` slot and dispose each\n  // other on every change. And under SSR it makes the collector key stable and\n  // last-write-wins, instead of content-hashed and first-write-wins.\n  useGlobalStyles('body', bodyTokenStyles, { id: 'cube-ui-kit-tokens' });\n\n  // Apply static CSS and font definitions via useRawCSS\n  useRawCSS(() => {\n    const fontValue = font ? `${font}, ` : '';\n    const monospaceFontValue = monospaceFont ? `${monospaceFont}, ` : '';\n\n    return `\n  html {\n    overscroll-behavior-y: none;\n    --font-sans: ${fontValue}system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", sans-serif;\n    --font-mono: ${monospaceFontValue}ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n  }\n${STATIC_CSS}`;\n  }, [font, monospaceFont]);\n\n  return null;\n}\n"],"mappings":";;;;;;;;;;;;;;AA0BA,MAAMe,cAAsB;CAC1BC,qBAAqB;CACrBC,MAAM;CACNC,YAAY;CACZ,0BAA0B;CAC1B,2BAA2B;CAC3BC,QAAQ;CACRC,SAAS;CACTC,OAAO;CACPC,QAAQ;CACRC,eAAe;CAChB;AAGD,MAAMC,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgPnB,SAAOC,aAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACL,MAAA,EAAArB,YAAAK,MAAAC,kBAA4Ca;CAQ5C,MAAAG,SAAezB,gBAAgBD,UAAU;CAAC,IAAA2B;AAAA,KAAAH,EAAA,OAAApB,cAAAoB,EAAA,OAAAE,QAAA;AAIxCC,WAAuB,EAAA,GAAKD,QAAQ;AAGpCE,SAAMC,OAAQF,QAAQf,YAAY;AAIlC,MAAIR,WACFwB,QAAMC,OAAQF,QAAQvB,WAAW;AAClCoB,IAAA,KAAApB;AAAAoB,IAAA,KAAAE;AAAAF,IAAA,KAAAG;OAAAA,UAAAH,EAAA;CAVH,MAAAM,kBAYEH;CACuB,IAAAI;AAAA,KAAAP,EAAA,OAAAQ,OAAAC,IAAA,4BAAA,EAAA;AAagBF,OAAA,EAAAG,IAAM,sBAAsB;AAAAV,IAAA,KAAAO;OAAAA,MAAAP,EAAA;AAArE3B,iBAAgB,QAAQiC,iBAAiBC,GAA6B;CAAA,IAAAI;CAAA,IAAAC;AAAA,KAAAZ,EAAA,OAAAf,QAAAe,EAAA,OAAAd,eAAA;AAG5DyB,aAAA;AAE6D,UAE9D;;;mBAHW1B,OAAA,GAAUA,KAAI,MAAd,GAMM;mBALGC,gBAAA,GAAmBA,cAAa,MAAhC,GAMM;;EAEnCW;;AACGe,OAAA,CAAC3B,MAAMC,cAAc;AAAAc,IAAA,KAAAf;AAAAe,IAAA,KAAAd;AAAAc,IAAA,KAAAW;AAAAX,IAAA,KAAAY;QAAA;AAAAD,OAAAX,EAAA;AAAAY,OAAAZ,EAAA;;AAXxB1B,WAAUqC,IAWPC,GAAsB;AAAA,QAElB"}
+{"version":3,"file":"GlobalStyles.js","names":["useGlobalStyles","useRawCSS","getTokens","usePaletteValue","Styles","GlobalStylesProps","bodyStyles","key","fonts","fontDisplay","publicUrl","font","monospaceFont","applyLegacyTokens","BODY_STYLES","overscrollBehaviorY","fill","fontFamily","margin","padding","color","preset","letterSpacing","STATIC_CSS","GlobalStyles","props","$","_c","tokens","t0","bodyTokenStyles","t1","Symbol","for","id","t2","t3","fontValue","monospaceFontValue"],"sources":["../../src/components/GlobalStyles.tsx"],"sourcesContent":["import { useGlobalStyles, useRawCSS } from '@tenphi/tasty';\n\nimport { getTokens } from '../tokens';\nimport { usePaletteValue } from '../tokens/palette-config';\n\nimport type { Styles } from '@tenphi/tasty';\n\ninterface GlobalStylesProps {\n  bodyStyles?: { [key: string]: string };\n  fonts?: boolean;\n  fontDisplay?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional';\n  publicUrl?: string;\n  font?: string;\n  monospaceFont?: string;\n  /** @deprecated Tokens are now always applied via useGlobalStyles */\n  applyLegacyTokens?: boolean;\n}\n\n/**\n * Body styles applied via useGlobalStyles.\n *\n * `fill` and `color` use scheme-aware Glaze tokens so the whole page flips\n * automatically when `<html data-scheme=\"dark\">` (or `prefers-color-scheme: dark`)\n * is active — see `src/tokens/palette.ts` and `src/components/Root.tsx`.\n */\nconst BODY_STYLES: Styles = {\n  overscrollBehaviorY: 'none',\n  fill: '#surface',\n  fontFamily: 'var(--font-sans)',\n  '-webkit-font-smoothing': 'antialiased',\n  '-moz-osx-font-smoothing': 'grayscale',\n  margin: 0,\n  padding: 0,\n  color: '#surface-text-soft',\n  preset: 't3',\n  letterSpacing: '0.02em',\n};\n\n// Static CSS that doesn't depend on props\nconst STATIC_CSS = `\n  @font-face {\n    font-family: text-security-disc;\n    src: url(data:font/woff2;base64,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) format('woff2');\n  }\n\n  kbd {\n    font-family: var(--c2-font-family);\n    font-weight: var(--c2-font-weight);\n    font-size: var(--c2-font-size);\n    border: var(--border-width) solid var(--dark-04-color);\n    background-color: var(--surface-color);\n    color: var(--dark-color);\n    border-radius: var(--radius);\n    padding: 0 var(--outline-width);\n  }\n\n  :not([data-qa$=\"Icon\"]) > .tabler-icon {\n    font-size: var(--icon-size);\n    width: 1em;\n    height: 1em;\n    min-width: 1em;\n    min-height: 1em;\n    max-height: 1em;\n    stroke-width: var(--stroke-width);\n  }\n\n  .cube-animation-spin {\n    animation: cube-animation-spin 1s linear infinite;\n  }\n\n  @keyframes cube-animation-spin {\n    from {\n        transform: rotate(0deg);\n    }\n    to {\n        transform: rotate(360deg);\n    }\n  }\n\n  b, strong {\n    font-weight: var(--bold-font-weight, 700);\n  }\n\n  [type=reset], [type=submit], button, html [type=button] {\n    -webkit-appearance: none;\n  }\n\n  code {\n    font-family: var(--font-mono);\n  }\n\n  /*\n   * Prism syntax highlighting.\n   *\n   * All token colors come from the scheme-aware Glaze \\`code-*\\` palette\n   * (defined in src/tokens/palette.ts). Each \\`code-*\\` token has \\`mode: 'auto'\\`\n   * with a numeric contrast floor of 4.5 against \\`#surface\\` so every token\n   * reads at WCAG AA in light AND dark schemes (AAA in high-contrast).\n   * Diff insertion / deletion re-use the adaptive \\`success-*\\` and \\`danger-*\\`\n   * ramps for both the line bg and the token color.\n   */\n  code[class*=\"language-\"],\n  pre[class*=\"language-\"] {\n    color: var(--surface-text-color);\n    background: none;\n    font-family: var(--s3-font-family, var(--font-mono));\n    text-align: left;\n    font-weight: var(--s3-font-weight, 400);\n    font-size: var(--s3-font-size, 14px);\n    line-height: var(--s3-line-height, 20px);\n    white-space: pre;\n    word-spacing: normal;\n    word-break: normal;\n    word-wrap: normal;\n    border-radius: 6px;\n    border: none;\n\n    -moz-tab-size: 4;\n    -o-tab-size: 4;\n    tab-size: 4;\n\n    -webkit-hyphens: none;\n    -moz-hyphens: none;\n    -ms-hyphens: none;\n    hyphens: none;\n  }\n\n  pre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection,\n  code[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n    text-shadow: none;\n    background: oklch(from var(--primary-color) l c h / .2);\n  }\n\n  pre[class*=\"language-\"]::selection, pre[class*=\"language-\"] ::selection,\n  code[class*=\"language-\"]::selection, code[class*=\"language-\"] ::selection {\n    text-shadow: none;\n    background: oklch(from var(--primary-color) l c h / .2);\n  }\n\n  @media print {\n    code[class*=\"language-\"],\n    pre[class*=\"language-\"] {\n      text-shadow: none;\n    }\n  }\n\n  /* Code blocks */\n  pre[class*=\"language-\"] {\n    overflow: auto;\n  }\n\n  :not(pre) > code[class*=\"language-\"],\n  pre[class*=\"language-\"] {\n    background: transparent;\n  }\n\n  /* Inline code */\n  :not(pre) > code[class*=\"language-\"] {\n    border-radius: .3em;\n    white-space: normal;\n  }\n\n  /* Diff (re-uses success/danger ramps; both bg and text adapt to scheme) */\n  .token.inserted-sign {\n    background-color: var(--success-bg-color);\n    color: var(--success-text-color);\n  }\n\n  .token.inserted {\n    color: var(--success-text-color);\n  }\n\n  .token.deleted-sign {\n    background-color: var(--danger-bg-color);\n    color: var(--danger-text-color);\n  }\n\n  .token.deleted {\n    color: var(--danger-text-color);\n  }\n\n  /* Comments — subdued gray-ish, AA floor */\n  .token.comment,\n  .token.prolog,\n  .token.doctype,\n  .token.cdata {\n    color: var(--code-comment-color);\n  }\n\n  /* Operators / punctuation — subdued purple, AA floor */\n  .token.operator,\n  .token.punctuation {\n    color: var(--code-punctuation-color);\n  }\n\n  .namespace {\n    opacity: .7;\n  }\n\n  /* Keywords / language constructs — violet */\n  .token.boolean,\n  .token.constant,\n  .token.keyword,\n  .token.atrule {\n    color: var(--code-keyword-color);\n    font-weight: 500;\n  }\n\n  /* Numbers / numeric entities — orange */\n  .token.entity,\n  .token.number {\n    color: var(--code-number-color);\n  }\n\n  /* Strings / character literals / URLs — green */\n  .token.string,\n  .token.char,\n  .token.attr-value,\n  .token.url,\n  .language-css .token.string,\n  .style .token.string {\n    color: var(--code-string-color);\n  }\n\n  /* Names: functions, class names, regex, variables — pink/coral */\n  .token.function,\n  .token.class-name,\n  .token.regex,\n  .token.important,\n  .token.variable {\n    color: var(--code-function-color);\n  }\n\n  /* HTML/XML tag names — same hue as keywords (see Colors / CodeSyntax) */\n  .token.tag {\n    color: var(--code-keyword-color);\n  }\n\n  /* Attributes / properties / selectors / built-ins — cyan */\n  .token.attr-name,\n  .token.property,\n  .token.symbol,\n  .token.key,\n  .token.builtin,\n  .token.selector {\n    color: var(--code-attribute-color);\n  }\n\n  /*\n   * prism-react-renderer flattens nested markup tokens and prefixes parent\n   * types onto each leaf (e.g. \\`token tag attr-value\\`). Re-assert leaf\n   * colors so the bare \\`.token.tag\\` rule does not wash the whole tag.\n   */\n  .token.tag.attr-name {\n    color: var(--code-attribute-color);\n  }\n\n  .token.tag.attr-value {\n    color: var(--code-string-color);\n  }\n\n  .token.tag.punctuation {\n    color: var(--code-punctuation-color);\n  }\n\n  .token.important,\n  .token.bold {\n    font-weight: bold;\n  }\n\n  .token.italic {\n    font-style: italic;\n  }\n\n  .token.entity {\n    cursor: help;\n  }\n`;\n\nexport function GlobalStyles(props: GlobalStylesProps) {\n  const { bodyStyles, font, monospaceFont } = props;\n\n  // Re-resolve the tokens whenever the palette is re-seeded at runtime (see\n  // `src/tokens/palette-config.ts`). Nothing else has to re-render: every color\n  // in the kit compiles to `var(--<name>-color)`, so replacing this one rule\n  // recolors the whole UI. `getTokens()` returns a new map only when the palette\n  // changes, and taking it as the store value makes it the memo's dependency —\n  // a version listed in the deps but never read is dropped by React Compiler.\n  const tokens = usePaletteValue(getTokens);\n\n  // Merge token styles with the base body styles, then the custom ones. Keys\n  // are passed through as-is (tasty handles both camelCase and kebab-case).\n  const bodyTokenStyles: Styles = { ...tokens, ...BODY_STYLES, ...bodyStyles };\n\n  // Apply tokens and body styles via useGlobalStyles.\n  //\n  // Replacement does not depend on the `id`: tasty keys its injection slot on\n  // `id ?? selector`, so `'body'` on its own already disposes the previous block\n  // before writing the new one — which is what removes stale `@hc` rules when the\n  // palette is re-seeded, rather than shadowing them. The `id` buys two other\n  // things. It gives the token block its own slot, so a host app calling\n  // `useGlobalStyles('body', …)` for its own body styles cannot evict ours (and\n  // vice versa) — they would otherwise share the `'body'` slot and dispose each\n  // other on every change. And under SSR it makes the collector key stable and\n  // last-write-wins, instead of content-hashed and first-write-wins.\n  useGlobalStyles('body', bodyTokenStyles, { id: 'cube-ui-kit-tokens' });\n\n  // Apply static CSS and font definitions via useRawCSS\n  useRawCSS(() => {\n    const fontValue = font ? `${font}, ` : '';\n    const monospaceFontValue = monospaceFont ? `${monospaceFont}, ` : '';\n\n    return `\n  html {\n    overscroll-behavior-y: none;\n    --font-sans: ${fontValue}system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", sans-serif;\n    --font-mono: ${monospaceFontValue}ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n  }\n${STATIC_CSS}`;\n  }, [font, monospaceFont]);\n\n  return null;\n}\n"],"mappings":";;;;;;;;;;;;;;AAyBA,MAAMc,cAAsB;CAC1BC,qBAAqB;CACrBC,MAAM;CACNC,YAAY;CACZ,0BAA0B;CAC1B,2BAA2B;CAC3BC,QAAQ;CACRC,SAAS;CACTC,OAAO;CACPC,QAAQ;CACRC,eAAe;CAChB;AAGD,MAAMC,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgPnB,SAAOC,aAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACL,MAAA,EAAArB,YAAAK,MAAAC,kBAA4Ca;CAQ5C,MAAAG,SAAezB,gBAAgBD,UAAU;CAAC,IAAA2B;AAAA,KAAAH,EAAA,OAAApB,cAAAoB,EAAA,OAAAE,QAAA;AAIVC,OAAA;GAAA,GAAKD;GAAM,GAAKd;GAAW,GAAKR;GAAY;AAAAoB,IAAA,KAAApB;AAAAoB,IAAA,KAAAE;AAAAF,IAAA,KAAAG;OAAAA,MAAAH,EAAA;CAA5E,MAAAI,kBAAgCD;CAA6C,IAAAE;AAAA,KAAAL,EAAA,OAAAM,OAAAC,IAAA,4BAAA,EAAA;AAapCF,OAAA,EAAAG,IAAM,sBAAsB;AAAAR,IAAA,KAAAK;OAAAA,MAAAL,EAAA;AAArE1B,iBAAgB,QAAQ8B,iBAAiBC,GAA6B;CAAA,IAAAI;CAAA,IAAAC;AAAA,KAAAV,EAAA,OAAAf,QAAAe,EAAA,OAAAd,eAAA;AAG5DuB,aAAA;AAE6D,UAE9D;;;mBAHWxB,OAAA,GAAUA,KAAI,MAAd,GAMM;mBALGC,gBAAA,GAAmBA,cAAa,MAAhC,GAMM;;EAEnCW;;AACGa,OAAA,CAACzB,MAAMC,cAAc;AAAAc,IAAA,KAAAf;AAAAe,IAAA,KAAAd;AAAAc,IAAA,KAAAS;AAAAT,IAAA,KAAAU;QAAA;AAAAD,OAAAT,EAAA;AAAAU,OAAAV,EAAA;;AAXxBzB,WAAUkC,IAWPC,GAAsB;AAAA,QAElB"}

package/dist/components/GridProvider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { useCombinedRefs } from "../utils/react/useCombinedRefs.js";
 import { filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef, useCallback, useEffect, useState } from "react";

package/dist/components/HiddenInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 
 //#region src/components/HiddenInput.tsx

package/dist/components/Root.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { extractStyles } from "../utils/styles.js";
 import { AMBIENT_PREDEFINED_STATES } from "../utils/react/useScheme.js";
 import { EventBusProvider } from "../utils/react/useEventBus.js";

package/dist/components/actions/Action/Action.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useAction } from "../use-action.js";
 import { c } from "react-compiler-runtime";

package/dist/components/actions/Banner/Banner.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { _Item } from "../../content/Item/Item.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/actions/Banner/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","names":["IconAlertTriangle","IconCircleCheck","IconExclamationCircle","IconInfoCircle","IconX","tasty","ReactNode","useMemo","useEvent","useI18n","CubeItemProps","Item","Button","CubeButtonProps","CubeItemActionProps","BannerTheme","BannerProps","Omit","theme","isDismissable","onDismiss","BannerActionProps","BannerLinkProps","DEFAULT_ICONS","Record","danger","warning","note","success","BannerElement","styles","width","Description","textOverflow","whiteSpace","Actions","gap","BannerActionElement","Action","type","preset","BannerLinkElement","size","color","textDecoration","BannerAction","props","$","_c","t0","BannerLink","Banner","t","actions","children","icon","rest","t1","undefined","t2","onDismissEvent","defaultIcon","hasActions","t3","t4","t5","Link"],"sources":["../../../../src/components/actions/Banner/Banner.tsx"],"sourcesContent":["import {\n  IconAlertTriangle,\n  IconCircleCheck,\n  IconExclamationCircle,\n  IconInfoCircle,\n  IconX,\n} from '@tabler/icons-react';\nimport { tasty } from '@tenphi/tasty';\nimport { ReactNode, useMemo } from 'react';\n\nimport { useEvent } from '../../../_internal/hooks/use-event';\nimport { useI18n } from '../../../i18n';\nimport { CubeItemProps, Item } from '../../content/Item/Item';\nimport { Button, CubeButtonProps } from '../Button/Button';\nimport { CubeItemActionProps } from '../ItemAction/ItemAction';\n\nexport type BannerTheme = 'danger' | 'warning' | 'note' | 'success';\n\nexport type BannerProps = Omit<CubeItemProps, 'type' | 'size' | 'theme'> & {\n  /**\n   * The visual theme of the banner.\n   * @default 'note'\n   */\n  theme?: BannerTheme;\n  /**\n   * Controls whether the banner can be dismissed by the user.\n   * @default false\n   */\n  isDismissable?: boolean;\n  /**\n   * Callback fired when the dismiss button is clicked.\n   */\n  onDismiss?: () => void;\n};\n\nexport type BannerActionProps = Omit<CubeItemActionProps, 'preset' | 'type'>;\n\nexport type BannerLinkProps = Omit<CubeButtonProps, 'type' | 'size' | 'color'>;\n\nconst DEFAULT_ICONS: Record<BannerTheme, ReactNode> = {\n  danger: <IconExclamationCircle />,\n  warning: <IconAlertTriangle />,\n  note: <IconInfoCircle />,\n  success: <IconCircleCheck />,\n};\n\nconst BannerElement = tasty(Item, {\n  styles: {\n    width: '100%',\n\n    Description: {\n      textOverflow: 'ellipsis / 2',\n      whiteSpace: 'normal',\n    },\n\n    Actions: {\n      gap: '1x',\n    },\n  },\n});\n\n// `current.outline` — the `current` theme on `Item.Action`, given the outlined\n// shape rather than the borderless default.\n//\n// `current` is the right color source: a banner labels itself `#white` in both\n// schemes (see `BannerLinkElement` and `*_PRIMARY_STYLES`), so the action mixes\n// its chip, border and label from that white — label cr 4.3-5.0 against every\n// banner theme, with the chip a subtle 1.06 off the banner. That is what an\n// action on a saturated surface should be: the banner carries the emphasis, the\n// button just has to be findable.\n//\n// `outline` rather than `Item.Action`'s `clear` default because a banner action\n// is a call to action, and `clear` paints nothing at rest — on a busy banner it\n// reads as body text until hovered. The `#current.08` border is what makes it a\n// button, which is why the old `border: '#clear'` override had to go: it was\n// written when `outline` meant `note.outline` and friends, whose border is the\n// opaque `#note-border` — a pale line built for a `#surface-2` chip on a light\n// page and plainly wrong on a saturated banner. On the `current` theme the\n// border IS the chip, and the 3% fill cannot carry one alone.\n//\n// `type=\"primary\"` is deliberately not used. It would fill with the inherited\n// white and punch `#current-fill` out of it, which defaults to `#surface` —\n// white in light mode, so the label would collapse into its own chip. A banner\n// that wants a filled action has to set `#current-fill` to its own surface\n// color; see `CURRENT_PRIMARY_STYLES` in `item-themes`.\nconst BannerActionElement = tasty(Item.Action, {\n  type: 'outline',\n  styles: {\n    preset: 't3m',\n  },\n});\n\nconst BannerLinkElement = tasty(Button, {\n  type: 'link',\n  size: 'inline',\n  styles: {\n    color: '#white',\n    textDecoration: 'underline',\n  },\n});\n\n/**\n * Sub-component for action buttons within a Banner.\n * Automatically styled to match the banner's theme.\n */\nexport function BannerAction(props: BannerActionProps) {\n  return <BannerActionElement {...props} />;\n}\n\n/**\n * Sub-component for inline links within Banner content.\n * Styled with white color and underline to stand out against the banner background.\n */\nexport function BannerLink(props: BannerLinkProps) {\n  return <BannerLinkElement {...props} />;\n}\n\n/**\n * Banner displays prominent messages and notifications to users.\n * Supports different themes (danger, warning, note, success) with appropriate icons.\n * Use Banner.Action for action buttons and Banner.Link for inline links.\n */\nexport function Banner(props: BannerProps) {\n  const { t } = useI18n();\n\n  const {\n    theme = 'note',\n    actions,\n    isDismissable = false,\n    onDismiss,\n    children,\n    icon,\n    ...rest\n  } = props;\n\n  const onDismissEvent = useEvent(() => {\n    onDismiss?.();\n  });\n\n  const defaultIcon = useMemo(() => DEFAULT_ICONS[theme], [theme]);\n\n  const hasActions = !!(actions || isDismissable);\n\n  return (\n    <BannerElement\n      qa=\"Banner\"\n      role=\"status\"\n      type=\"primary\"\n      theme={theme}\n      size=\"large\"\n      icon={icon ?? defaultIcon}\n      {...rest}\n      actions={\n        hasActions ? (\n          <>\n            {actions}\n            {isDismissable && (\n              <Item.Action\n                icon={<IconX />}\n                tooltip={t('banner.hideBanner', 'Hide banner')}\n                onPress={onDismissEvent}\n              />\n            )}\n          </>\n        ) : undefined\n      }\n    >\n      {children}\n    </BannerElement>\n  );\n}\n\nBanner.Action = BannerAction;\nBanner.Link = BannerLink;\n"],"mappings":";;;;;;;;;;;AAuCA,MAAMuB,gBAAgD;CACpDE,QAAQ,oBAAC,0BAAwB;CACjCC,SAAS,oBAAC,sBAAoB;CAC9BC,MAAM,oBAAC,mBAAiB;CACxBC,SAAS,oBAAC,oBAAe;CAC1B;AAED,MAAMC,gBAAgBxB,MAAMM,OAAM,EAChCmB,QAAQ;CACNC,OAAO;CAEPC,aAAa;EACXC,cAAc;EACdC,YAAY;EACb;CAEDC,SAAS,EACPC,KAAK,MACP;CACF,EACD,CAAC;AA0BF,MAAMC,sBAAsBhC,MAAMM,MAAK2B,QAAQ;CAC7CC,MAAM;CACNT,QAAQ,EACNU,QAAQ,OACV;CACD,CAAC;AAEF,MAAMC,oBAAoBpC,MAAMO,QAAQ;CACtC2B,MAAM;CACNG,MAAM;CACNZ,QAAQ;EACNa,OAAO;EACPC,gBAAgB;EAClB;CACD,CAAC;;;;;AAMF,SAAOC,aAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;AAAA,KAAAF,EAAA,OAAAD,OAAA;AACEG,OAAA,oBAAC,uBAAmB,GAAKH,QAAS;AAAAC,IAAA,KAAAD;AAAAC,IAAA,KAAAE;OAAAA,MAAAF,EAAA;AAAA,QAAlCE;;;;;;AAOT,SAAOC,WAAAJ,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;AAAA,KAAAF,EAAA,OAAAD,OAAA;AACEG,OAAA,oBAAC,qBAAiB,GAAKH,QAAS;AAAAC,IAAA,KAAAD;AAAAC,IAAA,KAAAE;OAAAA,MAAAF,EAAA;AAAA,QAAhCE;;;;;;;AAQT,SAAOE,OAAAL,OAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CACL,MAAA,EAAAI,MAAc3C,SAAS;CAAC,IAAA4C;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAnC;CAAA,IAAAoC;CAAA,IAAAP;CAAA,IAAAQ;AAAA,KAAAV,EAAA,OAAAD,OAAA;AAExB,GAAA,CAAA5B,OAAA+B,IAAAI,SAAAlC,eAAAsC,IAAArC,WAAAkC,UAAAC,SAAAC,QAQIV;AAAMC,IAAA,KAAAD;AAAAC,IAAA,KAAAM;AAAAN,IAAA,KAAAO;AAAAP,IAAA,KAAAQ;AAAAR,IAAA,KAAA3B;AAAA2B,IAAA,KAAAS;AAAAT,IAAA,KAAAE;AAAAF,IAAA,KAAAU;QAAA;AAAAJ,YAAAN,EAAA;AAAAO,aAAAP,EAAA;AAAAQ,SAAAR,EAAA;AAAA3B,cAAA2B,EAAA;AAAAS,SAAAT,EAAA;AAAAE,OAAAF,EAAA;AAAAU,OAAAV,EAAA;;CAPR,MAAA7B,QAAA+B,OAAAS,SAAA,SAAAT;CAEA,MAAA9B,gBAAAsC,OAAAC,SAAA,QAAAD;CAAqB,IAAAE;AAAA,KAAAZ,EAAA,OAAA3B,WAAA;AAOSuC,aAAA;AAC9BvC,gBAAa;;AACd2B,IAAA,KAAA3B;AAAA2B,IAAA,KAAAY;OAAAA,MAAAZ,EAAA;CAFD,MAAAa,iBAAuBpD,SAASmD,GAE9B;CAEF,MAAAE,cAAkCtC,cAAcL;CAEhD,MAAA4C,aAAmB,CAAC,EAAET,WAAAlC;CASZ,MAAA4C,KAAAR,QAAAM;CAAmB,IAAAG;AAAA,KAAAjB,EAAA,QAAAM,WAAAN,EAAA,QAAAe,cAAAf,EAAA,QAAA5B,iBAAA4B,EAAA,QAAAa,kBAAAb,EAAA,QAAAK,GAAA;AAGvBY,OAAAF,aAAA,4CAEKT,SACAlC,iBACC,oBAAA,MAAA;GACQ,MAAA,oBAAC,UAAO;GACL,SAAAiC,EAAE,qBAAqB,cAAa;GACpCQ,SAAAA;IAEb,IAES,GAXbF;AAWaX,IAAA,MAAAM;AAAAN,IAAA,MAAAe;AAAAf,IAAA,MAAA5B;AAAA4B,IAAA,MAAAa;AAAAb,IAAA,MAAAK;AAAAL,IAAA,MAAAiB;OAAAA,MAAAjB,EAAA;CAAA,IAAAkB;AAAA,KAAAlB,EAAA,QAAAO,YAAAP,EAAA,QAAAS,QAAAT,EAAA,QAAAgB,MAAAhB,EAAA,QAAAiB,MAAAjB,EAAA,QAAA7B,OAAA;AApBjB+C,OAAA,oBAAC;GACI,IAAA;GACE,MAAA;GACA,MAAA;GACE/C;GACF,MAAA;GACC,MAAA6C;GAAmB,GACrBP;GAEF,SAAAQ;GAcDV;IACa;AAAAP,IAAA,MAAAO;AAAAP,IAAA,MAAAS;AAAAT,IAAA,MAAAgB;AAAAhB,IAAA,MAAAiB;AAAAjB,IAAA,MAAA7B;AAAA6B,IAAA,MAAAkB;OAAAA,MAAAlB,EAAA;AAAA,QAxBhBkB;;AA4BJd,OAAOb,SAASO;AAChBM,OAAOe,OAAOhB"}
+{"version":3,"file":"Banner.js","names":["IconAlertTriangle","IconCircleCheck","IconExclamationCircle","IconInfoCircle","IconX","tasty","ReactNode","useEvent","useI18n","CubeItemProps","Item","Button","CubeButtonProps","CubeItemActionProps","BannerTheme","BannerProps","Omit","theme","isDismissable","onDismiss","BannerActionProps","BannerLinkProps","DEFAULT_ICONS","Record","danger","warning","note","success","BannerElement","styles","width","Description","textOverflow","whiteSpace","Actions","gap","BannerActionElement","Action","type","preset","BannerLinkElement","size","color","textDecoration","BannerAction","props","$","_c","t0","BannerLink","Banner","t","actions","children","icon","rest","t1","undefined","t2","onDismissEvent","defaultIcon","hasActions","t3","t4","t5","Link"],"sources":["../../../../src/components/actions/Banner/Banner.tsx"],"sourcesContent":["import {\n  IconAlertTriangle,\n  IconCircleCheck,\n  IconExclamationCircle,\n  IconInfoCircle,\n  IconX,\n} from '@tabler/icons-react';\nimport { tasty } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { useEvent } from '../../../_internal/hooks/use-event';\nimport { useI18n } from '../../../i18n';\nimport { CubeItemProps, Item } from '../../content/Item/Item';\nimport { Button, CubeButtonProps } from '../Button/Button';\nimport { CubeItemActionProps } from '../ItemAction/ItemAction';\n\nexport type BannerTheme = 'danger' | 'warning' | 'note' | 'success';\n\nexport type BannerProps = Omit<CubeItemProps, 'type' | 'size' | 'theme'> & {\n  /**\n   * The visual theme of the banner.\n   * @default 'note'\n   */\n  theme?: BannerTheme;\n  /**\n   * Controls whether the banner can be dismissed by the user.\n   * @default false\n   */\n  isDismissable?: boolean;\n  /**\n   * Callback fired when the dismiss button is clicked.\n   */\n  onDismiss?: () => void;\n};\n\nexport type BannerActionProps = Omit<CubeItemActionProps, 'preset' | 'type'>;\n\nexport type BannerLinkProps = Omit<CubeButtonProps, 'type' | 'size' | 'color'>;\n\nconst DEFAULT_ICONS: Record<BannerTheme, ReactNode> = {\n  danger: <IconExclamationCircle />,\n  warning: <IconAlertTriangle />,\n  note: <IconInfoCircle />,\n  success: <IconCircleCheck />,\n};\n\nconst BannerElement = tasty(Item, {\n  styles: {\n    width: '100%',\n\n    Description: {\n      textOverflow: 'ellipsis / 2',\n      whiteSpace: 'normal',\n    },\n\n    Actions: {\n      gap: '1x',\n    },\n  },\n});\n\n// `current.outline` — the `current` theme on `Item.Action`, given the outlined\n// shape rather than the borderless default.\n//\n// `current` is the right color source: a banner labels itself `#white` in both\n// schemes (see `BannerLinkElement` and `*_PRIMARY_STYLES`), so the action mixes\n// its chip, border and label from that white — label cr 4.3-5.0 against every\n// banner theme, with the chip a subtle 1.06 off the banner. That is what an\n// action on a saturated surface should be: the banner carries the emphasis, the\n// button just has to be findable.\n//\n// `outline` rather than `Item.Action`'s `clear` default because a banner action\n// is a call to action, and `clear` paints nothing at rest — on a busy banner it\n// reads as body text until hovered. The `#current.08` border is what makes it a\n// button, which is why the old `border: '#clear'` override had to go: it was\n// written when `outline` meant `note.outline` and friends, whose border is the\n// opaque `#note-border` — a pale line built for a `#surface-2` chip on a light\n// page and plainly wrong on a saturated banner. On the `current` theme the\n// border IS the chip, and the 3% fill cannot carry one alone.\n//\n// `type=\"primary\"` is deliberately not used. It would fill with the inherited\n// white and punch `#current-fill` out of it, which defaults to `#surface` —\n// white in light mode, so the label would collapse into its own chip. A banner\n// that wants a filled action has to set `#current-fill` to its own surface\n// color; see `CURRENT_PRIMARY_STYLES` in `item-themes`.\nconst BannerActionElement = tasty(Item.Action, {\n  type: 'outline',\n  styles: {\n    preset: 't3m',\n  },\n});\n\nconst BannerLinkElement = tasty(Button, {\n  type: 'link',\n  size: 'inline',\n  styles: {\n    color: '#white',\n    textDecoration: 'underline',\n  },\n});\n\n/**\n * Sub-component for action buttons within a Banner.\n * Automatically styled to match the banner's theme.\n */\nexport function BannerAction(props: BannerActionProps) {\n  return <BannerActionElement {...props} />;\n}\n\n/**\n * Sub-component for inline links within Banner content.\n * Styled with white color and underline to stand out against the banner background.\n */\nexport function BannerLink(props: BannerLinkProps) {\n  return <BannerLinkElement {...props} />;\n}\n\n/**\n * Banner displays prominent messages and notifications to users.\n * Supports different themes (danger, warning, note, success) with appropriate icons.\n * Use Banner.Action for action buttons and Banner.Link for inline links.\n */\nexport function Banner(props: BannerProps) {\n  const { t } = useI18n();\n\n  const {\n    theme = 'note',\n    actions,\n    isDismissable = false,\n    onDismiss,\n    children,\n    icon,\n    ...rest\n  } = props;\n\n  const onDismissEvent = useEvent(() => {\n    onDismiss?.();\n  });\n\n  const defaultIcon = DEFAULT_ICONS[theme];\n\n  const hasActions = !!(actions || isDismissable);\n\n  return (\n    <BannerElement\n      qa=\"Banner\"\n      role=\"status\"\n      type=\"primary\"\n      theme={theme}\n      size=\"large\"\n      icon={icon ?? defaultIcon}\n      {...rest}\n      actions={\n        hasActions ? (\n          <>\n            {actions}\n            {isDismissable && (\n              <Item.Action\n                icon={<IconX />}\n                tooltip={t('banner.hideBanner', 'Hide banner')}\n                onPress={onDismissEvent}\n              />\n            )}\n          </>\n        ) : undefined\n      }\n    >\n      {children}\n    </BannerElement>\n  );\n}\n\nBanner.Action = BannerAction;\nBanner.Link = BannerLink;\n"],"mappings":"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"}

package/dist/components/actions/Button/Button.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { getDisabledElementProps } from "../../../utils/react/disabledProps.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";

package/dist/components/actions/ButtonGroup/ButtonGroup.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { useSlotProps } from "../../../utils/react/Slots.js";
 import { Space } from "../../layout/Space.js";
 import { c } from "react-compiler-runtime";

package/dist/components/actions/ButtonSplit/ButtonSplit.js

@@ -1,12 +1,13 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { ButtonSplitContext } from "./context.js";
 import { Button } from "../Button/Button.js";
 import { DirectionIcon } from "../../../icons/DirectionIcon.js";
 import { __Menu } from "../Menu/Menu.js";
+import { c } from "react-compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
-import { forwardRef, useCallback, useMemo, useState } from "react";
+import { forwardRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/actions/ButtonSplit/ButtonSplit.tsx
@@ -21,44 +22,123 @@ const ButtonSplitElement = tasty({
 	}
 });
 const ButtonSplit = forwardRef(function ButtonSplit(props, ref) {
+	const $ = c(37);
 	const { actions, actionKey: controlledActionKey, defaultActionKey, onAction, onActionChange, type, theme, size, isDisabled, actionProps, triggerProps, menuProps, styles, children, role, ...rest } = props;
 	const isControlled = controlledActionKey !== void 0;
-	const [uncontrolledKey, setUncontrolledKey] = useState(() => defaultActionKey ?? actions?.[0]?.key);
+	let t0;
+	if ($[0] !== actions?.[0]?.key || $[1] !== defaultActionKey) {
+		t0 = () => defaultActionKey ?? actions?.[0]?.key;
+		$[0] = actions?.[0]?.key;
+		$[1] = defaultActionKey;
+		$[2] = t0;
+	} else t0 = $[2];
+	const [uncontrolledKey, setUncontrolledKey] = useState(t0);
 	const currentKey = isControlled ? controlledActionKey : uncontrolledKey;
-	const currentAction = useMemo(() => actions?.find((a) => a.key === currentKey) ?? actions?.[0], [actions, currentKey]);
-	const handleActionPress = useCallback(() => {
-		if (currentKey) onAction?.(currentKey);
-	}, [currentKey, onAction]);
-	const handleSelectionChange = useCallback((keys) => {
-		const newKey = keys[0];
-		if (newKey) {
-			if (!isControlled) setUncontrolledKey(newKey);
-			onActionChange?.(newKey);
-		}
-	}, [isControlled, onActionChange]);
-	const containerStyles = extractStyles(rest, STYLE_PROPS);
-	const mergedStyles = useMemo(() => ({
-		...containerStyles,
+	let t1;
+	if ($[3] !== actions || $[4] !== currentKey) {
+		t1 = actions?.find((a) => a.key === currentKey) ?? actions?.[0];
+		$[3] = actions;
+		$[4] = currentKey;
+		$[5] = t1;
+	} else t1 = $[5];
+	const currentAction = t1;
+	let t2;
+	if ($[6] !== currentKey || $[7] !== onAction) {
+		t2 = () => {
+			if (currentKey) onAction?.(currentKey);
+		};
+		$[6] = currentKey;
+		$[7] = onAction;
+		$[8] = t2;
+	} else t2 = $[8];
+	const handleActionPress = t2;
+	let t3;
+	if ($[9] !== isControlled || $[10] !== onActionChange) {
+		t3 = (keys) => {
+			const newKey = keys[0];
+			if (newKey) {
+				if (!isControlled) setUncontrolledKey(newKey);
+				onActionChange?.(newKey);
+			}
+		};
+		$[9] = isControlled;
+		$[10] = onActionChange;
+		$[11] = t3;
+	} else t3 = $[11];
+	const handleSelectionChange = t3;
+	const mergedStyles = {
+		...extractStyles(rest, STYLE_PROPS),
 		...styles
-	}), [containerStyles, styles]);
-	const contextValue = useMemo(() => ({
-		currentKey,
-		onAction,
-		onActionChange,
-		type,
-		theme,
-		size,
-		isDisabled
-	}), [
-		currentKey,
-		onAction,
-		onActionChange,
-		type,
-		theme,
-		size,
-		isDisabled
-	]);
+	};
+	let t4;
+	if ($[12] !== currentKey || $[13] !== isDisabled || $[14] !== onAction || $[15] !== onActionChange || $[16] !== size || $[17] !== theme || $[18] !== type) {
+		t4 = {
+			currentKey,
+			onAction,
+			onActionChange,
+			type,
+			theme,
+			size,
+			isDisabled
+		};
+		$[12] = currentKey;
+		$[13] = isDisabled;
+		$[14] = onAction;
+		$[15] = onActionChange;
+		$[16] = size;
+		$[17] = theme;
+		$[18] = type;
+		$[19] = t4;
+	} else t4 = $[19];
+	const contextValue = t4;
 	const isCustomMode = children != null;
+	let t5;
+	if ($[20] !== actionProps || $[21] !== actions || $[22] !== children || $[23] !== currentAction?.icon || $[24] !== currentAction?.label || $[25] !== currentAction?.tooltip || $[26] !== currentKey || $[27] !== handleActionPress || $[28] !== handleSelectionChange || $[29] !== isCustomMode || $[30] !== isDisabled || $[31] !== menuProps || $[32] !== size || $[33] !== theme || $[34] !== triggerProps || $[35] !== type) {
+		t5 = isCustomMode ? children : actions ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
+			type,
+			theme,
+			size,
+			isDisabled,
+			icon: currentAction?.icon,
+			tooltip: currentAction?.tooltip,
+			...mergeProps(actionProps, { onPress: handleActionPress }),
+			children: currentAction?.label
+		}), /* @__PURE__ */ jsxs(__Menu.Trigger, {
+			placement: "bottom end",
+			children: [/* @__PURE__ */ jsx(Button, {
+				type,
+				theme,
+				size,
+				isDisabled,
+				"aria-label": "More options",
+				icon: _temp,
+				...triggerProps
+			}), /* @__PURE__ */ jsx(__Menu, {
+				selectionMode: "single",
+				selectedKeys: currentKey ? [currentKey] : [],
+				onSelectionChange: handleSelectionChange,
+				...menuProps,
+				children: actions.map(_temp2)
+			})]
+		})] }) : null;
+		$[20] = actionProps;
+		$[21] = actions;
+		$[22] = children;
+		$[23] = currentAction?.icon;
+		$[24] = currentAction?.label;
+		$[25] = currentAction?.tooltip;
+		$[26] = currentKey;
+		$[27] = handleActionPress;
+		$[28] = handleSelectionChange;
+		$[29] = isCustomMode;
+		$[30] = isDisabled;
+		$[31] = menuProps;
+		$[32] = size;
+		$[33] = theme;
+		$[34] = triggerProps;
+		$[35] = type;
+		$[36] = t5;
+	} else t5 = $[36];
 	return /* @__PURE__ */ jsx(ButtonSplitContext.Provider, {
 		value: contextValue,
 		children: /* @__PURE__ */ jsx(ButtonSplitElement, {
@@ -68,41 +148,23 @@ const ButtonSplit = forwardRef(function ButtonSplit(props, ref) {
 			styles: mergedStyles,
 			qa: rest.qa,
 			role: role ?? (isCustomMode ? "group" : void 0),
-			children: isCustomMode ? children : actions ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
-				type,
-				theme,
-				size,
-				isDisabled,
-				icon: currentAction?.icon,
-				tooltip: currentAction?.tooltip,
-				...mergeProps(actionProps, { onPress: handleActionPress }),
-				children: currentAction?.label
-			}), /* @__PURE__ */ jsxs(__Menu.Trigger, {
-				placement: "bottom end",
-				children: [/* @__PURE__ */ jsx(Button, {
-					type,
-					theme,
-					size,
-					isDisabled,
-					"aria-label": "More options",
-					icon: ({ pressed }) => /* @__PURE__ */ jsx(DirectionIcon, { to: pressed ? "up" : "down" }),
-					...triggerProps
-				}), /* @__PURE__ */ jsx(__Menu, {
-					selectionMode: "single",
-					selectedKeys: currentKey ? [currentKey] : [],
-					onSelectionChange: handleSelectionChange,
-					...menuProps,
-					children: actions.map(({ key, label, textValue, ...itemProps }) => /* @__PURE__ */ jsx(__Menu.Item, {
-						textValue: textValue ?? (typeof label === "string" ? label : key),
-						...itemProps,
-						children: label
-					}, key))
-				})]
-			})] }) : null
+			children: t5
 		})
 	});
 });
 ButtonSplit.displayName = "ButtonSplit";
+function _temp(t0) {
+	const { pressed } = t0;
+	return /* @__PURE__ */ jsx(DirectionIcon, { to: pressed ? "up" : "down" });
+}
+function _temp2(t0) {
+	const { key, label, textValue, ...itemProps } = t0;
+	return /* @__PURE__ */ jsx(__Menu.Item, {
+		textValue: textValue ?? (typeof label === "string" ? label : key),
+		...itemProps,
+		children: label
+	}, key);
+}
 
 //#endregion
 export { ButtonSplit };

package/dist/components/actions/ButtonSplit/ButtonSplit.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonSplit.js","names":["CONTAINER_STYLES","filterBaseProps","tasty","forwardRef","ReactNode","useCallback","useMemo","useState","DirectionIcon","mergeProps","extractStyles","Button","Menu","ButtonSplitContext","BaseProps","ContainerStyleProps","Styles","CubeCollectionItemProps","CubeButtonProps","CubeMenuProps","ButtonSplitAction","Omit","key","label","CubeButtonSplitProps","actions","actionKey","defaultActionKey","onAction","onActionChange","type","theme","size","isDisabled","actionProps","Partial","triggerProps","menuProps","styles","children","STYLE_PROPS","ButtonSplitElement","as","qa","display","position","verticalAlign","ButtonSplit","HTMLDivElement","props","ref","controlledActionKey","role","rest","isControlled","undefined","uncontrolledKey","setUncontrolledKey","currentKey","currentAction","find","a","handleActionPress","handleSelectionChange","keys","newKey","containerStyles","mergedStyles","contextValue","isCustomMode","eventProps","icon","tooltip","onPress","pressed","map","textValue","itemProps","displayName"],"sources":["../../../../src/components/actions/ButtonSplit/ButtonSplit.tsx"],"sourcesContent":["import { CONTAINER_STYLES, filterBaseProps, tasty } from '@tenphi/tasty';\nimport { forwardRef, ReactNode, useCallback, useMemo, useState } from 'react';\n\nimport { DirectionIcon } from '../../../icons/DirectionIcon';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { Button } from '../Button/Button';\nimport { Menu } from '../Menu/Menu';\n\nimport { ButtonSplitContext } from './context';\n\nimport type { BaseProps, ContainerStyleProps, Styles } from '@tenphi/tasty';\nimport type { CubeCollectionItemProps } from '../../CollectionItem';\nimport type { CubeButtonProps } from '../Button/Button';\nimport type { CubeMenuProps } from '../Menu/Menu';\n\nexport interface ButtonSplitAction\n  extends Omit<\n    CubeCollectionItemProps<object>,\n    'children' | 'onAction' | 'wrapper'\n  > {\n  key: string;\n  label: ReactNode;\n}\n\nexport interface CubeButtonSplitProps extends BaseProps, ContainerStyleProps {\n  /** Actions for strict mode. When provided, renders action + trigger buttons automatically. */\n  actions?: ButtonSplitAction[];\n  /** Currently selected action key (controlled). */\n  actionKey?: string;\n  /** Initially selected action key (uncontrolled). */\n  defaultActionKey?: string;\n  /** Called when the action button is pressed. Receives the current action key. */\n  onAction?: (key: string) => void;\n  /** Called when the selected action changes via the trigger menu. */\n  onActionChange?: (key: string) => void;\n\n  /** Button type applied to both action and trigger buttons in strict mode. */\n  type?: CubeButtonProps['type'];\n  /** Button theme applied to both action and trigger buttons in strict mode. */\n  theme?: CubeButtonProps['theme'];\n  /** Button size applied to both action and trigger buttons in strict mode. */\n  size?: CubeButtonProps['size'];\n  /** Disables both buttons in strict mode. */\n  isDisabled?: boolean;\n\n  /** Additional props for the action button in strict mode. */\n  actionProps?: Partial<CubeButtonProps>;\n  /** Additional props for the trigger button in strict mode. */\n  triggerProps?: Partial<CubeButtonProps>;\n  /** Additional props for the dropdown menu in strict mode. */\n  menuProps?: Partial<CubeMenuProps<object>>;\n\n  /** Custom styles for the wrapper element. */\n  styles?: Styles;\n\n  /** Custom mode: render arbitrary Button children. */\n  children?: ReactNode;\n}\n\nconst STYLE_PROPS = CONTAINER_STYLES;\n\nconst ButtonSplitElement = tasty({\n  as: 'div',\n  qa: 'ButtonSplit',\n  styles: {\n    display: 'inline-flex',\n    position: 'relative',\n    verticalAlign: 'bottom',\n  },\n});\n\nexport const ButtonSplit = forwardRef<HTMLDivElement, CubeButtonSplitProps>(\n  function ButtonSplit(props, ref) {\n    const {\n      actions,\n      actionKey: controlledActionKey,\n      defaultActionKey,\n      onAction,\n      onActionChange,\n      type,\n      theme,\n      size,\n      isDisabled,\n      actionProps,\n      triggerProps,\n      menuProps,\n      styles,\n      children,\n      role,\n      ...rest\n    } = props;\n\n    const isControlled = controlledActionKey !== undefined;\n    const [uncontrolledKey, setUncontrolledKey] = useState(\n      () => defaultActionKey ?? actions?.[0]?.key,\n    );\n\n    const currentKey = isControlled ? controlledActionKey : uncontrolledKey;\n\n    const currentAction = useMemo(\n      () => actions?.find((a) => a.key === currentKey) ?? actions?.[0],\n      [actions, currentKey],\n    );\n\n    const handleActionPress = useCallback(() => {\n      if (currentKey) {\n        onAction?.(currentKey);\n      }\n    }, [currentKey, onAction]);\n\n    const handleSelectionChange = useCallback(\n      (keys: string[]) => {\n        const newKey = keys[0];\n\n        if (newKey) {\n          if (!isControlled) {\n            setUncontrolledKey(newKey);\n          }\n\n          onActionChange?.(newKey);\n        }\n      },\n      [isControlled, onActionChange],\n    );\n\n    const containerStyles = extractStyles(rest, STYLE_PROPS);\n\n    const mergedStyles = useMemo<Styles>(\n      () => ({\n        ...containerStyles,\n        ...styles,\n      }),\n      [containerStyles, styles],\n    );\n\n    const contextValue = useMemo(\n      () => ({\n        currentKey,\n        onAction,\n        onActionChange,\n        type,\n        theme,\n        size,\n        isDisabled,\n      }),\n      [currentKey, onAction, onActionChange, type, theme, size, isDisabled],\n    );\n\n    const isCustomMode = children != null;\n\n    return (\n      <ButtonSplitContext.Provider value={contextValue}>\n        <ButtonSplitElement\n          {...filterBaseProps(rest, { eventProps: true })}\n          ref={ref}\n          data-button-split\n          styles={mergedStyles}\n          qa={rest.qa}\n          // Custom mode renders peer buttons with no visible group label, which\n          // is exactly when a caller needs `aria-label` to land on something the\n          // AT will announce. `role` comes from `BaseProps`, so a caller that\n          // wants something else — including `presentation` to opt out — just\n          // passes it. Strict mode keeps its previous shape.\n          role={role ?? (isCustomMode ? 'group' : undefined)}\n        >\n          {isCustomMode ? (\n            children\n          ) : actions ? (\n            <>\n              <Button\n                type={type}\n                theme={theme}\n                size={size}\n                isDisabled={isDisabled}\n                icon={currentAction?.icon}\n                tooltip={currentAction?.tooltip}\n                {...mergeProps(actionProps, { onPress: handleActionPress })}\n              >\n                {currentAction?.label}\n              </Button>\n              <Menu.Trigger placement=\"bottom end\">\n                <Button\n                  type={type}\n                  theme={theme}\n                  size={size}\n                  isDisabled={isDisabled}\n                  aria-label=\"More options\"\n                  icon={({ pressed }) => (\n                    <DirectionIcon to={pressed ? 'up' : 'down'} />\n                  )}\n                  {...triggerProps}\n                />\n                <Menu\n                  selectionMode=\"single\"\n                  selectedKeys={currentKey ? [currentKey] : []}\n                  onSelectionChange={handleSelectionChange}\n                  {...menuProps}\n                >\n                  {actions.map(({ key, label, textValue, ...itemProps }) => (\n                    <Menu.Item\n                      key={key}\n                      textValue={\n                        textValue ?? (typeof label === 'string' ? label : key)\n                      }\n                      {...itemProps}\n                    >\n                      {label}\n                    </Menu.Item>\n                  ))}\n                </Menu>\n              </Menu.Trigger>\n            </>\n          ) : null}\n        </ButtonSplitElement>\n      </ButtonSplitContext.Provider>\n    );\n  },\n);\n\nButtonSplit.displayName = 'ButtonSplit';\n"],"mappings":";;;;;;;;;;;;AA4DA,MAAMwC,cAAcxC;AAEpB,MAAMyC,qBAAqBvC,MAAM;CAC/BwC,IAAI;CACJC,IAAI;CACJL,QAAQ;EACNM,SAAS;EACTC,UAAU;EACVC,eAAe;EACjB;CACD,CAAC;AAEF,MAAaC,cAAc5C,WACzB,SAAS4C,YAAYE,OAAOC,KAAK;CAC/B,MAAM,EACJzB,SACAC,WAAWyB,qBACXxB,kBACAC,UACAC,gBACAC,MACAC,OACAC,MACAC,YACAC,aACAE,cACAC,WACAC,QACAC,UACAa,MACA,GAAGC,SACDJ;CAEJ,MAAMK,eAAeH,wBAAwBI;CAC7C,MAAM,CAACC,iBAAiBC,sBAAsBlD,eACtCoB,oBAAoBF,UAAU,IAAIH,IACzC;CAED,MAAMoC,aAAaJ,eAAeH,sBAAsBK;CAExD,MAAMG,gBAAgBrD,cACdmB,SAASmC,MAAMC,MAAMA,EAAEvC,QAAQoC,WAAW,IAAIjC,UAAU,IAC9D,CAACA,SAASiC,WACZ,CAAC;CAED,MAAMI,oBAAoBzD,kBAAkB;AAC1C,MAAIqD,WACF9B,YAAW8B,WAAW;IAEvB,CAACA,YAAY9B,SAAS,CAAC;CAE1B,MAAMmC,wBAAwB1D,aAC3B2D,SAAmB;EAClB,MAAMC,SAASD,KAAK;AAEpB,MAAIC,QAAQ;AACV,OAAI,CAACX,aACHG,oBAAmBQ,OAAO;AAG5BpC,oBAAiBoC,OAAO;;IAG5B,CAACX,cAAczB,eACjB,CAAC;CAED,MAAMqC,kBAAkBxD,cAAc2C,MAAMb,YAAY;CAExD,MAAM2B,eAAe7D,eACZ;EACL,GAAG4D;EACH,GAAG5B;EACJ,GACD,CAAC4B,iBAAiB5B,OACpB,CAAC;CAED,MAAM8B,eAAe9D,eACZ;EACLoD;EACA9B;EACAC;EACAC;EACAC;EACAC;EACAC;EACD,GACD;EAACyB;EAAY9B;EAAUC;EAAgBC;EAAMC;EAAOC;EAAMC;EAC5D,CAAC;CAED,MAAMoC,eAAe9B,YAAY;AAEjC,QACE,oBAAC,mBAAmB;EAAS,OAAO6B;YAClC,oBAAC;GACC,GAAInE,gBAAgBoD,MAAM,EAAEiB,YAAY,MAAM,CAAC;GAC1CpB;GACL;GACA,QAAQiB;GACR,IAAId,KAAKV;GAMT,MAAMS,SAASiB,eAAe,UAAUd;aAEvCc,eACC9B,WACEd,UACF,8CACE,oBAAC;IACOK;IACCC;IACDC;IACMC;IACZ,MAAM0B,eAAeY;IACrB,SAASZ,eAAea;IACxB,GAAI/D,WAAWyB,aAAa,EAAEuC,SAASX,mBAAmB,CAAC;cAE1DH,eAAepC;KACV,EACR,qBAAC,OAAK;IAAQ,WAAU;eACtB,oBAAC;KACOO;KACCC;KACDC;KACMC;KACZ,cAAW;KACX,OAAO,EAAEyC,cACP,oBAAC,iBAAc,IAAIA,UAAU,OAAO,SACrC;KACD,GAAItC;MAAa,EAEnB,oBAAC;KACC,eAAc;KACd,cAAcsB,aAAa,CAACA,WAAW,GAAG,EAAE;KAC5C,mBAAmBK;KACnB,GAAI1B;eAEHZ,QAAQkD,KAAK,EAAErD,KAAKC,OAAOqD,WAAW,GAAGC,gBACxC,oBAAC,OAAK;MAEJ,WACED,cAAc,OAAOrD,UAAU,WAAWA,QAAQD;MAEpD,GAAIuD;gBAEHtD;QANID,IAQR,CAAC;MACE;KACM,IACb,GACD;IACc;GACQ;EAGnC;AAEDyB,YAAY+B,cAAc"}
+{"version":3,"file":"ButtonSplit.js","names":["CONTAINER_STYLES","filterBaseProps","tasty","forwardRef","ReactNode","useMemo","useState","DirectionIcon","mergeProps","extractStyles","Button","Menu","ButtonSplitContext","BaseProps","ContainerStyleProps","Styles","CubeCollectionItemProps","CubeButtonProps","CubeMenuProps","ButtonSplitAction","Omit","key","label","CubeButtonSplitProps","actions","actionKey","defaultActionKey","onAction","onActionChange","type","theme","size","isDisabled","actionProps","Partial","triggerProps","menuProps","styles","children","STYLE_PROPS","ButtonSplitElement","as","qa","display","position","verticalAlign","ButtonSplit","HTMLDivElement","props","ref","$","_c","controlledActionKey","role","rest","isControlled","undefined","t0","uncontrolledKey","setUncontrolledKey","currentKey","t1","find","a","currentAction","t2","handleActionPress","t3","keys","newKey","handleSelectionChange","containerStyles","mergedStyles","t4","contextValue","isCustomMode","t5","icon","tooltip","onPress","_temp","map","_temp2","eventProps","displayName","pressed","textValue","itemProps"],"sources":["../../../../src/components/actions/ButtonSplit/ButtonSplit.tsx"],"sourcesContent":["import { CONTAINER_STYLES, filterBaseProps, tasty } from '@tenphi/tasty';\nimport { forwardRef, ReactNode, useMemo, useState } from 'react';\n\nimport { DirectionIcon } from '../../../icons/DirectionIcon';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { Button } from '../Button/Button';\nimport { Menu } from '../Menu/Menu';\n\nimport { ButtonSplitContext } from './context';\n\nimport type { BaseProps, ContainerStyleProps, Styles } from '@tenphi/tasty';\nimport type { CubeCollectionItemProps } from '../../CollectionItem';\nimport type { CubeButtonProps } from '../Button/Button';\nimport type { CubeMenuProps } from '../Menu/Menu';\n\nexport interface ButtonSplitAction\n  extends Omit<\n    CubeCollectionItemProps<object>,\n    'children' | 'onAction' | 'wrapper'\n  > {\n  key: string;\n  label: ReactNode;\n}\n\nexport interface CubeButtonSplitProps extends BaseProps, ContainerStyleProps {\n  /** Actions for strict mode. When provided, renders action + trigger buttons automatically. */\n  actions?: ButtonSplitAction[];\n  /** Currently selected action key (controlled). */\n  actionKey?: string;\n  /** Initially selected action key (uncontrolled). */\n  defaultActionKey?: string;\n  /** Called when the action button is pressed. Receives the current action key. */\n  onAction?: (key: string) => void;\n  /** Called when the selected action changes via the trigger menu. */\n  onActionChange?: (key: string) => void;\n\n  /** Button type applied to both action and trigger buttons in strict mode. */\n  type?: CubeButtonProps['type'];\n  /** Button theme applied to both action and trigger buttons in strict mode. */\n  theme?: CubeButtonProps['theme'];\n  /** Button size applied to both action and trigger buttons in strict mode. */\n  size?: CubeButtonProps['size'];\n  /** Disables both buttons in strict mode. */\n  isDisabled?: boolean;\n\n  /** Additional props for the action button in strict mode. */\n  actionProps?: Partial<CubeButtonProps>;\n  /** Additional props for the trigger button in strict mode. */\n  triggerProps?: Partial<CubeButtonProps>;\n  /** Additional props for the dropdown menu in strict mode. */\n  menuProps?: Partial<CubeMenuProps<object>>;\n\n  /** Custom styles for the wrapper element. */\n  styles?: Styles;\n\n  /** Custom mode: render arbitrary Button children. */\n  children?: ReactNode;\n}\n\nconst STYLE_PROPS = CONTAINER_STYLES;\n\nconst ButtonSplitElement = tasty({\n  as: 'div',\n  qa: 'ButtonSplit',\n  styles: {\n    display: 'inline-flex',\n    position: 'relative',\n    verticalAlign: 'bottom',\n  },\n});\n\nexport const ButtonSplit = forwardRef<HTMLDivElement, CubeButtonSplitProps>(\n  function ButtonSplit(props, ref) {\n    const {\n      actions,\n      actionKey: controlledActionKey,\n      defaultActionKey,\n      onAction,\n      onActionChange,\n      type,\n      theme,\n      size,\n      isDisabled,\n      actionProps,\n      triggerProps,\n      menuProps,\n      styles,\n      children,\n      role,\n      ...rest\n    } = props;\n\n    const isControlled = controlledActionKey !== undefined;\n    const [uncontrolledKey, setUncontrolledKey] = useState(\n      () => defaultActionKey ?? actions?.[0]?.key,\n    );\n\n    const currentKey = isControlled ? controlledActionKey : uncontrolledKey;\n\n    const currentAction =\n      actions?.find((a) => a.key === currentKey) ?? actions?.[0];\n\n    const handleActionPress = () => {\n      if (currentKey) {\n        onAction?.(currentKey);\n      }\n    };\n\n    const handleSelectionChange = (keys: string[]) => {\n      const newKey = keys[0];\n\n      if (newKey) {\n        if (!isControlled) {\n          setUncontrolledKey(newKey);\n        }\n\n        onActionChange?.(newKey);\n      }\n    };\n\n    const containerStyles = extractStyles(rest, STYLE_PROPS);\n\n    const mergedStyles: Styles = {\n      ...containerStyles,\n      ...styles,\n    };\n\n    const contextValue = useMemo(\n      () => ({\n        currentKey,\n        onAction,\n        onActionChange,\n        type,\n        theme,\n        size,\n        isDisabled,\n      }),\n      [currentKey, onAction, onActionChange, type, theme, size, isDisabled],\n    );\n\n    const isCustomMode = children != null;\n\n    return (\n      <ButtonSplitContext.Provider value={contextValue}>\n        <ButtonSplitElement\n          {...filterBaseProps(rest, { eventProps: true })}\n          ref={ref}\n          data-button-split\n          styles={mergedStyles}\n          qa={rest.qa}\n          // Custom mode renders peer buttons with no visible group label, which\n          // is exactly when a caller needs `aria-label` to land on something the\n          // AT will announce. `role` comes from `BaseProps`, so a caller that\n          // wants something else — including `presentation` to opt out — just\n          // passes it. Strict mode keeps its previous shape.\n          role={role ?? (isCustomMode ? 'group' : undefined)}\n        >\n          {isCustomMode ? (\n            children\n          ) : actions ? (\n            <>\n              <Button\n                type={type}\n                theme={theme}\n                size={size}\n                isDisabled={isDisabled}\n                icon={currentAction?.icon}\n                tooltip={currentAction?.tooltip}\n                {...mergeProps(actionProps, { onPress: handleActionPress })}\n              >\n                {currentAction?.label}\n              </Button>\n              <Menu.Trigger placement=\"bottom end\">\n                <Button\n                  type={type}\n                  theme={theme}\n                  size={size}\n                  isDisabled={isDisabled}\n                  aria-label=\"More options\"\n                  icon={({ pressed }) => (\n                    <DirectionIcon to={pressed ? 'up' : 'down'} />\n                  )}\n                  {...triggerProps}\n                />\n                <Menu\n                  selectionMode=\"single\"\n                  selectedKeys={currentKey ? [currentKey] : []}\n                  onSelectionChange={handleSelectionChange}\n                  {...menuProps}\n                >\n                  {actions.map(({ key, label, textValue, ...itemProps }) => (\n                    <Menu.Item\n                      key={key}\n                      textValue={\n                        textValue ?? (typeof label === 'string' ? label : key)\n                      }\n                      {...itemProps}\n                    >\n                      {label}\n                    </Menu.Item>\n                  ))}\n                </Menu>\n              </Menu.Trigger>\n            </>\n          ) : null}\n        </ButtonSplitElement>\n      </ButtonSplitContext.Provider>\n    );\n  },\n);\n\nButtonSplit.displayName = 'ButtonSplit';\n"],"mappings":"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"}

package/dist/components/actions/ButtonSplit/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0b79a39 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c02e70f | Cube Dev Team */
 import { createContext, useContext } from "react";
 
 //#region src/components/actions/ButtonSplit/context.ts