frst-components 0.34.3 → 0.34.4
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/index.js
CHANGED
|
@@ -9686,8 +9686,8 @@ const InputSearchWrapper$1 = styled__default["default"].div `
|
|
|
9686
9686
|
:hover {
|
|
9687
9687
|
border: 2px solid ${({ theme, inputSearchNewStyle }) => inputSearchNewStyle ? theme.colors.inputBorderFocus : undefined};
|
|
9688
9688
|
}
|
|
9689
|
-
:focus {
|
|
9690
|
-
background-color: ${({ theme, inputSearchNewStyle, darkMode }) => inputSearchNewStyle && !darkMode && theme.colors.inputFocusBg};
|
|
9689
|
+
:focus-within {
|
|
9690
|
+
background-color: ${({ theme, inputSearchNewStyle, darkMode, isValue }) => inputSearchNewStyle && !darkMode && isValue ? theme.colors.inputBg : theme.colors.inputFocusBg};
|
|
9691
9691
|
}
|
|
9692
9692
|
`;
|
|
9693
9693
|
const InputText$3 = styled__default["default"].input `
|
|
@@ -9739,7 +9739,7 @@ const ButtonAction$1 = styled__default["default"].div `
|
|
|
9739
9739
|
function SearchField({ label, hasSearchIcon, placeholder, value, onChange, textButton, className, handleClickButton, isButton, id, style, inputSearchNewStyle, darkMode }) {
|
|
9740
9740
|
const [actionAreaInput, setActionAreaInput] = React.useState(false);
|
|
9741
9741
|
const [inputOnFocus, setInputOnFocus] = React.useState(false);
|
|
9742
|
-
return (jsxRuntime.jsx(styled.ThemeProvider, { theme: FRSTTheme, children: jsxRuntime.jsxs(Container$l, { style: style, id: "container-search-field", className: className, onMouseOver: () => setActionAreaInput(true), onMouseOut: () => setActionAreaInput(false), onFocus: () => setInputOnFocus(true), onBlur: () => setInputOnFocus(false), children: [label && (jsxRuntime.jsxs(LabelField, { isHover: actionAreaInput, isOnFocus: inputOnFocus, children: [' ', label, ' '] })), jsxRuntime.jsxs(InputSearchWrapper$1, { isHover: actionAreaInput, isOnFocus: inputOnFocus, inputSearchNewStyle: inputSearchNewStyle, darkMode: darkMode, children: [hasSearchIcon && (jsxRuntime.jsxs(ContainerIcon$2, { children: [' ', jsxRuntime.jsx(SearchIcon, { fill: darkMode ? "#9C9C9C" : "#222222" }), ' '] })), jsxRuntime.jsx(InputText$3, { inputSearchNewStyle: inputSearchNewStyle, placeholder: placeholder, onChange: onChange, value: value, onKeyDown: (event) => {
|
|
9742
|
+
return (jsxRuntime.jsx(styled.ThemeProvider, { theme: FRSTTheme, children: jsxRuntime.jsxs(Container$l, { style: style, id: "container-search-field", className: className, onMouseOver: () => setActionAreaInput(true), onMouseOut: () => setActionAreaInput(false), onFocus: () => setInputOnFocus(true), onBlur: () => setInputOnFocus(false), children: [label && (jsxRuntime.jsxs(LabelField, { isHover: actionAreaInput, isOnFocus: inputOnFocus, children: [' ', label, ' '] })), jsxRuntime.jsxs(InputSearchWrapper$1, { isHover: actionAreaInput, isOnFocus: inputOnFocus, inputSearchNewStyle: inputSearchNewStyle, darkMode: darkMode, isValue: !!value, children: [hasSearchIcon && (jsxRuntime.jsxs(ContainerIcon$2, { children: [' ', jsxRuntime.jsx(SearchIcon, { fill: darkMode ? "#9C9C9C" : "#222222" }), ' '] })), jsxRuntime.jsx(InputText$3, { inputSearchNewStyle: inputSearchNewStyle, placeholder: placeholder, onChange: onChange, value: value, onKeyDown: (event) => {
|
|
9743
9743
|
if (event.key === 'Enter') {
|
|
9744
9744
|
handleClickButton(event);
|
|
9745
9745
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/search-field/index.tsx"],"names":[],"mappings":"AACA,OAAO,yBAAyB,CAAA;AAIhC,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAG5C,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,KAAK,EACL,aAAa,EACb,WAAW,EACX,KAAK,EACL,QAAQ,EACR,UAAU,EACV,SAAS,EACT,iBAAiB,EACjB,QAAQ,EACR,EAAE,EACF,KAAK,EACL,mBAAmB,EACnB,QAAQ,EACT,EAAE,YAAY,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/search-field/index.tsx"],"names":[],"mappings":"AACA,OAAO,yBAAyB,CAAA;AAIhC,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAG5C,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,KAAK,EACL,aAAa,EACb,WAAW,EACX,KAAK,EACL,QAAQ,EACR,UAAU,EACV,SAAS,EACT,iBAAiB,EACjB,QAAQ,EACR,EAAE,EACF,KAAK,EACL,mBAAmB,EACnB,QAAQ,EACT,EAAE,YAAY,2CAmDd"}
|
|
@@ -3,6 +3,7 @@ interface ISearchField {
|
|
|
3
3
|
isOnFocus?: boolean;
|
|
4
4
|
inputSearchNewStyle?: boolean;
|
|
5
5
|
darkMode?: boolean;
|
|
6
|
+
isValue?: boolean;
|
|
6
7
|
}
|
|
7
8
|
export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
9
|
export declare const LabelField: import("styled-components").StyledComponent<"label", any, ISearchField, never>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"searchFieldStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/search-field/searchFieldStyles.ts"],"names":[],"mappings":"AAEA,UAAU,YAAY;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"searchFieldStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/search-field/searchFieldStyles.ts"],"names":[],"mappings":"AAEA,UAAU,YAAY;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,SAAS,oEAGrB,CAAA;AAED,eAAO,MAAM,UAAU,gFActB,CAAA;AAED,eAAO,MAAM,aAAa,oEAMzB,CAAA;AAED,eAAO,MAAM,kBAAkB,8EAoB9B,CAAA;AAED,eAAO,MAAM,SAAS,gFAwBrB,CAAA;AAED,eAAO,MAAM,YAAY,oEAoBxB,CAAA"}
|