@yamada-ui/react 2.3.2-dev-20261104222056 → 2.3.2-dev-20261106105628
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/cjs/components/file-button/use-file-button.cjs +2 -4
- package/dist/cjs/components/file-button/use-file-button.cjs.map +1 -1
- package/dist/cjs/components/file-input/file-input.cjs +4 -1
- package/dist/cjs/components/file-input/file-input.cjs.map +1 -1
- package/dist/cjs/components/file-input/use-file-input.cjs +22 -15
- package/dist/cjs/components/file-input/use-file-input.cjs.map +1 -1
- package/dist/cjs/components/radio/use-radio-group.cjs +4 -1
- package/dist/cjs/components/radio/use-radio-group.cjs.map +1 -1
- package/dist/cjs/utils/index.cjs.map +1 -1
- package/dist/esm/components/file-button/use-file-button.js +2 -4
- package/dist/esm/components/file-button/use-file-button.js.map +1 -1
- package/dist/esm/components/file-input/file-input.js +4 -1
- package/dist/esm/components/file-input/file-input.js.map +1 -1
- package/dist/esm/components/file-input/use-file-input.js +23 -16
- package/dist/esm/components/file-input/use-file-input.js.map +1 -1
- package/dist/esm/components/radio/use-radio-group.js +4 -1
- package/dist/esm/components/radio/use-radio-group.js.map +1 -1
- package/dist/esm/utils/index.js.map +1 -1
- package/dist/types/components/calendar/calendar.style.d.ts +2 -2
- package/dist/types/components/carousel/carousel.style.d.ts +2 -2
- package/dist/types/components/chart/cartesian-chart.style.d.ts +1 -1
- package/dist/types/components/chart/polar-chart.style.d.ts +1 -1
- package/dist/types/components/field/field.style.d.ts +2 -2
- package/dist/types/components/fieldset/fieldset.style.d.ts +1 -1
- package/dist/types/components/file-input/use-file-input.d.ts +1 -1
- package/dist/types/components/menu/menu.style.d.ts +2 -2
- package/dist/types/components/number-input/number-input.style.d.ts +1 -1
- package/dist/types/components/segmented-control/segmented-control.style.d.ts +2 -2
- package/dist/types/components/steps/steps.style.d.ts +1 -1
- package/dist/types/components/timeline/timeline.d.ts +1 -1
- package/dist/types/components/timeline/timeline.style.d.ts +1 -1
- package/dist/types/components/tree/tree.style.d.ts +1 -1
- package/dist/types/index.d.ts +3 -3
- package/dist/types/utils/index.d.ts +3 -3
- package/package.json +2 -2
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
const require_props = require("../../core/components/props.cjs");
|
|
2
3
|
const require_use_file_input = require("../file-input/use-file-input.cjs");
|
|
3
4
|
let react = require("react");
|
|
4
5
|
// src/components/file-button/use-file-button.ts
|
|
@@ -6,10 +7,7 @@ const useFileButton = (props = {}) => {
|
|
|
6
7
|
const { clickableProps, getInputProps } = require_use_file_input.useFileInput(props);
|
|
7
8
|
return {
|
|
8
9
|
clickableProps,
|
|
9
|
-
getButtonProps: (0, react.useCallback)((props) => (
|
|
10
|
-
...clickableProps,
|
|
11
|
-
...props
|
|
12
|
-
}), [clickableProps]),
|
|
10
|
+
getButtonProps: (0, react.useCallback)((props = {}) => require_props.mergeProps(clickableProps, props)(), [clickableProps]),
|
|
13
11
|
getInputProps
|
|
14
12
|
};
|
|
15
13
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-file-button.cjs","names":["useFileInput","useCallback"],"sources":["../../../../src/components/file-button/use-file-button.ts"],"sourcesContent":["\"use client\"\n\nimport type { PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport type { UseFileInputProps } from \"../file-input\"\nimport { useCallback } from \"react\"\nimport { useFileInput } from \"../file-input\"\n\nexport interface UseFileButtonProps\n extends UseFileInputProps<\"button\">, FieldProps {}\n\nexport const useFileButton = (props: UseFileButtonProps = {}) => {\n const { clickableProps, getInputProps } = useFileInput<\"button\">(props)\n\n const getButtonProps: PropGetter<\"button\"> = useCallback(\n (props) => (
|
|
1
|
+
{"version":3,"file":"use-file-button.cjs","names":["useFileInput","useCallback","mergeProps"],"sources":["../../../../src/components/file-button/use-file-button.ts"],"sourcesContent":["\"use client\"\n\nimport type { PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport type { UseFileInputProps } from \"../file-input\"\nimport { useCallback } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useFileInput } from \"../file-input\"\n\nexport interface UseFileButtonProps\n extends UseFileInputProps<\"button\">, FieldProps {}\n\nexport const useFileButton = (props: UseFileButtonProps = {}) => {\n const { clickableProps, getInputProps } = useFileInput<\"button\">(props)\n\n const getButtonProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => mergeProps(clickableProps, props)(),\n [clickableProps],\n )\n\n return {\n clickableProps,\n getButtonProps,\n getInputProps,\n }\n}\n\nexport type UseFileButtonReturn = ReturnType<typeof useFileButton>\n"],"mappings":";;;;;AAYA,MAAa,iBAAiB,QAA4B,CAAC,MAAM;CAC/D,MAAM,EAAE,gBAAgB,kBAAkBA,uBAAAA,aAAuB,KAAK;CAOtE,OAAO;EACL;EACA,iBAAA,GAP2CC,MAAAA,YAAAA,EAC1C,QAAQ,CAAC,MAAMC,cAAAA,WAAW,gBAAgB,KAAK,CAAC,CAAC,GAClD,CAAC,cAAc,CAKF;EACb;CACF;AACF"}
|
|
@@ -22,7 +22,10 @@ const FileInput = withProvider(({ children, component, errorBorderColor, focusBo
|
|
|
22
22
|
errorBorderColor,
|
|
23
23
|
focusBorderColor
|
|
24
24
|
});
|
|
25
|
-
const { values, getFieldProps, getInputProps } = require_use_file_input.useFileInput(
|
|
25
|
+
const { values, getFieldProps, getInputProps } = require_use_file_input.useFileInput({
|
|
26
|
+
placeholder,
|
|
27
|
+
...props
|
|
28
|
+
});
|
|
26
29
|
const cloneChildren = (0, react.useMemo)(() => {
|
|
27
30
|
if (!values?.length) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.span, {
|
|
28
31
|
overflow: "hidden",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-input.cjs","names":["createSlotComponent","fileInputStyle","useInputBorder","useFileInput","useMemo","styled","isValidElement","cloneElement","Portal","useInputPropsContext","mergeProps"],"sources":["../../../../src/components/file-input/file-input.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { FileInputStyle } from \"./file-input.style\"\nimport type { UseFileInputProps } from \"./use-file-input\"\nimport { cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, mergeProps, styled } from \"../../core\"\nimport { useInputBorder, useInputPropsContext } from \"../input\"\nimport { Portal } from \"../portal\"\nimport { fileInputStyle } from \"./file-input.style\"\nimport { useFileInput } from \"./use-file-input\"\n\nconst defaultFormat: (value: File, index: number) => string = ({ name }) => name\n\nexport interface FileInputProps\n extends\n Omit<\n HTMLStyledProps<\"input\">,\n \"children\" | \"defaultValue\" | \"onChange\" | \"value\"\n >,\n ThemeProps<FileInputStyle>,\n UseInputBorderProps,\n FieldProps,\n Omit<UseFileInputProps, \"children\"> {\n /**\n * The string to separate uploaded files.\n *\n * @default ','\n */\n separator?: string\n /**\n * A callback that returns a React node.\n */\n children?: (files: File[] | undefined) => ReactNode\n /**\n * The component that displays uploaded files.\n */\n component?: (props: { index: number; value: File }) => ReactNode\n /**\n * A callback that formats the name of the uploaded file.\n */\n format?: (value: File, index: number) => string\n}\n\nconst {\n PropsContext: FileInputPropsContext,\n usePropsContext: useFileInputPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<FileInputProps, FileInputStyle>(\n \"file-input\",\n fileInputStyle,\n)\n\nexport { FileInputPropsContext, useFileInputPropsContext }\n\n/**\n * `FileInput` is a component used for users to select files.\n *\n * @see https://yamada-ui.com/docs/components/file-input\n */\nexport const FileInput = withProvider<\"input\", FileInputProps>(\n ({\n children,\n component,\n errorBorderColor,\n focusBorderColor,\n format = defaultFormat,\n placeholder,\n separator = \",\",\n ...props\n }) => {\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const { values, getFieldProps, getInputProps } = useFileInput(props)\n\n const cloneChildren = useMemo(() => {\n if (!values?.length)\n return (\n <styled.span overflow=\"hidden\" whiteSpace=\"nowrap\">\n {placeholder}\n </styled.span>\n )\n\n if (children) return children(values)\n\n return values.map((value, index) => {\n const last = values.length === index + 1\n\n if (component) {\n const node = component({ index, value })\n\n if (isValidElement(node)) return cloneElement(node, { key: index })\n else return node\n } else {\n return (\n <FileInputTag key={index}>\n {format(value, index)}\n {!last ? separator : null}\n </FileInputTag>\n )\n }\n })\n }, [children, format, placeholder, separator, component, values])\n\n return (\n <>\n <Portal>\n <styled.input {...getInputProps()} />\n </Portal>\n\n <styled.div {...varProps} {...getFieldProps()}>\n {cloneChildren}\n </styled.div>\n </>\n )\n },\n \"root\",\n)((props) => {\n const context = useInputPropsContext()\n\n return mergeProps(context, props)()\n})\n\ninterface FileInputTagProps extends HTMLStyledProps {}\n\nconst FileInputTag = withContext<\"span\", FileInputTagProps>(\"span\", \"tag\")()\n"],"mappings":";;;;;;;;;;;;AAeA,MAAM,iBAAyD,EAAE,WAAW;AAgC5E,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,aACA,iBACEA,yBAAAA,oBACF,cACAC,yBAAAA,cACF;;;;;;AASA,MAAa,YAAY,cACtB,EACC,UACA,WACA,kBACA,kBACA,SAAS,eACT,aACA,YAAY,KACZ,GAAG,YACC;CACJ,MAAM,WAAWC,yBAAAA,eAAe;EAAE;EAAkB;CAAiB,CAAC;CACtE,MAAM,EAAE,QAAQ,eAAe,kBAAkBC,uBAAAA,aAAa,
|
|
1
|
+
{"version":3,"file":"file-input.cjs","names":["createSlotComponent","fileInputStyle","useInputBorder","useFileInput","useMemo","styled","isValidElement","cloneElement","Portal","useInputPropsContext","mergeProps"],"sources":["../../../../src/components/file-input/file-input.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { FileInputStyle } from \"./file-input.style\"\nimport type { UseFileInputProps } from \"./use-file-input\"\nimport { cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, mergeProps, styled } from \"../../core\"\nimport { useInputBorder, useInputPropsContext } from \"../input\"\nimport { Portal } from \"../portal\"\nimport { fileInputStyle } from \"./file-input.style\"\nimport { useFileInput } from \"./use-file-input\"\n\nconst defaultFormat: (value: File, index: number) => string = ({ name }) => name\n\nexport interface FileInputProps\n extends\n Omit<\n HTMLStyledProps<\"input\">,\n \"children\" | \"defaultValue\" | \"onChange\" | \"value\"\n >,\n ThemeProps<FileInputStyle>,\n UseInputBorderProps,\n FieldProps,\n Omit<UseFileInputProps, \"children\"> {\n /**\n * The string to separate uploaded files.\n *\n * @default ','\n */\n separator?: string\n /**\n * A callback that returns a React node.\n */\n children?: (files: File[] | undefined) => ReactNode\n /**\n * The component that displays uploaded files.\n */\n component?: (props: { index: number; value: File }) => ReactNode\n /**\n * A callback that formats the name of the uploaded file.\n */\n format?: (value: File, index: number) => string\n}\n\nconst {\n PropsContext: FileInputPropsContext,\n usePropsContext: useFileInputPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<FileInputProps, FileInputStyle>(\n \"file-input\",\n fileInputStyle,\n)\n\nexport { FileInputPropsContext, useFileInputPropsContext }\n\n/**\n * `FileInput` is a component used for users to select files.\n *\n * @see https://yamada-ui.com/docs/components/file-input\n */\nexport const FileInput = withProvider<\"input\", FileInputProps>(\n ({\n children,\n component,\n errorBorderColor,\n focusBorderColor,\n format = defaultFormat,\n placeholder,\n separator = \",\",\n ...props\n }) => {\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const { values, getFieldProps, getInputProps } = useFileInput({\n placeholder,\n ...props,\n })\n\n const cloneChildren = useMemo(() => {\n if (!values?.length)\n return (\n <styled.span overflow=\"hidden\" whiteSpace=\"nowrap\">\n {placeholder}\n </styled.span>\n )\n\n if (children) return children(values)\n\n return values.map((value, index) => {\n const last = values.length === index + 1\n\n if (component) {\n const node = component({ index, value })\n\n if (isValidElement(node)) return cloneElement(node, { key: index })\n else return node\n } else {\n return (\n <FileInputTag key={index}>\n {format(value, index)}\n {!last ? separator : null}\n </FileInputTag>\n )\n }\n })\n }, [children, format, placeholder, separator, component, values])\n\n return (\n <>\n <Portal>\n <styled.input {...getInputProps()} />\n </Portal>\n\n <styled.div {...varProps} {...getFieldProps()}>\n {cloneChildren}\n </styled.div>\n </>\n )\n },\n \"root\",\n)((props) => {\n const context = useInputPropsContext()\n\n return mergeProps(context, props)()\n})\n\ninterface FileInputTagProps extends HTMLStyledProps {}\n\nconst FileInputTag = withContext<\"span\", FileInputTagProps>(\"span\", \"tag\")()\n"],"mappings":";;;;;;;;;;;;AAeA,MAAM,iBAAyD,EAAE,WAAW;AAgC5E,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,aACA,iBACEA,yBAAAA,oBACF,cACAC,yBAAAA,cACF;;;;;;AASA,MAAa,YAAY,cACtB,EACC,UACA,WACA,kBACA,kBACA,SAAS,eACT,aACA,YAAY,KACZ,GAAG,YACC;CACJ,MAAM,WAAWC,yBAAAA,eAAe;EAAE;EAAkB;CAAiB,CAAC;CACtE,MAAM,EAAE,QAAQ,eAAe,kBAAkBC,uBAAAA,aAAa;EAC5D;EACA,GAAG;CACL,CAAC;CAED,MAAM,iBAAA,GAAgBC,MAAAA,QAAAA,OAAc;EAClC,IAAI,CAAC,QAAQ,QACX,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,gBAAAA,OAAO,MAAR;GAAa,UAAS;GAAS,YAAW;GACvC,UAAA;EACU,CAAA;EAGjB,IAAI,UAAU,OAAO,SAAS,MAAM;EAEpC,OAAO,OAAO,KAAK,OAAO,UAAU;GAClC,MAAM,OAAO,OAAO,WAAW,QAAQ;GAEvC,IAAI,WAAW;IACb,MAAM,OAAO,UAAU;KAAE;KAAO;IAAM,CAAC;IAEvC,KAAA,GAAIC,MAAAA,eAAAA,CAAe,IAAI,GAAG,QAAA,GAAOC,MAAAA,aAAAA,CAAa,MAAM,EAAE,KAAK,MAAM,CAAC;SAC7D,OAAO;GACd,OACE,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,cAAD,EAAA,UAAA,CACG,OAAO,OAAO,KAAK,GACnB,CAAC,OAAO,YAAY,IACT,EAAA,GAHK,KAGL;EAGpB,CAAC;CACH,GAAG;EAAC;EAAU;EAAQ;EAAa;EAAW;EAAW;CAAM,CAAC;CAEhE,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,eAAAA,QAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAACH,gBAAAA,OAAO,OAAR,EAAc,GAAI,cAAc,EAAI,CAAA,EAC9B,CAAA,GAER,iBAAA,GAAA,kBAAA,IAAA,CAACA,gBAAAA,OAAO,KAAR;EAAY,GAAI;EAAU,GAAI,cAAc;EACzC,UAAA;CACS,CAAA,CACZ,EAAA,CAAA;AAEN,GACA,MACF,CAAC,EAAE,UAAU;CACX,MAAM,UAAUI,cAAAA,qBAAqB;CAErC,OAAOC,cAAAA,WAAW,SAAS,KAAK,CAAC,CAAC;AACpC,CAAC;AAID,MAAM,eAAe,YAAuC,QAAQ,KAAK,CAAC,CAAC"}
|
|
@@ -9,7 +9,7 @@ const require_hooks_use_clickable_index = require("../../hooks/use-clickable/ind
|
|
|
9
9
|
let react = require("react");
|
|
10
10
|
// src/components/file-input/use-file-input.ts
|
|
11
11
|
const useFileInput = (props) => {
|
|
12
|
-
const { context: { labelId } = {}, props: { id, ref, form, name,
|
|
12
|
+
const { context: { labelId } = {}, props: { id, ref, form, name, accept, defaultValue, disabled, multiple, placeholder, readOnly, required, resetRef, value, onChange: onChangeProp, onClick: onClickProp, ...rest }, ariaProps, dataProps, eventProps } = require_use_field_props.useFieldProps({
|
|
13
13
|
...props,
|
|
14
14
|
notSupportReadOnly: true
|
|
15
15
|
});
|
|
@@ -38,18 +38,18 @@ const useFileInput = (props) => {
|
|
|
38
38
|
...dataProps,
|
|
39
39
|
...eventProps,
|
|
40
40
|
...rest,
|
|
41
|
-
"aria-labelledby": (0, require_utils_index.utils_exports.cx)(ariaLabelledby, labelId),
|
|
42
41
|
disabled: !interactive,
|
|
43
42
|
focusable: readOnly && !disabled,
|
|
44
43
|
focusOnClick: interactive,
|
|
45
44
|
onClick: (0, require_utils_index.utils_exports.handlerAll)(onClickProp, onClick)
|
|
46
45
|
});
|
|
47
46
|
require_ref.assignRef(resetRef, onReset);
|
|
48
|
-
const getInputProps = (0, react.useCallback)((props = {}) => ({
|
|
47
|
+
const getInputProps = (0, react.useCallback)((props = {}) => require_props.mergeProps({
|
|
49
48
|
...require_dom.visuallyHiddenAttributes,
|
|
50
49
|
...ariaProps,
|
|
51
50
|
...dataProps,
|
|
52
51
|
id,
|
|
52
|
+
ref: inputRef,
|
|
53
53
|
form,
|
|
54
54
|
type: "file",
|
|
55
55
|
name,
|
|
@@ -57,11 +57,11 @@ const useFileInput = (props) => {
|
|
|
57
57
|
disabled,
|
|
58
58
|
multiple,
|
|
59
59
|
readOnly,
|
|
60
|
-
required
|
|
61
|
-
|
|
62
|
-
ref
|
|
63
|
-
onChange
|
|
64
|
-
}), [
|
|
60
|
+
required
|
|
61
|
+
}, props, {
|
|
62
|
+
ref,
|
|
63
|
+
onChange
|
|
64
|
+
})(), [
|
|
65
65
|
required,
|
|
66
66
|
ariaProps,
|
|
67
67
|
dataProps,
|
|
@@ -82,15 +82,22 @@ const useFileInput = (props) => {
|
|
|
82
82
|
required,
|
|
83
83
|
values,
|
|
84
84
|
clickableProps,
|
|
85
|
-
getFieldProps: (0, react.useCallback)((props = {}) =>
|
|
86
|
-
"
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
85
|
+
getFieldProps: (0, react.useCallback)((props = {}) => {
|
|
86
|
+
const hasLabel = (0, require_utils_index.utils_exports.has)(props, ["aria-label", "aria-labelledby"], { truthy: true }) || (0, require_utils_index.utils_exports.has)(clickableProps, ["aria-label", "aria-labelledby"], { truthy: true });
|
|
87
|
+
const hasPlaceholder = !!placeholder?.trim();
|
|
88
|
+
const hasValues = !!count;
|
|
89
|
+
return require_props.mergeProps({
|
|
90
|
+
"data-placeholder": (0, require_utils_index.utils_exports.dataAttr)(!count),
|
|
91
|
+
...clickableProps,
|
|
92
|
+
"aria-labelledby": clickableProps["aria-labelledby"] ?? (!hasLabel && !hasPlaceholder && !hasValues ? labelId : void 0),
|
|
93
|
+
tabIndex: interactive ? 0 : clickableProps.tabIndex
|
|
94
|
+
}, props)();
|
|
95
|
+
}, [
|
|
91
96
|
clickableProps,
|
|
92
97
|
count,
|
|
93
|
-
interactive
|
|
98
|
+
interactive,
|
|
99
|
+
labelId,
|
|
100
|
+
placeholder
|
|
94
101
|
]),
|
|
95
102
|
getInputProps
|
|
96
103
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-file-input.cjs","names":["useFieldProps","useRef","useControllableState","useCallback","useClickable","
|
|
1
|
+
{"version":3,"file":"use-file-input.cjs","names":["useFieldProps","useRef","useControllableState","useCallback","useClickable","mergeProps","visuallyHiddenAttributes"],"sources":["../../../../src/components/file-input/use-file-input.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, RefObject } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { Dict } from \"../../utils\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useRef } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useClickable } from \"../../hooks/use-clickable\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n assignRef,\n dataAttr,\n handlerAll,\n has,\n isNull,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nexport type UseFileInputProps<Y extends \"button\" | \"input\" = \"input\"> =\n FieldProps &\n Omit<HTMLProps<Y>, \"defaultValue\" | \"onChange\" | \"ref\" | \"value\"> &\n Pick<HTMLProps<\"input\">, \"accept\" | \"multiple\" | \"placeholder\" | \"ref\"> & {\n /**\n * The initial value of the file input.\n */\n defaultValue?: File[]\n /**\n * Ref to a reset function.\n */\n resetRef?: RefObject<(() => void) | null>\n /**\n * The value of the file input.\n */\n value?: File[]\n /**\n * Function to be called when a file change event occurs.\n */\n onChange?: (files: File[] | undefined) => void\n }\n\nexport const useFileInput = <Y extends \"button\" | \"input\" = \"input\">(\n props: UseFileInputProps<Y>,\n) => {\n const {\n context: { labelId } = {},\n props: {\n id,\n ref,\n form,\n name,\n accept,\n defaultValue,\n disabled,\n multiple,\n placeholder,\n readOnly,\n required,\n resetRef,\n value,\n onChange: onChangeProp,\n onClick: onClickProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps<HTMLElement, UseFileInputProps<Y>>({\n ...props,\n notSupportReadOnly: true,\n })\n const interactive = !(readOnly || disabled)\n const inputRef = useRef<HTMLInputElement>(null)\n const [values, setValues] = useControllableState<File[] | undefined>({\n defaultValue,\n value,\n onChange: onChangeProp,\n })\n const count = values?.length ?? 0\n\n const onClick = useCallback(() => {\n if (!interactive) return\n\n inputRef.current?.click()\n }, [interactive])\n\n const onReset = useCallback(() => {\n if (inputRef.current) inputRef.current.value = \"\"\n\n setValues(undefined)\n }, [setValues])\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n const files = !isNull(ev.currentTarget.files)\n ? Array.from(ev.currentTarget.files)\n : undefined\n\n setValues(files?.length ? files : undefined)\n },\n [setValues],\n )\n\n const clickableProps = useClickable<HTMLElement, Dict>({\n ...ariaProps,\n ...dataProps,\n ...eventProps,\n ...rest,\n disabled: !interactive,\n focusable: readOnly && !disabled,\n focusOnClick: interactive,\n onClick: handlerAll(onClickProp, onClick),\n })\n\n assignRef(resetRef, onReset)\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) =>\n mergeProps(\n {\n ...visuallyHiddenAttributes,\n ...ariaProps,\n ...dataProps,\n id,\n ref: inputRef,\n form,\n type: \"file\",\n name,\n accept,\n disabled,\n multiple,\n readOnly,\n required,\n },\n props,\n { ref, onChange },\n )(),\n [\n required,\n ariaProps,\n dataProps,\n id,\n form,\n name,\n accept,\n disabled,\n multiple,\n readOnly,\n ref,\n onChange,\n ],\n )\n\n const getFieldProps: PropGetter = useCallback(\n (props = {}) => {\n const hasLabel =\n has(props, [\"aria-label\", \"aria-labelledby\"], { truthy: true }) ||\n has(clickableProps, [\"aria-label\", \"aria-labelledby\"], { truthy: true })\n const hasPlaceholder = !!placeholder?.trim()\n const hasValues = !!count\n\n return mergeProps(\n {\n \"data-placeholder\": dataAttr(!count),\n ...clickableProps,\n \"aria-labelledby\":\n clickableProps[\"aria-labelledby\"] ??\n (!hasLabel && !hasPlaceholder && !hasValues ? labelId : undefined),\n tabIndex: interactive ? 0 : clickableProps.tabIndex,\n },\n props,\n )()\n },\n [clickableProps, count, interactive, labelId, placeholder],\n )\n\n return {\n disabled,\n interactive,\n readOnly,\n required,\n values,\n clickableProps,\n getFieldProps,\n getInputProps,\n }\n}\n\nexport type UseFileInputReturn = ReturnType<typeof useFileInput>\n"],"mappings":";;;;;;;;;;AA0CA,MAAa,gBACX,UACG;CACH,MAAM,EACJ,SAAS,EAAE,YAAY,CAAC,GACxB,OAAO,EACL,IACA,KACA,MACA,MACA,QACA,cACA,UACA,UACA,aACA,UACA,UACA,UACA,OACA,UAAU,cACV,SAAS,aACT,GAAG,QAEL,WACA,WACA,eACEA,wBAAAA,cAAiD;EACnD,GAAG;EACH,oBAAoB;CACtB,CAAC;CACD,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,YAAA,GAAWC,MAAAA,OAAAA,CAAyB,IAAI;CAC9C,MAAM,CAAC,QAAQ,aAAaC,2CAAAA,qBAAyC;EACnE;EACA;EACA,UAAU;CACZ,CAAC;CACD,MAAM,QAAQ,QAAQ,UAAU;CAEhC,MAAM,WAAA,GAAUC,MAAAA,YAAAA,OAAkB;EAChC,IAAI,CAAC,aAAa;EAElB,SAAS,SAAS,MAAM;CAC1B,GAAG,CAAC,WAAW,CAAC;CAEhB,MAAM,WAAA,GAAUA,MAAAA,YAAAA,OAAkB;EAChC,IAAI,SAAS,SAAS,SAAS,QAAQ,QAAQ;EAE/C,UAAU,KAAA,CAAS;CACrB,GAAG,CAAC,SAAS,CAAC;CAEd,MAAM,YAAA,GAAWA,MAAAA,YAAAA,EACd,OAAsC;EACrC,MAAM,QAAQ,EAAA,GAAA,oBAAA,cAAC,OAAA,CAAO,GAAG,cAAc,KAAK,IACxC,MAAM,KAAK,GAAG,cAAc,KAAK,IACjC,KAAA;EAEJ,UAAU,OAAO,SAAS,QAAQ,KAAA,CAAS;CAC7C,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,iBAAiBC,kCAAAA,aAAgC;EACrD,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACH,UAAU,CAAC;EACX,WAAW,YAAY,CAAC;EACxB,cAAc;EACd,UAAA,GAAA,oBAAA,cAAS,WAAA,CAAW,aAAa,OAAO;CAC1C,CAAC;CAED,YAAA,UAAU,UAAU,OAAO;CAE3B,MAAM,iBAAA,GAAqCD,MAAAA,YAAAA,EACxC,QAAQ,CAAC,MACRE,cAAAA,WACE;EACE,GAAGC,YAAAA;EACH,GAAG;EACH,GAAG;EACH;EACA,KAAK;EACL;EACA,MAAM;EACN;EACA;EACA;EACA;EACA;EACA;CACF,GACA,OACA;EAAE;EAAK;CAAS,CAClB,CAAC,CAAC,GACJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAyBA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA,gBAAA,GA9BgCH,MAAAA,YAAAA,EAC/B,QAAQ,CAAC,MAAM;GACd,MAAM,YAAA,GAAA,oBAAA,cACJ,IAAA,CAAI,OAAO,CAAC,cAAc,iBAAiB,GAAG,EAAE,QAAQ,KAAK,CAAC,MAAA,GAAA,oBAAA,cAC9D,IAAA,CAAI,gBAAgB,CAAC,cAAc,iBAAiB,GAAG,EAAE,QAAQ,KAAK,CAAC;GACzE,MAAM,iBAAiB,CAAC,CAAC,aAAa,KAAK;GAC3C,MAAM,YAAY,CAAC,CAAC;GAEpB,OAAOE,cAAAA,WACL;IACE,qBAAA,GAAA,oBAAA,cAAoB,SAAA,CAAS,CAAC,KAAK;IACnC,GAAG;IACH,mBACE,eAAe,uBACd,CAAC,YAAY,CAAC,kBAAkB,CAAC,YAAY,UAAU,KAAA;IAC1D,UAAU,cAAc,IAAI,eAAe;GAC7C,GACA,KACF,CAAC,CAAC;EACJ,GACA;GAAC;GAAgB;GAAO;GAAa;GAAS;EAAW,CAU7C;EACZ;CACF;AACF"}
|
|
@@ -13,7 +13,10 @@ const [RadioGroupContext, useRadioGroupContext] = require_context.createContext(
|
|
|
13
13
|
});
|
|
14
14
|
const useRadioGroup = (props = {}) => {
|
|
15
15
|
const uuid = (0, react.useId)();
|
|
16
|
-
const { context: { labelId } = {}, props: { id = uuid, defaultValue, disabled, readOnly, required, value: valueProp, onChange: onChangeProp, ...rest }, ariaProps: { "aria-describedby": ariaDescribedby, ...ariaProps }, dataProps, eventProps } = require_use_field_props.useFieldProps(
|
|
16
|
+
const { context: { labelId } = {}, props: { id = uuid, defaultValue, disabled, readOnly, required, value: valueProp, onChange: onChangeProp, ...rest }, ariaProps: { "aria-describedby": ariaDescribedby, ...ariaProps }, dataProps, eventProps } = require_use_field_props.useFieldProps({
|
|
17
|
+
...props,
|
|
18
|
+
notSupportReadOnly: true
|
|
19
|
+
});
|
|
17
20
|
const interactive = !(readOnly || disabled);
|
|
18
21
|
const [value, setValue] = require_hooks_use_controllable_state_index.useControllableState({
|
|
19
22
|
defaultValue,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-radio-group.cjs","names":["createContext","useId","useFieldProps","useControllableState","useCallback","mergeProps","visuallyHiddenAttributes"],"sources":["../../../../src/components/radio/use-radio-group.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n createContext,\n dataAttr,\n isObject,\n isUndefined,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface RadioGroupContext extends Omit<UseRadioGroupReturn, \"getRootProps\"> {}\n\nconst [RadioGroupContext, useRadioGroupContext] =\n createContext<RadioGroupContext>({\n name: \"RadioGroupContext\",\n strict: false,\n })\n\nexport { RadioGroupContext, useRadioGroupContext }\n\nexport interface UseRadioGroupProps<Y extends string = string>\n extends Omit<HTMLProps, \"defaultValue\" | \"onChange\" | \"value\">, FieldProps {\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <Y extends string = string>(\n props: UseRadioGroupProps<Y> = {},\n) => {\n const uuid = useId()\n const {\n context: { labelId } = {},\n props: {\n id = uuid,\n defaultValue,\n disabled,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedby, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const interactive = !(readOnly || disabled)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (valueOrEv: ChangeEvent<HTMLInputElement> | Y) => {\n if (!interactive) return\n\n if (isObject(valueOrEv)) setValue(valueOrEv.target.value as Y)\n else setValue(valueOrEv)\n },\n [interactive, setValue],\n )\n\n const getRootProps: PropGetter = useCallback(\n (props = {}) =>\n mergeProps(\n dataProps,\n {\n id,\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": labelId,\n role: \"radiogroup\",\n },\n rest,\n props,\n )(),\n [ariaDescribedby, dataProps, id, labelId, rest],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => {\n const checked = !isUndefined(value) && value === props.value\n\n return mergeProps(\n {\n ...dataProps,\n ...ariaProps,\n type: \"radio\",\n name: id,\n style: visuallyHiddenAttributes.style,\n \"aria-checked\": checked,\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n },\n props,\n { onChange, ...eventProps },\n )()\n },\n [\n ariaProps,\n dataProps,\n disabled,\n eventProps,\n id,\n onChange,\n readOnly,\n required,\n value,\n ],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n (props) => ({\n ...dataProps,\n ...props,\n }),\n [dataProps],\n )\n\n return {\n name: id,\n value,\n getInputProps,\n getLabelProps,\n getRootProps,\n onChange,\n }\n}\n\nexport type UseRadioGroupReturn = ReturnType<typeof useRadioGroup>\n"],"mappings":";;;;;;;;;AAmBA,MAAM,CAAC,mBAAmB,wBACxBA,gBAAAA,cAAiC;CAC/B,MAAM;CACN,QAAQ;AACV,CAAC;AAoBH,MAAa,iBACX,QAA+B,CAAC,MAC7B;CACH,MAAM,QAAA,GAAOC,MAAAA,MAAAA,CAAM;CACnB,MAAM,EACJ,SAAS,EAAE,YAAY,CAAC,GACxB,OAAO,EACL,KAAK,MACL,cACA,UACA,UACA,UACA,OAAO,WACP,UAAU,cACV,GAAG,QAEL,WAAW,EAAE,oBAAoB,iBAAiB,GAAG,aACrD,WACA,eACEC,wBAAAA,cAAc,
|
|
1
|
+
{"version":3,"file":"use-radio-group.cjs","names":["createContext","useId","useFieldProps","useControllableState","useCallback","mergeProps","visuallyHiddenAttributes"],"sources":["../../../../src/components/radio/use-radio-group.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n createContext,\n dataAttr,\n isObject,\n isUndefined,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface RadioGroupContext extends Omit<UseRadioGroupReturn, \"getRootProps\"> {}\n\nconst [RadioGroupContext, useRadioGroupContext] =\n createContext<RadioGroupContext>({\n name: \"RadioGroupContext\",\n strict: false,\n })\n\nexport { RadioGroupContext, useRadioGroupContext }\n\nexport interface UseRadioGroupProps<Y extends string = string>\n extends Omit<HTMLProps, \"defaultValue\" | \"onChange\" | \"value\">, FieldProps {\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <Y extends string = string>(\n props: UseRadioGroupProps<Y> = {},\n) => {\n const uuid = useId()\n const {\n context: { labelId } = {},\n props: {\n id = uuid,\n defaultValue,\n disabled,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedby, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps({\n ...props,\n notSupportReadOnly: true,\n })\n const interactive = !(readOnly || disabled)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (valueOrEv: ChangeEvent<HTMLInputElement> | Y) => {\n if (!interactive) return\n\n if (isObject(valueOrEv)) setValue(valueOrEv.target.value as Y)\n else setValue(valueOrEv)\n },\n [interactive, setValue],\n )\n\n const getRootProps: PropGetter = useCallback(\n (props = {}) =>\n mergeProps(\n dataProps,\n {\n id,\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": labelId,\n role: \"radiogroup\",\n },\n rest,\n props,\n )(),\n [ariaDescribedby, dataProps, id, labelId, rest],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => {\n const checked = !isUndefined(value) && value === props.value\n\n return mergeProps(\n {\n ...dataProps,\n ...ariaProps,\n type: \"radio\",\n name: id,\n style: visuallyHiddenAttributes.style,\n \"aria-checked\": checked,\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n },\n props,\n { onChange, ...eventProps },\n )()\n },\n [\n ariaProps,\n dataProps,\n disabled,\n eventProps,\n id,\n onChange,\n readOnly,\n required,\n value,\n ],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n (props) => ({\n ...dataProps,\n ...props,\n }),\n [dataProps],\n )\n\n return {\n name: id,\n value,\n getInputProps,\n getLabelProps,\n getRootProps,\n onChange,\n }\n}\n\nexport type UseRadioGroupReturn = ReturnType<typeof useRadioGroup>\n"],"mappings":";;;;;;;;;AAmBA,MAAM,CAAC,mBAAmB,wBACxBA,gBAAAA,cAAiC;CAC/B,MAAM;CACN,QAAQ;AACV,CAAC;AAoBH,MAAa,iBACX,QAA+B,CAAC,MAC7B;CACH,MAAM,QAAA,GAAOC,MAAAA,MAAAA,CAAM;CACnB,MAAM,EACJ,SAAS,EAAE,YAAY,CAAC,GACxB,OAAO,EACL,KAAK,MACL,cACA,UACA,UACA,UACA,OAAO,WACP,UAAU,cACV,GAAG,QAEL,WAAW,EAAE,oBAAoB,iBAAiB,GAAG,aACrD,WACA,eACEC,wBAAAA,cAAc;EAChB,GAAG;EACH,oBAAoB;CACtB,CAAC;CACD,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,CAAC,OAAO,YAAYC,2CAAAA,qBAAqB;EAC7C;EACA,OAAO;EACP,UAAU;CACZ,CAAC;CAED,MAAM,YAAA,GAAWC,MAAAA,YAAAA,EACd,cAAiD;EAChD,IAAI,CAAC,aAAa;EAElB,KAAA,GAAA,oBAAA,cAAI,SAAA,CAAS,SAAS,GAAG,SAAS,UAAU,OAAO,KAAU;OACxD,SAAS,SAAS;CACzB,GACA,CAAC,aAAa,QAAQ,CACxB;CAEA,MAAM,gBAAA,GAA2BA,MAAAA,YAAAA,EAC9B,QAAQ,CAAC,MACRC,cAAAA,WACE,WACA;EACE;EACA,oBAAoB;EACpB,mBAAmB;EACnB,MAAM;CACR,GACA,MACA,KACF,CAAC,CAAC,GACJ;EAAC;EAAiB;EAAW;EAAI;EAAS;CAAI,CAChD;CA6CA,OAAO;EACL,MAAM;EACN;EACA,gBAAA,GA9CyCD,MAAAA,YAAAA,EACxC,QAAQ,CAAC,MAAM;GACd,MAAM,UAAU,EAAA,GAAA,oBAAA,cAAC,YAAA,CAAY,KAAK,KAAK,UAAU,MAAM;GAEvD,OAAOC,cAAAA,WACL;IACE,GAAG;IACH,GAAG;IACH,MAAM;IACN,MAAM;IACN,OAAOC,YAAAA,yBAAyB;IAChC,gBAAgB;IAChB,iBAAA,GAAA,oBAAA,cAAgB,SAAA,CAAS,OAAO;IAChC;IACA;IACA;IACA;GACF,GACA,OACA;IAAE;IAAU,GAAG;GAAW,CAC5B,CAAC,CAAC;EACJ,GACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAcY;EACZ,gBAAA,GAZyCF,MAAAA,YAAAA,EACxC,WAAW;GACV,GAAG;GACH,GAAG;EACL,IACA,CAAC,SAAS,CAOE;EACZ;EACA;CACF;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","names":[],"sources":["../../../src/utils/index.ts"],"sourcesContent":["export * from \"./children\"\nexport * from \"./context\"\nexport * from \"./dom\"\nexport * from \"./effect\"\nexport type * from \"./index.type\"\nexport * from \"./ref\"\nexport * from \"./ssr\"\nexport * from \"./store\"\nexport * from \"@yamada-ui/utils\"\nexport type {\n AnyPointerEvent,\n AnyString,\n Booleanish,\n ColorFormat,\n DeepMerge,\n DeepPartial,\n Dict,\n EventType,\n FlattenObjectOptions,\n FunctionOf,\n FunctionOrValue,\n Length,\n Merge,\n MergeOptions,\n Path,\n Point,\n Prettify,\n Primitive,\n Value,\n} from \"@yamada-ui/utils\"\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"index.cjs","names":[],"sources":["../../../src/utils/index.ts"],"sourcesContent":["export * from \"./children\"\nexport * from \"./context\"\nexport * from \"./dom\"\nexport * from \"./effect\"\nexport type * from \"./index.type\"\nexport * from \"./ref\"\nexport * from \"./ssr\"\nexport * from \"./store\"\nexport * from \"@yamada-ui/utils\"\nexport type {\n AnyPointerEvent,\n AnyString,\n Booleanish,\n ColorFormat,\n DeepMerge,\n DeepPartial,\n Dict,\n EventType,\n FlattenObjectOptions,\n FunctionOf,\n FunctionOrValue,\n HasOptions,\n Length,\n Merge,\n MergeOptions,\n Path,\n Point,\n Prettify,\n Primitive,\n Value,\n} from \"@yamada-ui/utils\"\n"],"mappings":""}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import { mergeProps } from "../../core/components/props.js";
|
|
2
3
|
import { useFileInput } from "../file-input/use-file-input.js";
|
|
3
4
|
import { useCallback } from "react";
|
|
4
5
|
// src/components/file-button/use-file-button.ts
|
|
@@ -6,10 +7,7 @@ const useFileButton = (props = {}) => {
|
|
|
6
7
|
const { clickableProps, getInputProps } = useFileInput(props);
|
|
7
8
|
return {
|
|
8
9
|
clickableProps,
|
|
9
|
-
getButtonProps: useCallback((props) => (
|
|
10
|
-
...clickableProps,
|
|
11
|
-
...props
|
|
12
|
-
}), [clickableProps]),
|
|
10
|
+
getButtonProps: useCallback((props = {}) => mergeProps(clickableProps, props)(), [clickableProps]),
|
|
13
11
|
getInputProps
|
|
14
12
|
};
|
|
15
13
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-file-button.js","names":[],"sources":["../../../../src/components/file-button/use-file-button.ts"],"sourcesContent":["\"use client\"\n\nimport type { PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport type { UseFileInputProps } from \"../file-input\"\nimport { useCallback } from \"react\"\nimport { useFileInput } from \"../file-input\"\n\nexport interface UseFileButtonProps\n extends UseFileInputProps<\"button\">, FieldProps {}\n\nexport const useFileButton = (props: UseFileButtonProps = {}) => {\n const { clickableProps, getInputProps } = useFileInput<\"button\">(props)\n\n const getButtonProps: PropGetter<\"button\"> = useCallback(\n (props) => (
|
|
1
|
+
{"version":3,"file":"use-file-button.js","names":[],"sources":["../../../../src/components/file-button/use-file-button.ts"],"sourcesContent":["\"use client\"\n\nimport type { PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport type { UseFileInputProps } from \"../file-input\"\nimport { useCallback } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useFileInput } from \"../file-input\"\n\nexport interface UseFileButtonProps\n extends UseFileInputProps<\"button\">, FieldProps {}\n\nexport const useFileButton = (props: UseFileButtonProps = {}) => {\n const { clickableProps, getInputProps } = useFileInput<\"button\">(props)\n\n const getButtonProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => mergeProps(clickableProps, props)(),\n [clickableProps],\n )\n\n return {\n clickableProps,\n getButtonProps,\n getInputProps,\n }\n}\n\nexport type UseFileButtonReturn = ReturnType<typeof useFileButton>\n"],"mappings":";;;;;AAYA,MAAa,iBAAiB,QAA4B,CAAC,MAAM;CAC/D,MAAM,EAAE,gBAAgB,kBAAkB,aAAuB,KAAK;CAOtE,OAAO;EACL;EACA,gBAP2C,aAC1C,QAAQ,CAAC,MAAM,WAAW,gBAAgB,KAAK,CAAC,CAAC,GAClD,CAAC,cAAc,CAKF;EACb;CACF;AACF"}
|
|
@@ -22,7 +22,10 @@ const FileInput = withProvider(({ children, component, errorBorderColor, focusBo
|
|
|
22
22
|
errorBorderColor,
|
|
23
23
|
focusBorderColor
|
|
24
24
|
});
|
|
25
|
-
const { values, getFieldProps, getInputProps } = useFileInput(
|
|
25
|
+
const { values, getFieldProps, getInputProps } = useFileInput({
|
|
26
|
+
placeholder,
|
|
27
|
+
...props
|
|
28
|
+
});
|
|
26
29
|
const cloneChildren = useMemo(() => {
|
|
27
30
|
if (!values?.length) return /* @__PURE__ */ jsx(styled.span, {
|
|
28
31
|
overflow: "hidden",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-input.js","names":[],"sources":["../../../../src/components/file-input/file-input.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { FileInputStyle } from \"./file-input.style\"\nimport type { UseFileInputProps } from \"./use-file-input\"\nimport { cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, mergeProps, styled } from \"../../core\"\nimport { useInputBorder, useInputPropsContext } from \"../input\"\nimport { Portal } from \"../portal\"\nimport { fileInputStyle } from \"./file-input.style\"\nimport { useFileInput } from \"./use-file-input\"\n\nconst defaultFormat: (value: File, index: number) => string = ({ name }) => name\n\nexport interface FileInputProps\n extends\n Omit<\n HTMLStyledProps<\"input\">,\n \"children\" | \"defaultValue\" | \"onChange\" | \"value\"\n >,\n ThemeProps<FileInputStyle>,\n UseInputBorderProps,\n FieldProps,\n Omit<UseFileInputProps, \"children\"> {\n /**\n * The string to separate uploaded files.\n *\n * @default ','\n */\n separator?: string\n /**\n * A callback that returns a React node.\n */\n children?: (files: File[] | undefined) => ReactNode\n /**\n * The component that displays uploaded files.\n */\n component?: (props: { index: number; value: File }) => ReactNode\n /**\n * A callback that formats the name of the uploaded file.\n */\n format?: (value: File, index: number) => string\n}\n\nconst {\n PropsContext: FileInputPropsContext,\n usePropsContext: useFileInputPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<FileInputProps, FileInputStyle>(\n \"file-input\",\n fileInputStyle,\n)\n\nexport { FileInputPropsContext, useFileInputPropsContext }\n\n/**\n * `FileInput` is a component used for users to select files.\n *\n * @see https://yamada-ui.com/docs/components/file-input\n */\nexport const FileInput = withProvider<\"input\", FileInputProps>(\n ({\n children,\n component,\n errorBorderColor,\n focusBorderColor,\n format = defaultFormat,\n placeholder,\n separator = \",\",\n ...props\n }) => {\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const { values, getFieldProps, getInputProps } = useFileInput(props)\n\n const cloneChildren = useMemo(() => {\n if (!values?.length)\n return (\n <styled.span overflow=\"hidden\" whiteSpace=\"nowrap\">\n {placeholder}\n </styled.span>\n )\n\n if (children) return children(values)\n\n return values.map((value, index) => {\n const last = values.length === index + 1\n\n if (component) {\n const node = component({ index, value })\n\n if (isValidElement(node)) return cloneElement(node, { key: index })\n else return node\n } else {\n return (\n <FileInputTag key={index}>\n {format(value, index)}\n {!last ? separator : null}\n </FileInputTag>\n )\n }\n })\n }, [children, format, placeholder, separator, component, values])\n\n return (\n <>\n <Portal>\n <styled.input {...getInputProps()} />\n </Portal>\n\n <styled.div {...varProps} {...getFieldProps()}>\n {cloneChildren}\n </styled.div>\n </>\n )\n },\n \"root\",\n)((props) => {\n const context = useInputPropsContext()\n\n return mergeProps(context, props)()\n})\n\ninterface FileInputTagProps extends HTMLStyledProps {}\n\nconst FileInputTag = withContext<\"span\", FileInputTagProps>(\"span\", \"tag\")()\n"],"mappings":";;;;;;;;;;;;AAeA,MAAM,iBAAyD,EAAE,WAAW;AAgC5E,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,aACA,iBACE,oBACF,cACA,cACF;;;;;;AASA,MAAa,YAAY,cACtB,EACC,UACA,WACA,kBACA,kBACA,SAAS,eACT,aACA,YAAY,KACZ,GAAG,YACC;CACJ,MAAM,WAAW,eAAe;EAAE;EAAkB;CAAiB,CAAC;CACtE,MAAM,EAAE,QAAQ,eAAe,kBAAkB,aAAa,
|
|
1
|
+
{"version":3,"file":"file-input.js","names":[],"sources":["../../../../src/components/file-input/file-input.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { FileInputStyle } from \"./file-input.style\"\nimport type { UseFileInputProps } from \"./use-file-input\"\nimport { cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, mergeProps, styled } from \"../../core\"\nimport { useInputBorder, useInputPropsContext } from \"../input\"\nimport { Portal } from \"../portal\"\nimport { fileInputStyle } from \"./file-input.style\"\nimport { useFileInput } from \"./use-file-input\"\n\nconst defaultFormat: (value: File, index: number) => string = ({ name }) => name\n\nexport interface FileInputProps\n extends\n Omit<\n HTMLStyledProps<\"input\">,\n \"children\" | \"defaultValue\" | \"onChange\" | \"value\"\n >,\n ThemeProps<FileInputStyle>,\n UseInputBorderProps,\n FieldProps,\n Omit<UseFileInputProps, \"children\"> {\n /**\n * The string to separate uploaded files.\n *\n * @default ','\n */\n separator?: string\n /**\n * A callback that returns a React node.\n */\n children?: (files: File[] | undefined) => ReactNode\n /**\n * The component that displays uploaded files.\n */\n component?: (props: { index: number; value: File }) => ReactNode\n /**\n * A callback that formats the name of the uploaded file.\n */\n format?: (value: File, index: number) => string\n}\n\nconst {\n PropsContext: FileInputPropsContext,\n usePropsContext: useFileInputPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<FileInputProps, FileInputStyle>(\n \"file-input\",\n fileInputStyle,\n)\n\nexport { FileInputPropsContext, useFileInputPropsContext }\n\n/**\n * `FileInput` is a component used for users to select files.\n *\n * @see https://yamada-ui.com/docs/components/file-input\n */\nexport const FileInput = withProvider<\"input\", FileInputProps>(\n ({\n children,\n component,\n errorBorderColor,\n focusBorderColor,\n format = defaultFormat,\n placeholder,\n separator = \",\",\n ...props\n }) => {\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const { values, getFieldProps, getInputProps } = useFileInput({\n placeholder,\n ...props,\n })\n\n const cloneChildren = useMemo(() => {\n if (!values?.length)\n return (\n <styled.span overflow=\"hidden\" whiteSpace=\"nowrap\">\n {placeholder}\n </styled.span>\n )\n\n if (children) return children(values)\n\n return values.map((value, index) => {\n const last = values.length === index + 1\n\n if (component) {\n const node = component({ index, value })\n\n if (isValidElement(node)) return cloneElement(node, { key: index })\n else return node\n } else {\n return (\n <FileInputTag key={index}>\n {format(value, index)}\n {!last ? separator : null}\n </FileInputTag>\n )\n }\n })\n }, [children, format, placeholder, separator, component, values])\n\n return (\n <>\n <Portal>\n <styled.input {...getInputProps()} />\n </Portal>\n\n <styled.div {...varProps} {...getFieldProps()}>\n {cloneChildren}\n </styled.div>\n </>\n )\n },\n \"root\",\n)((props) => {\n const context = useInputPropsContext()\n\n return mergeProps(context, props)()\n})\n\ninterface FileInputTagProps extends HTMLStyledProps {}\n\nconst FileInputTag = withContext<\"span\", FileInputTagProps>(\"span\", \"tag\")()\n"],"mappings":";;;;;;;;;;;;AAeA,MAAM,iBAAyD,EAAE,WAAW;AAgC5E,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,aACA,iBACE,oBACF,cACA,cACF;;;;;;AASA,MAAa,YAAY,cACtB,EACC,UACA,WACA,kBACA,kBACA,SAAS,eACT,aACA,YAAY,KACZ,GAAG,YACC;CACJ,MAAM,WAAW,eAAe;EAAE;EAAkB;CAAiB,CAAC;CACtE,MAAM,EAAE,QAAQ,eAAe,kBAAkB,aAAa;EAC5D;EACA,GAAG;CACL,CAAC;CAED,MAAM,gBAAgB,cAAc;EAClC,IAAI,CAAC,QAAQ,QACX,OACE,oBAAC,OAAO,MAAR;GAAa,UAAS;GAAS,YAAW;GACvC,UAAA;EACU,CAAA;EAGjB,IAAI,UAAU,OAAO,SAAS,MAAM;EAEpC,OAAO,OAAO,KAAK,OAAO,UAAU;GAClC,MAAM,OAAO,OAAO,WAAW,QAAQ;GAEvC,IAAI,WAAW;IACb,MAAM,OAAO,UAAU;KAAE;KAAO;IAAM,CAAC;IAEvC,IAAI,eAAe,IAAI,GAAG,OAAO,aAAa,MAAM,EAAE,KAAK,MAAM,CAAC;SAC7D,OAAO;GACd,OACE,OACE,qBAAC,cAAD,EAAA,UAAA,CACG,OAAO,OAAO,KAAK,GACnB,CAAC,OAAO,YAAY,IACT,EAAA,GAHK,KAGL;EAGpB,CAAC;CACH,GAAG;EAAC;EAAU;EAAQ;EAAa;EAAW;EAAW;CAAM,CAAC;CAEhE,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD,EAAA,UACE,oBAAC,OAAO,OAAR,EAAc,GAAI,cAAc,EAAI,CAAA,EAC9B,CAAA,GAER,oBAAC,OAAO,KAAR;EAAY,GAAI;EAAU,GAAI,cAAc;EACzC,UAAA;CACS,CAAA,CACZ,EAAA,CAAA;AAEN,GACA,MACF,CAAC,EAAE,UAAU;CACX,MAAM,UAAU,qBAAqB;CAErC,OAAO,WAAW,SAAS,KAAK,CAAC,CAAC;AACpC,CAAC;AAID,MAAM,eAAe,YAAuC,QAAQ,KAAK,CAAC,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { visuallyHiddenAttributes } from "../../utils/dom.js";
|
|
3
|
-
import { assignRef
|
|
3
|
+
import { assignRef } from "../../utils/ref.js";
|
|
4
4
|
import { utils_exports } from "../../utils/index.js";
|
|
5
5
|
import { mergeProps } from "../../core/components/props.js";
|
|
6
6
|
import { useControllableState } from "../../hooks/use-controllable-state/index.js";
|
|
@@ -9,7 +9,7 @@ import { useClickable } from "../../hooks/use-clickable/index.js";
|
|
|
9
9
|
import { useCallback, useRef } from "react";
|
|
10
10
|
// src/components/file-input/use-file-input.ts
|
|
11
11
|
const useFileInput = (props) => {
|
|
12
|
-
const { context: { labelId } = {}, props: { id, ref, form, name,
|
|
12
|
+
const { context: { labelId } = {}, props: { id, ref, form, name, accept, defaultValue, disabled, multiple, placeholder, readOnly, required, resetRef, value, onChange: onChangeProp, onClick: onClickProp, ...rest }, ariaProps, dataProps, eventProps } = useFieldProps({
|
|
13
13
|
...props,
|
|
14
14
|
notSupportReadOnly: true
|
|
15
15
|
});
|
|
@@ -38,18 +38,18 @@ const useFileInput = (props) => {
|
|
|
38
38
|
...dataProps,
|
|
39
39
|
...eventProps,
|
|
40
40
|
...rest,
|
|
41
|
-
"aria-labelledby": (0, utils_exports.cx)(ariaLabelledby, labelId),
|
|
42
41
|
disabled: !interactive,
|
|
43
42
|
focusable: readOnly && !disabled,
|
|
44
43
|
focusOnClick: interactive,
|
|
45
44
|
onClick: (0, utils_exports.handlerAll)(onClickProp, onClick)
|
|
46
45
|
});
|
|
47
46
|
assignRef(resetRef, onReset);
|
|
48
|
-
const getInputProps = useCallback((props = {}) => ({
|
|
47
|
+
const getInputProps = useCallback((props = {}) => mergeProps({
|
|
49
48
|
...visuallyHiddenAttributes,
|
|
50
49
|
...ariaProps,
|
|
51
50
|
...dataProps,
|
|
52
51
|
id,
|
|
52
|
+
ref: inputRef,
|
|
53
53
|
form,
|
|
54
54
|
type: "file",
|
|
55
55
|
name,
|
|
@@ -57,11 +57,11 @@ const useFileInput = (props) => {
|
|
|
57
57
|
disabled,
|
|
58
58
|
multiple,
|
|
59
59
|
readOnly,
|
|
60
|
-
required
|
|
61
|
-
|
|
62
|
-
ref
|
|
63
|
-
onChange
|
|
64
|
-
}), [
|
|
60
|
+
required
|
|
61
|
+
}, props, {
|
|
62
|
+
ref,
|
|
63
|
+
onChange
|
|
64
|
+
})(), [
|
|
65
65
|
required,
|
|
66
66
|
ariaProps,
|
|
67
67
|
dataProps,
|
|
@@ -82,15 +82,22 @@ const useFileInput = (props) => {
|
|
|
82
82
|
required,
|
|
83
83
|
values,
|
|
84
84
|
clickableProps,
|
|
85
|
-
getFieldProps: useCallback((props = {}) =>
|
|
86
|
-
"
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
85
|
+
getFieldProps: useCallback((props = {}) => {
|
|
86
|
+
const hasLabel = (0, utils_exports.has)(props, ["aria-label", "aria-labelledby"], { truthy: true }) || (0, utils_exports.has)(clickableProps, ["aria-label", "aria-labelledby"], { truthy: true });
|
|
87
|
+
const hasPlaceholder = !!placeholder?.trim();
|
|
88
|
+
const hasValues = !!count;
|
|
89
|
+
return mergeProps({
|
|
90
|
+
"data-placeholder": (0, utils_exports.dataAttr)(!count),
|
|
91
|
+
...clickableProps,
|
|
92
|
+
"aria-labelledby": clickableProps["aria-labelledby"] ?? (!hasLabel && !hasPlaceholder && !hasValues ? labelId : void 0),
|
|
93
|
+
tabIndex: interactive ? 0 : clickableProps.tabIndex
|
|
94
|
+
}, props)();
|
|
95
|
+
}, [
|
|
91
96
|
clickableProps,
|
|
92
97
|
count,
|
|
93
|
-
interactive
|
|
98
|
+
interactive,
|
|
99
|
+
labelId,
|
|
100
|
+
placeholder
|
|
94
101
|
]),
|
|
95
102
|
getInputProps
|
|
96
103
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-file-input.js","names":["isNull","
|
|
1
|
+
{"version":3,"file":"use-file-input.js","names":["isNull","handlerAll","has","dataAttr"],"sources":["../../../../src/components/file-input/use-file-input.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, RefObject } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { Dict } from \"../../utils\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useRef } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useClickable } from \"../../hooks/use-clickable\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n assignRef,\n dataAttr,\n handlerAll,\n has,\n isNull,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nexport type UseFileInputProps<Y extends \"button\" | \"input\" = \"input\"> =\n FieldProps &\n Omit<HTMLProps<Y>, \"defaultValue\" | \"onChange\" | \"ref\" | \"value\"> &\n Pick<HTMLProps<\"input\">, \"accept\" | \"multiple\" | \"placeholder\" | \"ref\"> & {\n /**\n * The initial value of the file input.\n */\n defaultValue?: File[]\n /**\n * Ref to a reset function.\n */\n resetRef?: RefObject<(() => void) | null>\n /**\n * The value of the file input.\n */\n value?: File[]\n /**\n * Function to be called when a file change event occurs.\n */\n onChange?: (files: File[] | undefined) => void\n }\n\nexport const useFileInput = <Y extends \"button\" | \"input\" = \"input\">(\n props: UseFileInputProps<Y>,\n) => {\n const {\n context: { labelId } = {},\n props: {\n id,\n ref,\n form,\n name,\n accept,\n defaultValue,\n disabled,\n multiple,\n placeholder,\n readOnly,\n required,\n resetRef,\n value,\n onChange: onChangeProp,\n onClick: onClickProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps<HTMLElement, UseFileInputProps<Y>>({\n ...props,\n notSupportReadOnly: true,\n })\n const interactive = !(readOnly || disabled)\n const inputRef = useRef<HTMLInputElement>(null)\n const [values, setValues] = useControllableState<File[] | undefined>({\n defaultValue,\n value,\n onChange: onChangeProp,\n })\n const count = values?.length ?? 0\n\n const onClick = useCallback(() => {\n if (!interactive) return\n\n inputRef.current?.click()\n }, [interactive])\n\n const onReset = useCallback(() => {\n if (inputRef.current) inputRef.current.value = \"\"\n\n setValues(undefined)\n }, [setValues])\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n const files = !isNull(ev.currentTarget.files)\n ? Array.from(ev.currentTarget.files)\n : undefined\n\n setValues(files?.length ? files : undefined)\n },\n [setValues],\n )\n\n const clickableProps = useClickable<HTMLElement, Dict>({\n ...ariaProps,\n ...dataProps,\n ...eventProps,\n ...rest,\n disabled: !interactive,\n focusable: readOnly && !disabled,\n focusOnClick: interactive,\n onClick: handlerAll(onClickProp, onClick),\n })\n\n assignRef(resetRef, onReset)\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) =>\n mergeProps(\n {\n ...visuallyHiddenAttributes,\n ...ariaProps,\n ...dataProps,\n id,\n ref: inputRef,\n form,\n type: \"file\",\n name,\n accept,\n disabled,\n multiple,\n readOnly,\n required,\n },\n props,\n { ref, onChange },\n )(),\n [\n required,\n ariaProps,\n dataProps,\n id,\n form,\n name,\n accept,\n disabled,\n multiple,\n readOnly,\n ref,\n onChange,\n ],\n )\n\n const getFieldProps: PropGetter = useCallback(\n (props = {}) => {\n const hasLabel =\n has(props, [\"aria-label\", \"aria-labelledby\"], { truthy: true }) ||\n has(clickableProps, [\"aria-label\", \"aria-labelledby\"], { truthy: true })\n const hasPlaceholder = !!placeholder?.trim()\n const hasValues = !!count\n\n return mergeProps(\n {\n \"data-placeholder\": dataAttr(!count),\n ...clickableProps,\n \"aria-labelledby\":\n clickableProps[\"aria-labelledby\"] ??\n (!hasLabel && !hasPlaceholder && !hasValues ? labelId : undefined),\n tabIndex: interactive ? 0 : clickableProps.tabIndex,\n },\n props,\n )()\n },\n [clickableProps, count, interactive, labelId, placeholder],\n )\n\n return {\n disabled,\n interactive,\n readOnly,\n required,\n values,\n clickableProps,\n getFieldProps,\n getInputProps,\n }\n}\n\nexport type UseFileInputReturn = ReturnType<typeof useFileInput>\n"],"mappings":";;;;;;;;;;AA0CA,MAAa,gBACX,UACG;CACH,MAAM,EACJ,SAAS,EAAE,YAAY,CAAC,GACxB,OAAO,EACL,IACA,KACA,MACA,MACA,QACA,cACA,UACA,UACA,aACA,UACA,UACA,UACA,OACA,UAAU,cACV,SAAS,aACT,GAAG,QAEL,WACA,WACA,eACE,cAAiD;EACnD,GAAG;EACH,oBAAoB;CACtB,CAAC;CACD,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,WAAW,OAAyB,IAAI;CAC9C,MAAM,CAAC,QAAQ,aAAa,qBAAyC;EACnE;EACA;EACA,UAAU;CACZ,CAAC;CACD,MAAM,QAAQ,QAAQ,UAAU;CAEhC,MAAM,UAAU,kBAAkB;EAChC,IAAI,CAAC,aAAa;EAElB,SAAS,SAAS,MAAM;CAC1B,GAAG,CAAC,WAAW,CAAC;CAEhB,MAAM,UAAU,kBAAkB;EAChC,IAAI,SAAS,SAAS,SAAS,QAAQ,QAAQ;EAE/C,UAAU,KAAA,CAAS;CACrB,GAAG,CAAC,SAAS,CAAC;CAEd,MAAM,WAAW,aACd,OAAsC;EACrC,MAAM,QAAQ,EAAA,GAACA,cAAAA,OAAAA,CAAO,GAAG,cAAc,KAAK,IACxC,MAAM,KAAK,GAAG,cAAc,KAAK,IACjC,KAAA;EAEJ,UAAU,OAAO,SAAS,QAAQ,KAAA,CAAS;CAC7C,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,iBAAiB,aAAgC;EACrD,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACH,UAAU,CAAC;EACX,WAAW,YAAY,CAAC;EACxB,cAAc;EACd,UAAA,GAASC,cAAAA,WAAAA,CAAW,aAAa,OAAO;CAC1C,CAAC;CAED,UAAU,UAAU,OAAO;CAE3B,MAAM,gBAAqC,aACxC,QAAQ,CAAC,MACR,WACE;EACE,GAAG;EACH,GAAG;EACH,GAAG;EACH;EACA,KAAK;EACL;EACA,MAAM;EACN;EACA;EACA;EACA;EACA;EACA;CACF,GACA,OACA;EAAE;EAAK;CAAS,CAClB,CAAC,CAAC,GACJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAyBA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA,eA9BgC,aAC/B,QAAQ,CAAC,MAAM;GACd,MAAM,YAAA,GACJC,cAAAA,IAAAA,CAAI,OAAO,CAAC,cAAc,iBAAiB,GAAG,EAAE,QAAQ,KAAK,CAAC,MAAA,GAC9DA,cAAAA,IAAAA,CAAI,gBAAgB,CAAC,cAAc,iBAAiB,GAAG,EAAE,QAAQ,KAAK,CAAC;GACzE,MAAM,iBAAiB,CAAC,CAAC,aAAa,KAAK;GAC3C,MAAM,YAAY,CAAC,CAAC;GAEpB,OAAO,WACL;IACE,qBAAA,GAAoBC,cAAAA,SAAAA,CAAS,CAAC,KAAK;IACnC,GAAG;IACH,mBACE,eAAe,uBACd,CAAC,YAAY,CAAC,kBAAkB,CAAC,YAAY,UAAU,KAAA;IAC1D,UAAU,cAAc,IAAI,eAAe;GAC7C,GACA,KACF,CAAC,CAAC;EACJ,GACA;GAAC;GAAgB;GAAO;GAAa;GAAS;EAAW,CAU7C;EACZ;CACF;AACF"}
|
|
@@ -13,7 +13,10 @@ const [RadioGroupContext, useRadioGroupContext] = createContext$1({
|
|
|
13
13
|
});
|
|
14
14
|
const useRadioGroup = (props = {}) => {
|
|
15
15
|
const uuid = useId();
|
|
16
|
-
const { context: { labelId } = {}, props: { id = uuid, defaultValue, disabled, readOnly, required, value: valueProp, onChange: onChangeProp, ...rest }, ariaProps: { "aria-describedby": ariaDescribedby, ...ariaProps }, dataProps, eventProps } = useFieldProps(
|
|
16
|
+
const { context: { labelId } = {}, props: { id = uuid, defaultValue, disabled, readOnly, required, value: valueProp, onChange: onChangeProp, ...rest }, ariaProps: { "aria-describedby": ariaDescribedby, ...ariaProps }, dataProps, eventProps } = useFieldProps({
|
|
17
|
+
...props,
|
|
18
|
+
notSupportReadOnly: true
|
|
19
|
+
});
|
|
17
20
|
const interactive = !(readOnly || disabled);
|
|
18
21
|
const [value, setValue] = useControllableState({
|
|
19
22
|
defaultValue,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-radio-group.js","names":["createContext","isObject","isUndefined","dataAttr"],"sources":["../../../../src/components/radio/use-radio-group.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n createContext,\n dataAttr,\n isObject,\n isUndefined,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface RadioGroupContext extends Omit<UseRadioGroupReturn, \"getRootProps\"> {}\n\nconst [RadioGroupContext, useRadioGroupContext] =\n createContext<RadioGroupContext>({\n name: \"RadioGroupContext\",\n strict: false,\n })\n\nexport { RadioGroupContext, useRadioGroupContext }\n\nexport interface UseRadioGroupProps<Y extends string = string>\n extends Omit<HTMLProps, \"defaultValue\" | \"onChange\" | \"value\">, FieldProps {\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <Y extends string = string>(\n props: UseRadioGroupProps<Y> = {},\n) => {\n const uuid = useId()\n const {\n context: { labelId } = {},\n props: {\n id = uuid,\n defaultValue,\n disabled,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedby, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const interactive = !(readOnly || disabled)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (valueOrEv: ChangeEvent<HTMLInputElement> | Y) => {\n if (!interactive) return\n\n if (isObject(valueOrEv)) setValue(valueOrEv.target.value as Y)\n else setValue(valueOrEv)\n },\n [interactive, setValue],\n )\n\n const getRootProps: PropGetter = useCallback(\n (props = {}) =>\n mergeProps(\n dataProps,\n {\n id,\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": labelId,\n role: \"radiogroup\",\n },\n rest,\n props,\n )(),\n [ariaDescribedby, dataProps, id, labelId, rest],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => {\n const checked = !isUndefined(value) && value === props.value\n\n return mergeProps(\n {\n ...dataProps,\n ...ariaProps,\n type: \"radio\",\n name: id,\n style: visuallyHiddenAttributes.style,\n \"aria-checked\": checked,\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n },\n props,\n { onChange, ...eventProps },\n )()\n },\n [\n ariaProps,\n dataProps,\n disabled,\n eventProps,\n id,\n onChange,\n readOnly,\n required,\n value,\n ],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n (props) => ({\n ...dataProps,\n ...props,\n }),\n [dataProps],\n )\n\n return {\n name: id,\n value,\n getInputProps,\n getLabelProps,\n getRootProps,\n onChange,\n }\n}\n\nexport type UseRadioGroupReturn = ReturnType<typeof useRadioGroup>\n"],"mappings":";;;;;;;;;AAmBA,MAAM,CAAC,mBAAmB,wBACxBA,gBAAiC;CAC/B,MAAM;CACN,QAAQ;AACV,CAAC;AAoBH,MAAa,iBACX,QAA+B,CAAC,MAC7B;CACH,MAAM,OAAO,MAAM;CACnB,MAAM,EACJ,SAAS,EAAE,YAAY,CAAC,GACxB,OAAO,EACL,KAAK,MACL,cACA,UACA,UACA,UACA,OAAO,WACP,UAAU,cACV,GAAG,QAEL,WAAW,EAAE,oBAAoB,iBAAiB,GAAG,aACrD,WACA,eACE,cAAc,
|
|
1
|
+
{"version":3,"file":"use-radio-group.js","names":["createContext","isObject","isUndefined","dataAttr"],"sources":["../../../../src/components/radio/use-radio-group.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n createContext,\n dataAttr,\n isObject,\n isUndefined,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface RadioGroupContext extends Omit<UseRadioGroupReturn, \"getRootProps\"> {}\n\nconst [RadioGroupContext, useRadioGroupContext] =\n createContext<RadioGroupContext>({\n name: \"RadioGroupContext\",\n strict: false,\n })\n\nexport { RadioGroupContext, useRadioGroupContext }\n\nexport interface UseRadioGroupProps<Y extends string = string>\n extends Omit<HTMLProps, \"defaultValue\" | \"onChange\" | \"value\">, FieldProps {\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <Y extends string = string>(\n props: UseRadioGroupProps<Y> = {},\n) => {\n const uuid = useId()\n const {\n context: { labelId } = {},\n props: {\n id = uuid,\n defaultValue,\n disabled,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedby, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps({\n ...props,\n notSupportReadOnly: true,\n })\n const interactive = !(readOnly || disabled)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (valueOrEv: ChangeEvent<HTMLInputElement> | Y) => {\n if (!interactive) return\n\n if (isObject(valueOrEv)) setValue(valueOrEv.target.value as Y)\n else setValue(valueOrEv)\n },\n [interactive, setValue],\n )\n\n const getRootProps: PropGetter = useCallback(\n (props = {}) =>\n mergeProps(\n dataProps,\n {\n id,\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": labelId,\n role: \"radiogroup\",\n },\n rest,\n props,\n )(),\n [ariaDescribedby, dataProps, id, labelId, rest],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => {\n const checked = !isUndefined(value) && value === props.value\n\n return mergeProps(\n {\n ...dataProps,\n ...ariaProps,\n type: \"radio\",\n name: id,\n style: visuallyHiddenAttributes.style,\n \"aria-checked\": checked,\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n },\n props,\n { onChange, ...eventProps },\n )()\n },\n [\n ariaProps,\n dataProps,\n disabled,\n eventProps,\n id,\n onChange,\n readOnly,\n required,\n value,\n ],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n (props) => ({\n ...dataProps,\n ...props,\n }),\n [dataProps],\n )\n\n return {\n name: id,\n value,\n getInputProps,\n getLabelProps,\n getRootProps,\n onChange,\n }\n}\n\nexport type UseRadioGroupReturn = ReturnType<typeof useRadioGroup>\n"],"mappings":";;;;;;;;;AAmBA,MAAM,CAAC,mBAAmB,wBACxBA,gBAAiC;CAC/B,MAAM;CACN,QAAQ;AACV,CAAC;AAoBH,MAAa,iBACX,QAA+B,CAAC,MAC7B;CACH,MAAM,OAAO,MAAM;CACnB,MAAM,EACJ,SAAS,EAAE,YAAY,CAAC,GACxB,OAAO,EACL,KAAK,MACL,cACA,UACA,UACA,UACA,OAAO,WACP,UAAU,cACV,GAAG,QAEL,WAAW,EAAE,oBAAoB,iBAAiB,GAAG,aACrD,WACA,eACE,cAAc;EAChB,GAAG;EACH,oBAAoB;CACtB,CAAC;CACD,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,CAAC,OAAO,YAAY,qBAAqB;EAC7C;EACA,OAAO;EACP,UAAU;CACZ,CAAC;CAED,MAAM,WAAW,aACd,cAAiD;EAChD,IAAI,CAAC,aAAa;EAElB,KAAA,GAAIC,cAAAA,SAAAA,CAAS,SAAS,GAAG,SAAS,UAAU,OAAO,KAAU;OACxD,SAAS,SAAS;CACzB,GACA,CAAC,aAAa,QAAQ,CACxB;CAEA,MAAM,eAA2B,aAC9B,QAAQ,CAAC,MACR,WACE,WACA;EACE;EACA,oBAAoB;EACpB,mBAAmB;EACnB,MAAM;CACR,GACA,MACA,KACF,CAAC,CAAC,GACJ;EAAC;EAAiB;EAAW;EAAI;EAAS;CAAI,CAChD;CA6CA,OAAO;EACL,MAAM;EACN;EACA,eA9CyC,aACxC,QAAQ,CAAC,MAAM;GACd,MAAM,UAAU,EAAA,GAACC,cAAAA,YAAAA,CAAY,KAAK,KAAK,UAAU,MAAM;GAEvD,OAAO,WACL;IACE,GAAG;IACH,GAAG;IACH,MAAM;IACN,MAAM;IACN,OAAO,yBAAyB;IAChC,gBAAgB;IAChB,iBAAA,GAAgBC,cAAAA,SAAAA,CAAS,OAAO;IAChC;IACA;IACA;IACA;GACF,GACA,OACA;IAAE;IAAU,GAAG;GAAW,CAC5B,CAAC,CAAC;EACJ,GACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAcY;EACZ,eAZyC,aACxC,WAAW;GACV,GAAG;GACH,GAAG;EACL,IACA,CAAC,SAAS,CAOE;EACZ;EACA;CACF;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../src/utils/index.ts"],"sourcesContent":["export * from \"./children\"\nexport * from \"./context\"\nexport * from \"./dom\"\nexport * from \"./effect\"\nexport type * from \"./index.type\"\nexport * from \"./ref\"\nexport * from \"./ssr\"\nexport * from \"./store\"\nexport * from \"@yamada-ui/utils\"\nexport type {\n AnyPointerEvent,\n AnyString,\n Booleanish,\n ColorFormat,\n DeepMerge,\n DeepPartial,\n Dict,\n EventType,\n FlattenObjectOptions,\n FunctionOf,\n FunctionOrValue,\n Length,\n Merge,\n MergeOptions,\n Path,\n Point,\n Prettify,\n Primitive,\n Value,\n} from \"@yamada-ui/utils\"\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/utils/index.ts"],"sourcesContent":["export * from \"./children\"\nexport * from \"./context\"\nexport * from \"./dom\"\nexport * from \"./effect\"\nexport type * from \"./index.type\"\nexport * from \"./ref\"\nexport * from \"./ssr\"\nexport * from \"./store\"\nexport * from \"@yamada-ui/utils\"\nexport type {\n AnyPointerEvent,\n AnyString,\n Booleanish,\n ColorFormat,\n DeepMerge,\n DeepPartial,\n Dict,\n EventType,\n FlattenObjectOptions,\n FunctionOf,\n FunctionOrValue,\n HasOptions,\n Length,\n Merge,\n MergeOptions,\n Path,\n Point,\n Prettify,\n Primitive,\n Value,\n} from \"@yamada-ui/utils\"\n"],"mappings":""}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ComponentSlotStyle } from "../../core/system/index.type.js";
|
|
2
2
|
import { CSSModifierObject, CSSSlotObject } from "../../core/css/index.type.js";
|
|
3
3
|
import "../../index.js";
|
|
4
|
-
export declare const calendarStyle: ComponentSlotStyle<"button" | "select" | "cell" | "navigation" | "row" | "separator" | "next" | "root" | "month" | "week" | "
|
|
4
|
+
export declare const calendarStyle: ComponentSlotStyle<"button" | "select" | "cell" | "navigation" | "row" | "separator" | "next" | "root" | "month" | "week" | "weekday" | "day" | "months" | "years" | "weeks" | "control" | "prev", {
|
|
5
5
|
/**
|
|
6
6
|
* If `true`, the calendar will be fixed rows.
|
|
7
7
|
*
|
|
@@ -73,6 +73,6 @@ export declare const calendarStyle: ComponentSlotStyle<"button" | "select" | "ce
|
|
|
73
73
|
"--font-size": "fontSizes.xl";
|
|
74
74
|
};
|
|
75
75
|
};
|
|
76
|
-
}, CSSModifierObject<CSSSlotObject<"button" | "select" | "cell" | "navigation" | "row" | "separator" | "next" | "root" | "month" | "week" | "
|
|
76
|
+
}, CSSModifierObject<CSSSlotObject<"button" | "select" | "cell" | "navigation" | "row" | "separator" | "next" | "root" | "month" | "week" | "weekday" | "day" | "months" | "years" | "weeks" | "control" | "prev">>>;
|
|
77
77
|
export type CalendarStyle = typeof calendarStyle;
|
|
78
78
|
//# sourceMappingURL=calendar.style.d.ts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ComponentSlotStyle } from "../../core/system/index.type.js";
|
|
2
2
|
import { CSSModifierObject, CSSPropObject, CSSSlotObject } from "../../core/css/index.type.js";
|
|
3
3
|
import "../../index.js";
|
|
4
|
-
export declare const carouselStyle: ComponentSlotStyle<"list" | "next" | "root" | "
|
|
4
|
+
export declare const carouselStyle: ComponentSlotStyle<"list" | "next" | "root" | "item" | "indicator" | "trigger" | "prev" | "indicators", CSSPropObject<CSSSlotObject<"list" | "next" | "root" | "item" | "indicator" | "trigger" | "prev" | "indicators">>, {
|
|
5
5
|
sm: {
|
|
6
6
|
root: {
|
|
7
7
|
h: "sm";
|
|
@@ -17,6 +17,6 @@ export declare const carouselStyle: ComponentSlotStyle<"list" | "next" | "root"
|
|
|
17
17
|
h: "lg";
|
|
18
18
|
};
|
|
19
19
|
};
|
|
20
|
-
}, CSSModifierObject<CSSSlotObject<"list" | "next" | "root" | "
|
|
20
|
+
}, CSSModifierObject<CSSSlotObject<"list" | "next" | "root" | "item" | "indicator" | "trigger" | "prev" | "indicators">>>;
|
|
21
21
|
export type CarouselStyle = typeof carouselStyle;
|
|
22
22
|
//# sourceMappingURL=carousel.style.d.ts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ComponentSlotStyle } from "../../core/system/index.type.js";
|
|
2
2
|
import { CSSModifierObject, CSSPropObject, CSSSlotObject } from "../../core/css/index.type.js";
|
|
3
3
|
import "../../index.js";
|
|
4
|
-
export declare const cartesianChartStyle: ComponentSlotStyle<"area" | "line" | "grid" | "bar" | "dot" | "root" | "
|
|
4
|
+
export declare const cartesianChartStyle: ComponentSlotStyle<"area" | "line" | "grid" | "bar" | "dot" | "root" | "labelList" | "activeDot" | "referenceLine" | "referenceLineLabel" | "xAxis" | "xAxisLabel" | "xAxisTick" | "xAxisTickLine" | "yAxis" | "yAxisLabel" | "yAxisTick" | "yAxisTickLine", CSSPropObject<CSSSlotObject<"area" | "line" | "grid" | "bar" | "dot" | "root" | "labelList" | "activeDot" | "referenceLine" | "referenceLineLabel" | "xAxis" | "xAxisLabel" | "xAxisTick" | "xAxisTickLine" | "yAxis" | "yAxisLabel" | "yAxisTick" | "yAxisTickLine">>, CSSModifierObject<CSSSlotObject<"area" | "line" | "grid" | "bar" | "dot" | "root" | "labelList" | "activeDot" | "referenceLine" | "referenceLineLabel" | "xAxis" | "xAxisLabel" | "xAxisTick" | "xAxisTickLine" | "yAxis" | "yAxisLabel" | "yAxisTick" | "yAxisTickLine">>, CSSModifierObject<CSSSlotObject<"area" | "line" | "grid" | "bar" | "dot" | "root" | "labelList" | "activeDot" | "referenceLine" | "referenceLineLabel" | "xAxis" | "xAxisLabel" | "xAxisTick" | "xAxisTickLine" | "yAxis" | "yAxisLabel" | "yAxisTick" | "yAxisTickLine">>>;
|
|
5
5
|
export type CartesianChartStyle = typeof cartesianChartStyle;
|
|
6
6
|
//# sourceMappingURL=cartesian-chart.style.d.ts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ComponentSlotStyle } from "../../core/system/index.type.js";
|
|
2
2
|
import { CSSModifierObject, CSSPropObject, CSSSlotObject } from "../../core/css/index.type.js";
|
|
3
3
|
import "../../index.js";
|
|
4
|
-
export declare const polarChartStyle: ComponentSlotStyle<"label" | "grid" | "dot" | "root" | "
|
|
4
|
+
export declare const polarChartStyle: ComponentSlotStyle<"label" | "grid" | "dot" | "root" | "labelList" | "radial" | "labelLine" | "activeDot" | "angleAxis" | "angleAxisLabel" | "angleAxisLine" | "angleAxisTick" | "angleAxisTickLine" | "pie" | "radar" | "radialBackground" | "radiusAxis" | "radiusAxisLabel" | "radiusAxisLine" | "radiusAxisTick" | "radiusAxisTickLine" | "sector", CSSPropObject<CSSSlotObject<"label" | "grid" | "dot" | "root" | "labelList" | "radial" | "labelLine" | "activeDot" | "angleAxis" | "angleAxisLabel" | "angleAxisLine" | "angleAxisTick" | "angleAxisTickLine" | "pie" | "radar" | "radialBackground" | "radiusAxis" | "radiusAxisLabel" | "radiusAxisLine" | "radiusAxisTick" | "radiusAxisTickLine" | "sector">>, CSSModifierObject<CSSSlotObject<"label" | "grid" | "dot" | "root" | "labelList" | "radial" | "labelLine" | "activeDot" | "angleAxis" | "angleAxisLabel" | "angleAxisLine" | "angleAxisTick" | "angleAxisTickLine" | "pie" | "radar" | "radialBackground" | "radiusAxis" | "radiusAxisLabel" | "radiusAxisLine" | "radiusAxisTick" | "radiusAxisTickLine" | "sector">>, CSSModifierObject<CSSSlotObject<"label" | "grid" | "dot" | "root" | "labelList" | "radial" | "labelLine" | "activeDot" | "angleAxis" | "angleAxisLabel" | "angleAxisLine" | "angleAxisTick" | "angleAxisTickLine" | "pie" | "radar" | "radialBackground" | "radiusAxis" | "radiusAxisLabel" | "radiusAxisLine" | "radiusAxisTick" | "radiusAxisTickLine" | "sector">>>;
|
|
5
5
|
export type PolarChartStyle = typeof polarChartStyle;
|
|
6
6
|
//# sourceMappingURL=polar-chart.style.d.ts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ComponentSlotStyle } from "../../core/system/index.type.js";
|
|
2
2
|
import { CSSModifierObject, CSSSlotObject } from "../../core/css/index.type.js";
|
|
3
3
|
import "../../index.js";
|
|
4
|
-
export declare const fieldStyle: ComponentSlotStyle<"label" | "root" | "
|
|
4
|
+
export declare const fieldStyle: ComponentSlotStyle<"label" | "root" | "errorMessage" | "helperMessage" | "requiredIndicator", {
|
|
5
5
|
/**
|
|
6
6
|
* The orientation of the field.
|
|
7
7
|
*/
|
|
@@ -35,6 +35,6 @@ export declare const fieldStyle: ComponentSlotStyle<"label" | "root" | "helperMe
|
|
|
35
35
|
};
|
|
36
36
|
};
|
|
37
37
|
};
|
|
38
|
-
}, CSSModifierObject<CSSSlotObject<"label" | "root" | "
|
|
38
|
+
}, CSSModifierObject<CSSSlotObject<"label" | "root" | "errorMessage" | "helperMessage" | "requiredIndicator">>, CSSModifierObject<CSSSlotObject<"label" | "root" | "errorMessage" | "helperMessage" | "requiredIndicator">>>;
|
|
39
39
|
export type FieldStyle = typeof fieldStyle;
|
|
40
40
|
//# sourceMappingURL=field.style.d.ts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ComponentSlotStyle } from "../../core/system/index.type.js";
|
|
2
2
|
import { CSSPropObject, CSSSlotObject } from "../../core/css/index.type.js";
|
|
3
3
|
import "../../index.js";
|
|
4
|
-
export declare const fieldsetStyle: ComponentSlotStyle<"header" | "legend" | "content" | "root" | "
|
|
4
|
+
export declare const fieldsetStyle: ComponentSlotStyle<"header" | "legend" | "content" | "root" | "errorMessage" | "helperMessage", CSSPropObject<CSSSlotObject<"header" | "legend" | "content" | "root" | "errorMessage" | "helperMessage">>, {
|
|
5
5
|
sm: {
|
|
6
6
|
content: {
|
|
7
7
|
gap: "3";
|
|
@@ -6,7 +6,7 @@ import "../field/index.js";
|
|
|
6
6
|
import { UseClickableProps } from "../../hooks/use-clickable/index.js";
|
|
7
7
|
import "../../index.js";
|
|
8
8
|
import { RefObject } from "react";
|
|
9
|
-
export type UseFileInputProps<Y extends "button" | "input" = "input"> = FieldProps & Omit<HTMLProps<Y>, "defaultValue" | "onChange" | "ref" | "value"> & Pick<HTMLProps<"input">, "accept" | "multiple" | "ref"> & {
|
|
9
|
+
export type UseFileInputProps<Y extends "button" | "input" = "input"> = FieldProps & Omit<HTMLProps<Y>, "defaultValue" | "onChange" | "ref" | "value"> & Pick<HTMLProps<"input">, "accept" | "multiple" | "placeholder" | "ref"> & {
|
|
10
10
|
/**
|
|
11
11
|
* The initial value of the file input.
|
|
12
12
|
*/
|