@yamada-ui/input 1.0.42-dev-20240915031944 → 1.0.42-dev-20240917033401
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/chunk-3AEWRGHP.mjs +76 -0
- package/dist/chunk-3AEWRGHP.mjs.map +1 -0
- package/dist/chunk-ITQBVWTU.mjs +71 -0
- package/dist/chunk-ITQBVWTU.mjs.map +1 -0
- package/dist/chunk-OYJRHTQL.mjs +76 -0
- package/dist/chunk-OYJRHTQL.mjs.map +1 -0
- package/dist/{chunk-PFAPK5JD.mjs → chunk-ZARK2Q4J.mjs} +3 -3
- package/dist/chunk-ZARK2Q4J.mjs.map +1 -0
- package/dist/chunk-ZNGNHH5S.mjs +14 -0
- package/dist/chunk-ZNGNHH5S.mjs.map +1 -0
- package/dist/index.js +73 -66
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +9 -4
- package/dist/input-addon.d.mts +4 -3
- package/dist/input-addon.d.ts +4 -3
- package/dist/input-addon.js +14 -147
- package/dist/input-addon.js.map +1 -1
- package/dist/input-addon.mjs +2 -2
- package/dist/input-context.d.mts +10 -0
- package/dist/input-context.d.ts +10 -0
- package/dist/input-context.js +38 -0
- package/dist/input-context.js.map +1 -0
- package/dist/input-context.mjs +10 -0
- package/dist/input-context.mjs.map +1 -0
- package/dist/input-element.d.mts +4 -3
- package/dist/input-element.d.ts +4 -3
- package/dist/input-element.js +14 -152
- package/dist/input-element.js.map +1 -1
- package/dist/input-element.mjs +2 -2
- package/dist/input-group.d.mts +4 -6
- package/dist/input-group.d.ts +4 -6
- package/dist/input-group.js +24 -21
- package/dist/input-group.js.map +1 -1
- package/dist/input-group.mjs +7 -6
- package/dist/input.d.mts +4 -3
- package/dist/input.d.ts +4 -3
- package/dist/input.js +1 -1
- package/dist/input.js.map +1 -1
- package/dist/input.mjs +1 -1
- package/package.json +6 -6
- package/dist/chunk-OCJVHG24.mjs +0 -208
- package/dist/chunk-OCJVHG24.mjs.map +0 -1
- package/dist/chunk-PFAPK5JD.mjs.map +0 -1
package/dist/input-addon.d.ts
CHANGED
@@ -1,15 +1,16 @@
|
|
1
1
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
2
2
|
import { HTMLUIProps } from '@yamada-ui/core';
|
3
3
|
|
4
|
-
|
4
|
+
interface InputAddonOptions {
|
5
5
|
/**
|
6
6
|
* The placement of the element.
|
7
7
|
*
|
8
8
|
* @default 'left'
|
9
9
|
*/
|
10
10
|
placement?: "left" | "right";
|
11
|
-
}
|
12
|
-
|
11
|
+
}
|
12
|
+
interface InputAddonProps extends HTMLUIProps, InputAddonOptions {
|
13
|
+
}
|
13
14
|
declare const InputLeftAddon: _yamada_ui_core.Component<"div", InputAddonProps>;
|
14
15
|
declare const InputRightAddon: _yamada_ui_core.Component<"div", InputAddonProps>;
|
15
16
|
|
package/dist/input-addon.js
CHANGED
@@ -25,152 +25,19 @@ __export(input_addon_exports, {
|
|
25
25
|
InputRightAddon: () => InputRightAddon
|
26
26
|
});
|
27
27
|
module.exports = __toCommonJS(input_addon_exports);
|
28
|
-
var import_core4 = require("@yamada-ui/core");
|
29
|
-
var import_utils4 = require("@yamada-ui/utils");
|
30
|
-
|
31
|
-
// src/input-group.tsx
|
32
|
-
var import_core3 = require("@yamada-ui/core");
|
33
|
-
var import_file_input = require("@yamada-ui/file-input");
|
34
|
-
var import_use_token = require("@yamada-ui/use-token");
|
35
|
-
var import_utils3 = require("@yamada-ui/utils");
|
36
|
-
var import_react = require("react");
|
37
|
-
|
38
|
-
// src/input.tsx
|
39
28
|
var import_core = require("@yamada-ui/core");
|
40
|
-
var import_form_control = require("@yamada-ui/form-control");
|
41
|
-
var import_utils = require("@yamada-ui/utils");
|
42
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
43
|
-
var Input = (0, import_core.forwardRef)((props, ref) => {
|
44
|
-
const [styles, mergedProps] = (0, import_core.useMultiComponentStyle)("Input", props);
|
45
|
-
let { className, htmlSize, __css, ...rest } = (0, import_core.omitThemeProps)(mergedProps);
|
46
|
-
rest = (0, import_form_control.useFormControlProps)(rest);
|
47
|
-
const css = { ...styles.field, ...__css };
|
48
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
49
|
-
import_core.ui.input,
|
50
|
-
{
|
51
|
-
ref,
|
52
|
-
className: (0, import_utils.cx)("ui-input", className),
|
53
|
-
size: htmlSize,
|
54
|
-
__css: css,
|
55
|
-
...rest
|
56
|
-
}
|
57
|
-
);
|
58
|
-
});
|
59
|
-
|
60
|
-
// src/input-element.tsx
|
61
|
-
var import_core2 = require("@yamada-ui/core");
|
62
29
|
var import_utils2 = require("@yamada-ui/utils");
|
63
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
64
|
-
var InputElement = (0, import_core2.forwardRef)(
|
65
|
-
({ className, isClick = false, placement = "left", ...rest }, ref) => {
|
66
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
67
|
-
const styles = useInputGroup();
|
68
|
-
const css = {
|
69
|
-
position: "absolute",
|
70
|
-
top: "0",
|
71
|
-
[placement === "left" ? "insetStart" : "insetEnd"]: "0",
|
72
|
-
zIndex: "fallback(kurillin, 9)",
|
73
|
-
display: "flex",
|
74
|
-
alignItems: "center",
|
75
|
-
justifyContent: "center",
|
76
|
-
w: (_g = (_e = (_c = (_a = styles.field) == null ? void 0 : _a.height) != null ? _c : (_b = styles.field) == null ? void 0 : _b.h) != null ? _e : (_d = styles.field) == null ? void 0 : _d.minHeight) != null ? _g : (_f = styles.field) == null ? void 0 : _f.minH,
|
77
|
-
h: "100%",
|
78
|
-
fontSize: (_h = styles.field) == null ? void 0 : _h.fontSize,
|
79
|
-
pointerEvents: isClick ? "auto" : "none",
|
80
|
-
cursor: isClick ? "pointer" : "auto",
|
81
|
-
...styles.element
|
82
|
-
};
|
83
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
84
|
-
import_core2.ui.div,
|
85
|
-
{
|
86
|
-
ref,
|
87
|
-
className: (0, import_utils2.cx)("ui-input__element", className),
|
88
|
-
__css: css,
|
89
|
-
...rest
|
90
|
-
}
|
91
|
-
);
|
92
|
-
}
|
93
|
-
);
|
94
|
-
var InputLeftElement = (0, import_core2.forwardRef)(
|
95
|
-
({ className, ...rest }, ref) => {
|
96
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
97
|
-
InputElement,
|
98
|
-
{
|
99
|
-
ref,
|
100
|
-
className: (0, import_utils2.cx)("ui-input__element--left", className),
|
101
|
-
placement: "left",
|
102
|
-
...rest
|
103
|
-
}
|
104
|
-
);
|
105
|
-
}
|
106
|
-
);
|
107
|
-
var InputRightElement = (0, import_core2.forwardRef)(
|
108
|
-
({ className, ...rest }, ref) => {
|
109
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
110
|
-
InputElement,
|
111
|
-
{
|
112
|
-
ref,
|
113
|
-
className: (0, import_utils2.cx)("ui-input__element--right", className),
|
114
|
-
placement: "right",
|
115
|
-
...rest
|
116
|
-
}
|
117
|
-
);
|
118
|
-
}
|
119
|
-
);
|
120
30
|
|
121
|
-
// src/input-
|
122
|
-
var
|
123
|
-
var [InputGroupProvider, useInputGroup] = (0,
|
31
|
+
// src/input-context.tsx
|
32
|
+
var import_utils = require("@yamada-ui/utils");
|
33
|
+
var [InputGroupProvider, useInputGroup] = (0, import_utils.createContext)({
|
124
34
|
name: "InputGroupContext",
|
125
35
|
errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in "<InputGroup />" `
|
126
36
|
});
|
127
|
-
var InputGroup = (0, import_core3.forwardRef)((props, ref) => {
|
128
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
129
|
-
const [styles] = (0, import_core3.useMultiComponentStyle)("Input", props);
|
130
|
-
const { className, children, ...rest } = (0, import_core3.omitThemeProps)(props);
|
131
|
-
const css = {
|
132
|
-
width: "100%",
|
133
|
-
display: "flex",
|
134
|
-
position: "relative",
|
135
|
-
...styles.container
|
136
|
-
};
|
137
|
-
const groupProps = {};
|
138
|
-
const minHeight = (_g = (_e = (0, import_use_token.useToken)("sizes", (_c = (_a = styles.field) == null ? void 0 : _a.minHeight) != null ? _c : (_b = styles.field) == null ? void 0 : _b.minH)) != null ? _e : (_d = styles.field) == null ? void 0 : _d.minHeight) != null ? _g : (_f = styles.field) == null ? void 0 : _f.minH;
|
139
|
-
const height = (_n = (_l = (0, import_use_token.useToken)("sizes", (_j = (_h = styles.field) == null ? void 0 : _h.height) != null ? _j : (_i = styles.field) == null ? void 0 : _i.h)) != null ? _l : (_k = styles.field) == null ? void 0 : _k.height) != null ? _n : (_m = styles.field) == null ? void 0 : _m.h;
|
140
|
-
const validChildren = (0, import_utils3.getValidChildren)(children);
|
141
|
-
validChildren.forEach((child) => {
|
142
|
-
if ((minHeight || height) && child.type === InputLeftElement)
|
143
|
-
groupProps.paddingStart = height != null ? height : minHeight;
|
144
|
-
if ((minHeight || height) && child.type === InputRightElement)
|
145
|
-
groupProps.paddingEnd = height != null ? height : minHeight;
|
146
|
-
if (child.type === InputLeftAddon) groupProps.roundedLeft = 0;
|
147
|
-
if (child.type === InputRightAddon) groupProps.roundedRight = 0;
|
148
|
-
});
|
149
|
-
const cloneChildren = validChildren.map((child) => {
|
150
|
-
var _a2, _b2;
|
151
|
-
const childProps = (0, import_utils3.filterUndefined)({
|
152
|
-
size: ((_a2 = child.props) == null ? void 0 : _a2.size) || props.size,
|
153
|
-
variant: ((_b2 = child.props) == null ? void 0 : _b2.variant) || props.variant,
|
154
|
-
...child.props
|
155
|
-
});
|
156
|
-
return child.type !== Input && child.type !== import_file_input.FileInput ? (0, import_react.cloneElement)(child, childProps) : (0, import_react.cloneElement)(child, Object.assign(childProps, groupProps));
|
157
|
-
});
|
158
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(InputGroupProvider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
159
|
-
import_core3.ui.div,
|
160
|
-
{
|
161
|
-
ref,
|
162
|
-
className: (0, import_utils3.cx)("ui-input-group", className),
|
163
|
-
role: "group",
|
164
|
-
__css: css,
|
165
|
-
...rest,
|
166
|
-
children: cloneChildren
|
167
|
-
}
|
168
|
-
) });
|
169
|
-
});
|
170
37
|
|
171
38
|
// src/input-addon.tsx
|
172
|
-
var
|
173
|
-
var InputAddon = (0,
|
39
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
40
|
+
var InputAddon = (0, import_core.forwardRef)(
|
174
41
|
({ className, placement = "left", ...rest }, ref) => {
|
175
42
|
const styles = useInputGroup();
|
176
43
|
const placementStyles = {
|
@@ -194,37 +61,37 @@ var InputAddon = (0, import_core4.forwardRef)(
|
|
194
61
|
...styles.addon,
|
195
62
|
...placementStyles[placement]
|
196
63
|
};
|
197
|
-
return /* @__PURE__ */ (0,
|
198
|
-
|
64
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
65
|
+
import_core.ui.div,
|
199
66
|
{
|
200
67
|
ref,
|
201
|
-
className: (0,
|
68
|
+
className: (0, import_utils2.cx)("ui-input__addon", className),
|
202
69
|
__css: css,
|
203
70
|
...rest
|
204
71
|
}
|
205
72
|
);
|
206
73
|
}
|
207
74
|
);
|
208
|
-
var InputLeftAddon = (0,
|
75
|
+
var InputLeftAddon = (0, import_core.forwardRef)(
|
209
76
|
({ className, ...rest }, ref) => {
|
210
|
-
return /* @__PURE__ */ (0,
|
77
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
211
78
|
InputAddon,
|
212
79
|
{
|
213
80
|
ref,
|
214
|
-
className: (0,
|
81
|
+
className: (0, import_utils2.cx)("ui-input__addon--left", className),
|
215
82
|
placement: "left",
|
216
83
|
...rest
|
217
84
|
}
|
218
85
|
);
|
219
86
|
}
|
220
87
|
);
|
221
|
-
var InputRightAddon = (0,
|
88
|
+
var InputRightAddon = (0, import_core.forwardRef)(
|
222
89
|
({ className, ...rest }, ref) => {
|
223
|
-
return /* @__PURE__ */ (0,
|
90
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
224
91
|
InputAddon,
|
225
92
|
{
|
226
93
|
ref,
|
227
|
-
className: (0,
|
94
|
+
className: (0, import_utils2.cx)("ui-input__addon--right", className),
|
228
95
|
placement: "right",
|
229
96
|
...rest
|
230
97
|
}
|
package/dist/input-addon.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/input-addon.tsx","../src/input-group.tsx","../src/input.tsx","../src/input-element.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useInputGroup } from \"./input-group\"\n\ntype InputAddonOptions = {\n /**\n * The placement of the element.\n *\n * @default 'left'\n */\n placement?: \"left\" | \"right\"\n}\n\nexport type InputAddonProps = HTMLUIProps<\"div\"> & InputAddonOptions\n\nconst InputAddon = forwardRef<InputAddonProps, \"div\">(\n ({ className, placement = \"left\", ...rest }, ref) => {\n const styles = useInputGroup()\n\n const placementStyles = {\n left: {\n me: \"-1px\",\n roundedRight: 0,\n borderEndColor: \"transparent\",\n },\n right: {\n ms: \"-1px\",\n roundedLeft: 0,\n borderStartColor: \"transparent\",\n },\n }\n\n const css: CSSUIObject = {\n flex: \"0 0 auto\",\n w: \"auto\",\n display: \"flex\",\n alignItems: \"center\",\n whiteSpace: \"nowrap\",\n ...styles.addon,\n ...placementStyles[placement],\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-input__addon\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nexport const InputLeftAddon = forwardRef<InputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n return (\n <InputAddon\n ref={ref}\n className={cx(\"ui-input__addon--left\", className)}\n placement=\"left\"\n {...rest}\n />\n )\n },\n)\n\nexport const InputRightAddon = forwardRef<InputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n return (\n <InputAddon\n ref={ref}\n className={cx(\"ui-input__addon--right\", className)}\n placement=\"right\"\n {...rest}\n />\n )\n },\n)\n","import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n CSSUIProps,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useMultiComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport { FileInput } from \"@yamada-ui/file-input\"\nimport { useToken } from \"@yamada-ui/use-token\"\nimport {\n createContext,\n cx,\n filterUndefined,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\nimport {\n Input,\n InputRightElement,\n InputLeftElement,\n InputLeftAddon,\n InputRightAddon,\n} from \"./\"\n\nexport type InputGroupProps = HTMLUIProps<\"div\"> & ThemeProps<\"Input\">\n\ntype InputGroupContext = Record<string, CSSUIObject>\n\nconst [InputGroupProvider, useInputGroup] = createContext<InputGroupContext>({\n name: \"InputGroupContext\",\n errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in \"<InputGroup />\" `,\n})\n\nexport { useInputGroup }\n\nexport const InputGroup = forwardRef<InputGroupProps, \"div\">((props, ref) => {\n const [styles] = useMultiComponentStyle(\"Input\", props)\n const { className, children, ...rest } = omitThemeProps(props)\n\n const css: CSSUIObject = {\n width: \"100%\",\n display: \"flex\",\n position: \"relative\",\n ...styles.container,\n }\n const groupProps: CSSUIProps = {}\n const minHeight: any =\n useToken(\"sizes\", (styles.field?.minHeight ?? styles.field?.minH) as any) ??\n styles.field?.minHeight ??\n styles.field?.minH\n const height: any =\n useToken(\"sizes\", (styles.field?.height ?? styles.field?.h) as any) ??\n styles.field?.height ??\n styles.field?.h\n\n const validChildren = getValidChildren(children)\n\n validChildren.forEach((child: any) => {\n if ((minHeight || height) && child.type === InputLeftElement)\n groupProps.paddingStart = height ?? minHeight\n\n if ((minHeight || height) && child.type === InputRightElement)\n groupProps.paddingEnd = height ?? minHeight\n\n if (child.type === InputLeftAddon) groupProps.roundedLeft = 0\n\n if (child.type === InputRightAddon) groupProps.roundedRight = 0\n })\n\n const cloneChildren = validChildren.map((child) => {\n const childProps = filterUndefined({\n size: child.props?.size || props.size,\n variant: child.props?.variant || props.variant,\n ...child.props,\n })\n\n return child.type !== Input && child.type !== FileInput\n ? cloneElement(child, childProps)\n : cloneElement(child, Object.assign(childProps, groupProps))\n })\n\n return (\n <InputGroupProvider value={styles}>\n <ui.div\n ref={ref}\n className={cx(\"ui-input-group\", className)}\n role=\"group\"\n __css={css}\n {...rest}\n >\n {cloneChildren}\n </ui.div>\n </InputGroupProvider>\n )\n})\n","import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControlProps } from \"@yamada-ui/form-control\"\nimport { cx } from \"@yamada-ui/utils\"\n\ntype InputOptions = {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The native HTML `size` attribute to be passed to the `input`.\n */\n htmlSize?: number\n}\n\nexport type InputProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\"\n> &\n ThemeProps<\"Input\"> &\n InputOptions &\n FormControlOptions\n\n/**\n * `Input` is a component used to obtain text input from the user.\n *\n * @see Docs https://yamada-ui.com/components/forms/input\n */\nexport const Input = forwardRef<InputProps, \"input\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Input\", props)\n let { className, htmlSize, __css, ...rest } = omitThemeProps(mergedProps)\n\n rest = useFormControlProps(rest)\n\n const css: CSSUIObject = { ...styles.field, ...__css }\n\n return (\n <ui.input\n ref={ref}\n className={cx(\"ui-input\", className)}\n size={htmlSize}\n __css={css}\n {...rest}\n />\n )\n})\n","import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useInputGroup } from \"./input-group\"\n\ntype InputElementOptions = {\n /**\n * If `true`, the element clickable.\n *\n * @default false\n */\n isClick?: boolean\n /**\n * The placement of the element.\n *\n * @default 'left'\n */\n placement?: \"left\" | \"right\"\n}\n\nexport type InputElementProps = HTMLUIProps<\"div\"> & InputElementOptions\n\nconst InputElement = forwardRef<InputElementProps, \"div\">(\n ({ className, isClick = false, placement = \"left\", ...rest }, ref) => {\n const styles = useInputGroup()\n\n const css: CSSUIObject = {\n position: \"absolute\",\n top: \"0\",\n [placement === \"left\" ? \"insetStart\" : \"insetEnd\"]: \"0\",\n zIndex: \"fallback(kurillin, 9)\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n w:\n styles.field?.height ??\n styles.field?.h ??\n styles.field?.minHeight ??\n styles.field?.minH,\n h: \"100%\",\n fontSize: styles.field?.fontSize,\n pointerEvents: isClick ? \"auto\" : \"none\",\n cursor: isClick ? \"pointer\" : \"auto\",\n ...styles.element,\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-input__element\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nexport const InputLeftElement = forwardRef<InputElementProps, \"div\">(\n ({ className, ...rest }, ref) => {\n return (\n <InputElement\n ref={ref}\n className={cx(\"ui-input__element--left\", className)}\n placement=\"left\"\n {...rest}\n />\n )\n },\n)\n\nexport const InputRightElement = forwardRef<InputElementProps, \"div\">(\n ({ className, ...rest }, ref) => {\n return (\n <InputElement\n ref={ref}\n className={cx(\"ui-input__element--right\", className)}\n placement=\"right\"\n {...rest}\n />\n )\n },\n)\n"],"mappings":"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","names":["import_core","import_utils","import_core","import_utils","import_core","import_utils","import_jsx_runtime","import_jsx_runtime","_a","_b","import_jsx_runtime"]}
|
1
|
+
{"version":3,"sources":["../src/input-addon.tsx","../src/input-context.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useInputGroup } from \"./input-context\"\n\ninterface InputAddonOptions {\n /**\n * The placement of the element.\n *\n * @default 'left'\n */\n placement?: \"left\" | \"right\"\n}\n\nexport interface InputAddonProps extends HTMLUIProps, InputAddonOptions {}\n\nconst InputAddon = forwardRef<InputAddonProps, \"div\">(\n ({ className, placement = \"left\", ...rest }, ref) => {\n const styles = useInputGroup()\n\n const placementStyles = {\n left: {\n me: \"-1px\",\n roundedRight: 0,\n borderEndColor: \"transparent\",\n },\n right: {\n ms: \"-1px\",\n roundedLeft: 0,\n borderStartColor: \"transparent\",\n },\n }\n\n const css: CSSUIObject = {\n flex: \"0 0 auto\",\n w: \"auto\",\n display: \"flex\",\n alignItems: \"center\",\n whiteSpace: \"nowrap\",\n ...styles.addon,\n ...placementStyles[placement],\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-input__addon\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nexport const InputLeftAddon = forwardRef<InputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n return (\n <InputAddon\n ref={ref}\n className={cx(\"ui-input__addon--left\", className)}\n placement=\"left\"\n {...rest}\n />\n )\n },\n)\n\nexport const InputRightAddon = forwardRef<InputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n return (\n <InputAddon\n ref={ref}\n className={cx(\"ui-input__addon--right\", className)}\n placement=\"right\"\n {...rest}\n />\n )\n },\n)\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface InputGroupContext {\n [key: string]: CSSUIObject\n}\n\nexport const [InputGroupProvider, useInputGroup] =\n createContext<InputGroupContext>({\n name: \"InputGroupContext\",\n errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in \"<InputGroup />\" `,\n })\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,kBAA+B;AAC/B,IAAAA,gBAAmB;;;ACDnB,mBAA8B;AAMvB,IAAM,CAAC,oBAAoB,aAAa,QAC7C,4BAAiC;AAAA,EAC/B,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;ADiCG;AA5BN,IAAM,iBAAa;AAAA,EACjB,CAAC,EAAE,WAAW,YAAY,QAAQ,GAAG,KAAK,GAAG,QAAQ;AACnD,UAAM,SAAS,cAAc;AAE7B,UAAM,kBAAkB;AAAA,MACtB,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,cAAc;AAAA,QACd,gBAAgB;AAAA,MAClB;AAAA,MACA,OAAO;AAAA,QACL,IAAI;AAAA,QACJ,aAAa;AAAA,QACb,kBAAkB;AAAA,MACpB;AAAA,IACF;AAEA,UAAM,MAAmB;AAAA,MACvB,MAAM;AAAA,MACN,GAAG;AAAA,MACH,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,GAAG,OAAO;AAAA,MACV,GAAG,gBAAgB,SAAS;AAAA,IAC9B;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,mBAAmB,SAAS;AAAA,QAC1C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEO,IAAM,qBAAiB;AAAA,EAC5B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,yBAAyB,SAAS;AAAA,QAChD,WAAU;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEO,IAAM,sBAAkB;AAAA,EAC7B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,0BAA0B,SAAS;AAAA,QACjD,WAAU;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;","names":["import_utils"]}
|
package/dist/input-addon.mjs
CHANGED
@@ -0,0 +1,10 @@
|
|
1
|
+
import * as react from 'react';
|
2
|
+
import { CSSUIObject } from '@yamada-ui/core';
|
3
|
+
|
4
|
+
interface InputGroupContext {
|
5
|
+
[key: string]: CSSUIObject;
|
6
|
+
}
|
7
|
+
declare const InputGroupProvider: react.Provider<InputGroupContext>;
|
8
|
+
declare const useInputGroup: () => InputGroupContext;
|
9
|
+
|
10
|
+
export { InputGroupProvider, useInputGroup };
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import * as react from 'react';
|
2
|
+
import { CSSUIObject } from '@yamada-ui/core';
|
3
|
+
|
4
|
+
interface InputGroupContext {
|
5
|
+
[key: string]: CSSUIObject;
|
6
|
+
}
|
7
|
+
declare const InputGroupProvider: react.Provider<InputGroupContext>;
|
8
|
+
declare const useInputGroup: () => InputGroupContext;
|
9
|
+
|
10
|
+
export { InputGroupProvider, useInputGroup };
|
@@ -0,0 +1,38 @@
|
|
1
|
+
"use client"
|
2
|
+
"use strict";
|
3
|
+
var __defProp = Object.defineProperty;
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
7
|
+
var __export = (target, all) => {
|
8
|
+
for (var name in all)
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
10
|
+
};
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
13
|
+
for (let key of __getOwnPropNames(from))
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
16
|
+
}
|
17
|
+
return to;
|
18
|
+
};
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
20
|
+
|
21
|
+
// src/input-context.tsx
|
22
|
+
var input_context_exports = {};
|
23
|
+
__export(input_context_exports, {
|
24
|
+
InputGroupProvider: () => InputGroupProvider,
|
25
|
+
useInputGroup: () => useInputGroup
|
26
|
+
});
|
27
|
+
module.exports = __toCommonJS(input_context_exports);
|
28
|
+
var import_utils = require("@yamada-ui/utils");
|
29
|
+
var [InputGroupProvider, useInputGroup] = (0, import_utils.createContext)({
|
30
|
+
name: "InputGroupContext",
|
31
|
+
errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in "<InputGroup />" `
|
32
|
+
});
|
33
|
+
// Annotate the CommonJS export names for ESM import in node:
|
34
|
+
0 && (module.exports = {
|
35
|
+
InputGroupProvider,
|
36
|
+
useInputGroup
|
37
|
+
});
|
38
|
+
//# sourceMappingURL=input-context.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../src/input-context.tsx"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface InputGroupContext {\n [key: string]: CSSUIObject\n}\n\nexport const [InputGroupProvider, useInputGroup] =\n createContext<InputGroupContext>({\n name: \"InputGroupContext\",\n errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in \"<InputGroup />\" `,\n })\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAA8B;AAMvB,IAAM,CAAC,oBAAoB,aAAa,QAC7C,4BAAiC;AAAA,EAC/B,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;","names":[]}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
package/dist/input-element.d.mts
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
2
2
|
import { HTMLUIProps } from '@yamada-ui/core';
|
3
3
|
|
4
|
-
|
4
|
+
interface InputElementOptions {
|
5
5
|
/**
|
6
6
|
* If `true`, the element clickable.
|
7
7
|
*
|
@@ -14,8 +14,9 @@ type InputElementOptions = {
|
|
14
14
|
* @default 'left'
|
15
15
|
*/
|
16
16
|
placement?: "left" | "right";
|
17
|
-
}
|
18
|
-
|
17
|
+
}
|
18
|
+
interface InputElementProps extends HTMLUIProps, InputElementOptions {
|
19
|
+
}
|
19
20
|
declare const InputLeftElement: _yamada_ui_core.Component<"div", InputElementProps>;
|
20
21
|
declare const InputRightElement: _yamada_ui_core.Component<"div", InputElementProps>;
|
21
22
|
|
package/dist/input-element.d.ts
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
2
2
|
import { HTMLUIProps } from '@yamada-ui/core';
|
3
3
|
|
4
|
-
|
4
|
+
interface InputElementOptions {
|
5
5
|
/**
|
6
6
|
* If `true`, the element clickable.
|
7
7
|
*
|
@@ -14,8 +14,9 @@ type InputElementOptions = {
|
|
14
14
|
* @default 'left'
|
15
15
|
*/
|
16
16
|
placement?: "left" | "right";
|
17
|
-
}
|
18
|
-
|
17
|
+
}
|
18
|
+
interface InputElementProps extends HTMLUIProps, InputElementOptions {
|
19
|
+
}
|
19
20
|
declare const InputLeftElement: _yamada_ui_core.Component<"div", InputElementProps>;
|
20
21
|
declare const InputRightElement: _yamada_ui_core.Component<"div", InputElementProps>;
|
21
22
|
|
package/dist/input-element.js
CHANGED
@@ -25,157 +25,19 @@ __export(input_element_exports, {
|
|
25
25
|
InputRightElement: () => InputRightElement
|
26
26
|
});
|
27
27
|
module.exports = __toCommonJS(input_element_exports);
|
28
|
-
var import_core4 = require("@yamada-ui/core");
|
29
|
-
var import_utils4 = require("@yamada-ui/utils");
|
30
|
-
|
31
|
-
// src/input-group.tsx
|
32
|
-
var import_core3 = require("@yamada-ui/core");
|
33
|
-
var import_file_input = require("@yamada-ui/file-input");
|
34
|
-
var import_use_token = require("@yamada-ui/use-token");
|
35
|
-
var import_utils3 = require("@yamada-ui/utils");
|
36
|
-
var import_react = require("react");
|
37
|
-
|
38
|
-
// src/input.tsx
|
39
28
|
var import_core = require("@yamada-ui/core");
|
40
|
-
var import_form_control = require("@yamada-ui/form-control");
|
41
|
-
var import_utils = require("@yamada-ui/utils");
|
42
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
43
|
-
var Input = (0, import_core.forwardRef)((props, ref) => {
|
44
|
-
const [styles, mergedProps] = (0, import_core.useMultiComponentStyle)("Input", props);
|
45
|
-
let { className, htmlSize, __css, ...rest } = (0, import_core.omitThemeProps)(mergedProps);
|
46
|
-
rest = (0, import_form_control.useFormControlProps)(rest);
|
47
|
-
const css = { ...styles.field, ...__css };
|
48
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
49
|
-
import_core.ui.input,
|
50
|
-
{
|
51
|
-
ref,
|
52
|
-
className: (0, import_utils.cx)("ui-input", className),
|
53
|
-
size: htmlSize,
|
54
|
-
__css: css,
|
55
|
-
...rest
|
56
|
-
}
|
57
|
-
);
|
58
|
-
});
|
59
|
-
|
60
|
-
// src/input-addon.tsx
|
61
|
-
var import_core2 = require("@yamada-ui/core");
|
62
29
|
var import_utils2 = require("@yamada-ui/utils");
|
63
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
64
|
-
var InputAddon = (0, import_core2.forwardRef)(
|
65
|
-
({ className, placement = "left", ...rest }, ref) => {
|
66
|
-
const styles = useInputGroup();
|
67
|
-
const placementStyles = {
|
68
|
-
left: {
|
69
|
-
me: "-1px",
|
70
|
-
roundedRight: 0,
|
71
|
-
borderEndColor: "transparent"
|
72
|
-
},
|
73
|
-
right: {
|
74
|
-
ms: "-1px",
|
75
|
-
roundedLeft: 0,
|
76
|
-
borderStartColor: "transparent"
|
77
|
-
}
|
78
|
-
};
|
79
|
-
const css = {
|
80
|
-
flex: "0 0 auto",
|
81
|
-
w: "auto",
|
82
|
-
display: "flex",
|
83
|
-
alignItems: "center",
|
84
|
-
whiteSpace: "nowrap",
|
85
|
-
...styles.addon,
|
86
|
-
...placementStyles[placement]
|
87
|
-
};
|
88
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
89
|
-
import_core2.ui.div,
|
90
|
-
{
|
91
|
-
ref,
|
92
|
-
className: (0, import_utils2.cx)("ui-input__addon", className),
|
93
|
-
__css: css,
|
94
|
-
...rest
|
95
|
-
}
|
96
|
-
);
|
97
|
-
}
|
98
|
-
);
|
99
|
-
var InputLeftAddon = (0, import_core2.forwardRef)(
|
100
|
-
({ className, ...rest }, ref) => {
|
101
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
102
|
-
InputAddon,
|
103
|
-
{
|
104
|
-
ref,
|
105
|
-
className: (0, import_utils2.cx)("ui-input__addon--left", className),
|
106
|
-
placement: "left",
|
107
|
-
...rest
|
108
|
-
}
|
109
|
-
);
|
110
|
-
}
|
111
|
-
);
|
112
|
-
var InputRightAddon = (0, import_core2.forwardRef)(
|
113
|
-
({ className, ...rest }, ref) => {
|
114
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
115
|
-
InputAddon,
|
116
|
-
{
|
117
|
-
ref,
|
118
|
-
className: (0, import_utils2.cx)("ui-input__addon--right", className),
|
119
|
-
placement: "right",
|
120
|
-
...rest
|
121
|
-
}
|
122
|
-
);
|
123
|
-
}
|
124
|
-
);
|
125
30
|
|
126
|
-
// src/input-
|
127
|
-
var
|
128
|
-
var [InputGroupProvider, useInputGroup] = (0,
|
31
|
+
// src/input-context.tsx
|
32
|
+
var import_utils = require("@yamada-ui/utils");
|
33
|
+
var [InputGroupProvider, useInputGroup] = (0, import_utils.createContext)({
|
129
34
|
name: "InputGroupContext",
|
130
35
|
errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in "<InputGroup />" `
|
131
36
|
});
|
132
|
-
var InputGroup = (0, import_core3.forwardRef)((props, ref) => {
|
133
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
134
|
-
const [styles] = (0, import_core3.useMultiComponentStyle)("Input", props);
|
135
|
-
const { className, children, ...rest } = (0, import_core3.omitThemeProps)(props);
|
136
|
-
const css = {
|
137
|
-
width: "100%",
|
138
|
-
display: "flex",
|
139
|
-
position: "relative",
|
140
|
-
...styles.container
|
141
|
-
};
|
142
|
-
const groupProps = {};
|
143
|
-
const minHeight = (_g = (_e = (0, import_use_token.useToken)("sizes", (_c = (_a = styles.field) == null ? void 0 : _a.minHeight) != null ? _c : (_b = styles.field) == null ? void 0 : _b.minH)) != null ? _e : (_d = styles.field) == null ? void 0 : _d.minHeight) != null ? _g : (_f = styles.field) == null ? void 0 : _f.minH;
|
144
|
-
const height = (_n = (_l = (0, import_use_token.useToken)("sizes", (_j = (_h = styles.field) == null ? void 0 : _h.height) != null ? _j : (_i = styles.field) == null ? void 0 : _i.h)) != null ? _l : (_k = styles.field) == null ? void 0 : _k.height) != null ? _n : (_m = styles.field) == null ? void 0 : _m.h;
|
145
|
-
const validChildren = (0, import_utils3.getValidChildren)(children);
|
146
|
-
validChildren.forEach((child) => {
|
147
|
-
if ((minHeight || height) && child.type === InputLeftElement)
|
148
|
-
groupProps.paddingStart = height != null ? height : minHeight;
|
149
|
-
if ((minHeight || height) && child.type === InputRightElement)
|
150
|
-
groupProps.paddingEnd = height != null ? height : minHeight;
|
151
|
-
if (child.type === InputLeftAddon) groupProps.roundedLeft = 0;
|
152
|
-
if (child.type === InputRightAddon) groupProps.roundedRight = 0;
|
153
|
-
});
|
154
|
-
const cloneChildren = validChildren.map((child) => {
|
155
|
-
var _a2, _b2;
|
156
|
-
const childProps = (0, import_utils3.filterUndefined)({
|
157
|
-
size: ((_a2 = child.props) == null ? void 0 : _a2.size) || props.size,
|
158
|
-
variant: ((_b2 = child.props) == null ? void 0 : _b2.variant) || props.variant,
|
159
|
-
...child.props
|
160
|
-
});
|
161
|
-
return child.type !== Input && child.type !== import_file_input.FileInput ? (0, import_react.cloneElement)(child, childProps) : (0, import_react.cloneElement)(child, Object.assign(childProps, groupProps));
|
162
|
-
});
|
163
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(InputGroupProvider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
164
|
-
import_core3.ui.div,
|
165
|
-
{
|
166
|
-
ref,
|
167
|
-
className: (0, import_utils3.cx)("ui-input-group", className),
|
168
|
-
role: "group",
|
169
|
-
__css: css,
|
170
|
-
...rest,
|
171
|
-
children: cloneChildren
|
172
|
-
}
|
173
|
-
) });
|
174
|
-
});
|
175
37
|
|
176
38
|
// src/input-element.tsx
|
177
|
-
var
|
178
|
-
var InputElement = (0,
|
39
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
40
|
+
var InputElement = (0, import_core.forwardRef)(
|
179
41
|
({ className, isClick = false, placement = "left", ...rest }, ref) => {
|
180
42
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
181
43
|
const styles = useInputGroup();
|
@@ -194,37 +56,37 @@ var InputElement = (0, import_core4.forwardRef)(
|
|
194
56
|
cursor: isClick ? "pointer" : "auto",
|
195
57
|
...styles.element
|
196
58
|
};
|
197
|
-
return /* @__PURE__ */ (0,
|
198
|
-
|
59
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
60
|
+
import_core.ui.div,
|
199
61
|
{
|
200
62
|
ref,
|
201
|
-
className: (0,
|
63
|
+
className: (0, import_utils2.cx)("ui-input__element", className),
|
202
64
|
__css: css,
|
203
65
|
...rest
|
204
66
|
}
|
205
67
|
);
|
206
68
|
}
|
207
69
|
);
|
208
|
-
var InputLeftElement = (0,
|
70
|
+
var InputLeftElement = (0, import_core.forwardRef)(
|
209
71
|
({ className, ...rest }, ref) => {
|
210
|
-
return /* @__PURE__ */ (0,
|
72
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
211
73
|
InputElement,
|
212
74
|
{
|
213
75
|
ref,
|
214
|
-
className: (0,
|
76
|
+
className: (0, import_utils2.cx)("ui-input__element--left", className),
|
215
77
|
placement: "left",
|
216
78
|
...rest
|
217
79
|
}
|
218
80
|
);
|
219
81
|
}
|
220
82
|
);
|
221
|
-
var InputRightElement = (0,
|
83
|
+
var InputRightElement = (0, import_core.forwardRef)(
|
222
84
|
({ className, ...rest }, ref) => {
|
223
|
-
return /* @__PURE__ */ (0,
|
85
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
224
86
|
InputElement,
|
225
87
|
{
|
226
88
|
ref,
|
227
|
-
className: (0,
|
89
|
+
className: (0, import_utils2.cx)("ui-input__element--right", className),
|
228
90
|
placement: "right",
|
229
91
|
...rest
|
230
92
|
}
|