@sats-group/ui-lib 81.0.0 → 81.0.1
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/package.json
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var F=Object.defineProperty;var m=Object.getOwnPropertySymbols;var w=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var I=(i,e,s)=>e in i?F(i,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):i[e]=s,k=(i,e)=>{for(var s in e||(e={}))w.call(e,s)&&I(i,s,e[s]);if(m)for(var s of m(e))S.call(e,s)&&I(i,s,e[s]);return i};var C=(i,e)=>{var s={};for(var n in i)w.call(i,n)&&e.indexOf(n)<0&&(s[n]=i[n]);if(i!=null&&m)for(var n of m(i))e.indexOf(n)<0&&S.call(i,n)&&(s[n]=i[n]);return s};import G from"classnames";import*as t from"react";import p from"../text";import J from"../use-input-validation";import K from"../icons/16/info";import L from"../icons/16/error";import{themes as _,variants as l}from"./text-input.types";import{useEffect as M}from"react";const E=t.forwardRef((U,q)=>{var b=U,{customErrorMessages:i,defaultValue:e,disabled:s,hasError:n,helpText:
|
|
1
|
+
var F=Object.defineProperty;var m=Object.getOwnPropertySymbols;var w=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var I=(i,e,s)=>e in i?F(i,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):i[e]=s,k=(i,e)=>{for(var s in e||(e={}))w.call(e,s)&&I(i,s,e[s]);if(m)for(var s of m(e))S.call(e,s)&&I(i,s,e[s]);return i};var C=(i,e)=>{var s={};for(var n in i)w.call(i,n)&&e.indexOf(n)<0&&(s[n]=i[n]);if(i!=null&&m)for(var n of m(i))e.indexOf(n)<0&&S.call(i,n)&&(s[n]=i[n]);return s};import G from"classnames";import*as t from"react";import p from"../text";import J from"../use-input-validation";import K from"../icons/16/info";import L from"../icons/16/error";import{themes as _,variants as l}from"./text-input.types";import{useEffect as M}from"react";const E=t.forwardRef((U,q)=>{var b=U,{customErrorMessages:i,defaultValue:e,disabled:s,hasError:n,helpText:h,label:N,leadingIcon:o,maxLength:a,name:O,onChange:j=()=>{},placeholder:H,required:c,theme:z,trailingIcon:d,type:P="text",variant:u=l.large}=b,T=C(b,["customErrorMessages","defaultValue","disabled","hasError","helpText","label","leadingIcon","maxLength","name","onChange","placeholder","required","theme","trailingIcon","type","variant"]);const[A,f]=t.useState(0),[g,y]=t.useState(n),[B,D,x]=J(i,i?i.defaultError:void 0,g),v=a?a>0:void 0;return t.useEffect(()=>{e&&(typeof e=="string"?f(e.length):typeof e=="number"&&f(e))},[T]),M(()=>{y(n)},[n]),t.createElement("label",{className:G("text-input",{"text-input--theme-dark":z===_.dark,"text-input--theme-light":z===_.light,"text-input--disabled":s,"text-input--error":x||g,"text-input--icon":o||d,"text-input--variant-small":u===l.small,"text-input--variant-large":u===l.large})},t.createElement("div",{className:"text-input__wrapper"},t.createElement("div",{className:"text-input__label-wrapper"},t.createElement(p,{className:"text-input__label",theme:p.themes.emphasis,size:u===l.small?p.sizes.small:p.sizes.basic},N,c?t.createElement("span",{className:"text-input__asterisk"},"*"):null),v?t.createElement("div",{className:"text-input__length-counter"},t.createElement(p,{size:u===l.small?p.sizes.small:p.sizes.basic},A,"/",a)):null),t.createElement("div",{className:"text-input__input-wrapper"},o?t.createElement("div",{className:"text-input__icon"},o):null,t.createElement("input",k({className:"text-input__input",defaultValue:e,disabled:s,required:c,name:O,maxLength:v?a:void 0,onInvalid:r=>D(r),onChange:r=>{j(r),B(r),y(!1),v&&f(r.target.value.length)},placeholder:H,ref:q,type:P,"aria-label":N},T)),d?t.createElement("div",{className:"text-input__icon"},d):null),h?t.createElement("div",{className:"text-input__help"},t.createElement(K,null),t.createElement(p,{size:p.sizes.interface},h)):null,x?t.createElement("div",{"aria-hidden":"true",className:"text-input__error"},t.createElement(L,null),t.createElement(p,{size:p.sizes.interface},x)):null))});E.displayName="TextInput";const Q=Object.assign(E,{themes:_,variants:l});var it=Q;export{it as default};
|
|
2
2
|
//# sourceMappingURL=text-input.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../react/text-input/text-input.tsx"],
|
|
4
|
-
"sourcesContent": ["import cn from 'classnames';\nimport * as React from 'react';\n\nimport Text from '../text';\nimport useInputValidation from '../use-input-validation';\nimport SvgInfo from '../icons/16/info';\nimport SvgError from '../icons/16/error';\n\nimport { themes, variants, TextInput as Props } from './text-input.types';\nimport { useEffect } from 'react';\n\nconst RefTextInput = React.forwardRef<HTMLInputElement, Props>(\n (\n {\n customErrorMessages,\n defaultValue,\n disabled,\n hasError,\n helpText,\n label,\n leadingIcon,\n maxLength,\n name,\n onChange = () => {},\n placeholder,\n required,\n theme,\n trailingIcon,\n type = 'text',\n variant = variants.large,\n ...restProps\n },\n ref,\n ) => {\n const [count, setCount] = React.useState(0);\n const [isError, setIsError] = React.useState(hasError);\n const [validationOnChange, onInvalid, error] = useInputValidation(\n customErrorMessages,\n customErrorMessages ? customErrorMessages.defaultError : undefined,\n isError,\n );\n const isMaxLengthValid = maxLength ? maxLength > 0 : undefined;\n\n React.useEffect(() => {\n if (defaultValue) {\n if (typeof defaultValue === 'string') {\n setCount(defaultValue.length);\n } else if (typeof defaultValue === 'number') {\n setCount(defaultValue);\n }\n }\n }, [restProps]);\n\n useEffect(() => {\n setIsError(hasError);\n }, [hasError]);\n\n return (\n <label\n className={cn('text-input', {\n 'text-input--theme-dark': theme === themes.dark,\n 'text-input--theme-light': theme === themes.light,\n 'text-input--disabled': disabled,\n 'text-input--error': error || isError,\n 'text-input--icon': leadingIcon || trailingIcon,\n 'text-input--variant-small': variant === variants.small,\n 'text-input--variant-large': variant === variants.large,\n })}\n >\n <div className=\"text-input__wrapper\">\n <div className=\"text-input__label-wrapper\">\n <Text\n className=\"text-input__label\"\n theme={Text.themes.emphasis}\n size={\n variant === variants.small ? Text.sizes.small : Text.sizes.basic\n }\n >\n {label}\n {required ? (\n <span className=\"text-input__asterisk\">*</span>\n ) : null}\n </Text>\n {isMaxLengthValid ? (\n <div className=\"text-input__length-counter\">\n <Text\n size={\n variant === variants.small\n ? Text.sizes.small\n : Text.sizes.basic\n }\n >\n {count}/{maxLength}\n </Text>\n </div>\n ) : null}\n </div>\n\n <div className=\"text-input__input-wrapper\">\n {leadingIcon ? (\n <div className=\"text-input__icon\">{leadingIcon}</div>\n ) : null}\n <input\n className=\"text-input__input\"\n defaultValue={defaultValue}\n disabled={disabled}\n required={required}\n name={name}\n maxLength={isMaxLengthValid ? maxLength : undefined}\n onInvalid={e => onInvalid(e)}\n onChange={e => {\n onChange(e);\n validationOnChange(e);\n setIsError(false); // NOTE: We want to reset error state on change to not confuse users.\n if (isMaxLengthValid) {\n setCount(e.target.value.length);\n }\n }}\n placeholder={placeholder}\n ref={ref}\n type={type}\n aria-label={label}\n {...restProps}\n />\n {trailingIcon ? (\n <div className=\"text-input__icon\">{trailingIcon}</div>\n ) : null}\n </div>\n {helpText ? (\n <div className=\"text-input__help\">\n <
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import cn from 'classnames';\nimport * as React from 'react';\n\nimport Text from '../text';\nimport useInputValidation from '../use-input-validation';\nimport SvgInfo from '../icons/16/info';\nimport SvgError from '../icons/16/error';\n\nimport { themes, variants, TextInput as Props } from './text-input.types';\nimport { useEffect } from 'react';\n\nconst RefTextInput = React.forwardRef<HTMLInputElement, Props>(\n (\n {\n customErrorMessages,\n defaultValue,\n disabled,\n hasError,\n helpText,\n label,\n leadingIcon,\n maxLength,\n name,\n onChange = () => {},\n placeholder,\n required,\n theme,\n trailingIcon,\n type = 'text',\n variant = variants.large,\n ...restProps\n },\n ref,\n ) => {\n const [count, setCount] = React.useState(0);\n const [isError, setIsError] = React.useState(hasError);\n const [validationOnChange, onInvalid, error] = useInputValidation(\n customErrorMessages,\n customErrorMessages ? customErrorMessages.defaultError : undefined,\n isError,\n );\n const isMaxLengthValid = maxLength ? maxLength > 0 : undefined;\n\n React.useEffect(() => {\n if (defaultValue) {\n if (typeof defaultValue === 'string') {\n setCount(defaultValue.length);\n } else if (typeof defaultValue === 'number') {\n setCount(defaultValue);\n }\n }\n }, [restProps]);\n\n useEffect(() => {\n setIsError(hasError);\n }, [hasError]);\n\n return (\n <label\n className={cn('text-input', {\n 'text-input--theme-dark': theme === themes.dark,\n 'text-input--theme-light': theme === themes.light,\n 'text-input--disabled': disabled,\n 'text-input--error': error || isError,\n 'text-input--icon': leadingIcon || trailingIcon,\n 'text-input--variant-small': variant === variants.small,\n 'text-input--variant-large': variant === variants.large,\n })}\n >\n <div className=\"text-input__wrapper\">\n <div className=\"text-input__label-wrapper\">\n <Text\n className=\"text-input__label\"\n theme={Text.themes.emphasis}\n size={\n variant === variants.small ? Text.sizes.small : Text.sizes.basic\n }\n >\n {label}\n {required ? (\n <span className=\"text-input__asterisk\">*</span>\n ) : null}\n </Text>\n {isMaxLengthValid ? (\n <div className=\"text-input__length-counter\">\n <Text\n size={\n variant === variants.small\n ? Text.sizes.small\n : Text.sizes.basic\n }\n >\n {count}/{maxLength}\n </Text>\n </div>\n ) : null}\n </div>\n\n <div className=\"text-input__input-wrapper\">\n {leadingIcon ? (\n <div className=\"text-input__icon\">{leadingIcon}</div>\n ) : null}\n <input\n className=\"text-input__input\"\n defaultValue={defaultValue}\n disabled={disabled}\n required={required}\n name={name}\n maxLength={isMaxLengthValid ? maxLength : undefined}\n onInvalid={e => onInvalid(e)}\n onChange={e => {\n onChange(e);\n validationOnChange(e);\n setIsError(false); // NOTE: We want to reset error state on change to not confuse users.\n if (isMaxLengthValid) {\n setCount(e.target.value.length);\n }\n }}\n placeholder={placeholder}\n ref={ref}\n type={type}\n aria-label={label}\n {...restProps}\n />\n {trailingIcon ? (\n <div className=\"text-input__icon\">{trailingIcon}</div>\n ) : null}\n </div>\n {helpText ? (\n <div className=\"text-input__help\">\n <SvgInfo />\n <Text size={Text.sizes.interface}>{helpText}</Text>\n </div>\n ) : null}\n {/* NOTE: This is aria-hidden because reporting of validation errors is handled by the browser */}\n {error ? (\n <div aria-hidden=\"true\" className=\"text-input__error\">\n <SvgError />\n <Text size={Text.sizes.interface}>{error}</Text>\n </div>\n ) : null}\n </div>\n </label>\n );\n },\n);\n\n// NOTE: If this isn't set, stack traces say \"forwardRef\" instead of \"TextInput\"\nRefTextInput.displayName = 'TextInput';\n\nconst TextInput: typeof RefTextInput & {\n themes: typeof themes;\n variants: typeof variants;\n} = Object.assign(RefTextInput, { themes, variants });\n\nexport default TextInput;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["cn", "React", "Text", "useInputValidation", "SvgInfo", "SvgError", "themes", "variants", "useEffect", "RefTextInput", "_a", "ref", "_b", "customErrorMessages", "defaultValue", "disabled", "hasError", "helpText", "label", "leadingIcon", "maxLength", "name", "onChange", "placeholder", "required", "theme", "trailingIcon", "type", "variant", "restProps", "__objRest", "count", "setCount", "isError", "setIsError", "validationOnChange", "onInvalid", "error", "isMaxLengthValid", "__spreadValues", "e", "TextInput", "text_input_default"]
|
|
7
7
|
}
|
|
@@ -110,9 +110,10 @@
|
|
|
110
110
|
&__error {
|
|
111
111
|
display: flex;
|
|
112
112
|
gap: spacing.$xs;
|
|
113
|
+
align-items: center;
|
|
113
114
|
|
|
114
|
-
>
|
|
115
|
-
|
|
115
|
+
> svg {
|
|
116
|
+
flex-shrink: 0;
|
|
116
117
|
}
|
|
117
118
|
}
|
|
118
119
|
|
|
@@ -124,17 +125,10 @@
|
|
|
124
125
|
color: light.$on-surface-error;
|
|
125
126
|
}
|
|
126
127
|
|
|
127
|
-
&__help-icon,
|
|
128
|
-
&__error-icon,
|
|
129
128
|
&__icon {
|
|
130
129
|
flex-shrink: 0;
|
|
131
130
|
}
|
|
132
131
|
|
|
133
|
-
&__help-icon,
|
|
134
|
-
&__error-icon {
|
|
135
|
-
height: 16px; // Matches icon height. Otherwise, the auto height acts weirdly, by making the wrapper too tall.
|
|
136
|
-
}
|
|
137
|
-
|
|
138
132
|
&__asterisk {
|
|
139
133
|
color: light.$on-surface-featured;
|
|
140
134
|
margin-left: spacing.$xs;
|