@navikt/ds-react 3.2.3 → 3.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.
- package/_docs.json +19 -0
- package/cjs/form/search/Search.js +3 -2
- package/cjs/popover/Popover.js +3 -3
- package/cjs/tooltip/Tooltip.js +3 -3
- package/esm/form/search/Search.d.ts +4 -0
- package/esm/form/search/Search.js +3 -2
- package/esm/form/search/Search.js.map +1 -1
- package/esm/popover/Popover.js +3 -3
- package/esm/popover/Popover.js.map +1 -1
- package/esm/tooltip/Tooltip.js +3 -3
- package/esm/tooltip/Tooltip.js.map +1 -1
- package/package.json +3 -3
- package/src/form/search/Search.tsx +8 -0
- package/src/form/search/search.stories.tsx +25 -0
- package/src/popover/Popover.tsx +3 -5
- package/src/tooltip/Tooltip.tsx +5 -6
package/_docs.json
CHANGED
|
@@ -13088,6 +13088,25 @@
|
|
|
13088
13088
|
"name": "\"primary\" | \"secondary\" | \"simple\""
|
|
13089
13089
|
}
|
|
13090
13090
|
},
|
|
13091
|
+
"htmlSize": {
|
|
13092
|
+
"defaultValue": null,
|
|
13093
|
+
"description": "Exposes the HTML size attribute",
|
|
13094
|
+
"name": "htmlSize",
|
|
13095
|
+
"parent": {
|
|
13096
|
+
"fileName": "src/form/search/Search.tsx",
|
|
13097
|
+
"name": "SearchProps"
|
|
13098
|
+
},
|
|
13099
|
+
"declarations": [
|
|
13100
|
+
{
|
|
13101
|
+
"fileName": "src/form/search/Search.tsx",
|
|
13102
|
+
"name": "SearchProps"
|
|
13103
|
+
}
|
|
13104
|
+
],
|
|
13105
|
+
"required": false,
|
|
13106
|
+
"type": {
|
|
13107
|
+
"name": "string | number"
|
|
13108
|
+
}
|
|
13109
|
+
},
|
|
13091
13110
|
"error": {
|
|
13092
13111
|
"defaultValue": null,
|
|
13093
13112
|
"description": "Error message for element",
|
|
@@ -47,7 +47,7 @@ const SearchButton_1 = __importDefault(require("./SearchButton"));
|
|
|
47
47
|
exports.SearchContext = react_1.default.createContext(null);
|
|
48
48
|
exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
49
49
|
const { inputProps, size = "medium", inputDescriptionId, errorId, showErrorMsg, hasError, } = (0, useFormField_1.useFormField)(props, "searchfield");
|
|
50
|
-
const { className, hideLabel = true, label, description, value, clearButtonLabel, onClear, clearButton = true, children, variant = "primary", defaultValue, onChange, onSearchClick } = props, rest = __rest(props, ["className", "hideLabel", "label", "description", "value", "clearButtonLabel", "onClear", "clearButton", "children", "variant", "defaultValue", "onChange", "onSearchClick"]);
|
|
50
|
+
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"]);
|
|
51
51
|
const searchRef = (0, react_1.useRef)(null);
|
|
52
52
|
const mergedRef = (0, react_1.useMemo)(() => (0, __1.mergeRefs)([searchRef, ref]), [ref]);
|
|
53
53
|
const [wrapperRef, setWrapperRef] = (0, react_1.useState)(null);
|
|
@@ -74,6 +74,7 @@ exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
|
74
74
|
return (react_1.default.createElement("div", { ref: setWrapperRef, className: (0, clsx_1.default)(className, "navds-form-field", `navds-form-field--${size}`, "navds-search", {
|
|
75
75
|
"navds-search--error": hasError,
|
|
76
76
|
"navds-search--disabled": !!inputProps.disabled,
|
|
77
|
+
"navds-search--with-size": !!htmlSize,
|
|
77
78
|
}) },
|
|
78
79
|
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, className: (0, clsx_1.default)("navds-form-field__label", {
|
|
79
80
|
"navds-sr-only": hideLabel,
|
|
@@ -84,7 +85,7 @@ exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
|
84
85
|
react_1.default.createElement("div", { className: "navds-search__wrapper" },
|
|
85
86
|
react_1.default.createElement("div", { className: "navds-search__wrapper-inner" },
|
|
86
87
|
variant === "simple" && (react_1.default.createElement(aksel_icons_1.MagnifyingGlassIcon, { "aria-hidden": true, className: "navds-search__search-icon" })),
|
|
87
|
-
react_1.default.createElement("input", Object.assign({ ref: mergedRef }, (0, __1.omit)(rest, ["error", "errorId", "size"]), inputProps, { value: value !== null && value !== void 0 ? value : internalValue, onChange: (e) => handleChange(e.target.value), type: "search", role: "searchbox", className: (0, clsx_1.default)(className, "navds-search__input", `navds-search__input--${variant}`, "navds-text-field__input", "navds-body-short", `navds-body-${size}`) })),
|
|
88
|
+
react_1.default.createElement("input", Object.assign({ ref: mergedRef }, (0, __1.omit)(rest, ["error", "errorId", "size"]), inputProps, { value: value !== null && value !== void 0 ? value : internalValue, onChange: (e) => handleChange(e.target.value), type: "search", role: "searchbox", className: (0, clsx_1.default)(className, "navds-search__input", `navds-search__input--${variant}`, "navds-text-field__input", "navds-body-short", `navds-body-${size}`) }, (htmlSize ? { size: Number(htmlSize) } : {}))),
|
|
88
89
|
(value !== null && value !== void 0 ? value : internalValue) && clearButton && (react_1.default.createElement("button", { type: "button", onClick: (e) => handleClear({ trigger: "Click", event: e }), className: "navds-search__button-clear" },
|
|
89
90
|
react_1.default.createElement("span", { className: "navds-sr-only" }, clearButtonLabel ? clearButtonLabel : "Tøm"),
|
|
90
91
|
react_1.default.createElement(aksel_icons_1.XMarkIcon, { "aria-hidden": true })))),
|
package/cjs/popover/Popover.js
CHANGED
|
@@ -47,7 +47,7 @@ const PopoverContent_1 = __importDefault(require("./PopoverContent"));
|
|
|
47
47
|
exports.Popover = (0, react_2.forwardRef)((_a, ref) => {
|
|
48
48
|
var { className, children, anchorEl, arrow = true, open, onClose, placement = "top", offset, strategy: userStrategy = "absolute" } = _a, rest = __rest(_a, ["className", "children", "anchorEl", "arrow", "open", "onClose", "placement", "offset", "strategy"]);
|
|
49
49
|
const arrowRef = (0, react_2.useRef)(null);
|
|
50
|
-
const { x, y,
|
|
50
|
+
const { x, y, strategy, context, update, refs, placement: flPlacement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {} }, } = (0, react_1.useFloating)({
|
|
51
51
|
strategy: userStrategy,
|
|
52
52
|
placement,
|
|
53
53
|
open: open,
|
|
@@ -64,9 +64,9 @@ exports.Popover = (0, react_2.forwardRef)((_a, ref) => {
|
|
|
64
64
|
(0, react_1.useDismiss)(context),
|
|
65
65
|
]);
|
|
66
66
|
(0, util_1.useClientLayoutEffect)(() => {
|
|
67
|
-
|
|
67
|
+
refs.setReference(anchorEl);
|
|
68
68
|
}, [anchorEl]);
|
|
69
|
-
const floatingRef = (0, react_2.useMemo)(() => (0, __1.mergeRefs)([
|
|
69
|
+
const floatingRef = (0, react_2.useMemo)(() => (0, __1.mergeRefs)([refs.setFloating, ref]), [refs.setFloating, ref]);
|
|
70
70
|
(0, util_1.useClientLayoutEffect)(() => {
|
|
71
71
|
if (!refs.reference.current || !refs.floating.current || !open)
|
|
72
72
|
return;
|
package/cjs/tooltip/Tooltip.js
CHANGED
|
@@ -49,7 +49,7 @@ exports.Tooltip = (0, react_2.forwardRef)((_a, ref) => {
|
|
|
49
49
|
const [open, setOpen] = (0, react_2.useState)(defaultOpen);
|
|
50
50
|
const arrowRef = (0, react_2.useRef)(null);
|
|
51
51
|
const rootElement = (_b = (0, __1.useProvider)()) === null || _b === void 0 ? void 0 : _b.rootElement;
|
|
52
|
-
const { x, y,
|
|
52
|
+
const { x, y, strategy, context, placement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {}, hide: { referenceHidden } = {}, }, refs, } = (0, react_1.useFloating)({
|
|
53
53
|
placement: _placement,
|
|
54
54
|
open: userOpen !== null && userOpen !== void 0 ? userOpen : open,
|
|
55
55
|
onOpenChange: setOpen,
|
|
@@ -67,8 +67,8 @@ exports.Tooltip = (0, react_2.forwardRef)((_a, ref) => {
|
|
|
67
67
|
(0, react_1.useDismiss)(context),
|
|
68
68
|
]);
|
|
69
69
|
const ariaId = (0, util_1.useId)(id);
|
|
70
|
-
const mergedRef = (0, react_2.useMemo)(() => (0, util_1.mergeRefs)([ref,
|
|
71
|
-
const childMergedRef = (0, react_2.useMemo)(() => (0, util_1.mergeRefs)([children.ref,
|
|
70
|
+
const mergedRef = (0, react_2.useMemo)(() => (0, util_1.mergeRefs)([ref, refs.setFloating]), [refs.setFloating, ref]);
|
|
71
|
+
const childMergedRef = (0, react_2.useMemo)(() => (0, util_1.mergeRefs)([children.ref, refs.setReference]), [children, refs.setReference]);
|
|
72
72
|
if (!children ||
|
|
73
73
|
(children === null || children === void 0 ? void 0 : children.type) === react_2.default.Fragment ||
|
|
74
74
|
children === react_2.default.Fragment) {
|
|
@@ -47,6 +47,10 @@ export interface SearchProps extends FormFieldProps, Omit<InputHTMLAttributes<HT
|
|
|
47
47
|
* @default "primary"
|
|
48
48
|
*/
|
|
49
49
|
variant?: "primary" | "secondary" | "simple";
|
|
50
|
+
/**
|
|
51
|
+
* Exposes the HTML size attribute
|
|
52
|
+
*/
|
|
53
|
+
htmlSize?: number | string;
|
|
50
54
|
}
|
|
51
55
|
interface SearchComponent extends React.ForwardRefExoticComponent<SearchProps & React.RefAttributes<HTMLDivElement>> {
|
|
52
56
|
Button: SearchButtonType;
|
|
@@ -18,7 +18,7 @@ import SearchButton from "./SearchButton";
|
|
|
18
18
|
export const SearchContext = React.createContext(null);
|
|
19
19
|
export const Search = forwardRef((props, ref) => {
|
|
20
20
|
const { inputProps, size = "medium", inputDescriptionId, errorId, showErrorMsg, hasError, } = useFormField(props, "searchfield");
|
|
21
|
-
const { className, hideLabel = true, label, description, value, clearButtonLabel, onClear, clearButton = true, children, variant = "primary", defaultValue, onChange, onSearchClick } = props, rest = __rest(props, ["className", "hideLabel", "label", "description", "value", "clearButtonLabel", "onClear", "clearButton", "children", "variant", "defaultValue", "onChange", "onSearchClick"]);
|
|
21
|
+
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"]);
|
|
22
22
|
const searchRef = useRef(null);
|
|
23
23
|
const mergedRef = useMemo(() => mergeRefs([searchRef, ref]), [ref]);
|
|
24
24
|
const [wrapperRef, setWrapperRef] = useState(null);
|
|
@@ -45,6 +45,7 @@ export const Search = forwardRef((props, ref) => {
|
|
|
45
45
|
return (React.createElement("div", { ref: setWrapperRef, className: cl(className, "navds-form-field", `navds-form-field--${size}`, "navds-search", {
|
|
46
46
|
"navds-search--error": hasError,
|
|
47
47
|
"navds-search--disabled": !!inputProps.disabled,
|
|
48
|
+
"navds-search--with-size": !!htmlSize,
|
|
48
49
|
}) },
|
|
49
50
|
React.createElement(Label, { htmlFor: inputProps.id, size: size, className: cl("navds-form-field__label", {
|
|
50
51
|
"navds-sr-only": hideLabel,
|
|
@@ -55,7 +56,7 @@ export const Search = forwardRef((props, ref) => {
|
|
|
55
56
|
React.createElement("div", { className: "navds-search__wrapper" },
|
|
56
57
|
React.createElement("div", { className: "navds-search__wrapper-inner" },
|
|
57
58
|
variant === "simple" && (React.createElement(MagnifyingGlassIcon, { "aria-hidden": true, className: "navds-search__search-icon" })),
|
|
58
|
-
React.createElement("input", Object.assign({ ref: mergedRef }, omit(rest, ["error", "errorId", "size"]), inputProps, { value: value !== null && value !== void 0 ? value : internalValue, onChange: (e) => handleChange(e.target.value), type: "search", role: "searchbox", className: cl(className, "navds-search__input", `navds-search__input--${variant}`, "navds-text-field__input", "navds-body-short", `navds-body-${size}`) })),
|
|
59
|
+
React.createElement("input", Object.assign({ ref: mergedRef }, omit(rest, ["error", "errorId", "size"]), inputProps, { value: value !== null && value !== void 0 ? value : internalValue, onChange: (e) => handleChange(e.target.value), type: "search", role: "searchbox", className: cl(className, "navds-search__input", `navds-search__input--${variant}`, "navds-text-field__input", "navds-body-short", `navds-body-${size}`) }, (htmlSize ? { size: Number(htmlSize) } : {}))),
|
|
59
60
|
(value !== null && value !== void 0 ? value : internalValue) && clearButton && (React.createElement("button", { type: "button", onClick: (e) => handleClear({ trigger: "Click", event: e }), className: "navds-search__button-clear" },
|
|
60
61
|
React.createElement("span", { className: "navds-sr-only" }, clearButtonLabel ? clearButtonLabel : "Tøm"),
|
|
61
62
|
React.createElement(XMarkIcon, { "aria-hidden": true })))),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Search.js","sourceRoot":"","sources":["../../../src/form/search/Search.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AACrE,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EACZ,UAAU,EAEV,WAAW,EACX,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EACL,SAAS,EACT,YAAY,EACZ,KAAK,EACL,SAAS,EACT,IAAI,EACJ,gBAAgB,GACjB,MAAM,OAAO,CAAC;AACf,OAAO,EAAkB,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,YAAkC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Search.js","sourceRoot":"","sources":["../../../src/form/search/Search.tsx"],"names":[],"mappings":"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"}
|
package/esm/popover/Popover.js
CHANGED
|
@@ -18,7 +18,7 @@ import PopoverContent from "./PopoverContent";
|
|
|
18
18
|
export const Popover = forwardRef((_a, ref) => {
|
|
19
19
|
var { className, children, anchorEl, arrow = true, open, onClose, placement = "top", offset, strategy: userStrategy = "absolute" } = _a, rest = __rest(_a, ["className", "children", "anchorEl", "arrow", "open", "onClose", "placement", "offset", "strategy"]);
|
|
20
20
|
const arrowRef = useRef(null);
|
|
21
|
-
const { x, y,
|
|
21
|
+
const { x, y, strategy, context, update, refs, placement: flPlacement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {} }, } = useFloating({
|
|
22
22
|
strategy: userStrategy,
|
|
23
23
|
placement,
|
|
24
24
|
open: open,
|
|
@@ -35,9 +35,9 @@ export const Popover = forwardRef((_a, ref) => {
|
|
|
35
35
|
useDismiss(context),
|
|
36
36
|
]);
|
|
37
37
|
useClientLayoutEffect(() => {
|
|
38
|
-
|
|
38
|
+
refs.setReference(anchorEl);
|
|
39
39
|
}, [anchorEl]);
|
|
40
|
-
const floatingRef = useMemo(() => mergeRefs([
|
|
40
|
+
const floatingRef = useMemo(() => mergeRefs([refs.setFloating, ref]), [refs.setFloating, ref]);
|
|
41
41
|
useClientLayoutEffect(() => {
|
|
42
42
|
if (!refs.reference.current || !refs.floating.current || !open)
|
|
43
43
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../src/popover/Popover.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EACL,KAAK,IAAI,OAAO,EAChB,UAAU,EACV,IAAI,EACJ,MAAM,IAAI,QAAQ,EAClB,KAAK,EACL,QAAQ,EACR,UAAU,EACV,WAAW,EACX,eAAe,GAChB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EACZ,UAAU,EAEV,WAAW,EACX,OAAO,EACP,MAAM,GACP,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,IAAI,CAAC;AAC/B,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAClE,OAAO,cAAsC,MAAM,kBAAkB,CAAC;AA8DtE,MAAM,CAAC,MAAM,OAAO,GAAG,UAAU,CAC/B,CACE,EAWC,EACD,GAAG,EACH,EAAE;QAbF,EACE,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,KAAK,GAAG,IAAI,EACZ,IAAI,EACJ,OAAO,EACP,SAAS,GAAG,KAAK,EACjB,MAAM,EACN,QAAQ,EAAE,YAAY,GAAG,UAAU,OAEpC,EADI,IAAI,cAVT,oGAWC,CADQ;IAIT,MAAM,QAAQ,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAErD,MAAM,EACJ,CAAC,EACD,CAAC,EACD,
|
|
1
|
+
{"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../src/popover/Popover.tsx"],"names":[],"mappings":"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"}
|
package/esm/tooltip/Tooltip.js
CHANGED
|
@@ -20,7 +20,7 @@ export const Tooltip = forwardRef((_a, ref) => {
|
|
|
20
20
|
const [open, setOpen] = useState(defaultOpen);
|
|
21
21
|
const arrowRef = useRef(null);
|
|
22
22
|
const rootElement = (_b = useProvider()) === null || _b === void 0 ? void 0 : _b.rootElement;
|
|
23
|
-
const { x, y,
|
|
23
|
+
const { x, y, strategy, context, placement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {}, hide: { referenceHidden } = {}, }, refs, } = useFloating({
|
|
24
24
|
placement: _placement,
|
|
25
25
|
open: userOpen !== null && userOpen !== void 0 ? userOpen : open,
|
|
26
26
|
onOpenChange: setOpen,
|
|
@@ -38,8 +38,8 @@ export const Tooltip = forwardRef((_a, ref) => {
|
|
|
38
38
|
useDismiss(context),
|
|
39
39
|
]);
|
|
40
40
|
const ariaId = useId(id);
|
|
41
|
-
const mergedRef = useMemo(() => mergeRefs([ref,
|
|
42
|
-
const childMergedRef = useMemo(() => mergeRefs([children.ref,
|
|
41
|
+
const mergedRef = useMemo(() => mergeRefs([ref, refs.setFloating]), [refs.setFloating, ref]);
|
|
42
|
+
const childMergedRef = useMemo(() => mergeRefs([children.ref, refs.setReference]), [children, refs.setReference]);
|
|
43
43
|
if (!children ||
|
|
44
44
|
(children === null || children === void 0 ? void 0 : children.type) === React.Fragment ||
|
|
45
45
|
children === React.Fragment) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/tooltip/Tooltip.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EACL,KAAK,IAAI,OAAO,EAChB,UAAU,EACV,IAAI,EACJ,cAAc,EACd,MAAM,EACN,WAAW,EACX,KAAK,EACL,UAAU,EACV,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,eAAe,GAChB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EACZ,YAAY,EACZ,UAAU,EAEV,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AACzC,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAqD3C,MAAM,CAAC,MAAM,OAAO,GAAG,UAAU,CAC/B,CACE,EAcC,EACD,GAAG,EACH,EAAE;;QAhBF,EACE,QAAQ,EACR,SAAS,EACT,KAAK,EAAE,MAAM,GAAG,IAAI,EACpB,SAAS,EAAE,UAAU,GAAG,KAAK,EAC7B,IAAI,EAAE,QAAQ,EACd,WAAW,GAAG,KAAK,EACnB,MAAM,EAAE,OAAO,EACf,OAAO,EACP,KAAK,GAAG,GAAG,EACX,EAAE,EACF,IAAI,EACJ,OAAO,GAAG,EAAE,OAEb,EADI,IAAI,cAbT,6HAcC,CADQ;IAIT,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,CAAC;IAC9C,MAAM,QAAQ,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACrD,MAAM,WAAW,GAAG,MAAA,WAAW,EAAE,0CAAE,WAAW,CAAC;IAE/C,MAAM,EACJ,CAAC,EACD,CAAC,EACD,
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/tooltip/Tooltip.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": "3.
|
|
3
|
+
"version": "3.3.0",
|
|
4
4
|
"description": "Aksel react-components for NAV designsystem",
|
|
5
5
|
"author": "Aksel | NAV designsystem team",
|
|
6
6
|
"license": "MIT",
|
|
@@ -37,8 +37,8 @@
|
|
|
37
37
|
"test": "TZ=UTC jest"
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"@floating-ui/react": "0.
|
|
41
|
-
"@navikt/aksel-icons": "^3.
|
|
40
|
+
"@floating-ui/react": "0.24.1",
|
|
41
|
+
"@navikt/aksel-icons": "^3.3.0",
|
|
42
42
|
"@radix-ui/react-tabs": "1.0.0",
|
|
43
43
|
"@radix-ui/react-toggle-group": "1.0.0",
|
|
44
44
|
"clsx": "^1.2.1",
|
|
@@ -67,6 +67,10 @@ export interface SearchProps
|
|
|
67
67
|
* @default "primary"
|
|
68
68
|
*/
|
|
69
69
|
variant?: "primary" | "secondary" | "simple";
|
|
70
|
+
/**
|
|
71
|
+
* Exposes the HTML size attribute
|
|
72
|
+
*/
|
|
73
|
+
htmlSize?: number | string;
|
|
70
74
|
}
|
|
71
75
|
|
|
72
76
|
interface SearchComponent
|
|
@@ -112,6 +116,7 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
112
116
|
defaultValue,
|
|
113
117
|
onChange,
|
|
114
118
|
onSearchClick,
|
|
119
|
+
htmlSize,
|
|
115
120
|
...rest
|
|
116
121
|
} = props;
|
|
117
122
|
|
|
@@ -164,9 +169,11 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
164
169
|
"navds-form-field",
|
|
165
170
|
`navds-form-field--${size}`,
|
|
166
171
|
"navds-search",
|
|
172
|
+
|
|
167
173
|
{
|
|
168
174
|
"navds-search--error": hasError,
|
|
169
175
|
"navds-search--disabled": !!inputProps.disabled,
|
|
176
|
+
"navds-search--with-size": !!htmlSize,
|
|
170
177
|
}
|
|
171
178
|
)}
|
|
172
179
|
>
|
|
@@ -215,6 +222,7 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
215
222
|
"navds-body-short",
|
|
216
223
|
`navds-body-${size}`
|
|
217
224
|
)}
|
|
225
|
+
{...(htmlSize ? { size: Number(htmlSize) } : {})}
|
|
218
226
|
/>
|
|
219
227
|
{(value ?? internalValue) && clearButton && (
|
|
220
228
|
<button
|
|
@@ -164,3 +164,28 @@ export const NoClearButton = () => (
|
|
|
164
164
|
/>
|
|
165
165
|
</div>
|
|
166
166
|
);
|
|
167
|
+
|
|
168
|
+
export const HtmlSize = () => (
|
|
169
|
+
<div className="colgap">
|
|
170
|
+
<Search
|
|
171
|
+
label="Lorem ipsum dolor sit amet"
|
|
172
|
+
description="Saepe laborum delectus officia perferendis quaerat excepturi possimus hic enim dicta assumenda."
|
|
173
|
+
hideLabel={false}
|
|
174
|
+
htmlSize="20"
|
|
175
|
+
/>
|
|
176
|
+
<Search
|
|
177
|
+
label="Lorem ipsum dolor sit amet"
|
|
178
|
+
description="Saepe laborum delectus officia perferendis quaerat excepturi possimus hic enim dicta assumenda."
|
|
179
|
+
hideLabel={false}
|
|
180
|
+
htmlSize="20"
|
|
181
|
+
variant="secondary"
|
|
182
|
+
/>
|
|
183
|
+
<Search
|
|
184
|
+
label="Lorem ipsum dolor sit amet"
|
|
185
|
+
description="Saepe laborum delectus officia perferendis quaerat excepturi possimus hic enim dicta assumenda."
|
|
186
|
+
hideLabel={false}
|
|
187
|
+
htmlSize="20"
|
|
188
|
+
variant="simple"
|
|
189
|
+
/>
|
|
190
|
+
</div>
|
|
191
|
+
);
|
package/src/popover/Popover.tsx
CHANGED
|
@@ -102,8 +102,6 @@ export const Popover = forwardRef<HTMLDivElement, PopoverProps>(
|
|
|
102
102
|
const {
|
|
103
103
|
x,
|
|
104
104
|
y,
|
|
105
|
-
reference,
|
|
106
|
-
floating,
|
|
107
105
|
strategy,
|
|
108
106
|
context,
|
|
109
107
|
update,
|
|
@@ -129,12 +127,12 @@ export const Popover = forwardRef<HTMLDivElement, PopoverProps>(
|
|
|
129
127
|
]);
|
|
130
128
|
|
|
131
129
|
useClientLayoutEffect(() => {
|
|
132
|
-
|
|
130
|
+
refs.setReference(anchorEl);
|
|
133
131
|
}, [anchorEl]);
|
|
134
132
|
|
|
135
133
|
const floatingRef = useMemo(
|
|
136
|
-
() => mergeRefs([
|
|
137
|
-
[
|
|
134
|
+
() => mergeRefs([refs.setFloating, ref]),
|
|
135
|
+
[refs.setFloating, ref]
|
|
138
136
|
);
|
|
139
137
|
|
|
140
138
|
useClientLayoutEffect(() => {
|
package/src/tooltip/Tooltip.tsx
CHANGED
|
@@ -101,8 +101,6 @@ export const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(
|
|
|
101
101
|
const {
|
|
102
102
|
x,
|
|
103
103
|
y,
|
|
104
|
-
reference,
|
|
105
|
-
floating,
|
|
106
104
|
strategy,
|
|
107
105
|
context,
|
|
108
106
|
placement,
|
|
@@ -110,6 +108,7 @@ export const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(
|
|
|
110
108
|
arrow: { x: arrowX, y: arrowY } = {},
|
|
111
109
|
hide: { referenceHidden } = {},
|
|
112
110
|
},
|
|
111
|
+
refs,
|
|
113
112
|
} = useFloating({
|
|
114
113
|
placement: _placement,
|
|
115
114
|
open: userOpen ?? open,
|
|
@@ -132,12 +131,12 @@ export const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(
|
|
|
132
131
|
const ariaId = useId(id);
|
|
133
132
|
|
|
134
133
|
const mergedRef = useMemo(
|
|
135
|
-
() => mergeRefs([ref,
|
|
136
|
-
[
|
|
134
|
+
() => mergeRefs([ref, refs.setFloating]),
|
|
135
|
+
[refs.setFloating, ref]
|
|
137
136
|
);
|
|
138
137
|
const childMergedRef = useMemo(
|
|
139
|
-
() => mergeRefs([(children as any).ref,
|
|
140
|
-
[children,
|
|
138
|
+
() => mergeRefs([(children as any).ref, refs.setReference]),
|
|
139
|
+
[children, refs.setReference]
|
|
141
140
|
);
|
|
142
141
|
|
|
143
142
|
if (
|