npm - @negative-space/input - Versions diffs - 1.1.0 → 1.3.0 - Mend

@negative-space/input 1.1.0 → 1.3.0

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.

Files changed (7) hide show

package/dist/index.d.mts CHANGED Viewed

@@ -28,8 +28,8 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, '
         suffix?: React.CSSProperties;
         spinner?: React.CSSProperties;
     };
-    label?: string;
-    error?: string;
+    label?: React.ReactNode;
+    error?: React.ReactNode;
     prefix?: React.ReactNode;
     suffix?: React.ReactNode;
     htmlFor?: string;

package/dist/index.d.ts CHANGED Viewed

@@ -28,8 +28,8 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, '
         suffix?: React.CSSProperties;
         spinner?: React.CSSProperties;
     };
-    label?: string;
-    error?: string;
+    label?: React.ReactNode;
+    error?: React.ReactNode;
     prefix?: React.ReactNode;
     suffix?: React.ReactNode;
     htmlFor?: string;

package/dist/index.js CHANGED Viewed

@@ -91,7 +91,7 @@ var InputPassword = React__default.default.forwardRef(
   ({ onToggleVisibility, title, classNames, styles, buttonProps, ...rest }, ref) => {
     const { global, components } = system.useNSUI();
     const [visible, setVisible] = React__default.default.useState(false);
-    const Title = title ?? (visible ? components.inputPassword.passwordTitle : components.inputPassword.textTitle);
+    const Title = title ?? (visible ? components.inputPassword?.passwordTitle : components.inputPassword?.textTitle);
     const tooltip$1 = tooltip.useTooltip();
     const handleToggle = () => {
       setVisible((prev) => {
@@ -121,9 +121,21 @@ var InputPassword = React__default.default.forwardRef(
               onClick: handleToggle,
               title: !global.tooltip ? Title : void 0,
               "aria-label": Title,
-              className: classNames?.button,
+              className: system.cn(`${global.prefixCls}-input-password-button`, classNames?.button),
               style: styles?.button,
-              children: visible ? /* @__PURE__ */ jsxRuntime.jsx(system.EyeOff, { className: classNames?.icon, style: styles?.icon }) : /* @__PURE__ */ jsxRuntime.jsx(system.Eye, { className: classNames?.icon, style: styles?.icon })
+              children: visible ? /* @__PURE__ */ jsxRuntime.jsx(
+                system.EyeOff,
+                {
+                  className: system.cn(`${global.prefixCls}-input-password-icon`, classNames?.icon),
+                  style: styles?.icon
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx(
+                system.Eye,
+                {
+                  className: system.cn(`${global.prefixCls}-input-password-icon`, classNames?.icon),
+                  style: styles?.icon
+                }
+              )
             }
           )
         }

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/Input.tsx","../src/InputPassword.tsx"],"names":["React","useNSUI","jsx","Spinner","Field","jsxs","Flex","cn","tooltip","useTooltip","Fragment","IconButton","EyeOff","Eye","Tooltip"],"mappings":"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","file":"index.js","sourcesContent":["import { Field } from '@negative-space/field'\nimport { Flex } from '@negative-space/flex'\nimport { Spinner, type SpinnerProps } from '@negative-space/spinner'\nimport { cn, useNSUI } from '@negative-space/system'\nimport React from 'react'\n\nexport interface InputProps extends Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'className' \| 'prefix' \| 'style'\n> {\n classNames?: {\n field?: {\n root?: string\n label?: string\n error?: string\n }\n root?: string\n prefix?: string\n content?: string\n suffix?: string\n spinner?: string\n }\n styles?: {\n field?: {\n root?: React.CSSProperties\n label?: React.CSSProperties\n error?: React.CSSProperties\n }\n root?: React.CSSProperties\n prefix?: React.CSSProperties\n content?: React.CSSProperties\n suffix?: React.CSSProperties\n spinner?: React.CSSProperties\n }\n label?: string\n error?: string\n prefix?: React.ReactNode\n suffix?: React.ReactNode\n htmlFor?: string\n loading?: boolean\n spinnerPosition?: 'prefix' \| 'suffix'\n spinnerProps?: Omit<SpinnerProps, 'loading' \| 'className' \| 'style'>\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n (\n {\n classNames,\n styles,\n label,\n error,\n prefix,\n suffix,\n htmlFor,\n id,\n loading = false,\n spinnerPosition = 'suffix',\n spinnerProps,\n disabled,\n ...props\n },\n ref\n ) => {\n const { global } = useNSUI()\n const generatedId = React.useId()\n const inputId = id ?? generatedId\n\n const resolvedSpinner = (\n <Spinner loading className={classNames?.spinner} style={styles?.spinner} {...spinnerProps} />\n )\n\n const showPrefix = prefix \|\| (loading && spinnerPosition === 'prefix')\n const showSuffix = suffix \|\| (loading && spinnerPosition === 'suffix')\n\n return (\n <Field\n classNames={classNames?.field}\n styles={styles?.field}\n label={label}\n error={error}\n htmlFor={htmlFor ?? inputId}\n >\n <Flex\n alignItems=\"center\"\n className={cn(`${global.prefixCls}-input-root`, classNames?.root)}\n style={{ marginTop: '6px', ...styles?.root }}\n >\n {showPrefix && (\n <span\n className={cn(`${global.prefixCls}-input-prefix`, classNames?.prefix)}\n style={{ display: 'flex', alignItems: 'center', ...styles?.prefix }}\n >\n {loading && spinnerPosition === 'prefix' ? resolvedSpinner : prefix}\n </span>\n )}\n\n <input\n {...props}\n ref={ref}\n id={inputId}\n disabled={disabled \|\| loading}\n data-loading={loading}\n className={cn(`${global.prefixCls}-input-content`, classNames?.content)}\n style={{ outline: 'none', flex: 1, minWidth: 0, ...styles?.content }}\n />\n\n {showSuffix && (\n <span\n className={cn(`${global.prefixCls}-input-suffix`, classNames?.suffix)}\n style={{ display: 'flex', alignItems: 'center', ...styles?.suffix }}\n >\n {loading && spinnerPosition === 'suffix' ? resolvedSpinner : suffix}\n </span>\n )}\n </Flex>\n </Field>\n )\n }\n)\n\nInput.displayName = 'Input'\n","import { IconButton, type IconButtonProps } from '@negative-space/button'\nimport { cn, Eye, EyeOff, useNSUI } from '@negative-space/system'\nimport { Tooltip, type TooltipProps, useTooltip } from '@negative-space/tooltip'\nimport React from 'react'\n\nimport { Input, type InputProps } from '.'\n\nexport interface InputPasswordProps extends Omit<\n InputProps,\n 'classNames' \| 'styles' \| 'suffix' \| 'type'\n> {\n classNames?: InputProps['classNames'] & {\n button?: string\n icon?: string\n tooltip?: TooltipProps['classNames']\n }\n styles?: InputProps['styles'] & {\n button?: React.CSSProperties\n icon?: React.CSSProperties\n tooltip?: TooltipProps['styles']\n }\n onToggleVisibility?: (visible: boolean) => void\n buttonProps?: Omit<IconButtonProps, 'onClick' \| 'aria-label'>\n}\n\nexport const InputPassword = React.forwardRef<HTMLInputElement, InputPasswordProps>(\n ({ onToggleVisibility, title, classNames, styles, buttonProps, ...rest }, ref) => {\n const { global, components } = useNSUI()\n const [visible, setVisible] = React.useState(false)\n\n const Title =\n title ??\n (visible ? components.inputPassword.passwordTitle : components.inputPassword.textTitle)\n\n const tooltip = useTooltip()\n\n const handleToggle = () => {\n setVisible((prev) => {\n const next = !prev\n onToggleVisibility?.(next)\n return next\n })\n }\n\n return (\n <>\n <Input\n {...rest}\n ref={ref}\n type={visible ? 'text' : 'password'}\n data-visible={visible}\n classNames={{\n ...classNames,\n root: cn(classNames?.root, `${global.prefixCls}-input-password`)\n }}\n styles={styles}\n suffix={\n <IconButton\n {...buttonProps}\n {...tooltip.triggerProps}\n onClick={handleToggle}\n title={!global.tooltip ? Title : undefined}\n aria-label={Title}\n className={classNames?.button}\n style={styles?.button}\n >\n {visible ? (\n <EyeOff className={classNames?.icon} style={styles?.icon} />\n ) : (\n <Eye className={classNames?.icon} style={styles?.icon} />\n )}\n </IconButton>\n }\n />\n {global.tooltip && (\n <Tooltip tooltip={tooltip} classNames={classNames?.tooltip} styles={styles?.tooltip}>\n {Title}\n </Tooltip>\n )}\n </>\n )\n }\n)\n\nInputPassword.displayName = 'InputPassword'\n"]}
1	+ {"version":3,"sources":["../src/Input.tsx","../src/InputPassword.tsx"],"names":["React","useNSUI","jsx","Spinner","Field","jsxs","Flex","cn","tooltip","useTooltip","Fragment","IconButton","EyeOff","Eye","Tooltip"],"mappings":"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","file":"index.js","sourcesContent":["import { Field } from '@negative-space/field'\nimport { Flex } from '@negative-space/flex'\nimport { Spinner, type SpinnerProps } from '@negative-space/spinner'\nimport { cn, useNSUI } from '@negative-space/system'\nimport React from 'react'\n\nexport interface InputProps extends Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'className' \| 'prefix' \| 'style'\n> {\n classNames?: {\n field?: {\n root?: string\n label?: string\n error?: string\n }\n root?: string\n prefix?: string\n content?: string\n suffix?: string\n spinner?: string\n }\n styles?: {\n field?: {\n root?: React.CSSProperties\n label?: React.CSSProperties\n error?: React.CSSProperties\n }\n root?: React.CSSProperties\n prefix?: React.CSSProperties\n content?: React.CSSProperties\n suffix?: React.CSSProperties\n spinner?: React.CSSProperties\n }\n label?: React.ReactNode\n error?: React.ReactNode\n prefix?: React.ReactNode\n suffix?: React.ReactNode\n htmlFor?: string\n loading?: boolean\n spinnerPosition?: 'prefix' \| 'suffix'\n spinnerProps?: Omit<SpinnerProps, 'loading' \| 'className' \| 'style'>\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n (\n {\n classNames,\n styles,\n label,\n error,\n prefix,\n suffix,\n htmlFor,\n id,\n loading = false,\n spinnerPosition = 'suffix',\n spinnerProps,\n disabled,\n ...props\n },\n ref\n ) => {\n const { global } = useNSUI()\n const generatedId = React.useId()\n const inputId = id ?? generatedId\n\n const resolvedSpinner = (\n <Spinner loading className={classNames?.spinner} style={styles?.spinner} {...spinnerProps} />\n )\n\n const showPrefix = prefix \|\| (loading && spinnerPosition === 'prefix')\n const showSuffix = suffix \|\| (loading && spinnerPosition === 'suffix')\n\n return (\n <Field\n classNames={classNames?.field}\n styles={styles?.field}\n label={label}\n error={error}\n htmlFor={htmlFor ?? inputId}\n >\n <Flex\n alignItems=\"center\"\n className={cn(`${global.prefixCls}-input-root`, classNames?.root)}\n style={{ marginTop: '6px', ...styles?.root }}\n >\n {showPrefix && (\n <span\n className={cn(`${global.prefixCls}-input-prefix`, classNames?.prefix)}\n style={{ display: 'flex', alignItems: 'center', ...styles?.prefix }}\n >\n {loading && spinnerPosition === 'prefix' ? resolvedSpinner : prefix}\n </span>\n )}\n\n <input\n {...props}\n ref={ref}\n id={inputId}\n disabled={disabled \|\| loading}\n data-loading={loading}\n className={cn(`${global.prefixCls}-input-content`, classNames?.content)}\n style={{ outline: 'none', flex: 1, minWidth: 0, ...styles?.content }}\n />\n\n {showSuffix && (\n <span\n className={cn(`${global.prefixCls}-input-suffix`, classNames?.suffix)}\n style={{ display: 'flex', alignItems: 'center', ...styles?.suffix }}\n >\n {loading && spinnerPosition === 'suffix' ? resolvedSpinner : suffix}\n </span>\n )}\n </Flex>\n </Field>\n )\n }\n)\n\nInput.displayName = 'Input'\n","import { IconButton, type IconButtonProps } from '@negative-space/button'\nimport { cn, Eye, EyeOff, useNSUI } from '@negative-space/system'\nimport { Tooltip, type TooltipProps, useTooltip } from '@negative-space/tooltip'\nimport React from 'react'\n\nimport { Input, type InputProps } from '.'\n\nexport interface InputPasswordProps extends Omit<\n InputProps,\n 'classNames' \| 'styles' \| 'suffix' \| 'type'\n> {\n classNames?: InputProps['classNames'] & {\n button?: string\n icon?: string\n tooltip?: TooltipProps['classNames']\n }\n styles?: InputProps['styles'] & {\n button?: React.CSSProperties\n icon?: React.CSSProperties\n tooltip?: TooltipProps['styles']\n }\n onToggleVisibility?: (visible: boolean) => void\n buttonProps?: Omit<IconButtonProps, 'onClick' \| 'aria-label'>\n}\n\nexport const InputPassword = React.forwardRef<HTMLInputElement, InputPasswordProps>(\n ({ onToggleVisibility, title, classNames, styles, buttonProps, ...rest }, ref) => {\n const { global, components } = useNSUI()\n const [visible, setVisible] = React.useState(false)\n\n const Title =\n title ??\n (visible ? components.inputPassword?.passwordTitle : components.inputPassword?.textTitle)\n\n const tooltip = useTooltip()\n\n const handleToggle = () => {\n setVisible((prev) => {\n const next = !prev\n onToggleVisibility?.(next)\n return next\n })\n }\n\n return (\n <>\n <Input\n {...rest}\n ref={ref}\n type={visible ? 'text' : 'password'}\n data-visible={visible}\n classNames={{\n ...classNames,\n root: cn(classNames?.root, `${global.prefixCls}-input-password`)\n }}\n styles={styles}\n suffix={\n <IconButton\n {...buttonProps}\n {...tooltip.triggerProps}\n onClick={handleToggle}\n title={!global.tooltip ? Title : undefined}\n aria-label={Title}\n className={cn(`${global.prefixCls}-input-password-button`, classNames?.button)}\n style={styles?.button}\n >\n {visible ? (\n <EyeOff\n className={cn(`${global.prefixCls}-input-password-icon`, classNames?.icon)}\n style={styles?.icon}\n />\n ) : (\n <Eye\n className={cn(`${global.prefixCls}-input-password-icon`, classNames?.icon)}\n style={styles?.icon}\n />\n )}\n </IconButton>\n }\n />\n {global.tooltip && (\n <Tooltip tooltip={tooltip} classNames={classNames?.tooltip} styles={styles?.tooltip}>\n {Title}\n </Tooltip>\n )}\n </>\n )\n }\n)\n\nInputPassword.displayName = 'InputPassword'\n"]}

package/dist/index.mjs CHANGED Viewed

@@ -85,7 +85,7 @@ var InputPassword = React.forwardRef(
   ({ onToggleVisibility, title, classNames, styles, buttonProps, ...rest }, ref) => {
     const { global, components } = useNSUI();
     const [visible, setVisible] = React.useState(false);
-    const Title = title ?? (visible ? components.inputPassword.passwordTitle : components.inputPassword.textTitle);
+    const Title = title ?? (visible ? components.inputPassword?.passwordTitle : components.inputPassword?.textTitle);
     const tooltip = useTooltip();
     const handleToggle = () => {
       setVisible((prev) => {
@@ -115,9 +115,21 @@ var InputPassword = React.forwardRef(
               onClick: handleToggle,
               title: !global.tooltip ? Title : void 0,
               "aria-label": Title,
-              className: classNames?.button,
+              className: cn(`${global.prefixCls}-input-password-button`, classNames?.button),
               style: styles?.button,
-              children: visible ? /* @__PURE__ */ jsx(EyeOff, { className: classNames?.icon, style: styles?.icon }) : /* @__PURE__ */ jsx(Eye, { className: classNames?.icon, style: styles?.icon })
+              children: visible ? /* @__PURE__ */ jsx(
+                EyeOff,
+                {
+                  className: cn(`${global.prefixCls}-input-password-icon`, classNames?.icon),
+                  style: styles?.icon
+                }
+              ) : /* @__PURE__ */ jsx(
+                Eye,
+                {
+                  className: cn(`${global.prefixCls}-input-password-icon`, classNames?.icon),
+                  style: styles?.icon
+                }
+              )
             }
           )
         }

package/dist/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/Input.tsx","../src/InputPassword.tsx"],"names":["React","useNSUI","jsxs","jsx","cn"],"mappings":"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","file":"index.mjs","sourcesContent":["import { Field } from '@negative-space/field'\nimport { Flex } from '@negative-space/flex'\nimport { Spinner, type SpinnerProps } from '@negative-space/spinner'\nimport { cn, useNSUI } from '@negative-space/system'\nimport React from 'react'\n\nexport interface InputProps extends Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'className' \| 'prefix' \| 'style'\n> {\n classNames?: {\n field?: {\n root?: string\n label?: string\n error?: string\n }\n root?: string\n prefix?: string\n content?: string\n suffix?: string\n spinner?: string\n }\n styles?: {\n field?: {\n root?: React.CSSProperties\n label?: React.CSSProperties\n error?: React.CSSProperties\n }\n root?: React.CSSProperties\n prefix?: React.CSSProperties\n content?: React.CSSProperties\n suffix?: React.CSSProperties\n spinner?: React.CSSProperties\n }\n label?: string\n error?: string\n prefix?: React.ReactNode\n suffix?: React.ReactNode\n htmlFor?: string\n loading?: boolean\n spinnerPosition?: 'prefix' \| 'suffix'\n spinnerProps?: Omit<SpinnerProps, 'loading' \| 'className' \| 'style'>\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n (\n {\n classNames,\n styles,\n label,\n error,\n prefix,\n suffix,\n htmlFor,\n id,\n loading = false,\n spinnerPosition = 'suffix',\n spinnerProps,\n disabled,\n ...props\n },\n ref\n ) => {\n const { global } = useNSUI()\n const generatedId = React.useId()\n const inputId = id ?? generatedId\n\n const resolvedSpinner = (\n <Spinner loading className={classNames?.spinner} style={styles?.spinner} {...spinnerProps} />\n )\n\n const showPrefix = prefix \|\| (loading && spinnerPosition === 'prefix')\n const showSuffix = suffix \|\| (loading && spinnerPosition === 'suffix')\n\n return (\n <Field\n classNames={classNames?.field}\n styles={styles?.field}\n label={label}\n error={error}\n htmlFor={htmlFor ?? inputId}\n >\n <Flex\n alignItems=\"center\"\n className={cn(`${global.prefixCls}-input-root`, classNames?.root)}\n style={{ marginTop: '6px', ...styles?.root }}\n >\n {showPrefix && (\n <span\n className={cn(`${global.prefixCls}-input-prefix`, classNames?.prefix)}\n style={{ display: 'flex', alignItems: 'center', ...styles?.prefix }}\n >\n {loading && spinnerPosition === 'prefix' ? resolvedSpinner : prefix}\n </span>\n )}\n\n <input\n {...props}\n ref={ref}\n id={inputId}\n disabled={disabled \|\| loading}\n data-loading={loading}\n className={cn(`${global.prefixCls}-input-content`, classNames?.content)}\n style={{ outline: 'none', flex: 1, minWidth: 0, ...styles?.content }}\n />\n\n {showSuffix && (\n <span\n className={cn(`${global.prefixCls}-input-suffix`, classNames?.suffix)}\n style={{ display: 'flex', alignItems: 'center', ...styles?.suffix }}\n >\n {loading && spinnerPosition === 'suffix' ? resolvedSpinner : suffix}\n </span>\n )}\n </Flex>\n </Field>\n )\n }\n)\n\nInput.displayName = 'Input'\n","import { IconButton, type IconButtonProps } from '@negative-space/button'\nimport { cn, Eye, EyeOff, useNSUI } from '@negative-space/system'\nimport { Tooltip, type TooltipProps, useTooltip } from '@negative-space/tooltip'\nimport React from 'react'\n\nimport { Input, type InputProps } from '.'\n\nexport interface InputPasswordProps extends Omit<\n InputProps,\n 'classNames' \| 'styles' \| 'suffix' \| 'type'\n> {\n classNames?: InputProps['classNames'] & {\n button?: string\n icon?: string\n tooltip?: TooltipProps['classNames']\n }\n styles?: InputProps['styles'] & {\n button?: React.CSSProperties\n icon?: React.CSSProperties\n tooltip?: TooltipProps['styles']\n }\n onToggleVisibility?: (visible: boolean) => void\n buttonProps?: Omit<IconButtonProps, 'onClick' \| 'aria-label'>\n}\n\nexport const InputPassword = React.forwardRef<HTMLInputElement, InputPasswordProps>(\n ({ onToggleVisibility, title, classNames, styles, buttonProps, ...rest }, ref) => {\n const { global, components } = useNSUI()\n const [visible, setVisible] = React.useState(false)\n\n const Title =\n title ??\n (visible ? components.inputPassword.passwordTitle : components.inputPassword.textTitle)\n\n const tooltip = useTooltip()\n\n const handleToggle = () => {\n setVisible((prev) => {\n const next = !prev\n onToggleVisibility?.(next)\n return next\n })\n }\n\n return (\n <>\n <Input\n {...rest}\n ref={ref}\n type={visible ? 'text' : 'password'}\n data-visible={visible}\n classNames={{\n ...classNames,\n root: cn(classNames?.root, `${global.prefixCls}-input-password`)\n }}\n styles={styles}\n suffix={\n <IconButton\n {...buttonProps}\n {...tooltip.triggerProps}\n onClick={handleToggle}\n title={!global.tooltip ? Title : undefined}\n aria-label={Title}\n className={classNames?.button}\n style={styles?.button}\n >\n {visible ? (\n <EyeOff className={classNames?.icon} style={styles?.icon} />\n ) : (\n <Eye className={classNames?.icon} style={styles?.icon} />\n )}\n </IconButton>\n }\n />\n {global.tooltip && (\n <Tooltip tooltip={tooltip} classNames={classNames?.tooltip} styles={styles?.tooltip}>\n {Title}\n </Tooltip>\n )}\n </>\n )\n }\n)\n\nInputPassword.displayName = 'InputPassword'\n"]}
1	+ {"version":3,"sources":["../src/Input.tsx","../src/InputPassword.tsx"],"names":["React","useNSUI","jsxs","jsx","cn"],"mappings":"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","file":"index.mjs","sourcesContent":["import { Field } from '@negative-space/field'\nimport { Flex } from '@negative-space/flex'\nimport { Spinner, type SpinnerProps } from '@negative-space/spinner'\nimport { cn, useNSUI } from '@negative-space/system'\nimport React from 'react'\n\nexport interface InputProps extends Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'className' \| 'prefix' \| 'style'\n> {\n classNames?: {\n field?: {\n root?: string\n label?: string\n error?: string\n }\n root?: string\n prefix?: string\n content?: string\n suffix?: string\n spinner?: string\n }\n styles?: {\n field?: {\n root?: React.CSSProperties\n label?: React.CSSProperties\n error?: React.CSSProperties\n }\n root?: React.CSSProperties\n prefix?: React.CSSProperties\n content?: React.CSSProperties\n suffix?: React.CSSProperties\n spinner?: React.CSSProperties\n }\n label?: React.ReactNode\n error?: React.ReactNode\n prefix?: React.ReactNode\n suffix?: React.ReactNode\n htmlFor?: string\n loading?: boolean\n spinnerPosition?: 'prefix' \| 'suffix'\n spinnerProps?: Omit<SpinnerProps, 'loading' \| 'className' \| 'style'>\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n (\n {\n classNames,\n styles,\n label,\n error,\n prefix,\n suffix,\n htmlFor,\n id,\n loading = false,\n spinnerPosition = 'suffix',\n spinnerProps,\n disabled,\n ...props\n },\n ref\n ) => {\n const { global } = useNSUI()\n const generatedId = React.useId()\n const inputId = id ?? generatedId\n\n const resolvedSpinner = (\n <Spinner loading className={classNames?.spinner} style={styles?.spinner} {...spinnerProps} />\n )\n\n const showPrefix = prefix \|\| (loading && spinnerPosition === 'prefix')\n const showSuffix = suffix \|\| (loading && spinnerPosition === 'suffix')\n\n return (\n <Field\n classNames={classNames?.field}\n styles={styles?.field}\n label={label}\n error={error}\n htmlFor={htmlFor ?? inputId}\n >\n <Flex\n alignItems=\"center\"\n className={cn(`${global.prefixCls}-input-root`, classNames?.root)}\n style={{ marginTop: '6px', ...styles?.root }}\n >\n {showPrefix && (\n <span\n className={cn(`${global.prefixCls}-input-prefix`, classNames?.prefix)}\n style={{ display: 'flex', alignItems: 'center', ...styles?.prefix }}\n >\n {loading && spinnerPosition === 'prefix' ? resolvedSpinner : prefix}\n </span>\n )}\n\n <input\n {...props}\n ref={ref}\n id={inputId}\n disabled={disabled \|\| loading}\n data-loading={loading}\n className={cn(`${global.prefixCls}-input-content`, classNames?.content)}\n style={{ outline: 'none', flex: 1, minWidth: 0, ...styles?.content }}\n />\n\n {showSuffix && (\n <span\n className={cn(`${global.prefixCls}-input-suffix`, classNames?.suffix)}\n style={{ display: 'flex', alignItems: 'center', ...styles?.suffix }}\n >\n {loading && spinnerPosition === 'suffix' ? resolvedSpinner : suffix}\n </span>\n )}\n </Flex>\n </Field>\n )\n }\n)\n\nInput.displayName = 'Input'\n","import { IconButton, type IconButtonProps } from '@negative-space/button'\nimport { cn, Eye, EyeOff, useNSUI } from '@negative-space/system'\nimport { Tooltip, type TooltipProps, useTooltip } from '@negative-space/tooltip'\nimport React from 'react'\n\nimport { Input, type InputProps } from '.'\n\nexport interface InputPasswordProps extends Omit<\n InputProps,\n 'classNames' \| 'styles' \| 'suffix' \| 'type'\n> {\n classNames?: InputProps['classNames'] & {\n button?: string\n icon?: string\n tooltip?: TooltipProps['classNames']\n }\n styles?: InputProps['styles'] & {\n button?: React.CSSProperties\n icon?: React.CSSProperties\n tooltip?: TooltipProps['styles']\n }\n onToggleVisibility?: (visible: boolean) => void\n buttonProps?: Omit<IconButtonProps, 'onClick' \| 'aria-label'>\n}\n\nexport const InputPassword = React.forwardRef<HTMLInputElement, InputPasswordProps>(\n ({ onToggleVisibility, title, classNames, styles, buttonProps, ...rest }, ref) => {\n const { global, components } = useNSUI()\n const [visible, setVisible] = React.useState(false)\n\n const Title =\n title ??\n (visible ? components.inputPassword?.passwordTitle : components.inputPassword?.textTitle)\n\n const tooltip = useTooltip()\n\n const handleToggle = () => {\n setVisible((prev) => {\n const next = !prev\n onToggleVisibility?.(next)\n return next\n })\n }\n\n return (\n <>\n <Input\n {...rest}\n ref={ref}\n type={visible ? 'text' : 'password'}\n data-visible={visible}\n classNames={{\n ...classNames,\n root: cn(classNames?.root, `${global.prefixCls}-input-password`)\n }}\n styles={styles}\n suffix={\n <IconButton\n {...buttonProps}\n {...tooltip.triggerProps}\n onClick={handleToggle}\n title={!global.tooltip ? Title : undefined}\n aria-label={Title}\n className={cn(`${global.prefixCls}-input-password-button`, classNames?.button)}\n style={styles?.button}\n >\n {visible ? (\n <EyeOff\n className={cn(`${global.prefixCls}-input-password-icon`, classNames?.icon)}\n style={styles?.icon}\n />\n ) : (\n <Eye\n className={cn(`${global.prefixCls}-input-password-icon`, classNames?.icon)}\n style={styles?.icon}\n />\n )}\n </IconButton>\n }\n />\n {global.tooltip && (\n <Tooltip tooltip={tooltip} classNames={classNames?.tooltip} styles={styles?.tooltip}>\n {Title}\n </Tooltip>\n )}\n </>\n )\n }\n)\n\nInputPassword.displayName = 'InputPassword'\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@negative-space/input",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "publishConfig": {
     "access": "public"
   },
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@negative-space/button": "2.5.0",
-    "@negative-space/field": "1.0.1",
+    "@negative-space/field": "1.1.0",
     "@negative-space/flex": "1.2.2",
     "@negative-space/spinner": "2.2.0",
     "@negative-space/system": "1.3.0",