@powerhousedao/design-system 6.0.0-dev.192 → 6.0.0-dev.194

package/dist/ui/components/search-autocomplete/search-autocomplete.js

@@ -6,7 +6,7 @@ import { useCallback, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ui/components/search-autocomplete/search-autocomplete.tsx
 const SearchAutocomplete = (props) => {
-	const { fetchOptions, onSelect, selectLabel = "Select", selectingContent, placeholder = "Search...", disabled = false, loading: externalLoading = false, className, renderOption, debounceMs = 300 } = props;
+	const { fetchOptions, onSelect, selectLabel = "Select", selectingContent, placeholder = "Search...", disabled = false, loading: externalLoading = false, className, renderOption, renderRow, keepOpenSelector, debounceMs = 300 } = props;
 	const { query, setQuery, results, isLoading, error, isOpen, setIsOpen, handleQueryChange } = useSearchAutocomplete({
 		fetchOptions,
 		debounceMs
@@ -78,46 +78,68 @@ const SearchAutocomplete = (props) => {
 				}), /* @__PURE__ */ jsx(PopoverContent, {
 					align: "start",
 					onOpenAutoFocus: (e) => e.preventDefault(),
-					onInteractOutside: () => setIsOpen(false),
-					className: "max-h-60 overflow-y-auto p-1",
-					children: results.map((option) => /* @__PURE__ */ jsxs("div", {
-						className: "flex items-center justify-between gap-2 rounded-md px-2 py-1.5 hover:bg-gray-100",
-						children: [renderOption ? /* @__PURE__ */ jsx("div", {
-							className: "min-w-0 flex-1",
-							children: renderOption(option)
-						}) : /* @__PURE__ */ jsxs("div", {
-							className: "min-w-0 flex-1",
-							children: [
-								/* @__PURE__ */ jsx("p", {
-									className: "truncate text-sm font-medium text-gray-900",
-									children: option.label
-								}),
-								option.version && /* @__PURE__ */ jsxs("p", {
-									className: "truncate text-xs text-gray-500",
-									children: ["v", option.version]
-								}),
-								option.description && /* @__PURE__ */ jsx("p", {
-									className: "truncate text-xs text-gray-500",
-									children: option.description
-								}),
-								option.meta && /* @__PURE__ */ jsx("p", {
-									className: "truncate text-xs text-gray-400",
-									children: option.meta
+					onInteractOutside: (e) => {
+						if (keepOpenSelector) {
+							if (e.target?.closest(keepOpenSelector)) {
+								e.preventDefault();
+								return;
+							}
+						}
+						setIsOpen(false);
+					},
+					className: "max-h-80 overflow-visible p-1",
+					children: /* @__PURE__ */ jsx("div", {
+						className: "max-h-80 overflow-y-auto",
+						children: results.map((option) => {
+							if (renderRow) return /* @__PURE__ */ jsx("div", {
+								className: "rounded-md",
+								children: renderRow(option, {
+									selectingValue,
+									selectLabel,
+									selectingContent,
+									handleSelect: (value) => void handleSelect(value)
 								})
-							]
-						}), selectingValue === option.value && selectingContent ? /* @__PURE__ */ jsx("div", {
-							className: "flex shrink-0 items-center justify-center",
-							children: selectingContent
-						}) : option.disabled ? /* @__PURE__ */ jsx("span", {
-							className: "shrink-0 rounded-md bg-gray-100 px-3 py-1 text-xs font-medium text-gray-500",
-							children: option.disabledLabel ?? "Unavailable"
-						}) : /* @__PURE__ */ jsx("button", {
-							onClick: () => void handleSelect(option.value),
-							disabled: selectingValue === option.value,
-							className: "shrink-0 rounded-md bg-gray-900 px-3 py-1 text-xs font-medium text-white transition-colors hover:bg-gray-800 disabled:opacity-50",
-							children: selectingValue === option.value ? "..." : selectLabel
-						})]
-					}, option.value))
+							}, option.value);
+							return /* @__PURE__ */ jsxs("div", {
+								className: "flex items-center justify-between gap-2 rounded-md px-2 py-1.5 hover:bg-gray-100",
+								children: [renderOption ? /* @__PURE__ */ jsx("div", {
+									className: "min-w-0 flex-1",
+									children: renderOption(option)
+								}) : /* @__PURE__ */ jsxs("div", {
+									className: "min-w-0 flex-1",
+									children: [
+										/* @__PURE__ */ jsx("p", {
+											className: "truncate text-sm font-medium text-gray-900",
+											children: option.label
+										}),
+										option.version && /* @__PURE__ */ jsxs("p", {
+											className: "truncate text-xs text-gray-500",
+											children: ["v", option.version]
+										}),
+										option.description && /* @__PURE__ */ jsx("p", {
+											className: "truncate text-xs text-gray-500",
+											children: option.description
+										}),
+										option.meta && /* @__PURE__ */ jsx("p", {
+											className: "truncate text-xs text-gray-400",
+											children: option.meta
+										})
+									]
+								}), selectingValue === option.value && selectingContent ? /* @__PURE__ */ jsx("div", {
+									className: "flex shrink-0 items-center justify-center",
+									children: selectingContent
+								}) : option.disabled ? /* @__PURE__ */ jsx("span", {
+									className: "shrink-0 rounded-md bg-gray-100 px-3 py-1 text-xs font-medium text-gray-500",
+									children: option.disabledLabel ?? "Unavailable"
+								}) : /* @__PURE__ */ jsx("button", {
+									onClick: () => void handleSelect(option.value),
+									disabled: selectingValue === option.value,
+									className: "shrink-0 rounded-md bg-gray-900 px-3 py-1 text-xs font-medium text-white transition-colors hover:bg-gray-800 disabled:opacity-50",
+									children: selectingValue === option.value ? "..." : selectLabel
+								})]
+							}, option.value);
+						})
+					})
 				})]
 			}),
 			loading && /* @__PURE__ */ jsx("p", {

package/dist/ui/components/search-autocomplete/search-autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"search-autocomplete.js","names":[],"sources":["../../../../src/ui/components/search-autocomplete/search-autocomplete.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport React, { useCallback, useState } from \"react\";\nimport { Input } from \"../input/input.js\";\nimport { Popover, PopoverAnchor, PopoverContent } from \"../popover/popover.js\";\nimport type { SearchAutocompleteProps } from \"./types.js\";\nimport { useSearchAutocomplete } from \"./use-search-autocomplete.js\";\n\nexport const SearchAutocomplete: React.FC<SearchAutocompleteProps> = (\n  props,\n) => {\n  const {\n    fetchOptions,\n    onSelect,\n    selectLabel = \"Select\",\n    selectingContent,\n    placeholder = \"Search...\",\n    disabled = false,\n    loading: externalLoading = false,\n    className,\n    renderOption,\n    debounceMs = 300,\n  } = props;\n\n  const {\n    query,\n    setQuery,\n    results,\n    isLoading,\n    error,\n    isOpen,\n    setIsOpen,\n    handleQueryChange,\n  } = useSearchAutocomplete({ fetchOptions, debounceMs });\n\n  const [selectingValue, setSelectingValue] = useState<string | null>(null);\n\n  const handleInputChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      handleQueryChange(e.target.value);\n    },\n    [handleQueryChange],\n  );\n\n  const handleSelect = useCallback(\n    async (value: string) => {\n      setSelectingValue(value);\n      try {\n        await onSelect(value);\n        setQuery(\"\");\n        setIsOpen(false);\n      } catch {\n        // error handled by caller\n      } finally {\n        setSelectingValue(null);\n      }\n    },\n    [onSelect, setQuery, setIsOpen],\n  );\n\n  const handleSubmit = useCallback(() => {\n    if (query.trim()) {\n      void handleSelect(query.trim());\n    }\n  }, [query, handleSelect]);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.key === \"Enter\") {\n        e.preventDefault();\n        if (!fetchOptions && query.trim()) {\n          handleSubmit();\n        }\n      }\n    },\n    [fetchOptions, query, handleSubmit],\n  );\n\n  const loading = isLoading || externalLoading;\n\n  // Fallback: plain text input + submit when no fetchOptions\n  if (!fetchOptions) {\n    return (\n      <div className={cn(\"flex items-center gap-2\", className)}>\n        <Input\n          value={query}\n          onChange={handleInputChange}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          disabled={disabled || selectingValue !== null}\n          className=\"max-w-xs text-gray-700\"\n        />\n        <button\n          onClick={handleSubmit}\n          disabled={disabled || !query.trim() || selectingValue !== null}\n          className=\"h-9 rounded-md bg-gray-900 px-4 text-sm font-semibold text-white transition-colors hover:bg-gray-800 disabled:cursor-not-allowed disabled:opacity-50\"\n        >\n          {selectLabel}\n        </button>\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn(\"relative\", className)}>\n      <Popover open={isOpen && results.length > 0} onOpenChange={setIsOpen}>\n        <PopoverAnchor asChild>\n          <Input\n            value={query}\n            onChange={handleInputChange}\n            onKeyDown={handleKeyDown}\n            placeholder={placeholder}\n            disabled={disabled}\n            className=\"max-w-xs text-gray-700\"\n          />\n        </PopoverAnchor>\n        <PopoverContent\n          align=\"start\"\n          onOpenAutoFocus={(e) => e.preventDefault()}\n          onInteractOutside={() => setIsOpen(false)}\n          className=\"max-h-60 overflow-y-auto p-1\"\n        >\n          {results.map((option) => (\n            <div\n              key={option.value}\n              className=\"flex items-center justify-between gap-2 rounded-md px-2 py-1.5 hover:bg-gray-100\"\n            >\n              {renderOption ? (\n                <div className=\"min-w-0 flex-1\">{renderOption(option)}</div>\n              ) : (\n                <div className=\"min-w-0 flex-1\">\n                  <p className=\"truncate text-sm font-medium text-gray-900\">\n                    {option.label}\n                  </p>\n                  {option.version && (\n                    <p className=\"truncate text-xs text-gray-500\">\n                      v{option.version}\n                    </p>\n                  )}\n                  {option.description && (\n                    <p className=\"truncate text-xs text-gray-500\">\n                      {option.description}\n                    </p>\n                  )}\n                  {option.meta && (\n                    <p className=\"truncate text-xs text-gray-400\">\n                      {option.meta}\n                    </p>\n                  )}\n                </div>\n              )}\n              {selectingValue === option.value && selectingContent ? (\n                <div className=\"flex shrink-0 items-center justify-center\">\n                  {selectingContent}\n                </div>\n              ) : option.disabled ? (\n                <span className=\"shrink-0 rounded-md bg-gray-100 px-3 py-1 text-xs font-medium text-gray-500\">\n                  {option.disabledLabel ?? \"Unavailable\"}\n                </span>\n              ) : (\n                <button\n                  onClick={() => void handleSelect(option.value)}\n                  disabled={selectingValue === option.value}\n                  className=\"shrink-0 rounded-md bg-gray-900 px-3 py-1 text-xs font-medium text-white transition-colors hover:bg-gray-800 disabled:opacity-50\"\n                >\n                  {selectingValue === option.value ? \"...\" : selectLabel}\n                </button>\n              )}\n            </div>\n          ))}\n        </PopoverContent>\n      </Popover>\n      {loading && <p className=\"mt-1 text-xs text-gray-500\">Searching...</p>}\n      {error && <p className=\"mt-1 text-xs text-red-600\">{error}</p>}\n      {!loading &&\n        !error &&\n        query.trim() &&\n        results.length === 0 &&\n        !isOpen && (\n          <p className=\"mt-1 text-xs text-gray-500\">No results found</p>\n        )}\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"search-autocomplete.js","names":[],"sources":["../../../../src/ui/components/search-autocomplete/search-autocomplete.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport React, { useCallback, useState } from \"react\";\nimport { Input } from \"../input/input.js\";\nimport { Popover, PopoverAnchor, PopoverContent } from \"../popover/popover.js\";\nimport type { SearchAutocompleteProps } from \"./types.js\";\nimport { useSearchAutocomplete } from \"./use-search-autocomplete.js\";\n\nexport const SearchAutocomplete: React.FC<SearchAutocompleteProps> = (\n  props,\n) => {\n  const {\n    fetchOptions,\n    onSelect,\n    selectLabel = \"Select\",\n    selectingContent,\n    placeholder = \"Search...\",\n    disabled = false,\n    loading: externalLoading = false,\n    className,\n    renderOption,\n    renderRow,\n    keepOpenSelector,\n    debounceMs = 300,\n  } = props;\n\n  const {\n    query,\n    setQuery,\n    results,\n    isLoading,\n    error,\n    isOpen,\n    setIsOpen,\n    handleQueryChange,\n  } = useSearchAutocomplete({ fetchOptions, debounceMs });\n\n  const [selectingValue, setSelectingValue] = useState<string | null>(null);\n\n  const handleInputChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      handleQueryChange(e.target.value);\n    },\n    [handleQueryChange],\n  );\n\n  const handleSelect = useCallback(\n    async (value: string) => {\n      setSelectingValue(value);\n      try {\n        await onSelect(value);\n        setQuery(\"\");\n        setIsOpen(false);\n      } catch {\n        // error handled by caller\n      } finally {\n        setSelectingValue(null);\n      }\n    },\n    [onSelect, setQuery, setIsOpen],\n  );\n\n  const handleSubmit = useCallback(() => {\n    if (query.trim()) {\n      void handleSelect(query.trim());\n    }\n  }, [query, handleSelect]);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.key === \"Enter\") {\n        e.preventDefault();\n        if (!fetchOptions && query.trim()) {\n          handleSubmit();\n        }\n      }\n    },\n    [fetchOptions, query, handleSubmit],\n  );\n\n  const loading = isLoading || externalLoading;\n\n  // Fallback: plain text input + submit when no fetchOptions\n  if (!fetchOptions) {\n    return (\n      <div className={cn(\"flex items-center gap-2\", className)}>\n        <Input\n          value={query}\n          onChange={handleInputChange}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          disabled={disabled || selectingValue !== null}\n          className=\"max-w-xs text-gray-700\"\n        />\n        <button\n          onClick={handleSubmit}\n          disabled={disabled || !query.trim() || selectingValue !== null}\n          className=\"h-9 rounded-md bg-gray-900 px-4 text-sm font-semibold text-white transition-colors hover:bg-gray-800 disabled:cursor-not-allowed disabled:opacity-50\"\n        >\n          {selectLabel}\n        </button>\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn(\"relative\", className)}>\n      <Popover open={isOpen && results.length > 0} onOpenChange={setIsOpen}>\n        <PopoverAnchor asChild>\n          <Input\n            value={query}\n            onChange={handleInputChange}\n            onKeyDown={handleKeyDown}\n            placeholder={placeholder}\n            disabled={disabled}\n            className=\"max-w-xs text-gray-700\"\n          />\n        </PopoverAnchor>\n        <PopoverContent\n          align=\"start\"\n          onOpenAutoFocus={(e) => e.preventDefault()}\n          onInteractOutside={(e) => {\n            if (keepOpenSelector) {\n              const target = e.target as HTMLElement | null;\n              if (target?.closest(keepOpenSelector)) {\n                e.preventDefault();\n                return;\n              }\n            }\n            setIsOpen(false);\n          }}\n          className=\"max-h-80 overflow-visible p-1\"\n        >\n          <div className=\"max-h-80 overflow-y-auto\">\n            {results.map((option) => {\n              if (renderRow) {\n                return (\n                  <div key={option.value} className=\"rounded-md\">\n                    {renderRow(option, {\n                      selectingValue,\n                      selectLabel,\n                      selectingContent,\n                      handleSelect: (value) => void handleSelect(value),\n                    })}\n                  </div>\n                );\n              }\n              return (\n                <div\n                  key={option.value}\n                  className=\"flex items-center justify-between gap-2 rounded-md px-2 py-1.5 hover:bg-gray-100\"\n                >\n                  {renderOption ? (\n                    <div className=\"min-w-0 flex-1\">{renderOption(option)}</div>\n                  ) : (\n                    <div className=\"min-w-0 flex-1\">\n                      <p className=\"truncate text-sm font-medium text-gray-900\">\n                        {option.label}\n                      </p>\n                      {option.version && (\n                        <p className=\"truncate text-xs text-gray-500\">\n                          v{option.version}\n                        </p>\n                      )}\n                      {option.description && (\n                        <p className=\"truncate text-xs text-gray-500\">\n                          {option.description}\n                        </p>\n                      )}\n                      {option.meta && (\n                        <p className=\"truncate text-xs text-gray-400\">\n                          {option.meta}\n                        </p>\n                      )}\n                    </div>\n                  )}\n                  {selectingValue === option.value && selectingContent ? (\n                    <div className=\"flex shrink-0 items-center justify-center\">\n                      {selectingContent}\n                    </div>\n                  ) : option.disabled ? (\n                    <span className=\"shrink-0 rounded-md bg-gray-100 px-3 py-1 text-xs font-medium text-gray-500\">\n                      {option.disabledLabel ?? \"Unavailable\"}\n                    </span>\n                  ) : (\n                    <button\n                      onClick={() => void handleSelect(option.value)}\n                      disabled={selectingValue === option.value}\n                      className=\"shrink-0 rounded-md bg-gray-900 px-3 py-1 text-xs font-medium text-white transition-colors hover:bg-gray-800 disabled:opacity-50\"\n                    >\n                      {selectingValue === option.value ? \"...\" : selectLabel}\n                    </button>\n                  )}\n                </div>\n              );\n            })}\n          </div>\n        </PopoverContent>\n      </Popover>\n      {loading && <p className=\"mt-1 text-xs text-gray-500\">Searching...</p>}\n      {error && <p className=\"mt-1 text-xs text-red-600\">{error}</p>}\n      {!loading &&\n        !error &&\n        query.trim() &&\n        results.length === 0 &&\n        !isOpen && (\n          <p className=\"mt-1 text-xs text-gray-500\">No results found</p>\n        )}\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/ui/components/search-autocomplete/types.d.ts

@@ -1,2 +1,2 @@
-import { n as SearchAutocompleteProps, t as SearchAutocompleteOption } from "../../../types-bVze9lWE.js";
-export { SearchAutocompleteOption, SearchAutocompleteProps };
+import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-BghCtHb5.js";
+export { SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext };

package/dist/ui/components/search-autocomplete/use-search-autocomplete.d.ts

@@ -1,2 +1,2 @@
-import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-pbku_c5c.js";
+import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-DNPhMdWQ.js";
 export { useSearchAutocomplete };

package/dist/ui/index.d.ts

@@ -5,9 +5,9 @@ import { n as CharacterCounterProps, t as CharacterCounter } from "../character-
 import { n as CheckboxValue, t as CheckboxBase } from "../checkbox-base-C0Sa2qHx.js";
 import { n as CheckboxProps, t as Checkbox } from "../checkbox-Bv_YDLcz.js";
 import { a as CommandItem, i as CommandInput, n as CommandEmpty, o as CommandList, r as CommandGroup, s as CommandLoading, t as Command } from "../command-Cl1OUbPV.js";
-import { n as RadioGroupFieldProps, t as RadioGroupField } from "../radio-group-field-DFgVrg3h.js";
+import { n as RadioGroupFieldProps, t as RadioGroupField } from "../radio-group-field-B6LrhnJT.js";
 import { n as SelectFieldProps, r as SelectFieldRaw, t as SelectField } from "../select-field-C_81MbUi.js";
-import { n as EnumFieldProps, t as EnumField } from "../enum-field-CSZlPqip.js";
+import { n as EnumFieldProps, t as EnumField } from "../enum-field-B0CAB18I.js";
 import { n as FormDescriptionProps, t as FormDescription } from "../form-description-BBEpOsuH.js";
 import { t as FormGroup } from "../form-group-D641xIKN.js";
 import { n as FormLabelProps, t as FormLabel } from "../form-label-Cc-YoYR-.js";
@@ -26,9 +26,9 @@ import { t as JsonViewer } from "../json-viewer-zv7cXvwi.js";
 import { i as PopoverTrigger, n as PopoverAnchor, r as PopoverContent, t as Popover } from "../popover-DRMntq2i.js";
 import { n as RadioGroup, t as CustomizableRadioGroupProps } from "../radio-group-GvfMKNQZ.js";
 import { n as RadioProps, t as Radio } from "../radio-BDfOgBkg.js";
-import { n as SearchAutocompleteProps, t as SearchAutocompleteOption } from "../types-bVze9lWE.js";
-import { t as SearchAutocomplete } from "../search-autocomplete-BwP4baRe.js";
-import { t as useSearchAutocomplete } from "../use-search-autocomplete-pbku_c5c.js";
+import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../types-BghCtHb5.js";
+import { t as SearchAutocomplete } from "../search-autocomplete-C8QQB3YW.js";
+import { t as useSearchAutocomplete } from "../use-search-autocomplete-DNPhMdWQ.js";
 import { t as Content } from "../content-Dp_nWlIb.js";
 import { t as SelectedContent } from "../selected-content-CsFTuaAl.js";
 import { n as TextInputProps, t as TextInput } from "../text-input-w89uEGpc.js";
@@ -36,4 +36,4 @@ import { n as TextFieldProps, t as TextField } from "../text-field-CEhBGNfC.js";
 import { a as TooltipProps, i as TooltipContent, n as Root, o as Trigger, r as Tooltip, t as Provider } from "../tooltip-VNGD7wwV.js";
 import { t as ValueTransformer } from "../value-transformer-BRCYfgm2.js";
 import { n as withFieldValidation, t as ValidationOptions } from "../with-field-validation-C9GkWcIc.js";
-export { Amount, AmountCrypto, AmountCurrency, AmountFiat, AmountInputPropsGeneric, AmountPercentage, AmountValue, Button, ButtonProps, CharacterCounter, CharacterCounterProps, Checkbox, CheckboxBase, CheckboxProps, CheckboxValue, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, Content, Currency, CurrencyTicker, CustomizableRadioGroupProps, DateFieldValue, DatePickerView, DiffMode, EnumField, EnumFieldProps, ErrorMessage, FieldErrorHandling, Form, FormDescription, FormDescriptionProps, FormGroup, FormLabel, FormLabelProps, FormMessage, FormMessageList, FormMessageProps, FormMessageType, FormServerErrorMessage, IdAutocomplete, IdAutocompleteInputContainer, IdAutocompleteInputContainerProps, IdAutocompleteList, IdAutocompleteListOption, IdAutocompleteListOptionProps, IdAutocompleteListProps, IdAutocompleteOption, IdAutocompleteProps, Input, InputBaseProps, InputProps, JsonViewer, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Radio, RadioGroup, RadioGroupField, RadioGroupFieldProps, RadioGroupProps, RadioProps, SearchAutocomplete, SearchAutocompleteOption, SearchAutocompleteProps, SelectBaseProps, SelectField, SelectFieldProps, SelectFieldRaw, SelectOption, SelectProps, SelectedContent, SplittedInputDiff, TextField, TextFieldProps, TextInput, TextInputProps, Tooltip, TooltipContent, TooltipProps, Provider as TooltipProvider, Root as TooltipRoot, Trigger as TooltipTrigger, TransformerObject, TransformerTrigger, TransformerType, ValidationOptions, ValidatorHandler, ValidatorResult, ValueTransformer, ValueTransformerFn, ValueTransformerProps, ViewMode, WeekStartDayNumber, WithDifference, buttonVariants, useIdAutocomplete, useSearchAutocomplete, withFieldValidation };
+export { Amount, AmountCrypto, AmountCurrency, AmountFiat, AmountInputPropsGeneric, AmountPercentage, AmountValue, Button, ButtonProps, CharacterCounter, CharacterCounterProps, Checkbox, CheckboxBase, CheckboxProps, CheckboxValue, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, Content, Currency, CurrencyTicker, CustomizableRadioGroupProps, DateFieldValue, DatePickerView, DiffMode, EnumField, EnumFieldProps, ErrorMessage, FieldErrorHandling, Form, FormDescription, FormDescriptionProps, FormGroup, FormLabel, FormLabelProps, FormMessage, FormMessageList, FormMessageProps, FormMessageType, FormServerErrorMessage, IdAutocomplete, IdAutocompleteInputContainer, IdAutocompleteInputContainerProps, IdAutocompleteList, IdAutocompleteListOption, IdAutocompleteListOptionProps, IdAutocompleteListProps, IdAutocompleteOption, IdAutocompleteProps, Input, InputBaseProps, InputProps, JsonViewer, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Radio, RadioGroup, RadioGroupField, RadioGroupFieldProps, RadioGroupProps, RadioProps, SearchAutocomplete, SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext, SelectBaseProps, SelectField, SelectFieldProps, SelectFieldRaw, SelectOption, SelectProps, SelectedContent, SplittedInputDiff, TextField, TextFieldProps, TextInput, TextInputProps, Tooltip, TooltipContent, TooltipProps, Provider as TooltipProvider, Root as TooltipRoot, Trigger as TooltipTrigger, TransformerObject, TransformerTrigger, TransformerType, ValidationOptions, ValidatorHandler, ValidatorResult, ValueTransformer, ValueTransformerFn, ValueTransformerProps, ViewMode, WeekStartDayNumber, WithDifference, buttonVariants, useIdAutocomplete, useSearchAutocomplete, withFieldValidation };

package/dist/{use-search-autocomplete-pbku_c5c.d.ts → use-search-autocomplete-DNPhMdWQ.d.ts}

@@ -1,4 +1,4 @@
-import { t as SearchAutocompleteOption } from "./types-bVze9lWE.js";
+import { t as SearchAutocompleteOption } from "./types-BghCtHb5.js";
 import * as react from "react";
 
 //#region src/ui/components/search-autocomplete/use-search-autocomplete.d.ts
@@ -18,4 +18,4 @@ declare function useSearchAutocomplete(options: UseSearchAutocompleteOptions): {
 };
 //#endregion
 export { useSearchAutocomplete as t };
-//# sourceMappingURL=use-search-autocomplete-pbku_c5c.d.ts.map
+//# sourceMappingURL=use-search-autocomplete-DNPhMdWQ.d.ts.map

package/dist/{use-search-autocomplete-pbku_c5c.d.ts.map → use-search-autocomplete-DNPhMdWQ.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"use-search-autocomplete-pbku_c5c.d.ts","names":[],"sources":["../src/ui/components/search-autocomplete/use-search-autocomplete.ts"],"mappings":";;;;UAGU,4BAAA;EACR,YAAA,IAAgB,KAAA,aAAkB,OAAA,CAAQ,wBAAA;EAC1C,UAAA;AAAA;AAAA,iBAGc,qBAAA,CAAsB,OAAA,EAAS,4BAAA;;2BAA4B,KAAA,CAAA,cAAA"}
+{"version":3,"file":"use-search-autocomplete-DNPhMdWQ.d.ts","names":[],"sources":["../src/ui/components/search-autocomplete/use-search-autocomplete.ts"],"mappings":";;;;UAGU,4BAAA;EACR,YAAA,IAAgB,KAAA,aAAkB,OAAA,CAAQ,wBAAA;EAC1C,UAAA;AAAA;AAAA,iBAGc,qBAAA,CAAsB,OAAA,EAAS,4BAAA;;2BAA4B,KAAA,CAAA,cAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@powerhousedao/design-system",
-  "version": "6.0.0-dev.192",
+  "version": "6.0.0-dev.194",
   "description": "",
   "files": [
     "dist",
@@ -96,7 +96,7 @@
     "tsdown": "0.21.1",
     "vite": "8.0.8",
     "vitest": "4.1.1",
-    "@powerhousedao/config": "6.0.0-dev.192"
+    "@powerhousedao/config": "6.0.0-dev.194"
   },
   "peerDependencies": {
     "react": ">=19.0.0",
@@ -131,9 +131,9 @@
     "tailwind-merge": "3.4.0",
     "tsx": "4.21.0",
     "usehooks-ts": "^3.1.1",
-    "document-model": "6.0.0-dev.192",
-    "@powerhousedao/reactor-browser": "6.0.0-dev.192",
-    "@powerhousedao/shared": "6.0.0-dev.192"
+    "@powerhousedao/reactor-browser": "6.0.0-dev.194",
+    "@powerhousedao/shared": "6.0.0-dev.194",
+    "document-model": "6.0.0-dev.194"
   },
   "scripts": {
     "tsc": "tsc",