@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
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/input-element.tsx","../src/input-group.tsx","../src/input.tsx","../src/input-addon.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 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","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 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"],"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-element.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 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 interface InputElementProps extends HTMLUIProps, 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","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;;;ADoCG;AAzBN,IAAM,mBAAe;AAAA,EACnB,CAAC,EAAE,WAAW,UAAU,OAAO,YAAY,QAAQ,GAAG,KAAK,GAAG,QAAQ;AAvBxE;AAwBI,UAAM,SAAS,cAAc;AAE7B,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,KAAK;AAAA,MACL,CAAC,cAAc,SAAS,eAAe,UAAU,GAAG;AAAA,MACpD,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,IACE,8BAAO,UAAP,mBAAc,WAAd,aACA,YAAO,UAAP,mBAAc,MADd,aAEA,YAAO,UAAP,mBAAc,cAFd,aAGA,YAAO,UAAP,mBAAc;AAAA,MAChB,GAAG;AAAA,MACH,WAAU,YAAO,UAAP,mBAAc;AAAA,MACxB,eAAe,UAAU,SAAS;AAAA,MAClC,QAAQ,UAAU,YAAY;AAAA,MAC9B,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,qBAAqB,SAAS;AAAA,QAC5C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEO,IAAM,uBAAmB;AAAA,EAC9B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,2BAA2B,SAAS;AAAA,QAClD,WAAU;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEO,IAAM,wBAAoB;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,4BAA4B,SAAS;AAAA,QACnD,WAAU;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;","names":["import_utils"]}
|
package/dist/input-element.mjs
CHANGED
package/dist/input-group.d.mts
CHANGED
@@ -1,10 +1,8 @@
|
|
1
1
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
2
|
-
import { HTMLUIProps, ThemeProps
|
3
|
-
|
4
|
-
type InputGroupProps = HTMLUIProps<"div"> & ThemeProps<"Input">;
|
5
|
-
type InputGroupContext = Record<string, CSSUIObject>;
|
6
|
-
declare const useInputGroup: () => InputGroupContext;
|
2
|
+
import { HTMLUIProps, ThemeProps } from '@yamada-ui/core';
|
7
3
|
|
4
|
+
interface InputGroupProps extends HTMLUIProps, ThemeProps<"Input"> {
|
5
|
+
}
|
8
6
|
declare const InputGroup: _yamada_ui_core.Component<"div", InputGroupProps>;
|
9
7
|
|
10
|
-
export { InputGroup, type InputGroupProps
|
8
|
+
export { InputGroup, type InputGroupProps };
|
package/dist/input-group.d.ts
CHANGED
@@ -1,10 +1,8 @@
|
|
1
1
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
2
|
-
import { HTMLUIProps, ThemeProps
|
3
|
-
|
4
|
-
type InputGroupProps = HTMLUIProps<"div"> & ThemeProps<"Input">;
|
5
|
-
type InputGroupContext = Record<string, CSSUIObject>;
|
6
|
-
declare const useInputGroup: () => InputGroupContext;
|
2
|
+
import { HTMLUIProps, ThemeProps } from '@yamada-ui/core';
|
7
3
|
|
4
|
+
interface InputGroupProps extends HTMLUIProps, ThemeProps<"Input"> {
|
5
|
+
}
|
8
6
|
declare const InputGroup: _yamada_ui_core.Component<"div", InputGroupProps>;
|
9
7
|
|
10
|
-
export { InputGroup, type InputGroupProps
|
8
|
+
export { InputGroup, type InputGroupProps };
|
package/dist/input-group.js
CHANGED
@@ -21,14 +21,13 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
21
21
|
// src/input-group.tsx
|
22
22
|
var input_group_exports = {};
|
23
23
|
__export(input_group_exports, {
|
24
|
-
InputGroup: () => InputGroup
|
25
|
-
useInputGroup: () => useInputGroup
|
24
|
+
InputGroup: () => InputGroup
|
26
25
|
});
|
27
26
|
module.exports = __toCommonJS(input_group_exports);
|
28
27
|
var import_core4 = require("@yamada-ui/core");
|
29
28
|
var import_file_input = require("@yamada-ui/file-input");
|
30
29
|
var import_use_token = require("@yamada-ui/use-token");
|
31
|
-
var
|
30
|
+
var import_utils5 = require("@yamada-ui/utils");
|
32
31
|
var import_react = require("react");
|
33
32
|
|
34
33
|
// src/input.tsx
|
@@ -37,7 +36,7 @@ var import_form_control = require("@yamada-ui/form-control");
|
|
37
36
|
var import_utils = require("@yamada-ui/utils");
|
38
37
|
var import_jsx_runtime = require("react/jsx-runtime");
|
39
38
|
var Input = (0, import_core.forwardRef)((props, ref) => {
|
40
|
-
const [styles, mergedProps] = (0, import_core.
|
39
|
+
const [styles, mergedProps] = (0, import_core.useComponentMultiStyle)("Input", props);
|
41
40
|
let { className, htmlSize, __css, ...rest } = (0, import_core.omitThemeProps)(mergedProps);
|
42
41
|
rest = (0, import_form_control.useFormControlProps)(rest);
|
43
42
|
const css = { ...styles.field, ...__css };
|
@@ -55,7 +54,16 @@ var Input = (0, import_core.forwardRef)((props, ref) => {
|
|
55
54
|
|
56
55
|
// src/input-addon.tsx
|
57
56
|
var import_core2 = require("@yamada-ui/core");
|
57
|
+
var import_utils3 = require("@yamada-ui/utils");
|
58
|
+
|
59
|
+
// src/input-context.tsx
|
58
60
|
var import_utils2 = require("@yamada-ui/utils");
|
61
|
+
var [InputGroupProvider, useInputGroup] = (0, import_utils2.createContext)({
|
62
|
+
name: "InputGroupContext",
|
63
|
+
errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in "<InputGroup />" `
|
64
|
+
});
|
65
|
+
|
66
|
+
// src/input-addon.tsx
|
59
67
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
60
68
|
var InputAddon = (0, import_core2.forwardRef)(
|
61
69
|
({ className, placement = "left", ...rest }, ref) => {
|
@@ -85,7 +93,7 @@ var InputAddon = (0, import_core2.forwardRef)(
|
|
85
93
|
import_core2.ui.div,
|
86
94
|
{
|
87
95
|
ref,
|
88
|
-
className: (0,
|
96
|
+
className: (0, import_utils3.cx)("ui-input__addon", className),
|
89
97
|
__css: css,
|
90
98
|
...rest
|
91
99
|
}
|
@@ -98,7 +106,7 @@ var InputLeftAddon = (0, import_core2.forwardRef)(
|
|
98
106
|
InputAddon,
|
99
107
|
{
|
100
108
|
ref,
|
101
|
-
className: (0,
|
109
|
+
className: (0, import_utils3.cx)("ui-input__addon--left", className),
|
102
110
|
placement: "left",
|
103
111
|
...rest
|
104
112
|
}
|
@@ -111,7 +119,7 @@ var InputRightAddon = (0, import_core2.forwardRef)(
|
|
111
119
|
InputAddon,
|
112
120
|
{
|
113
121
|
ref,
|
114
|
-
className: (0,
|
122
|
+
className: (0, import_utils3.cx)("ui-input__addon--right", className),
|
115
123
|
placement: "right",
|
116
124
|
...rest
|
117
125
|
}
|
@@ -121,7 +129,7 @@ var InputRightAddon = (0, import_core2.forwardRef)(
|
|
121
129
|
|
122
130
|
// src/input-element.tsx
|
123
131
|
var import_core3 = require("@yamada-ui/core");
|
124
|
-
var
|
132
|
+
var import_utils4 = require("@yamada-ui/utils");
|
125
133
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
126
134
|
var InputElement = (0, import_core3.forwardRef)(
|
127
135
|
({ className, isClick = false, placement = "left", ...rest }, ref) => {
|
@@ -146,7 +154,7 @@ var InputElement = (0, import_core3.forwardRef)(
|
|
146
154
|
import_core3.ui.div,
|
147
155
|
{
|
148
156
|
ref,
|
149
|
-
className: (0,
|
157
|
+
className: (0, import_utils4.cx)("ui-input__element", className),
|
150
158
|
__css: css,
|
151
159
|
...rest
|
152
160
|
}
|
@@ -159,7 +167,7 @@ var InputLeftElement = (0, import_core3.forwardRef)(
|
|
159
167
|
InputElement,
|
160
168
|
{
|
161
169
|
ref,
|
162
|
-
className: (0,
|
170
|
+
className: (0, import_utils4.cx)("ui-input__element--left", className),
|
163
171
|
placement: "left",
|
164
172
|
...rest
|
165
173
|
}
|
@@ -172,7 +180,7 @@ var InputRightElement = (0, import_core3.forwardRef)(
|
|
172
180
|
InputElement,
|
173
181
|
{
|
174
182
|
ref,
|
175
|
-
className: (0,
|
183
|
+
className: (0, import_utils4.cx)("ui-input__element--right", className),
|
176
184
|
placement: "right",
|
177
185
|
...rest
|
178
186
|
}
|
@@ -182,13 +190,9 @@ var InputRightElement = (0, import_core3.forwardRef)(
|
|
182
190
|
|
183
191
|
// src/input-group.tsx
|
184
192
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
185
|
-
var [InputGroupProvider, useInputGroup] = (0, import_utils4.createContext)({
|
186
|
-
name: "InputGroupContext",
|
187
|
-
errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in "<InputGroup />" `
|
188
|
-
});
|
189
193
|
var InputGroup = (0, import_core4.forwardRef)((props, ref) => {
|
190
194
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
191
|
-
const [styles] = (0, import_core4.
|
195
|
+
const [styles] = (0, import_core4.useComponentMultiStyle)("Input", props);
|
192
196
|
const { className, children, ...rest } = (0, import_core4.omitThemeProps)(props);
|
193
197
|
const css = {
|
194
198
|
width: "100%",
|
@@ -199,7 +203,7 @@ var InputGroup = (0, import_core4.forwardRef)((props, ref) => {
|
|
199
203
|
const groupProps = {};
|
200
204
|
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;
|
201
205
|
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;
|
202
|
-
const validChildren = (0,
|
206
|
+
const validChildren = (0, import_utils5.getValidChildren)(children);
|
203
207
|
validChildren.forEach((child) => {
|
204
208
|
if ((minHeight || height) && child.type === InputLeftElement)
|
205
209
|
groupProps.paddingStart = height != null ? height : minHeight;
|
@@ -210,7 +214,7 @@ var InputGroup = (0, import_core4.forwardRef)((props, ref) => {
|
|
210
214
|
});
|
211
215
|
const cloneChildren = validChildren.map((child) => {
|
212
216
|
var _a2, _b2;
|
213
|
-
const childProps = (0,
|
217
|
+
const childProps = (0, import_utils5.filterUndefined)({
|
214
218
|
size: ((_a2 = child.props) == null ? void 0 : _a2.size) || props.size,
|
215
219
|
variant: ((_b2 = child.props) == null ? void 0 : _b2.variant) || props.variant,
|
216
220
|
...child.props
|
@@ -221,7 +225,7 @@ var InputGroup = (0, import_core4.forwardRef)((props, ref) => {
|
|
221
225
|
import_core4.ui.div,
|
222
226
|
{
|
223
227
|
ref,
|
224
|
-
className: (0,
|
228
|
+
className: (0, import_utils5.cx)("ui-input-group", className),
|
225
229
|
role: "group",
|
226
230
|
__css: css,
|
227
231
|
...rest,
|
@@ -231,7 +235,6 @@ var InputGroup = (0, import_core4.forwardRef)((props, ref) => {
|
|
231
235
|
});
|
232
236
|
// Annotate the CommonJS export names for ESM import in node:
|
233
237
|
0 && (module.exports = {
|
234
|
-
InputGroup
|
235
|
-
useInputGroup
|
238
|
+
InputGroup
|
236
239
|
});
|
237
240
|
//# sourceMappingURL=input-group.js.map
|
package/dist/input-group.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/input-group.tsx","../src/input.tsx","../src/input-addon.tsx","../src/input-element.tsx"],"sourcesContent":["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 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 { 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_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_jsx_runtime","_a","_b"]}
|
1
|
+
{"version":3,"sources":["../src/input-group.tsx","../src/input.tsx","../src/input-addon.tsx","../src/input-context.tsx","../src/input-element.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n CSSUIProps,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport { FileInput } from \"@yamada-ui/file-input\"\nimport { useToken } from \"@yamada-ui/use-token\"\nimport { cx, filterUndefined, getValidChildren } from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\nimport { Input } from \"./input\"\nimport { InputLeftAddon, InputRightAddon } from \"./input-addon\"\nimport { InputGroupProvider } from \"./input-context\"\nimport { InputRightElement, InputLeftElement } from \"./input-element\"\n\nexport interface InputGroupProps extends HTMLUIProps, ThemeProps<\"Input\"> {}\n\nexport const InputGroup = forwardRef<InputGroupProps, \"div\">((props, ref) => {\n const [styles] = useComponentMultiStyle(\"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 useComponentMultiStyle,\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\ninterface 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 interface InputProps\n extends 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] = useComponentMultiStyle(\"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-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","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 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 interface InputElementProps extends HTMLUIProps, 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_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_jsx_runtime","_a","_b"]}
|
package/dist/input-group.mjs
CHANGED
@@ -1,11 +1,12 @@
|
|
1
1
|
"use client"
|
2
2
|
import {
|
3
|
-
InputGroup
|
4
|
-
|
5
|
-
|
6
|
-
import "./chunk-
|
3
|
+
InputGroup
|
4
|
+
} from "./chunk-3AEWRGHP.mjs";
|
5
|
+
import "./chunk-OYJRHTQL.mjs";
|
6
|
+
import "./chunk-ITQBVWTU.mjs";
|
7
|
+
import "./chunk-ZNGNHH5S.mjs";
|
8
|
+
import "./chunk-ZARK2Q4J.mjs";
|
7
9
|
export {
|
8
|
-
InputGroup
|
9
|
-
useInputGroup
|
10
|
+
InputGroup
|
10
11
|
};
|
11
12
|
//# sourceMappingURL=input-group.mjs.map
|
package/dist/input.d.mts
CHANGED
@@ -2,7 +2,7 @@ import * as _yamada_ui_core from '@yamada-ui/core';
|
|
2
2
|
import { HTMLUIProps, ThemeProps, ColorModeToken, CSS } from '@yamada-ui/core';
|
3
3
|
import { FormControlOptions } from '@yamada-ui/form-control';
|
4
4
|
|
5
|
-
|
5
|
+
interface InputOptions {
|
6
6
|
/**
|
7
7
|
* The border color when the input is focused.
|
8
8
|
*/
|
@@ -15,8 +15,9 @@ type InputOptions = {
|
|
15
15
|
* The native HTML `size` attribute to be passed to the `input`.
|
16
16
|
*/
|
17
17
|
htmlSize?: number;
|
18
|
-
}
|
19
|
-
|
18
|
+
}
|
19
|
+
interface InputProps extends Omit<HTMLUIProps<"input">, "disabled" | "required" | "readOnly" | "size">, ThemeProps<"Input">, InputOptions, FormControlOptions {
|
20
|
+
}
|
20
21
|
/**
|
21
22
|
* `Input` is a component used to obtain text input from the user.
|
22
23
|
*
|
package/dist/input.d.ts
CHANGED
@@ -2,7 +2,7 @@ import * as _yamada_ui_core from '@yamada-ui/core';
|
|
2
2
|
import { HTMLUIProps, ThemeProps, ColorModeToken, CSS } from '@yamada-ui/core';
|
3
3
|
import { FormControlOptions } from '@yamada-ui/form-control';
|
4
4
|
|
5
|
-
|
5
|
+
interface InputOptions {
|
6
6
|
/**
|
7
7
|
* The border color when the input is focused.
|
8
8
|
*/
|
@@ -15,8 +15,9 @@ type InputOptions = {
|
|
15
15
|
* The native HTML `size` attribute to be passed to the `input`.
|
16
16
|
*/
|
17
17
|
htmlSize?: number;
|
18
|
-
}
|
19
|
-
|
18
|
+
}
|
19
|
+
interface InputProps extends Omit<HTMLUIProps<"input">, "disabled" | "required" | "readOnly" | "size">, ThemeProps<"Input">, InputOptions, FormControlOptions {
|
20
|
+
}
|
20
21
|
/**
|
21
22
|
* `Input` is a component used to obtain text input from the user.
|
22
23
|
*
|
package/dist/input.js
CHANGED
@@ -29,7 +29,7 @@ var import_form_control = require("@yamada-ui/form-control");
|
|
29
29
|
var import_utils = require("@yamada-ui/utils");
|
30
30
|
var import_jsx_runtime = require("react/jsx-runtime");
|
31
31
|
var Input = (0, import_core.forwardRef)((props, ref) => {
|
32
|
-
const [styles, mergedProps] = (0, import_core.
|
32
|
+
const [styles, mergedProps] = (0, import_core.useComponentMultiStyle)("Input", props);
|
33
33
|
let { className, htmlSize, __css, ...rest } = (0, import_core.omitThemeProps)(mergedProps);
|
34
34
|
rest = (0, import_form_control.useFormControlProps)(rest);
|
35
35
|
const css = { ...styles.field, ...__css };
|
package/dist/input.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/input.tsx"],"sourcesContent":["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
|
1
|
+
{"version":3,"sources":["../src/input.tsx"],"sourcesContent":["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 useComponentMultiStyle,\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\ninterface 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 interface InputProps\n extends 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] = useComponentMultiStyle(\"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"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,kBAKO;AAEP,0BAAoC;AACpC,mBAAmB;AAwCf;AATG,IAAM,YAAQ,wBAAgC,CAAC,OAAO,QAAQ;AACnE,QAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,SAAS,KAAK;AACnE,MAAI,EAAE,WAAW,UAAU,OAAO,GAAG,KAAK,QAAI,4BAAe,WAAW;AAExE,aAAO,yCAAoB,IAAI;AAE/B,QAAM,MAAmB,EAAE,GAAG,OAAO,OAAO,GAAG,MAAM;AAErD,SACE;AAAA,IAAC,eAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,eAAW,iBAAG,YAAY,SAAS;AAAA,MACnC,MAAM;AAAA,MACN,OAAO;AAAA,MACN,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;","names":[]}
|
package/dist/input.mjs
CHANGED
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@yamada-ui/input",
|
3
|
-
"version": "1.0.42-dev-
|
3
|
+
"version": "1.0.42-dev-20240917033401",
|
4
4
|
"description": "Yamada UI input component",
|
5
5
|
"keywords": [
|
6
6
|
"yamada",
|
@@ -36,11 +36,11 @@
|
|
36
36
|
"url": "https://github.com/yamada-ui/yamada-ui/issues"
|
37
37
|
},
|
38
38
|
"dependencies": {
|
39
|
-
"@yamada-ui/core": "1.14.1-dev-
|
40
|
-
"@yamada-ui/file-input": "1.0.42-dev-
|
41
|
-
"@yamada-ui/form-control": "2.1.2-dev-
|
42
|
-
"@yamada-ui/use-token": "1.1.25-dev-
|
43
|
-
"@yamada-ui/utils": "1.5.
|
39
|
+
"@yamada-ui/core": "1.14.1-dev-20240917033401",
|
40
|
+
"@yamada-ui/file-input": "1.0.42-dev-20240917033401",
|
41
|
+
"@yamada-ui/form-control": "2.1.2-dev-20240917033401",
|
42
|
+
"@yamada-ui/use-token": "1.1.25-dev-20240917033401",
|
43
|
+
"@yamada-ui/utils": "1.5.1-dev-20240917033401"
|
44
44
|
},
|
45
45
|
"devDependencies": {
|
46
46
|
"clean-package": "2.2.0",
|
package/dist/chunk-OCJVHG24.mjs
DELETED
@@ -1,208 +0,0 @@
|
|
1
|
-
"use client"
|
2
|
-
import {
|
3
|
-
Input
|
4
|
-
} from "./chunk-PFAPK5JD.mjs";
|
5
|
-
|
6
|
-
// src/input-group.tsx
|
7
|
-
import {
|
8
|
-
ui as ui3,
|
9
|
-
forwardRef as forwardRef3,
|
10
|
-
useMultiComponentStyle,
|
11
|
-
omitThemeProps
|
12
|
-
} from "@yamada-ui/core";
|
13
|
-
import { FileInput } from "@yamada-ui/file-input";
|
14
|
-
import { useToken } from "@yamada-ui/use-token";
|
15
|
-
import {
|
16
|
-
createContext,
|
17
|
-
cx as cx3,
|
18
|
-
filterUndefined,
|
19
|
-
getValidChildren
|
20
|
-
} from "@yamada-ui/utils";
|
21
|
-
import { cloneElement } from "react";
|
22
|
-
|
23
|
-
// src/input-addon.tsx
|
24
|
-
import { ui, forwardRef } from "@yamada-ui/core";
|
25
|
-
import { cx } from "@yamada-ui/utils";
|
26
|
-
import { jsx } from "react/jsx-runtime";
|
27
|
-
var InputAddon = forwardRef(
|
28
|
-
({ className, placement = "left", ...rest }, ref) => {
|
29
|
-
const styles = useInputGroup();
|
30
|
-
const placementStyles = {
|
31
|
-
left: {
|
32
|
-
me: "-1px",
|
33
|
-
roundedRight: 0,
|
34
|
-
borderEndColor: "transparent"
|
35
|
-
},
|
36
|
-
right: {
|
37
|
-
ms: "-1px",
|
38
|
-
roundedLeft: 0,
|
39
|
-
borderStartColor: "transparent"
|
40
|
-
}
|
41
|
-
};
|
42
|
-
const css = {
|
43
|
-
flex: "0 0 auto",
|
44
|
-
w: "auto",
|
45
|
-
display: "flex",
|
46
|
-
alignItems: "center",
|
47
|
-
whiteSpace: "nowrap",
|
48
|
-
...styles.addon,
|
49
|
-
...placementStyles[placement]
|
50
|
-
};
|
51
|
-
return /* @__PURE__ */ jsx(
|
52
|
-
ui.div,
|
53
|
-
{
|
54
|
-
ref,
|
55
|
-
className: cx("ui-input__addon", className),
|
56
|
-
__css: css,
|
57
|
-
...rest
|
58
|
-
}
|
59
|
-
);
|
60
|
-
}
|
61
|
-
);
|
62
|
-
var InputLeftAddon = forwardRef(
|
63
|
-
({ className, ...rest }, ref) => {
|
64
|
-
return /* @__PURE__ */ jsx(
|
65
|
-
InputAddon,
|
66
|
-
{
|
67
|
-
ref,
|
68
|
-
className: cx("ui-input__addon--left", className),
|
69
|
-
placement: "left",
|
70
|
-
...rest
|
71
|
-
}
|
72
|
-
);
|
73
|
-
}
|
74
|
-
);
|
75
|
-
var InputRightAddon = forwardRef(
|
76
|
-
({ className, ...rest }, ref) => {
|
77
|
-
return /* @__PURE__ */ jsx(
|
78
|
-
InputAddon,
|
79
|
-
{
|
80
|
-
ref,
|
81
|
-
className: cx("ui-input__addon--right", className),
|
82
|
-
placement: "right",
|
83
|
-
...rest
|
84
|
-
}
|
85
|
-
);
|
86
|
-
}
|
87
|
-
);
|
88
|
-
|
89
|
-
// src/input-element.tsx
|
90
|
-
import { ui as ui2, forwardRef as forwardRef2 } from "@yamada-ui/core";
|
91
|
-
import { cx as cx2 } from "@yamada-ui/utils";
|
92
|
-
import { jsx as jsx2 } from "react/jsx-runtime";
|
93
|
-
var InputElement = forwardRef2(
|
94
|
-
({ className, isClick = false, placement = "left", ...rest }, ref) => {
|
95
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
96
|
-
const styles = useInputGroup();
|
97
|
-
const css = {
|
98
|
-
position: "absolute",
|
99
|
-
top: "0",
|
100
|
-
[placement === "left" ? "insetStart" : "insetEnd"]: "0",
|
101
|
-
zIndex: "fallback(kurillin, 9)",
|
102
|
-
display: "flex",
|
103
|
-
alignItems: "center",
|
104
|
-
justifyContent: "center",
|
105
|
-
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,
|
106
|
-
h: "100%",
|
107
|
-
fontSize: (_h = styles.field) == null ? void 0 : _h.fontSize,
|
108
|
-
pointerEvents: isClick ? "auto" : "none",
|
109
|
-
cursor: isClick ? "pointer" : "auto",
|
110
|
-
...styles.element
|
111
|
-
};
|
112
|
-
return /* @__PURE__ */ jsx2(
|
113
|
-
ui2.div,
|
114
|
-
{
|
115
|
-
ref,
|
116
|
-
className: cx2("ui-input__element", className),
|
117
|
-
__css: css,
|
118
|
-
...rest
|
119
|
-
}
|
120
|
-
);
|
121
|
-
}
|
122
|
-
);
|
123
|
-
var InputLeftElement = forwardRef2(
|
124
|
-
({ className, ...rest }, ref) => {
|
125
|
-
return /* @__PURE__ */ jsx2(
|
126
|
-
InputElement,
|
127
|
-
{
|
128
|
-
ref,
|
129
|
-
className: cx2("ui-input__element--left", className),
|
130
|
-
placement: "left",
|
131
|
-
...rest
|
132
|
-
}
|
133
|
-
);
|
134
|
-
}
|
135
|
-
);
|
136
|
-
var InputRightElement = forwardRef2(
|
137
|
-
({ className, ...rest }, ref) => {
|
138
|
-
return /* @__PURE__ */ jsx2(
|
139
|
-
InputElement,
|
140
|
-
{
|
141
|
-
ref,
|
142
|
-
className: cx2("ui-input__element--right", className),
|
143
|
-
placement: "right",
|
144
|
-
...rest
|
145
|
-
}
|
146
|
-
);
|
147
|
-
}
|
148
|
-
);
|
149
|
-
|
150
|
-
// src/input-group.tsx
|
151
|
-
import { jsx as jsx3 } from "react/jsx-runtime";
|
152
|
-
var [InputGroupProvider, useInputGroup] = createContext({
|
153
|
-
name: "InputGroupContext",
|
154
|
-
errorMessage: `useInputGroup returned is 'undefined'. Seems you forgot to wrap the components in "<InputGroup />" `
|
155
|
-
});
|
156
|
-
var InputGroup = forwardRef3((props, ref) => {
|
157
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
158
|
-
const [styles] = useMultiComponentStyle("Input", props);
|
159
|
-
const { className, children, ...rest } = omitThemeProps(props);
|
160
|
-
const css = {
|
161
|
-
width: "100%",
|
162
|
-
display: "flex",
|
163
|
-
position: "relative",
|
164
|
-
...styles.container
|
165
|
-
};
|
166
|
-
const groupProps = {};
|
167
|
-
const minHeight = (_g = (_e = 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;
|
168
|
-
const height = (_n = (_l = 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;
|
169
|
-
const validChildren = getValidChildren(children);
|
170
|
-
validChildren.forEach((child) => {
|
171
|
-
if ((minHeight || height) && child.type === InputLeftElement)
|
172
|
-
groupProps.paddingStart = height != null ? height : minHeight;
|
173
|
-
if ((minHeight || height) && child.type === InputRightElement)
|
174
|
-
groupProps.paddingEnd = height != null ? height : minHeight;
|
175
|
-
if (child.type === InputLeftAddon) groupProps.roundedLeft = 0;
|
176
|
-
if (child.type === InputRightAddon) groupProps.roundedRight = 0;
|
177
|
-
});
|
178
|
-
const cloneChildren = validChildren.map((child) => {
|
179
|
-
var _a2, _b2;
|
180
|
-
const childProps = filterUndefined({
|
181
|
-
size: ((_a2 = child.props) == null ? void 0 : _a2.size) || props.size,
|
182
|
-
variant: ((_b2 = child.props) == null ? void 0 : _b2.variant) || props.variant,
|
183
|
-
...child.props
|
184
|
-
});
|
185
|
-
return child.type !== Input && child.type !== FileInput ? cloneElement(child, childProps) : cloneElement(child, Object.assign(childProps, groupProps));
|
186
|
-
});
|
187
|
-
return /* @__PURE__ */ jsx3(InputGroupProvider, { value: styles, children: /* @__PURE__ */ jsx3(
|
188
|
-
ui3.div,
|
189
|
-
{
|
190
|
-
ref,
|
191
|
-
className: cx3("ui-input-group", className),
|
192
|
-
role: "group",
|
193
|
-
__css: css,
|
194
|
-
...rest,
|
195
|
-
children: cloneChildren
|
196
|
-
}
|
197
|
-
) });
|
198
|
-
});
|
199
|
-
|
200
|
-
export {
|
201
|
-
useInputGroup,
|
202
|
-
InputGroup,
|
203
|
-
InputLeftAddon,
|
204
|
-
InputRightAddon,
|
205
|
-
InputLeftElement,
|
206
|
-
InputRightElement
|
207
|
-
};
|
208
|
-
//# sourceMappingURL=chunk-OCJVHG24.mjs.map
|