@navikt/ds-react 7.23.0 → 7.23.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.
|
@@ -76,10 +76,8 @@ exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
|
76
76
|
const { inputProps, size = "medium", inputDescriptionId, errorId, showErrorMsg, hasError, } = (0, useFormField_1.useFormField)(props, "searchfield");
|
|
77
77
|
const { className, hideLabel = true, label, description, value, clearButtonLabel, onClear, clearButton = true, children, variant = "primary", defaultValue, onChange, onSearchClick, htmlSize } = props, rest = __rest(props, ["className", "hideLabel", "label", "description", "value", "clearButtonLabel", "onClear", "clearButton", "children", "variant", "defaultValue", "onChange", "onSearchClick", "htmlSize"]);
|
|
78
78
|
const { cn } = (0, Theme_1.useRenameCSS)();
|
|
79
|
-
const themeContext = (0, Theme_1.useThemeInternal)(false);
|
|
80
79
|
const searchRef = (0, react_1.useRef)(null);
|
|
81
80
|
const mergedRef = (0, useMergeRefs_1.useMergeRefs)(searchRef, ref);
|
|
82
|
-
const translate = (0, i18n_hooks_1.useI18n)("Search");
|
|
83
81
|
const [internalValue, setInternalValue] = (0, react_1.useState)(defaultValue !== null && defaultValue !== void 0 ? defaultValue : "");
|
|
84
82
|
const handleChange = (newValue) => {
|
|
85
83
|
value === undefined && setInternalValue(newValue);
|
|
@@ -95,9 +93,6 @@ exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
|
95
93
|
onSearchClick === null || onSearchClick === void 0 ? void 0 : onSearchClick(`${value !== null && value !== void 0 ? value : internalValue}`);
|
|
96
94
|
};
|
|
97
95
|
const showClearButton = clearButton && !inputProps.disabled && (value !== null && value !== void 0 ? value : internalValue);
|
|
98
|
-
const ClearButton = () => themeContext ? (react_1.default.createElement(button_1.Button, { className: cn("navds-search__button-clear"), variant: "tertiary", "data-color": "neutral", size: size === "medium" ? "small" : "xsmall", icon: react_1.default.createElement(aksel_icons_1.XMarkIcon, { "aria-hidden": true }), title: clearButtonLabel || translate("clear"), hidden: !showClearButton, onClick: (event) => handleClear({ trigger: "Click", event }), type: "button" })) : (react_1.default.createElement("button", { type: "button", onClick: (event) => handleClear({ trigger: "Click", event }), className: cn("navds-search__button-clear"), hidden: !showClearButton },
|
|
99
|
-
react_1.default.createElement("span", { className: cn("navds-sr-only") }, clearButtonLabel || translate("clear")),
|
|
100
|
-
react_1.default.createElement(aksel_icons_1.XMarkIcon, { "aria-hidden": true })));
|
|
101
96
|
return (
|
|
102
97
|
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
|
103
98
|
react_1.default.createElement("div", { onKeyDown: (event) => {
|
|
@@ -122,7 +117,7 @@ exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
|
122
117
|
react_1.default.createElement("div", { className: cn("navds-search__wrapper-inner") },
|
|
123
118
|
variant === "simple" && (react_1.default.createElement(aksel_icons_1.MagnifyingGlassIcon, { "aria-hidden": true, className: cn("navds-search__search-icon") })),
|
|
124
119
|
react_1.default.createElement("input", Object.assign({ ref: mergedRef }, (0, util_1.omit)(rest, ["error", "errorId", "size", "readOnly"]), inputProps, { value: value !== null && value !== void 0 ? value : internalValue, onChange: (e) => handleChange(e.target.value), type: "search", className: cn(className, "navds-search__input", `navds-search__input--${variant}`, "navds-text-field__input", "navds-body-short", `navds-body-short--${size}`) }, (htmlSize ? { size: Number(htmlSize) } : {}))),
|
|
125
|
-
react_1.default.createElement(ClearButton,
|
|
120
|
+
showClearButton && (react_1.default.createElement(ClearButton, { handleClear: handleClear, size: size, clearButtonLabel: clearButtonLabel }))),
|
|
126
121
|
react_1.default.createElement(context_1.SearchContext.Provider, { value: {
|
|
127
122
|
size,
|
|
128
123
|
disabled: inputProps.disabled,
|
|
@@ -131,6 +126,14 @@ exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
|
131
126
|
} }, children ? children : variant !== "simple" && react_1.default.createElement(SearchButton_1.default, null))),
|
|
132
127
|
react_1.default.createElement("div", { className: cn("navds-form-field__error"), id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(typography_1.ErrorMessage, { size: size, showIcon: true }, props.error)))));
|
|
133
128
|
});
|
|
129
|
+
function ClearButton({ size, clearButtonLabel, handleClear, }) {
|
|
130
|
+
const { cn } = (0, Theme_1.useRenameCSS)();
|
|
131
|
+
const themeContext = (0, Theme_1.useThemeInternal)(false);
|
|
132
|
+
const translate = (0, i18n_hooks_1.useI18n)("Search");
|
|
133
|
+
return themeContext ? (react_1.default.createElement(button_1.Button, { className: cn("navds-search__button-clear"), variant: "tertiary", "data-color": "neutral", size: size === "medium" ? "small" : "xsmall", icon: react_1.default.createElement(aksel_icons_1.XMarkIcon, { "aria-hidden": true }), title: clearButtonLabel || translate("clear"), onClick: (event) => handleClear({ trigger: "Click", event }), type: "button" })) : (react_1.default.createElement("button", { type: "button", onClick: (event) => handleClear({ trigger: "Click", event }), className: cn("navds-search__button-clear") },
|
|
134
|
+
react_1.default.createElement("span", { className: cn("navds-sr-only") }, clearButtonLabel || translate("clear")),
|
|
135
|
+
react_1.default.createElement(aksel_icons_1.XMarkIcon, { "aria-hidden": true })));
|
|
136
|
+
}
|
|
134
137
|
exports.Search.Button = SearchButton_1.default;
|
|
135
138
|
exports.default = exports.Search;
|
|
136
139
|
//# sourceMappingURL=Search.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Search.js","sourceRoot":"","sources":["../../../src/form/search/Search.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAKe;AACf,qDAAqE;AACrE,yCAAsC;AACtC,6CAAmE;AACnE,iDAAkE;AAClE,qCAAkC;AAClC,gEAA6D;AAC7D,2DAAqD;AACrD,kDAA+D;AAC/D,kEAAgE;AAChE,uCAA0C;AAqE1C;;;;;;;;;;;;GAYG;AACU,QAAA,MAAM,GAAG,IAAA,kBAAU,EAC9B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EACJ,UAAU,EACV,IAAI,GAAG,QAAQ,EACf,kBAAkB,EAClB,OAAO,EACP,YAAY,EACZ,QAAQ,GACT,GAAG,IAAA,2BAAY,EAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IAEvC,MAAM,EACJ,SAAS,EACT,SAAS,GAAG,IAAI,EAChB,KAAK,EACL,WAAW,EACX,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,WAAW,GAAG,IAAI,EAClB,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,QAAQ,KAEN,KAAK,EADJ,IAAI,UACL,KAAK,EAhBH,yLAgBL,CAAQ,CAAC;IAEV,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,MAAM,
|
|
1
|
+
{"version":3,"file":"Search.js","sourceRoot":"","sources":["../../../src/form/search/Search.tsx"],"names":[],"mappings":"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"}
|
|
@@ -37,10 +37,8 @@ export const Search = forwardRef((props, ref) => {
|
|
|
37
37
|
const { inputProps, size = "medium", inputDescriptionId, errorId, showErrorMsg, hasError, } = useFormField(props, "searchfield");
|
|
38
38
|
const { className, hideLabel = true, label, description, value, clearButtonLabel, onClear, clearButton = true, children, variant = "primary", defaultValue, onChange, onSearchClick, htmlSize } = props, rest = __rest(props, ["className", "hideLabel", "label", "description", "value", "clearButtonLabel", "onClear", "clearButton", "children", "variant", "defaultValue", "onChange", "onSearchClick", "htmlSize"]);
|
|
39
39
|
const { cn } = useRenameCSS();
|
|
40
|
-
const themeContext = useThemeInternal(false);
|
|
41
40
|
const searchRef = useRef(null);
|
|
42
41
|
const mergedRef = useMergeRefs(searchRef, ref);
|
|
43
|
-
const translate = useI18n("Search");
|
|
44
42
|
const [internalValue, setInternalValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : "");
|
|
45
43
|
const handleChange = (newValue) => {
|
|
46
44
|
value === undefined && setInternalValue(newValue);
|
|
@@ -56,9 +54,6 @@ export const Search = forwardRef((props, ref) => {
|
|
|
56
54
|
onSearchClick === null || onSearchClick === void 0 ? void 0 : onSearchClick(`${value !== null && value !== void 0 ? value : internalValue}`);
|
|
57
55
|
};
|
|
58
56
|
const showClearButton = clearButton && !inputProps.disabled && (value !== null && value !== void 0 ? value : internalValue);
|
|
59
|
-
const ClearButton = () => themeContext ? (React.createElement(Button, { className: cn("navds-search__button-clear"), variant: "tertiary", "data-color": "neutral", size: size === "medium" ? "small" : "xsmall", icon: React.createElement(XMarkIcon, { "aria-hidden": true }), title: clearButtonLabel || translate("clear"), hidden: !showClearButton, onClick: (event) => handleClear({ trigger: "Click", event }), type: "button" })) : (React.createElement("button", { type: "button", onClick: (event) => handleClear({ trigger: "Click", event }), className: cn("navds-search__button-clear"), hidden: !showClearButton },
|
|
60
|
-
React.createElement("span", { className: cn("navds-sr-only") }, clearButtonLabel || translate("clear")),
|
|
61
|
-
React.createElement(XMarkIcon, { "aria-hidden": true })));
|
|
62
57
|
return (
|
|
63
58
|
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
|
64
59
|
React.createElement("div", { onKeyDown: (event) => {
|
|
@@ -83,7 +78,7 @@ export const Search = forwardRef((props, ref) => {
|
|
|
83
78
|
React.createElement("div", { className: cn("navds-search__wrapper-inner") },
|
|
84
79
|
variant === "simple" && (React.createElement(MagnifyingGlassIcon, { "aria-hidden": true, className: cn("navds-search__search-icon") })),
|
|
85
80
|
React.createElement("input", Object.assign({ ref: mergedRef }, omit(rest, ["error", "errorId", "size", "readOnly"]), inputProps, { value: value !== null && value !== void 0 ? value : internalValue, onChange: (e) => handleChange(e.target.value), type: "search", className: cn(className, "navds-search__input", `navds-search__input--${variant}`, "navds-text-field__input", "navds-body-short", `navds-body-short--${size}`) }, (htmlSize ? { size: Number(htmlSize) } : {}))),
|
|
86
|
-
React.createElement(ClearButton,
|
|
81
|
+
showClearButton && (React.createElement(ClearButton, { handleClear: handleClear, size: size, clearButtonLabel: clearButtonLabel }))),
|
|
87
82
|
React.createElement(SearchContext.Provider, { value: {
|
|
88
83
|
size,
|
|
89
84
|
disabled: inputProps.disabled,
|
|
@@ -92,6 +87,14 @@ export const Search = forwardRef((props, ref) => {
|
|
|
92
87
|
} }, children ? children : variant !== "simple" && React.createElement(SearchButton, null))),
|
|
93
88
|
React.createElement("div", { className: cn("navds-form-field__error"), id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size, showIcon: true }, props.error)))));
|
|
94
89
|
});
|
|
90
|
+
function ClearButton({ size, clearButtonLabel, handleClear, }) {
|
|
91
|
+
const { cn } = useRenameCSS();
|
|
92
|
+
const themeContext = useThemeInternal(false);
|
|
93
|
+
const translate = useI18n("Search");
|
|
94
|
+
return themeContext ? (React.createElement(Button, { className: cn("navds-search__button-clear"), variant: "tertiary", "data-color": "neutral", size: size === "medium" ? "small" : "xsmall", icon: React.createElement(XMarkIcon, { "aria-hidden": true }), title: clearButtonLabel || translate("clear"), onClick: (event) => handleClear({ trigger: "Click", event }), type: "button" })) : (React.createElement("button", { type: "button", onClick: (event) => handleClear({ trigger: "Click", event }), className: cn("navds-search__button-clear") },
|
|
95
|
+
React.createElement("span", { className: cn("navds-sr-only") }, clearButtonLabel || translate("clear")),
|
|
96
|
+
React.createElement(XMarkIcon, { "aria-hidden": true })));
|
|
97
|
+
}
|
|
95
98
|
Search.Button = SearchButton;
|
|
96
99
|
export default Search;
|
|
97
100
|
//# sourceMappingURL=Search.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Search.js","sourceRoot":"","sources":["../../../src/form/search/Search.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAEZ,UAAU,EACV,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AACrE,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAClE,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAkB,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,YAAkC,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAqE1C;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC9B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EACJ,UAAU,EACV,IAAI,GAAG,QAAQ,EACf,kBAAkB,EAClB,OAAO,EACP,YAAY,EACZ,QAAQ,GACT,GAAG,YAAY,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IAEvC,MAAM,EACJ,SAAS,EACT,SAAS,GAAG,IAAI,EAChB,KAAK,EACL,WAAW,EACX,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,WAAW,GAAG,IAAI,EAClB,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,QAAQ,KAEN,KAAK,EADJ,IAAI,UACL,KAAK,EAhBH,yLAgBL,CAAQ,CAAC;IAEV,MAAM,EAAE,EAAE,EAAE,GAAG,YAAY,EAAE,CAAC;IAE9B,MAAM,
|
|
1
|
+
{"version":3,"file":"Search.js","sourceRoot":"","sources":["../../../src/form/search/Search.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@navikt/ds-react",
|
|
3
|
-
"version": "7.23.
|
|
3
|
+
"version": "7.23.1",
|
|
4
4
|
"description": "React components from the Norwegian Labour and Welfare Administration.",
|
|
5
5
|
"author": "Aksel, a team part of the Norwegian Labour and Welfare Administration.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -630,8 +630,8 @@
|
|
|
630
630
|
"dependencies": {
|
|
631
631
|
"@floating-ui/react": "0.27.8",
|
|
632
632
|
"@floating-ui/react-dom": "^2.0.9",
|
|
633
|
-
"@navikt/aksel-icons": "^7.23.
|
|
634
|
-
"@navikt/ds-tokens": "^7.23.
|
|
633
|
+
"@navikt/aksel-icons": "^7.23.1",
|
|
634
|
+
"@navikt/ds-tokens": "^7.23.1",
|
|
635
635
|
"clsx": "^2.1.0",
|
|
636
636
|
"date-fns": "^4.0.0",
|
|
637
637
|
"react-day-picker": "9.7.0"
|
|
@@ -649,7 +649,7 @@
|
|
|
649
649
|
"jscodeshift": "^0.15.1",
|
|
650
650
|
"jsdom": "26.1.0",
|
|
651
651
|
"react-dom": "^18.0.0",
|
|
652
|
-
"react-router
|
|
652
|
+
"react-router": "^7.6.2",
|
|
653
653
|
"rimraf": "6.0.1",
|
|
654
654
|
"swr": "^2.3.2",
|
|
655
655
|
"tsc-alias": "1.8.16",
|
|
@@ -126,11 +126,9 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
126
126
|
|
|
127
127
|
const { cn } = useRenameCSS();
|
|
128
128
|
|
|
129
|
-
const themeContext = useThemeInternal(false);
|
|
130
|
-
|
|
131
129
|
const searchRef = useRef<HTMLInputElement | null>(null);
|
|
132
130
|
const mergedRef = useMergeRefs(searchRef, ref);
|
|
133
|
-
|
|
131
|
+
|
|
134
132
|
const [internalValue, setInternalValue] = useState(defaultValue ?? "");
|
|
135
133
|
|
|
136
134
|
const handleChange = (newValue: string) => {
|
|
@@ -151,33 +149,6 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
151
149
|
const showClearButton =
|
|
152
150
|
clearButton && !inputProps.disabled && (value ?? internalValue);
|
|
153
151
|
|
|
154
|
-
const ClearButton = () =>
|
|
155
|
-
themeContext ? (
|
|
156
|
-
<Button
|
|
157
|
-
className={cn("navds-search__button-clear")}
|
|
158
|
-
variant="tertiary"
|
|
159
|
-
data-color="neutral"
|
|
160
|
-
size={size === "medium" ? "small" : "xsmall"}
|
|
161
|
-
icon={<XMarkIcon aria-hidden />}
|
|
162
|
-
title={clearButtonLabel || translate("clear")}
|
|
163
|
-
hidden={!showClearButton}
|
|
164
|
-
onClick={(event) => handleClear({ trigger: "Click", event })}
|
|
165
|
-
type="button"
|
|
166
|
-
/>
|
|
167
|
-
) : (
|
|
168
|
-
<button
|
|
169
|
-
type="button"
|
|
170
|
-
onClick={(event) => handleClear({ trigger: "Click", event })}
|
|
171
|
-
className={cn("navds-search__button-clear")}
|
|
172
|
-
hidden={!showClearButton}
|
|
173
|
-
>
|
|
174
|
-
<span className={cn("navds-sr-only")}>
|
|
175
|
-
{clearButtonLabel || translate("clear")}
|
|
176
|
-
</span>
|
|
177
|
-
<XMarkIcon aria-hidden />
|
|
178
|
-
</button>
|
|
179
|
-
);
|
|
180
|
-
|
|
181
152
|
return (
|
|
182
153
|
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
|
183
154
|
<div
|
|
@@ -246,7 +217,13 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
246
217
|
)}
|
|
247
218
|
{...(htmlSize ? { size: Number(htmlSize) } : {})}
|
|
248
219
|
/>
|
|
249
|
-
|
|
220
|
+
{showClearButton && (
|
|
221
|
+
<ClearButton
|
|
222
|
+
handleClear={handleClear}
|
|
223
|
+
size={size}
|
|
224
|
+
clearButtonLabel={clearButtonLabel}
|
|
225
|
+
/>
|
|
226
|
+
)}
|
|
250
227
|
</div>
|
|
251
228
|
<SearchContext.Provider
|
|
252
229
|
value={{
|
|
@@ -276,6 +253,45 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
276
253
|
},
|
|
277
254
|
) as SearchComponent;
|
|
278
255
|
|
|
256
|
+
type SearchClearButtonProps = Pick<SearchProps, "size" | "clearButtonLabel"> & {
|
|
257
|
+
handleClear: (clearEvent: SearchClearEvent) => void;
|
|
258
|
+
};
|
|
259
|
+
|
|
260
|
+
function ClearButton({
|
|
261
|
+
size,
|
|
262
|
+
clearButtonLabel,
|
|
263
|
+
handleClear,
|
|
264
|
+
}: SearchClearButtonProps) {
|
|
265
|
+
const { cn } = useRenameCSS();
|
|
266
|
+
|
|
267
|
+
const themeContext = useThemeInternal(false);
|
|
268
|
+
const translate = useI18n("Search");
|
|
269
|
+
|
|
270
|
+
return themeContext ? (
|
|
271
|
+
<Button
|
|
272
|
+
className={cn("navds-search__button-clear")}
|
|
273
|
+
variant="tertiary"
|
|
274
|
+
data-color="neutral"
|
|
275
|
+
size={size === "medium" ? "small" : "xsmall"}
|
|
276
|
+
icon={<XMarkIcon aria-hidden />}
|
|
277
|
+
title={clearButtonLabel || translate("clear")}
|
|
278
|
+
onClick={(event) => handleClear({ trigger: "Click", event })}
|
|
279
|
+
type="button"
|
|
280
|
+
/>
|
|
281
|
+
) : (
|
|
282
|
+
<button
|
|
283
|
+
type="button"
|
|
284
|
+
onClick={(event) => handleClear({ trigger: "Click", event })}
|
|
285
|
+
className={cn("navds-search__button-clear")}
|
|
286
|
+
>
|
|
287
|
+
<span className={cn("navds-sr-only")}>
|
|
288
|
+
{clearButtonLabel || translate("clear")}
|
|
289
|
+
</span>
|
|
290
|
+
<XMarkIcon aria-hidden />
|
|
291
|
+
</button>
|
|
292
|
+
);
|
|
293
|
+
}
|
|
294
|
+
|
|
279
295
|
Search.Button = SearchButton;
|
|
280
296
|
|
|
281
297
|
export default Search;
|