npm - @cube-dev/ui-kit - Versions diffs - 0.206.3 → 0.208.0 - Mend

@cube-dev/ui-kit 0.206.3 → 0.208.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (858) hide show

package/dist/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,23 @@
 # @cube-dev/ui-kit
+## 0.208.0
+### Minor Changes
+- [#1616](https://github.com/cube-js/cube-ui-kit/pull/1616) [`17e92e5ea`](https://github.com/cube-js/cube-ui-kit/commit/17e92e5ea5d4de7a4c5ef1211b46547a6c2577fd) Thanks [@tenphi](https://github.com/tenphi)! - The palette runs on Glaze 3 (`@tenphi/glaze` 3.0.1). `shadow-sm` / `shadow-md` / `shadow-lg` are tuned for Glaze 3's shadow model so they keep the depth they had in light and dark mode on the default surface (with tinted surfaces the dark shadows come out up to about 1.4 tones lighter). In high-contrast dark mode, where the surface is black, they are now transparent instead of opaque black. In the light scheme at normal contrast no color moves by more than 1 tone. Elsewhere colors move by up to about 3 tones (code syntax colors in light high contrast), most by under 1.5, and every text color keeps its WCAG level.
+  UI Kit re-exports Glaze, so code that imports Glaze functions or types from `@cube-dev/ui-kit` now gets Glaze 3: it throws on invalid input that 2.x resolved to wrong colors, and some output options are gone. See "Upgrading Glaze" in Glaze's migration guide (`docs/glaze/migration.md` in this package).
+### Patch Changes
+- [#1623](https://github.com/cube-js/cube-ui-kit/pull/1623) [`d29a8bf73`](https://github.com/cube-js/cube-ui-kit/commit/d29a8bf73bf3789a13542cf2a79764494d3204a0) Thanks [@tenphi](https://github.com/tenphi)! - `type="primary"` buttons (also `Item` and `ItemAction`) no longer draw a visible border. The old border was a lighter, more saturated shade of the fill that glowed in dark mode, so filled buttons looked larger than outline buttons of the same size. The fill now covers the whole button. Inside `Button.Split`, primary halves are divided by a 1px gap that shows the background behind the split, instead of a shared border. The `current` theme keeps its rim on disabled buttons. The `*-accent-surface-border` tokens are still published.
+## 0.207.0
+### Minor Changes
+- [#1625](https://github.com/cube-js/cube-ui-kit/pull/1625) [`e555c3add`](https://github.com/cube-js/cube-ui-kit/commit/e555c3addac1f3e9f05824ba716588bc53a4b70c) Thanks [@tenphi](https://github.com/tenphi)! - `Button` takes a `shape` prop (`button`, `card`, `sharp` or `pill`) with the same names as `Item`'s, so a round, square-cornered or card-radius button no longer needs a `radius` override. A `link` button and the joined edges inside a `Button.Split` keep their own radius.
 ## 0.206.3
 ### Patch Changes

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | Cube Dev Team */
 import { c } from "react/compiler-runtime";
 import { useEffect, useRef, useState } from "react";
 //#region src/_internal/hooks/use-debounced-value.ts

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | 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 CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | Cube Dev Team */
 import { useSyncRef } from "./use-sync-ref.js";
 import { c } from "react/compiler-runtime";
 //#region src/_internal/hooks/use-event.ts

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | Cube Dev Team */
 import { useRef } from "react";
 //#region src/_internal/hooks/use-is-first-render.ts
 function useIsFirstRender() {

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | 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-sync-ref.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-sync-ref.js","names":["MutableRefObject","useRef","useLayoutEffect","useSyncRef","value","$","_c","ref","t0","current","_c"],"sources":["../../../src/_internal/hooks/use-sync-ref.ts"],"sourcesContent":["import { MutableRefObject, useRef } from 'react';\n\nimport { useLayoutEffect } from '../../utils/react';\n\nexport function useSyncRef<T>(value: T): MutableRefObject<T> {\n const ref = useRef<T>(value);\n\n useLayoutEffect(() => {\n ref.current = value;\n });\n\n return ref;\n}\n"],"mappings":";;;;;AAIA,SAAOG,WAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CACL,MAAAC,MAAYN,OAAUG,KAAK;CAAE,IAAAI;CAAA,IAAAH,EAAA,OAAAD,OAAA;EAEbI,WAAA;GACdD,IAAGE,UAAWL;EAAH;EACZC,EAAA,KAAAD;EAAAC,EAAA,KAAAG;CAAA,OAAAA,KAAAH,EAAA;CAFDH,kBAAgBM,EAEf;CAAC,OAEKD;AAAG"}
1	+ {"version":3,"file":"use-sync-ref.js","names":["MutableRefObject","useRef","useLayoutEffect","useSyncRef","value","$","_c","ref","t0","current","_c"],"sources":["../../../src/_internal/hooks/use-sync-ref.ts"],"sourcesContent":["import { MutableRefObject, useRef } from 'react';\n\nimport { useLayoutEffect } from '../../utils/react/useLayoutEffect';\n\nexport function useSyncRef<T>(value: T): MutableRefObject<T> {\n const ref = useRef<T>(value);\n\n useLayoutEffect(() => {\n ref.current = value;\n });\n\n return ref;\n}\n"],"mappings":";;;;;AAIA,SAAOG,WAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CACL,MAAAC,MAAYN,OAAUG,KAAK;CAAE,IAAAI;CAAA,IAAAH,EAAA,OAAAD,OAAA;EAEbI,WAAA;GACdD,IAAGE,UAAWL;EAAH;EACZC,EAAA,KAAAD;EAAAC,EAAA,KAAAG;CAAA,OAAAA,KAAAH,EAAA;CAFDH,kBAAgBM,EAEf;CAAC,OAEKD;AAAG"}

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | 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 CHANGED Viewed

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

package/dist/components/Block.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | 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.d.ts CHANGED Viewed

@@ -1,8 +1,6 @@
 import { ItemAction } from "./actions/ItemAction/ItemAction.js";
-import "./actions/ItemAction/index.js";
 import { ItemBadge } from "./content/ItemBadge/ItemBadge.js";
-import "./content/ItemBadge/index.js";
 import { CubeItemBaseProps as CubeItemProps } from "./content/Item/Item.js";
 import { ReactElement } from "react";
 import { ItemProps, ListState } from "react-stately";

package/dist/components/CollectionItem.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | 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/CollectionItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CollectionItem.js","names":["ReactElement","Item","ItemProps","ListCollection","ItemAction","CubeItemProps","ItemBadge","LinkDOMProps","Node","ListState","COLLECTION_ITEM_CLICK","Symbol","CubeCollectionItemBaseProps","Omit","T","onAction","wrapper","item","CubeCollectionItemProps","href","to","navigationOptions","routerOptions","hrefLang","target","rel","download","ping","referrerPolicy","key","SERVICE_PROPS","Set","NAVIGATION_PROPS","filterSelectionItemProps","itemProps","Record","PropertyKey","filtered","undefined","onClick","hasNavigationItem","nodes","Iterable","node","props","type","childNodes","selectionNodes","Array","from","getValueSelectionState","state","S","collection","selectionManager","withCollection","filterCollectionItemProps","Object","prototype","hasOwnProperty","call","has","CollectionItem","_props","_CollectionItem","Action","Badge","assign","getCollectionNode","context"],"sources":["../../src/components/CollectionItem.tsx"],"sourcesContent":["import { ReactElement } from 'react';\nimport { Item, ItemProps } from 'react-stately';\nimport { ListCollection } from 'react-stately/private/list/ListCollection';\n\nimport { ItemAction } from './actions/ItemAction';\nimport { CubeItemProps } from './content/Item/Item';\nimport { ItemBadge } from './content/ItemBadge';\n\nimport type { LinkDOMProps, Node } from '@react-types/shared';\nimport type { ListState } from 'react-stately';\n\n// Menu defers link clicks; selection controls restore them when removing links.\nexport const COLLECTION_ITEM_CLICK = Symbol('CollectionItem deferred click');\n\nexport interface CubeCollectionItemBaseProps<T>\n extends\n Omit<ItemProps<T>, keyof LinkDOMProps>,\n Omit<CubeItemProps, 'children' \| keyof LinkDOMProps> {\n onAction?: () => void;\n wrapper?: (item: ReactElement) => ReactElement;\n}\n\n/** Value-selection options cannot navigate. Menu owns navigation items. /\nexport interface CubeCollectionItemProps<\n T,\n> extends CubeCollectionItemBaseProps<T> {\n href?: never;\n to?: never;\n navigationOptions?: never;\n routerOptions?: never;\n hrefLang?: never;\n target?: never;\n rel?: never;\n download?: never;\n ping?: never;\n referrerPolicy?: never;\n [key: string]: any;\n}\n\n/\n Service props that are used by react-stately or parent components\n * and should not be passed to the Item component.\n /\nconst SERVICE_PROPS = new Set([\n // React Stately props\n 'textValue',\n 'hasChildItems',\n 'childItems',\n 'title',\n // Custom service props\n 'onAction',\n 'wrapper',\n 'keywords', // CommandMenu-specific\n 'forceMount', // CommandMenu-specific\n]);\n\nconst NAVIGATION_PROPS = [\n 'href',\n 'to',\n 'navigationOptions',\n 'routerOptions',\n 'hrefLang',\n 'target',\n 'rel',\n 'download',\n 'ping',\n 'referrerPolicy',\n 'data-href',\n 'data-target',\n 'data-rel',\n 'data-download',\n 'data-ping',\n 'data-referrer-policy',\n];\n\n/* Keeps options as value selections even when a different item factory is used. /\nexport function filterSelectionItemProps(\n itemProps: Record<PropertyKey, any> \| undefined,\n): Record<PropertyKey, any> {\n const filtered = { ...itemProps };\n\n for (const key of NAVIGATION_PROPS) {\n delete filtered[key];\n }\n\n if (filtered[COLLECTION_ITEM_CLICK] !== undefined) {\n filtered.onClick = filtered[COLLECTION_ITEM_CLICK];\n }\n delete filtered[COLLECTION_ITEM_CLICK];\n\n return filtered;\n}\n\nfunction hasNavigationItem<T>(nodes: Iterable<Node<T>>): boolean {\n for (const node of nodes) {\n if (\n node.props?.href != null \|\|\n node.props?.to != null \|\|\n node.props?.['data-href'] != null \|\|\n (node.type === 'section' && hasNavigationItem(node.childNodes))\n ) {\n return true;\n }\n }\n\n return false;\n}\n\nfunction selectionNodes<T>(nodes: Iterable<Node<T>>): Node<T>[] {\n return Array.from(nodes, (node) => ({\n ...node,\n props: filterSelectionItemProps(node.props),\n childNodes: selectionNodes(node.childNodes),\n }));\n}\n\n/* Bound selection semantics at the control, including foreign item factories. /\nexport function getValueSelectionState<S extends ListState<any>>(state: S): S {\n if (!hasNavigationItem(state.collection)) {\n return state;\n }\n\n // ListCollection owns its nodes, so give it copies instead of changing the input.\n const collection = new ListCollection(selectionNodes(state.collection));\n\n return {\n ...state,\n collection,\n selectionManager: state.selectionManager.withCollection(collection),\n };\n}\n\n/\n Filters out service props from collection item props, returning only\n * props that should be passed to the Item component.\n \n This eliminates the need to manually extract and pass Item props\n * in components like MenuItem, ListBox Option, and Select Option.\n \n @param itemProps - The props from a collection item (node.props)\n * @returns Filtered props safe to spread onto Item component\n \n @example\n * ```tsx\n * const itemProps = filterCollectionItemProps(item.props);\n * return <Item {...itemProps} />;\n * ```\n */\nexport function filterCollectionItemProps(\n itemProps: Record<string, any> \| undefined,\n): Record<string, any> {\n if (!itemProps) {\n return {};\n }\n\n const filtered: Record<string, any> = {};\n\n for (const key in itemProps) {\n if (\n Object.prototype.hasOwnProperty.call(itemProps, key) &&\n !SERVICE_PROPS.has(key)\n ) {\n filtered[key] = itemProps[key];\n }\n }\n\n return filtered;\n}\n\nfunction CollectionItem<T>(\n _props: CubeCollectionItemProps<T>,\n): ReactElement \| null {\n return null;\n}\n\nconst _CollectionItem: typeof CollectionItem & {\n Action: typeof ItemAction;\n Badge: typeof ItemBadge;\n} = Object.assign(CollectionItem, {\n Action: ItemAction,\n Badge: ItemBadge,\n getCollectionNode<T>(props: CubeCollectionItemProps<T>, context: unknown) {\n // Strip destinations before Aria builds selection state, including JS callers.\n return (Item as any).getCollectionNode(\n filterSelectionItemProps(props),\n context,\n );\n },\n});\n\nexport { _CollectionItem as CollectionItem };\n"],"mappings":";;;;;;AAYA,MAAaU,wBAAwBC,OAAO,+BAA+B;;;;;AA+B3E,MAAMmB,gCAAgB,IAAIC,IAAI;CAE5B;CACA;CACA;CACA;CAEA;CACA;CACA;CACA;AAAc,CACf;AAED,MAAMC,mBAAmB;CACvB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AAAsB;;AAIxB,SAAgBC,yBACdC,WAC0B;CAC1B,MAAMG,WAAW,EAAE,GAAGH,UAAU;CAEhC,KAAK,MAAML,OAAOG,kBAChB,OAAOK,SAASR;CAGlB,IAAIQ,SAAS3B,2BAA2B4B,KAAAA,GACtCD,SAASE,UAAUF,SAAS3B;CAE9B,OAAO2B,SAAS3B;CAEhB,OAAO2B;AACT;AAEA,SAASG,kBAAqBC,OAAmC;CAC/D,KAAK,MAAME,QAAQF,OACjB,IACEE,KAAKC,OAAOzB,QAAQ,QACpBwB,KAAKC,OAAOxB,MAAM,QAClBuB,KAAKC,QAAQ,gBAAgB,QAC5BD,KAAKE,SAAS,aAAaL,kBAAkBG,KAAKG,UAAU,GAE7D,OAAO;CAIX,OAAO;AACT;AAEA,SAASC,eAAkBN,OAAqC;CAC9D,OAAOO,MAAMC,KAAKR,QAAQE,UAAU;EAClC,GAAGA;EACHC,OAAOX,yBAAyBU,KAAKC,KAAK;EAC1CE,YAAYC,eAAeJ,KAAKG,UAAU;CAC5C,EAAE;AACJ;;AAGA,SAAgBI,uBAAiDC,OAAa;CAC5E,IAAI,CAACX,kBAAkBW,MAAME,UAAU,GACrC,OAAOF;CAIT,MAAME,aAAa,IAAIlD,eAAe4C,eAAeI,MAAME,UAAU,CAAC;CAEtE,OAAO;EACL,GAAGF;EACHE;EACAC,kBAAkBH,MAAMG,iBAAiBC,eAAeF,UAAU;CACpE;AACF;;;;;;;;;;;;;;;;;AAkBA,SAAgBG,0BACdtB,WACqB;CACrB,IAAI,CAACA,WACH,OAAO,CAAC;CAGV,MAAMG,WAAgC,CAAC;CAEvC,KAAK,MAAMR,OAAOK,WAChB,IACEuB,OAAOC,UAAUC,eAAeC,KAAK1B,WAAWL,GAAG,KACnD,CAACC,cAAc+B,IAAIhC,GAAG,GAEtBQ,SAASR,OAAOK,UAAUL;CAI9B,OAAOQ;AACT;AAEA,SAASyB,eACPC,QACqB;CACrB,OAAO;AACT;AAEA,MAAMC,kBAGFP,OAAOU,OAAOL,gBAAgB;CAChCG,QAAQ7D;CACR8D,OAAO5D;CACP8D,kBAAqBxB,OAAmCyB,SAAkB;EAExE,OAAQpE,KAAamE,kBACnBnC,yBAAyBW,KAAK,GAC9ByB,OACF;CACF;AACF,CAAC"}
1	+ {"version":3,"file":"CollectionItem.js","names":["ReactElement","Item","ItemProps","ListCollection","ItemAction","CubeItemProps","ItemBadge","LinkDOMProps","Node","ListState","COLLECTION_ITEM_CLICK","Symbol","CubeCollectionItemBaseProps","Omit","T","onAction","wrapper","item","CubeCollectionItemProps","href","to","navigationOptions","routerOptions","hrefLang","target","rel","download","ping","referrerPolicy","key","SERVICE_PROPS","Set","NAVIGATION_PROPS","filterSelectionItemProps","itemProps","Record","PropertyKey","filtered","undefined","onClick","hasNavigationItem","nodes","Iterable","node","props","type","childNodes","selectionNodes","Array","from","getValueSelectionState","state","S","collection","selectionManager","withCollection","filterCollectionItemProps","Object","prototype","hasOwnProperty","call","has","CollectionItem","_props","_CollectionItem","Action","Badge","assign","getCollectionNode","context"],"sources":["../../src/components/CollectionItem.tsx"],"sourcesContent":["import { ReactElement } from 'react';\nimport { Item, ItemProps } from 'react-stately';\nimport { ListCollection } from 'react-stately/private/list/ListCollection';\n\nimport { ItemAction } from './actions/ItemAction/ItemAction';\nimport { CubeItemProps } from './content/Item/Item';\nimport { ItemBadge } from './content/ItemBadge/ItemBadge';\n\nimport type { LinkDOMProps, Node } from '@react-types/shared';\nimport type { ListState } from 'react-stately';\n\n// Menu defers link clicks; selection controls restore them when removing links.\nexport const COLLECTION_ITEM_CLICK = Symbol('CollectionItem deferred click');\n\nexport interface CubeCollectionItemBaseProps<T>\n extends\n Omit<ItemProps<T>, keyof LinkDOMProps>,\n Omit<CubeItemProps, 'children' \| keyof LinkDOMProps> {\n onAction?: () => void;\n wrapper?: (item: ReactElement) => ReactElement;\n}\n\n/** Value-selection options cannot navigate. Menu owns navigation items. /\nexport interface CubeCollectionItemProps<\n T,\n> extends CubeCollectionItemBaseProps<T> {\n href?: never;\n to?: never;\n navigationOptions?: never;\n routerOptions?: never;\n hrefLang?: never;\n target?: never;\n rel?: never;\n download?: never;\n ping?: never;\n referrerPolicy?: never;\n [key: string]: any;\n}\n\n/\n Service props that are used by react-stately or parent components\n * and should not be passed to the Item component.\n /\nconst SERVICE_PROPS = new Set([\n // React Stately props\n 'textValue',\n 'hasChildItems',\n 'childItems',\n 'title',\n // Custom service props\n 'onAction',\n 'wrapper',\n 'keywords', // CommandMenu-specific\n 'forceMount', // CommandMenu-specific\n]);\n\nconst NAVIGATION_PROPS = [\n 'href',\n 'to',\n 'navigationOptions',\n 'routerOptions',\n 'hrefLang',\n 'target',\n 'rel',\n 'download',\n 'ping',\n 'referrerPolicy',\n 'data-href',\n 'data-target',\n 'data-rel',\n 'data-download',\n 'data-ping',\n 'data-referrer-policy',\n];\n\n/* Keeps options as value selections even when a different item factory is used. /\nexport function filterSelectionItemProps(\n itemProps: Record<PropertyKey, any> \| undefined,\n): Record<PropertyKey, any> {\n const filtered = { ...itemProps };\n\n for (const key of NAVIGATION_PROPS) {\n delete filtered[key];\n }\n\n if (filtered[COLLECTION_ITEM_CLICK] !== undefined) {\n filtered.onClick = filtered[COLLECTION_ITEM_CLICK];\n }\n delete filtered[COLLECTION_ITEM_CLICK];\n\n return filtered;\n}\n\nfunction hasNavigationItem<T>(nodes: Iterable<Node<T>>): boolean {\n for (const node of nodes) {\n if (\n node.props?.href != null \|\|\n node.props?.to != null \|\|\n node.props?.['data-href'] != null \|\|\n (node.type === 'section' && hasNavigationItem(node.childNodes))\n ) {\n return true;\n }\n }\n\n return false;\n}\n\nfunction selectionNodes<T>(nodes: Iterable<Node<T>>): Node<T>[] {\n return Array.from(nodes, (node) => ({\n ...node,\n props: filterSelectionItemProps(node.props),\n childNodes: selectionNodes(node.childNodes),\n }));\n}\n\n/* Bound selection semantics at the control, including foreign item factories. /\nexport function getValueSelectionState<S extends ListState<any>>(state: S): S {\n if (!hasNavigationItem(state.collection)) {\n return state;\n }\n\n // ListCollection owns its nodes, so give it copies instead of changing the input.\n const collection = new ListCollection(selectionNodes(state.collection));\n\n return {\n ...state,\n collection,\n selectionManager: state.selectionManager.withCollection(collection),\n };\n}\n\n/\n Filters out service props from collection item props, returning only\n * props that should be passed to the Item component.\n \n This eliminates the need to manually extract and pass Item props\n * in components like MenuItem, ListBox Option, and Select Option.\n \n @param itemProps - The props from a collection item (node.props)\n * @returns Filtered props safe to spread onto Item component\n \n @example\n * ```tsx\n * const itemProps = filterCollectionItemProps(item.props);\n * return <Item {...itemProps} />;\n * ```\n */\nexport function filterCollectionItemProps(\n itemProps: Record<string, any> \| undefined,\n): Record<string, any> {\n if (!itemProps) {\n return {};\n }\n\n const filtered: Record<string, any> = {};\n\n for (const key in itemProps) {\n if (\n Object.prototype.hasOwnProperty.call(itemProps, key) &&\n !SERVICE_PROPS.has(key)\n ) {\n filtered[key] = itemProps[key];\n }\n }\n\n return filtered;\n}\n\nfunction CollectionItem<T>(\n _props: CubeCollectionItemProps<T>,\n): ReactElement \| null {\n return null;\n}\n\nconst _CollectionItem: typeof CollectionItem & {\n Action: typeof ItemAction;\n Badge: typeof ItemBadge;\n} = Object.assign(CollectionItem, {\n Action: ItemAction,\n Badge: ItemBadge,\n getCollectionNode<T>(props: CubeCollectionItemProps<T>, context: unknown) {\n // Strip destinations before Aria builds selection state, including JS callers.\n return (Item as any).getCollectionNode(\n filterSelectionItemProps(props),\n context,\n );\n },\n});\n\nexport { _CollectionItem as CollectionItem };\n"],"mappings":";;;;;;AAYA,MAAaU,wBAAwBC,OAAO,+BAA+B;;;;;AA+B3E,MAAMmB,gCAAgB,IAAIC,IAAI;CAE5B;CACA;CACA;CACA;CAEA;CACA;CACA;CACA;AAAc,CACf;AAED,MAAMC,mBAAmB;CACvB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AAAsB;;AAIxB,SAAgBC,yBACdC,WAC0B;CAC1B,MAAMG,WAAW,EAAE,GAAGH,UAAU;CAEhC,KAAK,MAAML,OAAOG,kBAChB,OAAOK,SAASR;CAGlB,IAAIQ,SAAS3B,2BAA2B4B,KAAAA,GACtCD,SAASE,UAAUF,SAAS3B;CAE9B,OAAO2B,SAAS3B;CAEhB,OAAO2B;AACT;AAEA,SAASG,kBAAqBC,OAAmC;CAC/D,KAAK,MAAME,QAAQF,OACjB,IACEE,KAAKC,OAAOzB,QAAQ,QACpBwB,KAAKC,OAAOxB,MAAM,QAClBuB,KAAKC,QAAQ,gBAAgB,QAC5BD,KAAKE,SAAS,aAAaL,kBAAkBG,KAAKG,UAAU,GAE7D,OAAO;CAIX,OAAO;AACT;AAEA,SAASC,eAAkBN,OAAqC;CAC9D,OAAOO,MAAMC,KAAKR,QAAQE,UAAU;EAClC,GAAGA;EACHC,OAAOX,yBAAyBU,KAAKC,KAAK;EAC1CE,YAAYC,eAAeJ,KAAKG,UAAU;CAC5C,EAAE;AACJ;;AAGA,SAAgBI,uBAAiDC,OAAa;CAC5E,IAAI,CAACX,kBAAkBW,MAAME,UAAU,GACrC,OAAOF;CAIT,MAAME,aAAa,IAAIlD,eAAe4C,eAAeI,MAAME,UAAU,CAAC;CAEtE,OAAO;EACL,GAAGF;EACHE;EACAC,kBAAkBH,MAAMG,iBAAiBC,eAAeF,UAAU;CACpE;AACF;;;;;;;;;;;;;;;;;AAkBA,SAAgBG,0BACdtB,WACqB;CACrB,IAAI,CAACA,WACH,OAAO,CAAC;CAGV,MAAMG,WAAgC,CAAC;CAEvC,KAAK,MAAMR,OAAOK,WAChB,IACEuB,OAAOC,UAAUC,eAAeC,KAAK1B,WAAWL,GAAG,KACnD,CAACC,cAAc+B,IAAIhC,GAAG,GAEtBQ,SAASR,OAAOK,UAAUL;CAI9B,OAAOQ;AACT;AAEA,SAASyB,eACPC,QACqB;CACrB,OAAO;AACT;AAEA,MAAMC,kBAGFP,OAAOU,OAAOL,gBAAgB;CAChCG,QAAQ7D;CACR8D,OAAO5D;CACP8D,kBAAqBxB,OAAmCyB,SAAkB;EAExE,OAAQpE,KAAamE,kBACnBnC,yBAAyBW,KAAK,GAC9ByB,OACF;CACF;AACF,CAAC"}

package/dist/components/GlobalStyles.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | Cube Dev Team */
 import { mergeStyleLayers } from "../utils/styles.js";
 import { usePaletteValue } from "../tokens/palette-config.js";
 import { getTokens } from "../tokens/all-tokens.js";

package/dist/components/GlobalStyles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GlobalStyles.js","names":["useGlobalStyles","useRawCSS","getTokens","usePaletteValue","mergeStyleLayers","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","_c"],"sources":["../../src/components/GlobalStyles.tsx"],"sourcesContent":["import { useGlobalStyles, useRawCSS } from '@tenphi/tasty';\n\nimport { getTokens } from '../tokens';\nimport { usePaletteValue } from '../tokens/palette-config';\nimport { mergeStyleLayers } from '../utils/styles';\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: '$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: color-mix(in oklab, var(--primary-color) 20%, transparent);\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: color-mix(in oklab, var(--primary-color) 20%, transparent);\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 = mergeStyleLayers(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":";;;;;;;;;;;;;;AA0BA,MAAMe,cAAsB;CAC1BC,qBAAqB;CACrBC,MAAM;CACNC,YAAY;CACZ,0BAA0B;CAC1B,2BAA2B;CAC3BC,QAAQ;CACRC,SAAS;CACTC,OAAO;CACPC,QAAQ;CACRC,eAAe;AACjB;AAGA,MAAMC,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgPnB,SAAOC,aAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CACL,MAAA,EAAArB,YAAAK,MAAAC,kBAA4Ca;CAQ5C,MAAAG,SAAe1B,gBAAgBD,SAAS;CAAE,IAAA4B;CAAA,IAAAH,EAAA,OAAApB,cAAAoB,EAAA,OAAAE,QAAA;EAIlBC,KAAA1B,iBAAiByB,QAAQd,aAAaR,UAAU;EAACoB,EAAA,KAAApB;EAAAoB,EAAA,KAAAE;EAAAF,EAAA,KAAAG;CAAA,OAAAA,KAAAH,EAAA;CAAzE,MAAAI,kBAAwBD;CAAkD,IAAAE;CAAA,IAAAL,EAAA,OAAAM,OAAAC,IAAA,2BAAA,GAAA;EAajCF,KAAA,EAAAG,IAAM,qBAAqB;EAACR,EAAA,KAAAK;CAAA,OAAAA,KAAAL,EAAA;CAArE3B,gBAAgB,QAAQ+B,iBAAiBC,EAA4B;CAAC,IAAAI;CAAA,IAAAC;CAAA,IAAAV,EAAA,OAAAf,QAAAe,EAAA,OAAAd,eAAA;EAG5DuB,WAAA;GAE6D,OAE9D;;;mBAHWxB,OAAA,GAAUA,KAAI,MAAd,GAMM;mBALGC,gBAAA,GAAmBA,cAAa,MAAhC,GAMM;;EAEnCW;EAAY;EACTa,KAAA,CAACzB,MAAMC,aAAa;EAACc,EAAA,KAAAf;EAAAe,EAAA,KAAAd;EAAAc,EAAA,KAAAS;EAAAT,EAAA,KAAAU;CAAA,OAAA;EAAAD,KAAAT,EAAA;EAAAU,KAAAV,EAAA;CAAA;CAXxB1B,UAAUmC,IAWPC,EAAqB;CAAC,OAElB;AAAI"}
1	+ {"version":3,"file":"GlobalStyles.js","names":["useGlobalStyles","useRawCSS","getTokens","usePaletteValue","mergeStyleLayers","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","_c"],"sources":["../../src/components/GlobalStyles.tsx"],"sourcesContent":["import { useGlobalStyles, useRawCSS } from '@tenphi/tasty';\n\nimport { getTokens } from '../tokens/all-tokens';\nimport { usePaletteValue } from '../tokens/palette-config';\nimport { mergeStyleLayers } from '../utils/styles';\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: '$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: color-mix(in oklab, var(--primary-color) 20%, transparent);\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: color-mix(in oklab, var(--primary-color) 20%, transparent);\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 = mergeStyleLayers(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":";;;;;;;;;;;;;;AA0BA,MAAMe,cAAsB;CAC1BC,qBAAqB;CACrBC,MAAM;CACNC,YAAY;CACZ,0BAA0B;CAC1B,2BAA2B;CAC3BC,QAAQ;CACRC,SAAS;CACTC,OAAO;CACPC,QAAQ;CACRC,eAAe;AACjB;AAGA,MAAMC,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgPnB,SAAOC,aAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CACL,MAAA,EAAArB,YAAAK,MAAAC,kBAA4Ca;CAQ5C,MAAAG,SAAe1B,gBAAgBD,SAAS;CAAE,IAAA4B;CAAA,IAAAH,EAAA,OAAApB,cAAAoB,EAAA,OAAAE,QAAA;EAIlBC,KAAA1B,iBAAiByB,QAAQd,aAAaR,UAAU;EAACoB,EAAA,KAAApB;EAAAoB,EAAA,KAAAE;EAAAF,EAAA,KAAAG;CAAA,OAAAA,KAAAH,EAAA;CAAzE,MAAAI,kBAAwBD;CAAkD,IAAAE;CAAA,IAAAL,EAAA,OAAAM,OAAAC,IAAA,2BAAA,GAAA;EAajCF,KAAA,EAAAG,IAAM,qBAAqB;EAACR,EAAA,KAAAK;CAAA,OAAAA,KAAAL,EAAA;CAArE3B,gBAAgB,QAAQ+B,iBAAiBC,EAA4B;CAAC,IAAAI;CAAA,IAAAC;CAAA,IAAAV,EAAA,OAAAf,QAAAe,EAAA,OAAAd,eAAA;EAG5DuB,WAAA;GAE6D,OAE9D;;;mBAHWxB,OAAA,GAAUA,KAAI,MAAd,GAMM;mBALGC,gBAAA,GAAmBA,cAAa,MAAhC,GAMM;;EAEnCW;EAAY;EACTa,KAAA,CAACzB,MAAMC,aAAa;EAACc,EAAA,KAAAf;EAAAe,EAAA,KAAAd;EAAAc,EAAA,KAAAS;EAAAT,EAAA,KAAAU;CAAA,OAAA;EAAAD,KAAAT,EAAA;EAAAU,KAAAV,EAAA;CAAA;CAXxB1B,UAAUmC,IAWPC,EAAqB;CAAC,OAElB;AAAI"}

package/dist/components/GridProvider.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | 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/GridProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GridProvider.js","names":["filterBaseProps","tasty","forwardRef","ReactNode","useCallback","useEffect","useState","useCombinedRefs","GridElement","styles","display","toLength","value","CubeGridProviderProps","children","columns","gap","width","initialWidth","GridProvider","HTMLDivElement","props","outerRef","ref","forcedWidth","setWidth","resizeCallback","el","current","parentElement","computedStyle","getComputedStyle","containerWidth","clientWidth","parseFloat","paddingLeft","paddingRight","parentNode","sensor","then","module","ResizeSensor","detach","eventProps"],"sources":["../../src/components/GridProvider.tsx"],"sourcesContent":["import { filterBaseProps, tasty } from '@tenphi/tasty';\nimport { forwardRef, ReactNode, useCallback, useEffect, useState } from 'react';\n\nimport { useCombinedRefs } from '../utils/react';\n\nconst GridElement = tasty({\n styles: {\n display: 'contents',\n '$column-width':\n '(($grid-width - ($column-gap * ($columns-amount - 1))) / $columns-amount)',\n },\n});\n\n/** Numbers are pixels: a custom property gets no default unit. /\nfunction toLength(value: string \| number) {\n return typeof value === 'number' ? `${value}px` : value;\n}\n\nexport interface CubeGridProviderProps {\n children: ReactNode;\n columns?: number;\n /* Gap between columns, as a single Tasty value such as `'1x'`, or a number of pixels. /\n gap?: string \| number;\n /* Forced container width, as a single Tasty value, or a number of pixels. /\n width?: string \| number;\n /* Width before the resize observer measures the container, as a single Tasty value, or a number of pixels. */\n initialWidth?: string \| number;\n}\n\nexport const GridProvider = forwardRef<HTMLDivElement, CubeGridProviderProps>(\n function GridProvider(props, outerRef) {\n let ref = useCombinedRefs(outerRef);\n\n let {\n children,\n columns = 2,\n gap = 0,\n width: forcedWidth,\n initialWidth,\n } = props;\n\n let [width, setWidth] = useState<string \| number>(\n forcedWidth \|\| initialWidth \|\| '100vw',\n );\n\n const resizeCallback = useCallback(() => {\n const el = ref?.current?.parentElement;\n\n if (!el) return;\n\n const computedStyle = getComputedStyle(el);\n const containerWidth =\n el.clientWidth -\n parseFloat(computedStyle.paddingLeft) -\n parseFloat(computedStyle.paddingRight);\n\n setWidth(`${containerWidth}px`);\n }, [ref, columns, gap]);\n\n useEffect(() => {\n if (forcedWidth) return;\n\n const el = ref && ref.current && ref.current.parentNode;\n\n if (!el) return;\n\n let sensor;\n\n import('../utils/ResizeSensor')\n .then((module) => module.ResizeSensor)\n .then((ResizeSensor) => {\n sensor = new ResizeSensor(el, resizeCallback);\n });\n\n return () => {\n if (sensor) {\n sensor.detach();\n }\n };\n }, [resizeCallback]);\n\n useEffect(() => {\n if (forcedWidth) return;\n\n resizeCallback();\n }, [resizeCallback]);\n\n return (\n <GridElement\n {...filterBaseProps(props, { eventProps: true })}\n ref={ref}\n tokens={{\n '$grid-width': toLength(width),\n '$columns-amount': columns,\n '$column-gap': toLength(gap),\n }}\n >\n {children}\n </GridElement>\n );\n },\n);\n"],"mappings":";;;;;;AAKA,MAAMQ,cAAcP,MAAM,EACxBQ,QAAQ;CACNC,SAAS;CACT,iBACE;AACJ,EACF,CAAC;;AAGD,SAASC,SAASC,OAAwB;CACxC,OAAO,OAAOA,UAAU,WAAW,GAAGA,MAAK,MAAOA;AACpD;AAaA,MAAaO,eAAejB,WAC1B,SAASiB,aAAaE,OAAOC,UAAU;CACrC,IAAIC,MAAMhB,gBAAgBe,QAAQ;CAElC,IAAI,EACFR,UACAC,UAAU,GACVC,MAAM,GACNC,OAAOO,aACPN,iBACEG;CAEJ,IAAI,CAACJ,OAAOQ,YAAYnB,SACtBkB,eAAeN,gBAAgB,OACjC;CAEA,MAAMQ,iBAAiBtB,kBAAkB;EACvC,MAAMuB,KAAKJ,KAAKK,SAASC;EAEzB,IAAI,CAACF,IAAI;EAET,MAAMG,gBAAgBC,iBAAiBJ,EAAE;EACzC,MAAMK,iBACJL,GAAGM,cACHC,WAAWJ,cAAcK,WAAW,IACpCD,WAAWJ,cAAcM,YAAY;EAEvCX,SAAS,GAAGO,eAAc,GAAI;CAChC,GAAG;EAACT;EAAKR;EAASC;CAAG,CAAC;CAEtBX,gBAAgB;EACd,IAAImB,aAAa;EAEjB,MAAMG,OAAKJ,OAAOA,IAAIK,WAAWL,IAAIK,QAAQS;EAE7C,IAAI,CAACV,MAAI;EAET,IAAIW;EAEJ,OAAO,2BAAwB,CAC5BC,MAAMC,WAAWA,OAAOC,YAAY,CAAC,CACrCF,MAAME,iBAAiB;GACtBH,SAAS,IAAIG,aAAad,MAAID,cAAc;EAC9C,CAAC;EAEH,aAAa;GACX,IAAIY,QACFA,OAAOI,OAAO;EAElB;CACF,GAAG,CAAChB,cAAc,CAAC;CAEnBrB,gBAAgB;EACd,IAAImB,aAAa;EAEjBE,eAAe;CACjB,GAAG,CAACA,cAAc,CAAC;CAEnB,OACE,oBAAC,aAAD;EACE,GAAI1B,gBAAgBqB,OAAO,EAAEsB,YAAY,KAAK,CAAC;EAC1CpB;EACL,QAAQ;GACN,eAAeZ,SAASM,KAAK;GAC7B,mBAAmBF;GACnB,eAAeJ,SAASK,GAAG;EAC7B;EAECF;CACU,CAAA;AAEjB,CACF"}
1	+ {"version":3,"file":"GridProvider.js","names":["filterBaseProps","tasty","forwardRef","ReactNode","useCallback","useEffect","useState","useCombinedRefs","GridElement","styles","display","toLength","value","CubeGridProviderProps","children","columns","gap","width","initialWidth","GridProvider","HTMLDivElement","props","outerRef","ref","forcedWidth","setWidth","resizeCallback","el","current","parentElement","computedStyle","getComputedStyle","containerWidth","clientWidth","parseFloat","paddingLeft","paddingRight","parentNode","sensor","then","module","ResizeSensor","detach","eventProps"],"sources":["../../src/components/GridProvider.tsx"],"sourcesContent":["import { filterBaseProps, tasty } from '@tenphi/tasty';\nimport { forwardRef, ReactNode, useCallback, useEffect, useState } from 'react';\n\nimport { useCombinedRefs } from '../utils/react/useCombinedRefs';\n\nconst GridElement = tasty({\n styles: {\n display: 'contents',\n '$column-width':\n '(($grid-width - ($column-gap * ($columns-amount - 1))) / $columns-amount)',\n },\n});\n\n/** Numbers are pixels: a custom property gets no default unit. /\nfunction toLength(value: string \| number) {\n return typeof value === 'number' ? `${value}px` : value;\n}\n\nexport interface CubeGridProviderProps {\n children: ReactNode;\n columns?: number;\n /* Gap between columns, as a single Tasty value such as `'1x'`, or a number of pixels. /\n gap?: string \| number;\n /* Forced container width, as a single Tasty value, or a number of pixels. /\n width?: string \| number;\n /* Width before the resize observer measures the container, as a single Tasty value, or a number of pixels. */\n initialWidth?: string \| number;\n}\n\nexport const GridProvider = forwardRef<HTMLDivElement, CubeGridProviderProps>(\n function GridProvider(props, outerRef) {\n let ref = useCombinedRefs(outerRef);\n\n let {\n children,\n columns = 2,\n gap = 0,\n width: forcedWidth,\n initialWidth,\n } = props;\n\n let [width, setWidth] = useState<string \| number>(\n forcedWidth \|\| initialWidth \|\| '100vw',\n );\n\n const resizeCallback = useCallback(() => {\n const el = ref?.current?.parentElement;\n\n if (!el) return;\n\n const computedStyle = getComputedStyle(el);\n const containerWidth =\n el.clientWidth -\n parseFloat(computedStyle.paddingLeft) -\n parseFloat(computedStyle.paddingRight);\n\n setWidth(`${containerWidth}px`);\n }, [ref, columns, gap]);\n\n useEffect(() => {\n if (forcedWidth) return;\n\n const el = ref && ref.current && ref.current.parentNode;\n\n if (!el) return;\n\n let sensor;\n\n import('../utils/ResizeSensor')\n .then((module) => module.ResizeSensor)\n .then((ResizeSensor) => {\n sensor = new ResizeSensor(el, resizeCallback);\n });\n\n return () => {\n if (sensor) {\n sensor.detach();\n }\n };\n }, [resizeCallback]);\n\n useEffect(() => {\n if (forcedWidth) return;\n\n resizeCallback();\n }, [resizeCallback]);\n\n return (\n <GridElement\n {...filterBaseProps(props, { eventProps: true })}\n ref={ref}\n tokens={{\n '$grid-width': toLength(width),\n '$columns-amount': columns,\n '$column-gap': toLength(gap),\n }}\n >\n {children}\n </GridElement>\n );\n },\n);\n"],"mappings":";;;;;;AAKA,MAAMQ,cAAcP,MAAM,EACxBQ,QAAQ;CACNC,SAAS;CACT,iBACE;AACJ,EACF,CAAC;;AAGD,SAASC,SAASC,OAAwB;CACxC,OAAO,OAAOA,UAAU,WAAW,GAAGA,MAAK,MAAOA;AACpD;AAaA,MAAaO,eAAejB,WAC1B,SAASiB,aAAaE,OAAOC,UAAU;CACrC,IAAIC,MAAMhB,gBAAgBe,QAAQ;CAElC,IAAI,EACFR,UACAC,UAAU,GACVC,MAAM,GACNC,OAAOO,aACPN,iBACEG;CAEJ,IAAI,CAACJ,OAAOQ,YAAYnB,SACtBkB,eAAeN,gBAAgB,OACjC;CAEA,MAAMQ,iBAAiBtB,kBAAkB;EACvC,MAAMuB,KAAKJ,KAAKK,SAASC;EAEzB,IAAI,CAACF,IAAI;EAET,MAAMG,gBAAgBC,iBAAiBJ,EAAE;EACzC,MAAMK,iBACJL,GAAGM,cACHC,WAAWJ,cAAcK,WAAW,IACpCD,WAAWJ,cAAcM,YAAY;EAEvCX,SAAS,GAAGO,eAAc,GAAI;CAChC,GAAG;EAACT;EAAKR;EAASC;CAAG,CAAC;CAEtBX,gBAAgB;EACd,IAAImB,aAAa;EAEjB,MAAMG,OAAKJ,OAAOA,IAAIK,WAAWL,IAAIK,QAAQS;EAE7C,IAAI,CAACV,MAAI;EAET,IAAIW;EAEJ,OAAO,2BAAwB,CAC5BC,MAAMC,WAAWA,OAAOC,YAAY,CAAC,CACrCF,MAAME,iBAAiB;GACtBH,SAAS,IAAIG,aAAad,MAAID,cAAc;EAC9C,CAAC;EAEH,aAAa;GACX,IAAIY,QACFA,OAAOI,OAAO;EAElB;CACF,GAAG,CAAChB,cAAc,CAAC;CAEnBrB,gBAAgB;EACd,IAAImB,aAAa;EAEjBE,eAAe;CACjB,GAAG,CAACA,cAAc,CAAC;CAEnB,OACE,oBAAC,aAAD;EACE,GAAI1B,gBAAgBqB,OAAO,EAAEsB,YAAY,KAAK,CAAC;EAC1CpB;EACL,QAAQ;GACN,eAAeZ,SAASM,KAAK;GAC7B,mBAAmBF;GACnB,eAAeJ,SAASK,GAAG;EAC7B;EAECF;CACU,CAAA;AAEjB,CACF"}

package/dist/components/HiddenInput.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 //#region src/components/HiddenInput.tsx
 const HiddenInput = tasty({

package/dist/components/Root.js CHANGED Viewed

@@ -1,13 +1,13 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | 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";
 import { PortalProvider } from "./portal/PortalProvider.js";
 import { TASTY_VERSION, VERSION } from "../version.js";
 import { TrackingProvider } from "../providers/TrackingProvider.js";
+import { EventBusProvider } from "../utils/react/useEventBus.js";
 import { Provider } from "../provider.js";
 import { I18nProvider as I18nProvider$1 } from "../i18n/I18nProvider.js";
 import { setPaletteConfig } from "../tokens/palette-config.js";
+import { AMBIENT_PREDEFINED_STATES } from "../utils/react/useScheme.js";
 import { GlobalStyles } from "./GlobalStyles.js";
 import { AlertDialogApiProvider } from "./overlays/AlertDialog/AlertDialogApiProvider.js";
 import { OverlayProvider } from "./overlays/Notifications/OverlayProvider.js";

package/dist/components/Root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Root.js","names":["BASE_STYLES","BaseProps","BLOCK_STYLES","configure","filterBaseProps","setGlobalPredefinedStates","tasty","TastyBatchProvider","useEffect","useLayoutEffect","useRef","useState","ModalProvider","I18nProvider","Provider","NavigationAdapter","TrackingProps","TrackingProvider","PaletteConfig","setPaletteConfig","EventBusProvider","AMBIENT_PREDEFINED_STATES","extractStyles","TASTY_VERSION","VERSION","GlobalStyles","AlertDialogApiProvider","OverlayProvider","PortalProvider","i18n","I18nInstance","batchInjection","units","x","r","cr","bw","ow","recipes","reset","margin","padding","border","outline","boxSizing","button","appearance","touchAction","textDecoration","fill","color","cursor","disabled","input","wordSpacing","caretColor","shadow","preset","hide","RootElement","id","styles","display","STYLES","CubeRootProps","tokens","key","palette","bodyStyles","fontDisplay","fonts","publicUrl","navigation","font","monospaceFont","applyLegacyTokens","tracking","cursorStrategy","locale","Root","allProps","$","_c","children","t0","_applyLegacyTokens","t1","style","props","undefined","t2","t3","t4","ref","rootRef","setRootRef","t5","current","t6","Symbol","for","T0","T1","T2","T3","t7","event","T4","t10","eventProps","t11","t12","$pointer","t13","t14","t15","t8","t9","t16","t17","t18","t19","_c","I18nProvider"],"sources":["../../src/components/Root.tsx"],"sourcesContent":["import {\n BASE_STYLES,\n BaseProps,\n BLOCK_STYLES,\n configure,\n filterBaseProps,\n setGlobalPredefinedStates,\n tasty,\n TastyBatchProvider,\n} from '@tenphi/tasty';\nimport { useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport { ModalProvider } from 'react-aria';\n\nimport { I18nProvider } from '../i18n';\nimport { Provider } from '../provider';\nimport { NavigationAdapter } from '../providers/navigation.types';\nimport { TrackingProps, TrackingProvider } from '../providers/TrackingProvider';\nimport { PaletteConfig, setPaletteConfig } from '../tokens/palette-config';\nimport { EventBusProvider } from '../utils/react/useEventBus';\nimport { AMBIENT_PREDEFINED_STATES } from '../utils/react/useScheme';\nimport { extractStyles } from '../utils/styles';\nimport { TASTY_VERSION, VERSION } from '../version';\n\nimport { GlobalStyles } from './GlobalStyles';\nimport { AlertDialogApiProvider } from './overlays/AlertDialog/AlertDialogApiProvider';\nimport { OverlayProvider } from './overlays/Notifications/OverlayProvider';\nimport { PortalProvider } from './portal';\n\nimport type { i18n as I18nInstance } from 'i18next';\n\n// Color-scheme aliases for the Glaze-generated palette (see `src/tokens/palette.ts`).\n// Attribute opt-in wins over system preference:\n// <html data-scheme=\"dark\"> → forces the dark scheme\n// <html data-contrast=\"high\"> → forces the high-contrast scheme\n// Otherwise falls back to the user's `prefers-color-scheme` / `prefers-contrast`.\n// `@reduced-motion`, registered beside them, follows `prefers-reduced-motion:\n// reduce` alone.\n//\n// The strings live in `useScheme.ts`, which also reads the same two conditions\n// from JS (`useScheme()` / `useHighContrast()`) — one definition, so the CSS and\n// the JS answers cannot drift apart.\nsetGlobalPredefinedStates(AMBIENT_PREDEFINED_STATES);\n\nconfigure({\n // Collapse the kit's stylesheet writes into one style invalidation per commit\n // instead of one per component. Only takes effect inside a\n // `<TastyBatchProvider>` window, and windows have to be opened per portal\n // boundary because a commit that mounts a portal does not re-render `<Root>`.\n // The kit opens three: here, in `<Portal>` (tooltips, Select and\n // ListBoxPopover lists, notifications, AlertDialogZone) and in `<Overlay>`\n // (popovers, modals, trays — i.e. Dialog and Menu). Writes in any commit\n // without a window go straight through exactly as before, so a\n // `useLayoutEffect` can never measure an element whose rules have not landed.\n batchInjection: true,\n units: {\n x: 'var(--gap)',\n r: 'var(--radius)',\n cr: 'var(--card-radius)',\n bw: 'var(--border-width)',\n ow: 'var(--outline-width)',\n },\n recipes: {\n reset: {\n margin: 0,\n padding: 0,\n border: 0,\n outline: 0,\n boxSizing: 'border-box',\n },\n button: {\n appearance: 'none',\n touchAction: 'manipulation',\n textDecoration: 'none',\n '-webkit-tap-highlight-color': 'transparent',\n fill: '#clear',\n color: 'inherit',\n cursor: {\n '': 'default',\n ':is(a)': 'pointer',\n ':is(button)': '$pointer',\n disabled: 'not-allowed',\n },\n },\n input: {\n appearance: 'none',\n wordSpacing: 'initial',\n color: 'inherit',\n fill: '#clear',\n },\n 'input-autofill': {\n '@autofill': ':-webkit-autofill \| :autofill',\n appearance: {\n '@autofill': 'none',\n },\n '-webkit-text-fill-color': {\n '': 'currentColor',\n '@autofill': '#primary-text',\n },\n caretColor: {\n '@autofill': '#primary-text',\n },\n shadow: {\n '@autofill': '0 0 0 9999rem #surface inset',\n },\n preset: {\n '@autofill': 'inherit',\n },\n '-webkit-opacity': {\n '': false,\n '[disabled]': '1',\n },\n },\n 'input-placeholder': {\n '-webkit-text-fill-color': '#placeholder',\n color: '#placeholder',\n },\n 'input-search-cancel-button': {\n hide: true,\n appearance: 'none',\n },\n },\n});\n\nconst RootElement = tasty({\n id: 'cube-ui-kit-root',\n styles: {\n display: 'contents',\n color: '#dark-02',\n preset: 't3',\n },\n});\n\nconst STYLES = [...BASE_STYLES, ...BLOCK_STYLES];\n\nexport interface CubeRootProps extends BaseProps {\n tokens?: { [key: string]: string };\n /*\n Tune the generated color palette. Every zone — `accent`, `base` and each status\n * theme — takes the same seed: a color, or `{ hue, saturation }`. Plus the global\n * `surfaceMode`, `pastel` and `contrastLevel`. Omitted fields take their default, so\n * this prop describes the whole palette and dropping a field from it drops the\n * customization.\n \n Removing the prop entirely is the one thing that does not reset the\n * palette, so `<Root>` with no `palette` cannot clobber a host's imperative\n * `setPaletteConfig()` call. Pass `{}` to ask for the default.\n \n The first mount applies it during render, so the first paint is already\n * tuned; a later change applies in a layout effect, before paint.\n \n The palette is global process state, so this is a declarative wrapper over\n * `setPaletteConfig()`; both drive the same store, and the last write wins.\n * Root's layout effect runs after its descendants' in the same commit, so a\n * descendant's `setPaletteConfig()` from a layout effect in that commit loses\n * to the prop; write from a passive effect or an event handler instead.\n * See `Getting Started/Theming` in Storybook.\n /\n palette?: PaletteConfig;\n bodyStyles?: { [key: string]: string };\n fontDisplay?: 'auto' \| 'block' \| 'swap' \| 'fallback' \| 'optional';\n fonts?: boolean;\n publicUrl?: string;\n navigation?: NavigationAdapter;\n font?: string;\n monospaceFont?: string;\n /* @deprecated Tokens are now always applied via GlobalStyles /\n applyLegacyTokens?: boolean;\n tracking?: TrackingProps;\n cursorStrategy?: 'web' \| 'native';\n /\n i18next instance for this tree. During SSR, pass a request-local instance\n * created with `createUIKitI18n(locale)`.\n /\n i18n?: I18nInstance;\n /* Override the React Aria formatting locale. /\n locale?: string;\n}\n\nexport function Root(allProps: CubeRootProps) {\n let {\n children,\n /* Raw css styles for body element */\n bodyStyles,\n fontDisplay = 'swap',\n fonts,\n publicUrl,\n navigation,\n font,\n monospaceFont,\n applyLegacyTokens: _applyLegacyTokens, // deprecated, ignored\n tracking,\n cursorStrategy = 'web',\n style,\n tokens,\n palette,\n i18n,\n locale,\n ...props\n } = allProps;\n\n // The first mount applies the palette during render, so the first paint and\n // SSR output already use it and `GlobalStyles` below reads it directly. A lazy\n // initializer runs once per mount, which React Compiler preserves; a `useMemo`\n // compiles to a call on every render. A later change waits for the layout\n // effect: a write notifies every palette subscriber, and React rejects\n // updating another component while this one renders. Updates from a layout\n // effect still land before paint. `setPaletteConfig` is a no-op when the\n // resolved config is unchanged, so the effect's mount pass, an inline object\n // literal and StrictMode's double calls cost nothing.\n //\n // A `<Root>` that mounts while another tree already subscribes, with a\n // different palette, still notifies that tree during its first render.\n useState(() => {\n if (palette) setPaletteConfig(palette);\n });\n\n useLayoutEffect(() => {\n if (palette) setPaletteConfig(palette);\n }, [palette]);\n\n const ref = useRef(null);\n\n const [rootRef, setRootRef] = useState();\n\n useEffect(() => {\n if (!rootRef) {\n // @ts-ignore\n setRootRef(ref?.current);\n }\n }, []);\n\n const styles = extractStyles(props, STYLES);\n\n return (\n <TastyBatchProvider>\n <I18nProvider i18n={i18n} locale={locale}>\n <Provider navigation={navigation} root={rootRef}>\n <TrackingProvider event={tracking?.event}>\n <RootElement\n ref={ref}\n data-uikit={VERSION}\n data-tasty={TASTY_VERSION}\n data-font-display={fontDisplay}\n {...filterBaseProps(props, { eventProps: true })}\n styles={styles}\n tokens={{\n $pointer: cursorStrategy === 'web' ? 'pointer' : 'default',\n ...tokens,\n }}\n // oxlint-disable-next-line tasty/no-style-prop -- forwards the consumer's public `style` prop\n style={style}\n >\n <GlobalStyles\n bodyStyles={bodyStyles}\n publicUrl={publicUrl}\n fonts={fonts}\n font={font}\n monospaceFont={monospaceFont}\n fontDisplay={fontDisplay}\n />\n <ModalProvider>\n <PortalProvider value={ref}>\n <EventBusProvider>\n <OverlayProvider>\n <AlertDialogApiProvider>\n {children}\n </AlertDialogApiProvider>\n </OverlayProvider>\n </EventBusProvider>\n </PortalProvider>\n </ModalProvider>\n </RootElement>\n </TrackingProvider>\n </Provider>\n </I18nProvider>\n </TastyBatchProvider>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAyCAK,0BAA0BgB,yBAAyB;AAEnDlB,UAAU;CAUR4B,gBAAgB;CAChBC,OAAO;EACLC,GAAG;EACHC,GAAG;EACHC,IAAI;EACJC,IAAI;EACJC,IAAI;CACN;CACAC,SAAS;EACPC,OAAO;GACLC,QAAQ;GACRC,SAAS;GACTC,QAAQ;GACRC,SAAS;GACTC,WAAW;EACb;EACAC,QAAQ;GACNC,YAAY;GACZC,aAAa;GACbC,gBAAgB;GAChB,+BAA+B;GAC/BC,MAAM;GACNC,OAAO;GACPC,QAAQ;IACN,IAAI;IACJ,UAAU;IACV,eAAe;IACfC,UAAU;GACZ;EACF;EACAC,OAAO;GACLP,YAAY;GACZQ,aAAa;GACbJ,OAAO;GACPD,MAAM;EACR;EACA,kBAAkB;GAChB,aAAa;GACbH,YAAY,EACV,aAAa,OACf;GACA,2BAA2B;IACzB,IAAI;IACJ,aAAa;GACf;GACAS,YAAY,EACV,aAAa,gBACf;GACAC,QAAQ,EACN,aAAa,+BACf;GACAC,QAAQ,EACN,aAAa,UACf;GACA,mBAAmB;IACjB,IAAI;IACJ,cAAc;GAChB;EACF;EACA,qBAAqB;GACnB,2BAA2B;GAC3BP,OAAO;EACT;EACA,8BAA8B;GAC5BQ,MAAM;GACNZ,YAAY;EACd;CACF;AACF,CAAC;AAED,MAAMa,cAAcrD,MAAM;CACxBsD,IAAI;CACJC,QAAQ;EACNC,SAAS;EACTZ,OAAO;EACPO,QAAQ;CACV;AACF,CAAC;AAED,MAAMM,SAAS,CAAC,GAAG/D,aAAa,GAAGE,YAAY;AA8C/C,SAAO6E,KAAAC,UAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACL,MAAA,EAAAC,UAAAf,YAAAC,aAAAe,IAAAd,OAAAC,WAAAC,YAAAC,MAAAC,eAAAC,mBAAAU,oBAAAT,UAAAC,gBAAAS,IAAAC,OAAAtB,QAAAE,SAAAtC,MAAAiD,QAAA,GAAAU,UAmBIR;CAfF,MAAAX,cAAAe,OAAAK,KAAAA,IAAA,SAAAL;CAQA,MAAAP,iBAAAS,OAAAG,KAAAA,IAAA,QAAAH;CAAsB,IAAAI;CAAA,IAAAT,EAAA,OAAAd,SAAA;EAqBfuB,WAAA;GACP,IAAIvB,SAAShD,iBAAiBgD,OAAO;EAAE;EACxCc,EAAA,KAAAd;EAAAc,EAAA,KAAAS;CAAA,OAAAA,KAAAT,EAAA;CAFDtE,SAAS+E,EAER;CAAC,IAAAC;CAAA,IAAAC;CAAA,IAAAX,EAAA,OAAAd,SAAA;EAEcwB,WAAA;GACd,IAAIxB,SAAShD,iBAAiBgD,OAAO;EAAE;EACtCyB,KAAA,CAACzB,OAAO;EAACc,EAAA,KAAAd;EAAAc,EAAA,KAAAU;EAAAV,EAAA,KAAAW;CAAA,OAAA;EAAAD,KAAAV,EAAA;EAAAW,KAAAX,EAAA;CAAA;CAFZxE,gBAAgBkF,IAEbC,EAAS;CAEZ,MAAAC,MAAYnF,OAAO,IAAI;CAEvB,MAAA,CAAAoF,SAAAC,cAA8BpF,SAAS;CAAE,IAAAqF;CAAA,IAAAf,EAAA,OAAAa,SAAA;EAE/BE,WAAA;GACR,IAAI,CAACF,SAEHC,WAAWF,KAAGI,OAAS;EACxB;EACFhB,EAAA,KAAAa;EAAAb,EAAA,KAAAe;CAAA,OAAAA,KAAAf,EAAA;CAAA,IAAAiB;CAAA,IAAAjB,EAAA,OAAAkB,OAAAC,IAAA,2BAAA,GAAA;EAAEF,KAAA,CAAA;EAAEjB,EAAA,KAAAiB;CAAA,OAAAA,KAAAjB,EAAA;CALLzE,UAAUwF,IAKPE,EAAE;CAEL,MAAArC,SAAevC,cAAckE,OAAOzB,MAAM;CAGvC,MAAAsC,KAAA9F;CACE,MAAA+F,KAAAzF;CACE,MAAA0F,KAAAzF;CACE,MAAA0F,KAAAvF;CAAwB,MAAAwF,KAAA7B,UAAQ8B;CAC9B,MAAAC,KAAAhD;CAEanC,MAAAA,KAAAA;CACAD,MAAAA,KAAAA;CAER,MAAAqF,MAAAxG,gBAAgBoF,OAAO,EAAAqB,YAAc,KAAK,CAAC;CAGnC,MAAAC,MAAAjC,mBAAmB,QAAnB,YAAA;CAAgD,IAAAkC;CAAA,IAAA9B,EAAA,OAAA6B,OAAA7B,EAAA,OAAAhB,QAAA;EADpD8C,MAAA;GAAAC,UACIF;GAAgD,GACvD7C;EACL;EAACgB,EAAA,KAAA6B;EAAA7B,EAAA,KAAAhB;EAAAgB,EAAA,MAAA8B;CAAA,OAAAA,MAAA9B,EAAA;CAAA,IAAAgC;CAAA,IAAAhC,EAAA,QAAAb,cAAAa,EAAA,QAAAR,QAAAQ,EAAA,QAAAZ,eAAAY,EAAA,QAAAX,SAAAW,EAAA,QAAAP,iBAAAO,EAAA,QAAAV,WAAA;EAID0C,MAAA,oBAAC,cAAD;GACc7C;GACDG;GACJD;GACDG;GACSC;GACFL;EAAW,CAAA;EACxBY,EAAA,MAAAb;EAAAa,EAAA,MAAAR;EAAAQ,EAAA,MAAAZ;EAAAY,EAAA,MAAAX;EAAAW,EAAA,MAAAP;EAAAO,EAAA,MAAAV;EAAAU,EAAA,MAAAgC;CAAA,OAAAA,MAAAhC,EAAA;CAAA,IAAAiC;CAAA,IAAAjC,EAAA,QAAAE,UAAA;EACF+B,MAAA,oBAAC,eAAD,EAAA,UACE,oBAAC,gBAAD;GAAuBrB,OAAAA;GACrB,UAAA,oBAAC,kBAAD,EAAA,UACE,oBAAC,iBAAD,EAAA,UACE,oBAAC,wBAAD,EACGV,SADoB,CAAA,EADT,CAAA,EADD,CAAA;EADJ,CAAA,EADH,CAAA;EAUEF,EAAA,MAAAE;EAAAF,EAAA,MAAAiC;CAAA,OAAAA,MAAAjC,EAAA;CAAA,IAAAkC;CAAA,IAAAlC,EAAA,QAAA0B,MAAA1B,EAAA,QAAAZ,eAAAY,EAAA,QAAAM,SAAAN,EAAA,QAAApB,UAAAoB,EAAA,QAAA2B,OAAA3B,EAAA,QAAA8B,OAAA9B,EAAA,QAAAgC,OAAAhC,EAAA,QAAAiC,OAAAjC,EAAA,QAAAmC,MAAAnC,EAAA,QAAAoC,IAAA;EAhClBF,MAAA,qBAAC,IAAD;GACOtB;GACOrE,cAAAA;GACAD,cAAAA;GACO8C,qBAAAA;GAAW,GAC1BuC;GACI/C;GACA,QAAAkD;GAKDxB;GAZT,UAAA,CAcE0B,KAQAC,GAtBU;;EAiCEjC,EAAA,MAAA0B;EAAA1B,EAAA,MAAAZ;EAAAY,EAAA,MAAAM;EAAAN,EAAA,MAAApB;EAAAoB,EAAA,MAAA2B;EAAA3B,EAAA,MAAA8B;EAAA9B,EAAA,MAAAgC;EAAAhC,EAAA,MAAAiC;EAAAjC,EAAA,MAAAmC;EAAAnC,EAAA,MAAAoC;EAAApC,EAAA,MAAAkC;CAAA,OAAAA,MAAAlC,EAAA;CAAA,IAAAqC;CAAA,IAAArC,EAAA,QAAAuB,MAAAvB,EAAA,QAAAkC,OAAAlC,EAAA,QAAAwB,IAAA;EAlChBa,MAAA,oBAAC,IAAD;GAAyB,OAAAb;GACvBU,UAAAA;EADe,CAAA;EAmCElC,EAAA,MAAAuB;EAAAvB,EAAA,MAAAkC;EAAAlC,EAAA,MAAAwB;EAAAxB,EAAA,MAAAqC;CAAA,OAAAA,MAAArC,EAAA;CAAA,IAAAsC;CAAA,IAAAtC,EAAA,QAAAsB,MAAAtB,EAAA,QAAAT,cAAAS,EAAA,QAAAa,WAAAb,EAAA,QAAAqC,KAAA;EApCrBC,MAAA,oBAAC,IAAD;GAAsB/C;GAAkBsB,MAAAA;GACtCwB,UAAAA;EADO,CAAA;EAqCErC,EAAA,MAAAsB;EAAAtB,EAAA,MAAAT;EAAAS,EAAA,MAAAa;EAAAb,EAAA,MAAAqC;EAAArC,EAAA,MAAAsC;CAAA,OAAAA,MAAAtC,EAAA;CAAA,IAAAuC;CAAA,IAAAvC,EAAA,QAAAqB,MAAArB,EAAA,QAAApD,QAAAoD,EAAA,QAAAH,UAAAG,EAAA,QAAAsC,KAAA;EAtCbC,MAAA,oBAAC,IAAD;GAAoB3F;GAAciD;GAChCyC,UAAAA;EADW,CAAA;EAuCEtC,EAAA,MAAAqB;EAAArB,EAAA,MAAApD;EAAAoD,EAAA,MAAAH;EAAAG,EAAA,MAAAsC;EAAAtC,EAAA,MAAAuC;CAAA,OAAAA,MAAAvC,EAAA;CAAA,IAAAwC;CAAA,IAAAxC,EAAA,QAAAoB,MAAApB,EAAA,QAAAuC,KAAA;EAxCjBC,MAAA,oBAAC,IAAD,EAAA,UACED,IADiB,CAAA;EAyCEvC,EAAA,MAAAoB;EAAApB,EAAA,MAAAuC;EAAAvC,EAAA,MAAAwC;CAAA,OAAAA,MAAAxC,EAAA;CAAA,OAzCrBwC;AAyCqB"}
1	+ {"version":3,"file":"Root.js","names":["BASE_STYLES","BaseProps","BLOCK_STYLES","configure","filterBaseProps","setGlobalPredefinedStates","tasty","TastyBatchProvider","useEffect","useLayoutEffect","useRef","useState","ModalProvider","I18nProvider","Provider","NavigationAdapter","TrackingProps","TrackingProvider","PaletteConfig","setPaletteConfig","EventBusProvider","AMBIENT_PREDEFINED_STATES","extractStyles","TASTY_VERSION","VERSION","GlobalStyles","AlertDialogApiProvider","OverlayProvider","PortalProvider","i18n","I18nInstance","batchInjection","units","x","r","cr","bw","ow","recipes","reset","margin","padding","border","outline","boxSizing","button","appearance","touchAction","textDecoration","fill","color","cursor","disabled","input","wordSpacing","caretColor","shadow","preset","hide","RootElement","id","styles","display","STYLES","CubeRootProps","tokens","key","palette","bodyStyles","fontDisplay","fonts","publicUrl","navigation","font","monospaceFont","applyLegacyTokens","tracking","cursorStrategy","locale","Root","allProps","$","_c","children","t0","_applyLegacyTokens","t1","style","props","undefined","t2","t3","t4","ref","rootRef","setRootRef","t5","current","t6","Symbol","for","T0","T1","T2","T3","t7","event","T4","t10","eventProps","t11","t12","$pointer","t13","t14","t15","t8","t9","t16","t17","t18","t19","_c","I18nProvider"],"sources":["../../src/components/Root.tsx"],"sourcesContent":["import {\n BASE_STYLES,\n BaseProps,\n BLOCK_STYLES,\n configure,\n filterBaseProps,\n setGlobalPredefinedStates,\n tasty,\n TastyBatchProvider,\n} from '@tenphi/tasty';\nimport { useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport { ModalProvider } from 'react-aria';\n\nimport { I18nProvider } from '../i18n/I18nProvider';\nimport { Provider } from '../provider';\nimport { NavigationAdapter } from '../providers/navigation.types';\nimport { TrackingProps, TrackingProvider } from '../providers/TrackingProvider';\nimport { PaletteConfig, setPaletteConfig } from '../tokens/palette-config';\nimport { EventBusProvider } from '../utils/react/useEventBus';\nimport { AMBIENT_PREDEFINED_STATES } from '../utils/react/useScheme';\nimport { extractStyles } from '../utils/styles';\nimport { TASTY_VERSION, VERSION } from '../version';\n\nimport { GlobalStyles } from './GlobalStyles';\nimport { AlertDialogApiProvider } from './overlays/AlertDialog/AlertDialogApiProvider';\nimport { OverlayProvider } from './overlays/Notifications/OverlayProvider';\nimport { PortalProvider } from './portal/PortalProvider';\n\nimport type { i18n as I18nInstance } from 'i18next';\n\n// Color-scheme aliases for the Glaze-generated palette (see `src/tokens/palette.ts`).\n// Attribute opt-in wins over system preference:\n// <html data-scheme=\"dark\"> → forces the dark scheme\n// <html data-contrast=\"high\"> → forces the high-contrast scheme\n// Otherwise falls back to the user's `prefers-color-scheme` / `prefers-contrast`.\n// `@reduced-motion`, registered beside them, follows `prefers-reduced-motion:\n// reduce` alone.\n//\n// The strings live in `useScheme.ts`, which also reads the same two conditions\n// from JS (`useScheme()` / `useHighContrast()`) — one definition, so the CSS and\n// the JS answers cannot drift apart.\nsetGlobalPredefinedStates(AMBIENT_PREDEFINED_STATES);\n\nconfigure({\n // Collapse the kit's stylesheet writes into one style invalidation per commit\n // instead of one per component. Only takes effect inside a\n // `<TastyBatchProvider>` window, and windows have to be opened per portal\n // boundary because a commit that mounts a portal does not re-render `<Root>`.\n // The kit opens three: here, in `<Portal>` (tooltips, Select and\n // ListBoxPopover lists, notifications, AlertDialogZone) and in `<Overlay>`\n // (popovers, modals, trays — i.e. Dialog and Menu). Writes in any commit\n // without a window go straight through exactly as before, so a\n // `useLayoutEffect` can never measure an element whose rules have not landed.\n batchInjection: true,\n units: {\n x: 'var(--gap)',\n r: 'var(--radius)',\n cr: 'var(--card-radius)',\n bw: 'var(--border-width)',\n ow: 'var(--outline-width)',\n },\n recipes: {\n reset: {\n margin: 0,\n padding: 0,\n border: 0,\n outline: 0,\n boxSizing: 'border-box',\n },\n button: {\n appearance: 'none',\n touchAction: 'manipulation',\n textDecoration: 'none',\n '-webkit-tap-highlight-color': 'transparent',\n fill: '#clear',\n color: 'inherit',\n cursor: {\n '': 'default',\n ':is(a)': 'pointer',\n ':is(button)': '$pointer',\n disabled: 'not-allowed',\n },\n },\n input: {\n appearance: 'none',\n wordSpacing: 'initial',\n color: 'inherit',\n fill: '#clear',\n },\n 'input-autofill': {\n '@autofill': ':-webkit-autofill \| :autofill',\n appearance: {\n '@autofill': 'none',\n },\n '-webkit-text-fill-color': {\n '': 'currentColor',\n '@autofill': '#primary-text',\n },\n caretColor: {\n '@autofill': '#primary-text',\n },\n shadow: {\n '@autofill': '0 0 0 9999rem #surface inset',\n },\n preset: {\n '@autofill': 'inherit',\n },\n '-webkit-opacity': {\n '': false,\n '[disabled]': '1',\n },\n },\n 'input-placeholder': {\n '-webkit-text-fill-color': '#placeholder',\n color: '#placeholder',\n },\n 'input-search-cancel-button': {\n hide: true,\n appearance: 'none',\n },\n },\n});\n\nconst RootElement = tasty({\n id: 'cube-ui-kit-root',\n styles: {\n display: 'contents',\n color: '#dark-02',\n preset: 't3',\n },\n});\n\nconst STYLES = [...BASE_STYLES, ...BLOCK_STYLES];\n\nexport interface CubeRootProps extends BaseProps {\n tokens?: { [key: string]: string };\n /*\n Tune the generated color palette. Every zone — `accent`, `base` and each status\n * theme — takes the same seed: a color, or `{ hue, saturation }`. Plus the global\n * `surfaceMode`, `pastel` and `contrastLevel`. Omitted fields take their default, so\n * this prop describes the whole palette and dropping a field from it drops the\n * customization.\n \n Removing the prop entirely is the one thing that does not reset the\n * palette, so `<Root>` with no `palette` cannot clobber a host's imperative\n * `setPaletteConfig()` call. Pass `{}` to ask for the default.\n \n The first mount applies it during render, so the first paint is already\n * tuned; a later change applies in a layout effect, before paint.\n \n The palette is global process state, so this is a declarative wrapper over\n * `setPaletteConfig()`; both drive the same store, and the last write wins.\n * Root's layout effect runs after its descendants' in the same commit, so a\n * descendant's `setPaletteConfig()` from a layout effect in that commit loses\n * to the prop; write from a passive effect or an event handler instead.\n * See `Getting Started/Theming` in Storybook.\n /\n palette?: PaletteConfig;\n bodyStyles?: { [key: string]: string };\n fontDisplay?: 'auto' \| 'block' \| 'swap' \| 'fallback' \| 'optional';\n fonts?: boolean;\n publicUrl?: string;\n navigation?: NavigationAdapter;\n font?: string;\n monospaceFont?: string;\n /* @deprecated Tokens are now always applied via GlobalStyles /\n applyLegacyTokens?: boolean;\n tracking?: TrackingProps;\n cursorStrategy?: 'web' \| 'native';\n /\n i18next instance for this tree. During SSR, pass a request-local instance\n * created with `createUIKitI18n(locale)`.\n /\n i18n?: I18nInstance;\n /* Override the React Aria formatting locale. /\n locale?: string;\n}\n\nexport function Root(allProps: CubeRootProps) {\n let {\n children,\n /* Raw css styles for body element */\n bodyStyles,\n fontDisplay = 'swap',\n fonts,\n publicUrl,\n navigation,\n font,\n monospaceFont,\n applyLegacyTokens: _applyLegacyTokens, // deprecated, ignored\n tracking,\n cursorStrategy = 'web',\n style,\n tokens,\n palette,\n i18n,\n locale,\n ...props\n } = allProps;\n\n // The first mount applies the palette during render, so the first paint and\n // SSR output already use it and `GlobalStyles` below reads it directly. A lazy\n // initializer runs once per mount, which React Compiler preserves; a `useMemo`\n // compiles to a call on every render. A later change waits for the layout\n // effect: a write notifies every palette subscriber, and React rejects\n // updating another component while this one renders. Updates from a layout\n // effect still land before paint. `setPaletteConfig` is a no-op when the\n // resolved config is unchanged, so the effect's mount pass, an inline object\n // literal and StrictMode's double calls cost nothing.\n //\n // A `<Root>` that mounts while another tree already subscribes, with a\n // different palette, still notifies that tree during its first render.\n useState(() => {\n if (palette) setPaletteConfig(palette);\n });\n\n useLayoutEffect(() => {\n if (palette) setPaletteConfig(palette);\n }, [palette]);\n\n const ref = useRef(null);\n\n const [rootRef, setRootRef] = useState();\n\n useEffect(() => {\n if (!rootRef) {\n // @ts-ignore\n setRootRef(ref?.current);\n }\n }, []);\n\n const styles = extractStyles(props, STYLES);\n\n return (\n <TastyBatchProvider>\n <I18nProvider i18n={i18n} locale={locale}>\n <Provider navigation={navigation} root={rootRef}>\n <TrackingProvider event={tracking?.event}>\n <RootElement\n ref={ref}\n data-uikit={VERSION}\n data-tasty={TASTY_VERSION}\n data-font-display={fontDisplay}\n {...filterBaseProps(props, { eventProps: true })}\n styles={styles}\n tokens={{\n $pointer: cursorStrategy === 'web' ? 'pointer' : 'default',\n ...tokens,\n }}\n // oxlint-disable-next-line tasty/no-style-prop -- forwards the consumer's public `style` prop\n style={style}\n >\n <GlobalStyles\n bodyStyles={bodyStyles}\n publicUrl={publicUrl}\n fonts={fonts}\n font={font}\n monospaceFont={monospaceFont}\n fontDisplay={fontDisplay}\n />\n <ModalProvider>\n <PortalProvider value={ref}>\n <EventBusProvider>\n <OverlayProvider>\n <AlertDialogApiProvider>\n {children}\n </AlertDialogApiProvider>\n </OverlayProvider>\n </EventBusProvider>\n </PortalProvider>\n </ModalProvider>\n </RootElement>\n </TrackingProvider>\n </Provider>\n </I18nProvider>\n </TastyBatchProvider>\n );\n}\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | 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 CHANGED Viewed

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

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

	@@ -1 +1 @@
1	- {"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","Item","_c"],"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 // Decorative: the banner's text carries the message.\n danger: <IconExclamationCircle aria-hidden=\"true\" />,\n warning: <IconAlertTriangle aria-hidden=\"true\" />,\n note: <IconInfoCircle aria-hidden=\"true\" />,\n success: <IconCircleCheck aria-hidden=\"true\" />,\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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"}
1	+ {"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","Item","_c"],"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/useI18n';\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 // Decorative: the banner's text carries the message.\n danger: <IconExclamationCircle aria-hidden=\"true\" />,\n warning: <IconAlertTriangle aria-hidden=\"true\" />,\n note: <IconInfoCircle aria-hidden=\"true\" />,\n success: <IconCircleCheck aria-hidden=\"true\" />,\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.d.ts CHANGED Viewed

@@ -1,7 +1,6 @@
 import { CubeTooltipProviderProps } from "../../overlays/Tooltip/TooltipProvider.js";
 import { DynamicIcon } from "../../../utils/react/resolveIcon.js";
-import "../../../utils/react/index.js";
 import { CubeActionProps } from "../Action/Action.js";
 import { Mods, Styles } from "@tenphi/tasty";
 import { Placement } from "react-aria";
@@ -26,6 +25,16 @@ export interface CubeButtonProps extends CubeActionProps {
   type?: 'primary' | 'danger' | 'link' | 'clear' | 'outline' | 'outline-2' | (string & {});
   theme?: 'default' | 'danger' | 'success' | 'warning' | 'note' | 'special' | 'current' | (string & {});
   size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'inline' | number | (string & {});
+  /**
+   * Corner shape, named as on `Item`:
+   * - `button` - The button radius (`1r`, default)
+   * - `card` - The card radius (`1cr`), for a button laid out as a card
+   * - `sharp` - Square corners, for a button that fills a row or cell edge to edge
+   * - `pill` - Fully rounded ends (`round`); a single-icon button becomes a circle
+   *
+   * A `link` button and the joined edges inside a `Button.Split` keep their own radius.
+   */
+  shape?: 'button' | 'card' | 'sharp' | 'pill';
   /**
    * Tooltip content and configuration:
    * - string: simple tooltip text

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

@@ -1,19 +1,19 @@
-/** @license MIT | @cube-dev/ui-kit v0.206.3 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.208.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
-import { getDisabledElementProps, omitActivationEventProps } from "../../../utils/react/disabledProps.js";
-import { useDismissParentPopover } from "../../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
-import { resolveIcon } from "../../../utils/react/resolveIcon.js";
-import { useWarn } from "../../../_internal/hooks/use-warn.js";
-import { useIsFirstRender } from "../../../_internal/hooks/use-is-first-render.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
 import { useAutoTooltip } from "../../content/use-auto-tooltip.js";
 import { CURRENT_CLEAR_STYLES, CURRENT_LINK_STYLES, CURRENT_OUTLINE_2_STYLES, CURRENT_OUTLINE_STYLES, CURRENT_PRIMARY_STYLES, DANGER_CLEAR_STYLES, DANGER_LINK_STYLES, DANGER_OUTLINE_2_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_LINK_STYLES, DEFAULT_OUTLINE_2_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, NOTE_CLEAR_STYLES, NOTE_LINK_STYLES, NOTE_OUTLINE_2_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_LINK_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_LINK_STYLES, SUCCESS_OUTLINE_2_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, WARNING_CLEAR_STYLES, WARNING_LINK_STYLES, WARNING_OUTLINE_2_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES } from "../../../data/item-themes.js";
 import { LoadingIcon } from "../../../icons/LoadingIcon.js";
+import { getDisabledElementProps, omitActivationEventProps } from "../../../utils/react/disabledProps.js";
 import { mergeTooltipFocusProps } from "../../overlays/Tooltip/split-trigger-props.js";
+import { useWarn } from "../../../_internal/hooks/use-warn.js";
 import { useAction } from "../use-action.js";
+import { resolveIcon } from "../../../utils/react/resolveIcon.js";
 import { IconSwitch } from "../../helpers/IconSwitch/IconSwitch.js";
+import { useIsFirstRender } from "../../../_internal/hooks/use-is-first-render.js";
+import { useDismissParentPopover } from "../../../utils/react/usePopoverSync.js";
 import { useButtonSplitContext } from "../ButtonSplit/context.js";
 import { CONTAINER_STYLES, TEXT_STYLES, mergeStyles, tasty } from "@tenphi/tasty";
 import { Children, forwardRef, isValidElement, useMemo, useRef, useState } from "react";
@@ -76,6 +76,9 @@ const DEFAULT_BUTTON_STYLES = {
 	whiteSpace: "nowrap",
 	radius: {
 		"": true,
+		"shape=card": "1cr",
+		"shape=sharp": 0,
+		"shape=pill": "round",
 		"type=link & !focused": 0,
 		"@parent(button-split, >) & !:last-child": "1r left",
 		"@parent(button-split, >) & !:first-child": "1r right",
@@ -83,7 +86,8 @@ const DEFAULT_BUTTON_STYLES = {
 	},
 	margin: {
 		"": 0,
-		"@parent(button-split, >) & !:first-child & (type=outline | type=outline-2 | type=primary)": "-1bw left"
+		"@parent(button-split, >) & !:first-child & (type=outline | type=outline-2)": "-1bw left",
+		"@parent(button-split, >) & !:first-child & type=primary": "1bw left"
 	},
 	zIndex: {
 		"@parent(button-split, >) & :hover": 1,
@@ -202,7 +206,7 @@ const ButtonElement = tasty({
 });
 const Button = forwardRef(function Button(allProps, ref) {
 	const splitContext = useButtonSplitContext();
-	let { type, size: sizeProp, label, children, theme = splitContext?.theme ?? "default", icon: iconProp, rightIcon: rightIconProp, mods, download, tooltip = true, defaultTooltipPlacement = "top", onPress: userOnPress, tokens, ...props } = allProps;
+	let { type, size: sizeProp, shape, label, children, theme = splitContext?.theme ?? "default", icon: iconProp, rightIcon: rightIconProp, mods, download, tooltip = true, defaultTooltipPlacement = "top", onPress: userOnPress, tokens, ...props } = allProps;
 	type = type ?? splitContext?.type;
 	const size = sizeProp ?? splitContext?.size ?? (type === "link" ? "inline" : "medium");
 	const isExplicitlyDisabled = splitContext?.isDisabled || props.isDisabled;
@@ -331,6 +335,7 @@ const Button = forwardRef(function Button(allProps, ref) {
 			"data-theme": theme,
 			"data-type": effectiveType ?? "outline",
 			"data-size": size,
+			"data-shape": shape === "button" ? void 0 : shape,
 			"data-popover-dismiss": "",
 			styles,
 			tokens: {