npm - @cube-dev/ui-kit - Versions diffs - 0.168.0 → 0.169.0 - Mend

@cube-dev/ui-kit 0.168.0 → 0.169.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 (680) hide show

package/dist/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,41 @@
 # @cube-dev/ui-kit
+## 0.169.0
+### Minor Changes
+- [#1357](https://github.com/cube-js/cube-ui-kit/pull/1357) [`b9b4cf92`](https://github.com/cube-js/cube-ui-kit/commit/b9b4cf92411bce210ff3b4142e43bdee758a8abe) Thanks [@tenphi](https://github.com/tenphi)! - Add a proper `autoComplete` prop to the text-input family. `TextInput`, `TextArea`, `PasswordInput`, `SearchInput`, `NumberInput`, `CommandTextArea` and `TextInputMapper` (through `keyProps` / `valueProps`) now accept `autoComplete` in the standard React casing, and `InlineInput` gained the prop as well. The lowercase `autocomplete` prop still works as a deprecated alias; `autoComplete` wins when both are set.
+  Previously the camelCase prop — the one React Aria's own types advertise — was silently dropped, and the attribute was written unconditionally after `inputProps` was merged, so it also overwrote an `autoComplete` coming from `inputProps` or from a React Aria hook with `undefined`. As a result `NumberInput` now renders the `autocomplete="off"` that `useNumberField` asks for.
+### Patch Changes
+- [#1354](https://github.com/cube-js/cube-ui-kit/pull/1354) [`b6d51af1`](https://github.com/cube-js/cube-ui-kit/commit/b6d51af1cb8fa806eaeb17d4012ca068c34823f4) Thanks [@tenphi](https://github.com/tenphi)! - Import defining files directly instead of through barrels along the `Root` → `AlertDialog` → `Dialog` chain, and replace every `from '…/icons'` barrel import inside the library with a direct icon import. Nothing about the public API changes — the barrels still re-export everything — but the module graph gets narrower: pulling in `Root` no longer transitively drags in `Menu`, `CommandMenu`, `Form` and all 133 icon components, which is both better for a consumer's tree-shaking and what lets Chromatic's TurboSnap scope a build to the stories a change actually affects.
+- [#1354](https://github.com/cube-js/cube-ui-kit/pull/1354) [`b6d51af1`](https://github.com/cube-js/cube-ui-kit/commit/b6d51af1cb8fa806eaeb17d4012ca068c34823f4) Thanks [@tenphi](https://github.com/tenphi)! - Field labels show their necessity indicator again, and a required `ComboBox` says so to assistive technology. `Label` only appended the `*` / `(required)` / `(optional)` marker when its child was plain text, and `FieldWrapper` — which every labelled input goes through — always hands it an element tree, so `isRequired` and `necessityIndicator` reached the label and rendered nothing. The marker now comes from a shared `NecessityIndicatorMark`, which `FieldWrapper` places against the label text rather than after the full-width row. Separately, `ComboBox` builds its own trigger instead of going through a react-aria field hook and never forwarded `isRequired` to it, so a required combobox rendered markup byte-identical to an optional one — no `aria-required`, nothing for a screen reader to announce. Ten other components still have that second gap (`Select`, `Picker`, `FilterPicker`, `ListBox`, `FilterListBox`, `Switch`, `Slider`, `ColorInput`, `SearchComboBox`, `FileInput`); they are unchanged here.
+- [#1359](https://github.com/cube-js/cube-ui-kit/pull/1359) [`1cf5c9f6`](https://github.com/cube-js/cube-ui-kit/commit/1cf5c9f6e66a06818e1fb3af723bfa9553b1d18d) Thanks [@tenphi](https://github.com/tenphi)! - `DialogTrigger`: make `shouldCloseOnInteractOutside` actually reach the popover.
+  The prop was inert for a popover type Dialog. `PopoverTrigger` wraps the caller's predicate in its own resolver, and that resolver consulted the predicate last — after the automatic behaviours. Every `Button` and `ItemButton` carries `data-popover-dismiss`, so the auto-dismiss branch matched first, scheduled the close and returned, and the predicate was never called. A caller could not keep a popover open for a chosen element: it closed on every outside interaction regardless of what the predicate would have said.
+  The predicate is now asked first, so an explicit "keep me open for this element" wins over the automatic dismiss. Returning `false` still lets the click through to the control that was pressed (the resolver only reports "close" when the popover really should close, which is what stops React Aria from swallowing the click), so a guarded button both keeps the popover open and runs its own `onPress`.
+  One thing to know when writing the predicate: React Aria passes the element the pointer landed on, which for a `Button` is the label inside it rather than the `<button>` itself. Guard with `contains()`, not an identity check — `(el) => !myRef.current?.UNSAFE_getDOMNode()?.contains(el)`.
+  Nothing changes for callers that never passed the prop: without a predicate the resolver behaves exactly as before.
+## 0.168.1
+### Patch Changes
+- [#1355](https://github.com/cube-js/cube-ui-kit/pull/1355) [`207828aa`](https://github.com/cube-js/cube-ui-kit/commit/207828aa0cb4b5dd3c9d33f4ccf6a76027f12ed3) Thanks [@tenphi](https://github.com/tenphi)! - `Board`: document that it measures itself, and pin the no-paint-before-measurement guarantee with a test.
+  Two behaviours were already true and nowhere written down, which is enough to make a consumer rebuild both: a board observes its own container and derives the column width from it, and it renders **no widgets at all** until it has a width. The second is what makes the first look unreliable — at width 0 a column works out negative, so a board that painted then would flash every widget at a nonsense size, and a consumer who saw that would reasonably conclude the board cannot size itself.
+  The result is a recognisable workaround: measure the box yourself, feed it back in as `width`, and gate your own render on `measured > 0` — a `ResizeObserver` and an extra DOM node reimplementing what the board already does, plus a guaranteed empty first frame from the redundant gate.
+  No behaviour change. A new **Sizing** section says what `width` is actually for (SSR, tests, forced-size exports — not everyday use), and a browser test now fails if the gate is removed. It has to be a browser test: jsdom reports every box as 0, so the situation under test cannot arise there.
 ## 0.168.0
 ### Minor Changes

package/dist/_internal/hooks/use-chained-callback.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { useEvent } from "./use-event.js";
 //#region src/_internal/hooks/use-chained-callback.ts

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 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.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { deprecationWarning } from "../../utils/warnings.js";
 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.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { useSyncRef } from "./use-sync-ref.js";
 import { useCallback } from "react";

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../utils/react/useLayoutEffect.js";
 import { useRef } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.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.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { useEvent } from "../use-event.js";
 import { Timer } from "./timer.js";
 import { useEffect, useState } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.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.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../utils/styles.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/CollectionItem.js CHANGED Viewed

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { usePaletteVersion } from "../tokens/palette-config.js";
 import { getTokens } from "../tokens/all-tokens.js";
 import { useGlobalStyles, useRawCSS } from "@tenphi/tasty";

package/dist/components/GridProvider.js CHANGED Viewed

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

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

package/dist/components/Root.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../utils/styles.js";
 import { EventBusProvider } from "../utils/react/useEventBus.js";
 import { PortalProvider } from "./portal/PortalProvider.js";

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Root.js","names":["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, useMemo, 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 { extractStyles } from '../utils/styles';\nimport { TASTY_VERSION, VERSION } from '../version';\n\nimport { GlobalStyles } from './GlobalStyles';\nimport { AlertDialogApiProvider } from './overlays/AlertDialog';\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-schema=\"dark\"> → forces dark scheme\n// <html data-contrast=\"high\"> → forces high-contrast scheme\n// Otherwise falls back to the user's `prefers-color-scheme` / `prefers-contrast`.\nsetGlobalPredefinedStates({\n '@dark':\n '@root(schema=dark) \| (!@root(schema) & @media(prefers-color-scheme: dark))',\n '@hc':\n '@root(contrast=high) \| (!@root(contrast) & @media(prefers-contrast: more))',\n});\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) 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 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 * 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 // Applied during render, not in an effect, so the first paint already uses the\n // tuned palette instead of flashing the default. `setPaletteConfig` is a no-op\n // when the resolved config is unchanged, so an inline object literal and\n // StrictMode's double render both cost nothing. `GlobalStyles` is rendered\n // below in the same pass and reads the new version directly.\n useMemo(() => {\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 style={{\n '--pointer': cursorStrategy === 'web' ? 'pointer' : 'default',\n ...style,\n }}\n tokens={tokens}\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":";;;;;;;;;;;;;;;;;;AAkCA,0BAA0B;CACxB,SACE;CACF,OACE;CACH,CAAC;AAEF,UAAU;CASR,gBAAgB;CAChB,OAAO;EACL,GAAG;EACH,GAAG;EACH,IAAI;EACJ,IAAI;EACJ,IAAI;EACL;CACD,SAAS;EACP,OAAO;GACL,QAAQ;GACR,SAAS;GACT,QAAQ;GACR,SAAS;GACT,WAAW;GACZ;EACD,QAAQ;GACN,YAAY;GACZ,aAAa;GACb,gBAAgB;GAChB,+BAA+B;GAC/B,MAAM;GACN,OAAO;GACP,QAAQ;IACN,IAAI;IACJ,UAAU;IACV,eAAe;IACf,UAAU;IACX;GACF;EACD,OAAO;GACL,YAAY;GACZ,aAAa;GACb,OAAO;GACP,MAAM;GACP;EACD,kBAAkB;GAChB,aAAa;GACb,YAAY,EACV,aAAa,QACd;GACD,2BAA2B;IACzB,IAAI;IACJ,aAAa;IACd;GACD,YAAY,EACV,aAAa,iBACd;GACD,QAAQ,EACN,aAAa,gCACd;GACD,QAAQ,EACN,aAAa,WACd;GACD,mBAAmB;IACjB,IAAI;IACJ,cAAc;IACf;GACF;EACD,qBAAqB;GACnB,2BAA2B;GAC3B,OAAO;GACR;EACD,8BAA8B;GAC5B,MAAM;GACN,YAAY;GACb;EACF;CACF,CAAC;AAEF,MAAM,cAAc,MAAM;CACxB,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,OAAO;EACP,QAAQ;EACT;CACF,CAAC;AAEF,MAAM,SAAS,CAAC,GAAG,aAAa,GAAG,aAAa;AAwChD,SAAgB,KAAK,UAAyB;CAC5C,IAAI,EACF,UAEA,YACA,cAAc,QACd,OACA,WACA,YACA,MACA,eACA,mBAAmB,oBACnB,UACA,iBAAiB,OACjB,OACA,QACA,SACA,MACA,QACA,GAAG,UACD;AAOJ,eAAc;AACZ,MAAI,QAAS,kBAAiB,QAAQ;IACrC,CAAC,QAAQ,CAAC;CAEb,MAAM,MAAM,OAAO,KAAK;CAExB,MAAM,CAAC,SAAS,cAAc,UAAU;AAExC,iBAAgB;AACd,MAAI,CAAC,QAEH,YAAW,KAAK,QAAQ;IAEzB,EAAE,CAAC;CAEN,MAAM,SAAS,cAAc,OAAO,OAAO;AAE3C,QACE,oBAAC,gCACC,oBAACA;EAAmB;EAAc;YAChC,oBAAC;GAAqB;GAAY,MAAM;aACtC,oBAAC;IAAiB,OAAO,UAAU;cACjC,qBAAC;KACM;KACL,cAAY;KACZ,cAAY;KACZ,qBAAmB;KACnB,GAAI,gBAAgB,OAAO,EAAE,YAAY,MAAM,CAAC;KACxC;KACR,OAAO;MACL,aAAa,mBAAmB,QAAQ,YAAY;MACpD,GAAG;MACJ;KACO;gBAER,oBAAC;MACa;MACD;MACJ;MACD;MACS;MACF;OACb,EACF,oBAAC,2BACC,oBAAC;MAAe,OAAO;gBACrB,oBAAC,8BACC,oBAAC,6BACC,oBAAC,0BACE,WACsB,GACT,GACD;OACJ,GACH;MACJ;KACG;IACV;GACE,GACI"}
1	+ {"version":3,"file":"Root.js","names":["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, useMemo, 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 { 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-schema=\"dark\"> → forces dark scheme\n// <html data-contrast=\"high\"> → forces high-contrast scheme\n// Otherwise falls back to the user's `prefers-color-scheme` / `prefers-contrast`.\nsetGlobalPredefinedStates({\n '@dark':\n '@root(schema=dark) \| (!@root(schema) & @media(prefers-color-scheme: dark))',\n '@hc':\n '@root(contrast=high) \| (!@root(contrast) & @media(prefers-contrast: more))',\n});\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) 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 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 * 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 // Applied during render, not in an effect, so the first paint already uses the\n // tuned palette instead of flashing the default. `setPaletteConfig` is a no-op\n // when the resolved config is unchanged, so an inline object literal and\n // StrictMode's double render both cost nothing. `GlobalStyles` is rendered\n // below in the same pass and reads the new version directly.\n useMemo(() => {\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 style={{\n '--pointer': cursorStrategy === 'web' ? 'pointer' : 'default',\n ...style,\n }}\n tokens={tokens}\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":";;;;;;;;;;;;;;;;;;AAkCA,0BAA0B;CACxB,SACE;CACF,OACE;CACH,CAAC;AAEF,UAAU;CASR,gBAAgB;CAChB,OAAO;EACL,GAAG;EACH,GAAG;EACH,IAAI;EACJ,IAAI;EACJ,IAAI;EACL;CACD,SAAS;EACP,OAAO;GACL,QAAQ;GACR,SAAS;GACT,QAAQ;GACR,SAAS;GACT,WAAW;GACZ;EACD,QAAQ;GACN,YAAY;GACZ,aAAa;GACb,gBAAgB;GAChB,+BAA+B;GAC/B,MAAM;GACN,OAAO;GACP,QAAQ;IACN,IAAI;IACJ,UAAU;IACV,eAAe;IACf,UAAU;IACX;GACF;EACD,OAAO;GACL,YAAY;GACZ,aAAa;GACb,OAAO;GACP,MAAM;GACP;EACD,kBAAkB;GAChB,aAAa;GACb,YAAY,EACV,aAAa,QACd;GACD,2BAA2B;IACzB,IAAI;IACJ,aAAa;IACd;GACD,YAAY,EACV,aAAa,iBACd;GACD,QAAQ,EACN,aAAa,gCACd;GACD,QAAQ,EACN,aAAa,WACd;GACD,mBAAmB;IACjB,IAAI;IACJ,cAAc;IACf;GACF;EACD,qBAAqB;GACnB,2BAA2B;GAC3B,OAAO;GACR;EACD,8BAA8B;GAC5B,MAAM;GACN,YAAY;GACb;EACF;CACF,CAAC;AAEF,MAAM,cAAc,MAAM;CACxB,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,OAAO;EACP,QAAQ;EACT;CACF,CAAC;AAEF,MAAM,SAAS,CAAC,GAAG,aAAa,GAAG,aAAa;AAwChD,SAAgB,KAAK,UAAyB;CAC5C,IAAI,EACF,UAEA,YACA,cAAc,QACd,OACA,WACA,YACA,MACA,eACA,mBAAmB,oBACnB,UACA,iBAAiB,OACjB,OACA,QACA,SACA,MACA,QACA,GAAG,UACD;AAOJ,eAAc;AACZ,MAAI,QAAS,kBAAiB,QAAQ;IACrC,CAAC,QAAQ,CAAC;CAEb,MAAM,MAAM,OAAO,KAAK;CAExB,MAAM,CAAC,SAAS,cAAc,UAAU;AAExC,iBAAgB;AACd,MAAI,CAAC,QAEH,YAAW,KAAK,QAAQ;IAEzB,EAAE,CAAC;CAEN,MAAM,SAAS,cAAc,OAAO,OAAO;AAE3C,QACE,oBAAC,gCACC,oBAACA;EAAmB;EAAc;YAChC,oBAAC;GAAqB;GAAY,MAAM;aACtC,oBAAC;IAAiB,OAAO,UAAU;cACjC,qBAAC;KACM;KACL,cAAY;KACZ,cAAY;KACZ,qBAAmB;KACnB,GAAI,gBAAgB,OAAO,EAAE,YAAY,MAAM,CAAC;KACxC;KACR,OAAO;MACL,aAAa,mBAAmB,QAAQ,YAAY;MACpD,GAAG;MACJ;KACO;gBAER,oBAAC;MACa;MACD;MACJ;MACD;MACS;MACF;OACb,EACF,oBAAC,2BACC,oBAAC;MAAe,OAAO;gBACrB,oBAAC,8BACC,oBAAC,6BACC,oBAAC,0BACE,WACsB,GACT,GACD;OACJ,GACH;MACJ;KACG;IACV;GACE,GACI"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useAction } from "../use-action.js";
 import { CONTAINER_STYLES, TEXT_STYLES, tasty } from "@tenphi/tasty";

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

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

package/dist/components/actions/Button/Button.d.ts CHANGED Viewed

@@ -4,6 +4,7 @@ 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 "react";
 import { OverlayProps } from "react-aria";
 //#region src/components/actions/Button/Button.d.ts

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","names":[],"sources":["../../../../src/components/actions/Button/Button.tsx"],"sourcesContent":["import { FocusableRef, PressEvent } from '@react-types/shared';\nimport {\n CONTAINER_STYLES,\n Mods,\n Styles,\n tasty,\n TEXT_STYLES,\n} from '@tenphi/tasty';\nimport {\n Children,\n forwardRef,\n HTMLAttributes,\n isValidElement,\n ReactNode,\n RefObject,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { OverlayProps } from 'react-aria';\n\nimport { useEvent } from '../../../_internal';\nimport { useIsFirstRender } from '../../../_internal/hooks/use-is-first-render';\nimport { useWarn } from '../../../_internal/hooks/use-warn';\nimport {\n CURRENT_CLEAR_STYLES,\n CURRENT_LINK_STYLES,\n CURRENT_OUTLINE_2_STYLES,\n CURRENT_OUTLINE_STYLES,\n CURRENT_PRIMARY_STYLES,\n DANGER_CLEAR_STYLES,\n DANGER_LINK_STYLES,\n DANGER_OUTLINE_2_STYLES,\n DANGER_OUTLINE_STYLES,\n DANGER_PRIMARY_STYLES,\n DEFAULT_CLEAR_STYLES,\n DEFAULT_LINK_STYLES,\n DEFAULT_OUTLINE_2_STYLES,\n DEFAULT_OUTLINE_STYLES,\n DEFAULT_PRIMARY_STYLES,\n NOTE_CLEAR_STYLES,\n NOTE_LINK_STYLES,\n NOTE_OUTLINE_2_STYLES,\n NOTE_OUTLINE_STYLES,\n NOTE_PRIMARY_STYLES,\n SPECIAL_CLEAR_STYLES,\n SPECIAL_LINK_STYLES,\n SPECIAL_OUTLINE_STYLES,\n SPECIAL_PRIMARY_STYLES,\n SUCCESS_CLEAR_STYLES,\n SUCCESS_LINK_STYLES,\n SUCCESS_OUTLINE_2_STYLES,\n SUCCESS_OUTLINE_STYLES,\n SUCCESS_PRIMARY_STYLES,\n WARNING_CLEAR_STYLES,\n WARNING_LINK_STYLES,\n WARNING_OUTLINE_2_STYLES,\n WARNING_OUTLINE_STYLES,\n WARNING_PRIMARY_STYLES,\n} from '../../../data/item-themes';\nimport { LoadingIcon } from '../../../icons';\nimport {\n DynamicIcon,\n getDisabledElementProps,\n mergeProps,\n resolveIcon,\n useDismissParentPopover,\n} from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useAutoTooltip } from '../../content/use-auto-tooltip';\nimport { DisplayTransition } from '../../helpers/DisplayTransition';\nimport { IconSwitch } from '../../helpers/IconSwitch/IconSwitch';\nimport { CubeTooltipProviderProps } from '../../overlays/Tooltip/TooltipProvider';\nimport { CubeActionProps } from '../Action/Action';\nimport { useButtonSplitContext } from '../ButtonSplit/context';\nimport { useAction } from '../use-action';\n\nconst BUTTON_SIZE_VALUES = [\n 'xsmall',\n 'small',\n 'medium',\n 'large',\n 'xlarge',\n 'inline',\n] as const;\n\n/** Known modifiers for Button component /\nexport type ButtonMods = Mods<{\n pressed?: boolean;\n loading?: boolean;\n selected?: boolean;\n 'has-icons'?: boolean;\n 'has-icon'?: boolean;\n 'has-right-icon'?: boolean;\n 'single-icon'?: boolean;\n 'text-only'?: boolean;\n 'raw-children'?: boolean;\n}>;\n\nexport interface CubeButtonProps extends CubeActionProps {\n icon?: DynamicIcon<ButtonMods>;\n rightIcon?: DynamicIcon<ButtonMods>;\n isLoading?: boolean;\n isSelected?: boolean;\n type?:\n \| 'primary'\n \| 'danger'\n \| 'link'\n \| 'clear'\n \| 'outline'\n \| 'outline-2'\n \| (string & {});\n theme?:\n \| 'default'\n \| 'danger'\n \| 'success'\n \| 'warning'\n \| 'note'\n \| 'special'\n \| 'current'\n \| (string & {});\n size?:\n \| 'xsmall'\n \| 'small'\n \| 'medium'\n \| 'large'\n \| 'xlarge'\n \| 'inline'\n \| number\n \| (string & {});\n /\n Tooltip content and configuration:\n * - string: simple tooltip text\n * - true: auto tooltip on overflow (shows children as tooltip when truncated)\n * - object: advanced configuration with optional auto property\n /\n tooltip?:\n \| string\n \| boolean\n \| (Omit<CubeTooltipProviderProps, 'children'> & { auto?: boolean });\n /\n @private\n * Default tooltip placement for the button.\n * @default \"top\"\n /\n defaultTooltipPlacement?: OverlayProps['placement'];\n}\n\nexport type ButtonVariant =\n // The `current` theme mixes every color from the inherited `currentcolor`\n // instead of a brand ramp — see the CURRENT THEME section of `item-themes`.\n \| 'current.primary'\n \| 'current.outline'\n \| 'current.outline-2'\n \| 'current.clear'\n \| 'current.link'\n \| 'default.primary'\n \| 'default.outline'\n \| 'default.outline-2'\n \| 'default.clear'\n \| 'default.link'\n \| 'danger.primary'\n \| 'danger.outline'\n \| 'danger.outline-2'\n \| 'danger.clear'\n \| 'danger.link'\n \| 'success.primary'\n \| 'success.outline'\n \| 'success.outline-2'\n \| 'success.clear'\n \| 'success.link'\n \| 'warning.primary'\n \| 'warning.outline'\n \| 'warning.outline-2'\n \| 'warning.clear'\n \| 'warning.link'\n \| 'note.primary'\n \| 'note.outline'\n \| 'note.outline-2'\n \| 'note.clear'\n \| 'note.link'\n \| 'special.primary'\n \| 'special.outline'\n \| 'special.clear'\n \| 'special.link';\n\nconst STYLE_PROPS = [...CONTAINER_STYLES, ...TEXT_STYLES];\n\nconst DEFAULT_ICON_STYLES: Styles = {\n $: '>',\n position: 'relative',\n display: 'grid',\n placeItems: 'center',\n placeContent: 'center',\n placeSelf: 'stretch',\n // overflow: 'hidden',\n width: 'fixed ($size - 2bw)',\n height: 'fixed ($size - 2bw)',\n pointerEvents: 'none',\n transition: 'theme, width, height, translate',\n};\n\nexport const DEFAULT_BUTTON_STYLES: Styles = {\n recipe: 'reset button',\n display: 'inline-grid',\n flow: 'column dense',\n gap: 0,\n placeItems: {\n '': 'stretch',\n 'raw-children': 'center stretch',\n },\n placeContent: 'center',\n position: 'relative',\n preset: {\n '': 't3m',\n 'size=xsmall': 't4',\n 'size=xlarge': 't2m',\n 'type=link': 'strong',\n },\n outlineOffset: 1,\n padding: {\n '': 0,\n 'raw-children & !has-icons':\n '$block-padding $inline-padding $block-padding $inline-padding',\n 'type=link': '0',\n },\n width: {\n '': 'min $size',\n 'has-icon & has-right-icon': 'min ($size 2 - 2bw)',\n 'single-icon': 'fixed $size',\n 'type=link': 'min 1ch',\n },\n height: {\n '': 'fixed $size',\n 'type=link': 'initial',\n },\n whiteSpace: 'nowrap',\n radius: {\n '': true,\n 'type=link & !focused': 0,\n '@parent(button-split, >) & !:last-child': '1r left',\n '@parent(button-split, >) & !:first-child': '1r right',\n '@parent(button-split, >) & !:first-child & !:last-child': 0,\n },\n margin: {\n '': 0,\n '@parent(button-split, >) & !:first-child & (type=outline \| type=outline-2 \| type=primary)':\n '-1bw left',\n },\n zIndex: {\n '@parent(button-split, >) & :hover': 1,\n '@parent(button-split, >) & :focus-visible': 2,\n },\n transition: 'theme, grid-template, padding',\n verticalAlign: 'bottom',\n\n $size: {\n '': '$size-md',\n 'size=xsmall': '$size-xs',\n 'size=small': '$size-sm',\n 'size=medium': '$size-md',\n 'size=large': '$size-lg',\n 'size=xlarge': '$size-xl',\n 'size=inline': '(1lh + 2bw)',\n },\n '$inline-padding': {\n '': 'max($min-inline-padding, (($size - 1lh - 2bw) / 2 + $inline-compensation))',\n },\n '$block-padding': {\n '': '.5x',\n 'size=xsmall \| size=small': '.25x',\n },\n '$inline-compensation': '.5x',\n '$min-inline-padding': '(1x - 1bw)',\n '$left-padding': {\n '': '$inline-padding',\n 'is-icon-shown': '0px',\n },\n '$right-padding': {\n '': '$inline-padding',\n 'is-right-icon-shown': '0px',\n },\n\n // Icon sub-element (recommended format)\n Icon: {\n ...DEFAULT_ICON_STYLES,\n width: {\n '': 'fixed 0px',\n 'is-icon-shown': 'fixed ($size - 2bw)',\n },\n opacity: {\n '': 0,\n 'is-icon-shown': 1,\n },\n translate: {\n '': '($size * 1 / 4) 0',\n 'is-icon-shown': '0 0',\n },\n },\n\n // RightIcon sub-element (recommended format)\n RightIcon: {\n ...DEFAULT_ICON_STYLES,\n width: {\n '': 'fixed 0px',\n 'is-right-icon-shown': 'fixed ($size - 2bw)',\n },\n opacity: {\n '': 0,\n 'is-right-icon-shown': 1,\n },\n translate: {\n '': '($size * -1 / 4) 0',\n 'is-right-icon-shown': '0 0',\n },\n },\n\n // Label sub-element (recommended format)\n Label: {\n $: '>',\n display: 'block',\n placeSelf: 'center stretch',\n boxSizing: 'border-box',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n width: '0 100%',\n textAlign: 'center',\n transition: 'theme, padding',\n padding: {\n '': '$block-padding $right-padding $block-padding $left-padding',\n 'type=link': '0',\n },\n },\n} as const;\n\nconst ButtonElement = tasty({\n qa: 'Button',\n styles: DEFAULT_BUTTON_STYLES,\n variants: {\n // Current theme — colors mixed from the inherited `currentcolor`\n 'current.primary': CURRENT_PRIMARY_STYLES,\n 'current.outline': CURRENT_OUTLINE_STYLES,\n 'current.outline-2': CURRENT_OUTLINE_2_STYLES,\n 'current.clear': CURRENT_CLEAR_STYLES,\n 'current.link': CURRENT_LINK_STYLES,\n\n // Default theme\n 'default.primary': DEFAULT_PRIMARY_STYLES,\n 'default.outline': DEFAULT_OUTLINE_STYLES,\n 'default.outline-2': DEFAULT_OUTLINE_2_STYLES,\n 'default.clear': DEFAULT_CLEAR_STYLES,\n 'default.link': DEFAULT_LINK_STYLES,\n\n // Danger theme\n 'danger.primary': DANGER_PRIMARY_STYLES,\n 'danger.outline': DANGER_OUTLINE_STYLES,\n 'danger.outline-2': DANGER_OUTLINE_2_STYLES,\n 'danger.clear': DANGER_CLEAR_STYLES,\n 'danger.link': DANGER_LINK_STYLES,\n\n // Success theme\n 'success.primary': SUCCESS_PRIMARY_STYLES,\n 'success.outline': SUCCESS_OUTLINE_STYLES,\n 'success.outline-2': SUCCESS_OUTLINE_2_STYLES,\n 'success.clear': SUCCESS_CLEAR_STYLES,\n 'success.link': SUCCESS_LINK_STYLES,\n\n // Warning theme\n 'warning.primary': WARNING_PRIMARY_STYLES,\n 'warning.outline': WARNING_OUTLINE_STYLES,\n 'warning.outline-2': WARNING_OUTLINE_2_STYLES,\n 'warning.clear': WARNING_CLEAR_STYLES,\n 'warning.link': WARNING_LINK_STYLES,\n\n // Note theme\n 'note.primary': NOTE_PRIMARY_STYLES,\n 'note.outline': NOTE_OUTLINE_STYLES,\n 'note.outline-2': NOTE_OUTLINE_2_STYLES,\n 'note.clear': NOTE_CLEAR_STYLES,\n 'note.link': NOTE_LINK_STYLES,\n\n // Special theme\n 'special.primary': SPECIAL_PRIMARY_STYLES,\n 'special.outline': SPECIAL_OUTLINE_STYLES,\n 'special.clear': SPECIAL_CLEAR_STYLES,\n 'special.link': SPECIAL_LINK_STYLES,\n },\n});\n\nexport const Button = forwardRef(function Button(\n allProps: CubeButtonProps,\n ref: FocusableRef<HTMLElement>,\n) {\n const splitContext = useButtonSplitContext();\n\n let {\n type,\n size: sizeProp,\n label,\n children,\n theme = splitContext?.theme ?? 'default',\n icon: iconProp,\n rightIcon: rightIconProp,\n mods,\n download,\n tooltip = true,\n defaultTooltipPlacement = 'top',\n onPress: userOnPress,\n tokens,\n ...props\n } = allProps;\n\n type = type ?? splitContext?.type;\n const size =\n sizeProp ?? splitContext?.size ?? (type === 'link' ? 'inline' : 'medium');\n\n const isDisabled =\n splitContext?.isDisabled \|\| props.isDisabled \|\| props.isLoading;\n const isLoading = props.isLoading;\n const isSelected = props.isSelected;\n\n // Default: pressing a Button inside an open popover closes that popover.\n // Opt-outs (handled inline below):\n // - `data-popover-trigger` (auto, applied by MenuTrigger/DialogTrigger\n // type='popover' so triggers don't dismiss the popover they live in)\n // - `data-popover-keep` on self or any ancestor (manual opt-out for\n // toggles, custom inline editors, etc.)\n // Modals/trays don't subscribe at all, so this is a no-op there.\n const dismissParentPopover = useDismissParentPopover();\n const buttonElementRef = useRef<HTMLElement \| null>(null);\n\n const wrappedOnPress = useEvent((e: PressEvent) => {\n userOnPress?.(e);\n const el = buttonElementRef.current;\n if (!el) return;\n if (el.hasAttribute('data-popover-trigger')) return;\n if (el.closest('[data-popover-keep]')) return;\n dismissParentPopover(el);\n });\n\n const { actionProps, isPressed } = useAction(\n {\n ...allProps,\n isDisabled,\n onPress: wrappedOnPress,\n ...(label ? { label } : {}),\n },\n ref,\n );\n\n const styles = extractStyles(props, STYLE_PROPS);\n const isDisabledElement = actionProps.isDisabled;\n\n delete actionProps.isDisabled;\n\n // Base mods for icon resolution (without icon-dependent mods)\n const baseMods = useMemo<ButtonMods>(\n () => ({\n pressed: isPressed && !isDisabled,\n loading: isLoading,\n selected: isSelected,\n ...mods,\n }),\n [isPressed, isDisabled, isLoading, isSelected, mods],\n );\n\n // Resolve dynamic icon props\n const resolvedIcon = useMemo(\n () => resolveIcon(iconProp, baseMods),\n [iconProp, baseMods],\n );\n const resolvedRightIcon = useMemo(\n () => resolveIcon(rightIconProp, baseMods),\n [rightIconProp, baseMods],\n );\n\n const hasLeftSlot = resolvedIcon.hasSlot;\n const hasRightSlot = resolvedRightIcon.hasSlot;\n\n const icon: ReactNode = resolvedIcon.content;\n const rightIcon: ReactNode = resolvedRightIcon.content;\n\n // Generate stable keys for icon transitions based on icon type\n const iconKey = isLoading\n ? 'loading'\n : isValidElement(icon)\n ? (icon.type as any)?.displayName \|\| (icon.type as any)?.name \|\| 'icon'\n : icon\n ? 'icon'\n : 'empty';\n\n const rightIconKey = isValidElement(rightIcon)\n ? (rightIcon.type as any)?.displayName \|\|\n (rightIcon.type as any)?.name \|\|\n 'icon'\n : rightIcon\n ? 'icon'\n : 'empty';\n\n children = children \|\| hasLeftSlot \|\| hasRightSlot ? children : label;\n\n const specifiedLabel =\n label ?? props['aria-label'] ?? props['aria-labelledby'];\n\n // Warn about accessibility issues when button has no accessible label\n useWarn(!children && hasLeftSlot && !specifiedLabel, {\n key: ['button-icon-no-label', hasLeftSlot],\n args: [\n 'accessibility issue:',\n 'If you provide `icon` property for a Button and do not provide any children then you should specify the `aria-label` property to make sure the Button element stays accessible.',\n ],\n });\n\n useWarn(!children && !hasLeftSlot && !specifiedLabel, {\n key: ['button-no-content-no-label', hasLeftSlot],\n args: [\n 'accessibility issue:',\n 'If you provide no children for a Button then you should specify the `aria-label` property to make sure the Button element stays accessible.',\n ],\n });\n\n if (!children && !specifiedLabel) {\n label = 'Unnamed'; // fix to avoid warning in production\n }\n\n const hasLeftIcon = !!(hasLeftSlot \|\| isLoading);\n const hasChildren = children != null;\n const singleIcon = !!(\n ((hasLeftIcon && !hasRightSlot) \|\| (hasRightSlot && !hasLeftIcon)) &&\n !hasChildren\n );\n\n const hasIcons = hasLeftIcon \|\| hasRightSlot;\n const rawChildren = !!(\n hasChildren &&\n typeof children !== 'string' &&\n !Children.toArray(children).some((child) => typeof child === 'string')\n );\n\n const [isIconShown, setIsIconShown] = useState(hasLeftIcon);\n const [isRightIconShown, setIsRightIconShown] = useState(hasRightSlot);\n const isFirstRender = useIsFirstRender();\n\n const modifiers = useMemo<ButtonMods>(\n () => ({\n ...baseMods,\n 'has-icons': hasIcons,\n 'has-icon': hasLeftIcon,\n 'is-icon-shown': isIconShown,\n 'has-right-icon': hasRightSlot,\n 'is-right-icon-shown': isRightIconShown,\n 'single-icon': singleIcon,\n 'text-only': !!(hasChildren && typeof children === 'string' && !hasIcons),\n 'raw-children': rawChildren,\n 'has-content': children != null,\n }),\n [\n baseMods,\n children,\n hasLeftIcon,\n hasRightSlot,\n singleIcon,\n hasIcons,\n hasChildren,\n rawChildren,\n isIconShown,\n isRightIconShown,\n ],\n );\n\n const {\n labelProps: finalLabelProps,\n labelRef,\n renderWithTooltip,\n isTooltipActive,\n } = useAutoTooltip({\n tooltip,\n children,\n labelProps: undefined,\n });\n\n // A disabled button still has to be able to show its tooltip — that is\n // usually where the reason for being unavailable is written. The native\n // `disabled` attribute would make the browser drop the hover that opens it,\n // so when a tooltip is present the button is marked `aria-disabled` and kept\n // inert instead. The attribute is skipped for links too, where it is not\n // valid markup and `aria-disabled` is the only thing announcing the state.\n const { isNativelyDisabled, inertProps } = getDisabledElementProps({\n isDisabled: isDisabledElement,\n keepEvents: isTooltipActive,\n as: typeof actionProps.as === 'string' ? actionProps.as : undefined,\n });\n\n // Render function that creates the button element\n const renderButtonElement = (\n tooltipTriggerProps?: HTMLAttributes<HTMLElement>,\n tooltipRef?: RefObject<HTMLElement>,\n ): ReactNode => {\n // Use callback ref to merge multiple refs without calling hooks\n const handleRef = (element: HTMLElement \| null) => {\n // Set the component's forwarded ref from useAction\n const domRef = actionProps.ref as any;\n if (typeof domRef === 'function') {\n domRef(element);\n } else if (domRef) {\n domRef.current = element;\n }\n // Set the tooltip ref if provided\n if (tooltipRef) {\n (tooltipRef as any).current = element;\n }\n // Track the rendered DOM node so the dismiss wrapper around `onPress`\n // can read it synchronously without coupling to `useAction`'s ref shape.\n buttonElementRef.current = element;\n };\n\n // Determine if size is custom (number or unrecognized string)\n const isCustomSize =\n typeof size === 'number' \|\|\n (size != null &&\n !(BUTTON_SIZE_VALUES as readonly string[]).includes(size));\n const sizeTokenValue =\n typeof size === 'number' ? `${size}px` : isCustomSize ? size : undefined;\n\n // The `special` theme has no `outline-2` variant (it paints over\n // `#special-surface`, not `#surface-2`/`#surface-3`); fall back to\n // `outline` so the button still renders.\n const effectiveType =\n theme === 'special' && type === 'outline-2' ? 'outline' : type;\n\n return (\n <ButtonElement\n download={download}\n {...mergeProps(actionProps, tooltipTriggerProps \|\| {}, inertProps)}\n ref={handleRef}\n mods={{ ...actionProps.mods, ...modifiers }}\n disabled={isNativelyDisabled}\n variant={`${theme}.${effectiveType ?? 'outline'}` as ButtonVariant}\n data-theme={theme}\n data-type={effectiveType ?? 'outline'}\n data-size={size}\n data-popover-dismiss=\"\"\n styles={styles}\n tokens={{\n ...tokens,\n ...(sizeTokenValue ? { $size: sizeTokenValue } : {}),\n }}\n >\n <DisplayTransition\n isShown={hasLeftIcon}\n animateOnMount={!isFirstRender}\n onToggle={setIsIconShown}\n >\n {({ ref }) => (\n <div ref={ref} data-element=\"Icon\" aria-hidden=\"true\">\n <IconSwitch noWrapper contentKey={iconKey}>\n {isLoading ? <LoadingIcon /> : icon}\n </IconSwitch>\n </div>\n )}\n </DisplayTransition>\n {hasChildren &&\n (rawChildren ? (\n children\n ) : (\n <div data-element=\"Label\" {...finalLabelProps} ref={labelRef}>\n {children}\n </div>\n ))}\n <DisplayTransition\n isShown={hasRightSlot}\n animateOnMount={!isFirstRender}\n onToggle={setIsRightIconShown}\n >\n {({ ref }) => (\n <div ref={ref} data-element=\"RightIcon\" aria-hidden=\"true\">\n <IconSwitch noWrapper contentKey={rightIconKey}>\n {rightIcon}\n </IconSwitch>\n </div>\n )}\n </DisplayTransition>\n </ButtonElement>\n );\n };\n\n return renderWithTooltip(renderButtonElement, defaultTooltipPlacement);\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA6EA,MAAM,qBAAqB;CACzB;CACA;CACA;CACA;CACA;CACA;CACD;AAsGD,MAAM,cAAc,CAAC,GAAG,kBAAkB,GAAG,YAAY;AAEzD,MAAM,sBAA8B;CAClC,GAAG;CACH,UAAU;CACV,SAAS;CACT,YAAY;CACZ,cAAc;CACd,WAAW;CAEX,OAAO;CACP,QAAQ;CACR,eAAe;CACf,YAAY;CACb;AAED,MAAa,wBAAgC;CAC3C,QAAQ;CACR,SAAS;CACT,MAAM;CACN,KAAK;CACL,YAAY;EACV,IAAI;EACJ,gBAAgB;EACjB;CACD,cAAc;CACd,UAAU;CACV,QAAQ;EACN,IAAI;EACJ,eAAe;EACf,eAAe;EACf,aAAa;EACd;CACD,eAAe;CACf,SAAS;EACP,IAAI;EACJ,6BACE;EACF,aAAa;EACd;CACD,OAAO;EACL,IAAI;EACJ,6BAA6B;EAC7B,eAAe;EACf,aAAa;EACd;CACD,QAAQ;EACN,IAAI;EACJ,aAAa;EACd;CACD,YAAY;CACZ,QAAQ;EACN,IAAI;EACJ,wBAAwB;EACxB,2CAA2C;EAC3C,4CAA4C;EAC5C,2DAA2D;EAC5D;CACD,QAAQ;EACN,IAAI;EACJ,6FACE;EACH;CACD,QAAQ;EACN,qCAAqC;EACrC,6CAA6C;EAC9C;CACD,YAAY;CACZ,eAAe;CAEf,OAAO;EACL,IAAI;EACJ,eAAe;EACf,cAAc;EACd,eAAe;EACf,cAAc;EACd,eAAe;EACf,eAAe;EAChB;CACD,mBAAmB,EACjB,IAAI,8EACL;CACD,kBAAkB;EAChB,IAAI;EACJ,4BAA4B;EAC7B;CACD,wBAAwB;CACxB,uBAAuB;CACvB,iBAAiB;EACf,IAAI;EACJ,iBAAiB;EAClB;CACD,kBAAkB;EAChB,IAAI;EACJ,uBAAuB;EACxB;CAGD,MAAM;EACJ,GAAG;EACH,OAAO;GACL,IAAI;GACJ,iBAAiB;GAClB;EACD,SAAS;GACP,IAAI;GACJ,iBAAiB;GAClB;EACD,WAAW;GACT,IAAI;GACJ,iBAAiB;GAClB;EACF;CAGD,WAAW;EACT,GAAG;EACH,OAAO;GACL,IAAI;GACJ,uBAAuB;GACxB;EACD,SAAS;GACP,IAAI;GACJ,uBAAuB;GACxB;EACD,WAAW;GACT,IAAI;GACJ,uBAAuB;GACxB;EACF;CAGD,OAAO;EACL,GAAG;EACH,SAAS;EACT,WAAW;EACX,WAAW;EACX,YAAY;EACZ,UAAU;EACV,cAAc;EACd,OAAO;EACP,WAAW;EACX,YAAY;EACZ,SAAS;GACP,IAAI;GACJ,aAAa;GACd;EACF;CACF;AAED,MAAM,gBAAgB,MAAM;CAC1B,IAAI;CACJ,QAAQ;CACR,UAAU;EAER,mBAAmB;EACnB,mBAAmB;EACnB,qBAAqB;EACrB,iBAAiB;EACjB,gBAAgB;EAGhB,mBAAmB;EACnB,mBAAmB;EACnB,qBAAqB;EACrB,iBAAiB;EACjB,gBAAgB;EAGhB,kBAAkB;EAClB,kBAAkB;EAClB,oBAAoB;EACpB,gBAAgB;EAChB,eAAe;EAGf,mBAAmB;EACnB,mBAAmB;EACnB,qBAAqB;EACrB,iBAAiB;EACjB,gBAAgB;EAGhB,mBAAmB;EACnB,mBAAmB;EACnB,qBAAqB;EACrB,iBAAiB;EACjB,gBAAgB;EAGhB,gBAAgB;EAChB,gBAAgB;EAChB,kBAAkB;EAClB,cAAc;EACd,aAAa;EAGb,mBAAmB;EACnB,mBAAmB;EACnB,iBAAiB;EACjB,gBAAgB;EACjB;CACF,CAAC;AAEF,MAAa,SAAS,WAAW,SAAS,OACxC,UACA,KACA;CACA,MAAM,eAAe,uBAAuB;CAE5C,IAAI,EACF,MACA,MAAM,UACN,OACA,UACA,QAAQ,cAAc,SAAS,WAC/B,MAAM,UACN,WAAW,eACX,MACA,UACA,UAAU,MACV,0BAA0B,OAC1B,SAAS,aACT,QACA,GAAG,UACD;AAEJ,QAAO,QAAQ,cAAc;CAC7B,MAAM,OACJ,YAAY,cAAc,SAAS,SAAS,SAAS,WAAW;CAElE,MAAM,aACJ,cAAc,cAAc,MAAM,cAAc,MAAM;CACxD,MAAM,YAAY,MAAM;CACxB,MAAM,aAAa,MAAM;CASzB,MAAM,uBAAuB,yBAAyB;CACtD,MAAM,mBAAmB,OAA2B,KAAK;CAEzD,MAAM,iBAAiB,UAAU,MAAkB;AACjD,gBAAc,EAAE;EAChB,MAAM,KAAK,iBAAiB;AAC5B,MAAI,CAAC,GAAI;AACT,MAAI,GAAG,aAAa,uBAAuB,CAAE;AAC7C,MAAI,GAAG,QAAQ,sBAAsB,CAAE;AACvC,uBAAqB,GAAG;GACxB;CAEF,MAAM,EAAE,aAAa,cAAc,UACjC;EACE,GAAG;EACH;EACA,SAAS;EACT,GAAI,QAAQ,EAAE,OAAO,GAAG,EAAE;EAC3B,EACD,IACD;CAED,MAAM,SAAS,cAAc,OAAO,YAAY;CAChD,MAAM,oBAAoB,YAAY;AAEtC,QAAO,YAAY;CAGnB,MAAM,WAAW,eACR;EACL,SAAS,aAAa,CAAC;EACvB,SAAS;EACT,UAAU;EACV,GAAG;EACJ,GACD;EAAC;EAAW;EAAY;EAAW;EAAY;EAAK,CACrD;CAGD,MAAM,eAAe,cACb,YAAY,UAAU,SAAS,EACrC,CAAC,UAAU,SAAS,CACrB;CACD,MAAM,oBAAoB,cAClB,YAAY,eAAe,SAAS,EAC1C,CAAC,eAAe,SAAS,CAC1B;CAED,MAAM,cAAc,aAAa;CACjC,MAAM,eAAe,kBAAkB;CAEvC,MAAM,OAAkB,aAAa;CACrC,MAAM,YAAuB,kBAAkB;CAG/C,MAAM,UAAU,YACZ,YACA,eAAe,KAAK,GACjB,KAAK,MAAc,eAAgB,KAAK,MAAc,QAAQ,SAC/D,OACE,SACA;CAER,MAAM,eAAe,eAAe,UAAU,GACzC,UAAU,MAAc,eACxB,UAAU,MAAc,QACzB,SACA,YACE,SACA;AAEN,YAAW,YAAY,eAAe,eAAe,WAAW;CAEhE,MAAM,iBACJ,SAAS,MAAM,iBAAiB,MAAM;AAGxC,SAAQ,CAAC,YAAY,eAAe,CAAC,gBAAgB;EACnD,KAAK,CAAC,wBAAwB,YAAY;EAC1C,MAAM,CACJ,wBACA,kLACD;EACF,CAAC;AAEF,SAAQ,CAAC,YAAY,CAAC,eAAe,CAAC,gBAAgB;EACpD,KAAK,CAAC,8BAA8B,YAAY;EAChD,MAAM,CACJ,wBACA,8IACD;EACF,CAAC;AAEF,KAAI,CAAC,YAAY,CAAC,eAChB,SAAQ;CAGV,MAAM,cAAc,CAAC,EAAE,eAAe;CACtC,MAAM,cAAc,YAAY;CAChC,MAAM,aAAa,CAAC,GAChB,eAAe,CAAC,gBAAkB,gBAAgB,CAAC,gBACrD,CAAC;CAGH,MAAM,WAAW,eAAe;CAChC,MAAM,cAAc,CAAC,EACnB,eACA,OAAO,aAAa,YACpB,CAAC,SAAS,QAAQ,SAAS,CAAC,MAAM,UAAU,OAAO,UAAU,SAAS;CAGxE,MAAM,CAAC,aAAa,kBAAkB,SAAS,YAAY;CAC3D,MAAM,CAAC,kBAAkB,uBAAuB,SAAS,aAAa;CACtE,MAAM,gBAAgB,kBAAkB;CAExC,MAAM,YAAY,eACT;EACL,GAAG;EACH,aAAa;EACb,YAAY;EACZ,iBAAiB;EACjB,kBAAkB;EAClB,uBAAuB;EACvB,eAAe;EACf,aAAa,CAAC,EAAE,eAAe,OAAO,aAAa,YAAY,CAAC;EAChE,gBAAgB;EAChB,eAAe,YAAY;EAC5B,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAED,MAAM,EACJ,YAAY,iBACZ,UACA,mBACA,oBACE,eAAe;EACjB;EACA;EACA,YAAY;EACb,CAAC;CAQF,MAAM,EAAE,oBAAoB,eAAe,wBAAwB;EACjE,YAAY;EACZ,YAAY;EACZ,IAAI,OAAO,YAAY,OAAO,WAAW,YAAY,KAAK;EAC3D,CAAC;CAGF,MAAM,uBACJ,qBACA,eACc;EAEd,MAAM,aAAa,YAAgC;GAEjD,MAAM,SAAS,YAAY;AAC3B,OAAI,OAAO,WAAW,WACpB,QAAO,QAAQ;YACN,OACT,QAAO,UAAU;AAGnB,OAAI,WACF,CAAC,WAAmB,UAAU;AAIhC,oBAAiB,UAAU;;EAI7B,MAAM,eACJ,OAAO,SAAS,YACf,QAAQ,QACP,CAAE,mBAAyC,SAAS,KAAK;EAC7D,MAAM,iBACJ,OAAO,SAAS,WAAW,GAAG,KAAK,MAAM,eAAe,OAAO;EAKjE,MAAM,gBACJ,UAAU,aAAa,SAAS,cAAc,YAAY;AAE5D,SACE,qBAAC;GACW;GACV,GAAI,WAAW,aAAa,uBAAuB,EAAE,EAAE,WAAW;GAClE,KAAK;GACL,MAAM;IAAE,GAAG,YAAY;IAAM,GAAG;IAAW;GAC3C,UAAU;GACV,SAAS,GAAG,MAAM,GAAG,iBAAiB;GACtC,cAAY;GACZ,aAAW,iBAAiB;GAC5B,aAAW;GACX,wBAAqB;GACb;GACR,QAAQ;IACN,GAAG;IACH,GAAI,iBAAiB,EAAE,OAAO,gBAAgB,GAAG,EAAE;IACpD;;IAED,oBAAC;KACC,SAAS;KACT,gBAAgB,CAAC;KACjB,UAAU;gBAER,EAAE,UACF,oBAAC;MAAS;MAAK,gBAAa;MAAO,eAAY;gBAC7C,oBAAC;OAAW;OAAU,YAAY;iBAC/B,YAAY,oBAAC,gBAAc,GAAG;QACpB;OACT;MAEU;IACnB,gBACE,cACC,WAEA,oBAAC;KAAI,gBAAa;KAAQ,GAAI;KAAiB,KAAK;KACjD;MACG;IAEV,oBAAC;KACC,SAAS;KACT,gBAAgB,CAAC;KACjB,UAAU;gBAER,EAAE,UACF,oBAAC;MAAS;MAAK,gBAAa;MAAY,eAAY;gBAClD,oBAAC;OAAW;OAAU,YAAY;iBAC/B;QACU;OACT;MAEU;;IACN;;AAIpB,QAAO,kBAAkB,qBAAqB,wBAAwB;EACtE"}
1	+ {"version":3,"file":"Button.js","names":[],"sources":["../../../../src/components/actions/Button/Button.tsx"],"sourcesContent":["import { FocusableRef, PressEvent } from '@react-types/shared';\nimport {\n CONTAINER_STYLES,\n Mods,\n Styles,\n tasty,\n TEXT_STYLES,\n} from '@tenphi/tasty';\nimport {\n Children,\n forwardRef,\n HTMLAttributes,\n isValidElement,\n ReactNode,\n RefObject,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { OverlayProps } from 'react-aria';\n\nimport { useEvent } from '../../../_internal';\nimport { useIsFirstRender } from '../../../_internal/hooks/use-is-first-render';\nimport { useWarn } from '../../../_internal/hooks/use-warn';\nimport {\n CURRENT_CLEAR_STYLES,\n CURRENT_LINK_STYLES,\n CURRENT_OUTLINE_2_STYLES,\n CURRENT_OUTLINE_STYLES,\n CURRENT_PRIMARY_STYLES,\n DANGER_CLEAR_STYLES,\n DANGER_LINK_STYLES,\n DANGER_OUTLINE_2_STYLES,\n DANGER_OUTLINE_STYLES,\n DANGER_PRIMARY_STYLES,\n DEFAULT_CLEAR_STYLES,\n DEFAULT_LINK_STYLES,\n DEFAULT_OUTLINE_2_STYLES,\n DEFAULT_OUTLINE_STYLES,\n DEFAULT_PRIMARY_STYLES,\n NOTE_CLEAR_STYLES,\n NOTE_LINK_STYLES,\n NOTE_OUTLINE_2_STYLES,\n NOTE_OUTLINE_STYLES,\n NOTE_PRIMARY_STYLES,\n SPECIAL_CLEAR_STYLES,\n SPECIAL_LINK_STYLES,\n SPECIAL_OUTLINE_STYLES,\n SPECIAL_PRIMARY_STYLES,\n SUCCESS_CLEAR_STYLES,\n SUCCESS_LINK_STYLES,\n SUCCESS_OUTLINE_2_STYLES,\n SUCCESS_OUTLINE_STYLES,\n SUCCESS_PRIMARY_STYLES,\n WARNING_CLEAR_STYLES,\n WARNING_LINK_STYLES,\n WARNING_OUTLINE_2_STYLES,\n WARNING_OUTLINE_STYLES,\n WARNING_PRIMARY_STYLES,\n} from '../../../data/item-themes';\nimport { LoadingIcon } from '../../../icons/LoadingIcon';\nimport {\n DynamicIcon,\n getDisabledElementProps,\n mergeProps,\n resolveIcon,\n useDismissParentPopover,\n} from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useAutoTooltip } from '../../content/use-auto-tooltip';\nimport { DisplayTransition } from '../../helpers/DisplayTransition';\nimport { IconSwitch } from '../../helpers/IconSwitch/IconSwitch';\nimport { CubeTooltipProviderProps } from '../../overlays/Tooltip/TooltipProvider';\nimport { CubeActionProps } from '../Action/Action';\nimport { useButtonSplitContext } from '../ButtonSplit/context';\nimport { useAction } from '../use-action';\n\nconst BUTTON_SIZE_VALUES = [\n 'xsmall',\n 'small',\n 'medium',\n 'large',\n 'xlarge',\n 'inline',\n] as const;\n\n/** Known modifiers for Button component /\nexport type ButtonMods = Mods<{\n pressed?: boolean;\n loading?: boolean;\n selected?: boolean;\n 'has-icons'?: boolean;\n 'has-icon'?: boolean;\n 'has-right-icon'?: boolean;\n 'single-icon'?: boolean;\n 'text-only'?: boolean;\n 'raw-children'?: boolean;\n}>;\n\nexport interface CubeButtonProps extends CubeActionProps {\n icon?: DynamicIcon<ButtonMods>;\n rightIcon?: DynamicIcon<ButtonMods>;\n isLoading?: boolean;\n isSelected?: boolean;\n type?:\n \| 'primary'\n \| 'danger'\n \| 'link'\n \| 'clear'\n \| 'outline'\n \| 'outline-2'\n \| (string & {});\n theme?:\n \| 'default'\n \| 'danger'\n \| 'success'\n \| 'warning'\n \| 'note'\n \| 'special'\n \| 'current'\n \| (string & {});\n size?:\n \| 'xsmall'\n \| 'small'\n \| 'medium'\n \| 'large'\n \| 'xlarge'\n \| 'inline'\n \| number\n \| (string & {});\n /\n Tooltip content and configuration:\n * - string: simple tooltip text\n * - true: auto tooltip on overflow (shows children as tooltip when truncated)\n * - object: advanced configuration with optional auto property\n /\n tooltip?:\n \| string\n \| boolean\n \| (Omit<CubeTooltipProviderProps, 'children'> & { auto?: boolean });\n /\n @private\n * Default tooltip placement for the button.\n * @default \"top\"\n /\n defaultTooltipPlacement?: OverlayProps['placement'];\n}\n\nexport type ButtonVariant =\n // The `current` theme mixes every color from the inherited `currentcolor`\n // instead of a brand ramp — see the CURRENT THEME section of `item-themes`.\n \| 'current.primary'\n \| 'current.outline'\n \| 'current.outline-2'\n \| 'current.clear'\n \| 'current.link'\n \| 'default.primary'\n \| 'default.outline'\n \| 'default.outline-2'\n \| 'default.clear'\n \| 'default.link'\n \| 'danger.primary'\n \| 'danger.outline'\n \| 'danger.outline-2'\n \| 'danger.clear'\n \| 'danger.link'\n \| 'success.primary'\n \| 'success.outline'\n \| 'success.outline-2'\n \| 'success.clear'\n \| 'success.link'\n \| 'warning.primary'\n \| 'warning.outline'\n \| 'warning.outline-2'\n \| 'warning.clear'\n \| 'warning.link'\n \| 'note.primary'\n \| 'note.outline'\n \| 'note.outline-2'\n \| 'note.clear'\n \| 'note.link'\n \| 'special.primary'\n \| 'special.outline'\n \| 'special.clear'\n \| 'special.link';\n\nconst STYLE_PROPS = [...CONTAINER_STYLES, ...TEXT_STYLES];\n\nconst DEFAULT_ICON_STYLES: Styles = {\n $: '>',\n position: 'relative',\n display: 'grid',\n placeItems: 'center',\n placeContent: 'center',\n placeSelf: 'stretch',\n // overflow: 'hidden',\n width: 'fixed ($size - 2bw)',\n height: 'fixed ($size - 2bw)',\n pointerEvents: 'none',\n transition: 'theme, width, height, translate',\n};\n\nexport const DEFAULT_BUTTON_STYLES: Styles = {\n recipe: 'reset button',\n display: 'inline-grid',\n flow: 'column dense',\n gap: 0,\n placeItems: {\n '': 'stretch',\n 'raw-children': 'center stretch',\n },\n placeContent: 'center',\n position: 'relative',\n preset: {\n '': 't3m',\n 'size=xsmall': 't4',\n 'size=xlarge': 't2m',\n 'type=link': 'strong',\n },\n outlineOffset: 1,\n padding: {\n '': 0,\n 'raw-children & !has-icons':\n '$block-padding $inline-padding $block-padding $inline-padding',\n 'type=link': '0',\n },\n width: {\n '': 'min $size',\n 'has-icon & has-right-icon': 'min ($size 2 - 2bw)',\n 'single-icon': 'fixed $size',\n 'type=link': 'min 1ch',\n },\n height: {\n '': 'fixed $size',\n 'type=link': 'initial',\n },\n whiteSpace: 'nowrap',\n radius: {\n '': true,\n 'type=link & !focused': 0,\n '@parent(button-split, >) & !:last-child': '1r left',\n '@parent(button-split, >) & !:first-child': '1r right',\n '@parent(button-split, >) & !:first-child & !:last-child': 0,\n },\n margin: {\n '': 0,\n '@parent(button-split, >) & !:first-child & (type=outline \| type=outline-2 \| type=primary)':\n '-1bw left',\n },\n zIndex: {\n '@parent(button-split, >) & :hover': 1,\n '@parent(button-split, >) & :focus-visible': 2,\n },\n transition: 'theme, grid-template, padding',\n verticalAlign: 'bottom',\n\n $size: {\n '': '$size-md',\n 'size=xsmall': '$size-xs',\n 'size=small': '$size-sm',\n 'size=medium': '$size-md',\n 'size=large': '$size-lg',\n 'size=xlarge': '$size-xl',\n 'size=inline': '(1lh + 2bw)',\n },\n '$inline-padding': {\n '': 'max($min-inline-padding, (($size - 1lh - 2bw) / 2 + $inline-compensation))',\n },\n '$block-padding': {\n '': '.5x',\n 'size=xsmall \| size=small': '.25x',\n },\n '$inline-compensation': '.5x',\n '$min-inline-padding': '(1x - 1bw)',\n '$left-padding': {\n '': '$inline-padding',\n 'is-icon-shown': '0px',\n },\n '$right-padding': {\n '': '$inline-padding',\n 'is-right-icon-shown': '0px',\n },\n\n // Icon sub-element (recommended format)\n Icon: {\n ...DEFAULT_ICON_STYLES,\n width: {\n '': 'fixed 0px',\n 'is-icon-shown': 'fixed ($size - 2bw)',\n },\n opacity: {\n '': 0,\n 'is-icon-shown': 1,\n },\n translate: {\n '': '($size * 1 / 4) 0',\n 'is-icon-shown': '0 0',\n },\n },\n\n // RightIcon sub-element (recommended format)\n RightIcon: {\n ...DEFAULT_ICON_STYLES,\n width: {\n '': 'fixed 0px',\n 'is-right-icon-shown': 'fixed ($size - 2bw)',\n },\n opacity: {\n '': 0,\n 'is-right-icon-shown': 1,\n },\n translate: {\n '': '($size * -1 / 4) 0',\n 'is-right-icon-shown': '0 0',\n },\n },\n\n // Label sub-element (recommended format)\n Label: {\n $: '>',\n display: 'block',\n placeSelf: 'center stretch',\n boxSizing: 'border-box',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n width: '0 100%',\n textAlign: 'center',\n transition: 'theme, padding',\n padding: {\n '': '$block-padding $right-padding $block-padding $left-padding',\n 'type=link': '0',\n },\n },\n} as const;\n\nconst ButtonElement = tasty({\n qa: 'Button',\n styles: DEFAULT_BUTTON_STYLES,\n variants: {\n // Current theme — colors mixed from the inherited `currentcolor`\n 'current.primary': CURRENT_PRIMARY_STYLES,\n 'current.outline': CURRENT_OUTLINE_STYLES,\n 'current.outline-2': CURRENT_OUTLINE_2_STYLES,\n 'current.clear': CURRENT_CLEAR_STYLES,\n 'current.link': CURRENT_LINK_STYLES,\n\n // Default theme\n 'default.primary': DEFAULT_PRIMARY_STYLES,\n 'default.outline': DEFAULT_OUTLINE_STYLES,\n 'default.outline-2': DEFAULT_OUTLINE_2_STYLES,\n 'default.clear': DEFAULT_CLEAR_STYLES,\n 'default.link': DEFAULT_LINK_STYLES,\n\n // Danger theme\n 'danger.primary': DANGER_PRIMARY_STYLES,\n 'danger.outline': DANGER_OUTLINE_STYLES,\n 'danger.outline-2': DANGER_OUTLINE_2_STYLES,\n 'danger.clear': DANGER_CLEAR_STYLES,\n 'danger.link': DANGER_LINK_STYLES,\n\n // Success theme\n 'success.primary': SUCCESS_PRIMARY_STYLES,\n 'success.outline': SUCCESS_OUTLINE_STYLES,\n 'success.outline-2': SUCCESS_OUTLINE_2_STYLES,\n 'success.clear': SUCCESS_CLEAR_STYLES,\n 'success.link': SUCCESS_LINK_STYLES,\n\n // Warning theme\n 'warning.primary': WARNING_PRIMARY_STYLES,\n 'warning.outline': WARNING_OUTLINE_STYLES,\n 'warning.outline-2': WARNING_OUTLINE_2_STYLES,\n 'warning.clear': WARNING_CLEAR_STYLES,\n 'warning.link': WARNING_LINK_STYLES,\n\n // Note theme\n 'note.primary': NOTE_PRIMARY_STYLES,\n 'note.outline': NOTE_OUTLINE_STYLES,\n 'note.outline-2': NOTE_OUTLINE_2_STYLES,\n 'note.clear': NOTE_CLEAR_STYLES,\n 'note.link': NOTE_LINK_STYLES,\n\n // Special theme\n 'special.primary': SPECIAL_PRIMARY_STYLES,\n 'special.outline': SPECIAL_OUTLINE_STYLES,\n 'special.clear': SPECIAL_CLEAR_STYLES,\n 'special.link': SPECIAL_LINK_STYLES,\n },\n});\n\nexport const Button = forwardRef(function Button(\n allProps: CubeButtonProps,\n ref: FocusableRef<HTMLElement>,\n) {\n const splitContext = useButtonSplitContext();\n\n let {\n type,\n size: sizeProp,\n label,\n children,\n theme = splitContext?.theme ?? 'default',\n icon: iconProp,\n rightIcon: rightIconProp,\n mods,\n download,\n tooltip = true,\n defaultTooltipPlacement = 'top',\n onPress: userOnPress,\n tokens,\n ...props\n } = allProps;\n\n type = type ?? splitContext?.type;\n const size =\n sizeProp ?? splitContext?.size ?? (type === 'link' ? 'inline' : 'medium');\n\n const isDisabled =\n splitContext?.isDisabled \|\| props.isDisabled \|\| props.isLoading;\n const isLoading = props.isLoading;\n const isSelected = props.isSelected;\n\n // Default: pressing a Button inside an open popover closes that popover.\n // Opt-outs (handled inline below):\n // - `data-popover-trigger` (auto, applied by MenuTrigger/DialogTrigger\n // type='popover' so triggers don't dismiss the popover they live in)\n // - `data-popover-keep` on self or any ancestor (manual opt-out for\n // toggles, custom inline editors, etc.)\n // Modals/trays don't subscribe at all, so this is a no-op there.\n const dismissParentPopover = useDismissParentPopover();\n const buttonElementRef = useRef<HTMLElement \| null>(null);\n\n const wrappedOnPress = useEvent((e: PressEvent) => {\n userOnPress?.(e);\n const el = buttonElementRef.current;\n if (!el) return;\n if (el.hasAttribute('data-popover-trigger')) return;\n if (el.closest('[data-popover-keep]')) return;\n dismissParentPopover(el);\n });\n\n const { actionProps, isPressed } = useAction(\n {\n ...allProps,\n isDisabled,\n onPress: wrappedOnPress,\n ...(label ? { label } : {}),\n },\n ref,\n );\n\n const styles = extractStyles(props, STYLE_PROPS);\n const isDisabledElement = actionProps.isDisabled;\n\n delete actionProps.isDisabled;\n\n // Base mods for icon resolution (without icon-dependent mods)\n const baseMods = useMemo<ButtonMods>(\n () => ({\n pressed: isPressed && !isDisabled,\n loading: isLoading,\n selected: isSelected,\n ...mods,\n }),\n [isPressed, isDisabled, isLoading, isSelected, mods],\n );\n\n // Resolve dynamic icon props\n const resolvedIcon = useMemo(\n () => resolveIcon(iconProp, baseMods),\n [iconProp, baseMods],\n );\n const resolvedRightIcon = useMemo(\n () => resolveIcon(rightIconProp, baseMods),\n [rightIconProp, baseMods],\n );\n\n const hasLeftSlot = resolvedIcon.hasSlot;\n const hasRightSlot = resolvedRightIcon.hasSlot;\n\n const icon: ReactNode = resolvedIcon.content;\n const rightIcon: ReactNode = resolvedRightIcon.content;\n\n // Generate stable keys for icon transitions based on icon type\n const iconKey = isLoading\n ? 'loading'\n : isValidElement(icon)\n ? (icon.type as any)?.displayName \|\| (icon.type as any)?.name \|\| 'icon'\n : icon\n ? 'icon'\n : 'empty';\n\n const rightIconKey = isValidElement(rightIcon)\n ? (rightIcon.type as any)?.displayName \|\|\n (rightIcon.type as any)?.name \|\|\n 'icon'\n : rightIcon\n ? 'icon'\n : 'empty';\n\n children = children \|\| hasLeftSlot \|\| hasRightSlot ? children : label;\n\n const specifiedLabel =\n label ?? props['aria-label'] ?? props['aria-labelledby'];\n\n // Warn about accessibility issues when button has no accessible label\n useWarn(!children && hasLeftSlot && !specifiedLabel, {\n key: ['button-icon-no-label', hasLeftSlot],\n args: [\n 'accessibility issue:',\n 'If you provide `icon` property for a Button and do not provide any children then you should specify the `aria-label` property to make sure the Button element stays accessible.',\n ],\n });\n\n useWarn(!children && !hasLeftSlot && !specifiedLabel, {\n key: ['button-no-content-no-label', hasLeftSlot],\n args: [\n 'accessibility issue:',\n 'If you provide no children for a Button then you should specify the `aria-label` property to make sure the Button element stays accessible.',\n ],\n });\n\n if (!children && !specifiedLabel) {\n label = 'Unnamed'; // fix to avoid warning in production\n }\n\n const hasLeftIcon = !!(hasLeftSlot \|\| isLoading);\n const hasChildren = children != null;\n const singleIcon = !!(\n ((hasLeftIcon && !hasRightSlot) \|\| (hasRightSlot && !hasLeftIcon)) &&\n !hasChildren\n );\n\n const hasIcons = hasLeftIcon \|\| hasRightSlot;\n const rawChildren = !!(\n hasChildren &&\n typeof children !== 'string' &&\n !Children.toArray(children).some((child) => typeof child === 'string')\n );\n\n const [isIconShown, setIsIconShown] = useState(hasLeftIcon);\n const [isRightIconShown, setIsRightIconShown] = useState(hasRightSlot);\n const isFirstRender = useIsFirstRender();\n\n const modifiers = useMemo<ButtonMods>(\n () => ({\n ...baseMods,\n 'has-icons': hasIcons,\n 'has-icon': hasLeftIcon,\n 'is-icon-shown': isIconShown,\n 'has-right-icon': hasRightSlot,\n 'is-right-icon-shown': isRightIconShown,\n 'single-icon': singleIcon,\n 'text-only': !!(hasChildren && typeof children === 'string' && !hasIcons),\n 'raw-children': rawChildren,\n 'has-content': children != null,\n }),\n [\n baseMods,\n children,\n hasLeftIcon,\n hasRightSlot,\n singleIcon,\n hasIcons,\n hasChildren,\n rawChildren,\n isIconShown,\n isRightIconShown,\n ],\n );\n\n const {\n labelProps: finalLabelProps,\n labelRef,\n renderWithTooltip,\n isTooltipActive,\n } = useAutoTooltip({\n tooltip,\n children,\n labelProps: undefined,\n });\n\n // A disabled button still has to be able to show its tooltip — that is\n // usually where the reason for being unavailable is written. The native\n // `disabled` attribute would make the browser drop the hover that opens it,\n // so when a tooltip is present the button is marked `aria-disabled` and kept\n // inert instead. The attribute is skipped for links too, where it is not\n // valid markup and `aria-disabled` is the only thing announcing the state.\n const { isNativelyDisabled, inertProps } = getDisabledElementProps({\n isDisabled: isDisabledElement,\n keepEvents: isTooltipActive,\n as: typeof actionProps.as === 'string' ? actionProps.as : undefined,\n });\n\n // Render function that creates the button element\n const renderButtonElement = (\n tooltipTriggerProps?: HTMLAttributes<HTMLElement>,\n tooltipRef?: RefObject<HTMLElement>,\n ): ReactNode => {\n // Use callback ref to merge multiple refs without calling hooks\n const handleRef = (element: HTMLElement \| null) => {\n // Set the component's forwarded ref from useAction\n const domRef = actionProps.ref as any;\n if (typeof domRef === 'function') {\n domRef(element);\n } else if (domRef) {\n domRef.current = element;\n }\n // Set the tooltip ref if provided\n if (tooltipRef) {\n (tooltipRef as any).current = element;\n }\n // Track the rendered DOM node so the dismiss wrapper around `onPress`\n // can read it synchronously without coupling to `useAction`'s ref shape.\n buttonElementRef.current = element;\n };\n\n // Determine if size is custom (number or unrecognized string)\n const isCustomSize =\n typeof size === 'number' \|\|\n (size != null &&\n !(BUTTON_SIZE_VALUES as readonly string[]).includes(size));\n const sizeTokenValue =\n typeof size === 'number' ? `${size}px` : isCustomSize ? size : undefined;\n\n // The `special` theme has no `outline-2` variant (it paints over\n // `#special-surface`, not `#surface-2`/`#surface-3`); fall back to\n // `outline` so the button still renders.\n const effectiveType =\n theme === 'special' && type === 'outline-2' ? 'outline' : type;\n\n return (\n <ButtonElement\n download={download}\n {...mergeProps(actionProps, tooltipTriggerProps \|\| {}, inertProps)}\n ref={handleRef}\n mods={{ ...actionProps.mods, ...modifiers }}\n disabled={isNativelyDisabled}\n variant={`${theme}.${effectiveType ?? 'outline'}` as ButtonVariant}\n data-theme={theme}\n data-type={effectiveType ?? 'outline'}\n data-size={size}\n data-popover-dismiss=\"\"\n styles={styles}\n tokens={{\n ...tokens,\n ...(sizeTokenValue ? { $size: sizeTokenValue } : {}),\n }}\n >\n <DisplayTransition\n isShown={hasLeftIcon}\n animateOnMount={!isFirstRender}\n onToggle={setIsIconShown}\n >\n {({ ref }) => (\n <div ref={ref} data-element=\"Icon\" aria-hidden=\"true\">\n <IconSwitch noWrapper contentKey={iconKey}>\n {isLoading ? <LoadingIcon /> : icon}\n </IconSwitch>\n </div>\n )}\n </DisplayTransition>\n {hasChildren &&\n (rawChildren ? (\n children\n ) : (\n <div data-element=\"Label\" {...finalLabelProps} ref={labelRef}>\n {children}\n </div>\n ))}\n <DisplayTransition\n isShown={hasRightSlot}\n animateOnMount={!isFirstRender}\n onToggle={setIsRightIconShown}\n >\n {({ ref }) => (\n <div ref={ref} data-element=\"RightIcon\" aria-hidden=\"true\">\n <IconSwitch noWrapper contentKey={rightIconKey}>\n {rightIcon}\n </IconSwitch>\n </div>\n )}\n </DisplayTransition>\n </ButtonElement>\n );\n };\n\n return renderWithTooltip(renderButtonElement, defaultTooltipPlacement);\n});\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { useSlotProps } from "../../../utils/react/Slots.js";
 import { Space } from "../../layout/Space.js";
 import { tasty } from "@tenphi/tasty";

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

@@ -1,9 +1,9 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
-import { DirectionIcon } from "../../../icons/DirectionIcon.js";
 import { ButtonSplitContext } from "./context.js";
 import { Button } from "../Button/Button.js";
+import { DirectionIcon } from "../../../icons/DirectionIcon.js";
 import { __Menu } from "../Menu/Menu.js";
 import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
 import { forwardRef, useCallback, useMemo, useState } from "react";

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";

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

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandMenu.js","names":["mergeProps","MenuTrigger"],"sources":["../../../../src/components/actions/CommandMenu/CommandMenu.tsx"],"sourcesContent":["import { useObjectRef, useSyncRef } from '@react-aria/utils';\nimport { FocusStrategy } from '@react-types/shared';\nimport {\n BaseProps,\n CONTAINER_STYLES,\n ContainerStyleProps,\n filterBaseProps,\n Styles,\n} from '@tenphi/tasty';\nimport React, {\n Key,\n ReactElement,\n ReactNode,\n Ref,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useFilter, useMenu } from 'react-aria';\nimport { Section, useTreeState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { LoadingIcon } from '../../../icons';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\n// `CollectionItem` (not react-stately's bare `Item`) is what CommandMenu\n// actually renders through `MenuItem`, so it carries the `Item` props.\nimport { CollectionItem as Item } from '../../CollectionItem';\nimport { TooltipProvider } from '../../overlays/Tooltip/TooltipProvider';\nimport { useMenuContext } from '../Menu';\nimport { CubeMenuProps } from '../Menu/Menu';\nimport { MenuItem } from '../Menu/MenuItem';\nimport { MenuSection } from '../Menu/MenuSection';\nimport { MenuTrigger } from '../Menu/MenuTrigger';\nimport {\n StyledDivider,\n StyledFooter,\n StyledHeader,\n StyledMenu,\n} from '../Menu/styled';\n\nimport {\n StyledCommandMenu,\n StyledEmptyState,\n StyledLoadingWrapper,\n StyledSearchInput,\n} from './styled';\n\nexport interface CommandMenuItem {\n // Standard item props\n id: string;\n textValue: string;\n\n // Enhanced search features\n keywords?: string[];\n forceMount?: boolean;\n\n // Standard Menu item props inherited\n [key: string]: any;\n}\n\nexport interface CubeCommandMenuProps<T>\n extends BaseProps,\n ContainerStyleProps,\n Omit<\n CubeMenuProps<T>,\n 'selectedKeys' \| 'defaultSelectedKeys' \| 'onSelectionChange'\n > {\n // Search-specific props\n searchPlaceholder?: string;\n searchValue?: string;\n onSearchChange?: (value: string) => void;\n filter?: (textValue: string, inputValue: string) => boolean;\n emptyLabel?: ReactNode;\n searchInputStyles?: Styles;\n headerStyles?: Styles;\n footerStyles?: Styles;\n\n // Advanced search features\n isLoading?: boolean;\n shouldFilter?: boolean;\n\n // Focus management - override the autoFocus from CubeMenuProps to allow boolean \| FocusStrategy\n autoFocus?: boolean \| FocusStrategy;\n\n // Size prop\n size?: 'medium' \| 'large' \| (string & {});\n\n /** Currently selected keys (controlled) /\n selectedKeys?: string[];\n /* Initially selected keys (uncontrolled) /\n defaultSelectedKeys?: string[];\n /* Handler for selection changes /\n onSelectionChange?: (keys: string[]) => void;\n}\n\nfunction CommandMenu<T extends object>(\n props: CubeCommandMenuProps<T>,\n ref: Ref<HTMLDivElement>,\n) {\n const { t } = useI18n();\n\n const {\n searchPlaceholder = t(\n 'commandMenu.searchPlaceholder',\n 'Search commands...',\n ),\n searchValue: controlledSearchValue,\n onSearchChange,\n filter: customFilter,\n emptyLabel = t('commandMenu.empty', 'No commands found'),\n searchInputStyles,\n headerStyles,\n footerStyles,\n isLoading = false,\n shouldFilter = true,\n autoFocus = true,\n size = 'medium',\n qa,\n styles,\n selectedKeys,\n defaultSelectedKeys,\n onSelectionChange,\n header,\n footer,\n ...restMenuProps\n } = props;\n\n const domRef = useObjectRef(ref);\n const searchInputRef = useRef<HTMLInputElement>(null);\n const contextProps = useMenuContext();\n\n // Convert string[] to Set<Key> for React Aria compatibility\n const ariaSelectedKeys = selectedKeys ? new Set(selectedKeys) : undefined;\n const ariaDefaultSelectedKeys = defaultSelectedKeys\n ? new Set(defaultSelectedKeys)\n : undefined;\n\n const handleSelectionChange = onSelectionChange\n ? (keys: 'all' \| Set<Key>) => {\n if (keys === 'all') {\n // Handle 'all' selection case - collect all available keys\n const allKeys = Array.from(treeState.collection.getKeys()).map(\n (key: any) => String(key),\n );\n onSelectionChange(allKeys);\n } else if (keys instanceof Set) {\n onSelectionChange(Array.from(keys).map((key) => String(key)));\n } else {\n onSelectionChange([]);\n }\n }\n : undefined;\n\n const completeProps = mergeProps(contextProps, restMenuProps, {\n selectedKeys: ariaSelectedKeys,\n defaultSelectedKeys: ariaDefaultSelectedKeys,\n onSelectionChange: handleSelectionChange,\n });\n\n // Search state management\n const [internalSearchValue, setInternalSearchValue] = useState('');\n const searchValue = controlledSearchValue ?? internalSearchValue;\n\n const handleSearchChange = useCallback(\n (value: string) => {\n if (controlledSearchValue === undefined) {\n setInternalSearchValue(value);\n }\n onSearchChange?.(value);\n },\n [controlledSearchValue, onSearchChange],\n );\n\n // Filter setup\n const { contains } = useFilter({ sensitivity: 'base' });\n const textFilterFn = useMemo(\n () => customFilter \|\| contains,\n [customFilter, contains],\n );\n\n // Enhanced filter function that supports keywords and forceMount\n const enhancedFilter = useCallback(\n (textValue: string, inputValue: string, item?: any) => {\n // Always show force-mounted items\n if (item?.forceMount) {\n return true;\n }\n\n // If shouldFilter is false, show all items\n if (!shouldFilter) {\n return true;\n }\n\n // Split input value into individual words and filter out empty strings\n const searchWords = inputValue\n .trim()\n .toLowerCase()\n .split(/\\s+/)\n .filter((word) => word.length > 0);\n\n // If no search words, show all items\n if (searchWords.length === 0) {\n return true;\n }\n\n // Collect all searchable text for this item\n const searchableTexts: string[] = [];\n\n // Add main text value\n searchableTexts.push(textValue.toLowerCase());\n\n // Add keywords if available\n if (item?.keywords && Array.isArray(item.keywords)) {\n searchableTexts.push(\n ...item.keywords.map((keyword: string) => keyword.toLowerCase()),\n );\n }\n\n // Check if ALL search words match at least one of the searchable texts\n return searchWords.every((searchWord) =>\n searchableTexts.some((text) => text.includes(searchWord)),\n );\n },\n [shouldFilter],\n );\n\n // Collection filter for React Stately\n const collectionFilter = useCallback(\n (nodes: Iterable<any>): Iterable<any> => {\n const term = searchValue.trim();\n\n // If no search term, return all nodes\n if (!term) {\n return nodes;\n }\n\n // Split search term into words for multi-word filtering\n const searchWords = term\n .toLowerCase()\n .split(/\\s+/)\n .filter((word) => word.length > 0);\n\n // If no valid search words, return all nodes\n if (searchWords.length === 0) {\n return nodes;\n }\n\n // Recursive helper to filter sections and items\n const filterNodes = (iter: Iterable<any>): any[] => {\n const result: any[] = [];\n\n for (const node of iter) {\n if (node.type === 'section') {\n const filteredChildren = filterNodes(node.childNodes);\n\n if (filteredChildren.length) {\n result.push({\n ...node,\n childNodes: filteredChildren,\n });\n }\n } else {\n const text = node.textValue ?? String(node.rendered ?? '');\n\n if (enhancedFilter(text, term, node.props)) {\n result.push(node);\n }\n }\n }\n\n return result;\n };\n\n return filterNodes(nodes);\n },\n [searchValue, enhancedFilter],\n );\n\n // Create tree state with filter for both keyboard navigation and rendering\n const treeStateProps = {\n ...completeProps,\n filter: collectionFilter,\n shouldUseVirtualFocus: true, // Always use virtual focus for CommandMenu\n };\n\n const treeState = useTreeState(treeStateProps);\n\n const collectionItems = [...treeState.collection];\n const hasSections = collectionItems.some((item) => item.type === 'section');\n\n // Track focused key for aria-activedescendant\n const [focusedKey, setFocusedKey] = React.useState<React.Key \| null>(null);\n const focusedKeyRef = useRef<React.Key \| null>(null);\n\n // Apply filtering to collection items for rendering and empty state checks\n const filteredCollectionItems = useMemo(() => {\n const term = searchValue.trim();\n if (!term) {\n return collectionItems;\n }\n\n // Split search term into words for multi-word filtering\n const searchWords = term\n .toLowerCase()\n .split(/\\s+/)\n .filter((word) => word.length > 0);\n\n // If no valid search words, return all items\n if (searchWords.length === 0) {\n return collectionItems;\n }\n\n const filterNodes = (items: any[]): any[] => {\n const result: any[] = [];\n\n [...items].forEach((item) => {\n if (item.type === 'section') {\n const filteredChildren = filterNodes(item.childNodes);\n if (filteredChildren.length) {\n result.push({\n ...item,\n childNodes: filteredChildren,\n });\n }\n } else {\n const text = item.textValue ?? String(item.rendered ?? '');\n if (enhancedFilter(text, term, item.props)) {\n result.push(item);\n }\n }\n });\n\n return result;\n };\n\n return filterNodes(collectionItems);\n }, [collectionItems, searchValue, enhancedFilter]);\n\n const hasFilteredItems = filteredCollectionItems.length > 0;\n const viewHasSections = filteredCollectionItems.some(\n (item) => item.type === 'section',\n );\n\n // Helper function to find the first selectable item from filtered results\n const findFirstSelectableItem = useCallback(() => {\n const { selectionManager } = treeState;\n\n const visit = (items: any[]): Key \| null => {\n for (const node of items) {\n if (node?.type === 'section') {\n const childResult = visit(Array.from(node.childNodes ?? []));\n if (childResult != null) return childResult;\n } else if (\n node?.type === 'item' &&\n !selectionManager.isDisabled(node.key)\n ) {\n return node.key;\n }\n }\n return null;\n };\n\n return visit(filteredCollectionItems);\n }, [filteredCollectionItems, treeState.selectionManager]);\n\n // Create a ref for the menu container\n const menuRef = useRef<HTMLUListElement>(null);\n\n // Use menu hook for accessibility\n const { menuProps } = useMenu(\n {\n ...completeProps,\n 'aria-label': 'Command palette menu',\n filter: collectionFilter,\n shouldUseVirtualFocus: true,\n },\n treeState,\n menuRef,\n );\n\n // Manual rendering of menu items (similar to Menu component)\n const renderedItems = useMemo(() => {\n const items: React.ReactNode[] = [];\n let isFirstSection = true;\n\n filteredCollectionItems.forEach((item) => {\n if (item.type === 'section') {\n if (!isFirstSection) {\n items.push(\n <StyledDivider\n key={`divider-${String(item.key)}`}\n role=\"separator\"\n aria-orientation=\"horizontal\"\n />,\n );\n }\n\n items.push(\n <MenuSection\n key={item.key}\n item={item}\n state={treeState}\n styles={completeProps.sectionStyles}\n itemStyles={completeProps.itemStyles}\n headingStyles={completeProps.sectionHeadingStyles}\n size={size}\n />,\n );\n\n isFirstSection = false;\n return;\n }\n\n let menuItem = (\n <MenuItem\n key={item.key}\n item={item}\n state={treeState}\n styles={completeProps.itemStyles}\n size={size}\n onAction={item.onAction}\n />\n );\n\n // Apply tooltip wrapper if tooltip property is provided\n if (item.props.tooltip) {\n const tooltipProps =\n typeof item.props.tooltip === 'string'\n ? { title: item.props.tooltip }\n : item.props.tooltip;\n\n menuItem = (\n <TooltipProvider\n key={item.key}\n activeWrap\n placement=\"right\"\n {...tooltipProps}\n >\n {menuItem}\n </TooltipProvider>\n );\n }\n\n // Apply custom wrapper if provided\n if (item.props.wrapper) {\n menuItem = item.props.wrapper(menuItem);\n }\n\n // Ensure every child has a stable key, even if the wrapper component didn't set one.\n items.push(React.cloneElement(menuItem, { key: item.key }));\n });\n\n return items;\n }, [\n filteredCollectionItems,\n treeState,\n completeProps.sectionStyles,\n completeProps.itemStyles,\n\n completeProps.sectionHeadingStyles,\n ]);\n\n // Auto-focus search input\n React.useEffect(() => {\n if (autoFocus && searchInputRef.current) {\n // Use a small timeout to ensure the element is visible and focusable\n // This is especially important when the CommandMenu is opened in a popover\n const timeoutId = setTimeout(() => {\n if (searchInputRef.current) {\n searchInputRef.current.focus();\n }\n }, 0);\n\n return () => clearTimeout(timeoutId);\n }\n }, [autoFocus]);\n\n // Also focus when the component becomes visible (for trigger/popover usage)\n React.useEffect(() => {\n // Check if autoFocus is enabled and we're in a trigger context\n if (autoFocus && contextProps.autoFocus && searchInputRef.current) {\n // Use a small timeout to ensure the popover is fully rendered\n const timeoutId = setTimeout(() => {\n if (searchInputRef.current) {\n searchInputRef.current.focus();\n }\n }, 50); // Slightly longer timeout for popover context\n\n return () => clearTimeout(timeoutId);\n }\n }, [autoFocus, contextProps.autoFocus]);\n\n // Track the previous search value to only run auto-focus when search actually changes\n const prevSearchValueRef = useRef<string>('');\n\n // Auto-focus first item when search value changes (but not on initial render)\n React.useEffect(() => {\n const currentSearchValue = searchValue.trim();\n const prevSearchValue = prevSearchValueRef.current;\n\n // Only auto-focus when search value actually changes\n if (currentSearchValue !== prevSearchValue && currentSearchValue !== '') {\n const firstSelectableKey = findFirstSelectableItem();\n\n if (firstSelectableKey && hasFilteredItems) {\n // Focus the first item in the selection manager\n treeState.selectionManager.setFocusedKey(firstSelectableKey);\n setFocusedKey(firstSelectableKey);\n focusedKeyRef.current = firstSelectableKey;\n } else {\n // Clear focus if no items are available\n treeState.selectionManager.setFocusedKey(null);\n setFocusedKey(null);\n focusedKeyRef.current = null;\n }\n }\n\n // Update the previous search value\n prevSearchValueRef.current = currentSearchValue;\n }, [searchValue, findFirstSelectableItem, hasFilteredItems]);\n\n // Extract styles\n const extractedStyles = useMemo(\n () => extractStyles(props, CONTAINER_STYLES),\n [props],\n );\n\n // Determine if we should show empty state based on actual filtered collection\n const hasSearchTerm = searchValue.trim().length > 0;\n const showEmptyState = hasSearchTerm && !hasFilteredItems && !isLoading;\n\n // Sync refs\n useSyncRef(contextProps, menuRef);\n\n const mods = useMemo(() => {\n // Determine mods based on menu context\n let popoverMod = completeProps.mods?.popover;\n let trayMod = completeProps.mods?.tray;\n\n return {\n sections: viewHasSections,\n footer: !!footer,\n header: !!header,\n popover: popoverMod,\n tray: trayMod,\n };\n }, [viewHasSections, footer, header, completeProps.mods]);\n\n return (\n <StyledCommandMenu\n {...(filterBaseProps(props) as Record<string, unknown>)}\n ref={domRef}\n qa={qa \|\| 'CommandMenu'}\n data-size={size}\n mods={mods}\n styles={mergeProps(extractedStyles, styles)}\n >\n {/ Header /}\n {header && (\n <StyledHeader\n role=\"presentation\"\n data-size={size}\n styles={{ border: 'none', ...headerStyles }}\n >\n {header}\n </StyledHeader>\n )}\n\n {/ Search Input /}\n <StyledSearchInput\n ref={searchInputRef}\n type=\"search\"\n placeholder={searchPlaceholder}\n value={searchValue}\n styles={searchInputStyles}\n data-size={size}\n aria-controls={`${qa \|\| 'CommandMenu'}-menu`}\n role=\"combobox\"\n aria-expanded=\"true\"\n aria-haspopup=\"listbox\"\n aria-activedescendant={\n focusedKey != null\n ? `${qa \|\| 'CommandMenu'}-menu-option-${focusedKey}`\n : undefined\n }\n onChange={(e) => handleSearchChange(e.target.value)}\n onKeyDown={(e) => {\n if (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp') {\n e.preventDefault();\n\n const isArrowDown = e.key === 'ArrowDown';\n const { selectionManager } = treeState;\n // Use the ref to get the current focused key synchronously\n const currentKey =\n focusedKeyRef.current \|\| selectionManager.focusedKey;\n\n // Helper function to get all visible item keys accounting for sections\n const getVisibleItemKeys = (): Key[] => {\n const keys: Key[] = [];\n\n const visit = (items: any[]) => {\n for (const node of items) {\n if (node?.type === 'section') {\n visit(Array.from(node.childNodes ?? []));\n } else if (node?.type === 'item') {\n keys.push(node.key);\n }\n }\n };\n\n visit(filteredCollectionItems);\n return keys;\n };\n\n // Helper function to find next selectable key in a direction\n const findNextSelectableKey = (\n currentIndex: number,\n direction: 'forward' \| 'backward',\n visibleKeys: Key[],\n ) => {\n const increment = direction === 'forward' ? 1 : -1;\n\n for (\n let i = currentIndex + increment;\n i >= 0 && i < visibleKeys.length;\n i += increment\n ) {\n const key = visibleKeys[i];\n if (!selectionManager.isDisabled(key)) {\n return key;\n }\n }\n\n return null;\n };\n\n // Helper function to find first or last selectable key\n const findFirstLastSelectableKey = (\n direction: 'forward' \| 'backward',\n visibleKeys: Key[],\n ) => {\n const keysToCheck =\n direction === 'forward'\n ? visibleKeys\n : [...visibleKeys].reverse();\n\n for (const key of keysToCheck) {\n if (!selectionManager.isDisabled(key)) {\n return key;\n }\n }\n\n return null;\n };\n\n const visibleKeys = getVisibleItemKeys();\n\n if (visibleKeys.length === 0) {\n return; // No visible items to navigate\n }\n\n let nextKey;\n const direction = isArrowDown ? 'forward' : 'backward';\n\n if (currentKey == null) {\n // No current focus, start from the first/last item\n nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n } else {\n // Find current position in visible keys\n const currentIndex = visibleKeys.indexOf(currentKey);\n\n if (currentIndex === -1) {\n // Current key not in visible items, start from beginning/end\n nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n } else {\n // Find next selectable item from current position\n nextKey = findNextSelectableKey(\n currentIndex,\n direction,\n visibleKeys,\n );\n\n // If no next key found, wrap to first/last selectable item\n if (nextKey == null) {\n nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n }\n }\n }\n\n if (nextKey != null) {\n selectionManager.setFocusedKey(nextKey);\n setFocusedKey(nextKey);\n focusedKeyRef.current = nextKey; // Update ref immediately\n }\n } else if (\n e.key === 'Enter' \|\|\n (e.key === ' ' && !searchValue.trim())\n ) {\n const currentFocusedKey =\n focusedKey \|\| treeState.selectionManager.focusedKey;\n if (currentFocusedKey != null) {\n e.preventDefault();\n\n // Trigger action for the focused item (like Menu does)\n // First check if there's a selection mode, if so, handle selection\n if (treeState.selectionManager.selectionMode !== 'none') {\n treeState.selectionManager.select(currentFocusedKey, e);\n } else {\n // Default behavior: trigger action\n const node = treeState.collection.getItem(currentFocusedKey);\n if (node) {\n // Call the tree state's action handler\n const onAction = (completeProps as any).onAction;\n if (onAction) {\n onAction(currentFocusedKey);\n }\n // Also call the item's individual onAction if it exists\n if (node.props?.onAction) {\n node.props.onAction(currentFocusedKey);\n }\n }\n }\n\n // Close the menu if we're in a trigger context and closeOnSelect is enabled (default behavior)\n const { onClose, closeOnSelect } = contextProps;\n if (onClose && closeOnSelect !== false) {\n onClose();\n }\n }\n } else if (e.key === 'Escape') {\n if (searchValue) {\n e.preventDefault();\n handleSearchChange('');\n }\n }\n }}\n />\n\n {/ Loading State /}\n {isLoading && (\n <StyledLoadingWrapper>\n <LoadingIcon\n role=\"progressbar\"\n aria-label=\"Loading commands\"\n aria-hidden={false}\n />\n </StyledLoadingWrapper>\n )}\n\n {/ Menu Content - always render unless loading /}\n {!isLoading && !showEmptyState && (\n <StyledMenu\n {...menuProps}\n ref={menuRef}\n id={`${qa \|\| 'CommandMenu'}-menu`}\n aria-label=\"Command menu\"\n qa=\"Menu\"\n data-size={size}\n mods={mods}\n styles={{\n border: 'none',\n boxShadow: 'none',\n radius: 0,\n padding: '0.5x',\n }}\n >\n {renderedItems}\n </StyledMenu>\n )}\n\n {/ Empty State - show when search term exists but no results /}\n {!isLoading && showEmptyState && (\n <StyledEmptyState>{emptyLabel}</StyledEmptyState>\n )}\n\n {/ Footer */}\n {footer && (\n <StyledFooter\n role=\"presentation\"\n data-size={size}\n styles={footerStyles}\n >\n {footer}\n </StyledFooter>\n )}\n </StyledCommandMenu>\n );\n}\n\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\nconst _CommandMenu = React.forwardRef(CommandMenu) as <T>(\n props: CubeCommandMenuProps<T> & React.RefAttributes<HTMLDivElement>,\n) => ReactElement;\n\n// Attach Trigger alias from MenuTrigger for consistent API\n// Also attach Item and Section for compound component pattern\nconst __CommandMenu = Object.assign(_CommandMenu, {\n Trigger: MenuTrigger,\n Item,\n Section,\n displayName: 'CommandMenu',\n});\n\nexport { __CommandMenu as CommandMenu };\n"],"mappings":"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"}
1	+ {"version":3,"file":"CommandMenu.js","names":["mergeProps","MenuTrigger"],"sources":["../../../../src/components/actions/CommandMenu/CommandMenu.tsx"],"sourcesContent":["import { useObjectRef, useSyncRef } from '@react-aria/utils';\nimport { FocusStrategy } from '@react-types/shared';\nimport {\n BaseProps,\n CONTAINER_STYLES,\n ContainerStyleProps,\n filterBaseProps,\n Styles,\n} from '@tenphi/tasty';\nimport React, {\n Key,\n ReactElement,\n ReactNode,\n Ref,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useFilter, useMenu } from 'react-aria';\nimport { Section, useTreeState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { LoadingIcon } from '../../../icons/LoadingIcon';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\n// `CollectionItem` (not react-stately's bare `Item`) is what CommandMenu\n// actually renders through `MenuItem`, so it carries the `Item` props.\nimport { CollectionItem as Item } from '../../CollectionItem';\nimport { TooltipProvider } from '../../overlays/Tooltip/TooltipProvider';\nimport { useMenuContext } from '../Menu';\nimport { CubeMenuProps } from '../Menu/Menu';\nimport { MenuItem } from '../Menu/MenuItem';\nimport { MenuSection } from '../Menu/MenuSection';\nimport { MenuTrigger } from '../Menu/MenuTrigger';\nimport {\n StyledDivider,\n StyledFooter,\n StyledHeader,\n StyledMenu,\n} from '../Menu/styled';\n\nimport {\n StyledCommandMenu,\n StyledEmptyState,\n StyledLoadingWrapper,\n StyledSearchInput,\n} from './styled';\n\nexport interface CommandMenuItem {\n // Standard item props\n id: string;\n textValue: string;\n\n // Enhanced search features\n keywords?: string[];\n forceMount?: boolean;\n\n // Standard Menu item props inherited\n [key: string]: any;\n}\n\nexport interface CubeCommandMenuProps<T>\n extends BaseProps,\n ContainerStyleProps,\n Omit<\n CubeMenuProps<T>,\n 'selectedKeys' \| 'defaultSelectedKeys' \| 'onSelectionChange'\n > {\n // Search-specific props\n searchPlaceholder?: string;\n searchValue?: string;\n onSearchChange?: (value: string) => void;\n filter?: (textValue: string, inputValue: string) => boolean;\n emptyLabel?: ReactNode;\n searchInputStyles?: Styles;\n headerStyles?: Styles;\n footerStyles?: Styles;\n\n // Advanced search features\n isLoading?: boolean;\n shouldFilter?: boolean;\n\n // Focus management - override the autoFocus from CubeMenuProps to allow boolean \| FocusStrategy\n autoFocus?: boolean \| FocusStrategy;\n\n // Size prop\n size?: 'medium' \| 'large' \| (string & {});\n\n /** Currently selected keys (controlled) /\n selectedKeys?: string[];\n /* Initially selected keys (uncontrolled) /\n defaultSelectedKeys?: string[];\n /* Handler for selection changes /\n onSelectionChange?: (keys: string[]) => void;\n}\n\nfunction CommandMenu<T extends object>(\n props: CubeCommandMenuProps<T>,\n ref: Ref<HTMLDivElement>,\n) {\n const { t } = useI18n();\n\n const {\n searchPlaceholder = t(\n 'commandMenu.searchPlaceholder',\n 'Search commands...',\n ),\n searchValue: controlledSearchValue,\n onSearchChange,\n filter: customFilter,\n emptyLabel = t('commandMenu.empty', 'No commands found'),\n searchInputStyles,\n headerStyles,\n footerStyles,\n isLoading = false,\n shouldFilter = true,\n autoFocus = true,\n size = 'medium',\n qa,\n styles,\n selectedKeys,\n defaultSelectedKeys,\n onSelectionChange,\n header,\n footer,\n ...restMenuProps\n } = props;\n\n const domRef = useObjectRef(ref);\n const searchInputRef = useRef<HTMLInputElement>(null);\n const contextProps = useMenuContext();\n\n // Convert string[] to Set<Key> for React Aria compatibility\n const ariaSelectedKeys = selectedKeys ? new Set(selectedKeys) : undefined;\n const ariaDefaultSelectedKeys = defaultSelectedKeys\n ? new Set(defaultSelectedKeys)\n : undefined;\n\n const handleSelectionChange = onSelectionChange\n ? (keys: 'all' \| Set<Key>) => {\n if (keys === 'all') {\n // Handle 'all' selection case - collect all available keys\n const allKeys = Array.from(treeState.collection.getKeys()).map(\n (key: any) => String(key),\n );\n onSelectionChange(allKeys);\n } else if (keys instanceof Set) {\n onSelectionChange(Array.from(keys).map((key) => String(key)));\n } else {\n onSelectionChange([]);\n }\n }\n : undefined;\n\n const completeProps = mergeProps(contextProps, restMenuProps, {\n selectedKeys: ariaSelectedKeys,\n defaultSelectedKeys: ariaDefaultSelectedKeys,\n onSelectionChange: handleSelectionChange,\n });\n\n // Search state management\n const [internalSearchValue, setInternalSearchValue] = useState('');\n const searchValue = controlledSearchValue ?? internalSearchValue;\n\n const handleSearchChange = useCallback(\n (value: string) => {\n if (controlledSearchValue === undefined) {\n setInternalSearchValue(value);\n }\n onSearchChange?.(value);\n },\n [controlledSearchValue, onSearchChange],\n );\n\n // Filter setup\n const { contains } = useFilter({ sensitivity: 'base' });\n const textFilterFn = useMemo(\n () => customFilter \|\| contains,\n [customFilter, contains],\n );\n\n // Enhanced filter function that supports keywords and forceMount\n const enhancedFilter = useCallback(\n (textValue: string, inputValue: string, item?: any) => {\n // Always show force-mounted items\n if (item?.forceMount) {\n return true;\n }\n\n // If shouldFilter is false, show all items\n if (!shouldFilter) {\n return true;\n }\n\n // Split input value into individual words and filter out empty strings\n const searchWords = inputValue\n .trim()\n .toLowerCase()\n .split(/\\s+/)\n .filter((word) => word.length > 0);\n\n // If no search words, show all items\n if (searchWords.length === 0) {\n return true;\n }\n\n // Collect all searchable text for this item\n const searchableTexts: string[] = [];\n\n // Add main text value\n searchableTexts.push(textValue.toLowerCase());\n\n // Add keywords if available\n if (item?.keywords && Array.isArray(item.keywords)) {\n searchableTexts.push(\n ...item.keywords.map((keyword: string) => keyword.toLowerCase()),\n );\n }\n\n // Check if ALL search words match at least one of the searchable texts\n return searchWords.every((searchWord) =>\n searchableTexts.some((text) => text.includes(searchWord)),\n );\n },\n [shouldFilter],\n );\n\n // Collection filter for React Stately\n const collectionFilter = useCallback(\n (nodes: Iterable<any>): Iterable<any> => {\n const term = searchValue.trim();\n\n // If no search term, return all nodes\n if (!term) {\n return nodes;\n }\n\n // Split search term into words for multi-word filtering\n const searchWords = term\n .toLowerCase()\n .split(/\\s+/)\n .filter((word) => word.length > 0);\n\n // If no valid search words, return all nodes\n if (searchWords.length === 0) {\n return nodes;\n }\n\n // Recursive helper to filter sections and items\n const filterNodes = (iter: Iterable<any>): any[] => {\n const result: any[] = [];\n\n for (const node of iter) {\n if (node.type === 'section') {\n const filteredChildren = filterNodes(node.childNodes);\n\n if (filteredChildren.length) {\n result.push({\n ...node,\n childNodes: filteredChildren,\n });\n }\n } else {\n const text = node.textValue ?? String(node.rendered ?? '');\n\n if (enhancedFilter(text, term, node.props)) {\n result.push(node);\n }\n }\n }\n\n return result;\n };\n\n return filterNodes(nodes);\n },\n [searchValue, enhancedFilter],\n );\n\n // Create tree state with filter for both keyboard navigation and rendering\n const treeStateProps = {\n ...completeProps,\n filter: collectionFilter,\n shouldUseVirtualFocus: true, // Always use virtual focus for CommandMenu\n };\n\n const treeState = useTreeState(treeStateProps);\n\n const collectionItems = [...treeState.collection];\n const hasSections = collectionItems.some((item) => item.type === 'section');\n\n // Track focused key for aria-activedescendant\n const [focusedKey, setFocusedKey] = React.useState<React.Key \| null>(null);\n const focusedKeyRef = useRef<React.Key \| null>(null);\n\n // Apply filtering to collection items for rendering and empty state checks\n const filteredCollectionItems = useMemo(() => {\n const term = searchValue.trim();\n if (!term) {\n return collectionItems;\n }\n\n // Split search term into words for multi-word filtering\n const searchWords = term\n .toLowerCase()\n .split(/\\s+/)\n .filter((word) => word.length > 0);\n\n // If no valid search words, return all items\n if (searchWords.length === 0) {\n return collectionItems;\n }\n\n const filterNodes = (items: any[]): any[] => {\n const result: any[] = [];\n\n [...items].forEach((item) => {\n if (item.type === 'section') {\n const filteredChildren = filterNodes(item.childNodes);\n if (filteredChildren.length) {\n result.push({\n ...item,\n childNodes: filteredChildren,\n });\n }\n } else {\n const text = item.textValue ?? String(item.rendered ?? '');\n if (enhancedFilter(text, term, item.props)) {\n result.push(item);\n }\n }\n });\n\n return result;\n };\n\n return filterNodes(collectionItems);\n }, [collectionItems, searchValue, enhancedFilter]);\n\n const hasFilteredItems = filteredCollectionItems.length > 0;\n const viewHasSections = filteredCollectionItems.some(\n (item) => item.type === 'section',\n );\n\n // Helper function to find the first selectable item from filtered results\n const findFirstSelectableItem = useCallback(() => {\n const { selectionManager } = treeState;\n\n const visit = (items: any[]): Key \| null => {\n for (const node of items) {\n if (node?.type === 'section') {\n const childResult = visit(Array.from(node.childNodes ?? []));\n if (childResult != null) return childResult;\n } else if (\n node?.type === 'item' &&\n !selectionManager.isDisabled(node.key)\n ) {\n return node.key;\n }\n }\n return null;\n };\n\n return visit(filteredCollectionItems);\n }, [filteredCollectionItems, treeState.selectionManager]);\n\n // Create a ref for the menu container\n const menuRef = useRef<HTMLUListElement>(null);\n\n // Use menu hook for accessibility\n const { menuProps } = useMenu(\n {\n ...completeProps,\n 'aria-label': 'Command palette menu',\n filter: collectionFilter,\n shouldUseVirtualFocus: true,\n },\n treeState,\n menuRef,\n );\n\n // Manual rendering of menu items (similar to Menu component)\n const renderedItems = useMemo(() => {\n const items: React.ReactNode[] = [];\n let isFirstSection = true;\n\n filteredCollectionItems.forEach((item) => {\n if (item.type === 'section') {\n if (!isFirstSection) {\n items.push(\n <StyledDivider\n key={`divider-${String(item.key)}`}\n role=\"separator\"\n aria-orientation=\"horizontal\"\n />,\n );\n }\n\n items.push(\n <MenuSection\n key={item.key}\n item={item}\n state={treeState}\n styles={completeProps.sectionStyles}\n itemStyles={completeProps.itemStyles}\n headingStyles={completeProps.sectionHeadingStyles}\n size={size}\n />,\n );\n\n isFirstSection = false;\n return;\n }\n\n let menuItem = (\n <MenuItem\n key={item.key}\n item={item}\n state={treeState}\n styles={completeProps.itemStyles}\n size={size}\n onAction={item.onAction}\n />\n );\n\n // Apply tooltip wrapper if tooltip property is provided\n if (item.props.tooltip) {\n const tooltipProps =\n typeof item.props.tooltip === 'string'\n ? { title: item.props.tooltip }\n : item.props.tooltip;\n\n menuItem = (\n <TooltipProvider\n key={item.key}\n activeWrap\n placement=\"right\"\n {...tooltipProps}\n >\n {menuItem}\n </TooltipProvider>\n );\n }\n\n // Apply custom wrapper if provided\n if (item.props.wrapper) {\n menuItem = item.props.wrapper(menuItem);\n }\n\n // Ensure every child has a stable key, even if the wrapper component didn't set one.\n items.push(React.cloneElement(menuItem, { key: item.key }));\n });\n\n return items;\n }, [\n filteredCollectionItems,\n treeState,\n completeProps.sectionStyles,\n completeProps.itemStyles,\n\n completeProps.sectionHeadingStyles,\n ]);\n\n // Auto-focus search input\n React.useEffect(() => {\n if (autoFocus && searchInputRef.current) {\n // Use a small timeout to ensure the element is visible and focusable\n // This is especially important when the CommandMenu is opened in a popover\n const timeoutId = setTimeout(() => {\n if (searchInputRef.current) {\n searchInputRef.current.focus();\n }\n }, 0);\n\n return () => clearTimeout(timeoutId);\n }\n }, [autoFocus]);\n\n // Also focus when the component becomes visible (for trigger/popover usage)\n React.useEffect(() => {\n // Check if autoFocus is enabled and we're in a trigger context\n if (autoFocus && contextProps.autoFocus && searchInputRef.current) {\n // Use a small timeout to ensure the popover is fully rendered\n const timeoutId = setTimeout(() => {\n if (searchInputRef.current) {\n searchInputRef.current.focus();\n }\n }, 50); // Slightly longer timeout for popover context\n\n return () => clearTimeout(timeoutId);\n }\n }, [autoFocus, contextProps.autoFocus]);\n\n // Track the previous search value to only run auto-focus when search actually changes\n const prevSearchValueRef = useRef<string>('');\n\n // Auto-focus first item when search value changes (but not on initial render)\n React.useEffect(() => {\n const currentSearchValue = searchValue.trim();\n const prevSearchValue = prevSearchValueRef.current;\n\n // Only auto-focus when search value actually changes\n if (currentSearchValue !== prevSearchValue && currentSearchValue !== '') {\n const firstSelectableKey = findFirstSelectableItem();\n\n if (firstSelectableKey && hasFilteredItems) {\n // Focus the first item in the selection manager\n treeState.selectionManager.setFocusedKey(firstSelectableKey);\n setFocusedKey(firstSelectableKey);\n focusedKeyRef.current = firstSelectableKey;\n } else {\n // Clear focus if no items are available\n treeState.selectionManager.setFocusedKey(null);\n setFocusedKey(null);\n focusedKeyRef.current = null;\n }\n }\n\n // Update the previous search value\n prevSearchValueRef.current = currentSearchValue;\n }, [searchValue, findFirstSelectableItem, hasFilteredItems]);\n\n // Extract styles\n const extractedStyles = useMemo(\n () => extractStyles(props, CONTAINER_STYLES),\n [props],\n );\n\n // Determine if we should show empty state based on actual filtered collection\n const hasSearchTerm = searchValue.trim().length > 0;\n const showEmptyState = hasSearchTerm && !hasFilteredItems && !isLoading;\n\n // Sync refs\n useSyncRef(contextProps, menuRef);\n\n const mods = useMemo(() => {\n // Determine mods based on menu context\n let popoverMod = completeProps.mods?.popover;\n let trayMod = completeProps.mods?.tray;\n\n return {\n sections: viewHasSections,\n footer: !!footer,\n header: !!header,\n popover: popoverMod,\n tray: trayMod,\n };\n }, [viewHasSections, footer, header, completeProps.mods]);\n\n return (\n <StyledCommandMenu\n {...(filterBaseProps(props) as Record<string, unknown>)}\n ref={domRef}\n qa={qa \|\| 'CommandMenu'}\n data-size={size}\n mods={mods}\n styles={mergeProps(extractedStyles, styles)}\n >\n {/ Header /}\n {header && (\n <StyledHeader\n role=\"presentation\"\n data-size={size}\n styles={{ border: 'none', ...headerStyles }}\n >\n {header}\n </StyledHeader>\n )}\n\n {/ Search Input /}\n <StyledSearchInput\n ref={searchInputRef}\n type=\"search\"\n placeholder={searchPlaceholder}\n value={searchValue}\n styles={searchInputStyles}\n data-size={size}\n aria-controls={`${qa \|\| 'CommandMenu'}-menu`}\n role=\"combobox\"\n aria-expanded=\"true\"\n aria-haspopup=\"listbox\"\n aria-activedescendant={\n focusedKey != null\n ? `${qa \|\| 'CommandMenu'}-menu-option-${focusedKey}`\n : undefined\n }\n onChange={(e) => handleSearchChange(e.target.value)}\n onKeyDown={(e) => {\n if (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp') {\n e.preventDefault();\n\n const isArrowDown = e.key === 'ArrowDown';\n const { selectionManager } = treeState;\n // Use the ref to get the current focused key synchronously\n const currentKey =\n focusedKeyRef.current \|\| selectionManager.focusedKey;\n\n // Helper function to get all visible item keys accounting for sections\n const getVisibleItemKeys = (): Key[] => {\n const keys: Key[] = [];\n\n const visit = (items: any[]) => {\n for (const node of items) {\n if (node?.type === 'section') {\n visit(Array.from(node.childNodes ?? []));\n } else if (node?.type === 'item') {\n keys.push(node.key);\n }\n }\n };\n\n visit(filteredCollectionItems);\n return keys;\n };\n\n // Helper function to find next selectable key in a direction\n const findNextSelectableKey = (\n currentIndex: number,\n direction: 'forward' \| 'backward',\n visibleKeys: Key[],\n ) => {\n const increment = direction === 'forward' ? 1 : -1;\n\n for (\n let i = currentIndex + increment;\n i >= 0 && i < visibleKeys.length;\n i += increment\n ) {\n const key = visibleKeys[i];\n if (!selectionManager.isDisabled(key)) {\n return key;\n }\n }\n\n return null;\n };\n\n // Helper function to find first or last selectable key\n const findFirstLastSelectableKey = (\n direction: 'forward' \| 'backward',\n visibleKeys: Key[],\n ) => {\n const keysToCheck =\n direction === 'forward'\n ? visibleKeys\n : [...visibleKeys].reverse();\n\n for (const key of keysToCheck) {\n if (!selectionManager.isDisabled(key)) {\n return key;\n }\n }\n\n return null;\n };\n\n const visibleKeys = getVisibleItemKeys();\n\n if (visibleKeys.length === 0) {\n return; // No visible items to navigate\n }\n\n let nextKey;\n const direction = isArrowDown ? 'forward' : 'backward';\n\n if (currentKey == null) {\n // No current focus, start from the first/last item\n nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n } else {\n // Find current position in visible keys\n const currentIndex = visibleKeys.indexOf(currentKey);\n\n if (currentIndex === -1) {\n // Current key not in visible items, start from beginning/end\n nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n } else {\n // Find next selectable item from current position\n nextKey = findNextSelectableKey(\n currentIndex,\n direction,\n visibleKeys,\n );\n\n // If no next key found, wrap to first/last selectable item\n if (nextKey == null) {\n nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n }\n }\n }\n\n if (nextKey != null) {\n selectionManager.setFocusedKey(nextKey);\n setFocusedKey(nextKey);\n focusedKeyRef.current = nextKey; // Update ref immediately\n }\n } else if (\n e.key === 'Enter' \|\|\n (e.key === ' ' && !searchValue.trim())\n ) {\n const currentFocusedKey =\n focusedKey \|\| treeState.selectionManager.focusedKey;\n if (currentFocusedKey != null) {\n e.preventDefault();\n\n // Trigger action for the focused item (like Menu does)\n // First check if there's a selection mode, if so, handle selection\n if (treeState.selectionManager.selectionMode !== 'none') {\n treeState.selectionManager.select(currentFocusedKey, e);\n } else {\n // Default behavior: trigger action\n const node = treeState.collection.getItem(currentFocusedKey);\n if (node) {\n // Call the tree state's action handler\n const onAction = (completeProps as any).onAction;\n if (onAction) {\n onAction(currentFocusedKey);\n }\n // Also call the item's individual onAction if it exists\n if (node.props?.onAction) {\n node.props.onAction(currentFocusedKey);\n }\n }\n }\n\n // Close the menu if we're in a trigger context and closeOnSelect is enabled (default behavior)\n const { onClose, closeOnSelect } = contextProps;\n if (onClose && closeOnSelect !== false) {\n onClose();\n }\n }\n } else if (e.key === 'Escape') {\n if (searchValue) {\n e.preventDefault();\n handleSearchChange('');\n }\n }\n }}\n />\n\n {/ Loading State /}\n {isLoading && (\n <StyledLoadingWrapper>\n <LoadingIcon\n role=\"progressbar\"\n aria-label=\"Loading commands\"\n aria-hidden={false}\n />\n </StyledLoadingWrapper>\n )}\n\n {/ Menu Content - always render unless loading /}\n {!isLoading && !showEmptyState && (\n <StyledMenu\n {...menuProps}\n ref={menuRef}\n id={`${qa \|\| 'CommandMenu'}-menu`}\n aria-label=\"Command menu\"\n qa=\"Menu\"\n data-size={size}\n mods={mods}\n styles={{\n border: 'none',\n boxShadow: 'none',\n radius: 0,\n padding: '0.5x',\n }}\n >\n {renderedItems}\n </StyledMenu>\n )}\n\n {/ Empty State - show when search term exists but no results /}\n {!isLoading && showEmptyState && (\n <StyledEmptyState>{emptyLabel}</StyledEmptyState>\n )}\n\n {/ Footer */}\n {footer && (\n <StyledFooter\n role=\"presentation\"\n data-size={size}\n styles={footerStyles}\n >\n {footer}\n </StyledFooter>\n )}\n </StyledCommandMenu>\n );\n}\n\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\nconst _CommandMenu = React.forwardRef(CommandMenu) as <T>(\n props: CubeCommandMenuProps<T> & React.RefAttributes<HTMLDivElement>,\n) => ReactElement;\n\n// Attach Trigger alias from MenuTrigger for consistent API\n// Also attach Item and Section for compound component pattern\nconst __CommandMenu = Object.assign(_CommandMenu, {\n Trigger: MenuTrigger,\n Item,\n Section,\n displayName: 'CommandMenu',\n});\n\nexport { __CommandMenu as CommandMenu };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAiGA,SAAS,YACP,OACA,KACA;CACA,MAAM,EAAE,MAAM,SAAS;CAEvB,MAAM,EACJ,oBAAoB,EAClB,iCACA,qBACD,EACD,aAAa,uBACb,gBACA,QAAQ,cACR,aAAa,EAAE,qBAAqB,oBAAoB,EACxD,mBACA,cACA,cACA,YAAY,OACZ,eAAe,MACf,YAAY,MACZ,OAAO,UACP,IACA,QACA,cACA,qBACA,mBACA,QACA,QACA,GAAG,kBACD;CAEJ,MAAM,SAAS,aAAa,IAAI;CAChC,MAAM,iBAAiB,OAAyB,KAAK;CACrD,MAAM,eAAe,gBAAgB;CAwBrC,MAAM,gBAAgBA,aAAW,cAAc,eAAe;EAC5D,cAtBuB,eAAe,IAAI,IAAI,aAAa,GAAG;EAuB9D,qBAtB8B,sBAC5B,IAAI,IAAI,oBAAoB,GAC5B;EAqBF,mBAnB4B,qBACzB,SAA2B;AAC1B,OAAI,SAAS,MAKX,mBAHgB,MAAM,KAAK,UAAU,WAAW,SAAS,CAAC,CAAC,KACxD,QAAa,OAAO,IAAI,CAC1B,CACyB;YACjB,gBAAgB,IACzB,mBAAkB,MAAM,KAAK,KAAK,CAAC,KAAK,QAAQ,OAAO,IAAI,CAAC,CAAC;OAE7D,mBAAkB,EAAE,CAAC;MAGzB;EAMH,CAAC;CAGF,MAAM,CAAC,qBAAqB,0BAA0B,SAAS,GAAG;CAClE,MAAM,cAAc,yBAAyB;CAE7C,MAAM,qBAAqB,aACxB,UAAkB;AACjB,MAAI,0BAA0B,OAC5B,wBAAuB,MAAM;AAE/B,mBAAiB,MAAM;IAEzB,CAAC,uBAAuB,eAAe,CACxC;CAGD,MAAM,EAAE,aAAa,UAAU,EAAE,aAAa,QAAQ,CAAC;AAClC,eACb,gBAAgB,UACtB,CAAC,cAAc,SAAS,CACzB;CAGD,MAAM,iBAAiB,aACpB,WAAmB,YAAoB,SAAe;AAErD,MAAI,MAAM,WACR,QAAO;AAIT,MAAI,CAAC,aACH,QAAO;EAIT,MAAM,cAAc,WACjB,MAAM,CACN,aAAa,CACb,MAAM,MAAM,CACZ,QAAQ,SAAS,KAAK,SAAS,EAAE;AAGpC,MAAI,YAAY,WAAW,EACzB,QAAO;EAIT,MAAM,kBAA4B,EAAE;AAGpC,kBAAgB,KAAK,UAAU,aAAa,CAAC;AAG7C,MAAI,MAAM,YAAY,MAAM,QAAQ,KAAK,SAAS,CAChD,iBAAgB,KACd,GAAG,KAAK,SAAS,KAAK,YAAoB,QAAQ,aAAa,CAAC,CACjE;AAIH,SAAO,YAAY,OAAO,eACxB,gBAAgB,MAAM,SAAS,KAAK,SAAS,WAAW,CAAC,CAC1D;IAEH,CAAC,aAAa,CACf;CAGD,MAAM,mBAAmB,aACtB,UAAwC;EACvC,MAAM,OAAO,YAAY,MAAM;AAG/B,MAAI,CAAC,KACH,QAAO;AAUT,MANoB,KACjB,aAAa,CACb,MAAM,MAAM,CACZ,QAAQ,SAAS,KAAK,SAAS,EAAE,CAGpB,WAAW,EACzB,QAAO;EAIT,MAAM,eAAe,SAA+B;GAClD,MAAM,SAAgB,EAAE;AAExB,QAAK,MAAM,QAAQ,KACjB,KAAI,KAAK,SAAS,WAAW;IAC3B,MAAM,mBAAmB,YAAY,KAAK,WAAW;AAErD,QAAI,iBAAiB,OACnB,QAAO,KAAK;KACV,GAAG;KACH,YAAY;KACb,CAAC;cAKA,eAFS,KAAK,aAAa,OAAO,KAAK,YAAY,GAAG,EAEjC,MAAM,KAAK,MAAM,CACxC,QAAO,KAAK,KAAK;AAKvB,UAAO;;AAGT,SAAO,YAAY,MAAM;IAE3B,CAAC,aAAa,eAAe,CAC9B;CASD,MAAM,YAAY,aANK;EACrB,GAAG;EACH,QAAQ;EACR,uBAAuB;EACxB,CAE6C;CAE9C,MAAM,kBAAkB,CAAC,GAAG,UAAU,WAAW;AAC7B,iBAAgB,MAAM,SAAS,KAAK,SAAS,UAAU;CAG3E,MAAM,CAAC,YAAY,iBAAiB,MAAM,SAA2B,KAAK;CAC1E,MAAM,gBAAgB,OAAyB,KAAK;CAGpD,MAAM,0BAA0B,cAAc;EAC5C,MAAM,OAAO,YAAY,MAAM;AAC/B,MAAI,CAAC,KACH,QAAO;AAUT,MANoB,KACjB,aAAa,CACb,MAAM,MAAM,CACZ,QAAQ,SAAS,KAAK,SAAS,EAAE,CAGpB,WAAW,EACzB,QAAO;EAGT,MAAM,eAAe,UAAwB;GAC3C,MAAM,SAAgB,EAAE;AAExB,IAAC,GAAG,MAAM,CAAC,SAAS,SAAS;AAC3B,QAAI,KAAK,SAAS,WAAW;KAC3B,MAAM,mBAAmB,YAAY,KAAK,WAAW;AACrD,SAAI,iBAAiB,OACnB,QAAO,KAAK;MACV,GAAG;MACH,YAAY;MACb,CAAC;eAIA,eADS,KAAK,aAAa,OAAO,KAAK,YAAY,GAAG,EACjC,MAAM,KAAK,MAAM,CACxC,QAAO,KAAK,KAAK;KAGrB;AAEF,UAAO;;AAGT,SAAO,YAAY,gBAAgB;IAClC;EAAC;EAAiB;EAAa;EAAe,CAAC;CAElD,MAAM,mBAAmB,wBAAwB,SAAS;CAC1D,MAAM,kBAAkB,wBAAwB,MAC7C,SAAS,KAAK,SAAS,UACzB;CAGD,MAAM,0BAA0B,kBAAkB;EAChD,MAAM,EAAE,qBAAqB;EAE7B,MAAM,SAAS,UAA6B;AAC1C,QAAK,MAAM,QAAQ,MACjB,KAAI,MAAM,SAAS,WAAW;IAC5B,MAAM,cAAc,MAAM,MAAM,KAAK,KAAK,cAAc,EAAE,CAAC,CAAC;AAC5D,QAAI,eAAe,KAAM,QAAO;cAEhC,MAAM,SAAS,UACf,CAAC,iBAAiB,WAAW,KAAK,IAAI,CAEtC,QAAO,KAAK;AAGhB,UAAO;;AAGT,SAAO,MAAM,wBAAwB;IACpC,CAAC,yBAAyB,UAAU,iBAAiB,CAAC;CAGzD,MAAM,UAAU,OAAyB,KAAK;CAG9C,MAAM,EAAE,cAAc,QACpB;EACE,GAAG;EACH,cAAc;EACd,QAAQ;EACR,uBAAuB;EACxB,EACD,WACA,QACD;CAGD,MAAM,gBAAgB,cAAc;EAClC,MAAM,QAA2B,EAAE;EACnC,IAAI,iBAAiB;AAErB,0BAAwB,SAAS,SAAS;AACxC,OAAI,KAAK,SAAS,WAAW;AAC3B,QAAI,CAAC,eACH,OAAM,KACJ,oBAAC;KAEC,MAAK;KACL,oBAAiB;OAFZ,WAAW,OAAO,KAAK,IAAI,GAGhC,CACH;AAGH,UAAM,KACJ,oBAAC;KAEO;KACN,OAAO;KACP,QAAQ,cAAc;KACtB,YAAY,cAAc;KAC1B,eAAe,cAAc;KACvB;OAND,KAAK,IAOV,CACH;AAED,qBAAiB;AACjB;;GAGF,IAAI,WACF,oBAAC;IAEO;IACN,OAAO;IACP,QAAQ,cAAc;IAChB;IACN,UAAU,KAAK;MALV,KAAK,IAMV;AAIJ,OAAI,KAAK,MAAM,QAMb,YACE,oBAAC;IAEC;IACA,WAAU;IACV,GATF,OAAO,KAAK,MAAM,YAAY,WAC1B,EAAE,OAAO,KAAK,MAAM,SAAS,GAC7B,KAAK,MAAM;cASZ;MALI,KAAK,IAMM;AAKtB,OAAI,KAAK,MAAM,QACb,YAAW,KAAK,MAAM,QAAQ,SAAS;AAIzC,SAAM,KAAK,MAAM,aAAa,UAAU,EAAE,KAAK,KAAK,KAAK,CAAC,CAAC;IAC3D;AAEF,SAAO;IACN;EACD;EACA;EACA,cAAc;EACd,cAAc;EAEd,cAAc;EACf,CAAC;AAGF,OAAM,gBAAgB;AACpB,MAAI,aAAa,eAAe,SAAS;GAGvC,MAAM,YAAY,iBAAiB;AACjC,QAAI,eAAe,QACjB,gBAAe,QAAQ,OAAO;MAE/B,EAAE;AAEL,gBAAa,aAAa,UAAU;;IAErC,CAAC,UAAU,CAAC;AAGf,OAAM,gBAAgB;AAEpB,MAAI,aAAa,aAAa,aAAa,eAAe,SAAS;GAEjE,MAAM,YAAY,iBAAiB;AACjC,QAAI,eAAe,QACjB,gBAAe,QAAQ,OAAO;MAE/B,GAAG;AAEN,gBAAa,aAAa,UAAU;;IAErC,CAAC,WAAW,aAAa,UAAU,CAAC;CAGvC,MAAM,qBAAqB,OAAe,GAAG;AAG7C,OAAM,gBAAgB;EACpB,MAAM,qBAAqB,YAAY,MAAM;AAI7C,MAAI,uBAHoB,mBAAmB,WAGG,uBAAuB,IAAI;GACvE,MAAM,qBAAqB,yBAAyB;AAEpD,OAAI,sBAAsB,kBAAkB;AAE1C,cAAU,iBAAiB,cAAc,mBAAmB;AAC5D,kBAAc,mBAAmB;AACjC,kBAAc,UAAU;UACnB;AAEL,cAAU,iBAAiB,cAAc,KAAK;AAC9C,kBAAc,KAAK;AACnB,kBAAc,UAAU;;;AAK5B,qBAAmB,UAAU;IAC5B;EAAC;EAAa;EAAyB;EAAiB,CAAC;CAG5D,MAAM,kBAAkB,cAChB,cAAc,OAAO,iBAAiB,EAC5C,CAAC,MAAM,CACR;CAID,MAAM,iBADgB,YAAY,MAAM,CAAC,SAAS,KACV,CAAC,oBAAoB,CAAC;AAG9D,YAAW,cAAc,QAAQ;CAEjC,MAAM,OAAO,cAAc;EAEzB,IAAI,aAAa,cAAc,MAAM;EACrC,IAAI,UAAU,cAAc,MAAM;AAElC,SAAO;GACL,UAAU;GACV,QAAQ,CAAC,CAAC;GACV,QAAQ,CAAC,CAAC;GACV,SAAS;GACT,MAAM;GACP;IACA;EAAC;EAAiB;EAAQ;EAAQ,cAAc;EAAK,CAAC;AAEzD,QACE,qBAAC;EACC,GAAK,gBAAgB,MAAM;EAC3B,KAAK;EACL,IAAI,MAAM;EACV,aAAW;EACL;EACN,QAAQA,aAAW,iBAAiB,OAAO;;GAG1C,UACC,oBAAC;IACC,MAAK;IACL,aAAW;IACX,QAAQ;KAAE,QAAQ;KAAQ,GAAG;KAAc;cAE1C;KACY;GAIjB,oBAAC;IACC,KAAK;IACL,MAAK;IACL,aAAa;IACb,OAAO;IACP,QAAQ;IACR,aAAW;IACX,iBAAe,GAAG,MAAM,cAAc;IACtC,MAAK;IACL,iBAAc;IACd,iBAAc;IACd,yBACE,cAAc,OACV,GAAG,MAAM,cAAc,eAAe,eACtC;IAEN,WAAW,MAAM,mBAAmB,EAAE,OAAO,MAAM;IACnD,YAAY,MAAM;AAChB,SAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,WAAW;AAChD,QAAE,gBAAgB;MAElB,MAAM,cAAc,EAAE,QAAQ;MAC9B,MAAM,EAAE,qBAAqB;MAE7B,MAAM,aACJ,cAAc,WAAW,iBAAiB;MAG5C,MAAM,2BAAkC;OACtC,MAAM,OAAc,EAAE;OAEtB,MAAM,SAAS,UAAiB;AAC9B,aAAK,MAAM,QAAQ,MACjB,KAAI,MAAM,SAAS,UACjB,OAAM,MAAM,KAAK,KAAK,cAAc,EAAE,CAAC,CAAC;iBAC/B,MAAM,SAAS,OACxB,MAAK,KAAK,KAAK,IAAI;;AAKzB,aAAM,wBAAwB;AAC9B,cAAO;;MAIT,MAAM,yBACJ,cACA,WACA,gBACG;OACH,MAAM,YAAY,cAAc,YAAY,IAAI;AAEhD,YACE,IAAI,IAAI,eAAe,WACvB,KAAK,KAAK,IAAI,YAAY,QAC1B,KAAK,WACL;QACA,MAAM,MAAM,YAAY;AACxB,YAAI,CAAC,iBAAiB,WAAW,IAAI,CACnC,QAAO;;AAIX,cAAO;;MAIT,MAAM,8BACJ,WACA,gBACG;OACH,MAAM,cACJ,cAAc,YACV,cACA,CAAC,GAAG,YAAY,CAAC,SAAS;AAEhC,YAAK,MAAM,OAAO,YAChB,KAAI,CAAC,iBAAiB,WAAW,IAAI,CACnC,QAAO;AAIX,cAAO;;MAGT,MAAM,cAAc,oBAAoB;AAExC,UAAI,YAAY,WAAW,EACzB;MAGF,IAAI;MACJ,MAAM,YAAY,cAAc,YAAY;AAE5C,UAAI,cAAc,KAEhB,WAAU,2BAA2B,WAAW,YAAY;WACvD;OAEL,MAAM,eAAe,YAAY,QAAQ,WAAW;AAEpD,WAAI,iBAAiB,GAEnB,WAAU,2BAA2B,WAAW,YAAY;YACvD;AAEL,kBAAU,sBACR,cACA,WACA,YACD;AAGD,YAAI,WAAW,KACb,WAAU,2BAA2B,WAAW,YAAY;;;AAKlE,UAAI,WAAW,MAAM;AACnB,wBAAiB,cAAc,QAAQ;AACvC,qBAAc,QAAQ;AACtB,qBAAc,UAAU;;gBAG1B,EAAE,QAAQ,WACT,EAAE,QAAQ,OAAO,CAAC,YAAY,MAAM,EACrC;MACA,MAAM,oBACJ,cAAc,UAAU,iBAAiB;AAC3C,UAAI,qBAAqB,MAAM;AAC7B,SAAE,gBAAgB;AAIlB,WAAI,UAAU,iBAAiB,kBAAkB,OAC/C,WAAU,iBAAiB,OAAO,mBAAmB,EAAE;YAClD;QAEL,MAAM,OAAO,UAAU,WAAW,QAAQ,kBAAkB;AAC5D,YAAI,MAAM;SAER,MAAM,WAAY,cAAsB;AACxC,aAAI,SACF,UAAS,kBAAkB;AAG7B,aAAI,KAAK,OAAO,SACd,MAAK,MAAM,SAAS,kBAAkB;;;OAM5C,MAAM,EAAE,SAAS,kBAAkB;AACnC,WAAI,WAAW,kBAAkB,MAC/B,UAAS;;gBAGJ,EAAE,QAAQ,UACnB;UAAI,aAAa;AACf,SAAE,gBAAgB;AAClB,0BAAmB,GAAG;;;;KAI5B;GAGD,aACC,oBAAC,kCACC,oBAAC;IACC,MAAK;IACL,cAAW;IACX,eAAa;KACb,GACmB;GAIxB,CAAC,aAAa,CAAC,kBACd,oBAAC;IACC,GAAI;IACJ,KAAK;IACL,IAAI,GAAG,MAAM,cAAc;IAC3B,cAAW;IACX,IAAG;IACH,aAAW;IACL;IACN,QAAQ;KACN,QAAQ;KACR,WAAW;KACX,QAAQ;KACR,SAAS;KACV;cAEA;KACU;GAId,CAAC,aAAa,kBACb,oBAAC,8BAAkB,aAA8B;GAIlD,UACC,oBAAC;IACC,MAAK;IACL,aAAW;IACX,QAAQ;cAEP;KACY;;GAEC;;AAKxB,MAAM,eAAe,MAAM,WAAW,YAAY;AAMlD,MAAM,gBAAgB,OAAO,OAAO,cAAc;CAChD,SAASC;CACT;CACA;CACA,aAAa;CACd,CAAC"}