@fuf-stack/uniform 0.9.8 → 0.9.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Select/index.cjs +2 -2
- package/dist/Select/index.js +1 -1
- package/dist/Switch/index.cjs +2 -2
- package/dist/Switch/index.js +1 -1
- package/dist/{chunk-NQ4JZ7AK.cjs → chunk-66Q6RBEH.cjs} +2 -4
- package/dist/chunk-66Q6RBEH.cjs.map +1 -0
- package/dist/{chunk-E23J3M7Q.cjs → chunk-F27MGBJS.cjs} +9 -8
- package/dist/chunk-F27MGBJS.cjs.map +1 -0
- package/dist/{chunk-EA5X3DJ2.js → chunk-TDVRLVOO.js} +9 -8
- package/dist/chunk-TDVRLVOO.js.map +1 -0
- package/dist/{chunk-PFX4YRWI.js → chunk-ZEABU72A.js} +2 -4
- package/dist/chunk-ZEABU72A.js.map +1 -0
- package/dist/index.cjs +6 -6
- package/dist/index.js +5 -5
- package/package.json +3 -3
- package/dist/chunk-E23J3M7Q.cjs.map +0 -1
- package/dist/chunk-EA5X3DJ2.js.map +0 -1
- package/dist/chunk-NQ4JZ7AK.cjs.map +0 -1
- package/dist/chunk-PFX4YRWI.js.map +0 -1
package/dist/Select/index.cjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkF27MGBJScjs = require('../chunk-F27MGBJS.cjs');
|
|
5
5
|
require('../chunk-KMMS4G7A.cjs');
|
|
6
6
|
require('../chunk-OHJYXA6R.cjs');
|
|
7
7
|
require('../chunk-LDCRR7FP.cjs');
|
|
@@ -9,5 +9,5 @@ require('../chunk-BBB4FEY6.cjs');
|
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
|
|
12
|
-
exports.Select =
|
|
12
|
+
exports.Select = _chunkF27MGBJScjs.Select_default; exports.default = _chunkF27MGBJScjs.Select_default2;
|
|
13
13
|
//# sourceMappingURL=index.cjs.map
|
package/dist/Select/index.js
CHANGED
package/dist/Switch/index.cjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunk66Q6RBEHcjs = require('../chunk-66Q6RBEH.cjs');
|
|
5
5
|
require('../chunk-KMMS4G7A.cjs');
|
|
6
6
|
require('../chunk-OHJYXA6R.cjs');
|
|
7
7
|
require('../chunk-LDCRR7FP.cjs');
|
|
@@ -9,5 +9,5 @@ require('../chunk-BBB4FEY6.cjs');
|
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
|
|
12
|
-
exports.Switch =
|
|
12
|
+
exports.Switch = _chunk66Q6RBEHcjs.Switch_default; exports.default = _chunk66Q6RBEHcjs.Switch_default2;
|
|
13
13
|
//# sourceMappingURL=index.cjs.map
|
package/dist/Switch/index.js
CHANGED
|
@@ -37,7 +37,7 @@ var Switch = ({
|
|
|
37
37
|
}) => {
|
|
38
38
|
const { control, getFieldState } = _chunkLDCRR7FPcjs.useFormContext.call(void 0, );
|
|
39
39
|
const { error, required, testId, invalid } = getFieldState(name, _testId);
|
|
40
|
-
const { label, getInputProps,
|
|
40
|
+
const { label, getInputProps, getErrorMessageProps } = _input.useInput.call(void 0, {
|
|
41
41
|
errorMessage: JSON.stringify(error),
|
|
42
42
|
isInvalid: invalid,
|
|
43
43
|
isRequired: required,
|
|
@@ -47,8 +47,6 @@ var Switch = ({
|
|
|
47
47
|
});
|
|
48
48
|
const variants = switchVariants();
|
|
49
49
|
const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "outerWrapper");
|
|
50
|
-
console.log("getHelperWrapperProps()", getHelperWrapperProps());
|
|
51
|
-
console.log("getErrorMessageProps()", getErrorMessageProps());
|
|
52
50
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
53
51
|
_reacthookform.Controller,
|
|
54
52
|
{
|
|
@@ -100,4 +98,4 @@ var Switch_default2 = Switch_default;
|
|
|
100
98
|
|
|
101
99
|
|
|
102
100
|
exports.Switch_default = Switch_default; exports.Switch_default2 = Switch_default2;
|
|
103
|
-
//# sourceMappingURL=chunk-
|
|
101
|
+
//# sourceMappingURL=chunk-66Q6RBEH.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-66Q6RBEH.cjs","../src/Switch/Switch.tsx","../src/Switch/index.ts"],"names":["Switch_default"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-66Q6RBEH.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from 'react-hook-form';\n\nimport { useInput } from '@nextui-org/input';\nimport { Switch as NextSwitch } from '@nextui-org/switch';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const switchVariants = tv({\n slots: {\n base: '',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n outerWrapper: 'place-content-center',\n startContent: '',\n thumb: '',\n thumbIcon: '',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** whether the select should be disabled */\n disabled?: boolean;\n /** component displayed next to the switch. */\n label?: React.ReactNode;\n /** name the field is registered under */\n name: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Switch component based on [NextUI Switch](https://nextui.org/docs/components/switch)\n */\nconst Switch = ({\n className = undefined,\n disabled = false,\n label: _label = undefined,\n name,\n testId: _testId = undefined,\n}: SwitchProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, required, testId, invalid } = getFieldState(name, _testId);\n\n const { label, getInputProps, getErrorMessageProps } = useInput({\n errorMessage: JSON.stringify(error),\n isInvalid: invalid,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n const variants = switchVariants();\n const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n return (\n <Controller\n name={name}\n control={control}\n disabled={disabled}\n render={({\n field: { disabled: isDisabled, value, ref, onBlur, onChange },\n }) => (\n <div className={classNames.outerWrapper}>\n <NextSwitch\n aria-describedby={getInputProps()['aria-describedby']}\n classNames={classNames}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n isDisabled={isDisabled}\n isSelected={!!value}\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n ref={ref}\n required={required}\n value={value}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </NextSwitch>\n {error && (\n <div className={classNames.errorMessage}>\n <div\n /* eslint-disable-next-line react/jsx-props-no-spreading */\n {...getErrorMessageProps()}\n >\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"]}
|
|
@@ -8,6 +8,9 @@ var _chunkOHJYXA6Rcjs = require('./chunk-OHJYXA6R.cjs');
|
|
|
8
8
|
|
|
9
9
|
var _chunkLDCRR7FPcjs = require('./chunk-LDCRR7FP.cjs');
|
|
10
10
|
|
|
11
|
+
|
|
12
|
+
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
13
|
+
|
|
11
14
|
// src/Select/Select.tsx
|
|
12
15
|
var _react = require('react');
|
|
13
16
|
var _reacthookform = require('react-hook-form');
|
|
@@ -61,7 +64,7 @@ var ControlComponent = (props) => {
|
|
|
61
64
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "data-testid": testId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactselect.components.Control, { ...props }) });
|
|
62
65
|
};
|
|
63
66
|
var OptionComponent = (props) => {
|
|
64
|
-
const testId = `${props.selectProps["data-testid"]}_select_option_${_nullishCoalesce(_optionalChain([props, 'optionalAccess', _ => _.data, 'optionalAccess', _2 => _2.testId]), () => ( _optionalChain([props, 'optionalAccess', _3 => _3.data, 'optionalAccess', _4 => _4.value])))}`;
|
|
67
|
+
const testId = `${props.selectProps["data-testid"]}_select_option_${_chunkBBB4FEY6cjs.slugify.call(void 0, _nullishCoalesce(_optionalChain([props, 'optionalAccess', _ => _.data, 'optionalAccess', _2 => _2.testId]), () => ( _optionalChain([props, 'optionalAccess', _3 => _3.data, 'optionalAccess', _4 => _4.value]))))}`;
|
|
65
68
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "data-testid": testId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactselect.components.Option, { ...props }) });
|
|
66
69
|
};
|
|
67
70
|
var DropdownIndicatorComponent = (props) => {
|
|
@@ -198,13 +201,11 @@ var Select = ({
|
|
|
198
201
|
},
|
|
199
202
|
onChange: (option) => {
|
|
200
203
|
if (multiSelect) {
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
})]);
|
|
205
|
-
onChange(transformedOptions);
|
|
204
|
+
onChange(
|
|
205
|
+
_optionalChain([option, 'optionalAccess', _12 => _12.map, 'call', _13 => _13((_option) => _option.value)])
|
|
206
|
+
);
|
|
206
207
|
} else {
|
|
207
|
-
onChange(option
|
|
208
|
+
onChange(_optionalChain([option, 'optionalAccess', _14 => _14.value]));
|
|
208
209
|
}
|
|
209
210
|
},
|
|
210
211
|
onFocus: (_e) => {
|
|
@@ -233,4 +234,4 @@ var Select_default2 = Select_default;
|
|
|
233
234
|
|
|
234
235
|
|
|
235
236
|
exports.Select_default = Select_default; exports.Select_default2 = Select_default2;
|
|
236
|
-
//# sourceMappingURL=chunk-
|
|
237
|
+
//# sourceMappingURL=chunk-F27MGBJS.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-F27MGBJS.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["Select_default"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-F27MGBJS.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport { Controller } from 'react-hook-form';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@nextui-org/select';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const selectVariants = tv({\n slots: {\n base: 'group',\n clearIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n control:\n 'rounded-lg border-2 border-default-200 !duration-150 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n control_focused: 'border-primary hover:border-primary',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-default-300',\n input: 'py-0.5 pl-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'pointer-events-auto relative bottom-1.5 ml-1 text-small subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n loadingIndicator: '',\n loadingMessage: '',\n menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: '!z-50',\n multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n option_focused: 'bg-default-100 active:bg-default-200',\n option_selected: 'bg-default-300',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'py-0.5 pl-1 text-foreground-500',\n selectContainer: '',\n singleValue: '!ml-1 !leading-7',\n valueContainer: 'gap-1 p-1',\n },\n});\n\ntype SelectOption = {\n /** option label */\n label?: React.ReactNode;\n /** option value */\n value: string;\n};\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps extends VariantProps {\n /** CSS class name */\n className?: ClassName; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n /** Filter Select Options */\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** Format the label of the option */\n renderOptionLabel?: undefined | Props['formatOptionLabel'];\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: React.ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}`;\n // eslint-disable-next-line react/jsx-props-no-spreading\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Control {...props} />\n </div>\n );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select_option_${slugify(props?.data?.testId ?? props?.data?.value)}`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_select_dropdown`}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\n/** Select component based on [NextUI Select](https://nextui.org/docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n disabled = false,\n filterOption = undefined,\n renderOptionLabel = undefined,\n inputValue = undefined,\n label: _label = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n testId: _testId = undefined,\n}: SelectProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const [isFocused, setIsFocused] = useState(false);\n\n const variants = selectVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const {\n getBaseProps,\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n getTriggerProps,\n getValueProps,\n label,\n } = useSelect({\n children: [],\n classNames,\n errorMessage: JSON.stringify(error),\n isDisabled: disabled,\n isInvalid: invalid,\n isLoading: loading,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n return (\n <Controller\n control={control}\n name={name}\n render={({\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n field: { onChange, value, ref, onBlur },\n }) => (\n <div\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getBaseProps()}\n className={cn(classNames.base)}\n data-testid={`${testId}_wrapper`}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-required={required}\n >\n {label && (\n <label\n className={classNames.label}\n data-slot=\"label\"\n htmlFor={`react-select-${name}-input`}\n id={getLabelProps().id}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </label>\n )}\n <ReactSelect\n aria-errormessage=\"\"\n aria-labelledby={\n getTriggerProps()['aria-labelledby']?.split(' ')[1]\n }\n aria-invalid={invalid}\n classNames={{\n control: () =>\n cn(classNames.control, {\n [classNames.control_focused]: isFocused && !invalid,\n }),\n clearIndicator: () => classNames.clearIndicator,\n dropdownIndicator: () => classNames.dropdownIndicator,\n groupHeading: () => classNames.groupHeading,\n indicatorsContainer: () => classNames.indicatorsContainer,\n indicatorSeparator: () => classNames.indicatorSeparator,\n input: () => classNames.input,\n menu: () => classNames.menu,\n menuList: () => classNames.menuList,\n menuPortal: () => classNames.menuPortal,\n multiValue: () => classNames.multiValue,\n multiValueLabel: () =>\n cn(classNames.multiValueLabel, `${getValueProps().className}`),\n multiValueRemove: () => classNames.multiValueRemove,\n noOptionsMessage: () => classNames.noOptionsMessage,\n option: ({\n isFocused: optionIsFocused,\n isSelected: optionIsSelected,\n }) =>\n cn(classNames.option, {\n [classNames.option_focused]: optionIsFocused,\n [classNames.option_selected]: optionIsSelected,\n }),\n placeholder: () => classNames.placeholder,\n singleValue: () =>\n cn(classNames.singleValue, `${getValueProps().className}`),\n valueContainer: () => classNames.valueContainer,\n }}\n components={{\n Input: InputComponent,\n Option: OptionComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n Control: ControlComponent,\n }}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={testId}\n filterOption={filterOption}\n formatOptionLabel={renderOptionLabel}\n inputValue={inputValue}\n instanceId={name}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n name={name}\n // set menuPosition to fixed so that menu can be rendered\n // inside Card / Modal components, menuShouldBlockScroll\n // prevents container scroll when menu is open\n menuPosition=\"fixed\"\n menuShouldBlockScroll\n options={options}\n placeholder={placeholder}\n onBlur={(_e) => {\n setIsFocused(false);\n return onBlur();\n }}\n onChange={(option) => {\n if (multiSelect) {\n onChange(\n (option as SelectOption[])?.map((_option) => _option.value),\n );\n } else {\n onChange((option as SelectOption)?.value);\n }\n }}\n onFocus={(_e) => {\n setIsFocused(true);\n }}\n onInputChange={onInputChange}\n ref={ref}\n // set complete option as value by current field value\n value={options.find((option) => option.value === value)}\n unstyled\n />\n {error && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <div {...getHelperWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <div {...getErrorMessageProps()}>\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"]}
|
|
@@ -7,6 +7,9 @@ import {
|
|
|
7
7
|
import {
|
|
8
8
|
useFormContext
|
|
9
9
|
} from "./chunk-HWDQZO7X.js";
|
|
10
|
+
import {
|
|
11
|
+
slugify
|
|
12
|
+
} from "./chunk-V46BHM2U.js";
|
|
10
13
|
|
|
11
14
|
// src/Select/Select.tsx
|
|
12
15
|
import { useState } from "react";
|
|
@@ -61,7 +64,7 @@ var ControlComponent = (props) => {
|
|
|
61
64
|
return /* @__PURE__ */ jsx("div", { "data-testid": testId, children: /* @__PURE__ */ jsx(components.Control, { ...props }) });
|
|
62
65
|
};
|
|
63
66
|
var OptionComponent = (props) => {
|
|
64
|
-
const testId = `${props.selectProps["data-testid"]}_select_option_${props?.data?.testId ?? props?.data?.value}`;
|
|
67
|
+
const testId = `${props.selectProps["data-testid"]}_select_option_${slugify(props?.data?.testId ?? props?.data?.value)}`;
|
|
65
68
|
return /* @__PURE__ */ jsx("div", { "data-testid": testId, children: /* @__PURE__ */ jsx(components.Option, { ...props }) });
|
|
66
69
|
};
|
|
67
70
|
var DropdownIndicatorComponent = (props) => {
|
|
@@ -198,13 +201,11 @@ var Select = ({
|
|
|
198
201
|
},
|
|
199
202
|
onChange: (option) => {
|
|
200
203
|
if (multiSelect) {
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
});
|
|
205
|
-
onChange(transformedOptions);
|
|
204
|
+
onChange(
|
|
205
|
+
option?.map((_option) => _option.value)
|
|
206
|
+
);
|
|
206
207
|
} else {
|
|
207
|
-
onChange(option
|
|
208
|
+
onChange(option?.value);
|
|
208
209
|
}
|
|
209
210
|
},
|
|
210
211
|
onFocus: (_e) => {
|
|
@@ -233,4 +234,4 @@ export {
|
|
|
233
234
|
Select_default,
|
|
234
235
|
Select_default2
|
|
235
236
|
};
|
|
236
|
-
//# sourceMappingURL=chunk-
|
|
237
|
+
//# sourceMappingURL=chunk-TDVRLVOO.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Select/Select.tsx","../src/Select/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport { Controller } from 'react-hook-form';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@nextui-org/select';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const selectVariants = tv({\n slots: {\n base: 'group',\n clearIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n control:\n 'rounded-lg border-2 border-default-200 !duration-150 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n control_focused: 'border-primary hover:border-primary',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-default-300',\n input: 'py-0.5 pl-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'pointer-events-auto relative bottom-1.5 ml-1 text-small subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n loadingIndicator: '',\n loadingMessage: '',\n menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: '!z-50',\n multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n option_focused: 'bg-default-100 active:bg-default-200',\n option_selected: 'bg-default-300',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'py-0.5 pl-1 text-foreground-500',\n selectContainer: '',\n singleValue: '!ml-1 !leading-7',\n valueContainer: 'gap-1 p-1',\n },\n});\n\ntype SelectOption = {\n /** option label */\n label?: React.ReactNode;\n /** option value */\n value: string;\n};\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps extends VariantProps {\n /** CSS class name */\n className?: ClassName; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n /** Filter Select Options */\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** Format the label of the option */\n renderOptionLabel?: undefined | Props['formatOptionLabel'];\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: React.ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}`;\n // eslint-disable-next-line react/jsx-props-no-spreading\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Control {...props} />\n </div>\n );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select_option_${slugify(props?.data?.testId ?? props?.data?.value)}`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_select_dropdown`}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\n/** Select component based on [NextUI Select](https://nextui.org/docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n disabled = false,\n filterOption = undefined,\n renderOptionLabel = undefined,\n inputValue = undefined,\n label: _label = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n testId: _testId = undefined,\n}: SelectProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const [isFocused, setIsFocused] = useState(false);\n\n const variants = selectVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const {\n getBaseProps,\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n getTriggerProps,\n getValueProps,\n label,\n } = useSelect({\n children: [],\n classNames,\n errorMessage: JSON.stringify(error),\n isDisabled: disabled,\n isInvalid: invalid,\n isLoading: loading,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n return (\n <Controller\n control={control}\n name={name}\n render={({\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n field: { onChange, value, ref, onBlur },\n }) => (\n <div\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getBaseProps()}\n className={cn(classNames.base)}\n data-testid={`${testId}_wrapper`}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-required={required}\n >\n {label && (\n <label\n className={classNames.label}\n data-slot=\"label\"\n htmlFor={`react-select-${name}-input`}\n id={getLabelProps().id}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </label>\n )}\n <ReactSelect\n aria-errormessage=\"\"\n aria-labelledby={\n getTriggerProps()['aria-labelledby']?.split(' ')[1]\n }\n aria-invalid={invalid}\n classNames={{\n control: () =>\n cn(classNames.control, {\n [classNames.control_focused]: isFocused && !invalid,\n }),\n clearIndicator: () => classNames.clearIndicator,\n dropdownIndicator: () => classNames.dropdownIndicator,\n groupHeading: () => classNames.groupHeading,\n indicatorsContainer: () => classNames.indicatorsContainer,\n indicatorSeparator: () => classNames.indicatorSeparator,\n input: () => classNames.input,\n menu: () => classNames.menu,\n menuList: () => classNames.menuList,\n menuPortal: () => classNames.menuPortal,\n multiValue: () => classNames.multiValue,\n multiValueLabel: () =>\n cn(classNames.multiValueLabel, `${getValueProps().className}`),\n multiValueRemove: () => classNames.multiValueRemove,\n noOptionsMessage: () => classNames.noOptionsMessage,\n option: ({\n isFocused: optionIsFocused,\n isSelected: optionIsSelected,\n }) =>\n cn(classNames.option, {\n [classNames.option_focused]: optionIsFocused,\n [classNames.option_selected]: optionIsSelected,\n }),\n placeholder: () => classNames.placeholder,\n singleValue: () =>\n cn(classNames.singleValue, `${getValueProps().className}`),\n valueContainer: () => classNames.valueContainer,\n }}\n components={{\n Input: InputComponent,\n Option: OptionComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n Control: ControlComponent,\n }}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={testId}\n filterOption={filterOption}\n formatOptionLabel={renderOptionLabel}\n inputValue={inputValue}\n instanceId={name}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n name={name}\n // set menuPosition to fixed so that menu can be rendered\n // inside Card / Modal components, menuShouldBlockScroll\n // prevents container scroll when menu is open\n menuPosition=\"fixed\"\n menuShouldBlockScroll\n options={options}\n placeholder={placeholder}\n onBlur={(_e) => {\n setIsFocused(false);\n return onBlur();\n }}\n onChange={(option) => {\n if (multiSelect) {\n onChange(\n (option as SelectOption[])?.map((_option) => _option.value),\n );\n } else {\n onChange((option as SelectOption)?.value);\n }\n }}\n onFocus={(_e) => {\n setIsFocused(true);\n }}\n onInputChange={onInputChange}\n ref={ref}\n // set complete option as value by current field value\n value={options.find((option) => option.value === value)}\n unstyled\n />\n {error && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <div {...getHelperWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <div {...getErrorMessageProps()}>\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"],"mappings":"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","names":["Select_default"]}
|
|
@@ -37,7 +37,7 @@ var Switch = ({
|
|
|
37
37
|
}) => {
|
|
38
38
|
const { control, getFieldState } = useFormContext();
|
|
39
39
|
const { error, required, testId, invalid } = getFieldState(name, _testId);
|
|
40
|
-
const { label, getInputProps,
|
|
40
|
+
const { label, getInputProps, getErrorMessageProps } = useInput({
|
|
41
41
|
errorMessage: JSON.stringify(error),
|
|
42
42
|
isInvalid: invalid,
|
|
43
43
|
isRequired: required,
|
|
@@ -47,8 +47,6 @@ var Switch = ({
|
|
|
47
47
|
});
|
|
48
48
|
const variants = switchVariants();
|
|
49
49
|
const classNames = variantsToClassNames(variants, className, "outerWrapper");
|
|
50
|
-
console.log("getHelperWrapperProps()", getHelperWrapperProps());
|
|
51
|
-
console.log("getErrorMessageProps()", getErrorMessageProps());
|
|
52
50
|
return /* @__PURE__ */ jsx(
|
|
53
51
|
Controller,
|
|
54
52
|
{
|
|
@@ -100,4 +98,4 @@ export {
|
|
|
100
98
|
Switch_default,
|
|
101
99
|
Switch_default2
|
|
102
100
|
};
|
|
103
|
-
//# sourceMappingURL=chunk-
|
|
101
|
+
//# sourceMappingURL=chunk-ZEABU72A.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Switch/Switch.tsx","../src/Switch/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from 'react-hook-form';\n\nimport { useInput } from '@nextui-org/input';\nimport { Switch as NextSwitch } from '@nextui-org/switch';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const switchVariants = tv({\n slots: {\n base: '',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n outerWrapper: 'place-content-center',\n startContent: '',\n thumb: '',\n thumbIcon: '',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** whether the select should be disabled */\n disabled?: boolean;\n /** component displayed next to the switch. */\n label?: React.ReactNode;\n /** name the field is registered under */\n name: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Switch component based on [NextUI Switch](https://nextui.org/docs/components/switch)\n */\nconst Switch = ({\n className = undefined,\n disabled = false,\n label: _label = undefined,\n name,\n testId: _testId = undefined,\n}: SwitchProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, required, testId, invalid } = getFieldState(name, _testId);\n\n const { label, getInputProps, getErrorMessageProps } = useInput({\n errorMessage: JSON.stringify(error),\n isInvalid: invalid,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n const variants = switchVariants();\n const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n return (\n <Controller\n name={name}\n control={control}\n disabled={disabled}\n render={({\n field: { disabled: isDisabled, value, ref, onBlur, onChange },\n }) => (\n <div className={classNames.outerWrapper}>\n <NextSwitch\n aria-describedby={getInputProps()['aria-describedby']}\n classNames={classNames}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n isDisabled={isDisabled}\n isSelected={!!value}\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n ref={ref}\n required={required}\n value={value}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </NextSwitch>\n {error && (\n <div className={classNames.errorMessage}>\n <div\n /* eslint-disable-next-line react/jsx-props-no-spreading */\n {...getErrorMessageProps()}\n >\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"],"mappings":";;;;;;;;;;;AAEA,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AACzB,SAAS,UAAU,kBAAkB;AAErC,SAAS,IAAI,4BAA4B;AAwE/B,SAiBE,KAjBF;AAlEH,IAAM,iBAAiB,GAAG;AAAA,EAC/B,OAAO;AAAA,IACL,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,cAAc;AAAA;AAAA,IAEd,OACE;AAAA,IACF,cAAc;AAAA,IACd,cAAc;AAAA,IACd,OAAO;AAAA,IACP,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AACF,CAAC;AAqBD,IAAM,SAAS,CAAC;AAAA,EACd,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,OAAO,SAAS;AAAA,EAChB;AAAA,EACA,QAAQ,UAAU;AACpB,MAAmB;AACjB,QAAM,EAAE,SAAS,cAAc,IAAI,eAAe;AAClD,QAAM,EAAE,OAAO,UAAU,QAAQ,QAAQ,IAAI,cAAc,MAAM,OAAO;AAExE,QAAM,EAAE,OAAO,eAAe,qBAAqB,IAAI,SAAS;AAAA,IAC9D,cAAc,KAAK,UAAU,KAAK;AAAA,IAClC,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,gBAAgB;AAAA,IAChB,aAAa;AAAA,EACf,CAAC;AAED,QAAM,WAAW,eAAe;AAChC,QAAM,aAAa,qBAAqB,UAAU,WAAW,cAAc;AAE3E,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,OAAO,KAAK,QAAQ,SAAS;AAAA,MAC9D,MACE,qBAAC,SAAI,WAAW,WAAW,cACzB;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,oBAAkB,cAAc,EAAE,kBAAkB;AAAA,YACpD;AAAA,YAEA,gBAAc;AAAA,YACd,iBAAe;AAAA,YACf,eAAa;AAAA,YACb;AAAA,YACA,YAAY,CAAC,CAAC;AAAA,YACd;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,cACD,oBAAC,iCAAsB,QAAgB;AAAA;AAAA;AAAA,QACzC;AAAA,QACC,SACC,oBAAC,SAAI,WAAW,WAAW,cACzB;AAAA,UAAC;AAAA;AAAA,YAEE,GAAG,qBAAqB;AAAA,YAEzB,8BAAC,gCAAqB,OAAc;AAAA;AAAA,QACtC,GACF;AAAA,SAEJ;AAAA;AAAA,EAEJ;AAEJ;AAEA,IAAO,iBAAQ;;;AC5Gf,IAAOA,kBAAQ;","names":["Switch_default"]}
|
package/dist/index.cjs
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var _chunkMKM7ZYRNcjs = require('./chunk-MKM7ZYRN.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _chunk66Q6RBEHcjs = require('./chunk-66Q6RBEH.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
var _chunk4RTJ5XR2cjs = require('./chunk-4RTJ5XR2.cjs');
|
|
@@ -15,19 +15,19 @@ var _chunkHFMFDBEVcjs = require('./chunk-HFMFDBEV.cjs');
|
|
|
15
15
|
var _chunkJDRMKZ35cjs = require('./chunk-JDRMKZ35.cjs');
|
|
16
16
|
|
|
17
17
|
|
|
18
|
-
var
|
|
18
|
+
var _chunkQYZV7ZUYcjs = require('./chunk-QYZV7ZUY.cjs');
|
|
19
19
|
|
|
20
20
|
|
|
21
|
-
var
|
|
21
|
+
var _chunk6GN255GPcjs = require('./chunk-6GN255GP.cjs');
|
|
22
22
|
|
|
23
23
|
|
|
24
|
-
var
|
|
24
|
+
var _chunkJRFKYVXYcjs = require('./chunk-JRFKYVXY.cjs');
|
|
25
25
|
|
|
26
26
|
|
|
27
27
|
var _chunkPAX2HXPKcjs = require('./chunk-PAX2HXPK.cjs');
|
|
28
28
|
|
|
29
29
|
|
|
30
|
-
var
|
|
30
|
+
var _chunkF27MGBJScjs = require('./chunk-F27MGBJS.cjs');
|
|
31
31
|
|
|
32
32
|
|
|
33
33
|
var _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
@@ -57,5 +57,5 @@ var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
|
57
57
|
|
|
58
58
|
|
|
59
59
|
|
|
60
|
-
exports.CheckboxGroup = _chunkHFMFDBEVcjs.CheckboxGroup_default; exports.FieldArray = _chunkJDRMKZ35cjs.FieldArray_default; exports.FieldCopyTestIdButton = _chunkKMMS4G7Acjs.FieldCopyTestIdButton_default; exports.FieldValidationError = _chunkOHJYXA6Rcjs.FieldValidationError_default; exports.Form = _chunkQYZV7ZUYcjs.Form_default; exports.Grid = _chunk6GN255GPcjs.Grid_default; exports.Input = _chunkJRFKYVXYcjs.Input_default; exports.RadioGroup = _chunkPAX2HXPKcjs.RadioGroup_default; exports.Select =
|
|
60
|
+
exports.CheckboxGroup = _chunkHFMFDBEVcjs.CheckboxGroup_default; exports.FieldArray = _chunkJDRMKZ35cjs.FieldArray_default; exports.FieldCopyTestIdButton = _chunkKMMS4G7Acjs.FieldCopyTestIdButton_default; exports.FieldValidationError = _chunkOHJYXA6Rcjs.FieldValidationError_default; exports.Form = _chunkQYZV7ZUYcjs.Form_default; exports.Grid = _chunk6GN255GPcjs.Grid_default; exports.Input = _chunkJRFKYVXYcjs.Input_default; exports.RadioGroup = _chunkPAX2HXPKcjs.RadioGroup_default; exports.Select = _chunkF27MGBJScjs.Select_default; exports.SubmitButton = _chunkMKM7ZYRNcjs.SubmitButton_default; exports.Switch = _chunk66Q6RBEHcjs.Switch_default; exports.TextArea = _chunk4RTJ5XR2cjs.TextArea_default; exports.recursiveFieldKeySearch = _chunkLDCRR7FPcjs.recursiveFieldKeySearch; exports.slugify = _chunkBBB4FEY6cjs.slugify; exports.useFormContext = _chunkLDCRR7FPcjs.useFormContext;
|
|
61
61
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.js
CHANGED
|
@@ -3,7 +3,7 @@ import {
|
|
|
3
3
|
} from "./chunk-4GVPJYZW.js";
|
|
4
4
|
import {
|
|
5
5
|
Switch_default
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-ZEABU72A.js";
|
|
7
7
|
import {
|
|
8
8
|
TextArea_default
|
|
9
9
|
} from "./chunk-HOCRJOEU.js";
|
|
@@ -13,21 +13,21 @@ import {
|
|
|
13
13
|
import {
|
|
14
14
|
FieldArray_default
|
|
15
15
|
} from "./chunk-F7GG67YU.js";
|
|
16
|
+
import {
|
|
17
|
+
Form_default
|
|
18
|
+
} from "./chunk-DF77NLWL.js";
|
|
16
19
|
import {
|
|
17
20
|
Grid_default
|
|
18
21
|
} from "./chunk-PDCEKC3G.js";
|
|
19
22
|
import {
|
|
20
23
|
Input_default
|
|
21
24
|
} from "./chunk-SCTH3FAO.js";
|
|
22
|
-
import {
|
|
23
|
-
Form_default
|
|
24
|
-
} from "./chunk-DF77NLWL.js";
|
|
25
25
|
import {
|
|
26
26
|
RadioGroup_default
|
|
27
27
|
} from "./chunk-VZFPQ6ZZ.js";
|
|
28
28
|
import {
|
|
29
29
|
Select_default
|
|
30
|
-
} from "./chunk-
|
|
30
|
+
} from "./chunk-TDVRLVOO.js";
|
|
31
31
|
import {
|
|
32
32
|
FieldCopyTestIdButton_default
|
|
33
33
|
} from "./chunk-T3CCNJHK.js";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fuf-stack/uniform",
|
|
3
|
-
"version": "0.9.
|
|
3
|
+
"version": "0.9.9",
|
|
4
4
|
"description": "fuf react form library",
|
|
5
5
|
"author": "Hannes Tiede",
|
|
6
6
|
"homepage": "https://github.com/fuf-stack/uniform#readme",
|
|
@@ -121,7 +121,7 @@
|
|
|
121
121
|
"@react-aria/visually-hidden": "3.8.17",
|
|
122
122
|
"framer-motion": "11.11.9",
|
|
123
123
|
"react-icons": "5.3.0",
|
|
124
|
-
"react-hook-form": "7.53.
|
|
124
|
+
"react-hook-form": "7.53.1",
|
|
125
125
|
"react-select": "5.8.1",
|
|
126
126
|
"slug": "9.1.0",
|
|
127
127
|
"@fuf-stack/pixel-utils": "0.3.0",
|
|
@@ -136,8 +136,8 @@
|
|
|
136
136
|
"react": "18.3.1",
|
|
137
137
|
"react-dom": "18.3.1",
|
|
138
138
|
"@repo/storybook-config": "0.0.1",
|
|
139
|
-
"@repo/tailwind-config": "0.0.1",
|
|
140
139
|
"@repo/tsup-config": "0.0.1",
|
|
140
|
+
"@repo/tailwind-config": "0.0.1",
|
|
141
141
|
"@repo/vite-config": "0.0.1"
|
|
142
142
|
},
|
|
143
143
|
"scripts": {
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-E23J3M7Q.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["Select_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACPA,8BAAyB;AACzB,gDAA2B;AAC3B,qGAAwC;AAExC,4CAA0B;AAE1B,oDAA6C;AAiGpC,+CAAA;AA3FF,IAAM,eAAA,EAAiB,4BAAA;AAAG,EAC/B,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,OAAA;AAAA,IACN,cAAA,EACE,wGAAA;AAAA,IACF,OAAA,EACE,yNAAA;AAAA,IACF,eAAA,EAAiB,qCAAA;AAAA,IACjB,SAAA,EAAW,EAAA;AAAA,IACX,WAAA,EAAa,EAAA;AAAA,IACb,iBAAA,EACE,+FAAA;AAAA,IACF,KAAA,EAAO,EAAA;AAAA,IACP,YAAA,EAAc,4CAAA;AAAA,IACd,mBAAA,EAAqB,WAAA;AAAA,IACrB,kBAAA,EAAoB,gBAAA;AAAA,IACpB,KAAA,EAAO,aAAA;AAAA;AAAA,IAEP,KAAA,EACE,yPAAA;AAAA,IACF,gBAAA,EAAkB,EAAA;AAAA,IAClB,cAAA,EAAgB,EAAA;AAAA,IAChB,IAAA,EAAM,qEAAA;AAAA,IACN,QAAA,EAAU,EAAA;AAAA;AAAA;AAAA,IAGV,UAAA,EAAY,OAAA;AAAA,IACZ,UAAA,EAAY,8DAAA;AAAA,IACZ,mBAAA,EAAqB,EAAA;AAAA,IACrB,eAAA,EAAiB,kBAAA;AAAA,IACjB,gBAAA,EACE,+FAAA;AAAA,IACF,gBAAA,EAAkB,oCAAA;AAAA,IAClB,cAAA,EAAgB,sCAAA;AAAA,IAChB,eAAA,EAAiB,gBAAA;AAAA,IACjB,MAAA,EAAQ,wCAAA;AAAA,IACR,WAAA,EAAa,iCAAA;AAAA,IACb,eAAA,EAAiB,EAAA;AAAA,IACjB,WAAA,EAAa,kBAAA;AAAA,IACb,cAAA,EAAgB;AAAA,EAClB;AACF,CAAC,CAAA;AA6CD,IAAM,eAAA,EAA0C,CAAC,KAAA,EAAA,GAAU;AAGzD,EAAA,MAAM,OAAA,EAAS,CAAA,EAAA;AAER,EAAA;AACT;AAEM;AAGW,EAAA;AAEb,EAAA;AAKJ;AAEM;AAGW,EAAA;AAEb,EAAA;AAKJ;AAEM;AAKW,EAAA;AAEb,EAAA;AAKJ;AAGgB;AACF,EAAA;AACA,EAAA;AACD,EAAA;AACI,EAAA;AACf,EAAA;AACa,EAAA;AACG,EAAA;AACN,EAAA;AACI,EAAA;AACd,EAAA;AACgB,EAAA;AAChB,EAAA;AACc,EAAA;AACN,EAAA;AACS;AACT,EAAA;AACO,EAAA;AAER,EAAA;AAED,EAAA;AACA,EAAA;AAEA,EAAA;AACJ,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACY,EAAA;AACD,IAAA;AACX,IAAA;AACc,IAAA;AACF,IAAA;AACD,IAAA;AACA,IAAA;AACC,IAAA;AACL,IAAA;AACP,IAAA;AACa,IAAA;AACd,EAAA;AAGC,EAAA;AAAC,IAAA;AAAA,IAAA;AACC,MAAA;AACA,MAAA;AACS,MAAA;AAAA;AAEE,QAAA;AAET,MAAA;AAAC,QAAA;AAAA,QAAA;AAEK,UAAA;AACJ,UAAA;AACA,UAAA;AAEA,UAAA;AAEC,UAAA;AAAA,YAAA;AACE,cAAA;AAAA,cAAA;AACC,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AAEC,gBAAA;AAAA,kBAAA;AACD,kCAAA;AAAuC,gBAAA;AAAA,cAAA;AACzC,YAAA;AAEF,4BAAA;AAAC,cAAA;AAAA,cAAA;AACC,gBAAA;AACA,gBAAA;AAGA,gBAAA;AACA,gBAAA;AACE,kBAAA;AACyB,oBAAA;AAEvB,kBAAA;AACF,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AAEA,kBAAA;AACA,kBAAA;AACA,kBAAA;AAAS,oBAAA;AACI,oBAAA;AAEb,kBAAA;AACwB,oBAAA;AACS,oBAAA;AAE/B,kBAAA;AACF,kBAAA;AACA,kBAAA;AAEA,kBAAA;AACF,gBAAA;AACA,gBAAA;AACE,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACF,gBAAA;AAEA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AAIA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACE,kBAAA;AACA,kBAAA;AACF,gBAAA;AACA,gBAAA;AACE,kBAAA;AACE,oBAAA;AAEA,oCAAA;AACE,sBAAA;AAA+B,oBAAA;AAEjC,oBAAA;AACF,kBAAA;AAEE,oBAAA;AACF,kBAAA;AACF,gBAAA;AACA,gBAAA;AACE,kBAAA;AACF,gBAAA;AACA,gBAAA;AACA,gBAAA;AAEA,gBAAA;AACA,gBAAA;AAAQ,cAAA;AACV,YAAA;AACC,YAAA;AAEC,4BAAA;AAKA,UAAA;AAAA,QAAA;AAEJ,MAAA;AAAA,IAAA;AAEJ,EAAA;AAEJ;AAEO;ADhGW;AACA;AE9NXA;AFgOW;AACA;AACA;AACA;AACA","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-E23J3M7Q.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport { Controller } from 'react-hook-form';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@nextui-org/select';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const selectVariants = tv({\n slots: {\n base: 'group',\n clearIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n control:\n 'rounded-lg border-2 border-default-200 !duration-150 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n control_focused: 'border-primary hover:border-primary',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-default-300',\n input: 'py-0.5 pl-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'pointer-events-auto relative bottom-1.5 ml-1 text-small subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n loadingIndicator: '',\n loadingMessage: '',\n menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: '!z-50',\n multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n option_focused: 'bg-default-100 active:bg-default-200',\n option_selected: 'bg-default-300',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'py-0.5 pl-1 text-foreground-500',\n selectContainer: '',\n singleValue: '!ml-1 !leading-7',\n valueContainer: 'gap-1 p-1',\n },\n});\n\ntype SelectOption = {\n /** option label */\n label?: React.ReactNode;\n /** option value */\n value: string;\n};\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps extends VariantProps {\n /** CSS class name */\n className?: ClassName; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n /** Filter Select Options */\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** Format the label of the option */\n renderOptionLabel?: undefined | Props['formatOptionLabel'];\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: React.ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}`;\n // eslint-disable-next-line react/jsx-props-no-spreading\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Control {...props} />\n </div>\n );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select_option_${props?.data?.testId ?? props?.data?.value}`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_select_dropdown`}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\n/** Select component based on [NextUI Select](https://nextui.org/docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n disabled = false,\n filterOption = undefined,\n renderOptionLabel = undefined,\n inputValue = undefined,\n label: _label = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n testId: _testId = undefined,\n}: SelectProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const [isFocused, setIsFocused] = useState(false);\n\n const variants = selectVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const {\n getBaseProps,\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n getTriggerProps,\n getValueProps,\n label,\n } = useSelect({\n children: [],\n classNames,\n errorMessage: JSON.stringify(error),\n isDisabled: disabled,\n isInvalid: invalid,\n isLoading: loading,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n return (\n <Controller\n control={control}\n name={name}\n render={({\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n field: { onChange, value, ref, onBlur },\n }) => (\n <div\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getBaseProps()}\n className={cn(classNames.base)}\n data-testid={`${testId}_wrapper`}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-required={required}\n >\n {label && (\n <label\n className={classNames.label}\n data-slot=\"label\"\n htmlFor={`react-select-${name}-input`}\n id={getLabelProps().id}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </label>\n )}\n <ReactSelect\n aria-errormessage=\"\"\n aria-labelledby={\n getTriggerProps()['aria-labelledby']?.split(' ')[1]\n }\n aria-invalid={invalid}\n classNames={{\n control: () =>\n cn(classNames.control, {\n [classNames.control_focused]: isFocused && !invalid,\n }),\n clearIndicator: () => classNames.clearIndicator,\n dropdownIndicator: () => classNames.dropdownIndicator,\n groupHeading: () => classNames.groupHeading,\n indicatorsContainer: () => classNames.indicatorsContainer,\n indicatorSeparator: () => classNames.indicatorSeparator,\n input: () => classNames.input,\n menu: () => classNames.menu,\n menuList: () => classNames.menuList,\n menuPortal: () => classNames.menuPortal,\n multiValue: () => classNames.multiValue,\n multiValueLabel: () =>\n cn(classNames.multiValueLabel, `${getValueProps().className}`),\n multiValueRemove: () => classNames.multiValueRemove,\n noOptionsMessage: () => classNames.noOptionsMessage,\n option: ({\n isFocused: optionIsFocused,\n isSelected: optionIsSelected,\n }) =>\n cn(classNames.option, {\n [classNames.option_focused]: optionIsFocused,\n [classNames.option_selected]: optionIsSelected,\n }),\n placeholder: () => classNames.placeholder,\n singleValue: () =>\n cn(classNames.singleValue, `${getValueProps().className}`),\n valueContainer: () => classNames.valueContainer,\n }}\n components={{\n Input: InputComponent,\n Option: OptionComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n Control: ControlComponent,\n }}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={testId}\n filterOption={filterOption}\n formatOptionLabel={renderOptionLabel}\n inputValue={inputValue}\n instanceId={name}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n name={name}\n // set menuPosition to fixed so that menu can be rendered\n // inside Card / Modal components, menuShouldBlockScroll\n // prevents container scroll when menu is open\n menuPosition=\"fixed\"\n menuShouldBlockScroll\n options={options}\n placeholder={placeholder}\n onBlur={(_e) => {\n setIsFocused(false);\n return onBlur();\n }}\n onChange={(option) => {\n if (multiSelect) {\n const transformedOptions: string[] = [];\n // @ts-expect-error in this case option is an array.\n option?.forEach((o: { value: string }) => {\n transformedOptions.push(o.value);\n });\n onChange(transformedOptions);\n } else {\n // @ts-expect-error in this case option is of type SelectOption and has the property value.\n onChange(option && option.value);\n }\n }}\n onFocus={(_e) => {\n setIsFocused(true);\n }}\n onInputChange={onInputChange}\n ref={ref}\n // set complete option as value by current field value\n value={options.find((option) => option.value === value)}\n unstyled\n />\n {error && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <div {...getHelperWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <div {...getErrorMessageProps()}>\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Select/Select.tsx","../src/Select/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport { Controller } from 'react-hook-form';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@nextui-org/select';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const selectVariants = tv({\n slots: {\n base: 'group',\n clearIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n control:\n 'rounded-lg border-2 border-default-200 !duration-150 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n control_focused: 'border-primary hover:border-primary',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-default-300',\n input: 'py-0.5 pl-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'pointer-events-auto relative bottom-1.5 ml-1 text-small subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n loadingIndicator: '',\n loadingMessage: '',\n menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: '!z-50',\n multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n option_focused: 'bg-default-100 active:bg-default-200',\n option_selected: 'bg-default-300',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'py-0.5 pl-1 text-foreground-500',\n selectContainer: '',\n singleValue: '!ml-1 !leading-7',\n valueContainer: 'gap-1 p-1',\n },\n});\n\ntype SelectOption = {\n /** option label */\n label?: React.ReactNode;\n /** option value */\n value: string;\n};\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps extends VariantProps {\n /** CSS class name */\n className?: ClassName; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n /** Filter Select Options */\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** Format the label of the option */\n renderOptionLabel?: undefined | Props['formatOptionLabel'];\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: React.ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}`;\n // eslint-disable-next-line react/jsx-props-no-spreading\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Control {...props} />\n </div>\n );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select_option_${props?.data?.testId ?? props?.data?.value}`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_select_dropdown`}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\n/** Select component based on [NextUI Select](https://nextui.org/docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n disabled = false,\n filterOption = undefined,\n renderOptionLabel = undefined,\n inputValue = undefined,\n label: _label = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n testId: _testId = undefined,\n}: SelectProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const [isFocused, setIsFocused] = useState(false);\n\n const variants = selectVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const {\n getBaseProps,\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n getTriggerProps,\n getValueProps,\n label,\n } = useSelect({\n children: [],\n classNames,\n errorMessage: JSON.stringify(error),\n isDisabled: disabled,\n isInvalid: invalid,\n isLoading: loading,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n return (\n <Controller\n control={control}\n name={name}\n render={({\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n field: { onChange, value, ref, onBlur },\n }) => (\n <div\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getBaseProps()}\n className={cn(classNames.base)}\n data-testid={`${testId}_wrapper`}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-required={required}\n >\n {label && (\n <label\n className={classNames.label}\n data-slot=\"label\"\n htmlFor={`react-select-${name}-input`}\n id={getLabelProps().id}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </label>\n )}\n <ReactSelect\n aria-errormessage=\"\"\n aria-labelledby={\n getTriggerProps()['aria-labelledby']?.split(' ')[1]\n }\n aria-invalid={invalid}\n classNames={{\n control: () =>\n cn(classNames.control, {\n [classNames.control_focused]: isFocused && !invalid,\n }),\n clearIndicator: () => classNames.clearIndicator,\n dropdownIndicator: () => classNames.dropdownIndicator,\n groupHeading: () => classNames.groupHeading,\n indicatorsContainer: () => classNames.indicatorsContainer,\n indicatorSeparator: () => classNames.indicatorSeparator,\n input: () => classNames.input,\n menu: () => classNames.menu,\n menuList: () => classNames.menuList,\n menuPortal: () => classNames.menuPortal,\n multiValue: () => classNames.multiValue,\n multiValueLabel: () =>\n cn(classNames.multiValueLabel, `${getValueProps().className}`),\n multiValueRemove: () => classNames.multiValueRemove,\n noOptionsMessage: () => classNames.noOptionsMessage,\n option: ({\n isFocused: optionIsFocused,\n isSelected: optionIsSelected,\n }) =>\n cn(classNames.option, {\n [classNames.option_focused]: optionIsFocused,\n [classNames.option_selected]: optionIsSelected,\n }),\n placeholder: () => classNames.placeholder,\n singleValue: () =>\n cn(classNames.singleValue, `${getValueProps().className}`),\n valueContainer: () => classNames.valueContainer,\n }}\n components={{\n Input: InputComponent,\n Option: OptionComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n Control: ControlComponent,\n }}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={testId}\n filterOption={filterOption}\n formatOptionLabel={renderOptionLabel}\n inputValue={inputValue}\n instanceId={name}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n name={name}\n // set menuPosition to fixed so that menu can be rendered\n // inside Card / Modal components, menuShouldBlockScroll\n // prevents container scroll when menu is open\n menuPosition=\"fixed\"\n menuShouldBlockScroll\n options={options}\n placeholder={placeholder}\n onBlur={(_e) => {\n setIsFocused(false);\n return onBlur();\n }}\n onChange={(option) => {\n if (multiSelect) {\n const transformedOptions: string[] = [];\n // @ts-expect-error in this case option is an array.\n option?.forEach((o: { value: string }) => {\n transformedOptions.push(o.value);\n });\n onChange(transformedOptions);\n } else {\n // @ts-expect-error in this case option is of type SelectOption and has the property value.\n onChange(option && option.value);\n }\n }}\n onFocus={(_e) => {\n setIsFocused(true);\n }}\n onInputChange={onInputChange}\n ref={ref}\n // set complete option as value by current field value\n value={options.find((option) => option.value === value)}\n unstyled\n />\n {error && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <div {...getHelperWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <div {...getErrorMessageProps()}>\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"],"mappings":"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","names":["Select_default"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-NQ4JZ7AK.cjs","../src/Switch/Switch.tsx","../src/Switch/index.ts"],"names":["Switch_default"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-NQ4JZ7AK.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from 'react-hook-form';\n\nimport { useInput } from '@nextui-org/input';\nimport { Switch as NextSwitch } from '@nextui-org/switch';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const switchVariants = tv({\n slots: {\n base: '',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n outerWrapper: 'place-content-center',\n startContent: '',\n thumb: '',\n thumbIcon: '',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** whether the select should be disabled */\n disabled?: boolean;\n /** component displayed next to the switch. */\n label?: React.ReactNode;\n /** name the field is registered under */\n name: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Switch component based on [NextUI Switch](https://nextui.org/docs/components/switch)\n */\nconst Switch = ({\n className = undefined,\n disabled = false,\n label: _label = undefined,\n name,\n testId: _testId = undefined,\n}: SwitchProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, required, testId, invalid } = getFieldState(name, _testId);\n\n const { label, getInputProps, getHelperWrapperProps, getErrorMessageProps } =\n useInput({\n errorMessage: JSON.stringify(error),\n isInvalid: invalid,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n const variants = switchVariants();\n const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n console.log('getHelperWrapperProps()', getHelperWrapperProps());\n console.log('getErrorMessageProps()', getErrorMessageProps());\n\n return (\n <Controller\n name={name}\n control={control}\n disabled={disabled}\n render={({\n field: { disabled: isDisabled, value, ref, onBlur, onChange },\n }) => (\n <div className={classNames.outerWrapper}>\n <NextSwitch\n aria-describedby={getInputProps()['aria-describedby']}\n classNames={classNames}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n isDisabled={isDisabled}\n isSelected={!!value}\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n ref={ref}\n required={required}\n value={value}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </NextSwitch>\n {error && (\n <div className={classNames.errorMessage}>\n <div\n /* eslint-disable-next-line react/jsx-props-no-spreading */\n {...getErrorMessageProps()}\n >\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Switch/Switch.tsx","../src/Switch/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from 'react-hook-form';\n\nimport { useInput } from '@nextui-org/input';\nimport { Switch as NextSwitch } from '@nextui-org/switch';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const switchVariants = tv({\n slots: {\n base: '',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n outerWrapper: 'place-content-center',\n startContent: '',\n thumb: '',\n thumbIcon: '',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** whether the select should be disabled */\n disabled?: boolean;\n /** component displayed next to the switch. */\n label?: React.ReactNode;\n /** name the field is registered under */\n name: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Switch component based on [NextUI Switch](https://nextui.org/docs/components/switch)\n */\nconst Switch = ({\n className = undefined,\n disabled = false,\n label: _label = undefined,\n name,\n testId: _testId = undefined,\n}: SwitchProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, required, testId, invalid } = getFieldState(name, _testId);\n\n const { label, getInputProps, getHelperWrapperProps, getErrorMessageProps } =\n useInput({\n errorMessage: JSON.stringify(error),\n isInvalid: invalid,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n const variants = switchVariants();\n const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n console.log('getHelperWrapperProps()', getHelperWrapperProps());\n console.log('getErrorMessageProps()', getErrorMessageProps());\n\n return (\n <Controller\n name={name}\n control={control}\n disabled={disabled}\n render={({\n field: { disabled: isDisabled, value, ref, onBlur, onChange },\n }) => (\n <div className={classNames.outerWrapper}>\n <NextSwitch\n aria-describedby={getInputProps()['aria-describedby']}\n classNames={classNames}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n isDisabled={isDisabled}\n isSelected={!!value}\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n ref={ref}\n required={required}\n value={value}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </NextSwitch>\n {error && (\n <div className={classNames.errorMessage}>\n <div\n /* eslint-disable-next-line react/jsx-props-no-spreading */\n {...getErrorMessageProps()}\n >\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"],"mappings":";;;;;;;;;;;AAEA,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AACzB,SAAS,UAAU,kBAAkB;AAErC,SAAS,IAAI,4BAA4B;AA4E/B,SAiBE,KAjBF;AAtEH,IAAM,iBAAiB,GAAG;AAAA,EAC/B,OAAO;AAAA,IACL,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,cAAc;AAAA;AAAA,IAEd,OACE;AAAA,IACF,cAAc;AAAA,IACd,cAAc;AAAA,IACd,OAAO;AAAA,IACP,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AACF,CAAC;AAqBD,IAAM,SAAS,CAAC;AAAA,EACd,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,OAAO,SAAS;AAAA,EAChB;AAAA,EACA,QAAQ,UAAU;AACpB,MAAmB;AACjB,QAAM,EAAE,SAAS,cAAc,IAAI,eAAe;AAClD,QAAM,EAAE,OAAO,UAAU,QAAQ,QAAQ,IAAI,cAAc,MAAM,OAAO;AAExE,QAAM,EAAE,OAAO,eAAe,uBAAuB,qBAAqB,IACxE,SAAS;AAAA,IACP,cAAc,KAAK,UAAU,KAAK;AAAA,IAClC,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,gBAAgB;AAAA,IAChB,aAAa;AAAA,EACf,CAAC;AAEH,QAAM,WAAW,eAAe;AAChC,QAAM,aAAa,qBAAqB,UAAU,WAAW,cAAc;AAE3E,UAAQ,IAAI,2BAA2B,sBAAsB,CAAC;AAC9D,UAAQ,IAAI,0BAA0B,qBAAqB,CAAC;AAE5D,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,OAAO,KAAK,QAAQ,SAAS;AAAA,MAC9D,MACE,qBAAC,SAAI,WAAW,WAAW,cACzB;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,oBAAkB,cAAc,EAAE,kBAAkB;AAAA,YACpD;AAAA,YAEA,gBAAc;AAAA,YACd,iBAAe;AAAA,YACf,eAAa;AAAA,YACb;AAAA,YACA,YAAY,CAAC,CAAC;AAAA,YACd;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,cACD,oBAAC,iCAAsB,QAAgB;AAAA;AAAA;AAAA,QACzC;AAAA,QACC,SACC,oBAAC,SAAI,WAAW,WAAW,cACzB;AAAA,UAAC;AAAA;AAAA,YAEE,GAAG,qBAAqB;AAAA,YAEzB,8BAAC,gCAAqB,OAAc;AAAA;AAAA,QACtC,GACF;AAAA,SAEJ;AAAA;AAAA,EAEJ;AAEJ;AAEA,IAAO,iBAAQ;;;AChHf,IAAOA,kBAAQ;","names":["Switch_default"]}
|