@powerhousedao/design-system 6.1.0-dev.2 → 6.1.0-dev.20

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

@@ -1,4 +1,3 @@
-import { t as cn } from "../../../src-BgCjYazJ.js";
 import { FormLabel } from "../form-label/form-label.js";
 import { FormMessageList } from "../form-message/message-list.js";
 import { FormDescription } from "../form-description/form-description.js";
@@ -12,6 +11,7 @@ import { IdAutocompleteListOption } from "./id-autocomplete-list-option.js";
 import { IdAutocompleteList } from "./id-autocomplete-list.js";
 import { useIdAutocomplete } from "./use-id-autocomplete.js";
 import React, { useId, useMemo, useRef } from "react";
+import { twMerge } from "tailwind-merge";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Command } from "cmdk";
 //#region src/ui/components/id-autocomplete/id-autocomplete.tsx
@@ -62,7 +62,7 @@ const IdAutocomplete = /* @__PURE__ */ React.forwardRef(({ id: idProp, name, cla
 				shouldFilter: false,
 				value: commandValue,
 				onValueChange: handleCommandValue,
-				className: cn("bg-gray-100 dark:bg-charcoal-900"),
+				className: twMerge("bg-gray-100 dark:bg-slate-700"),
 				children: [
 					/* @__PURE__ */ jsx(PopoverAnchor, {
 						asChild: true,
@@ -102,7 +102,7 @@ const IdAutocomplete = /* @__PURE__ */ React.forwardRef(({ id: idProp, name, cla
 						isLoadingSelectedOption,
 						handleFetchSelectedOption: fetchSelectedOptionCallback ? handleFetchSelectedOption : void 0,
 						isFetchSelectedOptionSync,
-						className: cn("rounded-t-none pt-2")
+						className: twMerge("rounded-t-none pt-2")
 					}) : /* @__PURE__ */ jsx(IdAutocompleteListOption, {
 						variant,
 						icon: selectedOption?.icon ?? previewPlaceholder?.icon,
@@ -115,7 +115,7 @@ const IdAutocomplete = /* @__PURE__ */ React.forwardRef(({ id: idProp, name, cla
 						isLoadingSelectedOption,
 						handleFetchSelectedOption: fetchSelectedOptionCallback ? handleFetchSelectedOption : void 0,
 						isFetchSelectedOptionSync,
-						className: cn("rounded-t-none pt-2")
+						className: twMerge("rounded-t-none pt-2")
 					})),
 					/* @__PURE__ */ jsx(PopoverContent, {
 						align: "start",

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

@@ -1 +1 @@
-{"version":3,"file":"id-autocomplete.js","names":["cn","sharedValueTransformers","Command","React","useId","useMemo","useRef","FormDescription","FormGroup","FormLabel","FormMessageList","Input","Popover","PopoverAnchor","PopoverContent","ValueTransformer","IdAutocompleteInputContainer","IdAutocompleteListOption","IdAutocompleteList","useIdAutocomplete","IdAutocomplete","forwardRef","id","idProp","name","className","label","description","value","defaultValue","disabled","placeholder","required","errors","warnings","onChange","onBlur","onClick","onKeyDown","onMouseDown","autoComplete","variant","maxLength","fetchOptionsCallback","fetchSelectedOptionCallback","isOpenByDefault","initialOptions","renderOption","previewPlaceholder","props","ref","prefix","inputRef","mergedRef","node","current","hasWarning","Array","isArray","length","hasError","selectedValue","selectedOption","isPopoverOpen","commandListRef","options","isLoading","isLoadingSelectedOption","haveFetchError","commandValue","isFetchSelectedOptionSync","toggleOption","handleOpenChange","onTriggerBlur","handleChange","handleCommandValue","handleFetchSelectedOption","handlePaste","fetchOptions","fetchSelectedOption","handleOptionSelection","optionValue","focus","asCard","transformers","trimOnBlur","trimOnEnter","e","preventDefault","target","control","undefined","asPlaceholder","showValue","icon","title","path","Element","displayName"],"sources":["../../../../src/ui/components/id-autocomplete/id-autocomplete.tsx"],"sourcesContent":["import type { TransformerType } from \"#design-system\";\nimport { cn } from \"#design-system\";\nimport { sharedValueTransformers } from \"#design-system/ui/lib\";\nimport { Command } from \"cmdk\";\nimport React, { useId, useMemo, useRef } from \"react\";\nimport { FormDescription } from \"../form-description/form-description.js\";\nimport { FormGroup } from \"../form-group/form-group.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { Input } from \"../input/input.js\";\nimport { Popover, PopoverAnchor, PopoverContent } from \"../popover/popover.js\";\nimport { ValueTransformer } from \"../value-transformer/value-transformer.js\";\nimport { IdAutocompleteInputContainer } from \"./id-autocomplete-input-container.js\";\nimport { IdAutocompleteListOption } from \"./id-autocomplete-list-option.js\";\nimport { IdAutocompleteList } from \"./id-autocomplete-list.js\";\nimport type { IdAutocompleteProps } from \"./types.js\";\nimport { useIdAutocomplete } from \"./use-id-autocomplete.js\";\n\nconst IdAutocomplete = React.forwardRef<HTMLInputElement, IdAutocompleteProps>(\n  (\n    {\n      id: idProp,\n      name,\n      className,\n      label,\n      description,\n      value,\n      defaultValue,\n      disabled,\n      placeholder,\n      required,\n      errors,\n      warnings,\n      onChange,\n      onBlur,\n      onClick,\n      onKeyDown,\n      onMouseDown,\n      autoComplete = true,\n      variant = \"withValue\",\n      maxLength,\n      fetchOptionsCallback,\n      fetchSelectedOptionCallback,\n      isOpenByDefault, // to be used only in stories\n      initialOptions,\n      renderOption,\n      previewPlaceholder,\n      ...props\n    },\n    ref,\n  ) => {\n    const prefix = useId();\n    const id = idProp ?? `${prefix}-id-autocomplete`;\n    const inputRef = useRef<HTMLInputElement | null>(null);\n\n    const mergedRef = (node: HTMLInputElement | null) => {\n      inputRef.current = node;\n      if (typeof ref === \"function\") {\n        ref(node);\n      } else if (ref) {\n        ref.current = node;\n      }\n    };\n\n    const hasWarning = Array.isArray(warnings) && warnings.length > 0;\n    const hasError = Array.isArray(errors) && errors.length > 0;\n\n    const {\n      selectedValue,\n      selectedOption,\n      isPopoverOpen,\n      commandListRef,\n      options,\n      isLoading,\n      isLoadingSelectedOption,\n      haveFetchError,\n      commandValue,\n      isFetchSelectedOptionSync,\n      toggleOption,\n      handleOpenChange,\n      onTriggerBlur,\n      handleChange,\n      handleCommandValue,\n      handleFetchSelectedOption,\n      handlePaste,\n    } = useIdAutocomplete({\n      autoComplete,\n      defaultValue,\n      value,\n      isOpenByDefault,\n      initialOptions,\n      onChange,\n      onBlur,\n      fetchOptions: fetchOptionsCallback,\n      fetchSelectedOption: fetchSelectedOptionCallback,\n    });\n\n    const handleOptionSelection = (optionValue: string) => {\n      toggleOption(optionValue);\n      inputRef.current?.focus();\n    };\n\n    const asCard =\n      variant === \"withValueAndTitle\" ||\n      variant === \"withValueTitleAndDescription\";\n\n    const transformers: TransformerType = useMemo(\n      () => [\n        sharedValueTransformers.trimOnBlur(),\n        sharedValueTransformers.trimOnEnter(),\n      ],\n      [],\n    );\n\n    return (\n      <FormGroup>\n        {!!label && (\n          <FormLabel\n            htmlFor={id}\n            disabled={disabled}\n            hasError={hasError}\n            required={required}\n            onClick={(e) => {\n              e.preventDefault();\n              (e.target as HTMLLabelElement).control?.focus();\n            }}\n          >\n            {label}\n          </FormLabel>\n        )}\n        {autoComplete && fetchOptionsCallback ? (\n          <Popover open={isPopoverOpen} onOpenChange={handleOpenChange}>\n            <Command\n              shouldFilter={false}\n              value={commandValue}\n              onValueChange={handleCommandValue}\n              className={cn(\"bg-gray-100 dark:bg-charcoal-900\")}\n            >\n              <PopoverAnchor asChild={true}>\n                <IdAutocompleteInputContainer\n                  id={id}\n                  name={name}\n                  value={selectedValue}\n                  className={className}\n                  isLoading={isLoading}\n                  haveFetchError={haveFetchError}\n                  disabled={disabled}\n                  onChange={handleChange}\n                  onBlur={onTriggerBlur}\n                  onClick={onClick}\n                  selectedOption={selectedOption}\n                  optionsLength={options.length}\n                  handleOpenChange={handleOpenChange}\n                  onKeyDown={onKeyDown}\n                  onMouseDown={onMouseDown}\n                  placeholder={placeholder}\n                  hasError={hasError}\n                  label={label}\n                  required={required}\n                  isPopoverOpen={isPopoverOpen}\n                  maxLength={maxLength}\n                  handlePaste={handlePaste}\n                  {...props}\n                  ref={mergedRef}\n                />\n              </PopoverAnchor>\n              {asCard &&\n                (renderOption ? (\n                  renderOption(\n                    selectedOption === undefined && previewPlaceholder\n                      ? {\n                          ...previewPlaceholder,\n                        }\n                      : {\n                          ...selectedOption,\n                          value: selectedOption?.value ?? \"\",\n                        },\n                    {\n                      asPlaceholder: selectedOption === undefined,\n                      showValue: false,\n                      isLoadingSelectedOption,\n                      handleFetchSelectedOption: fetchSelectedOptionCallback\n                        ? handleFetchSelectedOption\n                        : undefined,\n                      isFetchSelectedOptionSync,\n                      className: cn(\"rounded-t-none pt-2\"),\n                    },\n                  )\n                ) : (\n                  <IdAutocompleteListOption\n                    variant={variant}\n                    icon={selectedOption?.icon ?? previewPlaceholder?.icon}\n                    title={selectedOption?.title ?? previewPlaceholder?.title}\n                    path={selectedOption?.path ?? previewPlaceholder?.path}\n                    value={\n                      selectedOption?.value ?? previewPlaceholder?.value ?? \"\"\n                    }\n                    description={\n                      selectedOption?.description ??\n                      previewPlaceholder?.description\n                    }\n                    asPlaceholder={selectedOption === undefined}\n                    showValue={false}\n                    isLoadingSelectedOption={isLoadingSelectedOption}\n                    handleFetchSelectedOption={\n                      fetchSelectedOptionCallback\n                        ? handleFetchSelectedOption\n                        : undefined\n                    }\n                    isFetchSelectedOptionSync={isFetchSelectedOptionSync}\n                    className={cn(\"rounded-t-none pt-2\")}\n                  />\n                ))}\n              <PopoverContent\n                align=\"start\"\n                onOpenAutoFocus={(e) => e.preventDefault()}\n                onInteractOutside={(e) => {\n                  if (e.target instanceof Element && e.target.id === id) {\n                    e.preventDefault();\n                  }\n                }}\n              >\n                <IdAutocompleteList\n                  variant={variant}\n                  commandListRef={commandListRef}\n                  selectedValue={selectedValue}\n                  options={options}\n                  toggleOption={handleOptionSelection}\n                  renderOption={renderOption}\n                  previewPlaceholder={previewPlaceholder}\n                />\n              </PopoverContent>\n            </Command>\n          </Popover>\n        ) : (\n          <ValueTransformer transformers={transformers}>\n            <Input\n              id={id}\n              name={name}\n              value={selectedValue}\n              className={className}\n              disabled={disabled}\n              onChange={handleChange}\n              onBlur={onBlur}\n              onClick={onClick}\n              onMouseDown={onMouseDown}\n              placeholder={placeholder}\n              aria-invalid={hasError}\n              aria-label={!label ? \"Id Autocomplete\" : undefined}\n              aria-required={required}\n              maxLength={maxLength}\n              {...props}\n              ref={mergedRef}\n            />\n          </ValueTransformer>\n        )}\n        {!!description && <FormDescription>{description}</FormDescription>}\n        {hasWarning && <FormMessageList messages={warnings} type=\"warning\" />}\n        {hasError && <FormMessageList messages={errors} type=\"error\" />}\n      </FormGroup>\n    );\n  },\n);\n\nIdAutocomplete.displayName = \"IdAutocomplete\";\n\nexport { IdAutocomplete };\n"],"mappings":"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"}
+{"version":3,"file":"id-autocomplete.js","names":["twMerge","sharedValueTransformers","Command","React","useId","useMemo","useRef","FormDescription","FormGroup","FormLabel","FormMessageList","Input","Popover","PopoverAnchor","PopoverContent","ValueTransformer","IdAutocompleteInputContainer","IdAutocompleteListOption","IdAutocompleteList","useIdAutocomplete","IdAutocomplete","forwardRef","id","idProp","name","className","label","description","value","defaultValue","disabled","placeholder","required","errors","warnings","onChange","onBlur","onClick","onKeyDown","onMouseDown","autoComplete","variant","maxLength","fetchOptionsCallback","fetchSelectedOptionCallback","isOpenByDefault","initialOptions","renderOption","previewPlaceholder","props","ref","prefix","inputRef","mergedRef","node","current","hasWarning","Array","isArray","length","hasError","selectedValue","selectedOption","isPopoverOpen","commandListRef","options","isLoading","isLoadingSelectedOption","haveFetchError","commandValue","isFetchSelectedOptionSync","toggleOption","handleOpenChange","onTriggerBlur","handleChange","handleCommandValue","handleFetchSelectedOption","handlePaste","fetchOptions","fetchSelectedOption","handleOptionSelection","optionValue","focus","asCard","transformers","trimOnBlur","trimOnEnter","e","preventDefault","target","control","undefined","asPlaceholder","showValue","icon","title","path","Element","displayName"],"sources":["../../../../src/ui/components/id-autocomplete/id-autocomplete.tsx"],"sourcesContent":["import type { TransformerType } from \"#design-system\";\nimport { twMerge } from \"tailwind-merge\";\nimport { sharedValueTransformers } from \"#design-system/ui/lib\";\nimport { Command } from \"cmdk\";\nimport React, { useId, useMemo, useRef } from \"react\";\nimport { FormDescription } from \"../form-description/form-description.js\";\nimport { FormGroup } from \"../form-group/form-group.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { Input } from \"../input/input.js\";\nimport { Popover, PopoverAnchor, PopoverContent } from \"../popover/popover.js\";\nimport { ValueTransformer } from \"../value-transformer/value-transformer.js\";\nimport { IdAutocompleteInputContainer } from \"./id-autocomplete-input-container.js\";\nimport { IdAutocompleteListOption } from \"./id-autocomplete-list-option.js\";\nimport { IdAutocompleteList } from \"./id-autocomplete-list.js\";\nimport type { IdAutocompleteProps } from \"./types.js\";\nimport { useIdAutocomplete } from \"./use-id-autocomplete.js\";\n\nconst IdAutocomplete = React.forwardRef<HTMLInputElement, IdAutocompleteProps>(\n  (\n    {\n      id: idProp,\n      name,\n      className,\n      label,\n      description,\n      value,\n      defaultValue,\n      disabled,\n      placeholder,\n      required,\n      errors,\n      warnings,\n      onChange,\n      onBlur,\n      onClick,\n      onKeyDown,\n      onMouseDown,\n      autoComplete = true,\n      variant = \"withValue\",\n      maxLength,\n      fetchOptionsCallback,\n      fetchSelectedOptionCallback,\n      isOpenByDefault, // to be used only in stories\n      initialOptions,\n      renderOption,\n      previewPlaceholder,\n      ...props\n    },\n    ref,\n  ) => {\n    const prefix = useId();\n    const id = idProp ?? `${prefix}-id-autocomplete`;\n    const inputRef = useRef<HTMLInputElement | null>(null);\n\n    const mergedRef = (node: HTMLInputElement | null) => {\n      inputRef.current = node;\n      if (typeof ref === \"function\") {\n        ref(node);\n      } else if (ref) {\n        ref.current = node;\n      }\n    };\n\n    const hasWarning = Array.isArray(warnings) && warnings.length > 0;\n    const hasError = Array.isArray(errors) && errors.length > 0;\n\n    const {\n      selectedValue,\n      selectedOption,\n      isPopoverOpen,\n      commandListRef,\n      options,\n      isLoading,\n      isLoadingSelectedOption,\n      haveFetchError,\n      commandValue,\n      isFetchSelectedOptionSync,\n      toggleOption,\n      handleOpenChange,\n      onTriggerBlur,\n      handleChange,\n      handleCommandValue,\n      handleFetchSelectedOption,\n      handlePaste,\n    } = useIdAutocomplete({\n      autoComplete,\n      defaultValue,\n      value,\n      isOpenByDefault,\n      initialOptions,\n      onChange,\n      onBlur,\n      fetchOptions: fetchOptionsCallback,\n      fetchSelectedOption: fetchSelectedOptionCallback,\n    });\n\n    const handleOptionSelection = (optionValue: string) => {\n      toggleOption(optionValue);\n      inputRef.current?.focus();\n    };\n\n    const asCard =\n      variant === \"withValueAndTitle\" ||\n      variant === \"withValueTitleAndDescription\";\n\n    const transformers: TransformerType = useMemo(\n      () => [\n        sharedValueTransformers.trimOnBlur(),\n        sharedValueTransformers.trimOnEnter(),\n      ],\n      [],\n    );\n\n    return (\n      <FormGroup>\n        {!!label && (\n          <FormLabel\n            htmlFor={id}\n            disabled={disabled}\n            hasError={hasError}\n            required={required}\n            onClick={(e) => {\n              e.preventDefault();\n              (e.target as HTMLLabelElement).control?.focus();\n            }}\n          >\n            {label}\n          </FormLabel>\n        )}\n        {autoComplete && fetchOptionsCallback ? (\n          <Popover open={isPopoverOpen} onOpenChange={handleOpenChange}>\n            <Command\n              shouldFilter={false}\n              value={commandValue}\n              onValueChange={handleCommandValue}\n              className={twMerge(\"bg-gray-100 dark:bg-slate-700\")}\n            >\n              <PopoverAnchor asChild={true}>\n                <IdAutocompleteInputContainer\n                  id={id}\n                  name={name}\n                  value={selectedValue}\n                  className={className}\n                  isLoading={isLoading}\n                  haveFetchError={haveFetchError}\n                  disabled={disabled}\n                  onChange={handleChange}\n                  onBlur={onTriggerBlur}\n                  onClick={onClick}\n                  selectedOption={selectedOption}\n                  optionsLength={options.length}\n                  handleOpenChange={handleOpenChange}\n                  onKeyDown={onKeyDown}\n                  onMouseDown={onMouseDown}\n                  placeholder={placeholder}\n                  hasError={hasError}\n                  label={label}\n                  required={required}\n                  isPopoverOpen={isPopoverOpen}\n                  maxLength={maxLength}\n                  handlePaste={handlePaste}\n                  {...props}\n                  ref={mergedRef}\n                />\n              </PopoverAnchor>\n              {asCard &&\n                (renderOption ? (\n                  renderOption(\n                    selectedOption === undefined && previewPlaceholder\n                      ? {\n                          ...previewPlaceholder,\n                        }\n                      : {\n                          ...selectedOption,\n                          value: selectedOption?.value ?? \"\",\n                        },\n                    {\n                      asPlaceholder: selectedOption === undefined,\n                      showValue: false,\n                      isLoadingSelectedOption,\n                      handleFetchSelectedOption: fetchSelectedOptionCallback\n                        ? handleFetchSelectedOption\n                        : undefined,\n                      isFetchSelectedOptionSync,\n                      className: twMerge(\"rounded-t-none pt-2\"),\n                    },\n                  )\n                ) : (\n                  <IdAutocompleteListOption\n                    variant={variant}\n                    icon={selectedOption?.icon ?? previewPlaceholder?.icon}\n                    title={selectedOption?.title ?? previewPlaceholder?.title}\n                    path={selectedOption?.path ?? previewPlaceholder?.path}\n                    value={\n                      selectedOption?.value ?? previewPlaceholder?.value ?? \"\"\n                    }\n                    description={\n                      selectedOption?.description ??\n                      previewPlaceholder?.description\n                    }\n                    asPlaceholder={selectedOption === undefined}\n                    showValue={false}\n                    isLoadingSelectedOption={isLoadingSelectedOption}\n                    handleFetchSelectedOption={\n                      fetchSelectedOptionCallback\n                        ? handleFetchSelectedOption\n                        : undefined\n                    }\n                    isFetchSelectedOptionSync={isFetchSelectedOptionSync}\n                    className={twMerge(\"rounded-t-none pt-2\")}\n                  />\n                ))}\n              <PopoverContent\n                align=\"start\"\n                onOpenAutoFocus={(e) => e.preventDefault()}\n                onInteractOutside={(e) => {\n                  if (e.target instanceof Element && e.target.id === id) {\n                    e.preventDefault();\n                  }\n                }}\n              >\n                <IdAutocompleteList\n                  variant={variant}\n                  commandListRef={commandListRef}\n                  selectedValue={selectedValue}\n                  options={options}\n                  toggleOption={handleOptionSelection}\n                  renderOption={renderOption}\n                  previewPlaceholder={previewPlaceholder}\n                />\n              </PopoverContent>\n            </Command>\n          </Popover>\n        ) : (\n          <ValueTransformer transformers={transformers}>\n            <Input\n              id={id}\n              name={name}\n              value={selectedValue}\n              className={className}\n              disabled={disabled}\n              onChange={handleChange}\n              onBlur={onBlur}\n              onClick={onClick}\n              onMouseDown={onMouseDown}\n              placeholder={placeholder}\n              aria-invalid={hasError}\n              aria-label={!label ? \"Id Autocomplete\" : undefined}\n              aria-required={required}\n              maxLength={maxLength}\n              {...props}\n              ref={mergedRef}\n            />\n          </ValueTransformer>\n        )}\n        {!!description && <FormDescription>{description}</FormDescription>}\n        {hasWarning && <FormMessageList messages={warnings} type=\"warning\" />}\n        {hasError && <FormMessageList messages={errors} type=\"error\" />}\n      </FormGroup>\n    );\n  },\n);\n\nIdAutocomplete.displayName = \"IdAutocomplete\";\n\nexport { IdAutocomplete };\n"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-import { v as IdAutocompleteOption, y as IdAutocompleteProps } from "../../../index-DtPJq-vz.js";
+import { v as IdAutocompleteOption, y as IdAutocompleteProps } from "../../../index--hDSfvJT.js";
 export { IdAutocompleteOption, IdAutocompleteProps };

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

@@ -1,2 +1,2 @@
-import { t as useIdAutocomplete } from "../../../use-id-autocomplete-BPHVmVE8.js";
+import { t as useIdAutocomplete } from "../../../use-id-autocomplete-By7YSChC.js";
 export { useIdAutocomplete };

package/dist/ui/components/index.d.ts

@@ -1,37 +1,40 @@
-import { n as ButtonProps, r as buttonVariants, t as Button } from "../../button-49Walvwn.js";
-import { n as CharacterCounterProps, t as CharacterCounter } from "../../character-counter-BcuG4STA.js";
-import { n as CheckboxValue, t as CheckboxBase } from "../../checkbox-base-8xXJvAbj.js";
-import { n as CheckboxProps, t as Checkbox } from "../../checkbox-dqrYEK5V.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-BBihfa1C.js";
-import { n as RadioGroupFieldProps, t as RadioGroupField } from "../../radio-group-field-DNapUn2b.js";
-import { n as SelectFieldProps, r as SelectFieldRaw, t as SelectField } from "../../select-field-BClhLm83.js";
-import { n as EnumFieldProps, t as EnumField } from "../../enum-field-CjTSTf1e.js";
-import { n as FormDescriptionProps, t as FormDescription } from "../../form-description-BpST5Ww-.js";
-import { t as FormGroup } from "../../form-group-BauWlFkQ.js";
-import { n as FormLabelProps, t as FormLabel } from "../../form-label-Cz_gcj-B.js";
-import { n as FormMessageProps, r as FormMessageType, t as FormMessage } from "../../form-message-BPqNM4gG.js";
-import { t as FormServerErrorMessage } from "../../form-server-error-message-CzMQQ8ru.js";
-import { t as FormMessageList } from "../../message-list-aysvo-xf.js";
-import { t as Form } from "../../form-B9JNvrH6.js";
-import { n as IdAutocompleteInputContainerProps, t as IdAutocompleteInputContainer } from "../../id-autocomplete-input-container-NIuWfCB_.js";
-import { n as IdAutocompleteListOptionProps, t as IdAutocompleteListOption } from "../../id-autocomplete-list-option-CA9HIqEh.js";
-import { n as IdAutocompleteListProps, t as IdAutocompleteList } from "../../id-autocomplete-list-Bi2IXdXg.js";
-import { t as IdAutocomplete } from "../../id-autocomplete-jkaREmPP.js";
-import { t as useIdAutocomplete } from "../../use-id-autocomplete-BPHVmVE8.js";
-import { n as InputProps, t as Input } from "../../input-D11GgWGm.js";
-import { t as SplittedInputDiff } from "../../splitted-input-diff-Ch6IKdEa.js";
-import { t as JsonViewer } from "../../json-viewer-vWp8vOvz.js";
-import { i as PopoverTrigger, n as PopoverAnchor, r as PopoverContent, t as Popover } from "../../popover-glLRVxPS.js";
-import { n as RadioGroup, t as CustomizableRadioGroupProps } from "../../radio-group-DjJbcDzB.js";
-import { n as RadioProps, t as Radio } from "../../radio-DZ4xl9oz.js";
-import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../types-9JRQnd7a.js";
-import { t as SearchAutocomplete } from "../../search-autocomplete-OeZbE-VN.js";
-import { t as useSearchAutocomplete } from "../../use-search-autocomplete-Xf7shCtk.js";
-import { t as Content } from "../../content-OpXUtrTe.js";
-import { t as SelectedContent } from "../../selected-content-q33DjCYy.js";
-import { n as TextInputProps, t as TextInput } from "../../text-input-DUddj4-C.js";
-import { n as TextFieldProps, t as TextField } from "../../text-field-Cx-EfZP6.js";
-import { a as TooltipProps, i as TooltipContent, n as Root, o as Trigger, r as Tooltip, t as Provider } from "../../tooltip-Cf5jSzdt.js";
-import { t as ValueTransformer } from "../../value-transformer-DCiU65Qa.js";
-import { n as withFieldValidation, t as ValidationOptions } from "../../with-field-validation-vt0l1Sp7.js";
-export { Button, ButtonProps, CharacterCounter, CharacterCounterProps, Checkbox, CheckboxBase, CheckboxProps, CheckboxValue, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, Content, CustomizableRadioGroupProps, EnumField, EnumFieldProps, Form, FormDescription, FormDescriptionProps, FormGroup, FormLabel, FormLabelProps, FormMessage, FormMessageList, FormMessageProps, FormMessageType, FormServerErrorMessage, IdAutocomplete, IdAutocompleteInputContainer, IdAutocompleteInputContainerProps, IdAutocompleteList, IdAutocompleteListOption, IdAutocompleteListOptionProps, IdAutocompleteListProps, Input, InputProps, JsonViewer, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Radio, RadioGroup, RadioGroupField, RadioGroupFieldProps, RadioProps, SearchAutocomplete, SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext, SelectField, SelectFieldProps, SelectFieldRaw, SelectedContent, SplittedInputDiff, TextField, TextFieldProps, TextInput, TextInputProps, Tooltip, TooltipContent, TooltipProps, Provider as TooltipProvider, Root as TooltipRoot, Trigger as TooltipTrigger, ValidationOptions, ValueTransformer, buttonVariants, useIdAutocomplete, useSearchAutocomplete, withFieldValidation };
+import { n as ButtonProps, r as buttonVariants, t as Button } from "../../button-C8doazjv.js";
+import { n as CharacterCounterProps, t as CharacterCounter } from "../../character-counter-BWoglM2P.js";
+import { n as CheckboxValue, t as CheckboxBase } from "../../checkbox-base-CZo-4eL0.js";
+import { n as CheckboxProps, t as Checkbox } from "../../checkbox-CGBtXQnI.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-xYnJkB5j.js";
+import { n as RadioGroupFieldProps, t as RadioGroupField } from "../../radio-group-field-BN654-SO.js";
+import { n as SelectFieldProps, r as SelectFieldRaw, t as SelectField } from "../../select-field-C97QIhUL.js";
+import { n as EnumFieldProps, t as EnumField } from "../../enum-field-Cct-i2Uz.js";
+import { n as FormDescriptionProps, t as FormDescription } from "../../form-description-CYkcMEzm.js";
+import { t as FormGroup } from "../../form-group-C8kL6pdZ.js";
+import { n as FormLabelProps, t as FormLabel } from "../../form-label-b6nQi0XO.js";
+import { n as FormMessageProps, r as FormMessageType, t as FormMessage } from "../../form-message-Dq72nBXz.js";
+import { t as FormServerErrorMessage } from "../../form-server-error-message-DXbaiTfF.js";
+import { t as FormMessageList } from "../../message-list-C4mPpBBa.js";
+import { t as Form } from "../../form-CKRKn0TQ.js";
+import { n as IdAutocompleteInputContainerProps, t as IdAutocompleteInputContainer } from "../../id-autocomplete-input-container-DFEyPh5p.js";
+import { n as IdAutocompleteListOptionProps, t as IdAutocompleteListOption } from "../../id-autocomplete-list-option-CB5B07Hi.js";
+import { n as IdAutocompleteListProps, t as IdAutocompleteList } from "../../id-autocomplete-list-EzLpF23C.js";
+import { t as IdAutocomplete } from "../../id-autocomplete-C-hwriS5.js";
+import { t as useIdAutocomplete } from "../../use-id-autocomplete-By7YSChC.js";
+import { n as InputProps, t as Input } from "../../input-BpEQjaWV.js";
+import { t as SplittedInputDiff } from "../../splitted-input-diff-CwPedpov.js";
+import { t as JsonViewer } from "../../json-viewer-DaTgmzkS.js";
+import { i as PopoverTrigger, n as PopoverAnchor, r as PopoverContent, t as Popover } from "../../popover-XSBOuSih.js";
+import { n as RadioGroup, t as CustomizableRadioGroupProps } from "../../radio-group-Bkli6nUz.js";
+import { n as RadioProps, t as Radio } from "../../radio-eL0Oy86J.js";
+import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../types-C04Q_Fan.js";
+import { t as SearchAutocomplete } from "../../search-autocomplete-BJJkrZ1i.js";
+import { t as useSearchAutocomplete } from "../../use-search-autocomplete-IfcQ_gKh.js";
+import { t as Content } from "../../content-BHWIqmio.js";
+import { t as SelectedContent } from "../../selected-content-CGsK5PR4.js";
+import { n as TextInputProps, t as TextInput } from "../../text-input-8zXIWHLi.js";
+import { n as TextFieldProps, t as TextField } from "../../text-field-DSInH67J.js";
+import { a as NodeStatus, i as NodeSortType, n as NodeSortComparisonFn, o as SidebarIcon, r as NodeSortOrder, s as SidebarNode, t as FlattenedNode } from "../../types-CNbvfWjh.js";
+import { n as SidebarProps, t as Sidebar } from "../../sidebar-DOoE4krt.js";
+import { n as useSidebar, t as SidebarProvider } from "../../sidebar-provider-C2eyz9TL.js";
+import { a as TooltipProps, i as TooltipContent, n as Root, o as Trigger, r as Tooltip, t as Provider } from "../../tooltip-BxS9HpML.js";
+import { t as ValueTransformer } from "../../value-transformer-DQjqtNih.js";
+import { n as withFieldValidation, t as ValidationOptions } from "../../with-field-validation-Di5D8vU-.js";
+export { Button, ButtonProps, CharacterCounter, CharacterCounterProps, Checkbox, CheckboxBase, CheckboxProps, CheckboxValue, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, Content, CustomizableRadioGroupProps, EnumField, EnumFieldProps, FlattenedNode, Form, FormDescription, FormDescriptionProps, FormGroup, FormLabel, FormLabelProps, FormMessage, FormMessageList, FormMessageProps, FormMessageType, FormServerErrorMessage, IdAutocomplete, IdAutocompleteInputContainer, IdAutocompleteInputContainerProps, IdAutocompleteList, IdAutocompleteListOption, IdAutocompleteListOptionProps, IdAutocompleteListProps, Input, InputProps, JsonViewer, NodeSortComparisonFn, NodeSortOrder, NodeSortType, NodeStatus, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Radio, RadioGroup, RadioGroupField, RadioGroupFieldProps, RadioProps, SearchAutocomplete, SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext, SelectField, SelectFieldProps, SelectFieldRaw, SelectedContent, Sidebar, SidebarIcon, SidebarNode, SidebarProps, SidebarProvider, SplittedInputDiff, TextField, TextFieldProps, TextInput, TextInputProps, Tooltip, TooltipContent, TooltipProps, Provider as TooltipProvider, Root as TooltipRoot, Trigger as TooltipTrigger, ValidationOptions, ValueTransformer, buttonVariants, useIdAutocomplete, useSearchAutocomplete, useSidebar, withFieldValidation };

package/dist/ui/components/index.js

@@ -33,4 +33,6 @@ import { useSearchAutocomplete } from "./search-autocomplete/use-search-autocomp
 import { SearchAutocomplete } from "./search-autocomplete/search-autocomplete.js";
 import { TextInput } from "./text-input/text-input.js";
 import { TextField } from "./text-field/text-field.js";
-export { Button, CharacterCounter, Checkbox, CheckboxBase, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, Content, EnumField, Form, FormDescription, FormGroup, FormLabel, FormMessage, FormMessageList, FormServerErrorMessage, IdAutocomplete, IdAutocompleteInputContainer, IdAutocompleteList, IdAutocompleteListOption, Input, JsonViewer, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Radio, RadioGroup, RadioGroupField, SearchAutocomplete, SelectField, SelectFieldRaw, SelectedContent, SplittedInputDiff, TextField, TextInput, Tooltip, TooltipContent, Provider as TooltipProvider, Root as TooltipRoot, Trigger as TooltipTrigger, ValueTransformer, buttonVariants, useIdAutocomplete, useSearchAutocomplete, withFieldValidation };
+import { SidebarProvider, useSidebar } from "./sidebar/subcomponents/sidebar-provider/sidebar-provider.js";
+import { Sidebar } from "./sidebar/sidebar.js";
+export { Button, CharacterCounter, Checkbox, CheckboxBase, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, Content, EnumField, Form, FormDescription, FormGroup, FormLabel, FormMessage, FormMessageList, FormServerErrorMessage, IdAutocomplete, IdAutocompleteInputContainer, IdAutocompleteList, IdAutocompleteListOption, Input, JsonViewer, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Radio, RadioGroup, RadioGroupField, SearchAutocomplete, SelectField, SelectFieldRaw, SelectedContent, Sidebar, SidebarProvider, SplittedInputDiff, TextField, TextInput, Tooltip, TooltipContent, Provider as TooltipProvider, Root as TooltipRoot, Trigger as TooltipTrigger, ValueTransformer, buttonVariants, useIdAutocomplete, useSearchAutocomplete, useSidebar, withFieldValidation };

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

@@ -1,2 +1,2 @@
-import { n as InputProps, t as Input } from "../../../input-D11GgWGm.js";
+import { n as InputProps, t as Input } from "../../../input-BpEQjaWV.js";
 export { Input, InputProps };

package/dist/ui/components/input/input.js

@@ -1,16 +1,12 @@
 import * as React$1 from "react";
 import { twMerge } from "tailwind-merge";
 import { jsx } from "react/jsx-runtime";
-import clsx$1 from "clsx";
 //#region src/ui/components/input/input.tsx
-function cn(...inputs) {
-	return twMerge(clsx$1(inputs));
-}
-const inputBaseStyles = cn("flex h-9 w-full rounded-md text-sm/5 font-normal text-gray-900 dark:text-gray-50", "border border-gray-300 bg-white dark:border-charcoal-700 dark:bg-charcoal-900", "px-3 py-2", "font-sans placeholder:text-gray-500 dark:placeholder:text-gray-600", "focus-visible:ring-1 focus-visible:ring-gray-900 focus-visible:ring-offset-0 focus-visible:ring-offset-white focus-visible:outline-none", "focus:bg-gray-50 dark:focus:bg-charcoal-900 dark:focus-visible:ring-charcoal-300 dark:focus-visible:ring-offset-charcoal-900", "disabled:cursor-not-allowed", "disabled:border-gray-300 disabled:bg-gray-50 disabled:text-gray-700", "disabled:dark:border-charcoal-800 disabled:dark:bg-charcoal-900 disabled:dark:text-gray-300");
+const inputBaseStyles = twMerge("flex h-9 w-full rounded-md text-sm/5 font-normal text-gray-900 dark:text-slate-50", "border border-gray-300 bg-gray-50 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100", "px-3 py-2", "font-sans placeholder:text-gray-500 dark:placeholder:text-slate-400", "focus-visible:ring-1 focus-visible:ring-gray-900 focus-visible:ring-offset-0 focus-visible:ring-offset-white focus-visible:outline-none", "focus:bg-gray-50 dark:focus:bg-slate-700 dark:focus-visible:ring-slate-400 dark:focus-visible:ring-offset-slate-800", "disabled:cursor-not-allowed", "disabled:border-gray-300 disabled:bg-gray-50 disabled:text-gray-700 dark:disabled:border-slate-500 dark:disabled:bg-slate-700 dark:disabled:placeholder:text-slate-400");
 const Input = /* @__PURE__ */ React$1.forwardRef(({ className, type, ...props }, ref) => {
 	return /* @__PURE__ */ jsx("input", {
 		type,
-		className: cn(inputBaseStyles, className),
+		className: twMerge(inputBaseStyles, className),
 		ref,
 		...props
 	});

package/dist/ui/components/input/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","names":["clsx","React","twMerge","cn","inputs","inputBaseStyles","Input","forwardRef","className","type","props","ref","displayName"],"sources":["../../../../src/ui/components/input/input.tsx"],"sourcesContent":["import type { ClassValue } from \"clsx\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nfunction cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\nexport type InputProps = React.InputHTMLAttributes<HTMLInputElement>;\n\nconst inputBaseStyles = cn(\n  // Base styles\n  \"flex h-9 w-full rounded-md text-sm/5 font-normal text-gray-900 dark:text-gray-50\",\n  // Border & Background\n  \"border border-gray-300 bg-white dark:border-charcoal-700 dark:bg-charcoal-900\",\n  // Padding\n  \"px-3 py-2\",\n  // Placeholder\n  \"font-sans placeholder:text-gray-500 dark:placeholder:text-gray-600\",\n  // Focus styles\n  \"focus-visible:ring-1 focus-visible:ring-gray-900 focus-visible:ring-offset-0 focus-visible:ring-offset-white focus-visible:outline-none\",\n  \"focus:bg-gray-50 dark:focus:bg-charcoal-900 dark:focus-visible:ring-charcoal-300 dark:focus-visible:ring-offset-charcoal-900\",\n  // Disabled state\n  \"disabled:cursor-not-allowed\",\n  \"disabled:border-gray-300 disabled:bg-gray-50 disabled:text-gray-700\",\n  \"disabled:dark:border-charcoal-800 disabled:dark:bg-charcoal-900 disabled:dark:text-gray-300\",\n);\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, type, ...props }, ref) => {\n    return (\n      <input\n        type={type}\n        className={cn(inputBaseStyles, className)}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nInput.displayName = \"Input\";\n\nexport { Input };\n"],"mappings":";;;;;AAIA,SAASG,GAAG,GAAGC,QAAsB;AACnC,QAAOF,QAAQF,OAAKI,OAAO,CAAC;;AAI9B,MAAMC,kBAAkBF,GAEtB,oFAEA,iFAEA,aAEA,sEAEA,2IACA,gIAEA,+BACA,uEACA,8FACD;AAED,MAAMG,QAAQL,wBAAMM,YACjB,EAAEC,WAAWC,MAAM,GAAGC,SAASC,QAAQ;AACtC,QACE,oBAAC,SAAD;EACQF;EACN,WAAWN,GAAGE,iBAAiBG,UAAU;EACpCG;EACL,GAAID;EACJ,CAAA;EAGP;AAEDJ,MAAMM,cAAc"}
+{"version":3,"file":"input.js","names":["React","twMerge","inputBaseStyles","Input","forwardRef","className","type","props","ref","displayName"],"sources":["../../../../src/ui/components/input/input.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport type InputProps = React.InputHTMLAttributes<HTMLInputElement>;\n\nconst inputBaseStyles = twMerge(\n  // Base styles\n  \"flex h-9 w-full rounded-md text-sm/5 font-normal text-gray-900 dark:text-slate-50\",\n  // Border & Background\n  \"border border-gray-300 bg-gray-50 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100\",\n  // Padding\n  \"px-3 py-2\",\n  // Placeholder\n  \"font-sans placeholder:text-gray-500 dark:placeholder:text-slate-400\",\n  // Focus styles\n  \"focus-visible:ring-1 focus-visible:ring-gray-900 focus-visible:ring-offset-0 focus-visible:ring-offset-white focus-visible:outline-none\",\n  \"focus:bg-gray-50 dark:focus:bg-slate-700 dark:focus-visible:ring-slate-400 dark:focus-visible:ring-offset-slate-800\",\n  // Disabled state\n  \"disabled:cursor-not-allowed\",\n  \"disabled:border-gray-300 disabled:bg-gray-50 disabled:text-gray-700 dark:disabled:border-slate-500 dark:disabled:bg-slate-700 dark:disabled:placeholder:text-slate-400\",\n);\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, type, ...props }, ref) => {\n    return (\n      <input\n        type={type}\n        className={twMerge(inputBaseStyles, className)}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nInput.displayName = \"Input\";\n\nexport { Input };\n"],"mappings":";;;;AAKA,MAAME,kBAAkBD,QAEtB,qFAEA,iGAEA,aAEA,uEAEA,2IACA,uHAEA,+BACA,yKACD;AAED,MAAME,QAAQH,wBAAMI,YACjB,EAAEC,WAAWC,MAAM,GAAGC,SAASC,QAAQ;AACtC,QACE,oBAAC,SAAD;EACQF;EACN,WAAWL,QAAQC,iBAAiBG,UAAU;EACzCG;EACL,GAAID;EACJ,CAAA;EAGP;AAEDJ,MAAMM,cAAc"}

package/dist/ui/components/input/splitted-input-diff.d.ts

@@ -1,2 +1,2 @@
-import { t as SplittedInputDiff } from "../../../splitted-input-diff-Ch6IKdEa.js";
+import { t as SplittedInputDiff } from "../../../splitted-input-diff-CwPedpov.js";
 export { SplittedInputDiff };

package/dist/ui/components/input/splitted-input-diff.js

@@ -1,8 +1,9 @@
-import { h as Icon, t as cn } from "../../../src-BgCjYazJ.js";
+import { t as Icon } from "../../../icon-C4QOpsdI.js";
 import { Tooltip, TooltipProvider as Provider } from "../tooltip/tooltip.js";
 import { InputDiff } from "./subcomponent/input-diff.js";
 import { TextDiff } from "./subcomponent/text-diff.js";
 import { useCallback, useState } from "react";
+import { twMerge } from "tailwind-merge";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useMediaQuery } from "usehooks-ts";
 //#region src/ui/components/input/splitted-input-diff.tsx
@@ -21,11 +22,11 @@ const CopyIcon = ({ value, hasCopied, setHasCopied, hasHover }) => {
 					console.error("Failed to copy value: ", error);
 				});
 			}, [value, setHasCopied]),
-			className: cn("focus-visible:outline-none [&_svg]:pointer-events-none", hasHover && "opacity-0 transition-opacity duration-500 group-hover:opacity-100"),
+			className: twMerge("focus-visible:outline-none [&_svg]:pointer-events-none", hasHover && "opacity-0 transition-opacity duration-500 group-hover:opacity-100"),
 			children: /* @__PURE__ */ jsx(Icon, {
 				name: "Copy",
 				size: 16,
-				className: cn("text-gray-500")
+				className: twMerge("text-gray-500 dark:text-slate-400")
 			})
 		})
 	}) });
@@ -35,16 +36,16 @@ const SplittedInputDiff = ({ baseValue, value, viewMode, diffMode, showCopyIcon
 	const [hasCopiedRight, setHasCopiedRight] = useState(false);
 	const hasHover = useMediaQuery("(hover: hover) and (pointer: fine)");
 	return /* @__PURE__ */ jsx(InputDiff, {
-		className: cn("group"),
+		className: twMerge("group"),
 		children: viewMode === "mixed" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
 			/* @__PURE__ */ jsxs("div", {
-				className: cn("flex flex-1 items-center gap-2 truncate [&>span]:truncate"),
+				className: twMerge("flex flex-1 items-center gap-2 truncate [&>span]:truncate"),
 				children: [/* @__PURE__ */ jsx(TextDiff, {
 					baseValue,
 					value,
 					viewMode: "removal",
 					diffMode,
-					className: cn("flex-1")
+					className: twMerge("flex-1")
 				}), showCopyIcon && baseValue !== void 0 && baseValue !== "" && /* @__PURE__ */ jsx(CopyIcon, {
 					value: baseValue,
 					hasCopied: hasCopiedLeft,
@@ -52,15 +53,15 @@ const SplittedInputDiff = ({ baseValue, value, viewMode, diffMode, showCopyIcon
 					hasHover
 				})]
 			}),
-			/* @__PURE__ */ jsx("div", { className: cn("mx-3 h-[34px] w-px bg-gray-300") }),
+			/* @__PURE__ */ jsx("div", { className: twMerge("mx-3 h-[34px] w-px bg-gray-300 dark:bg-slate-600 dark:text-slate-100") }),
 			/* @__PURE__ */ jsxs("div", {
-				className: cn("flex flex-1 items-center gap-2 truncate [&>span]:truncate"),
+				className: twMerge("flex flex-1 items-center gap-2 truncate [&>span]:truncate"),
 				children: [/* @__PURE__ */ jsx(TextDiff, {
 					baseValue,
 					value,
 					viewMode: "addition",
 					diffMode,
-					className: cn("flex-1")
+					className: twMerge("flex-1")
 				}), showCopyIcon && value !== "" && /* @__PURE__ */ jsx(CopyIcon, {
 					value,
 					hasCopied: hasCopiedRight,
@@ -69,13 +70,13 @@ const SplittedInputDiff = ({ baseValue, value, viewMode, diffMode, showCopyIcon
 				})]
 			})
 		] }) : /* @__PURE__ */ jsxs("div", {
-			className: cn("flex flex-1 items-center gap-2 truncate [&>span]:truncate"),
+			className: twMerge("flex flex-1 items-center gap-2 truncate [&>span]:truncate"),
 			children: [/* @__PURE__ */ jsx(TextDiff, {
 				baseValue,
 				value,
 				viewMode,
 				diffMode,
-				className: cn("flex-1")
+				className: twMerge("flex-1")
 			}), showCopyIcon && (viewMode === "removal" && baseValue !== void 0 && baseValue !== "" || viewMode === "addition" && value !== "") && /* @__PURE__ */ jsx(CopyIcon, {
 				value: viewMode === "removal" ? baseValue ?? "" : value,
 				hasCopied: hasCopiedLeft,

package/dist/ui/components/input/splitted-input-diff.js.map

@@ -1 +1 @@
-{"version":3,"file":"splitted-input-diff.js","names":["cn","Icon","useCallback","useState","useMediaQuery","Tooltip","TooltipProvider","InputDiff","TextDiff","CopyIcon","value","hasCopied","setHasCopied","hasHover","copy","navigator","clipboard","writeText","then","setTimeout","catch","error","console","SplittedInputDiff","baseValue","viewMode","diffMode","showCopyIcon","hasCopiedLeft","setHasCopiedLeft","hasCopiedRight","setHasCopiedRight","undefined"],"sources":["../../../../src/ui/components/input/splitted-input-diff.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { useCallback, useState } from \"react\";\nimport { useMediaQuery } from \"usehooks-ts\";\nimport type { WithDifference } from \"../../types.js\";\nimport { Tooltip, TooltipProvider } from \"../tooltip/tooltip.js\";\nimport { InputDiff } from \"./subcomponent/input-diff.js\";\nimport { TextDiff } from \"./subcomponent/text-diff.js\";\ninterface CopyIconProps {\n  value: string;\n  hasCopied: boolean;\n  setHasCopied: (hasCopied: boolean) => void;\n  hasHover: boolean;\n}\n\nconst CopyIcon = ({\n  value,\n  hasCopied,\n  setHasCopied,\n  hasHover,\n}: CopyIconProps) => {\n  const copy = useCallback(() => {\n    navigator.clipboard\n      .writeText(value)\n      .then(() => {\n        setHasCopied(true);\n        setTimeout(() => setHasCopied(false), 2000);\n      })\n      .catch((error: unknown) => {\n        console.error(\"Failed to copy value: \", error);\n      });\n  }, [value, setHasCopied]);\n\n  return (\n    <TooltipProvider>\n      <Tooltip content=\"Copied!\" open={hasCopied} triggerAsChild>\n        <button\n          type=\"button\"\n          onClick={copy}\n          className={cn(\n            \"focus-visible:outline-none [&_svg]:pointer-events-none\",\n            hasHover &&\n              \"opacity-0 transition-opacity duration-500 group-hover:opacity-100\",\n          )}\n        >\n          <Icon name=\"Copy\" size={16} className={cn(\"text-gray-500\")} />\n        </button>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n\ninterface SplittedInputDiffProps extends WithDifference<string> {\n  value: string;\n  showCopyIcon?: boolean;\n}\n\nexport const SplittedInputDiff = ({\n  baseValue,\n  value,\n  viewMode,\n  diffMode,\n  showCopyIcon = false,\n}: SplittedInputDiffProps) => {\n  const [hasCopiedLeft, setHasCopiedLeft] = useState(false);\n  const [hasCopiedRight, setHasCopiedRight] = useState(false);\n  const hasHover = useMediaQuery(\"(hover: hover) and (pointer: fine)\");\n\n  return (\n    <InputDiff className={cn(\"group\")}>\n      {viewMode === \"mixed\" ? (\n        <>\n          <div\n            className={cn(\n              \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n            )}\n          >\n            <TextDiff\n              baseValue={baseValue}\n              value={value}\n              viewMode=\"removal\"\n              diffMode={diffMode}\n              className={cn(\"flex-1\")}\n            />\n            {showCopyIcon && baseValue !== undefined && baseValue !== \"\" && (\n              <CopyIcon\n                value={baseValue}\n                hasCopied={hasCopiedLeft}\n                setHasCopied={setHasCopiedLeft}\n                hasHover={hasHover}\n              />\n            )}\n          </div>\n          <div className={cn(\"mx-3 h-[34px] w-px bg-gray-300\")} />\n          <div\n            className={cn(\n              \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n            )}\n          >\n            <TextDiff\n              baseValue={baseValue}\n              value={value}\n              viewMode=\"addition\"\n              diffMode={diffMode}\n              className={cn(\"flex-1\")}\n            />\n            {showCopyIcon && value !== \"\" && (\n              <CopyIcon\n                value={value}\n                hasCopied={hasCopiedRight}\n                setHasCopied={setHasCopiedRight}\n                hasHover={hasHover}\n              />\n            )}\n          </div>\n        </>\n      ) : (\n        <div\n          className={cn(\n            \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n          )}\n        >\n          <TextDiff\n            baseValue={baseValue}\n            value={value}\n            viewMode={viewMode}\n            diffMode={diffMode}\n            className={cn(\"flex-1\")}\n          />\n          {showCopyIcon &&\n            ((viewMode === \"removal\" &&\n              baseValue !== undefined &&\n              baseValue !== \"\") ||\n              (viewMode === \"addition\" && value !== \"\")) && (\n              <CopyIcon\n                value={viewMode === \"removal\" ? (baseValue ?? \"\") : value}\n                hasCopied={hasCopiedLeft}\n                setHasCopied={setHasCopiedLeft}\n                hasHover={hasHover}\n              />\n            )}\n        </div>\n      )}\n    </InputDiff>\n  );\n};\n"],"mappings":";;;;;;;;AAcA,MAAMS,YAAY,EAChBC,OACAC,WACAC,cACAC,eACmB;AAanB,QACE,oBAAC,UAAD,EAAA,UACE,oBAAC,SAAD;EAAS,SAAQ;EAAU,MAAMF;EAAW,gBAAA;YAC1C,oBAAC,UAAD;GACE,MAAK;GACL,SAjBKT,kBAAkB;AAC7Ba,cAAUC,UACPC,UAAUP,MAAM,CAChBQ,WAAW;AACVN,kBAAa,KAAK;AAClBO,sBAAiBP,aAAa,MAAM,EAAE,IAAK;MAC3C,CACDQ,OAAOC,UAAmB;AACzBC,aAAQD,MAAM,0BAA0BA,MAAM;MAC9C;MACH,CAACX,OAAOE,aAAa,CAAC;GAQjB,WAAWZ,GACT,0DACAa,YACE,oEACH;aAED,oBAAC,MAAD;IAAM,MAAK;IAAO,MAAM;IAAI,WAAWb,GAAG,gBAAgB;IAAC,CAAA;GACrD,CAAA;EACD,CAAA,EACO,CAAA;;AAStB,MAAauB,qBAAqB,EAChCC,WACAd,OACAe,UACAC,UACAC,eAAe,YACa;CAC5B,MAAM,CAACC,eAAeC,oBAAoB1B,SAAS,MAAM;CACzD,MAAM,CAAC2B,gBAAgBC,qBAAqB5B,SAAS,MAAM;CAC3D,MAAMU,WAAWT,cAAc,qCAAqC;AAEpE,QACE,oBAAC,WAAD;EAAW,WAAWJ,GAAG,QAAQ;YAC9ByB,aAAa,UACZ,qBAAA,YAAA,EAAA,UAAA;GACE,qBAAC,OAAD;IACE,WAAWzB,GACT,4DACD;cAHH,CAKE,oBAAC,UAAD;KACawB;KACJd;KACP,UAAS;KACCgB;KACV,WAAW1B,GAAG,SAAS;KAAC,CAAA,EAEzB2B,gBAAgBH,cAAcQ,KAAAA,KAAaR,cAAc,MACxD,oBAAC,UAAD;KACE,OAAOA;KACP,WAAWI;KACX,cAAcC;KACJhB;KAEb,CAAA,CACE;;GACL,oBAAC,OAAD,EAAK,WAAWb,GAAG,iCAAiC,EAAC,CAAA;GACrD,qBAAC,OAAD;IACE,WAAWA,GACT,4DACD;cAHH,CAKE,oBAAC,UAAD;KACawB;KACJd;KACP,UAAS;KACCgB;KACV,WAAW1B,GAAG,SAAS;KAAC,CAAA,EAEzB2B,gBAAgBjB,UAAU,MACzB,oBAAC,UAAD;KACSA;KACP,WAAWoB;KACX,cAAcC;KACJlB;KAEb,CAAA,CACE;;GACJ,EAAA,CAAA,GAEH,qBAAC,OAAD;GACE,WAAWb,GACT,4DACD;aAHH,CAKE,oBAAC,UAAD;IACawB;IACJd;IACGe;IACAC;IACV,WAAW1B,GAAG,SAAS;IAAC,CAAA,EAEzB2B,iBACGF,aAAa,aACbD,cAAcQ,KAAAA,KACdR,cAAc,MACbC,aAAa,cAAcf,UAAU,OACtC,oBAAC,UAAD;IACE,OAAOe,aAAa,YAAaD,aAAa,KAAMd;IACpD,WAAWkB;IACX,cAAcC;IACJhB;IAEb,CAAA,CAEN;;EACS,CAAA"}
+{"version":3,"file":"splitted-input-diff.js","names":["Icon","twMerge","useCallback","useState","useMediaQuery","Tooltip","TooltipProvider","InputDiff","TextDiff","CopyIcon","value","hasCopied","setHasCopied","hasHover","copy","navigator","clipboard","writeText","then","setTimeout","catch","error","console","SplittedInputDiff","baseValue","viewMode","diffMode","showCopyIcon","hasCopiedLeft","setHasCopiedLeft","hasCopiedRight","setHasCopiedRight","undefined"],"sources":["../../../../src/ui/components/input/splitted-input-diff.tsx"],"sourcesContent":["import { Icon } from \"#design-system\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useCallback, useState } from \"react\";\nimport { useMediaQuery } from \"usehooks-ts\";\nimport type { WithDifference } from \"../../types.js\";\nimport { Tooltip, TooltipProvider } from \"../tooltip/tooltip.js\";\nimport { InputDiff } from \"./subcomponent/input-diff.js\";\nimport { TextDiff } from \"./subcomponent/text-diff.js\";\ninterface CopyIconProps {\n  value: string;\n  hasCopied: boolean;\n  setHasCopied: (hasCopied: boolean) => void;\n  hasHover: boolean;\n}\n\nconst CopyIcon = ({\n  value,\n  hasCopied,\n  setHasCopied,\n  hasHover,\n}: CopyIconProps) => {\n  const copy = useCallback(() => {\n    navigator.clipboard\n      .writeText(value)\n      .then(() => {\n        setHasCopied(true);\n        setTimeout(() => setHasCopied(false), 2000);\n      })\n      .catch((error: unknown) => {\n        console.error(\"Failed to copy value: \", error);\n      });\n  }, [value, setHasCopied]);\n\n  return (\n    <TooltipProvider>\n      <Tooltip content=\"Copied!\" open={hasCopied} triggerAsChild>\n        <button\n          type=\"button\"\n          onClick={copy}\n          className={twMerge(\n            \"focus-visible:outline-none [&_svg]:pointer-events-none\",\n            hasHover &&\n              \"opacity-0 transition-opacity duration-500 group-hover:opacity-100\",\n          )}\n        >\n          <Icon\n            name=\"Copy\"\n            size={16}\n            className={twMerge(\"text-gray-500 dark:text-slate-400\")}\n          />\n        </button>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n\ninterface SplittedInputDiffProps extends WithDifference<string> {\n  value: string;\n  showCopyIcon?: boolean;\n}\n\nexport const SplittedInputDiff = ({\n  baseValue,\n  value,\n  viewMode,\n  diffMode,\n  showCopyIcon = false,\n}: SplittedInputDiffProps) => {\n  const [hasCopiedLeft, setHasCopiedLeft] = useState(false);\n  const [hasCopiedRight, setHasCopiedRight] = useState(false);\n  const hasHover = useMediaQuery(\"(hover: hover) and (pointer: fine)\");\n\n  return (\n    <InputDiff className={twMerge(\"group\")}>\n      {viewMode === \"mixed\" ? (\n        <>\n          <div\n            className={twMerge(\n              \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n            )}\n          >\n            <TextDiff\n              baseValue={baseValue}\n              value={value}\n              viewMode=\"removal\"\n              diffMode={diffMode}\n              className={twMerge(\"flex-1\")}\n            />\n            {showCopyIcon && baseValue !== undefined && baseValue !== \"\" && (\n              <CopyIcon\n                value={baseValue}\n                hasCopied={hasCopiedLeft}\n                setHasCopied={setHasCopiedLeft}\n                hasHover={hasHover}\n              />\n            )}\n          </div>\n          <div\n            className={twMerge(\n              \"mx-3 h-[34px] w-px bg-gray-300 dark:bg-slate-600 dark:text-slate-100\",\n            )}\n          />\n          <div\n            className={twMerge(\n              \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n            )}\n          >\n            <TextDiff\n              baseValue={baseValue}\n              value={value}\n              viewMode=\"addition\"\n              diffMode={diffMode}\n              className={twMerge(\"flex-1\")}\n            />\n            {showCopyIcon && value !== \"\" && (\n              <CopyIcon\n                value={value}\n                hasCopied={hasCopiedRight}\n                setHasCopied={setHasCopiedRight}\n                hasHover={hasHover}\n              />\n            )}\n          </div>\n        </>\n      ) : (\n        <div\n          className={twMerge(\n            \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n          )}\n        >\n          <TextDiff\n            baseValue={baseValue}\n            value={value}\n            viewMode={viewMode}\n            diffMode={diffMode}\n            className={twMerge(\"flex-1\")}\n          />\n          {showCopyIcon &&\n            ((viewMode === \"removal\" &&\n              baseValue !== undefined &&\n              baseValue !== \"\") ||\n              (viewMode === \"addition\" && value !== \"\")) && (\n              <CopyIcon\n                value={viewMode === \"removal\" ? (baseValue ?? \"\") : value}\n                hasCopied={hasCopiedLeft}\n                setHasCopied={setHasCopiedLeft}\n                hasHover={hasHover}\n              />\n            )}\n        </div>\n      )}\n    </InputDiff>\n  );\n};\n"],"mappings":";;;;;;;;;AAeA,MAAMS,YAAY,EAChBC,OACAC,WACAC,cACAC,eACmB;AAanB,QACE,oBAAC,UAAD,EAAA,UACE,oBAAC,SAAD;EAAS,SAAQ;EAAU,MAAMF;EAAW,gBAAA;YAC1C,oBAAC,UAAD;GACE,MAAK;GACL,SAjBKT,kBAAkB;AAC7Ba,cAAUC,UACPC,UAAUP,MAAM,CAChBQ,WAAW;AACVN,kBAAa,KAAK;AAClBO,sBAAiBP,aAAa,MAAM,EAAE,IAAK;MAC3C,CACDQ,OAAOC,UAAmB;AACzBC,aAAQD,MAAM,0BAA0BA,MAAM;MAC9C;MACH,CAACX,OAAOE,aAAa,CAAC;GAQjB,WAAWX,QACT,0DACAY,YACE,oEACH;aAED,oBAAC,MAAD;IACE,MAAK;IACL,MAAM;IACN,WAAWZ,QAAQ,oCAAoC;IAAC,CAAA;GAEpD,CAAA;EACD,CAAA,EACO,CAAA;;AAStB,MAAasB,qBAAqB,EAChCC,WACAd,OACAe,UACAC,UACAC,eAAe,YACa;CAC5B,MAAM,CAACC,eAAeC,oBAAoB1B,SAAS,MAAM;CACzD,MAAM,CAAC2B,gBAAgBC,qBAAqB5B,SAAS,MAAM;CAC3D,MAAMU,WAAWT,cAAc,qCAAqC;AAEpE,QACE,oBAAC,WAAD;EAAW,WAAWH,QAAQ,QAAQ;YACnCwB,aAAa,UACZ,qBAAA,YAAA,EAAA,UAAA;GACE,qBAAC,OAAD;IACE,WAAWxB,QACT,4DACD;cAHH,CAKE,oBAAC,UAAD;KACauB;KACJd;KACP,UAAS;KACCgB;KACV,WAAWzB,QAAQ,SAAS;KAAC,CAAA,EAE9B0B,gBAAgBH,cAAcQ,KAAAA,KAAaR,cAAc,MACxD,oBAAC,UAAD;KACE,OAAOA;KACP,WAAWI;KACX,cAAcC;KACJhB;KAEb,CAAA,CACE;;GACL,oBAAC,OAAD,EACE,WAAWZ,QACT,uEACD,EAAC,CAAA;GAEJ,qBAAC,OAAD;IACE,WAAWA,QACT,4DACD;cAHH,CAKE,oBAAC,UAAD;KACauB;KACJd;KACP,UAAS;KACCgB;KACV,WAAWzB,QAAQ,SAAS;KAAC,CAAA,EAE9B0B,gBAAgBjB,UAAU,MACzB,oBAAC,UAAD;KACSA;KACP,WAAWoB;KACX,cAAcC;KACJlB;KAEb,CAAA,CACE;;GACJ,EAAA,CAAA,GAEH,qBAAC,OAAD;GACE,WAAWZ,QACT,4DACD;aAHH,CAKE,oBAAC,UAAD;IACauB;IACJd;IACGe;IACAC;IACV,WAAWzB,QAAQ,SAAS;IAAC,CAAA,EAE9B0B,iBACGF,aAAa,aACbD,cAAcQ,KAAAA,KACdR,cAAc,MACbC,aAAa,cAAcf,UAAU,OACtC,oBAAC,UAAD;IACE,OAAOe,aAAa,YAAaD,aAAa,KAAMd;IACpD,WAAWkB;IACX,cAAcC;IACJhB;IAEb,CAAA,CAEN;;EACS,CAAA"}

package/dist/ui/components/input/subcomponent/input-diff.js

@@ -1,9 +1,9 @@
-import { t as cn } from "../../../../src-BgCjYazJ.js";
+import { twMerge } from "tailwind-merge";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/components/input/subcomponent/input-diff.tsx
 const InputDiff = ({ children, className, ellipsis = true, multiline = false, rows = 3, hasPadding = false }) => {
 	return /* @__PURE__ */ jsx("div", {
-		className: cn("flex w-full items-center rounded-md font-sans text-sm/5 font-normal text-gray-700", "cursor-not-allowed border border-gray-300 bg-transparent px-3", !multiline && ellipsis && "truncate [&>span]:truncate", hasPadding && "items-start py-2", className),
+		className: twMerge("flex w-full items-center rounded-md font-sans text-sm/5 font-normal text-gray-700 dark:text-slate-200", "cursor-not-allowed border border-gray-300 bg-transparent px-3 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100", !multiline && ellipsis && "truncate [&>span]:truncate", hasPadding && "items-start py-2", className),
 		style: { minHeight: multiline ? `${rows * 1.5}rem` : "2.25rem" },
 		children
 	});

package/dist/ui/components/input/subcomponent/input-diff.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-diff.js","names":["cn","InputDiff","children","className","ellipsis","multiline","rows","hasPadding","minHeight"],"sources":["../../../../../src/ui/components/input/subcomponent/input-diff.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\n\ninterface InputDiffProps {\n  children: React.ReactNode;\n  className?: string;\n  ellipsis?: boolean;\n  multiline?: boolean;\n  rows?: number;\n  hasPadding?: boolean;\n}\n\nexport const InputDiff = ({\n  children,\n  className,\n  ellipsis = true,\n  multiline = false,\n  rows = 3,\n  hasPadding = false,\n}: InputDiffProps) => {\n  return (\n    <div\n      className={cn(\n        \"flex w-full items-center rounded-md font-sans text-sm/5 font-normal text-gray-700\",\n        \"cursor-not-allowed border border-gray-300 bg-transparent px-3\",\n        !multiline && ellipsis && \"truncate [&>span]:truncate\",\n        hasPadding && \"items-start py-2\",\n        className,\n      )}\n      style={{\n        minHeight: multiline ? `${rows * 1.5}rem` : \"2.25rem\",\n      }}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;AAWA,MAAaC,aAAa,EACxBC,UACAC,WACAC,WAAW,MACXC,YAAY,OACZC,OAAO,GACPC,aAAa,YACO;AACpB,QACE,oBAAC,OAAD;EACE,WAAWP,GACT,qFACA,iEACA,CAACK,aAAaD,YAAY,8BAC1BG,cAAc,oBACdJ,UACD;EACD,OAAO,EACLK,WAAWH,YAAY,GAAGC,OAAO,IAAG,OAAQ,WAC7C;EAEAJ;EACG,CAAA"}
+{"version":3,"file":"input-diff.js","names":["twMerge","InputDiff","children","className","ellipsis","multiline","rows","hasPadding","minHeight"],"sources":["../../../../../src/ui/components/input/subcomponent/input-diff.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\n\ninterface InputDiffProps {\n  children: React.ReactNode;\n  className?: string;\n  ellipsis?: boolean;\n  multiline?: boolean;\n  rows?: number;\n  hasPadding?: boolean;\n}\n\nexport const InputDiff = ({\n  children,\n  className,\n  ellipsis = true,\n  multiline = false,\n  rows = 3,\n  hasPadding = false,\n}: InputDiffProps) => {\n  return (\n    <div\n      className={twMerge(\n        \"flex w-full items-center rounded-md font-sans text-sm/5 font-normal text-gray-700 dark:text-slate-200\",\n        \"cursor-not-allowed border border-gray-300 bg-transparent px-3 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100\",\n        !multiline && ellipsis && \"truncate [&>span]:truncate\",\n        hasPadding && \"items-start py-2\",\n        className,\n      )}\n      style={{\n        minHeight: multiline ? `${rows * 1.5}rem` : \"2.25rem\",\n      }}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;AAWA,MAAaC,aAAa,EACxBC,UACAC,WACAC,WAAW,MACXC,YAAY,OACZC,OAAO,GACPC,aAAa,YACO;AACpB,QACE,oBAAC,OAAD;EACE,WAAWP,QACT,yGACA,6HACA,CAACK,aAAaD,YAAY,8BAC1BG,cAAc,oBACdJ,UACD;EACD,OAAO,EACLK,WAAWH,YAAY,GAAGC,OAAO,IAAG,OAAQ,WAC7C;EAEAJ;EACG,CAAA"}

package/dist/ui/components/input/subcomponent/text-diff.d.ts

@@ -1,4 +1,4 @@
-import { _ as WithDifference } from "../../../../index-DtPJq-vz.js";
+import { _ as WithDifference } from "../../../../index--hDSfvJT.js";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/ui/components/input/subcomponent/text-diff.d.ts

package/dist/ui/components/input/subcomponent/text-diff.js

@@ -1,5 +1,5 @@
-import { t as cn } from "../../../../src-BgCjYazJ.js";
 import { useMemo } from "react";
+import { twMerge } from "tailwind-merge";
 import { jsx } from "react/jsx-runtime";
 import { diffSentences, diffWords } from "diff";
 //#region src/ui/components/input/subcomponent/text-diff.tsx
@@ -15,16 +15,16 @@ const TextDiff = ({ baseValue, value, viewMode, diffMode = "words", className, c
 		return wordsDiff.some((word) => word.added || word.removed);
 	}, [wordsDiff]);
 	return /* @__PURE__ */ jsx("span", {
-		className: cn("leading-[18px] text-gray-700", diffMode === "sentences" && hasChanges ? viewMode === "addition" ? "bg-green-600/30" : viewMode === "removal" ? "bg-red-600/30" : void 0 : void 0, className),
+		className: twMerge("leading-[18px] text-gray-700 dark:text-slate-200", diffMode === "sentences" && hasChanges ? viewMode === "addition" ? "bg-green-600/30 dark:bg-green-600/30" : viewMode === "removal" ? "bg-red-600/30 dark:bg-red-300/30" : void 0 : void 0, className),
 		children: wordsDiff.map((word, index) => {
 			return word.added ? viewMode === "addition" || viewMode === "mixed" ? /* @__PURE__ */ jsx("span", {
-				className: cn((diffMode === "words" || viewMode === "mixed") && "bg-green-600/30", childrenClassName),
+				className: twMerge((diffMode === "words" || viewMode === "mixed") && "bg-green-600/30 dark:bg-green-600/30", childrenClassName),
 				children: word.value
 			}, `${word.value}-${index}`) : null : word.removed ? viewMode === "removal" || viewMode === "mixed" ? /* @__PURE__ */ jsx("span", {
-				className: cn((diffMode === "words" || viewMode === "mixed") && "bg-red-600/30", childrenClassName),
+				className: twMerge((diffMode === "words" || viewMode === "mixed") && "bg-red-600/30 dark:bg-red-300/30", childrenClassName),
 				children: word.value
 			}, `${word.value}-${index}`) : null : /* @__PURE__ */ jsx("span", {
-				className: cn(childrenClassName),
+				className: twMerge(childrenClassName),
 				children: word.value
 			}, `${word.value}-${index}`);
 		})

package/dist/ui/components/input/subcomponent/text-diff.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-diff.js","names":["cn","diffSentences","diffWords","useMemo","TextDiff","baseValue","value","viewMode","diffMode","className","childrenClassName","wordsDiff","hasChanges","some","word","added","removed","bgColor","undefined","map","index"],"sources":["../../../../../src/ui/components/input/subcomponent/text-diff.tsx"],"sourcesContent":["import type { WithDifference } from \"#design-system\";\nimport { cn } from \"#design-system\";\nimport { diffSentences, diffWords } from \"diff\";\nimport { useMemo } from \"react\";\n\ninterface TextDiffProps extends WithDifference<string> {\n  value: string;\n  className?: string;\n  childrenClassName?: string;\n}\n\nexport const TextDiff = ({\n  baseValue,\n  value,\n  viewMode,\n  diffMode = \"words\",\n  className,\n  childrenClassName,\n}: TextDiffProps) => {\n  const wordsDiff = useMemo(() => {\n    return diffMode === \"words\"\n      ? diffWords(baseValue ?? \"\", value)\n      : diffSentences(baseValue ?? \"\", value);\n  }, [baseValue, value, diffMode]);\n\n  const hasChanges = useMemo(() => {\n    return wordsDiff.some((word) => word.added || word.removed);\n  }, [wordsDiff]);\n\n  const bgColor =\n    diffMode === \"sentences\" && hasChanges\n      ? viewMode === \"addition\"\n        ? \"bg-green-600/30\"\n        : viewMode === \"removal\"\n          ? \"bg-red-600/30\"\n          : undefined\n      : undefined;\n\n  return (\n    <span className={cn(\"leading-[18px] text-gray-700\", bgColor, className)}>\n      {wordsDiff.map((word, index) => {\n        return word.added ? (\n          viewMode === \"addition\" || viewMode === \"mixed\" ? (\n            <span\n              className={cn(\n                (diffMode === \"words\" || viewMode === \"mixed\") &&\n                  \"bg-green-600/30\",\n                childrenClassName,\n              )}\n              key={`${word.value}-${index}`}\n            >\n              {word.value}\n            </span>\n          ) : null\n        ) : word.removed ? (\n          viewMode === \"removal\" || viewMode === \"mixed\" ? (\n            <span\n              className={cn(\n                (diffMode === \"words\" || viewMode === \"mixed\") &&\n                  \"bg-red-600/30\",\n                childrenClassName,\n              )}\n              key={`${word.value}-${index}`}\n            >\n              {word.value}\n            </span>\n          ) : null\n        ) : (\n          <span\n            key={`${word.value}-${index}`}\n            className={cn(childrenClassName)}\n          >\n            {word.value}\n          </span>\n        );\n      })}\n    </span>\n  );\n};\n"],"mappings":";;;;;AAWA,MAAaI,YAAY,EACvBC,WACAC,OACAC,UACAC,WAAW,SACXC,WACAC,wBACmB;CACnB,MAAMC,YAAYR,cAAc;AAC9B,SAAOK,aAAa,UAChBN,UAAUG,aAAa,IAAIC,MAAM,GACjCL,cAAcI,aAAa,IAAIC,MAAM;IACxC;EAACD;EAAWC;EAAOE;EAAS,CAAC;CAEhC,MAAMI,aAAaT,cAAc;AAC/B,SAAOQ,UAAUE,MAAMC,SAASA,KAAKC,SAASD,KAAKE,QAAQ;IAC1D,CAACL,UAAU,CAAC;AAWf,QACE,oBAAC,QAAD;EAAM,WAAWX,GAAG,gCATpBQ,aAAa,eAAeI,aACxBL,aAAa,aACX,oBACAA,aAAa,YACX,kBACAW,KAAAA,IACJA,KAAAA,GAGyDT,UAAU;YACpEE,UAAUQ,KAAKL,MAAMM,UAAU;AAC9B,UAAON,KAAKC,QACVR,aAAa,cAAcA,aAAa,UACtC,oBAAC,QAAD;IACE,WAAWP,IACRQ,aAAa,WAAWD,aAAa,YACpC,mBACFG,kBACD;cAGAI,KAAKR;IACD,EAHA,GAAGQ,KAAKR,MAAK,GAAIc,QAGjB,GACL,OACFN,KAAKE,UACPT,aAAa,aAAaA,aAAa,UACrC,oBAAC,QAAD;IACE,WAAWP,IACRQ,aAAa,WAAWD,aAAa,YACpC,iBACFG,kBACD;cAGAI,KAAKR;IACD,EAHA,GAAGQ,KAAKR,MAAK,GAAIc,QAGjB,GACL,OAEJ,oBAAC,QAAD;IAEE,WAAWpB,GAAGU,kBAAkB;cAE/BI,KAAKR;IAET,EALQ,GAAGQ,KAAKR,MAAK,GAAIc,QAKzB;IACD;EACG,CAAA"}
+{"version":3,"file":"text-diff.js","names":["twMerge","diffSentences","diffWords","useMemo","TextDiff","baseValue","value","viewMode","diffMode","className","childrenClassName","wordsDiff","hasChanges","some","word","added","removed","bgColor","undefined","map","index"],"sources":["../../../../../src/ui/components/input/subcomponent/text-diff.tsx"],"sourcesContent":["import type { WithDifference } from \"#design-system\";\nimport { twMerge } from \"tailwind-merge\";\nimport { diffSentences, diffWords } from \"diff\";\nimport { useMemo } from \"react\";\n\ninterface TextDiffProps extends WithDifference<string> {\n  value: string;\n  className?: string;\n  childrenClassName?: string;\n}\n\nexport const TextDiff = ({\n  baseValue,\n  value,\n  viewMode,\n  diffMode = \"words\",\n  className,\n  childrenClassName,\n}: TextDiffProps) => {\n  const wordsDiff = useMemo(() => {\n    return diffMode === \"words\"\n      ? diffWords(baseValue ?? \"\", value)\n      : diffSentences(baseValue ?? \"\", value);\n  }, [baseValue, value, diffMode]);\n\n  const hasChanges = useMemo(() => {\n    return wordsDiff.some((word) => word.added || word.removed);\n  }, [wordsDiff]);\n\n  const bgColor =\n    diffMode === \"sentences\" && hasChanges\n      ? viewMode === \"addition\"\n        ? \"bg-green-600/30 dark:bg-green-600/30\"\n        : viewMode === \"removal\"\n          ? \"bg-red-600/30 dark:bg-red-300/30\"\n          : undefined\n      : undefined;\n\n  return (\n    <span\n      className={twMerge(\n        \"leading-[18px] text-gray-700 dark:text-slate-200\",\n        bgColor,\n        className,\n      )}\n    >\n      {wordsDiff.map((word, index) => {\n        return word.added ? (\n          viewMode === \"addition\" || viewMode === \"mixed\" ? (\n            <span\n              className={twMerge(\n                (diffMode === \"words\" || viewMode === \"mixed\") &&\n                  \"bg-green-600/30 dark:bg-green-600/30\",\n                childrenClassName,\n              )}\n              key={`${word.value}-${index}`}\n            >\n              {word.value}\n            </span>\n          ) : null\n        ) : word.removed ? (\n          viewMode === \"removal\" || viewMode === \"mixed\" ? (\n            <span\n              className={twMerge(\n                (diffMode === \"words\" || viewMode === \"mixed\") &&\n                  \"bg-red-600/30 dark:bg-red-300/30\",\n                childrenClassName,\n              )}\n              key={`${word.value}-${index}`}\n            >\n              {word.value}\n            </span>\n          ) : null\n        ) : (\n          <span\n            key={`${word.value}-${index}`}\n            className={twMerge(childrenClassName)}\n          >\n            {word.value}\n          </span>\n        );\n      })}\n    </span>\n  );\n};\n"],"mappings":";;;;;AAWA,MAAaI,YAAY,EACvBC,WACAC,OACAC,UACAC,WAAW,SACXC,WACAC,wBACmB;CACnB,MAAMC,YAAYR,cAAc;AAC9B,SAAOK,aAAa,UAChBN,UAAUG,aAAa,IAAIC,MAAM,GACjCL,cAAcI,aAAa,IAAIC,MAAM;IACxC;EAACD;EAAWC;EAAOE;EAAS,CAAC;CAEhC,MAAMI,aAAaT,cAAc;AAC/B,SAAOQ,UAAUE,MAAMC,SAASA,KAAKC,SAASD,KAAKE,QAAQ;IAC1D,CAACL,UAAU,CAAC;AAWf,QACE,oBAAC,QAAD;EACE,WAAWX,QACT,oDAXJQ,aAAa,eAAeI,aACxBL,aAAa,aACX,yCACAA,aAAa,YACX,qCACAW,KAAAA,IACJA,KAAAA,GAOAT,UACD;YAEAE,UAAUQ,KAAKL,MAAMM,UAAU;AAC9B,UAAON,KAAKC,QACVR,aAAa,cAAcA,aAAa,UACtC,oBAAC,QAAD;IACE,WAAWP,SACRQ,aAAa,WAAWD,aAAa,YACpC,wCACFG,kBACD;cAGAI,KAAKR;IACD,EAHA,GAAGQ,KAAKR,MAAK,GAAIc,QAGjB,GACL,OACFN,KAAKE,UACPT,aAAa,aAAaA,aAAa,UACrC,oBAAC,QAAD;IACE,WAAWP,SACRQ,aAAa,WAAWD,aAAa,YACpC,oCACFG,kBACD;cAGAI,KAAKR;IACD,EAHA,GAAGQ,KAAKR,MAAK,GAAIc,QAGjB,GACL,OAEJ,oBAAC,QAAD;IAEE,WAAWpB,QAAQU,kBAAkB;cAEpCI,KAAKR;IAET,EALQ,GAAGQ,KAAKR,MAAK,GAAIc,QAKzB;IACD;EACG,CAAA"}

package/dist/ui/components/json-viewer/json-viewer.d.ts

@@ -1,2 +1,2 @@
-import { t as JsonViewer } from "../../../json-viewer-vWp8vOvz.js";
+import { t as JsonViewer } from "../../../json-viewer-DaTgmzkS.js";
 export { JsonViewer };

package/dist/ui/components/popover/popover.d.ts

@@ -1,2 +1,2 @@
-import { i as PopoverTrigger, n as PopoverAnchor, r as PopoverContent, t as Popover } from "../../../popover-glLRVxPS.js";
+import { i as PopoverTrigger, n as PopoverAnchor, r as PopoverContent, t as Popover } from "../../../popover-XSBOuSih.js";
 export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger };

package/dist/ui/components/popover/popover.js

@@ -1,5 +1,5 @@
-import { t as cn } from "../../../src-BgCjYazJ.js";
 import React from "react";
+import { twMerge } from "tailwind-merge";
 import { jsx } from "react/jsx-runtime";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
 //#region src/ui/components/popover/popover.tsx
@@ -9,13 +9,13 @@ const PopoverTrigger = PopoverPrimitive.Trigger;
 const PopoverContent = /* @__PURE__ */ React.forwardRef(({ align = "center", sideOffset = 4, className, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(PopoverPrimitive.Content, {
 	align,
 	sideOffset,
-	className: cn([
+	className: twMerge([
 		"data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in",
 		"data-[state=closed]:animate-zoom-out data-[state=open]:animate-zoom-in",
 		"data-[side=bottom]:animate-slide-in-from-top data-[side=left]:animate-slide-in-from-right",
 		"data-[side=right]:animate-slide-in-from-left data-[side=top]:animate-slide-in-from-bottom",
 		"z-50 w-(--radix-popover-trigger-width) border p-0 outline-none",
-		"border-gray-300 bg-white dark:border-slate-500 dark:bg-slate-600",
+		"border-gray-300 bg-gray-50 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100",
 		"rounded-md shadow-sidebar"
 	], className),
 	ref,

package/dist/ui/components/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","names":["cn","PopoverPrimitive","React","Popover","Root","PopoverAnchor","Anchor","PopoverTrigger","Trigger","PopoverContent","forwardRef","align","sideOffset","className","props","ref"],"sources":["../../../../src/ui/components/popover/popover.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport React from \"react\";\n\nexport const Popover = PopoverPrimitive.Root;\nexport const PopoverAnchor = PopoverPrimitive.Anchor;\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\n\nexport const PopoverContent = React.forwardRef<\n  React.ElementRef<typeof PopoverPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ align = \"center\", sideOffset = 4, className, ...props }, ref) => (\n  <PopoverPrimitive.Portal>\n    <PopoverPrimitive.Content\n      align={align}\n      sideOffset={sideOffset}\n      className={cn(\n        [\n          \"data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\",\n          \"data-[state=closed]:animate-zoom-out data-[state=open]:animate-zoom-in\",\n          \"data-[side=bottom]:animate-slide-in-from-top data-[side=left]:animate-slide-in-from-right\",\n          \"data-[side=right]:animate-slide-in-from-left data-[side=top]:animate-slide-in-from-bottom\",\n          \"z-50 w-(--radix-popover-trigger-width) border p-0 outline-none\",\n          \"border-gray-300 bg-white dark:border-slate-500 dark:bg-slate-600\",\n          \"rounded-md shadow-sidebar\",\n        ],\n        className,\n      )}\n      ref={ref}\n      {...props}\n    />\n  </PopoverPrimitive.Portal>\n));\n"],"mappings":";;;;;AAIA,MAAaG,UAAUF,iBAAiBG;AACxC,MAAaC,gBAAgBJ,iBAAiBK;AAC9C,MAAaC,iBAAiBN,iBAAiBO;AAE/C,MAAaC,iBAAiBP,sBAAMQ,YAGjC,EAAEC,QAAQ,UAAUC,aAAa,GAAGC,WAAW,GAAGC,SAASC,QAC5D,oBAAC,iBAAiB,QAAlB,EAAA,UACE,oBAAC,iBAAiB,SAAlB;CACSJ;CACKC;CACZ,WAAWZ,GACT;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACD,EACDa,UACD;CACIE;CACL,GAAID;CAAM,CAAA,EAGf,CAAA,CAAC"}
+{"version":3,"file":"popover.js","names":["twMerge","PopoverPrimitive","React","Popover","Root","PopoverAnchor","Anchor","PopoverTrigger","Trigger","PopoverContent","forwardRef","align","sideOffset","className","props","ref"],"sources":["../../../../src/ui/components/popover/popover.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport React from \"react\";\n\nexport const Popover = PopoverPrimitive.Root;\nexport const PopoverAnchor = PopoverPrimitive.Anchor;\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\n\nexport const PopoverContent = React.forwardRef<\n  React.ElementRef<typeof PopoverPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ align = \"center\", sideOffset = 4, className, ...props }, ref) => (\n  <PopoverPrimitive.Portal>\n    <PopoverPrimitive.Content\n      align={align}\n      sideOffset={sideOffset}\n      className={twMerge(\n        [\n          \"data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\",\n          \"data-[state=closed]:animate-zoom-out data-[state=open]:animate-zoom-in\",\n          \"data-[side=bottom]:animate-slide-in-from-top data-[side=left]:animate-slide-in-from-right\",\n          \"data-[side=right]:animate-slide-in-from-left data-[side=top]:animate-slide-in-from-bottom\",\n          \"z-50 w-(--radix-popover-trigger-width) border p-0 outline-none\",\n          \"border-gray-300 bg-gray-50 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100\",\n          \"rounded-md shadow-sidebar\",\n        ],\n        className,\n      )}\n      ref={ref}\n      {...props}\n    />\n  </PopoverPrimitive.Portal>\n));\n"],"mappings":";;;;;AAIA,MAAaG,UAAUF,iBAAiBG;AACxC,MAAaC,gBAAgBJ,iBAAiBK;AAC9C,MAAaC,iBAAiBN,iBAAiBO;AAE/C,MAAaC,iBAAiBP,sBAAMQ,YAGjC,EAAEC,QAAQ,UAAUC,aAAa,GAAGC,WAAW,GAAGC,SAASC,QAC5D,oBAAC,iBAAiB,QAAlB,EAAA,UACE,oBAAC,iBAAiB,SAAlB;CACSJ;CACKC;CACZ,WAAWZ,QACT;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACD,EACDa,UACD;CACIE;CACL,GAAID;CAAM,CAAA,EAGf,CAAA,CAAC"}

package/dist/ui/components/radio-group-field/radio-group-field.d.ts

@@ -1,2 +1,2 @@
-import { n as RadioGroupFieldProps, t as RadioGroupField } from "../../../radio-group-field-DNapUn2b.js";
+import { n as RadioGroupFieldProps, t as RadioGroupField } from "../../../radio-group-field-BN654-SO.js";
 export { RadioGroupField, RadioGroupFieldProps };

package/dist/ui/components/radio-group-field/radio-group-field.js

@@ -1,10 +1,10 @@
-import { t as cn } from "../../../src-BgCjYazJ.js";
 import { FormLabel } from "../form-label/form-label.js";
 import { FormMessageList } from "../form-message/message-list.js";
 import { withFieldValidation } from "../with-field-validation/with-field-validation.js";
 import { RadioGroup } from "./radio-group.js";
 import { Radio } from "./radio.js";
 import { forwardRef, useId } from "react";
+import { twMerge } from "tailwind-merge";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ui/components/radio-group-field/radio-group-field.tsx
 const RadioGroupFieldRaw = /* @__PURE__ */ forwardRef(({ autoFocus, className, defaultValue, description, disabled, warnings = [], errors = [], id: propId, label, name, onChange, options = [], required, value, ...props }, ref) => {
@@ -17,7 +17,7 @@ const RadioGroupFieldRaw = /* @__PURE__ */ forwardRef(({ autoFocus, className, d
 		"aria-label": !hasLabel ? "Radio group" : void 0,
 		"aria-required": required,
 		autoFocus,
-		className: cn("flex flex-col gap-2", className),
+		className: twMerge("flex flex-col gap-2", className),
 		defaultValue,
 		id,
 		name,

package/dist/ui/components/radio-group-field/radio-group-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-group-field.js","names":["cn","forwardRef","useId","FormLabel","FormMessageList","withFieldValidation","RadioGroup","Radio","RadioGroupFieldRaw","autoFocus","className","defaultValue","description","disabled","warnings","errors","id","propId","label","name","onChange","options","required","value","props","ref","hasLabel","undefined","hasError","length","prefix","newValue","map","option","index","RadioGroupField","Component","displayName"],"sources":["../../../../src/ui/components/radio-group-field/radio-group-field.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport type { HTMLAttributes, Ref } from \"react\";\nimport { forwardRef, useId } from \"react\";\nimport type { FieldErrorHandling, InputBaseProps } from \"../../types.js\";\nimport type { RadioGroupProps } from \"../enum-field/types.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\nimport { RadioGroup } from \"./radio-group.js\";\nimport { Radio } from \"./radio.js\";\ntype RadioGroupFieldBaseProps = Omit<\n  HTMLAttributes<HTMLDivElement>,\n  | keyof InputBaseProps<string>\n  | keyof FieldErrorHandling\n  | keyof RadioGroupProps\n  | \"dir\"\n> & {\n  dir?: \"ltr\" | \"rtl\";\n};\n\nexport type RadioGroupFieldProps = RadioGroupFieldBaseProps &\n  InputBaseProps<string> &\n  FieldErrorHandling &\n  RadioGroupProps;\n\nconst RadioGroupFieldRaw = forwardRef<HTMLDivElement, RadioGroupFieldProps>(\n  (\n    {\n      autoFocus,\n      className,\n      defaultValue,\n      description,\n      disabled,\n      warnings = [],\n      errors = [],\n      id: propId,\n      label,\n      name,\n      onChange,\n      options = [],\n      required,\n      value,\n      ...props\n    },\n    ref,\n  ) => {\n    const hasLabel = label !== undefined;\n    const hasError = errors.length > 0;\n    const prefix = useId();\n    const id = propId ?? `${prefix}-radio-group`;\n\n    return (\n      <RadioGroup\n        aria-invalid={hasError}\n        aria-label={!hasLabel ? \"Radio group\" : undefined}\n        aria-required={required}\n        autoFocus={autoFocus}\n        className={cn(\"flex flex-col gap-2\", className)}\n        defaultValue={defaultValue}\n        id={id}\n        name={name}\n        onValueChange={(newValue) => {\n          onChange?.(newValue);\n        }}\n        value={value}\n        disabled={disabled}\n        {...props}\n        ref={ref}\n      >\n        {hasLabel && (\n          <FormLabel\n            description={description}\n            hasError={hasError}\n            htmlFor={id}\n            required={required}\n            disabled={disabled}\n          >\n            {label}\n          </FormLabel>\n        )}\n        {options.map((option, index) => (\n          <div\n            key={`${prefix}-radio-${index}-${option.value}`}\n            className=\"flex items-center gap-2\"\n            role=\"presentation\"\n          >\n            <Radio\n              id={`${prefix}-radio-${index}-${option.value}`}\n              label={option.label}\n              value={option.value}\n              description={option.description}\n              disabled={disabled || option.disabled}\n              hasError={hasError}\n            />\n          </div>\n        ))}\n        {warnings.length > 0 && (\n          <FormMessageList messages={warnings} type=\"warning\" />\n        )}\n        {hasError && <FormMessageList messages={errors} type=\"error\" />}\n      </RadioGroup>\n    );\n  },\n);\n\nexport const RadioGroupField = forwardRef(function RadioGroupField(\n  props: RadioGroupFieldProps,\n  ref: Ref<HTMLDivElement>,\n) {\n  const Component =\n    withFieldValidation<RadioGroupFieldProps>(RadioGroupFieldRaw);\n  return <Component {...props} ref={ref} />;\n});\n\nRadioGroupField.displayName = \"RadioGroupField\";\n"],"mappings":";;;;;;;;;AAyBA,MAAMQ,qBAAqBP,4BAEvB,EACEQ,WACAC,WACAC,cACAC,aACAC,UACAC,WAAW,EAAE,EACbC,SAAS,EAAE,EACXC,IAAIC,QACJC,OACAC,MACAC,UACAC,UAAU,EAAE,EACZC,UACAC,OACA,GAAGC,SAELC,QACG;CACH,MAAMC,WAAWR,UAAUS,KAAAA;CAC3B,MAAMC,WAAWb,OAAOc,SAAS;CACjC,MAAMC,SAAS5B,OAAO;CACtB,MAAMc,KAAKC,UAAU,GAAGa,OAAM;AAE9B,QACE,qBAAC,YAAD;EACE,gBAAcF;EACd,cAAY,CAACF,WAAW,gBAAgBC,KAAAA;EACxC,iBAAeL;EACJb;EACX,WAAWT,GAAG,uBAAuBU,UAAU;EACjCC;EACVK;EACEG;EACN,gBAAgBY,aAAa;AAC3BX,cAAWW,SAAS;;EAEfR;EACGV;EACV,GAAIW;EACCC;YAfP;GAiBGC,YACC,oBAAC,WAAD;IACed;IACHgB;IACV,SAASZ;IACCM;IACAT;cAETK;IAEJ,CAAA;GACAG,QAAQW,KAAKC,QAAQC,UACpB,oBAAC,OAAD;IAEE,WAAU;IACV,MAAK;cAEL,oBAAC,OAAD;KACE,IAAI,GAAGJ,OAAM,SAAUI,MAAK,GAAID,OAAOV;KACvC,OAAOU,OAAOf;KACd,OAAOe,OAAOV;KACd,aAAaU,OAAOrB;KACpB,UAAUC,YAAYoB,OAAOpB;KACnBe;KAAS,CAAA;IAGxB,EAbQ,GAAGE,OAAM,SAAUI,MAAK,GAAID,OAAOV,QAa3C,CAAC;GACDT,SAASe,SAAS,KACjB,oBAAC,iBAAD;IAAiB,UAAUf;IAAU,MAAK;IAC3C,CAAA;GACAc,YAAY,oBAAC,iBAAD;IAAiB,UAAUb;IAAQ,MAAK;IAAU,CAAA;GACpD;;EAGlB;AAED,MAAaoB,kBAAkBlC,2BAAW,SAASkC,gBACjDX,OACAC,KACA;AAGA,QAAO,oBADLpB,oBAA0CG,mBAAmB,EACxD;EAAW,GAAIgB;EAAYC;EAAO,CAAA;EACzC;AAEFU,gBAAgBE,cAAc"}
+{"version":3,"file":"radio-group-field.js","names":["twMerge","forwardRef","useId","FormLabel","FormMessageList","withFieldValidation","RadioGroup","Radio","RadioGroupFieldRaw","autoFocus","className","defaultValue","description","disabled","warnings","errors","id","propId","label","name","onChange","options","required","value","props","ref","hasLabel","undefined","hasError","length","prefix","newValue","map","option","index","RadioGroupField","Component","displayName"],"sources":["../../../../src/ui/components/radio-group-field/radio-group-field.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\nimport type { HTMLAttributes, Ref } from \"react\";\nimport { forwardRef, useId } from \"react\";\nimport type { FieldErrorHandling, InputBaseProps } from \"../../types.js\";\nimport type { RadioGroupProps } from \"../enum-field/types.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\nimport { RadioGroup } from \"./radio-group.js\";\nimport { Radio } from \"./radio.js\";\ntype RadioGroupFieldBaseProps = Omit<\n  HTMLAttributes<HTMLDivElement>,\n  | keyof InputBaseProps<string>\n  | keyof FieldErrorHandling\n  | keyof RadioGroupProps\n  | \"dir\"\n> & {\n  dir?: \"ltr\" | \"rtl\";\n};\n\nexport type RadioGroupFieldProps = RadioGroupFieldBaseProps &\n  InputBaseProps<string> &\n  FieldErrorHandling &\n  RadioGroupProps;\n\nconst RadioGroupFieldRaw = forwardRef<HTMLDivElement, RadioGroupFieldProps>(\n  (\n    {\n      autoFocus,\n      className,\n      defaultValue,\n      description,\n      disabled,\n      warnings = [],\n      errors = [],\n      id: propId,\n      label,\n      name,\n      onChange,\n      options = [],\n      required,\n      value,\n      ...props\n    },\n    ref,\n  ) => {\n    const hasLabel = label !== undefined;\n    const hasError = errors.length > 0;\n    const prefix = useId();\n    const id = propId ?? `${prefix}-radio-group`;\n\n    return (\n      <RadioGroup\n        aria-invalid={hasError}\n        aria-label={!hasLabel ? \"Radio group\" : undefined}\n        aria-required={required}\n        autoFocus={autoFocus}\n        className={twMerge(\"flex flex-col gap-2\", className)}\n        defaultValue={defaultValue}\n        id={id}\n        name={name}\n        onValueChange={(newValue) => {\n          onChange?.(newValue);\n        }}\n        value={value}\n        disabled={disabled}\n        {...props}\n        ref={ref}\n      >\n        {hasLabel && (\n          <FormLabel\n            description={description}\n            hasError={hasError}\n            htmlFor={id}\n            required={required}\n            disabled={disabled}\n          >\n            {label}\n          </FormLabel>\n        )}\n        {options.map((option, index) => (\n          <div\n            key={`${prefix}-radio-${index}-${option.value}`}\n            className=\"flex items-center gap-2\"\n            role=\"presentation\"\n          >\n            <Radio\n              id={`${prefix}-radio-${index}-${option.value}`}\n              label={option.label}\n              value={option.value}\n              description={option.description}\n              disabled={disabled || option.disabled}\n              hasError={hasError}\n            />\n          </div>\n        ))}\n        {warnings.length > 0 && (\n          <FormMessageList messages={warnings} type=\"warning\" />\n        )}\n        {hasError && <FormMessageList messages={errors} type=\"error\" />}\n      </RadioGroup>\n    );\n  },\n);\n\nexport const RadioGroupField = forwardRef(function RadioGroupField(\n  props: RadioGroupFieldProps,\n  ref: Ref<HTMLDivElement>,\n) {\n  const Component =\n    withFieldValidation<RadioGroupFieldProps>(RadioGroupFieldRaw);\n  return <Component {...props} ref={ref} />;\n});\n\nRadioGroupField.displayName = \"RadioGroupField\";\n"],"mappings":";;;;;;;;;AAyBA,MAAMQ,qBAAqBP,4BAEvB,EACEQ,WACAC,WACAC,cACAC,aACAC,UACAC,WAAW,EAAE,EACbC,SAAS,EAAE,EACXC,IAAIC,QACJC,OACAC,MACAC,UACAC,UAAU,EAAE,EACZC,UACAC,OACA,GAAGC,SAELC,QACG;CACH,MAAMC,WAAWR,UAAUS,KAAAA;CAC3B,MAAMC,WAAWb,OAAOc,SAAS;CACjC,MAAMC,SAAS5B,OAAO;CACtB,MAAMc,KAAKC,UAAU,GAAGa,OAAM;AAE9B,QACE,qBAAC,YAAD;EACE,gBAAcF;EACd,cAAY,CAACF,WAAW,gBAAgBC,KAAAA;EACxC,iBAAeL;EACJb;EACX,WAAWT,QAAQ,uBAAuBU,UAAU;EACtCC;EACVK;EACEG;EACN,gBAAgBY,aAAa;AAC3BX,cAAWW,SAAS;;EAEfR;EACGV;EACV,GAAIW;EACCC;YAfP;GAiBGC,YACC,oBAAC,WAAD;IACed;IACHgB;IACV,SAASZ;IACCM;IACAT;cAETK;IAEJ,CAAA;GACAG,QAAQW,KAAKC,QAAQC,UACpB,oBAAC,OAAD;IAEE,WAAU;IACV,MAAK;cAEL,oBAAC,OAAD;KACE,IAAI,GAAGJ,OAAM,SAAUI,MAAK,GAAID,OAAOV;KACvC,OAAOU,OAAOf;KACd,OAAOe,OAAOV;KACd,aAAaU,OAAOrB;KACpB,UAAUC,YAAYoB,OAAOpB;KACnBe;KAAS,CAAA;IAGxB,EAbQ,GAAGE,OAAM,SAAUI,MAAK,GAAID,OAAOV,QAa3C,CAAC;GACDT,SAASe,SAAS,KACjB,oBAAC,iBAAD;IAAiB,UAAUf;IAAU,MAAK;IAC3C,CAAA;GACAc,YAAY,oBAAC,iBAAD;IAAiB,UAAUb;IAAQ,MAAK;IAAU,CAAA;GACpD;;EAGlB;AAED,MAAaoB,kBAAkBlC,2BAAW,SAASkC,gBACjDX,OACAC,KACA;AAGA,QAAO,oBADLpB,oBAA0CG,mBAAmB,EACxD;EAAW,GAAIgB;EAAYC;EAAO,CAAA;EACzC;AAEFU,gBAAgBE,cAAc"}