@yamada-ui/input 2.0.0-next-20241005223501 → 2.0.0-next-20241005235555
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{chunk-ATDVAWNC.mjs → chunk-I3CWDP7I.mjs} +2 -2
- package/dist/{chunk-XQSGBATS.mjs → chunk-VRKOB3SX.mjs} +2 -3
- package/dist/chunk-VRKOB3SX.mjs.map +1 -0
- package/dist/index.js +1 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2 -2
- package/dist/input-element.d.mts +0 -8
- package/dist/input-element.d.ts +0 -8
- package/dist/input-element.js +1 -2
- package/dist/input-element.js.map +1 -1
- package/dist/input-element.mjs +1 -1
- package/dist/input-group.js +1 -2
- package/dist/input-group.js.map +1 -1
- package/dist/input-group.mjs +2 -2
- package/package.json +5 -5
- package/dist/chunk-XQSGBATS.mjs.map +0 -1
- /package/dist/{chunk-ATDVAWNC.mjs.map → chunk-I3CWDP7I.mjs.map} +0 -0
@@ -6,7 +6,7 @@ import {
|
|
6
6
|
import {
|
7
7
|
InputLeftElement,
|
8
8
|
InputRightElement
|
9
|
-
} from "./chunk-
|
9
|
+
} from "./chunk-VRKOB3SX.mjs";
|
10
10
|
import {
|
11
11
|
InputGroupProvider
|
12
12
|
} from "./chunk-7DAXKPYU.mjs";
|
@@ -87,4 +87,4 @@ var InputGroup = forwardRef((props, ref) => {
|
|
87
87
|
export {
|
88
88
|
InputGroup
|
89
89
|
};
|
90
|
-
//# sourceMappingURL=chunk-
|
90
|
+
//# sourceMappingURL=chunk-I3CWDP7I.mjs.map
|
@@ -8,9 +8,8 @@ import { ui, forwardRef } from "@yamada-ui/core";
|
|
8
8
|
import { cx } from "@yamada-ui/utils";
|
9
9
|
import { jsx } from "react/jsx-runtime";
|
10
10
|
var InputElement = forwardRef(
|
11
|
-
({ className,
|
11
|
+
({ className, isClickable = false, placement = "left", ...rest }, ref) => {
|
12
12
|
const { styles, fieldHeight, fieldFontSize } = useInputGroup();
|
13
|
-
isClickable != null ? isClickable : isClickable = isClick;
|
14
13
|
const css = {
|
15
14
|
[placement === "left" ? "insetStart" : "insetEnd"]: "0",
|
16
15
|
w: fieldHeight,
|
@@ -61,4 +60,4 @@ export {
|
|
61
60
|
InputLeftElement,
|
62
61
|
InputRightElement
|
63
62
|
};
|
64
|
-
//# sourceMappingURL=chunk-
|
63
|
+
//# sourceMappingURL=chunk-VRKOB3SX.mjs.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../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-context\"\n\ninterface InputElementOptions {\n /**\n * If `true`, the element clickable.\n *\n * @default false\n */\n isClickable?: 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, isClickable = false, placement = \"left\", ...rest }, ref) => {\n const { styles, fieldHeight, fieldFontSize } = useInputGroup()\n\n const css: CSSUIObject = {\n [placement === \"left\" ? \"insetStart\" : \"insetEnd\"]: \"0\",\n w: fieldHeight,\n fontSize: fieldFontSize,\n pointerEvents: isClickable ? \"auto\" : \"none\",\n cursor: isClickable ? \"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":";;;;;;AACA,SAAS,IAAI,kBAAkB;AAC/B,SAAS,UAAU;AAkCb;AAdN,IAAM,eAAe;AAAA,EACnB,CAAC,EAAE,WAAW,cAAc,OAAO,YAAY,QAAQ,GAAG,KAAK,GAAG,QAAQ;AACxE,UAAM,EAAE,QAAQ,aAAa,cAAc,IAAI,cAAc;AAE7D,UAAM,MAAmB;AAAA,MACvB,CAAC,cAAc,SAAS,eAAe,UAAU,GAAG;AAAA,MACpD,GAAG;AAAA,MACH,UAAU;AAAA,MACV,eAAe,cAAc,SAAS;AAAA,MACtC,QAAQ,cAAc,YAAY;AAAA,MAClC,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,WAAW,GAAG,qBAAqB,SAAS;AAAA,QAC5C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEO,IAAM,mBAAmB;AAAA,EAC9B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,2BAA2B,SAAS;AAAA,QAClD,WAAU;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEO,IAAM,oBAAoB;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,4BAA4B,SAAS;AAAA,QACnD,WAAU;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;","names":[]}
|
package/dist/index.js
CHANGED
@@ -130,9 +130,8 @@ var import_core3 = require("@yamada-ui/core");
|
|
130
130
|
var import_utils4 = require("@yamada-ui/utils");
|
131
131
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
132
132
|
var InputElement = (0, import_core3.forwardRef)(
|
133
|
-
({ className,
|
133
|
+
({ className, isClickable = false, placement = "left", ...rest }, ref) => {
|
134
134
|
const { styles, fieldHeight, fieldFontSize } = useInputGroup();
|
135
|
-
isClickable != null ? isClickable : isClickable = isClick;
|
136
135
|
const css = {
|
137
136
|
[placement === "left" ? "insetStart" : "insetEnd"]: "0",
|
138
137
|
w: fieldHeight,
|
package/dist/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/input.tsx","../src/input-group.tsx","../src/input-addon.tsx","../src/input-context.tsx","../src/input-element.tsx"],"sourcesContent":["export { Input } from \"./input\"\nexport type { InputProps } from \"./input\"\nexport { InputGroup } from \"./input-group\"\nexport type { InputGroupProps } from \"./input-group\"\nexport { InputLeftAddon, InputRightAddon } from \"./input-addon\"\nexport type { InputAddonProps } from \"./input-addon\"\nexport { InputLeftElement, InputRightElement } from \"./input-element\"\nexport type { InputElementProps } from \"./input-element\"\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 {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n CSSUIProps,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n useCreateVars,\n} from \"@yamada-ui/core\"\nimport { cx, filterUndefined, getValidChildren } from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\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 [vars, variableProps] = useCreateVars({ ...styles.field, ...rest }, [\n \"minHeight\",\n \"minH\",\n \"height\",\n \"h\",\n \"fontSize\",\n ])\n const minHeight = variableProps.minHeight ?? variableProps.minH\n const height = variableProps.height ?? variableProps.h\n const fieldHeight = minHeight ?? height\n const fieldFontSize = variableProps.fontSize\n\n const css: CSSUIObject = {\n vars,\n ...styles.container,\n }\n\n const groupProps: CSSUIProps = {}\n\n const validChildren = getValidChildren(children)\n\n validChildren.forEach((child: any) => {\n if (fieldHeight && child.type === InputLeftElement)\n groupProps.paddingStart = `${fieldHeight} !important`\n\n if (fieldHeight && child.type === InputRightElement)\n groupProps.paddingEnd = `${fieldHeight} !important`\n\n if (child.type === InputLeftAddon) groupProps.roundedLeft = \"0px !important\"\n\n if (child.type === InputRightAddon)\n groupProps.roundedRight = \"0px !important\"\n })\n\n const cloneChildren = validChildren.map((child) => {\n const isAddonElement = [\n InputLeftAddon,\n InputRightAddon,\n InputLeftElement,\n InputRightElement,\n ].some((type) => child.type === type)\n\n if (isAddonElement) {\n return child\n } else {\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 cloneElement(child, Object.assign(childProps, groupProps))\n }\n })\n\n return (\n <InputGroupProvider value={{ styles, fieldHeight, fieldFontSize }}>\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 { 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: \"0px !important\",\n },\n right: {\n ms: \"-1px\",\n roundedLeft: \"0px !important\",\n },\n }\n\n const css: CSSUIObject = {\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 styles: { [key: string]: CSSUIObject }\n fieldHeight: string | undefined\n fieldFontSize: string | undefined\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 * @deprecated Use `isClickable` instead.\n */\n isClick?: boolean\n /**\n * If `true`, the element clickable.\n *\n * @default false\n */\n isClickable?: 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 (\n { className, isClick = false, isClickable, placement = \"left\", ...rest },\n ref,\n ) => {\n const { styles, fieldHeight, fieldFontSize } = useInputGroup()\n\n isClickable ??= isClick\n\n const css: CSSUIObject = {\n [placement === \"left\" ? \"insetStart\" : \"insetEnd\"]: \"0\",\n w: fieldHeight,\n fontSize: fieldFontSize,\n pointerEvents: isClickable ? \"auto\" : \"none\",\n cursor: isClickable ? \"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"]}
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/input.tsx","../src/input-group.tsx","../src/input-addon.tsx","../src/input-context.tsx","../src/input-element.tsx"],"sourcesContent":["export { Input } from \"./input\"\nexport type { InputProps } from \"./input\"\nexport { InputGroup } from \"./input-group\"\nexport type { InputGroupProps } from \"./input-group\"\nexport { InputLeftAddon, InputRightAddon } from \"./input-addon\"\nexport type { InputAddonProps } from \"./input-addon\"\nexport { InputLeftElement, InputRightElement } from \"./input-element\"\nexport type { InputElementProps } from \"./input-element\"\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 {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n CSSUIProps,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n useCreateVars,\n} from \"@yamada-ui/core\"\nimport { cx, filterUndefined, getValidChildren } from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\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 [vars, variableProps] = useCreateVars({ ...styles.field, ...rest }, [\n \"minHeight\",\n \"minH\",\n \"height\",\n \"h\",\n \"fontSize\",\n ])\n const minHeight = variableProps.minHeight ?? variableProps.minH\n const height = variableProps.height ?? variableProps.h\n const fieldHeight = minHeight ?? height\n const fieldFontSize = variableProps.fontSize\n\n const css: CSSUIObject = {\n vars,\n ...styles.container,\n }\n\n const groupProps: CSSUIProps = {}\n\n const validChildren = getValidChildren(children)\n\n validChildren.forEach((child: any) => {\n if (fieldHeight && child.type === InputLeftElement)\n groupProps.paddingStart = `${fieldHeight} !important`\n\n if (fieldHeight && child.type === InputRightElement)\n groupProps.paddingEnd = `${fieldHeight} !important`\n\n if (child.type === InputLeftAddon) groupProps.roundedLeft = \"0px !important\"\n\n if (child.type === InputRightAddon)\n groupProps.roundedRight = \"0px !important\"\n })\n\n const cloneChildren = validChildren.map((child) => {\n const isAddonElement = [\n InputLeftAddon,\n InputRightAddon,\n InputLeftElement,\n InputRightElement,\n ].some((type) => child.type === type)\n\n if (isAddonElement) {\n return child\n } else {\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 cloneElement(child, Object.assign(childProps, groupProps))\n }\n })\n\n return (\n <InputGroupProvider value={{ styles, fieldHeight, fieldFontSize }}>\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 { 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: \"0px !important\",\n },\n right: {\n ms: \"-1px\",\n roundedLeft: \"0px !important\",\n },\n }\n\n const css: CSSUIObject = {\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 styles: { [key: string]: CSSUIObject }\n fieldHeight: string | undefined\n fieldFontSize: string | undefined\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 isClickable?: 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, isClickable = false, placement = \"left\", ...rest }, ref) => {\n const { styles, fieldHeight, fieldFontSize } = useInputGroup()\n\n const css: CSSUIObject = {\n [placement === \"left\" ? \"insetStart\" : \"insetEnd\"]: \"0\",\n w: fieldHeight,\n fontSize: fieldFontSize,\n pointerEvents: isClickable ? \"auto\" : \"none\",\n cursor: isClickable ? \"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/index.mjs
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
"use client"
|
2
2
|
import {
|
3
3
|
InputGroup
|
4
|
-
} from "./chunk-
|
4
|
+
} from "./chunk-I3CWDP7I.mjs";
|
5
5
|
import {
|
6
6
|
InputLeftAddon,
|
7
7
|
InputRightAddon
|
@@ -9,7 +9,7 @@ import {
|
|
9
9
|
import {
|
10
10
|
InputLeftElement,
|
11
11
|
InputRightElement
|
12
|
-
} from "./chunk-
|
12
|
+
} from "./chunk-VRKOB3SX.mjs";
|
13
13
|
import "./chunk-7DAXKPYU.mjs";
|
14
14
|
import {
|
15
15
|
Input
|
package/dist/input-element.d.mts
CHANGED
@@ -2,14 +2,6 @@ import * as _yamada_ui_core from '@yamada-ui/core';
|
|
2
2
|
import { HTMLUIProps } from '@yamada-ui/core';
|
3
3
|
|
4
4
|
interface InputElementOptions {
|
5
|
-
/**
|
6
|
-
* If `true`, the element clickable.
|
7
|
-
*
|
8
|
-
* @default false
|
9
|
-
*
|
10
|
-
* @deprecated Use `isClickable` instead.
|
11
|
-
*/
|
12
|
-
isClick?: boolean;
|
13
5
|
/**
|
14
6
|
* If `true`, the element clickable.
|
15
7
|
*
|
package/dist/input-element.d.ts
CHANGED
@@ -2,14 +2,6 @@ import * as _yamada_ui_core from '@yamada-ui/core';
|
|
2
2
|
import { HTMLUIProps } from '@yamada-ui/core';
|
3
3
|
|
4
4
|
interface InputElementOptions {
|
5
|
-
/**
|
6
|
-
* If `true`, the element clickable.
|
7
|
-
*
|
8
|
-
* @default false
|
9
|
-
*
|
10
|
-
* @deprecated Use `isClickable` instead.
|
11
|
-
*/
|
12
|
-
isClick?: boolean;
|
13
5
|
/**
|
14
6
|
* If `true`, the element clickable.
|
15
7
|
*
|
package/dist/input-element.js
CHANGED
@@ -38,9 +38,8 @@ var [InputGroupProvider, useInputGroup] = (0, import_utils.createContext)({
|
|
38
38
|
// src/input-element.tsx
|
39
39
|
var import_jsx_runtime = require("react/jsx-runtime");
|
40
40
|
var InputElement = (0, import_core.forwardRef)(
|
41
|
-
({ className,
|
41
|
+
({ className, isClickable = false, placement = "left", ...rest }, ref) => {
|
42
42
|
const { styles, fieldHeight, fieldFontSize } = useInputGroup();
|
43
|
-
isClickable != null ? isClickable : isClickable = isClick;
|
44
43
|
const css = {
|
45
44
|
[placement === "left" ? "insetStart" : "insetEnd"]: "0",
|
46
45
|
w: fieldHeight,
|
@@ -1 +1 @@
|
|
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
|
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 isClickable?: 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, isClickable = false, placement = \"left\", ...rest }, ref) => {\n const { styles, fieldHeight, fieldFontSize } = useInputGroup()\n\n const css: CSSUIObject = {\n [placement === \"left\" ? \"insetStart\" : \"insetEnd\"]: \"0\",\n w: fieldHeight,\n fontSize: fieldFontSize,\n pointerEvents: isClickable ? \"auto\" : \"none\",\n cursor: isClickable ? \"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 styles: { [key: string]: CSSUIObject }\n fieldHeight: string | undefined\n fieldFontSize: string | undefined\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;AAQvB,IAAM,CAAC,oBAAoB,aAAa,QAC7C,4BAAiC;AAAA,EAC/B,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;ADuBG;AAdN,IAAM,mBAAe;AAAA,EACnB,CAAC,EAAE,WAAW,cAAc,OAAO,YAAY,QAAQ,GAAG,KAAK,GAAG,QAAQ;AACxE,UAAM,EAAE,QAAQ,aAAa,cAAc,IAAI,cAAc;AAE7D,UAAM,MAAmB;AAAA,MACvB,CAAC,cAAc,SAAS,eAAe,UAAU,GAAG;AAAA,MACpD,GAAG;AAAA,MACH,UAAU;AAAA,MACV,eAAe,cAAc,SAAS;AAAA,MACtC,QAAQ,cAAc,YAAY;AAAA,MAClC,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.js
CHANGED
@@ -101,9 +101,8 @@ var import_core2 = require("@yamada-ui/core");
|
|
101
101
|
var import_utils3 = require("@yamada-ui/utils");
|
102
102
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
103
103
|
var InputElement = (0, import_core2.forwardRef)(
|
104
|
-
({ className,
|
104
|
+
({ className, isClickable = false, placement = "left", ...rest }, ref) => {
|
105
105
|
const { styles, fieldHeight, fieldFontSize } = useInputGroup();
|
106
|
-
isClickable != null ? isClickable : isClickable = isClick;
|
107
106
|
const css = {
|
108
107
|
[placement === "left" ? "insetStart" : "insetEnd"]: "0",
|
109
108
|
w: fieldHeight,
|
package/dist/input-group.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/input-group.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 useCreateVars,\n} from \"@yamada-ui/core\"\nimport { cx, filterUndefined, getValidChildren } from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\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 [vars, variableProps] = useCreateVars({ ...styles.field, ...rest }, [\n \"minHeight\",\n \"minH\",\n \"height\",\n \"h\",\n \"fontSize\",\n ])\n const minHeight = variableProps.minHeight ?? variableProps.minH\n const height = variableProps.height ?? variableProps.h\n const fieldHeight = minHeight ?? height\n const fieldFontSize = variableProps.fontSize\n\n const css: CSSUIObject = {\n vars,\n ...styles.container,\n }\n\n const groupProps: CSSUIProps = {}\n\n const validChildren = getValidChildren(children)\n\n validChildren.forEach((child: any) => {\n if (fieldHeight && child.type === InputLeftElement)\n groupProps.paddingStart = `${fieldHeight} !important`\n\n if (fieldHeight && child.type === InputRightElement)\n groupProps.paddingEnd = `${fieldHeight} !important`\n\n if (child.type === InputLeftAddon) groupProps.roundedLeft = \"0px !important\"\n\n if (child.type === InputRightAddon)\n groupProps.roundedRight = \"0px !important\"\n })\n\n const cloneChildren = validChildren.map((child) => {\n const isAddonElement = [\n InputLeftAddon,\n InputRightAddon,\n InputLeftElement,\n InputRightElement,\n ].some((type) => child.type === type)\n\n if (isAddonElement) {\n return child\n } else {\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 cloneElement(child, Object.assign(childProps, groupProps))\n }\n })\n\n return (\n <InputGroupProvider value={{ styles, fieldHeight, fieldFontSize }}>\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 { 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: \"0px !important\",\n },\n right: {\n ms: \"-1px\",\n roundedLeft: \"0px !important\",\n },\n }\n\n const css: CSSUIObject = {\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 styles: { [key: string]: CSSUIObject }\n fieldHeight: string | undefined\n fieldFontSize: string | undefined\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 * @deprecated Use `isClickable` instead.\n */\n isClick?: boolean\n /**\n * If `true`, the element clickable.\n *\n * @default false\n */\n isClickable?: 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 (\n { className, isClick = false, isClickable, placement = \"left\", ...rest },\n ref,\n ) => {\n const { styles, fieldHeight, fieldFontSize } = useInputGroup()\n\n isClickable ??= isClick\n\n const css: CSSUIObject = {\n [placement === \"left\" ? \"insetStart\" : \"insetEnd\"]: \"0\",\n w: fieldHeight,\n fontSize: fieldFontSize,\n pointerEvents: isClickable ? \"auto\" : \"none\",\n cursor: isClickable ? \"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_utils","import_core","import_utils","import_jsx_runtime","import_jsx_runtime","_a","_b"]}
|
1
|
+
{"version":3,"sources":["../src/input-group.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 useCreateVars,\n} from \"@yamada-ui/core\"\nimport { cx, filterUndefined, getValidChildren } from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\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 [vars, variableProps] = useCreateVars({ ...styles.field, ...rest }, [\n \"minHeight\",\n \"minH\",\n \"height\",\n \"h\",\n \"fontSize\",\n ])\n const minHeight = variableProps.minHeight ?? variableProps.minH\n const height = variableProps.height ?? variableProps.h\n const fieldHeight = minHeight ?? height\n const fieldFontSize = variableProps.fontSize\n\n const css: CSSUIObject = {\n vars,\n ...styles.container,\n }\n\n const groupProps: CSSUIProps = {}\n\n const validChildren = getValidChildren(children)\n\n validChildren.forEach((child: any) => {\n if (fieldHeight && child.type === InputLeftElement)\n groupProps.paddingStart = `${fieldHeight} !important`\n\n if (fieldHeight && child.type === InputRightElement)\n groupProps.paddingEnd = `${fieldHeight} !important`\n\n if (child.type === InputLeftAddon) groupProps.roundedLeft = \"0px !important\"\n\n if (child.type === InputRightAddon)\n groupProps.roundedRight = \"0px !important\"\n })\n\n const cloneChildren = validChildren.map((child) => {\n const isAddonElement = [\n InputLeftAddon,\n InputRightAddon,\n InputLeftElement,\n InputRightElement,\n ].some((type) => child.type === type)\n\n if (isAddonElement) {\n return child\n } else {\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 cloneElement(child, Object.assign(childProps, groupProps))\n }\n })\n\n return (\n <InputGroupProvider value={{ styles, fieldHeight, fieldFontSize }}>\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 { 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: \"0px !important\",\n },\n right: {\n ms: \"-1px\",\n roundedLeft: \"0px !important\",\n },\n }\n\n const css: CSSUIObject = {\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 styles: { [key: string]: CSSUIObject }\n fieldHeight: string | undefined\n fieldFontSize: string | undefined\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 isClickable?: 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, isClickable = false, placement = \"left\", ...rest }, ref) => {\n const { styles, fieldHeight, fieldFontSize } = useInputGroup()\n\n const css: CSSUIObject = {\n [placement === \"left\" ? \"insetStart\" : \"insetEnd\"]: \"0\",\n w: fieldHeight,\n fontSize: fieldFontSize,\n pointerEvents: isClickable ? \"auto\" : \"none\",\n cursor: isClickable ? \"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_utils","import_core","import_utils","import_jsx_runtime","import_jsx_runtime","_a","_b"]}
|
package/dist/input-group.mjs
CHANGED
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@yamada-ui/input",
|
3
|
-
"version": "2.0.0-next-
|
3
|
+
"version": "2.0.0-next-20241005235555",
|
4
4
|
"description": "Yamada UI input component",
|
5
5
|
"keywords": [
|
6
6
|
"yamada",
|
@@ -36,10 +36,10 @@
|
|
36
36
|
"url": "https://github.com/yamada-ui/yamada-ui/issues"
|
37
37
|
},
|
38
38
|
"dependencies": {
|
39
|
-
"@yamada-ui/core": "1.15.2-next-
|
40
|
-
"@yamada-ui/file-input": "2.0.0-next-
|
41
|
-
"@yamada-ui/form-control": "3.0.0-next-
|
42
|
-
"@yamada-ui/use-token": "1.1.27-next-
|
39
|
+
"@yamada-ui/core": "1.15.2-next-20241005235555",
|
40
|
+
"@yamada-ui/file-input": "2.0.0-next-20241005235555",
|
41
|
+
"@yamada-ui/form-control": "3.0.0-next-20241005235555",
|
42
|
+
"@yamada-ui/use-token": "1.1.27-next-20241005235555",
|
43
43
|
"@yamada-ui/utils": "1.5.2"
|
44
44
|
},
|
45
45
|
"devDependencies": {
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"sources":["../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-context\"\n\ninterface InputElementOptions {\n /**\n * If `true`, the element clickable.\n *\n * @default false\n *\n * @deprecated Use `isClickable` instead.\n */\n isClick?: boolean\n /**\n * If `true`, the element clickable.\n *\n * @default false\n */\n isClickable?: 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 (\n { className, isClick = false, isClickable, placement = \"left\", ...rest },\n ref,\n ) => {\n const { styles, fieldHeight, fieldFontSize } = useInputGroup()\n\n isClickable ??= isClick\n\n const css: CSSUIObject = {\n [placement === \"left\" ? \"insetStart\" : \"insetEnd\"]: \"0\",\n w: fieldHeight,\n fontSize: fieldFontSize,\n pointerEvents: isClickable ? \"auto\" : \"none\",\n cursor: isClickable ? \"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":";;;;;;AACA,SAAS,IAAI,kBAAkB;AAC/B,SAAS,UAAU;AA+Cb;AAnBN,IAAM,eAAe;AAAA,EACnB,CACE,EAAE,WAAW,UAAU,OAAO,aAAa,YAAY,QAAQ,GAAG,KAAK,GACvE,QACG;AACH,UAAM,EAAE,QAAQ,aAAa,cAAc,IAAI,cAAc;AAE7D,sDAAgB;AAEhB,UAAM,MAAmB;AAAA,MACvB,CAAC,cAAc,SAAS,eAAe,UAAU,GAAG;AAAA,MACpD,GAAG;AAAA,MACH,UAAU;AAAA,MACV,eAAe,cAAc,SAAS;AAAA,MACtC,QAAQ,cAAc,YAAY;AAAA,MAClC,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,WAAW,GAAG,qBAAqB,SAAS;AAAA,QAC5C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEO,IAAM,mBAAmB;AAAA,EAC9B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,2BAA2B,SAAS;AAAA,QAClD,WAAU;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEO,IAAM,oBAAoB;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,4BAA4B,SAAS;AAAA,QACnD,WAAU;AAAA,QACT,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;","names":[]}
|
File without changes
|