twenty-ui 2.48.0 → 2.49.0

package/dist/components/code-editor.mjs

@@ -1,15 +1,16 @@
 import { t as d } from "../isDefined-fMi6eQ4r.js";
-import { n as rr, r as er } from "../theme-B2EaXhye.js";
-import { t as or } from "../Loader-DtHWQH8w.js";
-import { n as B, t as tr } from "../ResizeHandle-C1kQ3MYR.js";
-import { useRender as nr } from "@base-ui/react/use-render";
+import { t as rr } from "../doNotTranslate-BSVT8Xyd.js";
+import { n as er, r as or } from "../theme-B2EaXhye.js";
+import { t as tr } from "../Loader-DtHWQH8w.js";
+import { n as B, t as nr } from "../ResizeHandle-B30OYZxS.js";
+import { useRender as ir } from "@base-ui/react/use-render";
 import { isNumber as H } from "@sniptt/guards";
 import { clsx as $ } from "clsx";
-import { useEffect as p, useId as ir, useState as g } from "react";
-import { Fragment as ar, jsx as s, jsxs as S } from "react/jsx-runtime";
-import { clamp as dr } from "@base-ui/utils/clamp";
-import sr, { loader as lr } from "@monaco-editor/react";
-var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setContentHeight: o }) => (p(() => {
+import { useEffect as p, useId as ar, useState as g } from "react";
+import { Fragment as dr, jsx as s, jsxs as S } from "react/jsx-runtime";
+import { clamp as sr } from "@base-ui/utils/clamp";
+import lr, { loader as ur } from "@monaco-editor/react";
+var cr = "baseCodeEditorTheme", fr = ({ shouldAutoHeight: r, editor: e, setContentHeight: o }) => (p(() => {
   if (!r || !d(e)) {
     o(void 0);
     return;
@@ -25,7 +26,7 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
   e,
   r,
   o
-]), null), fr = ({ editor: r, setEditor: e, setMonaco: o, setIsEditorFocused: t }) => (p(() => {
+]), null), gr = ({ editor: r, setEditor: e, setMonaco: o, setIsEditorFocused: t }) => (p(() => {
   if (!d(r)) {
     t(!1);
     return;
@@ -46,14 +47,14 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
   e,
   o,
   t
-]), null), gr = ({ configureMonacoLoader: r, setIsMonacoLoaderConfigured: e }) => (p(() => {
+]), null), pr = ({ configureMonacoLoader: r, setIsMonacoLoaderConfigured: e }) => (p(() => {
   let o = !0;
   return r().then(() => {
     o && e(!0);
   }), () => {
     o = !1;
   };
-}, [r, e]), null), pr = ({ editor: r, monaco: e, setMarkers: o }) => (p(() => {
+}, [r, e]), null), mr = ({ editor: r, monaco: e, setMarkers: o }) => (p(() => {
   if (!d(r) || !d(e) || !d(o)) return;
   const t = () => {
     const a = r.getModel();
@@ -68,7 +69,7 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
   r,
   e,
   o
-]), null), j = (r) => dr(r, B.min, B.max), mr = ({ height: r, resizable: e, editor: o, setResizedHeight: t }) => (p(() => {
+]), null), j = (r) => sr(r, B.min, B.max), vr = ({ height: r, resizable: e, editor: o, setResizedHeight: t }) => (p(() => {
   if (!e || !d(o)) return;
   const i = o.getContainerDomNode().parentElement?.getBoundingClientRect().height;
   !d(i) || i <= 0 || t({
@@ -90,7 +91,7 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
     return d(a) ? `#${l}${u}${f}${Math.round(parseFloat(a) * 255).toString(16).padStart(2, "0")}` : `#${l}${u}${f}`;
   }
   return r;
-}, vr = ({ theme: r, colorScheme: e }) => ({
+}, kr = ({ theme: r, colorScheme: e }) => ({
   base: e === "dark" ? "vs-dark" : "vs",
   inherit: !0,
   rules: [
@@ -175,11 +176,11 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
     "editorBracketMatch.border": n(r.border.color.medium)
   }
 }), W = ({ monaco: r, theme: e, colorScheme: o }) => {
-  r.editor.defineTheme(ur, vr({
+  r.editor.defineTheme(cr, kr({
     theme: e,
     colorScheme: o
   }));
-}, kr = ({ monaco: r, theme: e, colorScheme: o, editorTheme: t }) => (p(() => {
+}, br = ({ monaco: r, theme: e, colorScheme: o, editorTheme: t }) => (p(() => {
   d(r) && (W({
     monaco: r,
     theme: e,
@@ -190,13 +191,13 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
   t,
   r,
   e
-]), null), br = ({ height: r, resizableHeight: e, contentHeight: o, shouldUseResizableHeight: t, shouldAutoHeight: i }) => t ? e : i ? o ?? r : r, Cr = ({ height: r, resizedHeight: e }) => e?.sourceHeight === r ? e.value : H(r) ? j(r) : 450, hr = ({ height: r, resizable: e, autoHeight: o }) => {
-  const [t, i] = g(), [a, l] = g(), u = o && !e, f = t?.sourceHeight === r, C = e && (f || H(r)), m = Cr({
+]), null), Cr = ({ height: r, resizableHeight: e, contentHeight: o, shouldUseResizableHeight: t, shouldAutoHeight: i }) => t ? e : i ? o ?? r : r, hr = ({ height: r, resizedHeight: e }) => e?.sourceHeight === r ? e.value : H(r) ? j(r) : 450, Hr = ({ height: r, resizable: e, autoHeight: o }) => {
+  const [t, i] = g(), [a, l] = g(), u = o && !e, f = t?.sourceHeight === r, C = e && (f || H(r)), m = hr({
     height: r,
     resizedHeight: t
   });
   return {
-    currentHeight: br({
+    currentHeight: Cr({
       height: r,
       resizableHeight: m,
       contentHeight: a,
@@ -214,14 +215,14 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
     setContentHeight: l,
     shouldAutoHeight: u
   };
-}, Hr = "_editorWrapper_zilk9_24", Er = "_editorLoader_zilk9_1", _r = "_container_zilk9_20", M = {
-  editorWrapper: Hr,
-  editorLoader: Er,
-  container: _r
-}, F, yr = () => (F ??= import("monaco-editor").then((r) => {
-  lr.config({ monaco: r });
-}), F), Wr = ({ onMount: r, beforeMount: e, setMarkers: o, height: t = 450, width: i = "100%", theme: a, loading: l = /* @__PURE__ */ s(or, {}), variant: u = "default", transparentBackground: f, isLoading: C = !1, options: m, resizable: v = !1, resizeLabel: w = "Resize editor", contentPadding: A = "default", autoHeight: I = !1, containerProps: E, ref: O, ...K }) => {
-  const k = er(), L = rr(), [R, T] = g(), [b, x] = g(), [P, q] = g(!1), [G, U] = g(!1), z = ir(), _ = a ?? m?.theme ?? "baseCodeEditorTheme", { currentHeight: h, resizableHeight: V, setResizableHeight: Z, setResizedHeight: J, setContentHeight: Q, shouldAutoHeight: X } = hr({
+}, Er = "_editorWrapper_zilk9_24", _r = "_editorLoader_zilk9_1", yr = "_container_zilk9_20", M = {
+  editorWrapper: Er,
+  editorLoader: _r,
+  container: yr
+}, F, Mr = () => (F ??= import("monaco-editor").then((r) => {
+  ur.config({ monaco: r });
+}), F), Ar = ({ onMount: r, beforeMount: e, setMarkers: o, height: t = 450, width: i = "100%", theme: a, loading: l = /* @__PURE__ */ s(tr, {}), variant: u = "default", transparentBackground: f, isLoading: C = !1, options: m, resizable: v = !1, resizeLabel: w = rr("Resize editor"), contentPadding: A = "default", autoHeight: I = !1, containerProps: E, ref: O, ...K }) => {
+  const k = or(), L = er(), [T, N] = g(), [b, R] = g(), [P, q] = g(!1), [G, U] = g(!1), x = ar(), _ = a ?? m?.theme ?? "baseCodeEditorTheme", { currentHeight: h, resizableHeight: V, setResizableHeight: Z, setResizedHeight: J, setContentHeight: Q, shouldAutoHeight: X } = Hr({
     height: t,
     resizable: v,
     autoHeight: I
@@ -235,34 +236,34 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
     className: $(M.container, E?.className),
     onKeyDown: Y,
     children: [
-      /* @__PURE__ */ s(gr, {
-        configureMonacoLoader: yr,
+      /* @__PURE__ */ s(pr, {
+        configureMonacoLoader: Mr,
         setIsMonacoLoaderConfigured: q
       }),
-      /* @__PURE__ */ s(mr, {
+      /* @__PURE__ */ s(vr, {
         height: t,
         resizable: v,
         editor: b,
         setResizedHeight: J
       }),
-      /* @__PURE__ */ s(cr, {
+      /* @__PURE__ */ s(fr, {
         shouldAutoHeight: X,
         editor: b,
         setContentHeight: Q
       }),
-      /* @__PURE__ */ s(fr, {
+      /* @__PURE__ */ s(gr, {
         editor: b,
-        setEditor: x,
-        setMonaco: T,
+        setEditor: R,
+        setMonaco: N,
         setIsEditorFocused: U
       }),
-      /* @__PURE__ */ s(pr, {
+      /* @__PURE__ */ s(mr, {
         editor: b,
-        monaco: R,
+        monaco: T,
         setMarkers: o
       }),
-      /* @__PURE__ */ s(kr, {
-        monaco: R,
+      /* @__PURE__ */ s(br, {
+        monaco: T,
         theme: k,
         colorScheme: L,
         editorTheme: _
@@ -276,11 +277,11 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
         },
         children: l
       }) : /* @__PURE__ */ s("div", {
-        id: z,
+        id: x,
         className: M.editorWrapper,
         "data-variant": u,
         "data-transparent-background": f || void 0,
-        children: /* @__PURE__ */ s(sr, {
+        children: /* @__PURE__ */ s(lr, {
           ...K,
           height: h,
           width: i,
@@ -293,8 +294,8 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
               colorScheme: L
             }), e?.(c);
           },
-          onMount: (c, N) => {
-            T(N), x(c), r?.(c, N);
+          onMount: (c, z) => {
+            N(z), R(c), r?.(c, z);
           },
           options: {
             formatOnPaste: !0,
@@ -318,24 +319,24 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
           }
         })
       }),
-      v && !C && d(b) && /* @__PURE__ */ s(tr, {
+      v && !C && d(b) && /* @__PURE__ */ s(nr, {
         "aria-label": w,
-        "aria-controls": z,
+        "aria-controls": x,
         value: V,
         onValueChange: Z
       })
     ]
   });
-}, Mr = "_editorHeader_19qlo_1", Dr = "_elementContainer_19qlo_15", D = {
-  editorHeader: Mr,
-  elementContainer: Dr
-}, wr = ({ title: r, startElement: e, endElement: o, className: t, render: i, ref: a, ...l }) => nr({
+}, Dr = "_editorHeader_19qlo_1", Sr = "_elementContainer_19qlo_15", D = {
+  editorHeader: Dr,
+  elementContainer: Sr
+}, Ir = ({ title: r, startElement: e, endElement: o, className: t, render: i, ref: a, ...l }) => ir({
   render: i,
   ref: a,
   props: {
     ...l,
     className: $(D.editorHeader, t),
-    children: /* @__PURE__ */ S(ar, { children: [/* @__PURE__ */ S("div", {
+    children: /* @__PURE__ */ S(dr, { children: [/* @__PURE__ */ S("div", {
       className: D.elementContainer,
       children: [e, r]
     }), /* @__PURE__ */ s("div", {
@@ -345,6 +346,6 @@ var ur = "baseCodeEditorTheme", cr = ({ shouldAutoHeight: r, editor: e, setConte
   }
 });
 export {
-  Wr as CodeEditor,
-  wr as CodeEditorHeader
+  Ar as CodeEditor,
+  Ir as CodeEditorHeader
 };

package/dist/components/data-display.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../data-display-DjhAHvj1.cjs"),o=require("../TintedIconTile-CU2hCerq.cjs");exports.AvatarGroup=e.AvatarGroup;exports.CommandBlock=e.CommandBlock;exports.JsonTree=e.JsonTree;exports.MetricRow=e.MetricRow;exports.StackIcon=e.StackIcon;exports.TintedIconTile=o.TintedIconTile;exports.getIconTileColorShades=o.getIconTileColorShades;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../data-display-XV3ht1rC.cjs"),o=require("../TintedIconTile-DO1XJXCQ.cjs");exports.AvatarGroup=e.AvatarGroup;exports.CommandBlock=e.CommandBlock;exports.JsonTree=e.JsonTree;exports.MetricRow=e.MetricRow;exports.StackIcon=e.StackIcon;exports.TintedIconTile=o.TintedIconTile;exports.getIconTileColorShades=o.getIconTileColorShades;

package/dist/components/data-display.mjs

@@ -1,5 +1,5 @@
-import { a, i as r, n as t, r as e, t as s } from "../data-display-KyZbLLy-.js";
-import { n as i, t as c } from "../TintedIconTile-4BGa8g8n.js";
+import { a, i as r, n as t, r as e, t as s } from "../data-display-BtXCGOGw.js";
+import { n as i, t as c } from "../TintedIconTile-B1XDtGrF.js";
 export {
   a as AvatarGroup,
   r as CommandBlock,

package/dist/components/feedback.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../feedback-ybO4n69s.cjs");exports.Callout=e.Callout;exports.InlineBanner=e.InlineBanner;exports.Toast=e.Toast;exports.ToastProvider=e.ToastProvider;exports.Toaster=e.Toaster;exports.useToast=e.useToast;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../feedback-Cs-38OH4.cjs");exports.Callout=e.Callout;exports.InlineBanner=e.InlineBanner;exports.Toast=e.Toast;exports.ToastProvider=e.ToastProvider;exports.Toaster=e.Toaster;exports.useToast=e.useToast;

package/dist/components/feedback.mjs

@@ -1,4 +1,4 @@
-import { a as s, i as o, n as r, o as t, r as e, t as n } from "../feedback-CM6fatE8.js";
+import { a as s, i as o, n as r, o as t, r as e, t as n } from "../feedback-DTyVVcTb.js";
 export {
   t as Callout,
   s as InlineBanner,

package/dist/components/input/CountrySelect/CountrySelect.d.ts

@@ -1,2 +1,5 @@
-import { CountrySelectProps } from './types/CountrySelectProps';
-export declare const CountrySelect: ({ countries, value, onValueChange, label, searchLabel, noCountryLabel, noResultsLabel, open: controlledOpen, onOpenChange, popupProps, disabled, className, style, render, onClick, onMouseDown, onPointerDown, onKeyDown, onKeyUp, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, ...props }: CountrySelectProps) => import("react").JSX.Element;
+export declare const CountrySelect: (({ countries, value, defaultValue, onValueChange, disabled, noCountryLabel, ...props }: import('..').CountrySelectProps) => import("react").JSX.Element) & {
+    Root: ({ countries, value: controlledValue, defaultValue, onValueChange, disabled, noCountryLabel, children, }: import('..').CountrySelectRootProps) => import("react").JSX.Element;
+    Trigger: ({ label, wrapperProps, children, className, style, render, onClick, onMouseDown, onPointerDown, onKeyDown, onKeyUp, openOnHover, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, ...props }: import('..').CountrySelectTriggerProps) => import("react").JSX.Element;
+    Options: (props: import('..').CountrySelectOptionsProps) => import("react").JSX.Element;
+};

package/dist/components/input/CountrySelect/__stories__/CountrySelectPartsExample.d.ts

@@ -0,0 +1,11 @@
+import { CountrySelectProps } from '../types/CountrySelectProps';
+type CountrySelectPartsExampleProps = Pick<CountrySelectProps, 'onValueChange' | 'onOpenChange'> & {
+    compound?: boolean;
+    controlled?: boolean;
+    cancelSelection?: boolean;
+    closeOnSelect?: boolean;
+    keepMounted?: boolean;
+    openOnHover?: boolean;
+};
+export declare const CountrySelectPartsExample: ({ compound, controlled, cancelSelection, closeOnSelect, keepMounted, openOnHover, onValueChange, onOpenChange, }: CountrySelectPartsExampleProps) => import("react").JSX.Element;
+export {};

package/dist/components/input/CountrySelect/internal/CountrySelectComponent.d.ts

@@ -0,0 +1,2 @@
+import { CountrySelectProps } from '../types/CountrySelectProps';
+export declare const CountrySelectComponent: ({ countries, value, defaultValue, onValueChange, disabled, noCountryLabel, ...props }: CountrySelectProps) => import("react").JSX.Element;

package/dist/components/input/CountrySelect/internal/CountrySelectContext.d.ts

@@ -0,0 +1,2 @@
+import { CountrySelectContextValue } from './CountrySelectContextValue';
+export declare const CountrySelectContext: import('react').Context<CountrySelectContextValue | undefined>;

package/dist/components/input/CountrySelect/internal/CountrySelectContextValue.d.ts

@@ -0,0 +1,11 @@
+import { CountrySelectRootProps } from '../types/CountrySelectRootProps';
+import { PreparedCountryChoice } from './PreparedCountryChoice';
+export type CountrySelectContextValue = {
+    countries: readonly PreparedCountryChoice[];
+    selectedCountry: PreparedCountryChoice | undefined;
+    value: string | null;
+    disabled: boolean;
+    noCountryLabel: string;
+    selectionGroupId: string;
+    changeValue: NonNullable<CountrySelectRootProps['onValueChange']>;
+};

package/dist/components/input/CountrySelect/internal/CountrySelectDropdown.d.ts

@@ -0,0 +1,4 @@
+import { CountrySelectProps } from '../types/CountrySelectProps';
+type CountrySelectDropdownProps = Omit<CountrySelectProps, 'countries' | 'value' | 'defaultValue' | 'onValueChange' | 'disabled' | 'noCountryLabel'>;
+export declare const CountrySelectDropdown: ({ open: controlledOpen, defaultOpen, onOpenChange, onEscapeKeyDown, onInteractOutside, defaultPage, popupProps, optionsProps, searchLabel, noResultsLabel, searchProps, closeOnSelect, ...triggerProps }: CountrySelectDropdownProps) => import("react").JSX.Element;
+export {};

package/dist/components/input/CountrySelect/internal/CountrySelectOptions.d.ts

@@ -1,11 +1,2 @@
-import { CountryChoice } from '../types/CountryChoice';
-type CountrySelectOptionsProps = {
-    countries: readonly CountryChoice[];
-    value: string;
-    onValueChange: (value: string) => void;
-    searchLabel: string;
-    noCountryLabel: string;
-    noResultsLabel: string;
-};
-export declare const CountrySelectOptions: ({ countries, value, onValueChange, searchLabel, noCountryLabel, noResultsLabel, }: CountrySelectOptionsProps) => import("react").JSX.Element;
-export {};
+import { CountrySelectOptionsProps } from '../types/CountrySelectOptionsProps';
+export declare const CountrySelectOptions: (props: CountrySelectOptionsProps) => import("react").JSX.Element;

package/dist/components/input/CountrySelect/internal/CountrySelectOptionsContent.d.ts

@@ -0,0 +1,2 @@
+import { CountrySelectOptionsProps } from '../types/CountrySelectOptionsProps';
+export declare const CountrySelectOptionsContent: ({ searchLabel, noResultsLabel, searchProps, render, ...props }: CountrySelectOptionsProps) => import("react").JSX.Element;

package/dist/components/input/CountrySelect/internal/CountrySelectRoot.d.ts

@@ -0,0 +1,2 @@
+import { CountrySelectRootProps } from '../types/CountrySelectRootProps';
+export declare const CountrySelectRoot: ({ countries, value: controlledValue, defaultValue, onValueChange, disabled, noCountryLabel, children, }: CountrySelectRootProps) => import("react").JSX.Element;

package/dist/components/input/CountrySelect/internal/CountrySelectTrigger.d.ts

@@ -0,0 +1,2 @@
+import { CountrySelectTriggerProps } from '../types/CountrySelectTriggerProps';
+export declare const CountrySelectTrigger: ({ label, wrapperProps, children, className, style, render, onClick, onMouseDown, onPointerDown, onKeyDown, onKeyUp, openOnHover, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, ...props }: CountrySelectTriggerProps) => import("react").JSX.Element;

package/dist/components/input/CountrySelect/internal/NO_COUNTRY_SELECTION_VALUE.d.ts

@@ -0,0 +1 @@
+export declare const NO_COUNTRY_SELECTION_VALUE = "no-country";

package/dist/components/input/CountrySelect/internal/PreparedCountryChoice.d.ts

@@ -0,0 +1,5 @@
+import { CountryChoice } from '../types/CountryChoice';
+export type PreparedCountryChoice = CountryChoice & {
+    selectionValue: string;
+    searchText: string;
+};

package/dist/components/input/CountrySelect/internal/getCountrySelectionValue.d.ts

@@ -0,0 +1 @@
+export declare const getCountrySelectionValue: (value: string) => string;

package/dist/components/input/CountrySelect/internal/useCountrySelectContextOrThrow.d.ts

@@ -0,0 +1 @@
+export declare const useCountrySelectContextOrThrow: () => import('./CountrySelectContextValue').CountrySelectContextValue;

package/dist/components/input/CountrySelect/types/CountryChoice.d.ts

@@ -3,4 +3,5 @@ export type CountryChoice = {
     value: string;
     label: string;
     flag?: ReactNode;
+    disabled?: boolean;
 };

package/dist/components/input/CountrySelect/types/CountrySelectOptionsProps.d.ts

@@ -0,0 +1,10 @@
+import { useRender } from '@base-ui/react/use-render';
+import { DropdownSearchProps } from '../../../navigation/Dropdown/types/DropdownSearchProps';
+import { DropdownSelectionGroupProps } from '../../../navigation/Dropdown/types/DropdownSelectionGroupProps';
+import { CountrySelectOptionsState } from './CountrySelectOptionsState';
+export type CountrySelectOptionsProps = Omit<DropdownSelectionGroupProps, 'id' | 'children' | 'multiple' | 'value' | 'defaultValue' | 'onValueChange' | 'render'> & {
+    render?: useRender.ComponentProps<'div', CountrySelectOptionsState>['render'];
+    searchLabel?: string;
+    noResultsLabel?: string;
+    searchProps?: Omit<DropdownSearchProps, 'value' | 'defaultValue' | 'onValueChange'>;
+};

package/dist/components/input/CountrySelect/types/CountrySelectOptionsState.d.ts

@@ -0,0 +1,4 @@
+export type CountrySelectOptionsState = {
+    value: string | null;
+    multiple: false;
+};

package/dist/components/input/CountrySelect/types/CountrySelectProps.d.ts

@@ -1,15 +1,9 @@
 import { DropdownContentProps } from '../../../navigation/Dropdown/types/DropdownContentProps';
-import { DropdownTriggerProps } from '../../../navigation/Dropdown/types/DropdownTriggerProps';
-import { CountryChoice } from './CountryChoice';
-export type CountrySelectProps = Omit<DropdownTriggerProps, 'children' | 'value' | 'defaultValue' | 'onChange' | 'openOnHover' | 'delay' | 'closeDelay'> & {
-    countries: readonly CountryChoice[];
-    value: string;
-    onValueChange: (value: string) => void;
-    label?: string;
-    searchLabel?: string;
-    noCountryLabel?: string;
-    noResultsLabel?: string;
-    open?: boolean;
-    onOpenChange?: (open: boolean) => void;
-    popupProps?: Omit<DropdownContentProps, 'children' | 'aria-label' | 'aria-labelledby' | 'keepMounted'>;
+import { DropdownRootProps } from '../../../navigation/Dropdown/types/DropdownRootProps';
+import { CountrySelectRootProps } from './CountrySelectRootProps';
+import { CountrySelectTriggerProps } from './CountrySelectTriggerProps';
+import { CountrySelectOptionsProps } from './CountrySelectOptionsProps';
+export type CountrySelectProps = Omit<CountrySelectRootProps, 'children'> & CountrySelectTriggerProps & Omit<DropdownRootProps, 'children' | 'type' | 'multiple'> & Pick<CountrySelectOptionsProps, 'searchLabel' | 'noResultsLabel' | 'searchProps' | 'closeOnSelect'> & {
+    popupProps?: Omit<DropdownContentProps, 'children'>;
+    optionsProps?: Omit<CountrySelectOptionsProps, 'searchLabel' | 'noResultsLabel' | 'searchProps' | 'closeOnSelect'>;
 };

package/dist/components/input/CountrySelect/types/CountrySelectRootProps.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+import { DropdownSelectionGroupChangeEventDetails } from '../../../navigation/Dropdown/types/DropdownSelectionGroupChangeEventDetails';
+import { CountryChoice } from './CountryChoice';
+export type CountrySelectRootProps = {
+    countries: readonly CountryChoice[];
+    value?: string | null;
+    defaultValue?: string | null;
+    onValueChange?: (value: string | null, eventDetails: DropdownSelectionGroupChangeEventDetails) => void;
+    disabled?: boolean;
+    noCountryLabel?: string;
+    children: ReactNode;
+};

package/dist/components/input/CountrySelect/types/CountrySelectTriggerProps.d.ts

@@ -0,0 +1,6 @@
+import { ComponentPropsWithRef } from 'react';
+import { DropdownTriggerProps } from '../../../navigation/Dropdown/types/DropdownTriggerProps';
+export type CountrySelectTriggerProps = Omit<DropdownTriggerProps, 'value' | 'defaultValue' | 'onChange' | 'disabled'> & {
+    label?: string;
+    wrapperProps?: Omit<ComponentPropsWithRef<'div'>, 'children'>;
+};

package/dist/components/input/CurrencyPicker/CurrencyPicker.d.ts

@@ -1,4 +1,5 @@
-export declare const CurrencyPicker: {
-    Trigger: ({ value, className, ...props }: import('..').CurrencyPickerTriggerProps) => import("react").JSX.Element;
-    Options: ({ currencies, value, onValueChange, disabled, searchLabel, emptyLabel, className, render, ref, ...props }: import('..').CurrencyPickerOptionsProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
+export declare const CurrencyPicker: (({ currencies, value, defaultValue, onValueChange, closeOnSelect, disabled, selectedFirst, getOptionLabel, getSearchText, renderValue, open, defaultOpen, onOpenChange, onEscapeKeyDown, onInteractOutside, triggerProps, contentProps, optionsProps, ...props }: import('..').CurrencyPickerProps) => import("react").JSX.Element) & {
+    Root: ({ currencies, value: controlledValue, defaultValue, onValueChange, closeOnSelect, disabled, selectedFirst, getOptionLabel, getSearchText, renderValue, children, }: import('..').CurrencyPickerRootProps) => import("react").JSX.Element;
+    Trigger: ({ children, placeholder, disabled, className, ...props }: import('..').CurrencyPickerTriggerProps) => import("react").JSX.Element;
+    Options: ({ disabled, searchable, searchLabel, listLabel, emptyLabel, searchProps, className, render, ref, ...props }: import('..').CurrencyPickerOptionsProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
 };

package/dist/components/input/CurrencyPicker/__stories__/CurrencyPickerChangingDefaultExample.d.ts

@@ -0,0 +1,5 @@
+import { ComponentProps } from 'react';
+import { CurrencyPickerExample } from './CurrencyPickerExample';
+type CurrencyPickerChangingDefaultExampleProps = Pick<ComponentProps<typeof CurrencyPickerExample>, 'onValueChange' | 'composition'>;
+export declare const CurrencyPickerChangingDefaultExample: ({ onValueChange, composition, }: CurrencyPickerChangingDefaultExampleProps) => import("react").JSX.Element;
+export {};

package/dist/components/input/CurrencyPicker/__stories__/CurrencyPickerControlledExample.d.ts

@@ -0,0 +1,5 @@
+import { ComponentProps } from 'react';
+import { CurrencyPickerExample } from './CurrencyPickerExample';
+type CurrencyPickerControlledExampleProps = Pick<ComponentProps<typeof CurrencyPickerExample>, 'onValueChange' | 'composition'>;
+export declare const CurrencyPickerControlledExample: ({ onValueChange, composition, }: CurrencyPickerControlledExampleProps) => import("react").JSX.Element;
+export {};

package/dist/components/input/CurrencyPicker/__stories__/CurrencyPickerControlledSearchExample.d.ts

@@ -0,0 +1,5 @@
+import { ComponentProps } from 'react';
+import { CurrencyPickerExample } from './CurrencyPickerExample';
+type CurrencyPickerControlledSearchExampleProps = Pick<ComponentProps<typeof CurrencyPickerExample>, 'onValueChange' | 'composition'>;
+export declare const CurrencyPickerControlledSearchExample: ({ onValueChange, composition, }: CurrencyPickerControlledSearchExampleProps) => import("react").JSX.Element;
+export {};

package/dist/components/input/CurrencyPicker/__stories__/CurrencyPickerExample.d.ts

@@ -1,11 +1,10 @@
 import { ComponentProps } from 'react';
 import { CurrencyPicker } from '../CurrencyPicker';
-type CurrencyPickerExampleProps = Pick<ComponentProps<typeof CurrencyPicker.Options>, 'currencies' | 'searchLabel' | 'emptyLabel' | 'onValueChange' | 'dir'> & {
-    defaultValue?: string;
-    disabled?: boolean;
+type CurrencyPickerExampleProps = Pick<ComponentProps<typeof CurrencyPicker>, 'currencies' | 'value' | 'defaultValue' | 'onValueChange' | 'disabled' | 'closeOnSelect' | 'selectedFirst' | 'getOptionLabel' | 'getSearchText' | 'renderValue'> & Pick<ComponentProps<typeof CurrencyPicker.Options>, 'searchLabel' | 'emptyLabel' | 'searchable' | 'searchProps' | 'dir'> & {
+    composition?: 'shorthand' | 'compound';
     optionsDisabled?: boolean;
     defaultOpen?: boolean;
     triggerLabel?: string;
 };
-export declare const CurrencyPickerExample: ({ currencies, defaultValue, disabled, optionsDisabled, defaultOpen, triggerLabel, searchLabel, emptyLabel, onValueChange, dir, }: Partial<CurrencyPickerExampleProps>) => import("react").JSX.Element;
+export declare const CurrencyPickerExample: ({ currencies, value, defaultValue, disabled, optionsDisabled, defaultOpen, triggerLabel, composition, selectedFirst, closeOnSelect, getOptionLabel, getSearchText, renderValue, searchLabel, searchProps, emptyLabel, searchable, onValueChange, dir, }: Partial<CurrencyPickerExampleProps>) => import("react").JSX.Element;
 export {};

package/dist/components/input/CurrencyPicker/__stories__/CurrencyPickerListLabelExample.d.ts

@@ -0,0 +1 @@
+export declare const CurrencyPickerListLabelExample: () => import("react").JSX.Element;

package/dist/components/input/CurrencyPicker/__stories__/CurrencyPickerRootStateExample.d.ts

@@ -0,0 +1 @@
+export declare const CurrencyPickerRootStateExample: () => import("react").JSX.Element;

package/dist/components/input/CurrencyPicker/internal/CurrencyPickerContext.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { CurrencyPickerRootProps } from '../types/CurrencyPickerRootProps';
+import { CurrencyPickerState } from '../types/CurrencyPickerState';
+import { PreparedCurrencyPickerOption } from './PreparedCurrencyPickerOption';
+export declare const CurrencyPickerContext: import('react').Context<{
+    state: CurrencyPickerState;
+    groupId: string;
+    options: PreparedCurrencyPickerOption[];
+    selectionProps: Pick<CurrencyPickerRootProps, "value" | "defaultValue" | "onValueChange" | "closeOnSelect">;
+    renderValue?: (state: CurrencyPickerState) => ReactNode;
+} | undefined>;

package/dist/components/input/CurrencyPicker/internal/CurrencyPickerOptions.d.ts

@@ -1,2 +1,2 @@
 import { CurrencyPickerOptionsProps } from '../types/CurrencyPickerOptionsProps';
-export declare const CurrencyPickerOptions: ({ currencies, value, onValueChange, disabled, searchLabel, emptyLabel, className, render, ref, ...props }: CurrencyPickerOptionsProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
+export declare const CurrencyPickerOptions: ({ disabled, searchable, searchLabel, listLabel, emptyLabel, searchProps, className, render, ref, ...props }: CurrencyPickerOptionsProps) => import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;

package/dist/components/input/CurrencyPicker/internal/CurrencyPickerRoot.d.ts

@@ -0,0 +1,2 @@
+import { CurrencyPickerRootProps } from '../types/CurrencyPickerRootProps';
+export declare const CurrencyPickerRoot: ({ currencies, value: controlledValue, defaultValue, onValueChange, closeOnSelect, disabled, selectedFirst, getOptionLabel, getSearchText, renderValue, children, }: CurrencyPickerRootProps) => import("react").JSX.Element;

package/dist/components/input/CurrencyPicker/internal/CurrencyPickerShorthand.d.ts

@@ -0,0 +1,2 @@
+import { CurrencyPickerProps } from '../types/CurrencyPickerProps';
+export declare const CurrencyPickerShorthand: ({ currencies, value, defaultValue, onValueChange, closeOnSelect, disabled, selectedFirst, getOptionLabel, getSearchText, renderValue, open, defaultOpen, onOpenChange, onEscapeKeyDown, onInteractOutside, triggerProps, contentProps, optionsProps, ...props }: CurrencyPickerProps) => import("react").JSX.Element;

package/dist/components/input/CurrencyPicker/internal/CurrencyPickerTrigger.d.ts

@@ -1,2 +1,2 @@
 import { CurrencyPickerTriggerProps } from '../types/CurrencyPickerTriggerProps';
-export declare const CurrencyPickerTrigger: ({ value, className, ...props }: CurrencyPickerTriggerProps) => import("react").JSX.Element;
+export declare const CurrencyPickerTrigger: ({ children, placeholder, disabled, className, ...props }: CurrencyPickerTriggerProps) => import("react").JSX.Element;

package/dist/components/input/CurrencyPicker/internal/PreparedCurrencyPickerOption.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+import { CurrencyPickerOption } from '../types/CurrencyPickerOption';
+export type PreparedCurrencyPickerOption = {
+    currency: CurrencyPickerOption;
+    label: ReactNode;
+    searchText: string;
+};

package/dist/components/input/CurrencyPicker/internal/getCurrencyPickerSearchText.d.ts

@@ -0,0 +1,2 @@
+import { CurrencyPickerOption } from '../types/CurrencyPickerOption';
+export declare const getCurrencyPickerSearchText: (currency: CurrencyPickerOption) => string;

package/dist/components/input/CurrencyPicker/internal/useCurrencyPickerContextOrThrow.d.ts

@@ -0,0 +1,7 @@
+export declare const useCurrencyPickerContextOrThrow: () => {
+    state: import('../..').CurrencyPickerState;
+    groupId: string;
+    options: import('./PreparedCurrencyPickerOption').PreparedCurrencyPickerOption[];
+    selectionProps: Pick<import('../..').CurrencyPickerRootProps, "value" | "defaultValue" | "onValueChange" | "closeOnSelect">;
+    renderValue?: (state: import('../..').CurrencyPickerState) => import('react').ReactNode;
+};

package/dist/components/input/CurrencyPicker/types/CurrencyPickerChangeEventDetails.d.ts

@@ -0,0 +1,2 @@
+import { DropdownSelectionGroupChangeEventDetails } from '../../../navigation/Dropdown/types/DropdownSelectionGroupChangeEventDetails';
+export type CurrencyPickerChangeEventDetails = DropdownSelectionGroupChangeEventDetails;

package/dist/components/input/CurrencyPicker/types/CurrencyPickerOption.d.ts

@@ -1,5 +1,6 @@
 export type CurrencyPickerOption = {
     code: string;
     name: string;
+    symbol?: string;
     disabled?: boolean;
 };

package/dist/components/input/CurrencyPicker/types/CurrencyPickerOptionsProps.d.ts

@@ -1,10 +1,11 @@
 import { useRender } from '@base-ui/react/use-render';
-import { CurrencyPickerOption } from './CurrencyPickerOption';
+import { ReactNode } from 'react';
+import { DropdownSearchProps } from '../../../navigation/Dropdown/types/DropdownSearchProps';
 export type CurrencyPickerOptionsProps = Omit<useRender.ComponentProps<'div'>, 'children'> & {
-    currencies: readonly CurrencyPickerOption[];
-    value?: string;
-    onValueChange: (code: string) => void;
     disabled?: boolean;
+    searchable?: boolean;
     searchLabel?: string;
-    emptyLabel?: string;
+    listLabel?: string;
+    emptyLabel?: ReactNode;
+    searchProps?: DropdownSearchProps;
 };

package/dist/components/input/CurrencyPicker/types/CurrencyPickerProps.d.ts

@@ -0,0 +1,10 @@
+import { DropdownContentProps } from '../../../navigation/Dropdown/types/DropdownContentProps';
+import { DropdownRootProps } from '../../../navigation/Dropdown/types/DropdownRootProps';
+import { CurrencyPickerOptionsProps } from './CurrencyPickerOptionsProps';
+import { CurrencyPickerRootProps } from './CurrencyPickerRootProps';
+import { CurrencyPickerTriggerProps } from './CurrencyPickerTriggerProps';
+export type CurrencyPickerProps = Omit<CurrencyPickerRootProps, 'children'> & CurrencyPickerTriggerProps & Pick<DropdownRootProps, 'open' | 'defaultOpen' | 'onOpenChange' | 'onEscapeKeyDown' | 'onInteractOutside'> & {
+    triggerProps?: CurrencyPickerTriggerProps;
+    contentProps?: Omit<DropdownContentProps, 'children'>;
+    optionsProps?: CurrencyPickerOptionsProps;
+};

package/dist/components/input/CurrencyPicker/types/CurrencyPickerRootProps.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+import { CurrencyPickerChangeEventDetails } from './CurrencyPickerChangeEventDetails';
+import { CurrencyPickerOption } from './CurrencyPickerOption';
+import { CurrencyPickerState } from './CurrencyPickerState';
+export type CurrencyPickerRootProps = {
+    currencies: readonly CurrencyPickerOption[];
+    value?: string | null;
+    defaultValue?: string | null;
+    onValueChange?: (value: string | null, eventDetails: CurrencyPickerChangeEventDetails) => void;
+    closeOnSelect?: boolean;
+    disabled?: boolean;
+    selectedFirst?: boolean;
+    getOptionLabel?: (currency: CurrencyPickerOption) => ReactNode;
+    getSearchText?: (currency: CurrencyPickerOption) => string;
+    renderValue?: (state: CurrencyPickerState) => ReactNode;
+    children: ReactNode | ((state: CurrencyPickerState) => ReactNode);
+};